/**************** Feuille de style CSS pour le site de l'APCDSL *****************/
html {
	height: 100%; /* pour pouvoir étirer le senestre */
}
	body {
	height: 100%; /* pour pouvoir étirer le senestre */
	margin: 0 auto;
	padding: 0;
	border-width: 0;
	background-attachment: fixed;
	background-color: #eee; /* couleur de fond de toutes les pages du site */
/*	line-height: 140%;*/
/*	text-align: center;*/
/*	color: #a00; /* couleur de texte */
	font-size: 9pt;
	font-family: verdana,arial,helvetica,sans-serif;
	background-image: url("../img/f_enfants2.png");
}
/*TEXTURES DE FOND: http://www.grsites.com/textures/  */


/* couleur du texte des liens toujours la même */
a, a:link, a:active, a:visited {  /*  a:hover, */
	color: #090974;
}
/* un lien interne survolé: fond jaune */
a.interne:hover {
	background-color: yellow;
}
/* un lien externe survolé: fond blanc */
a.externe:hover {
	background-color: white;
}

img {
	border: none;
}

#map {
	width:500px;
	height:500px;
	margin: 12px auto;
	z-index: 5;
	border: 1px solid #090974;
}



/* ---------- contenant global ---------- */
#page {
/*	height: 100%;*/ /* pour pouvoir étirer le senestre */
	margin: 8px auto;
	padding: 0;
	width: 780px;
	background-color: #090974;
/*= COULEUR DU FOND DE LA PAGE =*/
/*	background-image: url("../images/fond_7.gif");*/
/*background-position: top left;*/
/*background-repeat: repeat;*/
	
/*	text-align: left;*/
	border: 2px solid #090974;  /* activer pour fins de débogage de largeur de page */
}
#pieddepage {
	clear: both;
	margin: 0 auto;
	padding: 2px 8px 2px 0;
	background-color: #090974; 
	color: #D2D2E5;
	font-size: 7pt;
	text-align: right;
	border-top: 1px solid white;
}

#entete {
	width: 100%;
	margin: 0 auto;
/*	padding: 12px 4px;*/
	padding: 12px 0px;
	text-align: center;
	line-height: 2em;
	background-color: #090974; /* =COULEUR1 = */
	background-image: url("../img/fond/fond2.png");
	background-repeat:repeat-x;
	background-position:bottom;
	color: #F6C272;
/*	border-bottom: 1px solid white;*/
	
/*	border: 1px solid red; /* DEBUG ONLY */
}
#entete h1 {font-size: 14pt; margin: 4px 0;}
#entete h2 {font-size: 11pt; margin: 4px 0;}
#entete h3 {font-size: 9pt; font-style: italic; margin: 4px 0;}
#entete p {font-size: 9pt;}

#entete img.logo {
	float: left;
	margin: 0 48px;
	border: none;
}

#marquise {
	margin: 0;
	padding: 2px;
	text-align: center;
	background-color: #090974; /* =COULEUR1 = */
	color: #D2D2E5; /* bleu pâle */
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	font-variant: small-caps;
	font-weight: bold;
	font-size: 8pt;
/*	letter-spacing: 0.05em;*/
}



#contenu {
/*	height:100%;*/ /* pour pouvoir étirer le senestre */
	border: 4px solid white;
	float: right;
	width: 602px;
	margin: 0px 7px 0 0;
	padding: 0;
	background-color: #FFFFFF;  /* DEBUG */
	color: #090974;
}
#contenu p,
#contenu ol,
#contenu ul,
#contenu dl,
#contenu pre {
	font-size: 9pt;
	line-height: 150%;
	margin-left: 2em;
	margin-right: 1em;
}
#contenu h1 {
	margin: 0 0 0 0;
	padding: 8px 4px;
	font-size: 12pt;
	color: #090974;
	border-bottom: 8px solid #090974;
}
#contenu h2 {
	margin: 24px 0 0 0;
	padding: 8px 4px;
	border-left: 16px solid #090974;
	border-top: 1px solid #090974;
	font-size: 11pt;
}
#contenu h3 {
	font-size: 10pt;
	border-bottom: 1px solid #D2D2E5;
}

#contenu dl dt {
	font-weight: bold;
	margin: 16px 0 0 0;
}


#menuv {
float: left;
width: 160px;
/*width: 12em;*/
	background-color: #090974; /* =COULEUR1 = */
