/********************************************************
CSS pour le site de Centre Expression
Création du css : Martin Durette
Date : Septembre 2010
Une réalisation de Sirocco Communication
********************************************************/

@font-face {
    font-family: 'helvetica_blackregular';
    src: url('../polices/helvetica-black-webfont.woff2') format('woff2'),
         url('../polices/helvetica-black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

/********************************************************
	Styles de base 
********************************************************/
	body{margin:0; padding:0; font-family:Arial, Verdana, Geneva, sans-serif; font-size:12px}
	a{outline:none}
	
	/* Classes */
	.clear{clear:both}
	
	#contenant{margin:0 auto; padding:0; width:950px;}
	.img-right{float:right; margin:0 0 15px 15px}
	.img-left{float:left; margin:0 15px 15px 0}

td {vertical-align: top; padding-top: 6px;}



/********************************************************
	Accueil
********************************************************/
	#header-accueil{margin:0; width:950px; height:450px;}
	#header-banner{position:absolute; margin:0; width:670px; height:450px; z-index:2}
	#logo-accueil{position:absolute; margin:30px 0 0 0; height:70px; width:300px; z-index:3}

	#menu-accueil{position:absolute; margin:0 0 0 680px; padding:230px 0 0 0; height:220px; width:270px; background:#000000; z-index:2}
		#menu-accueil img{border:none}
	#sousmenu-accueil{position:absolute; margin:230px 0 0 0; width:650px; padding:6px 15px 6px 0; background:#ffffff; z-index:3; text-align:right}

	#info1{float:left; border:5px solid #F1F2F2; padding:15px; width:290px; height:320px; margin:0}
		#info1 h3{margin:0; padding:0}
		#info1 p{color:#4D4D4F}
		#info1 a { color:#4D4D4F; }

	#info2{float:left; border:5px solid #F1F2F2; padding:15px; width:290px; height:320px; margin:0 0 0 10px}
		#info2 h3{margin:0; padding:0}
		#info2 p{color:#4D4D4F}
		#info2-facebook{position:absolute; margin:-69px 0 0 173px; border:1px solid #000; height:50px; width:25px; z-index:20}
		#info2 a { color:#4D4D4F; }
	
	#info3{float:left; border:5px solid #F1F2F2; padding:15px; width:290px; height:320px; margin:4px 0 0 0}
		#info3 h3{margin:0; padding:0}
		#info3 p{color:#4D4D4F}
		#info3 a { color:#4D4D4F; }
	
	#info4{float:left; border:5px solid #F1F2F2; padding:15px; width:290px; height:320px; margin:4px 0 0 10px}
		#info4 h3{margin:0; padding:0}
		#info4 p{color:#4D4D4F}
		#info4-facebook{position:absolute; margin:-69px 0 0 173px; border:1px solid #000; height:50px; width:25px; z-index:20}
		#info4 a { color:#4D4D4F; }
	
	.ajout {float: left; margin-top: 20px; width: 630px; padding: 15px; border: 5px solid #F1F2F2; }
		.ajout h3{margin: 0; padding: 0; color: #4D4D4F; text-transform: uppercase;}
		.ajout p{color: #4D4D4F; }
		.ajout ul {padding: 15px; }
		.ajout ul li{padding: 10px 10px 30px 10px; list-style-type:none; border-bottom: 2px dotted #F1F2F2; }
		.ajout img{float: left; margin: 0 12px 8px 0; border: 0;}


	.ajout2 {float: left; margin-top: 20px; width: 645px; padding: 0 0 0 15px; border: 5px solid #e1c6c6; background-color: #fff9f9; text-align: center;}
	.ajout2 h1 {font-weight: 700; line-height: 0px; font-size: 24px; letter-spacing: 5px; color: #990000;}
	.ajout2 h2 {font-weight: 900; line-height: 26px; font-size: 30px;}
	.ajout2 h3 {font-weight: 700; font-size: 16px;}

	.ajout3 {float: left; margin-top: 20px; width: 670px; padding: 0px; border: 0px solid #F1F2F2; }
		.ajout3 h3{margin: 0; padding: 0; color: #4D4D4F; }
		.ajout3 p{color: #4D4D4F; margin-left: 20px; font-weight: 400; line-height: 8px; font-size: 14px; }
		.ajout3 img{float: left; margin: 0; border: 0;}

a {color:#FBAA1B; text-decoration:none;}
a:hover{color:#FBAA1B; text-decoration:underline}

.ajout a, .breves a {color:#000000; text-decoration:underline;}
.breves	a:hover{text-decoration:none; color:#FBAA1B;}



/********************************************************
	Header
********************************************************/	
	#header{margin:0; width:950px; height:290px}	
	#banner{position:absolute; margin:70px 0 0 0; width:670px; height:230px; z-index:2}
		#img-banner{float:left; height:230px; width:227px}
		#desc-banner{float:left; height:200px; width:413px; padding:15px; background:#dbdbdb; color:#fff;}
			#desc-banner p{margin:0; padding:0; position:absolute; bottom:15px; color:#666}
	#logo{position:absolute; margin:0; height:70px; width:300px; z-index:3}
	#menu-page{position:absolute; margin:0 0 0 680px; padding:80px 0 0 0; height:220px; width:270px; background:#000000; z-index:2}
		#menu-page img{border:none}
	

/********************************************************
	Top
********************************************************/
	#top{margin:0; padding:5px 10px 5px 0; text-align:right; width:940px;}
		#top p{margin:0; padding:0;}
		#top p a{color:#000000; text-decoration:none; text-transform:uppercase}
		#top p a:hover{text-decoration:underline}


/********************************************************
	Main
********************************************************/
	#main{margin:20px 0 0 0; width:950px;position:relative; min-height:1288px;}
		#col{float:left; border:5px solid #F1F2F2; padding:20px; width:620px}
		#col-gauche{float:left; margin:0; padding:0; width:150px}
		#col-gauche2{float:left; margin:0; padding:0; width:294px}
		#col-gauche a{color: #FBAA18;}
		#col-droite{float:left; margin:0 0 0 10px; width:460px}
		#col-droite-borderleft{float:left; margin:0 0 0 10px; width:438px; border-left:1px solid #000; padding-left:20px}
		#col-droite-borderleft2{float:left; margin:0 0 0 10px; width:294px; border-left:1px solid #000; padding-left:20px}
		#col-centrale{float:left; margin:0; border:5px solid #F1F2F2; padding:20px; width:620px}
		
		#texte{margin:0; padding:0}
			#texte h1{font-size:1.6em; margin-top:0; padding-top:0; text-transform:uppercase; color:#58595B}
			#texte h2{font-size:1.6em; margin-top:0; padding-top:0; color:#FBAA1B}
			#texte h5{font-size:1.1em; margin:0; padding:0; color:#000000}
			#texte p{color:#000; line-height:130%}
			#texte a{color:#FBAA1B; text-decoration:underline}
			#texte a:hover{color:#000; text-decoration:underline}
			#texte p.date{margin-top:-10px; color:#58595B}
			#texte ul li{padding:5px 0 5px 0}
			#texte img {
				max-width:100%;
				height:auto;
			}
			
		#sidebar{position:absolute;top:0;right:0; width:270px; margin:0 0 0 10px;}
			#envoi{margin:0; padding:0 0 0 20px; width:250px}
			#envoi p{margin:0; padding:0; color:#000000}
			#envoi p strong{color:#939598; text-transform:uppercase; font-size:1.2em}
			#envoi input[type=text]{border:1px solid #C7C8CA; color:#939598; padding:3px 10px 3px 10px; font-size:1em; width:200px}
			#btn-membre{margin:10px 0 0 0; width:270px}
			
		ul.sousmenu-actif{margin:0 0 0 -10px; padding:0 0 10px 0; color:#000000; border-bottom:1px solid #000}
			ul.sousmenu-actif li{list-style:none; padding:3px 0 3px 0}
			ul.sousmenu-actif li a{display:block;text-decoration:none; color:#000000; background:url(/images/li.gif) no-repeat 0 3px; padding:0 0 0 15px}
			ul.sousmenu-actif li a:hover{text-decoration:none; font-weight:bold; color:#636466; background:url(/images/li-ov.gif) no-repeat 0 3px}
			
		ul.sousmenu-archive{margin:0 0 0 -10px; padding:10px 0 0 0; color:#000000;}
			ul.sousmenu-archive li{list-style:none; padding:3px 0 3px 0; color:#7D7E81}
			ul.sousmenu-archive li a{text-decoration:none; color:#7D7E81; padding:0 0 0 15px}
			ul.sousmenu-archive li a:hover{text-decoration:underline}
				ul.sousmenu-archive li ul{margin:0; padding:0 0 0 10px}



/********************************************************
	Footer
********************************************************/
	#footer{margin:10px 0 0 0; width:950px; border-top:10px solid #000000}
		#footer-left{float:left}
			#footer-left p{color:#636466; font-size:0.9em}
		#footer-right{float:right}
			#footer-right p{color:#636466; font-size:0.9em}
			#footer-right a{color:#636466; text-decoration:none}
			#footer-right a:hover{text-decoration:underline}



/********************************************************
	Menu
********************************************************/
	#menu1{margin:0; padding:0; width:270px;}
	#menu2{margin:26px 0 0 0; padding:0; width:270px;}
	.menu1 ul{list-style:none;font-family:Arial, sans-serif;font-size:11px;margin:0 0 0 0;padding:0;}
	.menu1 ul li{float:right;padding:0 0 0 0;display:block;margin:0px;color:#000;background-color:#ffffff;}
	.menu1 ul li div{display:block;overflow:hidden;	height:26px; width:270px; text-decoration:none;color:white;}
	.menu1 ul li img{z-index:100;display:block;border:none; float:right}
	.menu1 ul li p{margin:0;padding:0;width:650px;background:#fff; color:#000; float:right; text-align:right; padding:6px 25px 0 0; text-transform:uppercase}
		.menu1 ul li p a{color:#000; text-decoration:none; padding:0 5px 0 5px}
		.menu1 ul li p a:hover{color:#FBAA1B; text-decoration:underline}



sup, sub { font-size: .8em; font-variant: normal; line-height: 0; }


.acceuil #main a h2 {
	font-family:helvetica_blackregular;
	text-transform:uppercase;
	color:#4c4d4f;
	font-size:14pt;
	font-weight:normal;
}

.spip-admin-float {
	right:0px !important;
}

hr.spip {
	clear:both;
}

.spip_documents {
	max-width:100%;
	width:100%;
	height:auto;
}

.mini_capsule-video {
	overflow:hidden;
	padding-bottom:56.25%;
	position:relative;
	height:0;
}
.mini_capsule-video iframe{
	left:0;
	top:0;
	height:100%;
	width:100%;
	position:absolute;
}