/**
 * @properties : display, positioning, dimension, margin, padding, text, border, background.
 * @page : section defining properties of a page.
 * @bloc : section defining properties of a block to a specific page.
 */
/**************************************************************************************************/
/*			- DEFINITION DES ATTRIBUTS PAR DEFAUT -							 			  		  */
/**************************************************************************************************/

/* ------------------------------------------------------ */
/*			- corps du document -  			    	      */
/* ------------------------------------------------------ */
html, body { height: 100%; margin: 0 }
html body { color:#000; cursor: default }

/* ------------------------------------------------------ */
/*			- suppression des marges par défaut -  	      */
/* ------------------------------------------------------ */
div, span, object, iframe, 
h1, h2, h3, h4, h5, h6,
p, a, em, img, fieldset, strong, ol, ul, li, dl, dt, dd,
form, label, table, tr, th, td { margin:0; padding:0; font-weight:normal }
strong { font-weight:bold }
/* ------------------------------------------------------ */
/*			- redéfinition des liens par défaut -  	      */
/* ------------------------------------------------------ */
a img { border: 0 }
a:hover { cursor: pointer }
a:hover span { text-decoration: none }
a:focus { outline: none }

/* ------------------------------------------------------ */
/*			- redéfinition des listes/tableaux -  	      */
/* ------------------------------------------------------ */
ol, ul { padding: 0 }
ul { list-style: none }
ol { list-style-position: inside }
table { font-size: inherit; border-collapse:collapse; border-spacing:0 }

/**************************************************************************************************/
/*			- FIN RESET -							 			  		  */
/**************************************************************************************************/

body {	line-height: 16px; font-size: 13px; font-family: comic sans ms; background: #fff url(../images/charte/bodyBg.jpg) center top no-repeat }

/* ------------------------------------------------------ */
/*			- flashWrapper -  	      */
/* ------------------------------------------------------ */
#flashWrapper { position: absolute; top: 0; left: 0; overflow: hidden; width: 100%; height: 240px; z-index: 50 }
*html #flashWrapper
{
	width:110%;
}

/* ------------------------------------------------------ */
/*			- container -  	      */
/* ------------------------------------------------------ */
#container { position:relative; z-index: 100; min-height:100%; width:990px; margin:0 auto; padding:0 0 -110px 0; } 


/* ------------------------------------------------------ */
/*			- wrapper -  	      */
/* ------------------------------------------------------ */
#wrapper { width: 990px; background: url(../images/charte/contentBg.png) 0 0 repeat-y; } 

/* ------------------------------------------------------ */
/*			- header -  	      */
/* ------------------------------------------------------ */
#header { width:950px; height: 284px; padding: 45px 20px 0 20px; background: url(../images/charte/headerBg.png) left top no-repeat } 
#headerFlash { position:absolute; display:inline; width:990px; height:170px; /*obligatoire si il y a un flash (firefox)*/ display:block; outline:0; } 
#une { float: left; color: #707070; width: 390px; height: 195px; background: url(../images/charte/uneBg.png) 0 0 no-repeat }
#une .title { color: #005635; font-size: 13px; margin: 0 0 15px 0 }
#une .subtitle { color: #484c97; font-size: 13px }
#une #content { width: 355px; font-size: 12px; padding: 25px 15px 5px 15px; height: 120px }

#une #navButtons { height: 23px; }
*html #une #navButtons { margin-top:-30px; }
#navButtons .previous { display: block; float: left; margin: 0 5px 0 322px; width: 12px; height: 12px }
#navButtons .next { display: block; float: left; width: 12px; height: 12px }

#navButtons span { display: none }
#mainLogo { float: left; margin: 0 21px 0 0; width: 539px; height: 194px; background: url(../images/charte/mainLogo.png) 0 0 no-repeat  }
#headerBottom { margin: 50px 0 0 0; height: 30px; padding: 3px 0 3px 12px }
#headerBottom .title { float: left; padding: 4px 0 0 5px; width: 60px; }
#headerBottom .content { width: 427px; padding: 4px 0 0 0; float: left; font-style: italic; color: #055A3B }


/* ------------------------------------------------------ */
/*			- menu top -  	      */
/* ------------------------------------------------------ */
#menuTop { float: left; list-style:none; margin: 0 0 0 4px } 
#menuTop li { position:relative; float:left; text-align: center } 
#menuTop li a { display:block; color: #000; height: 24px; padding: 4px 0 0 0; background: url(../images/charte/topMenuBg.gif) 0 0 no-repeat }
#menuTop a.bt1 { width:96px; background-position: 0 -31px }
#menuTop a.bt2 { width:69px; background-position: -96px -31px }
#menuTop a.bt3 { width:97px; background-position: -164px -31px }
#menuTop a.bt4 { text-decoration: none; color: #fff; width: 170px; background-position: -261px -31px }
#menuTop a.bt1:hover { text-decoration: none; background-position: 0 0 }
#menuTop a.bt2:hover { text-decoration: none; background-position: -96px 0 }
#menuTop a.bt3:hover { text-decoration: none; background-position: -164px 0 }
#menuTop a.bt4:hover { color: #484c97; background-position: -261px 0 }

/* ------------------------------------------------------ */
/*			- colLeft -  	      */
/* ------------------------------------------------------ */
#colLeft { margin: 0 0 0 20px; float: left; display: inline; width: 190px }
#colLeft .logoEcole { height: 150px; width: 190px; background: url(../images/charte/logoEcole.jpg) no-repeat 0 0 }
#colLeft .menuEcole { height: 290px; width: 190px; background: url(../images/charte/menuLeft.jpg) no-repeat 0 0 }
#colLeft .menuEcole { padding: 20px 0 0 0; }
#colLeft .menuEcole li a { display: block; font-size: 12px; line-height: 22px; text-decoration: none; padding: 0 0 0 25px; font-weight: bold; color: #055A3B; height: 30px }
#colLeft .menuEcole li a:hover { color: #000 }
#colLeft .menuEcole li a.btn1:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -20px }
#colLeft .menuEcole li a.btn2:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -50px }
#colLeft .menuEcole li a.btn3:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -80px }
#colLeft .menuEcole li a.btn4:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -110px }
#colLeft .menuEcole li a.btn5:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -140px }
#colLeft .menuEcole li a.btn6:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -170px }
#colLeft .menuEcole li a.btn7:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -200px }
#colLeft .menuEcole li a.btn8:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -230px }
#colLeft .menuEcole li a.btn9:hover { background: url(../images/charte/menuLeft.jpg) no-repeat -190px -260px }
#colLeft .coordonnees { font-size: 12px; color: #055A3B; padding: 20px 0 0 0; text-align: center; height: 230px; background: url(../images/charte/coordsLeft.jpg) no-repeat 0 0 }
#colLeft .coordonnees a,
#colLeft .coordonnees a:hover { color: #055A3B; text-decoration: none }
#colLeft .coordonnees p { margin: 10px 0; }
.grey { color: #797979 }

/* ------------------------------------------------------ */
/*			- colRight -  	      */
/* ------------------------------------------------------ */
#colRight { float: left; display: inline; width: 190px }
#colRight .logoCollege { height: 150px; width: 190px; background: url(../images/charte/logoCollege.jpg) no-repeat 0 0 }
#colRight .menuCollege { height: 290px; width: 190px; background: url(../images/charte/menuRight.jpg) no-repeat 0 0 }
#colRight .menuCollege { padding: 20px 0 0 0; }
#colRight .menuCollege li a { display: block; font-size: 12px; line-height: 22px; text-decoration: none; padding: 0 0 0 25px; font-weight: bold; color: #ffe500; height: 30px }
#colRight .menuCollege li ul li a:hover {text-decoration:none; color:#CCC;}
#colRight .menuCollege li a:hover { color: #000 }
#colRight .menuCollege li a.btn1:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -20px }
#colRight .menuCollege li a.btn2:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -50px }
#colRight .menuCollege li a.btn3:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -80px }
#colRight .menuCollege li a.btn4:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -110px }
#colRight .menuCollege li a.btn5:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -140px }
#colRight .menuCollege li a.btn6:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -170px }
#colRight .menuCollege li a.btn7:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -200px }
#colRight .menuCollege li a.btn8:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -230px }
#colRight .menuCollege li a.btn9:hover { background: url(../images/charte/menuRight.jpg) no-repeat -190px -260px }
#colRight .coordonnees { font-size: 12px; color: #484c97; padding: 20px 0 0 0; text-align: center; height: 230px; background: url(../images/charte/coordsRight.jpg) no-repeat 0 0 }
#colRight .coordonnees a,
#colRight .coordonnees a:hover { color: #484c97; text-decoration: none }
#colRight .coordonnees p { margin: 10px 0; }
#colRight { color: #484c97 }

/* ------------------------------------------------------ */
/*			- footer -  	      */
/* ------------------------------------------------------ */
#footer { position:relative; clear:both; margin: -98px 0 0 0; width:100%; height:98px; background: url(../images/charte/footerBg.jpg) center bottom no-repeat; } 
#footer .content{	width:920px; margin:0 auto; } 
#footer p.links { margin: 50px 0 0 0; float: right; font-size:11px; color:#484c97 } 
#footer p.links a { text-decoration: none; color:#484c97; font-weight:bold; } 
#footer p.links a:hover { text-decoration: underline } 



/* ------------------------------------------------------ */
/*			- styles globaux -  	      */
/* ------------------------------------------------------ */
a img{ border:none; } 
a:active, 
a:focus{ outline:none; }
/*---obligatoire pour le footer---*/
/*---mettre <div class="clearer" id="clearFooter"></div>--*/
/*---apres la div contenu---*/
.clearer { clear:both }
#clearFooter { height:98px;/*--- = à la hauteur du footer ---*/ }
.spacer20 { height: 20px }

/* ------------------------------------------------------ */
/*			- contenu -  	      */
/* ------------------------------------------------------ */
#contenu { padding: 20px; float: left; position: relative; display: inline; width: 530px; }
#contenu h1 { color: #4f4e92; font-size: 15px }
#contenu h2 { color: #055A3B; font-size: 15px }
#contenu p { text-align:justify; margin: 0 0 15px 0; } 

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

#contenu .encartLeft { margin: 0 20px 0 0; float: left; width: 255px }
#contenu .encartLeft { color: #055A3B }
#contenu .encartLeft h5 { height: 30px; width: 255px; margin: 0 0 3px 0; background: url(../images/charte/ecoleTitle.gif) no-repeat 0 0 }
#contenu .encartLeft h5 span { display: none }

#contenu .encartRight { float: left; width: 255px }
#contenu .encartRight { color: #484c97 }
#contenu .encartRight h5 { height: 30px; width: 255px; margin: 0 0 3px 0; background: url(../images/charte/collegeTitle.gif) no-repeat 0 0 }
#contenu .encartRight h5 span { display: none }

/* ------------------------------------------------------ */
/*			- pathbar -  	      */
/* ------------------------------------------------------ */
#pathBar { font-size: 11px; margin: 0 0 15px 0; color: #99999b }
#pathBar a {  color: #005635; text-decoration: underline }
#pathBar .pageTitle {  color: #484c97 }

/* --- JOEL --- */
#btnAccueil
{
	width:550px;
	height:190px;
	position:absolute;
	top:45px;
	left:20px;
}

#btnAccueil a
{
	width:550px;
	height:190px;
	display:block;
}

.mail
{
	display:none;
}
/* --- end JOEL --- */