/*	padding: 0 4px 4px 2px; /* 2px au lieu de 4px pour compenser la bordure de page qui fait 2px */
	padding: 0 2px 2px 0px; /* 2px au lieu de 4px pour compenser la bordure de page qui fait 2px */
	z-index: 10;
}

#menuv ul { /* pas de boulets aux items */
list-style: none;
margin: 0;
padding: 0;
}

#menuv a,
#menuv h2 {
font: bold 11px/16px arial, helvetica, sans-serif; /* feinte pour spécifier le calibre et l'interligne */
display: block;
margin: 0;
padding: 2px 3px;
}
	#menuv a {
		color: #090974;/*#FF7300; /* #A69700;*/
		background: #D2D2E5;/* #FFF273; /* =COULEUR3 = */
		text-decoration: none;
		border: 1px solid #090974;
	}
	#menuv h2 {
		color: #fff;
		background: #090974; /* =COULEUR1 FONCEE = */
		text-transform: uppercase;
	}
/* utilisé pour le lien webmestre */
#menuv a.discret {
	background-color: #6E6EAD;
}

#menuv a  img {
	border: none;
/*text-align: center;*/
	float: left;
	margin: 0 8px 0 2px;
}

#menuv a:hover {
color: #FFFFFF;
background: #A50000; /* #A69700;*/
}

#menuv a.choisi {
color: #090974;
background: #FFFFFF;
}

#menuv li {
position: relative;
	z-index: 10;
}

#menuv ul ul ul {
position: absolute;
top: 0;
left: 100%;
width: 100%;
	z-index: 10;
}

div#menuv ul ul ul,
div#menuv ul ul li:hover ul ul
{display: none;}

div#menuv ul ul li:hover ul,
div#menuv ul ul ul li:hover ul
{display: block;}

#repere {
/*	display: block;
	clear: both;*/
	left: 0;
	margin: 0px auto;
	padding: 2px;
/*	border-width: 1px 0px 0px 0px;   */ /* bordure en haut */
	border-width: 0px;  /* bordure en bas */ 
  	border-style: dotted;
	text-align: left;
	color: #090974;
	font-variant: small-caps;
	font-size: 8pt;
	letter-spacing: 0.05em;
	background-color: #D2D2E5;
}



/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.indexh,
.indexv {
	width: 100%;
	font-size: 9pt; /* il faut le préciser pour IE */
	font-family: verdana,arial,helvetica,sans-serif;
	font-weight: bold;
}

.indexh ul,
.indexv ul {
	margin: 0;
	padding: 0 0 6px 0; /*la margin-top à 0 fait coller la boîte au h1 souligné */
	text-align: center; /*set value to "left", "center", or "right"*/
	list-style: none;
}
	.indexv ul {
		text-align: left; /*set value to "left", "center", or "right"*/
	}

.indexh ul li {
	display: inline;
}
.indexv ul li {
	margin-top: 6px;
}




.indexh ul li a,
.indexv ul li a {
background-color: #D2D2E5; /* bleu pâle */
color: #090974;
padding: 4px; /*top padding is 6px, bottom padding is 4px*/
margin-left: 4px; /*spacing between each menu link*/
margin-right: 4px; /*spacing between each menu link*/
text-decoration: none;
border: 2px solid #090974; /*bottom border is 3px*/
	border-top: 0px;
}
	.indexv ul li a {
	padding: 0px 4px; /*top padding is 6px, bottom padding is 4px*/
	margin-left: 8px; /*spacing between each menu link*/
	margin-right: 0px; /*spacing between each menu link*/
	margin-bottom: 6px;
	border: 0px; /*bottom border is 3px*/
		border-left: 12px solid #090974; /*bottom border is 3px*/
		border-bottom: 1px solid #090974;

	}


.indexh ul li a:hover,
.indexh ul li a.selected {
	background-color: #090974;
	color: #FFFFFF;
}
.indexv ul li a:hover,
.indexv ul li a.selected {
	background-color: #090974;
	color: #FFFFFF;
}

/* #################### 
	Panneaux senestre et dextre    
 #################### */
#contenu .senestre,
#contenu .dextre {
/*width: 33%;
	float: right;
	margin: 0 0 10px 10px;*/
	padding: 0px;
	text-align: center; 
	line-height: 130%;
	font-size: 9pt; /* il faut le préciser pour IE afin que la propriété line-height s'y réfère */
