@charset "UTF-8";
/*	
	TYPE : Feuille de style CSS
	SITE : Bout d'Brousse
	URL: http://www.boutdbrousse.ch
	DATE : 20 juin 2009
	AUTEUR : Fabien Rime (webmaster@boutdbrousse.ch)
*/

/* Rappel pour les propiétés multiples :
	exemple margin:1px 2px 3px 4px => margin:TOP RIGHT BOTTOM LEFT;
*/

/* Rappel pour les couleurs utilisées :
	Vert : #c9dd0a;
	Bleu : #12355d;
*/
/* ********************************************************************************************************************** */
/* PARAMETRES PAR DEFAUT */
/* ********************************************************************************************************************** */
/* Suppression des paramètres de marges et espacements par défaut pour les différents navigateurs */
* {
	margin:0;
	padding:0;
	font-size:11px; /* Taille du texte par défaut */
	font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,Arial,sans-serif; /* Police par défaut */
	color:#12355d; /* Couleur par défaut du texte = bleu foncé */
}
/* Supprime par défaut la bordure des images, si par exemple inclue dans un lien... */
img {
	border:0;
}
/* Couleur et decoration du texte par défaut des liens */
a:link, a:visited {
	color:#12355d; text-decoration:underline;
}
/* Couleur et decoration du texte par défaut des liens survolés */
a:hover {
	color:#fff; text-decoration:underline;
}

/* ********************************************************************************************************************** */
/* CORPS DE PAGE */
/* ********************************************************************************************************************** */
/* Paramètres pour BODY */
body {
	/* Uniquement pour centrage du site sous IE 5.x. Le texte est ensuite aligné à gauche (valeur par défaut) dans le sélecteur #ContainerSite */
	text-align:center;
	background:url(../img/site/body-bg-degrade.png);
	background-position:top;
	background-repeat:repeat-x;
	background-color:#badae6;

}

/* ********************************************************************************************************************** */
/* CONTENEUR DU SITE */
/* ********************************************************************************************************************** */
/* Paramètres du conteneur principal du site */
#ContainerSite { 
	margin:0 auto; /* Marges auto pour permettre le centrage au sein du navigateur */
	width:847px;
	text-align:left; /* Annule le paramètre text-align:center; passé dans Body pour le centrage */
}
 
/* ********************************************************************************************************************** */
/* CONTENEUR D'EN-TETE */
/* ********************************************************************************************************************** */
/* Paramètres du bandeau horizontal haut */
#BandeauHaut {
	height:110px;
	background:url(../img/site/site-banniere-haut.png);
	background-position:bottom center;
	background-repeat:no-repeat;
}

/* ********************************************************************************************************************** */
/* CONTENEUR DU MENU PRINCIPAL EN HAUT & PARAMETRES DU MENU HORIZONTAL */
/* ********************************************************************************************************************** */
/* DIV conteneur du menu principal */
#ContainerMenu {
	width:827px;
	height:50px;
	background:url(../img/site/site-bg-deg.png);
	background-repeat:repeat-y;
	background-position:center;
	padding-left:20px;
	
}

/* Elements CSS pour le menu horizontal // Les ID et Class sont liés au fichiers JavaScript menu.js et jquery.js */
	#Nav {
		list-style: none;
		position:absolute;
	}
	#Nav li {
		width: 113px;
		height:25px;
		background-color:#23538a;
		float: left;
		padding-left:20px;
		line-height:19px;
		border-top:1px solid #23538a;
		border-bottom:1px solid #23538a;
	}
	#Nav li a {
		display: block;
		color:#c9dd0a;
		text-decoration: none;	
		margin:0;
		padding:3px;
		font-weight:bold;
		font-size:12px;
	}
	#Nav li a:hover,#Nav li a:active {
		display: block;
		color:#c9dd0a;
		text-decoration:underline;
	}
	.Menu {
		padding: 0;
		list-style: none;
		display: none;
		background-color:#fff;
	}
	
