@import "colonnes.css?2";

.typography { /*overflow: hidden;*/
    word-wrap: break-word; }


* { font-family: 'Roboto', sans-serif; }

p, ul, ol, blockquote, h1, h2, h3, h4 , h5, h6, form { font-family: 'Roboto', sans-serif; }

.typography b, .typography strong { font-weight:500; }


.typography a { text-decoration:none; color:#0a9e8b;  }
.typography a:hover { text-decoration:underline; }

.typography p { font-size: 16px;  font-weight: 300; line-height:150%; margin-bottom:10px; margin-top:10px;  }


.typography p strong, .typography p b { font-weight:500; }
/*
.typography hr:before { content:" "; height:20px; display:block; position:relative; }
.typography hr:after { content:" "; height:20px; display:block; position:relative; }
*/
.typography hr { margin:0;  height:auto; margin-top:40px; margin-bottom:40px; border:3px solid #eee; position:relative; }

.typography hr.beige { border-color:#b5985a !important; }


.typography .imagegauche {
	position:absolute;
	padding-right:20px;
	left:0;
}
.typography .textedroit {
	padding-left:120px;
}



.indice_superieure, .indice_inferieure {  font-size: 75%;  line-height: 0;  position: relative;  vertical-align: baseline; }
.indice_superieure {  top: -0.5em; }
.indice_inferieure {  bottom: -0.25em; }


.rougeorange { color:#eb4c3c !important; }
.bg-rougeorange { background-color:#eb4c3c; }

.bleu { color:#004677 !important; }
.bg-bleu { background-color:#004677; }

.turquoise { color:#0a9e8b !important; }
.bg-turquoise { background-color:#0a9e8b; }






.typography a img:hover { opacity:0.7; }


.typography .majuscule { text-transform:uppercase; }



.typography em {
    font-style: italic;
}



.typography .encadre {
	margin-top: 50px !important;
    margin-bottom: 50px !important;
	display:table;
}
.typography .encadre img.leftAlone {
	display: table-cell;
    vertical-align: middle;
    width: 81px;
	min-width:95px; height:auto;
}
.typography .encadre strong {
    display: table-cell;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    border-left: 20px solid transparent;
}



/*
.typography .encadre2 {
	margin-top: 50px !important;
    margin-bottom: 50px !important;
	display:table;
	background-color:#eee;
	padding:20px;
}
.typography .encadre2 img.leftAlone {
	display: table-cell;
    vertical-align: middle;
    width: 81px;
}
.typography .encadre2 strong {
    display: table-cell;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    border-left: 20px solid transparent;
}
*/






.typography h1 {
	font-size: 42px;
    font-weight: 100;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 45px;
}
/*
.typography h2 {
	color:#b5985a;
	text-transform:uppercase; 
	font-size:15px;
	font-size: 16px;
    margin: 20px 0 5px;
	font-weight: 500;
}
*/


.typography h2 {
	text-transform:uppercase; 
	color: #004677;
    font-size: 30px;
    font-weight: 300;
	margin-bottom:30px; margin-top:30px;
	padding-right:25%;
}
/*.typography h2:first-child { margin-top:0; }*/




.typography h3 {
	text-transform:uppercase; 
	color: #000;
    font-size: 22px;
    font-weight: 400;
	margin-bottom:30px; margin-top:30px;
}
/*.typography h3:first-child { margin-top:0; }*/




.typography h4 {

	font-size: 20px;
    font-weight: 300;
    line-height: 145%;
    margin-top: 10px;
    margin-bottom: 10px;
}





.typography img.leftAlone { max-width:100%; height:auto; }



.typography a { color:#00817b; text-decoration:none; }
.typography a:hover { text-decoration:underline; }

.typography a li { color:#000; border-left:2px solid #00817b; }
.typography a li:hover { background-color:#ddd; border-left-width:4px; }






.typography ol,.typography ul { }

.typography ol {counter-reset: repas;  }
.typography ul, .typography ol { position:relative; margin:0; margin-bottom: 40px; font-weight:300; }


.typography ol li {
    list-style-type: none;
    counter-increment: repas; 
	position: relative;
    padding-left: 45px;
}
.typography ol li:before {
    content: counter(repas)'.'; 
	position: absolute;
	left: 15px;
}

.typography ul li { padding-left:30px;  padding-top: 10px; }

.typography li:before {
	content: '•';
    position: absolute;
    font-weight: 600;
    color: #eb4c3c;
    left: 15px;
    margin-right: 10px;
}

.typography ul li {
    padding: 10px 15px;
    margin-bottom: 5px;
    position: relative;
    display: table;
	padding-left: 25px;
}








@media screen and (max-width: 600px) { 

	.typography h1 {
    	font-size: 24px;
	}
	
	.typography h2 { font-size: 22px;  }

	.typography p { font-size: 14px; }
	
	.typography .encadre img.leftAlone {  min-width: 75px; }
	
	
}



@media screen and (max-width: 450px) { 

	.typography h1 {
    	font-size: 30px;
	}
	
	.typography .encadre img.leftAlone {  min-width: 48px; }
	
	
	.typography .imagegauche {
		position:relative;
	}
	.typography .textedroit {
		padding:0;
	}
	
	
	
}

@media screen and (max-width: 380px) { 

	.typography p { font-size: 13px; }
	
	.typography h1 { font-size: 25px; margin-bottom: 10px;  margin-top: 10px; }
	.typography h2 { font-size: 20px; margin-bottom: 10px;  margin-top: 10px; padding-right:0; }
	.typography h3 { font-size: 18px; margin-top:20px; margin-bottom:20px; }

	.typography hr { margin-top: 20px; margin-bottom: 20px; }
	
	
		
	.encadre_gris_pale {
		margin-top: 20px !important;
		margin-bottom: 20px !important;
	}
	

}

/*


@media screen and (max-width: 500px) { 

	.typography p, p {  font-size: 13px; }
	h4 {  font-size: 16px; background-size: auto 100%; }
	
	
}
*/