@font-face {font-family : helvet; src : url('../../../design/polices/Helvetica-Condensed-Light.otf');}
@font-face {font-family : segoe_ui_light; src : url('../../../design/polices/segoe_ui_light.ttf');}
@font-face {font-family : roboto; src : url('../../../design/polices/Roboto-Regular.ttf');}
@font-face {font-family : Roboto-Light; src : url('../../../design/polices/Roboto-Light.ttf');}
*
{
	box-sizing: border-box;
	font-size: 1em;
}
html{
	height: 100%;
}
body{
	background-color: white;
	color: #212121;
	padding: 0;
	margin: 0;
	height: 100%;
}
#zone_left{
	display: inline-block;
	background-color: #263238;
	width: 31.28%;
	text-align: right;
	min-height: 100%;
	/* du js agrandi lorsque zone droite + grande */
}
#zone_right{
	display: inline-block;
	vertical-align: top;
	width: 67.71%;
	background-color: white;
	text-align: left;
}
#contenu_right{
	display: block;
	padding-left: 10%;
	padding-right: 10%;
	padding-bottom: 3rem;
	font-family: Roboto-Light;
}

/*  -----  480  ----- */
@media screen and (max-width: 480px){
	#contenu_right{
	}
}
/*  -----  720  ----- */
@media screen and (min-width: 481px) and (max-width: 1002px) {
	#contenu_right{
	}
}
/*  -----  976  ----- */
@media screen and (min-width: 1003px){
	#contenu_right{
		max-width:  758px;
	}
}

#ariane{
	margin-top: 2rem;
	color: #757575;
	font-size: 1.5rem;
	letter-spacing : 2px;
	margin-bottom: 1rem;
	font-family: segoe_ui_light;
}

/*  ----------------------------------------------------------------------------------------------  NAV  ----------------------------------------------------------------------------------------------	*/

#nav_mobile{
	display: block;
	background-color: #546E7A;
	margin: 0;
	padding: 0;
}
#menuAlt{
	display: block;
	width: 48px;
	height: 48px;
	background-image: url("../../../design/icones/menuAlt.png");
	cursor: pointer;
}

nav{
	display: inline-block;
	font-family: segoe_ui_light;
	text-align: left;
	color: white;
	padding-right: 10%;
}

/*  -----  480  ----- */
@media screen and (max-width: 480px){
	#nav_aide{
		display: none;
		text-align: center;
		padding-bottom: 2rem;
	}
	#nav_mobile{
		width: 100%;
	}
	#zone_left{
		width: 100%;
		height: auto;
		min-height: 0;
		text-align: center;
	}
	#zone_right{
		width: 100%;
	}
}
/*  -----  720 + 976  ----- */
@media screen and (min-width: 481px){
	#zone_left{
		padding-bottom: 2rem;
	}
	nav{
		padding-top: 1.3rem;
	}
	#nav_mobile{
		display: none;
		width: 0;
	}
}

#logo{
	display: inline-block;
	margin-left: -10px;
	background-image: url("../../../design/logos/ico_50.png");
	width: 50px;
	height: 50px;
}
#doc{
	display: inline-block;
	vertical-align: top;
	font-size: 1.8rem;
	color: #F50057;
	margin-top: 2px;
}
#t_nav{
	text-align: center;
	font-size: 1.8rem;
	margin-top: 2rem;
}
#zone_titres{
	margin-top: 2rem;
}
.nav_lien_1{
	display: block;
	color: white;
	text-decoration: none;
	font-size: 1.3rem;
	border-bottom: 1px solid rgba(0,0,0,0);
	padding-top: 0.9rem;
	padding-bottom: 0.1rem;
}
.nav_lien_1:hover:not(#englobe){
	border-bottom: 1px solid #69F0AE;
}
.nav_lien_2{
	display: block;
	color: rgba(255,255,255,0.7);
	text-decoration: none;
	font-size: 1rem;
	border-bottom: 1px solid rgba(0,0,0,0);
	padding-top: 0.1rem;
	padding-bottom: 0.1rem;
	margin-left: 20px;
}
.nav_lien_2:hover{
	border-bottom: 1px solid #69F0AE;
}

/*  ----------------------------------------------------------------------------------------------  COMMUN AUX PAGES (CORPS)  ----------------------------------------------------------------------------------------------	*/

.pink{
	color: #F50057;
}
.gras{
	font-weight: bold;
}
.blue_grey{
	color: #546E7A;
}

.second{
	color: #757575;
	font-size: 0.9rem;
}
.third{
	color: #b9b9b9;
}
.italic{
	font-style: italic;
}
.size_2{
	font-size: 1.2rem;
}
.entier{
	white-space: nowrap;
}

h2{
	font-size: 1.8rem;
	border-bottom: 2px solid #69F0AE;
	font-weight: normal;
	margin-top: 2rem;
	margin-bottom: 2.5rem;
}
h3{
	display: inline-block;
	margin: 0;
	margin-bottom: 2rem;
	font-size: 1.6rem;
	font-weight: normal;
	border-bottom: 3px solid #69F0AE;
}
h4{
	display: inline-block;
	margin-top:	2rem;
	margin-bottom: 2rem;
	font-size: 1.3rem;
	font-weight: normal;
	border-bottom: 2px solid #e0e0e0;
	color: #69F0AE;
	font-weight: bold;
}

/*  ----------------------------------------------------------------------------------------------  DIVERS  ----------------------------------------------------------------------------------------------	*/

.b_classique{
	padding-bottom: 3rem;
}
.listeSommaire{
	font-size: 1.2rem;
	margin-bottom: 0.6rem;
}
.listeSommaire a{
	color: #212121;
}
.listeSommaire2{
	font-size: 1rem;
}
.listeSommaire2 a{
	color: #757575;
}

/* Tableau  */
table {
    border-collapse: collapse;
}
th{
	text-align: left;
}
#tabMethodes{
	margin-top: 3rem;
}
#tabMethodes table, th, td {
    border: 1px solid #e0e0e0;
	padding-top: 3px;
	padding-bottom: 3px;
}
#tabMethodes th{
	width: 20%;
	text-align: left;
}
.possible{
	background-color: #69F0AE;
}
.bientot{
	background-color: #e0e0e0;
}

.tabRessource{
	margin-top: 1rem;
}
.tabRessource th{
	color: #F50057;
	padding-bottom: 10px;
}
.cle{
	width: 20%;
}
.cle, .valeur, .description, .format{
	padding-left: 7px;
	padding-right: 7px;
	
}
.valeur:not(th), .description:not(th), .format:not(th){
	color: #757575;
	font-size: 1rem;
}

/*  -----  720  ----- */
@media screen and (min-width: 481px) and (max-width: 1002px) {

}
/*  -----  976  ----- */
@media screen and (min-width: 1003px){

}

/* ------------------------  SPECIFIQUE AUX PAGES ------------------------ */

/* INTRO */

#intro_a{
	font-size: 1.8rem;
}
.listeElem{
	color: #546E7A;
	font-weight: normal;
}