/* ********************************************************************************************************************** */
/* CONTENEUR POUR LES CONTENUS EXTERNES / GOOGLE MAPS / ADDTHIS */
/* ********************************************************************************************************************** */
/* DIV conteneur du bouton AddThis Social Bookmark */
#AddThis {
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	margin-top:10px;
	padding:5px 4px 5px 4px;
}

/* DIV conteneur du login */
#Login {
	border-bottom:1px solid #fff;
	margin-top:10px;
	padding:5px 4px 5px 4px;
}
		
/* ********************************************************************************************************************** */
/* CONTENEUR PRINCIPAL DE CONTENU */
/* ********************************************************************************************************************** */
#ContainerContent {
	width:847px;
	background:url(../img/site/site-bg-deg.png);
	background-repeat:repeat-y;
	background-position:center;
}

/* ********************************************************************************************************************** */
/* CONTENEUR DE GAUCHE POUR CONTENU */
/* ********************************************************************************************************************** */
/* Paramètres de la colonne centrale */
#ContentGauche {
	margin:0px 270px 0px 30px;
	min-height:400px;
}

/* ********************************************************************************************************************** */
/* PROPRIETES DES BALISES TEXTES POUR LE CONTENU */
/* ********************************************************************************************************************** */

	/* TOUTES LES PAGES */
	/* ****************************************************************************************************************** */
		/* Titre principal des pages (toutes les pages) */
		h1.PageTitre {
			width:100%;
			font-size:16px;
			font-weight:bold;
			margin-bottom:15px;
			border-bottom:2px solid #fff;
		}
		/* Paragraphes généraux */
		p.txt {
			font-size:11px;
			margin:0px 10px 10px 10px;
			text-align:justify;
		}
		/* Sous-titres généraux des pages */
		h2.PageSTitre {
			width:100%;
			font-size:13px;
			font-weight:bold;
			margin:0px 0px 10px 10px;			
		}
		
	
	/* PAGE INDEX */
	/* ****************************************************************************************************************** */
		/* Sous-Titre principal des pages (toutes les pages) */
		h2.DayTitre {
			font-size:14px;
			font-weight:bold;
			margin-bottom:10px;
			border-bottom:2px dotted #fff;
			padding-left:5px;
		}
		/* Div contenant les informations des artistes (txt et img) dans la homepage */
		.ArtistePresentation {
			width:98%;
			min-height:80px;
			
			border-bottom:1px dotted #fff;
			padding-left:10px;
			padding-top:10px;
			padding-bottom:10px;
			margin-bottom:20px;
		}
		/* Miniature du groupe sur la gauche du DIV */
		.ArtisteMiniature {
			float:left;
			border:1px solid #23538a;
			margin-right:10px;
			margin-bottom:20px;
		}
		/* Nom de l'artiste */	
		h3.ArtisteNom {
			font-size:12px;
			font-weight:bold;
			margin-bottom:5px;
		}
		/* Texte de résumé des groupes */
		.ArtistePresentation p {
			font-size:11px;
			font-weight:normal;
			margin:0px 5px 10px 5px;
			text-align:justify;
		}
		/* Liens vers la page officiel de l'artiste / groupe */
		.ArtistePresentation a:link, .ArtistePresentation a:visited {
			font-size:11px; text-decoration:underline;
		}
		.ArtistePresentation a:hover {
			color:#fff;
		}
	
	/* PAGE PLAN D'ACCES */
	/* ****************************************************************************************************************** */
		/* DIV conteneur de la carte Google */
		#map {
			border:1px solid #23538a;
		}
		/* DIV conteneur de l'itinéraire en voiture */
		#Itineraire {
			width:100%;
			border-bottom:1px dotted #fff;
			padding-top:10px;
			padding-bottom:10px;
			margin-bottom:10px;
		}
		/* Titre */	
		h2.ItineraireTitre {
			font-size:12px;
			font-weight:bold;
			margin-bottom:5px;
		}
		/* DIV conteneur de l'API Google Maps */
		#GoogleMaps {
			padding:5px 0px 20px 74px;
			border-bottom:1px dotted #fff;
		}

	/* PAGE STAFF et FORMULAIRE D'INSCRIPTION STAFF */
	/* ****************************************************************************************************************** */
		.FormStaffLeft {
			width:170px;
			float:left;
			margin-left:10px;
		}
		.FormStaffRight {
			width:150px;
			float:left;
			margin-right:190px;
		}
		.FormStaffBottom {
			width:auto;
			float:left;
		}
		p.form-label {
			font-size:11px;
			margin:3px 0px 1px 0px;
		}

	/* PAGE CONTACT */
	/* ****************************************************************************************************************** */		
		/* Div contenant le formulaire de contact */
		#ContactForm {
			margin-left:10px;
			width:400px;
		}
	
	/* PAGE HISTORIQUE */
	/* ****************************************************************************************************************** */		
		/* Div contenant les paragraphes de l'historique / 1 DIV par année */
		.HistoriquePresentation {
			width:100%;			
			padding-top:10px;
			padding-bottom:10px;
			margin-bottom:20px;
		}
		/* Titre => Année */	
		h2.HistoriqueAnnee {
			font-size:14px;
			font-weight:bold;
			margin-bottom:10px;
			border-bottom:2px dotted #fff;
			padding-left:5px;
		}

		/* Texte */
		.HistoriquePresentation p {
			font-size:11px;
			font-weight:normal;
			margin:0px 5px 10px 5px;
			text-align:justify;
		}

	/* PAGE HISTORIQUE */
	/* ****************************************************************************************************************** */		
		/* DIV de gauche pour le pressbook, le DIV #Pressbook Right n'as pas besoin de CSS */
		#Pressbook {
			margin-left:150px;
			margin-right:30px;
			float:left;
		}
		/* Logo du Pressbook */
		#Pressbook img, #PressbookRight img {
			border:1px solid #23538a;
		}
	/* PAGE COMITE */
	/* ****************************************************************************************************************** */		
	
	/* en attente */
	
	/* PAGE GALERIES IMAGES */
	/* ****************************************************************************************************************** */		
		/* Le DIV remplace les DIV ColGauche et Droite, pour afficher les galeries sur toute la largeur de la page */
		#ContentGallery {
			margin:0px 40px 0px 30px;
			min-height:400px;
		}
		/* Titre des galeries et vidéos */
		h2.GalerieAnnee, h2.VideosAnnee {
			font-size:14px;
			font-weight:bold;
			margin-bottom:10px;
			border-bottom:2px dotted #fff;
			padding-left:5px;
		}
		/* 	DIV contenant l'import du fichier flash pour les galleries. Chaque DIV doit posséder un nom différent pour
			permettre le chargement correct du swf. */
		#SWFFest08, #SWFStaff09 {
			width:100%;
			padding-left:15px;
			min-height:370px;
			padding-right:15px;
		}
		
	/* PAGE GALERIES IMAGES */
	/* ****************************************************************************************************************** */		
		#ContainerGallery {
			margin:0 auto;
			height:95%;
			width:95%;
			background-color:#000;
			border:1px solid #eee;
		}
		#ContainerGallery h1 {
			color:#eee;	
		}
		
	
	
	
	
	
	/* PAGE DES SPONSORS */
	/* ****************************************************************************************************************** */		
		/* Div contenant chaque présentation de sponsors */
		.SponsorsPresentation {
			width:100%;
			min-height:150px;
			border-bottom:1px dotted #fff;
			padding-top:10px;
			padding-bottom:10px;
			margin-bottom:20px;
		}
		/* Miniature du logo du sponsors sur la gauche du DIV */
		.SponsorsMiniature {
			float:left;
			border-right:1px solid #23538a;
			margin-right:20px;
			margin-left:10px;
			margin-bottom:20px;
		}
		/* Nom du sponsors */	
		h2.SponsorsPrincipal {
			font-size:12px;
			font-weight:bold;
			margin-bottom:10px;
		}
		/* Nom du sponsors */	
		h3.SponsorsNom {
			font-size:12px;
			font-weight:bold;
			margin-bottom:5px;
		}
		/* Texte de résumé des groupes */
		.SponsorsPresentation p {
			font-size:11px;
			font-weight:normal;
			margin:0px 5px 10px 5px;
			text-align:justify;
		}
		/* Liens vers la page officiel de l'artiste / groupe */
		.SponsorsLien a:link, .SponsorsLien a:visited {
			font-size:11px; text-decoration:underline;
		}
		.SponsorsLien a:hover {
			color:#fff;
		}
	/* PAGE DES AMIS DU BDB */
	/* ****************************************************************************************************************** */		
		.AmisBdBLeft {
			margin-left:20px;
			margin-right:10px;
			width:230px;
			border-right:1px dotted #fff;
		}
		.AmisBdBRight {
			float:left;
			width:230px;
			margin-right:35px;
		}
		.AmisBdBLeft li, .AmisBdBRight li {
			list-style-type:square;
			margin-bottom:5px;
		}