/*	background-color: #FFC373;
	color: #A65F00;*/
/*	border-width: 4px;
	border-style: solid;*/
}
	#contenu .senestre {
		width: 30%;
	min-height:100%; /* pour pouvoir étirer le senestre */
		float: right;
		margin: 0 0 10px 10px;
		background-color: #D2D2E5;
	}
	#contenu .dextre {
		width: 66%;
		float: left;
		margin: 0 10px 10px 0;
	}
/*
#contenu .senestre h1,
#contenu .senestre h2,
#contenu .senestre h3,
#contenu .dextre h1,
#contenu .dextre h2,
#contenu .dextre h3 {
	margin: 0;
	padding: 2px 4px 4px;
	border: none;
	text-align: left;
}
#contenu .senestre h1,
#contenu .dextre h1 { font-size: 9pt;}
#contenu .senestre h2,
#contenu .dextre h2 {font-size: 8pt;}
#contenu .senestre p,
#contenu .dextre p {font-size: 7pt;}
*/

#contenu .fasce {
	margin: 16px auto;
	width: 96%;
	padding: 0px;
	font-size: 9pt; /* il faut le préciser pour IE afin que la propriété line-height s'y réfère */
/*	background-color: #DDDDDD;*/
	border: 2px solid;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;

}
#contenu .fasce h1,
#contenu .fasce h2,
#contenu .fasce h3,
#contenu .fasce p {
	margin: 0;
	padding: 4px;
	border: none;
}
#contenu .fasce h1 {/*background-color: #aaa;*/ /*color: #a00; */font-size: 12pt; text-align: left;}
#contenu .fasce h2 {font-size: 10pt;}
#contenu .fasce p {font-size: 9pt;}
#contenu .fasce ul li,
#contenu .fasce ol li {
	margin-top: 8px;
}

#contenu .fasce p.date {
	margin: 0 0 0 4px;
	padding: 0 0 2px 2px;
	width: 11em;
	float: right;
	text-align: center;
	font-size: 7pt;
}
/* #################### ####################
	Jeux de couleurs pour panneaux senestre et dextre   
	réf.: http://colorschemedesigner.com
 ######################################## */
/* ##### 0 degrés ##### */
#contenu .cw0l {
	background-color: #F9B0B0;
	color: #6D0303;
	border-color: #6D0303;
}
	#contenu .cw0l h1 {
	background-color: #6D0303;
	color: #F9B0B0;
	}
#contenu .cw0d {
	background-color: #6D0303;
	color: #F9B0B0;
	border-color: #F9B0B0;
}
	#contenu .cw0d h1 {
	background-color: #F9B0B0;
	color: #6D0303;
}
/* ##### 72 degrés ##### */
#contenu .cw72l {
	background-color: #F9E5B0;
	color: #6D5103;
	border-color: #6D5103;
}
	#contenu .cw72l h1 {
	background-color: #6D5103;
	color: #F9E5B0;
	}
#contenu .cw72d {
	background-color: #6D5103;
	color: #F9E5B0;
	border-color: #F9E5B0;
}
	#contenu .cw72d h1 {
	background-color: #F9E5B0;
	color: #6D5103;
}
/* ##### 72 degrés ##### */
/*
#contenu .cw72l {
	background-color: #FFDA73;
	color: #A67A00;
	border-color: #A67A00;
}
	#contenu .cw72l h1 {
	background-color: #A67A00;
	color: #FFDA73;
	}
#contenu .cw72d {
	background-color: #A67A00;
	color: #FFDA73;
	border-color: #FFDA73;
}
	#contenu .cw72d h1 {
	background-color: #FFDA73;
	color: #A67A00;
}
*/
/* ##### 144 degrés ##### */
#contenu .cw144l {
	background-color: #E2F6AE;
	color: #4C6703;
	border-color: #4C6703;
}
	#contenu .cw144l h1 {
	background-color: #4C6703;
	color: #E2F6AE;
	}
#contenu .cw144d {
	background-color: #4C6703;
	color: #E2F6AE;
	border-color: #E2F6AE;
}
	#contenu .cw144d h1 {
	background-color: #E2F6AE;
	color: #4C6703;
}
/* ##### 216 degrés ##### */
#contenu .cw216l {
	background-color: #39AECF;
	color: #025167;
	border-color: #025167;
}
	#contenu .cw216l h1 {
	background-color: #025167;
	color: #39AECF;
	}
