body
{background: #edf1f8;

font-family: Helvetica, Arial, Verdana, sans-serif;
color: black;
font-weight: normal;

scrollbar-arrow-color:white;
scrollbar-base-color:#768fb0;
scrollbar-face-color:#22427C;
scrollbar-highlight-color:#768fb0;
scrollbar-shadow-color:#102542;
scrollbar-track-color:#768fb0;

max-width: 2500px;
min-width: 320px;
width: 100%;
margin: 0;
padding: 0;
overflow: auto;
font-size: 15px;
line-height: 22px;
box-sizing: border-box;
}

img {max-width: 100%;}

#global {display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: flex-start;	
	box-sizing: border-box;	
	width: 100%;	
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	align-items: strech;	
	overflow: hidden;
	}

	
#principal, #principal_voir_video	{		
	display: inline-flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 10px;
	box-sizing: border-box;	
	max-width: 100%;	
	}

#gauche
	{min-width: 175px;
	max-width: 345px;
	box-sizing: border-box;
	width: 20%;
	overflow: hidden;
	margin: 0 10px 10px 0;
	order: 1;
	}	
	
@media screen and (min-width: 1439px) {#gauche {width: 22%;} }

#droite
	{min-width: 255px;	
	max-width: 315px;
	width: 18%;
	margin: 0 0 10px 10px;	
	order: 3;}

#centrale
	{margin: 0 auto 10px auto;
	flex: 1;	
	order: 2;
	box-sizing: border-box;
	max-width: 100%;
	}	
	
@media screen and (max-width: 1000px) {
#droite {display:none;}
}
@media screen and (max-width: 767px) {
/*#principal {margin: calc(10.1vw + 54px) 0 0 0;}*/
#principal {margin: 0; width: 100%;}
#centrale {order: -1; width: 100%;}
#droite {display:none;}
#gauche	{display: none; max-width: 100%;	width: auto; margin: 0 0 10px 0;}
	}	


	
#boite_copyright
	{background-color: #5b5b5b;
	padding: 0 0 0 0;	
	border-style: none;
	margin: 2px 0 0 0;	
	height: auto;
	color: white;
 	font-size: 10px;
	}

#boite_copyright .haut_page
	{float: right;
	width: 80px;
	margin: 0;
	box-sizing: border-box;
	}
	
#boite_copyright .copyright
	{float: left;
	width: calc(100% - 160px);
	margin-left: 80px;	
	box-sizing: border-box;
	}
	
@media screen and (max-width: 767px) {#boite_copyright .copyright {width: calc(100% - 100px); margin: 0;}}
	
#boite_copyright p
	{margin: 0;
	text-align: center;
	}
	
#boite_copyright a
	{color: white;
	text-decoration: underline}

#boite_copyright p span.go_top 
	{float: right;	
	margin-right: 8px;
	}
	
	
div .responsive_horizontal_vertical
	{display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	box-sizing: border-box;		
	align-items: stretch;	
	padding: 5px;
	margin: 20px auto;
	border-style: none;
	height: auto;
	width: 95%;
	overflow: hidden;	
	}
	
@media screen and (max-width: 767px) {div .responsive_horizontal_vertical {flex-direction: column; width: 100%;}}


.video_youtube_container_principale
	{display: block;
	margin: auto;
	width: 95%;
	max-width: 580px;	
	}
.video_youtube_container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;	
}

.video_youtube_container iframe,  
.video_youtube_container object,  
.video_youtube_container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



table.principale_video
 {background-color: #ffffff;
 border-width: 1px; 
 border-style: none; 
 border-color: black;
 text-align: left; 
 width: 758px;
 padding: 0;
 margin: 0; 
}

table.liste_noire
 {border-style: solid;
 border-width: 2px;   
 border-color:#4f6b9d; 
 border-collapse: collapse;
 width: 80%;
 min-width: 350px;
 }
 
td.tn2
{text-align: center;
vertical-align: middle;
border-style: solid;
border-width: 1px;   
border-color:#4f6b9d;
}

td.tn2 li
{padding: 0 0 0 5px;
margin: 10px 0 0 2px;
text-align: justify;
list-style-type: disc;
line-height: 135%;
text-align: left;
}

table.video_encadre 
 {border-width: 2px; 
 border-style: solid; 
 border-color: #4f6b9d;
 background-color: #d8ddfd;
 margin: 10px 10px 15px 10px;
 }
 
.video_encadre
{display: block;
width: 90%;
border: 2px solid #4f6b9d;  
background-color: #d8ddfd;
margin: 5px auto 10px auto;
padding: 10px;
}

div .video_container_accueil
	{display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	box-sizing: border-box;		
	align-items: stretch;	
	padding: 0;
	margin: 0 auto;
	background: inherit;
	border-style: none;
	height: auto;
	min-height: 110px;
	width: 98%;
	overflow: hidden;
	font-size: 15px;	 
	}
	
div .video_container
	{display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	box-sizing: border-box;		
	align-items: stretch;	
	padding: 5px;
	margin: 15px auto;
	background: #d8ddfd;
	border-style: none;
	height: auto;
	min-height: 110px;
	width: 98%;
	overflow: hidden;
	font-size: 15px;	 
	}
	
div.mobile div.video_container:hover
	{background: #94bbff;
	}

div .video_image 
 {width: 160px;  
 margin: 10px;   
 }

div .video_texte
 {text-align: justify; 
 margin: 5px auto 10px 0; 
 padding-right: 5px;
 flex: 1;
 line-height: 1.7em; 
 }
 
div .video_titre
{display: block;
width: 100%; 
font-weight: bold;
margin: 0;
}

div .video_titre h2
{font-size: inherit;
margin: 0 0 7px 0;
line-height: 22px;
}

div .video_description
 {display: inline-block;
 vertical-align: top;
 margin-bottom: 10px;
 width: 100%; 
 }
 
div .video_legende
 {display: flex;
 flex-direction: row;
 flex-wrap: nowrap;
 justify-content: flex-start;
 box-sizing: border-box;		
 width: 100%;
 margin-top: 10px; 
 text-align: justify;
 }
 
div .video_legende_voir
{flex: 1;
}

div .video_legende_boite
{
width: 20%;
text-align: center;
}

div .video_legende_boite:last-child
{width: 25%;
text-align: right;
}

div .vue {font-style: italic; color: #858585; font-size: 12px;}

div .video_description_notitle {display: none;}
div .video_description_title {display: inline;}

@media screen and (max-width:767px) {
div .video_texte {display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; margin: 0 0 0 0; padding: 0 0 0 10px; text-align: left;}
div .video_container {font-size: 14px;}
div .video_image {width: 50%; height: auto; max-height: 350px; max-width: 450px; margin: 5px 0 0 0;}
div .video_image.largeur_reduite {width: 35%;}
div .video_legende {display: none;}
div .video_description {flex: 1;}
div .video_container_accueil div.video_titre:hover {color: #5f74fe; text-decoration: none}
}

@media screen and (max-width:540px)
	{/*div .video_image {width: 40%;}*/
	div .video_description_notitle {display: inline;}
	div .video_description_title {display: none;}
	div .video_titre h2 {line-height: 24px;}
	}

@media screen and (max-width:540px) , screen and (min-width:768px)
	{div .video_container_accueil {flex-direction: column;}
	.video_container_accueil .video_image {width: 100%; align-self: center;}	
	.video_container_accueil .video_texte {display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; margin: 0; padding: 0; text-align: left;}
	}
	
@media screen and (min-width:768px) {
	div .video_container_accueil {padding: 0 5px;}
	div .video_container_accueil div.video_titre {margin-bottom: 5px;}
	}
	
div .voir_video	
	{display: block;
	width: 95%;
	max-width: 1200px;
	margin: 10px auto;	
	box-sizing: border-box;	
	}
	
div .voir_video_description
	{border: 2px solid #4f6b9d;
	padding: 5px 20px;
	}
	
div .voir_video_centrer
	{text-align: center;
	margin-top: 15px;
	}
	
td
 {font-size: inherit;
 font-weight: normal; 
 }

td.affichage_crash
{font-size: inherit;
text-align: left;
vertical-align: middle;
}

.premier_pays
{font-weight:bold;
 color:#4f6b9d;
 }
 
ul.liste_noire_mobile
{margin: 10px 5px;
padding: 0;
}

li.liste_noire_mobile_premier_pays
{font-weight:bold;
 color:#4f6b9d;
 margin: 14px 0 5px 0;
 list-style-type: none;
 padding: 0;
}

li.liste_noire_mobile_cie
{margin: 0 0 0 10px;
padding: 0;
list-style-type: none;
}

.encours
 {color:#4f6b9d;
 }

li
 {list-style-type: disc;
 margin-bottom: 8px;
 }

span.video
 {font-size: 14px; 
 }

span.video_lien
 {font-size: 14px;
 text-decoration: underline;
 font-weight: bold;
 }

#share
 {position: relative;
 display: block;
 float: right; 
 margin: 4vw 2% 0 auto; 
 padding: 0;
 font-size: 11px;
 text-align: right;
 font-style: italic; 
 z-index: 2; 
 }
 
@media screen and (max-width:767px) {#share:not(.alwaysdisplay) {display: none;}}
 
 #share_mobile
 {position: relative;
 display: inline-block; 
 margin: 0 0 0 -50%;
 padding: 0;
 font-size: 11px;
 text-align: right;
 font-style: italic; 
 z-index: 2;
 }
 
 @media screen and (min-width:768px) {#share_mobile {display: none;}}
 

#option_video
 {position: relative; 
 display: block; 
 margin: 15px auto 10px auto;
 width: 95%;
 padding: 0;
 font-size: 11px;
 text-align: right;
 font-style: italic; 
 }
 
 #option_video_left
 {position: relative; 
 display: block; 
 margin: 15px auto 30px auto;
 width: 95%;
 padding: 0;
 font-size: 11px;
 text-align: left;
 font-style: italic; 
 }

#option_video img.aide
 {display: block;
 position: relative;
 float: left;
 margin: 0;
 padding: 0;
 border: none;
 }

ul
{width: auto;
padding: 0 10px 10px 30px;
margin: 0;
}

li {
padding: 0 0 0 5px;
margin: 15px 30px 0 40px;
text-align: justify;
list-style-type: disc;
line-height: 150%;
}

@media screen and (max-width:767px) {
	li {margin: 15px 10px 0 10px;}	
	}
 
ul.ul_std
{background: transparent;
width: auto;
padding: 0 0 10px 30px;
text-align: left;
}

li.li_std
{background: transparent;
margin: 10px 0 0 30px;
text-align: left;
list-style-type: disc;
}

ul.ul_article
{background: transparent;
width: auto;
padding: 0 0 0 20px;
margin: 0;
text-align: left;
}

li.li_article
{background: transparent;
margin: 10px 0 0 30px;
padding: 0;
text-align: left;
list-style-type: disc;
}

ul.plan
{background: transparent;
width: auto;
margin: 0 0 5px 0;
padding: 0 0 0 60px;
text-align: left;
}

li.plan
{background: transparent;
margin: 0;
text-align: left;
list-style-type: disc;
}

div.plan1
{margin: 20px 0 0 10px;
font-size: 14px;
text-decoration: underline;
font-weight: bold;
}

div.plan2
{display: inline;
margin: 0;
text-decoration: underline;
font-style: italic;
font-size: 14px;
}

@media screen and (max-width:767px) {
div.plan2 {font-size: 13px;}
ul.plan {padding-left: 35px;}
}

div.plan3
{display: inline;
margin-left: 20px;
text-decoration: underline;
font-style: italic;
font-size: 11px;
}

div .plan_container
{width: 50%; 
min-width: 120px; 
margin: 0 10px 10px 0; 
box-sizing: border-box;
}



/* ---------------------- DEFINITION DES BOITES ---------------------- */

#boite_article
	{border-width: 1px 1px 1px 1px;
        -moz-border-image:url("images/borders.png") 1 1 1 1 repeat stretch;
        -webkit-border-image:url("images/borders.png") 1 1 1 1 repeat stretch;
        border-image:url("images/borders.png") 1 1 1 1 repeat stretch;
	position: relative;
	padding: 10px;	
	height: 100%;
	margin: 0;
	background: #ffffff;	
	text-align: left;	
	font-size: 16px;
	line-height: 1.7em;	
	max-width: 100%;
	overflow: visible;	
	box-sizing: border-box;	
	}
	
#boite_article:nth-child(n+2), div.mobile > #boite_article 
	{margin-top: 25px;}

#boite_article h1, #boite_article div.titre_accueil
	{border-bottom: 5px solid #4f6b9d;
	font-weight: bold;
	padding:0px 0px 5px 0px;
	color:#444;
	margin: 10px 10px 5px 10px;
	font-size: 2.0em;
	line-height:1.4em;}

#boite_article h1:first-child {margin-top: 0;}

#boite_article h2:not(.video_titre), #boite_article h1.titre_accueil
	{border: none;
	font-size: 1.7em;
	line-height:1.6em;
	margin: 0 10px 0 10px;
	color:#4f6b9d;
	padding: 15px 0px 5px 0px;
	}
	
#boite_article h3
	{font-size: 1.5em;
	margin: 20px 0 5px 20px;
	color:#4f6b9d;
	padding: 0;
	text-align: left;	
	}

#boite_article h4
	{font-size: 1.7em;
	margin: 0 0 20px 0;
	color:#4f6b9d;
	padding: 0;
	text-align: center;
	}
	
#boite_article p
	{margin: 10px;		
	}
	
p.intro, #boite_article p.intro:not(.first)
	{margin: 25px 10px 10px 10px;
	}
	
#boite_article article.description_crash
	{font-size: 19px;
	line-height: 1.8em;
	}
	
#boite_article p.cvr
 	{margin: 10px 40px 10px 40px;
	font-style: italic;
 	color: #5f74fe;
	}
	
@media screen and (max-width:767px) {
#boite_article h1, #boite_article div.titre_accueil {font-size: 25px; line-height: 32px; margin: 0 0 5px 0;}
#boite_article h2:not(.video_titre), #boite_article h1.titre_accueil {font-size: 22px; line-height: 30px; padding-top: 5px; margin: 0; }
#boite_article h2.marge_en_haut {padding-top: 20px;}
#boite_article h3 {font-size: 20px; margin: 15px 0 5px 0;}
#boite_article h4 {font-size: 20px;}
#boite_article p {margin: 10px 0;}
p.intro, #boite_article p.intro:not(.first)	{margin: 25px 0 10px 0;}
#boite_article p.cvr {margin: 10px 20px 10px 20px;}
}



#boite_article p.info_accueil
	{line-height: 1.3em;
	}
	
@media screen and (min-width:1679px) {#boite_article p.info_accueil {line-height: 1.5em; margin-bottom: 20px;}}

#boite_article p.articles_news
	{clear: both;
	text-align: justify;
	margin: 15px 10px 10px 10px;
	font-size: 16px;
	line-height: 1.8em;
 	}
	
@media screen and (max-width:600px) {
#boite_article p.articles_news {font-size: 18px; line-height: 1.6em; margin: 0; padding: 0;}
#boite_article {font-size: 18px;}
#boite_article p.intro {font-size: 20px;}
.boite_secondaire p.intro {font-size: 16px;}
#boite_article article.description_crash {font-size: 20px;}
}



#boite_article .disclaimer
	{font-size: 13px;
	text-align: justify;
 	margin: 10px;	
 	}

#boite_article li.disclaimer {list-style-type: disc;}

.marges
	{margin: 10px;
	}


.boite_secondaire
	{position: relative;
	padding: 0 0 10px 0;		
	background: #ffffff;
	border-color: #4f6b9d;
	border-width: 1px;
	border-style: solid;
	margin: 0;
	box-sizing: border-box;
	max-width: 100%;	
	}


	
@media screen and (max-width:767px) {.boite_secondaire {margin-top: 15px; width: 100%;}}

.boite_secondaire:nth-child(n+2) /*Cela permet de séparer les 2ème enfant, sans avoit recours à un margin-bottom qui génère une espacement en bas de page si un seul enfant */
	{margin-top: 25px;}

.boite_secondaire div.titre
	{background:#26609c url(images/background.jpg) repeat-x top left;
	background-position: 0% -38px;
	background-size: 100% auto;
	margin: 0;
	padding: 4px;
	min-height: 22px;
	height: auto;
	font-size: 1.2em;
	color:#f2f2f2;
	border: none;
	font-weight: bold;
	}
	
.boite_secondaire div.titre_centrer
	{text-align: center;
	}

.boite_secondaire h2
	{font-size: 1.1em;
	margin: 20px 10px 5px 10px;
	color:#4f6b9d;
	padding:0px 0px 5px 0px;		
	}
	
.boite_secondaire div.marges strong, h1 strong
	{font-weight: inherit;}

div .sondage_gauche
	{float: left;	
	min-width: 315px;
	width: 45%;
	height: auto;
	margin: 10px 0 10px 8px;
	}

div .sondage_droit
	{float: right;	
	min-width: 315px;
	width: 45%;
	height: auto;
	margin: 10px 0 10px 8px;
	}
	
@media screen and (max-width:767px) {div .sondage_droit, div .sondage_gauche {float: none; display: block; margin: 10px auto; width: 90%; max-width: 500px;}}

#barre_boite
	{position: relative; 
	display: block;	
	padding: 0;
	margin: 12px 15% 12px 15%;	
	height: 2px;	
	background-position: center;	
	}

#barre_image
	{width: 100%;
	height: 2px;	
	float: left;
	}


.boite_accident
	{display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	box-sizing: border-box;		
	align-items: strech;	
	padding: 5px;
	margin: 20px auto;
	background: #d8ddfd;
	border-style: none;
	height: auto;
	min-height: 95px;
	width: 98%;
	overflow: hidden;
	font-size: 1.3vw;
	line-height: 2.5vw;
	}
	
.boite_accident:hover
	{background: #94bbff;
	}

.boite_accident .miniature
	{border-style: none;
	box-sizing: border-box;
	max-height: 200px;
	height: auto;
	width: 30%;
	overflow: hidden;	
	}
	
.boite_accident .affichage_crash
	{min-width: 180px;
	flex: 1;
	box-sizing: border-box;
	padding: 0 0 0 10px;	
	}
	
.boite_accident .affichage_crash_lien
	{margin-top: 10px;	
	}
	
.boite_accident .affichage_crash_mobile {display: none;}

@media screen and (max-width:1000px) {.boite_accident {font-size: 1.5vw;	line-height: 2.8vw;}}

@media screen and (max-width:767px) {
.boite_accident {flex-direction: column; align-items: flex-start; font-size: 15px;	line-height: 20px; padding: 0; width: 100%;}
.boite_accident .affichage_crash {display: none;}
.boite_accident .affichage_crash_mobile {display: inline-block; box-sizing: border-box; max-width: 100%; padding: 0 10px;}
.boite_accident .affichage_crash_mobile:nth-child(4) {font-family: monospace; color: #df001a; margin: 0 0 10px 0;}
.boite_accident .affichage_crash_mobile:nth-child(5) {font-weight: bold; font-size: 22px; line-height: 25px; }
.boite_accident .affichage_crash_mobile:nth-child(5):hover {color: #df001a;}
.boite_accident .affichage_crash_mobile:nth-child(6) {margin: 10px 0;}
.boite_accident .miniature {width: 100%; height: auto; max-height: 350px;}

}
	

#boite_accident_news
	{position: relative;
	float: left;	
	margin: 10px auto 10px 10px;
	background: #d8ddfd;
	border-style: none;
	min-height: 250px;
	width: 40%;
	min-width: 150px;
	font-size: 1.1em;	
	}
	
@media screen and (max-width:600px) {#boite_accident_news {display: none;}}
@media screen and (min-width:1679px) {#boite_accident_news {min-height: 320px;}}

#boite_accident_news .tableau
	{padding: 0 0 0 5px;
	border-style: none;	
	}

#bouton_container {	
	position:relative;
	width: 90%;
	min-height: 110px;	
	margin: auto;
	padding: 0;	
	text-align: center;	
	font-weight: bold;	
	text-align:center;
	}

.bouton {
	display: inline-block;
	position: relative;		
	padding: 0;
	font-size: 15px;
	margin: 10px 17px 10px 17px;
	background: #d8ddfd;
	border-style: none;
	text-align: center;	
	height: 33px;
	line-height: 33px; 
	white-space: nowrap;
	width: 175px;	
	}

@media screen and (max-width:520px) {
#bouton_container {width: 100%;}
.bouton {font-size: 14px; width: 145px; margin: 10px 5px 10px 5px;}
}

@media screen and (min-width:1200px) {
#bouton_container {width: 80%;}
}
	
a .bouton:hover {
	background:#26609c url(images/background.jpg) repeat-x bottom left;
	color: white;
	}

.bouton .encours {
	width: 100%;
	height: 100%;
	background:#26609c url(images/background.jpg) repeat-x bottom left;	
	color: white;
	}

div .select_annee_container
{display: block;
width: 92%;
margin: auto;
}
	
div .select_annee
{display: inline-block;
width: 20%;
min-width: 90px;
margin: 12px auto 12px auto;
box-sizing: border-box;
text-align: center;
font-weight: bold;
font-size: 16px;
text-decoration: underlined;
}

div .select_pays
{display: inline-block;
width: 32%;
min-width: 200px;
margin: 6px auto 6px auto;
box-sizing: border-box;
text-align: center;
font-size: 16px;
}

/* ---------------------- DEFINITION MENU PRINCIPAL ---------------------- */

#menu_liner{
	display: block;
	position:relative;
	float: left;
	height:5px;
	color:#56739A;
	background:#56739A;
	width:100%;
	font-family:Helvetica, Arial, Verdana, sans-serif;
	clear:right;
	}

#menunav{display: block;
	position: relative;
	float: left;
	height: auto;	
	width: 100%;
	margin-left: 0;
	padding: 0;
	clear:right;	
	font-family: Helvetica, Arial,Verdana, sans-serif;	
	
	}
	
ul.topnav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;    
	background:#56739A url("images/background.jpg") repeat-x top left;
	background-size: auto 200%;	
}

ul.topnav li {
	float: left;
	list-style-type: none;
	padding: 0;
	margin: 0;
	border-right: 1px solid #bbb;
	font-weight: bold;
	}

ul.topnav li.mobile_only {
	display:none;
}	

ul.topnav li:not(.reseaux_sociaux) a {padding: 14px 16px;} /* Pour IE */
ul.topnav li.rdv {float: right;	background-color: #C87F00;} /* Pour IE */	
ul.topnav li.rdv a:hover {background-color: #F09C0B;} /* Pour IE */

ul.topnav > li:nth-last-child(2)
	{float: right;
	background-color: #C87F00;}
	
ul.topnav li:not(.reseaux_sociaux) a {
    display: inline-block;
    color: #f2f2f2;	
    text-align: center;
    padding: 14px 1.2vw;
    text-decoration: none;
    transition: 0.5s;
    font-size: 16px;	
}

ul.topnav li a:hover {background-color: #56739A;} /* Pour IE */

ul.topnav > li:not(:nth-last-child(2)) > a:hover {background-color: #56739A;}
ul.topnav > li:nth-last-child(2) > a:hover {background-color: #F09C0B;}

ul.topnav li.icon {display: none;}

ul.topnav ul {display: none;}

ul.topnav ul {
	display: block;
	position: absolute;
	max-height:0em;	
	margin: 0; padding: 0;
	background-color: #C7E3F2;
	background-image: linear-gradient(#a3c3fe,#b5cfff);
	overflow: hidden;
	transition: 1s max-height 0.3s;
	border-radius: 0 0 8px 8px;	
	z-index: 99999;
}

ul.topnav > li:hover ul {max-height: 23em;}

ul.topnav ul li {
	position: relative;
	display: block;
	border-right: none;
	border-bottom: 1px solid #3f4144;
	float: none;		
	}
	
ul.topnav ul li:last-child{
    border: none;
	}

ul.topnav ul li:not(.reseaux_sociaux) a {
	text-align: left;
	color: #3f4144;	
    padding: 10px;
    height: auto;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
    text-transform: none;	
	}
	
ul.topnav ul li a:hover {
	background-color: #C7E3F2;
	}
	
ul.topnav li.reseaux_sociaux {display: none;}


@media screen and (min-width:768px) {
ul.topnav li a.current, ul li a.current:hover{
	color:#fff;
	background-color: #56739A;	
	}	
	
ul.topnav ul li a.current, ul ul li a.current:hover{
	color:#eaeaea;	
	background-color: #56739A;
	}	
}
	
@media screen and (max-width:1000px) {
ul.topnav li:not(.reseaux_sociaux) a {    
    padding: 14px 0.8vw;    
    font-size: 13px;	
}
}

 ul.topnav li.affiche_sur_scroll {display:none}

@media screen and (max-width:767px) {
  .nav-is-stuck .main-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
	animation: stickAnim .3s;
	z-index: 10;
}
 
@keyframes stickAnim {
	0% {
		transform: translateY(-86px);
	}
	100% {
		transform: translateY(0);
	}
}
    
  ul.topnav > li:hover ul {max-height: 0em;}
  ul.topnav li {display: none;}
  ul.topnav li {border: none;}
  ul.topnav li.icon {
    float: left;	
    display: inline-block;
  }
  
  ul.topnav li.reseaux_sociaux {
    display: inline-block;	
	box-sizing: border-box;	
  }

  ul.topnav li:not(.reseaux_sociaux) a {    
    padding: 14px 1.2vw;    
    font-size: 16px;	
	transition: 0.3s}
	
#menunav {height: auto; left: 0; z-index: 3; overflow-y: auto; max-height: 100vh; overflow-scrolling: auto;}
#bandeau_titre:not(.notfixed), #bandeau_titre_anglais:not(.notfixed) {height: 10vw; width: 100%; position: fixed; top: 0; left: 0; z-index: 3;}
#menu_liner{display: none;}

 ul.topnav.responsive {position: relative;}
 ul.topnav.responsive li.icon {
    position: relative;
    left: 0;
    top: 0;
  }
  
  ul.topnav li.reseaux_sociaux {
    position: absolute;
    left: 50%;
    top: 0;
  }
  
 ul.topnav.responsive li {
    float: none;
    display: inline;
  }
 ul.topnav.responsive li:not(.reseaux_sociaux) a {
    display: block;
    text-align: left;	
  }
  
ul.topnav.responsive li:not(.reseaux_sociaux):not(.icon) a {
  line-height: 15px;
	height: 15px;
	}
}

/* ---------------------- MENU NAV SIDEBAR POUR MOBILE --------------- */

amp-social-share.rounded {
      border-radius: 50%;
      background-size: 70%;
	  margin-right: 7px;
	  vertical-align: middle
    }
	

div .reseaux_sociaux {
    padding-right: 42px;
	display: inline-block;	
	margin: auto;	
	}	
	  
      header.menu_mobile {
        background:#56739A url("images/background.jpg") repeat-x top left;
		background-size: auto 200%;
        padding:0.2rem;
      }  

	ul.menu_mobile {
		margin:0;
		padding:0;
		font-family: 'Droid Serif', serif;
		}

      #sidenav {
        background-color:#56739A;
        width: 305px;
        -moz-box-shadow: 0.2rem 0 1rem rgba(0,0,0,0.5);
        -webkit-box-shadow:0.2rem 0 1rem rgba(0,0,0,0.5);
        box-shadow: 0.2rem 0 1rem rgba(0,0,0,0.5);
        text-align: right;
      }		

      #sidenav li, #sidenav h3 {
        font-family: 'PT Sans', sans-serif;       
        font-size: 1.5rem;
        line-height: 2.625rem;
        list-style: none;
        border:0;
        border-bottom: 1px solid #253b48;
        text-align: left;  
        color: #fff;
        font-weight: normal;
        outline: none; 	
		margin: 0;	
      }
	  
	   #sidenav li:not(.sidebar-parent-container):hover {background-color: rgba(255, 255, 255, 0.1);}

      #sidenav section, #sidenav h3 {
        background-color:#56739A;
		
      }

      #sidenav h3 {
        padding-left: 0.5rem;		
      }


      #sidenav a {
        color: #fff;
        text-decoration:none;
      }

      #sidenav li.sidebar-parent-container {
        border-bottom: 0;  
		padding-left: 0;
      }

      #sidenav li.sidebar-parent-container section {
        background-color:rgba(255, 255, 255, 0.1);
      }

      #sidenav li.sidebar-parent-container ul {
        padding: 0 0 0 0.5rem;
      }

      li:not(.sidebar-parent-container) {
          padding-left: 0.5rem;
      }	  
	 
      .header-top {
        display: flex;
      }

     .sidenav-btn {
        padding: 0.3rem 0.4rem;
        /* fix for iOS responsiveness*/
        z-index: 9999;
		
      }

      .sidenav-close {
        padding:10px 10px 0 0;
      }


      amp-accordion section h3::after {
        font-family: 'PT Sans', sans-serif;
        position: absolute;
        right: 17px;
        font-size: 22px;
        -moz-transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
      }


      amp-accordion section[expanded] h3::after {
        content: '⟨';

      }
      amp-accordion section:not([expanded]) h3::after {
        /* Unicode: U+276F, UTF-8: E2 9D AF content: '\00276F';*/
        content: '⟩';
      }

      amp-accordion>section[expanded] :nth-child(2) { 
        animation: opening 0.2s;
      }

      @keyframes opening{ 0% { height:0; }      100% { height:250px; } }


/* ---------------------- DEFINITION DES LIENS ---------------------- */

a:link {color: #000000; text-decoration: none}     
a:visited {color: #000000; text-decoration: none} 
a:hover {color: #5f74fe; text-decoration: none}   
a:active {color: #56739A; text-decoration: none}   

a.inchange:link {color: inherit; text-decoration: inherit}  
a.inchange:visited {color: inherit; text-decoration: inherit}  
a.inchange:hover {color: inherit; text-decoration: inherit}  
a.inchange:active {color: inherit; text-decoration: inherit}  

a.lien_important:link {color: #4f6b9d; text-decoration: none}     
a.lien_important:visited {color: #4f6b9d; text-decoration: none} 
a.lien_important:hover {color: #5f74fe; text-decoration: none}   
a.lien_important:active {color: #56739A; text-decoration: none}

a.go_to_top:link {color: white; text-decoration: none}     
a.go_to_top:visited {color: white; text-decoration: none} 
a.go_to_top:hover {color: #5f74fe; text-decoration: none}   
a.go_to_top:active {color: #56739A; text-decoration: none}




/* ---------------------- DEFINITION DES IMAGES ---------------------- */


#image_centre
	{text-align: center;
	margin: 20px 0 20px 0;		
	}

.float_right_et_block
	{float: right;
	border: none;
	margin: 10px 0 10px 10px;
	}
	
.float_left_et_block
	{float: left;
	border: none;
	margin: 10px 10px 10px 0;
	}
	
@media screen and (max-width: 600px) {
.float_right_et_block {display: block; float: none; margin: 10px auto; max-width: 90%;}
.float_left_et_block {display: block; float: none; margin: 10px auto; max-width: 90%;}
}
	

.photo_legend
	{font-weight:bold;
	margin: 5px 0 20px 0;
	color:#444;
	text-align: center;
	}

.photo_copyright
	{font-size: 10px;
	text-align: right;		
	}

.carte
	{position: relative;
	float: right;
	margin: 0 15px 15px 10px;
	min-width: 350px;
	max-width: 450px;
	height: auto;
	border: none;
	}
	
@media screen and (max-width: 767px) {.carte {display: block; float: none; margin: 0 auto 10px auto; min-width: 300px; max-width: 80%;}}

.illustration
	{display: block;
	max-width: 90%;
	margin: 10px auto 15px auto;	
	}
	
@media screen and (max-width: 767px) {.illustration {max-width: 98%;}}

.limite_hauteur {max-height: 55vh;}
	
.news_crash
	{position: relative;
	float: right;
	margin: 10px 10px 10px auto;
	width: auto;
	max-width: 55%;
	min-height: 250px;
	border: none;	
	}
	
@media screen and (max-width: 600px) {.news_crash {float: none; display: block; max-width: 100%; height: auto;}}


.news_articles
	{position: relative;	
	margin: 10px auto 15px auto;
	display: block;
	text-align: center;
	width: 85%;
	max-width: 450px;	
	height: auto;
	border: none;
	}

.news_articles_features
	{position: relative;
	float: left;
	margin: 10px 15px 15px 10px;	
	width: 270px;	
	border: none;
	}

@media screen and (max-width: 600px) {.news_articles_features {float: none; display: block; margin: 10px auto; width: 100%; height: auto;}}

.photo_avion_similaire_container
	{display: inline-block;	
	}
	
.photo_avion_similaire
	{display: block;
	margin: auto;
	max-width: 600px;
	width: 100%;
	}

.photo_copyright
	{height:20px;
	text-align: right;
	vertical-align: top;
}
.photo_legend
	{text-align:center;
	vertical-align:middle;
	}

#thumbnail
	{display: block;
	width: 100%;
	margin: auto;
	}
	
.thumbnail_1
	{display: block;	
	width: 80%; 
	margin: auto;
	}
	
div .thumnail_affich
	{display: inline-block;
	min-width: 185px;
	box-sizing: border-box;
	width: 32%;
	margin: 10px 0;
	}
	
div .site_webmestres
	{width: 100%;
	height: auto;
	max-width: 728px;
	border: none;	
	}
	
div .image_article
	{display: block;
	margin: auto;
	width: 100%;
	height: auto;	
	max-width: 700px;
	border: none;
	}
	

/* ---------------------- DEFINITION DE L'IMAGE D'EN TETE ET DRAPEAUX ---------------------- */

#bandeau_titre
	{box-sizing: border-box;
	min-height:0;
	min-width:0;
	height: 10.2vw;
	background: url("images/1001crash_accueil.jpg") no-repeat 0 0;
	background-size: 100% 100%;
	overflow: hidden;
	}

#bandeau_titre_anglais 
	{box-sizing: border-box;
	min-height:0;
	min-width:0;	
	height: 10vw;
	background: url("images/1001crash_welcome.jpg") no-repeat 0 0;
	background-size: 100% 100%;
	overflow: hidden;
	}
	
#clique_top {
display: block;
position: absolute;
top:0;
left:15%;
width: 70%;
padding-top: 10%;
z-index: 3;	
}
	
img.bandeau
{display: block;
width: 100%;
height: 100%;	
}

#drapeaux
{	position: relative; 
	float: left;
	height: auto;
	margin: 6vw auto 0 2%;
	width: 10%;
	z-index: 2;	
	}

.drapeau_usa
	{max-width: 36px;
	display: block;
	float: left;
	height: auto;
	margin: 0;
	width: 40%;
	border: none;	
	}

.drapeau_france
	{max-width: 36px;
	display: block;
	height: auto;
	float: left;
	margin-left: 15%;
	width: 40%;
	border: none;
	}	

@media screen and (max-width: 767px)	{
	#drapeaux {width: 95%; margin: 3% auto 0 2%;}
	.drapeau_usa {width: 37px;}
	.drapeau_france {width: 37px; float: right; margin: 0;}	
	}
	
@media screen and (max-width: 395px)	{
	#drapeaux {margin: 3% auto 0 2%;}
	.drapeau_usa {width: 27px;}
	.drapeau_france {width: 27px;}	
	}

/* ---------------------- AFFICHAGE COMMENTAIRES VIDEOS ---------------------- */	

div .commentaire
	{display: block;
	width: 95%;
	margin: 35px auto 10px auto;
	padding: 5px 0;
	background: #e5e5e5; 
	}
	
div .commentaire_container
	{display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	box-sizing: border-box;		
	align-items: stretch;	
	padding: 5px;
	margin: 15px auto;	
	border-style: none;
	height: auto;
	width: 95%;
	overflow: hidden;
	font-size: 14px;	
	line-height: 20px;
	}
	
div .barre_separation
	{border-bottom: 1px solid #cccccc;
	}
	
div .commentaire_gauche
	{width: 20%;
	min-width: 150px;
	display: flex;
	flex-direction: column;	
	align-items: stretch;	
	box-sizing: border-box;		
	}

div .commentaire_droit
	{flex: 1;
	min-width: 150px;
	display: flex;
	flex-direction: column;	
	align-items: stretch;	
	box-sizing: border-box;		
	}
	
div .commentaire_case
	{width: 100%;	
	padding: 2px 10px;
	box-sizing: border-box;			
	}
	
div .bleu
	{color: #5f74fe;
	}
	
div .date
	{color: #666666;
	font-style: italic;
	font-size: 12px;
	}
	
@media screen and (max-width: 767px)	{
div .commentaire_container {flex-direction: column;}
div .commentaire_gauche {flex-direction: row; width: 100%;}
div .commentaire_case {width: auto;}
div .date {order: 1;}

}

/* ---------------------- DEFINITION DES FORMULAIRES ---------------------- */

form
{margin:0;
padding:0;
}

form.espace
{margin-top:5px;
margin-bottom:15px;
padding:0;
}

INPUT[type=text], INPUT[type=search]
 {font-family: Arial, Verdana, Helvetica; 
 padding: 0 3px 0 3px;
 height:25px;
 font-size: 16px;
 background-color: #f3fbfd;
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;
 border:1px solid #027fff;
 box-shadow:1px 1px 2px #C0C0C0 inset;
 cursor:pointer;
 line-height: 130%; 
 margin: 0 5px 0 0;
 vertical-align: middle;
 color: #3f4144;}

INPUT[type=radio]
{margin-bottom: 8px;
font-size: 16px;
line-height: 130%; 
vertical-align: middle;
cursor:pointer;
}

textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}

INPUT[type=text]:hover, INPUT[type=search]:hover
 {background-color:#bbf5ff; 
 }

INPUT[type=text]:focus, INPUT[type=search]:focus
 {background-color: #bbf5ff; 
 }

textarea, select {
 padding:3px;
 border:1px solid #027fff;
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px; 
 box-shadow:1px 1px 2px #C0C0C0 inset;
 }

select {
 margin-top:10px;
 }

input[type=submit]:not(.loupe), input[type=button], input[type=reset]
{font-family: Arial,Verdana,Helvetica;
cursor:pointer;
font-size: 15px;
font-weight: bold;
margin-bottom: 10px;
border : none;
border-radius : 8px;
moz-border-radius : 8px;
-webkit-box-shadow : 4px 4px 5px rgba(0,0,0,0.6);
-moz-box-shadow : 4px 4px 5px rgba(0,0,0,0.6);
box-shadow : 4px 4px 5px rgba(0,0,0,0.6);
color : #ffffff;
padding : 4px 20px;
background : #56739a;
background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#56739a), color-stop(100%,#73a7eb));
background : -moz-linear-gradient(top, #56739a 0%, #73a7eb 100%);
background : -webkit-linear-gradient(top, #56739a 0%, #73a7eb 100%);
background : -o-linear-gradient(top, #56739a 0%, #73a7eb 100%);
background : -ms-linear-gradient(top, #56739a 0%, #73a7eb 100%);
background : linear-gradient(top, #56739a 0%, #73a7eb 100%);
filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#56739a', endColorstr='#73a7eb',GradientType=0 );
}

input[type=submit]:hover:not(.loupe), input[type=button]:hover, input[type=reset]:hover, input[type=submit]:focus:not(.loupe), input[type=button]:focus, input[type=reset]:focus
 {background : #56739a;}
 
input[type=submit]:active:not(.loupe), input[type=button]:active, input[type=reset]:active
 {-webkit-box-shadow : 4px 4px 5px rgba(0,0,0,0.6) inset;
-moz-box-shadow : 4px 4px 5px rgba(0,0,0,0.6) inset;
box-shadow : 4px 4px 5px rgba(0,0,0,0.6) inset;
 }


.menu_recherche_mobile_container {display: none;} 

@media screen and (max-width: 767px) {
.menu_recherche_mobile_container
{display: inline-block; 
top: 12px;
left: 90px;
padding: 0;
margin: 0;
}

.form_recherche_mobile {margin: 0; padding: 0; width: 100%;}

input.loupe {
	cursor:pointer;
	background:url("images/loupe.png") no-repeat 0 0;
	background-size: contain;
	width:25px;  
	height: 25px;
	border: none;
	
}}
/* ---------------------- TEMOIGNAGES / CONTACT ---------------------- */

#temoignage
{display: block;
clear: both;
margin: 0 30px 0 30px;
min-height: 50px;
font-size: 15px;
line-height: 150%;
}

#temoignage .temoignage_pseudo
{display: inline-block;
margin: 10px 10px 10px 10px;
width: 160px;
}

#temoignage .temoignage_texte
{display: inline-block;
margin: 10px 10px 10px 0;
text-align: left;
color: #3f4144;
vertical-align: top;
width: calc(100% - 210px);
}

@media screen and (max-width: 767px) {
#temoignage .temoignage_pseudo {width: calc(100% - 20px);}
#temoignage .temoignage_texte {display: block; margin: 0 10px 10px 10px; width: calc(100% - 20px);}	
} 
 
 
 /* ---------------------- PAGE PRECEDENTE / PAGE SUIVANTE ---------------------- */
 
ul.page_prec_suiv
{display: inline-block;
text-align: center;
margin: 30px auto 10px auto;
padding: 0;
font-weight: bold;
font-size: 16px;
text-align: center;
}

li.page_prec_suiv_texte
{float: left;
margin: 0 10px;
padding: 0;
list-style-type: none;
box-sizing: border-box;
}

li.page_prec_suiv_nombre
{float: left;
margin: 0 5px;
padding: 0;
list-style-type: none;
box-sizing: border-box;

}

li.page_prec_suiv_nombre a, li.page_prec_suiv_texte a
{border: solid 1px #56739A;
margin: 0;
padding: 6px 12px; 
transition: background-color .5s, color .5s;
}



li.page_prec_suiv_nombre a:hover:not(.actif), li.page_prec_suiv_texte a:hover:not(.actif)
{background-color: #56739A;
color: white;
}

li.page_prec_suiv_nombre .actif
{background-color: #56739A;
color: white;
}


@media screen and (max-width: 900px) and (min-width: 768px){
li.page_prec_suiv_nombre a, li.page_prec_suiv_texte a {padding: 4px 10px; }
li.page_prec_suiv_texte, li.page_prec_suiv_nombre {margin: 0 2px;}
}

@media screen and (max-width: 500px) {
li.page_prec_suiv_nombre a, li.page_prec_suiv_texte a {padding: 4px 10px; }
li.page_prec_suiv_texte, li.page_prec_suiv_nombre {margin: 0 2px;}
}

/* ---------------------- PUBLICITE ---------------------- */

div .publ
{display: block;
margin: 10px auto 10px auto;
width: 98%; 
box-sizing: border-box;
height: auto;
text-align: center;
}
/*
@media screen and (max-width: 600px) {
div .publ {width: 90%; }
}*/

/* ---------------------- REGLES RESPONSIVE ---------------------- */

div .grand_ecran {display: block;}
div .inline_grand_ecran {display: inline;}
div .mobile {display: none;}
div .inline_mobile {display: none;}

@media screen and (max-width: 767px) {
div .grand_ecran {display: none;}
div .inline_grand_ecran {display: none;}
div .mobile {display: block; margin: auto;}
div .inline_mobile {display: inline;}
.jssocials-share-link { border-radius: 50%; }
}