/* ********************************************************************************************************************** */
/* CONTENEUR DE DROITE POUR CONTENU */
/* ********************************************************************************************************************** */
/* Paramètres de la colonne de droite */
#ContentDroite {
	float:right; /* Cet élément doit précéder dans le code source tout élément à côté duquel il doit être positionné */
	margin:0px 40px 0px 0px;
	width:210px; /* cet élément est flottant, il faut donc lui attribuer une largeur */
}
/* Titre principal de la colonne droite (toutes les pages) */
	h1.NewsTitre {
		width:100%;
		font-size:16px;
		font-weight:bold;
		margin-bottom:15px;
		border-bottom:2px solid #fff;
	}
/* ********************************************************************************************************************** */
/* CONTENEUR DE LA PAGE COMITE */
/* ********************************************************************************************************************** */

	/* Paramètres pour le bandeau des sponsors */
	#ComiteList {
		margin:20px 0px 0px 60px;
	}
	#ComiteList li {
		list-style-type:disc;
		margin-bottom:10px;
	}
	.ComiteName {
		font-size:12px;
		font-weight:bold;	
	}

/* ********************************************************************************************************************** */
/* CONTENEUR DES SPONSORS PRINCIPAUX */
/* ********************************************************************************************************************** */
/* Paramètres du bandeau horizontal pr logos sponsors */
#BandeauSponsors {
	width:847px;
}
	/* Paramètres pour le bandeau des sponsors */
	#MainSponsorsList {
		border-top:1px solid #fff;
		border-bottom:1px solid #fff;
		padding:2px 0px 2px 0px;
		height:25px;
		margin:0px 40px 0px 30px;
	}
	#MainSponsorsList li {
		list-style-type:none;
		display:inline;
	}
	.LogoSponsorsList {
		border:0; /* balise img des logos sponsors dans le bandeau bas - border:0; pour éviter les bordures auto des liens images... */
	}