#contenu .cw216d {
	background-color: #025167;
	color: #39AECF;
	border-color: #39AECF;
}
	#contenu .cw216d h1 {
	background-color: #39AECF;
	color: #025167;
}


.tab1 { 	margin-left: 5em; }
.tab2 { 	margin-left: 10em; }
.tab3 { 	margin-left: 15em; }

.capsule {
	margin: 4px 0;
	padding: 0;
	border-bottom: 2px solid #a00;
}

p.espaceur {
	clear: both;
	padding: 0;
	margin: 0;
}

.w20 { width: 20% !important; }
.w30 { width: 30% !important; }
.w40 { width: 40% !important; }
.w50 { width: 50% !important; }
.w75 { width: 75% !important; }

._centre { text-align: center; }
._gauche { text-align: left; }
._droite { text-align: right; }

img.w3clogo {
	float: left;
	border: none;
	margin: 8px 4px 4px 4px;
}

table {
	width: 75%;
	margin: 4px auto;
	border: 1px solid #090974; /* bleu foncé */
	font-size: 9pt; /* pour IE ... */

}
table tr  {
	margin: 2px;
}
table tr td  {
	padding: 4px;
/*	background-color: #D2D2E5; /* bleu pâle */
	text-align: center;
}

.prochaine {
	background-color: #FFFF99;
}

iframe {
	border: none;
}




/* tableau d'horaire et tableau de personnel*/
table.horaire,
table.personnel {
	display: table;
	width: 75%;
	margin: 0 auto;
	text-align: center;
	border: none;
	border-spacing: 2px;
	border-collapse: collapse;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;

/*	background-color: white;*/
}
table.horaire tr {
	border: 1px solid black;
	padding: 4px 8px;
	height: 24px;
}
table.horaire  tr td {
	border: 1px solid black;
	padding: 0 8px 0 8px;
}

table.personnel tr {
	border: 0px;
	padding: 4px 8px;
	text-align: left;
	vertical-align: top;
}
table.personnel tbody tr:hover {
	background-color: #FFFFCC;
/*	border: 1px solid red; /* DEBUG */
}

table.horaire thead {
	background-color: black;
	color: white;
	font-weight: bold;
}
.txtc {
	text-align: center;
}
.txtd {
	text-align: right;
}
.txtg {
	text-align: left;
}

.signature {
	font-style: italic;
	text-align: right;
}
.nouveau {
	font-weight: bold;
	background-color: yellow;
}
/* utilisé dans les communiqués */
dl.feuille dt {
	background-color: #CCFFCC;
	padding: 4px;
}
dl.feuille dd {
	margin-left: 0;
	padding: 4px 20px;
	border: 1px solid #CCFFCC;
}


.a_droite {
	float: right;
}

.a_gauche {
	float: left;
	margin: 8px 8px 8px 0;
}
	.a_gauche_espace {
		float: left;
		margin: 8px;
	}

#contenu .petittexte h1 {
	margin: 2pt;
	border: none;
	font-size: 10pt;
	font-weight: bold;
}
#contenu .petittexte p,
#contenu .petittexte li {
	font-size: 8pt;
}

.evidence {
	color: #A50000;
}
a:hover .evidence {
	color: #FFFF00;
}


div.barre {
	width: 170px;
	margin: 2px auto;
	text-align: center !important;
	font-size: 7pt !important;
	line-height: 90% !important;
}

div.icone {
	width: 60px;
	margin: 0 8px;
	padding: 4px;
/*	background-color: #ff9999;*/  /* DEBUG */
	text-align: center;
	float: left;
}
div.icone a {
	text-decoration: none;
}

div.icone p {
	margin: 0 !important;
	padding: 0 !important;
}
div.icone img {
	margin: 0;
	padding: 0;
}

p.question,
p.reponse {
	margin-left: 80px !important;
	margin-right: 80px !important;
	text-indent: -30px;
}
	p.reponse {
		padding-bottom: 12px;
		border-bottom: 1px solid;
}
	p.question em ,
	p.reponse em {
		font-size: 16px;
		font-weight: bold;
		font-style: normal;
		color: red;
	}

#contenu p.gros {
	font-size: 18pt;
	color: #A50000;
	text-align: center;
}


#codedevie em {
	font-style: italic;
	color: rgb(102, 0, 0);
}
	#codedevie ol {
	list-style-type: lower-alpha;
	}
