@font-face {
    font-family: NeoSansProRegular;
    src: url(../fonts/NeoSansPro-Regular.otf);
}

@font-face {
    font-family: BlissBold;
    src: url(../fonts/Bliss-Bold.otf);
}

@font-face {
    font-family: BlissRegular;
    src: url(../fonts/Bliss-Regular.otf);
}

@font-face {
    font-family: BlissLight;
    src: url(../fonts/BlissLight-Light.otf);
}

@font-face {
    font-family: BlissMedium;
    src: url(../fonts/BlissMedium-Medium.otf);
}
@font-face {
	font-family: Dys;
	src: url("../fonts/OpenDyslexic-Regular.otf");
}

html {height: 100%;}

 
body { height: 100%;margin: 0;padding: 0;font-family: Arial;overflow-y: auto; overflow-x: hidden; background-color:#e1dae1; }

sup {font-size: 65%;}
/*sup {vertical-align: text-top;}*/
.bandeau_ht {
	text-transform: uppercase;
	font-family: NeoSansProRegular;
	color: #fff;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 15px;
	font-size: 36px;
	text-shadow: 2px 2px 0px #8f060e; /*position:absolute; top:0px;*/
	background-image: url(../medias/bordure.png);
	background-repeat: repeat-x;
}
.container { position:relative; height:auto; /*width:100%;*/}
.sous_container {padding: 2% 4% 3% 2%; height:96%; }
.centre {border-radius:20px; background-color:#fff; z-index:10;   width:96%;  position: absolute;  display: inline-block; min-height:500px;}
.bandeau_onglet {z-index:3;  height:auto; width:100%; position:relative; top:20px; text-align:center; cursor:pointer;}
.lettre_onglet {background-color:#6b5177; width:35px; height:50px;display:inline-block; font-family: BlissMedium; color:#fff; padding:3px 0px 3px 0px; font-size: 26px; border-radius:14px; cursor:pointer; margin-bottom:5px; z-index:99;}
.lettre_onglet:hover, .lettre_active {background-color:#06998a;}
.lettreEnCours {color:#b4e0dc;  font-family: BlissLight; font-size:240pt; width:20%;  text-align:center;  float:left; 	position: absolute; display:block;  }
.contenu {width:70%;position: relative;	/*display: inline-block;*/	 height:auto; left:20%;  padding-top:50px; }
.btn_dys {position: absolute; right: 20px; top: 20px; cursor: pointer;}

.puce_verte {color:#06998a; font-size:40px; vertical-align:-5px; display:inline;}
.puce_rose {color:#D40062;}
/*h1 {margin:0; padding:0; margin-bottom:14px;font-size: 1.4em;}*/
/*h1.premier {border-top: 2px solid #06998a;}*/
h1 {margin:0;/*padding-top: 6px;padding-bottom: 6px; margin-bottom:6px;*/display: block;clear: both;	border-bottom: 1px solid #06998a; font-family: BlissLight;font-size:34px;width:100%; color: #06998a; margin-bottom: 1em;}
.logo_barem{vertical-align:middle; top:-5px; text-align:center; }
.dico {position:relative; left:-100px;}

a, a:visited, a:active  {color:#000; text-decoration:none;}


/* Menu accordéon */
#navigation li a {text-decoration: none; color: #000; /*background-color: red;*/ margin:0px; padding:0px;}

.cache p, .cache_niv02 p {
	    font-family: BlissLight;
	padding-top: 2px;
	padding-right: 65px; 	padding-left: 65px;
	padding-bottom: 2px;
	margin-top: -5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;  font-size:19px; }
li {clear: both; list-style-type: none;	padding: 0px; font-size: 14px; margin-top: 3px;	margin-right: 0px; margin-bottom: 3px; margin-left: 0px; }
ul {padding: 0px; margin: 0px;}
.toggleSubMenu {margin: 0px; padding: 0px; }

p { margin: 0px; padding: 0px;}



@media all and (max-width: 1110px) {
	.sous_container {padding: 3% 1% 3% 1%; height:94%; }
	.centre {width:98%;}
	.lettreEnCours {font-size:250pt; width:20%; }
	.contenu {width:70%;}
	h1 {width:95%;}
	.cache {width:95%;}
	.pImg img {max-width:400px; max-height:250px;}
	.logo_barem{height:89px;width:174px; }
	.bandeau_ht{background-image: url(../medias/bordure2.png);background-repeat: repeat-x;font-size:32px;}
	.btn_dys {position: absolute; right: 13px; top: 11px;}}

@media all and (max-width: 1045px) {.lettre_onglet { width:40px; height:35px; z-index:99;}
.bandeau_onglet {z-index:98;}	.pImg img {max-width:400px; max-height:250px;}	}

@media all and (max-width:1024px) {	
.bandeau_ht {/*padding-top:20px; padding-bottom:10px; */font-size:32px;}
.sous_container {padding-left:0px; padding-right:0px; padding-top:0px;}
.centre {width:100%;}
.lettreEnCours {display:none;}
.contenu {width:94%; left:0%; padding:5% 3% 0% 3%;}
.cache {width:100%;}
	h1 {width:98%;}
	.pImg img {max-width:300px; max-height:250px;}
	.lettre_cache {display:none;}
	



}

@media all and (max-width:560px){
.pImg img {width:100%;}

}

@media all and (max-width:660px){

.btn_dys {position: absolute; right: 10px; top: 20px; width:49px; height:34px;}
.cache p {
	   
	padding-right: 25px; 	padding-left:65px;
}}





/* Dico maths */
.ssTitDef {font-weight: bold;font-family: BlissBold; color:#D40062;/* padding-top :10px;*/}
p.ssTitDef {padding-top :18px; padding-bottom:5px; font-size: 22px; }
p.ssTitExempleRem {padding-top :18px; padding-bottom:5px; font-size: 20px; }
.ssTitExempleRem {font-weight: bold;font-family: BlissBold; color:#06998a;/* padding-top :10px;*/}
.pImg {text-align: center;}
.pImg img {/*background-color: white;*/ /*margin-top:10px; margin-bottom: 10px;*/ max-width:400px; max-height:250px;}
.sousLien, .sousLien:link, .sousLien:visited, .sousLien:hover {color: #D40062; text-decoration: underline; cursor: pointer; /*border: 1px solid white;*/}
.cache {top:15px; margin-bottom: 6em}
.def_prop {
	background-color: #ecf7f6;
	border-radius: 20px; padding-bottom:10px;
	margin-top: 10px;
}
.pAudio {
	position: relative;
	top: -28px;
	cursor: pointer;
	width: 39px;
	height: 28px;
	left: 16px;
	padding: 0px;
	float: left;
}

p.pAudio {padding:0px;}
.pAudio audio {display: none;}
.formule {font-family:BlissRegular; font-size:0.85em; }
.open {padding-bottom: 15px;} /* Pour que la définition dépliée ne touche pas le titre de la déf du dessous */
/*p {line-height: 1.1em;}*/
table .fd_th {background-color: #ecf7f6;}
table.td_bord {margin-left:65px; margin-right: 25px; border: 1px solid black; width: calc(100% - 75px); text-align: center; border-collapse: collapse;}
table.td_bord tr, table.td_bord td {border: 1px solid black; width: auto; border-collapse: collapse;}
.taille_fraction {font-size:60px;}

/* Partie dyslexique : il faut juste redéfinir les styles nécessaires en les précédant de ".container.dys" */
.container.dys .lettre_onglet, .container.dys .centre .lettreEnCours {font-family: Dys;}
.container.dys .centre .lettreEnCours {padding-top:0px;}

.dys .lettre_onglet {padding:0px 0px 8px 0px; margin-bottom:5px;}
.dys .lettre_onglet:hover, .dys .lettre_active {background-color:#06998a;}
.container.dys .centre .contenu h1{font-family: Dys;}
.container.dys .centre .contenu .cache p{font-family: Dys;}