/* ********************************************************************************************************************** */
/* CONTENEUR DU PIED DE PAGE */
/* ********************************************************************************************************************** */
/* Paramètres du bandeau horizontal bas */
#BandeauFooter { 
	width:847px;
	height:40px;
	background:url(../img/site/site-bg-footer.png);
	background-repeat:no-repeat;
	background-position:top;
} 
#BandeauFooter p {
	padding-top:10px;
	font-size:9px;
	text-align:center;
}
.PoweredBy:link, .PoweredBy:visited {
	font-size:9px; text-decoration:none;
}
.PoweredBy:hover {
	font-size:9px; text-decoration:underline;
}
/* ********************************************************************************************************************** */
/* DIVERS PROPRIETES NECESSAIRES POUR LE PLACEMENT D'ELEMENTS */
/* ********************************************************************************************************************** */
/* cette classe permet de rendre flottant le côté droit d'un élément dans la page. L'élément flottant doit précéder l'élément à côté duquel il doit se trouver dans la page. */
.fltrt {float: right; margin-left: 8px;}
 /* cette classe permet de rendre un élément flottant à gauche de la page. L'élément flottant doit précéder celui à côté duquel il doit apparaître dans la page. */
.fltlft {float: left;margin-right: 8px;}
/* cette classe doit être placée pour un élément div ou break et doit être l'élément final avant la balise de fin d'un conteneur qui doit contenir entièrement des éléments flottants */
.clearfloat {clear:both;height:0;font-size: 1px;line-height: 0px;}