@charset "utf-8";
/*
CSS Document
ROUGE CLAIR : #FB0A01
ROUGE FONCE : #C50802
*/

.menuHamburger { display:none; }
.menu { width:100%; position:relative; }
	.bandeMenu { width:100%; display:flex; flex-wrap:wrap; position:absolute; top:0.45vw; left:0; right:0; padding:0 2vw; z-index:1; color:#FFFFFF; align-items:center; font-size:1.2vw; justify-content:space-between; }
		.bandeMenuBar { display:flex; flex-wrap:wrap; }
	.bandeMenuAdd { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:right; }
		.bandeMenuAdd div { padding:0 1vw; }
			.bandeMenuAdd div a:link, .bandeMenuAdd div a:visited { color:#FFFFFF; }
			.bandeMenuAdd div a:hover, .bandeMenuAdd div a:active { color:#000000; }
			.bandeMenuAdd div img { width:2vw; height:auto; }
		.bandeMenuBackgroundTop { width:100%; background-color:#FB0A01; }
		.bandeMenuBackgroundBottom { width:100%; background-color:#C50802; }

/* The navigation menu */
.navbar { overflow:hidden; }

/* Navigation links */
.navbar a { float:left;font-size:1.2vw; text-align: center; padding:0 1vw; text-decoration: none; text-transform:uppercase; }
	.navbar a:link, .navbar a:visited { color:#FFFFFF; }
	.navbar a:hover, .navbar a:active { color:#000000; }
	.navbar a font { color:#000000; }

/* The subnavigation menu */
.subnav { float:left; overflow:hidden; }

/* Subnav button */
.subnav .subnavbtn { font-size:1.2vw; border:none; outline:none; color:#FFFFFF; padding:0 1vw; margin:0; background:none; text-transform:uppercase; }

/* Add a red background color to navigation links on hover
.navbar a:hover, .subnav:hover .subnavbtn { color:#FFFFFF; }
*/

/* Style the subnav content - positioned absolute */
.subnav-content { display:none; position: absolute; left:0; background-color:#C50802; width:100%; z-index:1000000; padding:1vw 2vw; }

/* Style the subnav links */
.subnav-content a { float:left; color:#FFFFFF; text-decoration: none; font-size:0.8vw; background-color:#000000; margin:0 0.5vw; padding:0.5vw 1vw; border-radius:0.5vw; border:#000000 1px solid; }


/* Add a grey background color on hover */
.subnav-content a:hover { background:none; color:#FFFFFF; border-color:#FFFFFF; }

/* When you move the mouse over the subnav container, open the subnav content */
.subnav:hover .subnav-content { display:flex; flex-wrap:wrap; z-index:999999; }

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

}

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

}

@media only screen and (max-width:600px) {
	.menu { display:none; }
	.menuHamburger { position:fixed; width:100%; padding:2vw 4vw; display:flex; flex-wrap:wrap; background-color:#000000; color:#FFFFFF; justify-content:center; font-size:8vw; }
	
	.overlay { position:fixed; top:0; left:0; width:100%; height:0%; z-index:10000000; background-color:rgb(0,0,0); background-color:rgba(0,0,0, 0.9); overflow-y:hidden; transition: 0.5s; }
		.overlay-content { position:relative; top:6rem; width:100%; text-align: center; margin-top:0; }
			.overlay-content-line { width:100%; display:flex; flex-wrap:wrap; padding:0.5rem 0; border-bottom:#FFFFFF 1px solid; font-size:1rem; }
				.overlay-content-line-picto { width:35%; padding-right:4rem; }
				.overlay-content-line a { color:#FFFFFF; }
				.overlay-content img { max-width:5rem; height:auto; padding:0.5rem 0; }
		.overlay .closebtn { position:absolute; top:1rw; right:4vw; font-size:4rem; color:rgba(197,8,2); }
			.overlay .closebtn a { color:rgba(197,8,2); }
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
	.overlay a { font-size: 20px}
	.overlay .closebtn { font-size: 40px; top: 15px; right: 35px; }
}