@charset "utf-8";
/* CSS Document */

*,html,body{
	margin:0; padding:0;
	box-sizing: border-box;}
	
body{
	background:url(../../img/bg-white.gif) repeat-y center #f0f0f0;
	font-family: 'Open Sans', sans-serif;}
.clear{
	clear:both;
	height:0px;}
h2{ display:none }
h3{
	font-weight:800;
	background:url(../../img/titleLine.png) no-repeat left top;
	color:#024c99;
	padding-top:10px;
	margin-left:15px;
	margin-bottom:15px;
	margin-top:60px;
	font-size:35px;}
p{
	font-size:18px;
	color:#737373;
	margin-bottom:30px;
	margin-top:30px;
	padding:0 15px;}
ol,ul{
	font-size: 18px;
	color: #737373;
	list-style-image:url(../../img/bullet.png);
	margin-left:29px;}
li{
	margin-bottom:5px;}

/*   HEADER AND MENU   */
#headerContainer{
	background:url(../../img/astrebnl-header.jpg) center no-repeat;
	background-size:cover;
	width:100%;
	height:100vh;
	z-index:0;
	position:relative;
	}
#headerContent{
	width:950px;
	height:600px;
	margin:0 auto;
	position:relative;}
#headerContent #logoAstre{
	position:absolute;
	top:28px;
	left:0}
#headerContent #beneluxUK{
	position:absolute;
	top: 150px;
	left: 0;
	font-size: 28px;
	color:#234992;
	font-weight:600;
	}
#headerContent #headerQuote{
	position:absolute;
	top:30vh;
	right:40px;
	color:#024c99;
	font-size:5vh;
	line-height:5.5vh;
	font-weight:800;
	text-transform:uppercase;}
#headerContent #headerQuote p{
	color:#024c99;
	font-size:5vh;
	line-height:5.5vh;
	font-weight:800;}
ul#langChoice{
	margin:0;
	position:absolute;
	right:0;
	padding-left:10px;
	top:0;
	width:86px;
	height:28px;
	background:#034d99;
	list-style:none;
	font-size:14px;}
ul#langChoice li{
	margin:0;
	float:left;}
ul#langChoice li a{
	color:#ffffff;
	display:block;
	margin-top:4px;
	margin-right:5px;
	font-weight:700;
	text-decoration:none;}
ul#langChoice li a:hover, ul#langChoice li a.active{
	color:#f9de28;}
#mainContainer{
	position:relative;
	width:950px;
	margin:0 auto;
	margin-top:-100px;
	z-index:1;}
#mainContent{
	position:relative;
	width:870px;
	background:#FFFFFF;
	margin:0 auto;}

ul#mainMenu{
	margin:0;
	display: flex;
    flex-wrap: wrap;
    justify-content:space-between;
    list-style: none;
	width:870px;
	background:#034d99;
	height:45px;
}
ul#mainMenu li{
	margin:0;}
ul#mainMenu li a{
	padding: 0.45rem 2.2rem;
    font-size: 1.4rem;
    max-width: 400px;
    font-weight: 600;
    text-decoration: none;
    display: flex;
    align-items:flex-start;
    color: #fff;}

ul#mainMenu li a:hover,ul#mainMenu li a.active {
      background: #f9de28;
      color:#034d99;}
	  

/* MENU MOBILE */	
.toggle-menu {
	width: 50px;
	height: 50px;
	display: none;
	position: fixed;
	top: 0px;
	right: 5px;
	z-index:50;
}
.toggle-menu i {
	position: absolute;
	display: block;
	height: 3px;
	background: #024c99;
	width: 30px;
	right: 15px;
	-webkit-transition: all .3s;
	        transition: all .3s;
}
.toggle-menu i:nth-child(1) { top: 16px; }
.toggle-menu i:nth-child(2) { top: 24px; }
.toggle-menu i:nth-child(3) { top: 32px; }
.open-menu i:nth-child(1) {
	top: 25px;
	-webkit-transform: rotateZ(45deg);
	        transform: rotateZ(45deg);
}
.open-menu i:nth-child(2) { background: transparent; }
.open-menu i:nth-child(3) { 
	top: 25px;
	-webkit-transform: rotateZ(-45deg);
	        transform: rotateZ(-45deg);
}

#mobileMenu{
	background-color:#f9de28;
	width:100%;
	height:100%;
	z-index:40;
	top:0; left:0;
	position:fixed;
	display:none;}
#mobileMenu #mob_header{
	z-index:2;
	width:100%;
	height:160px;
	position:relative;}
#mobileMenu #mob_logoEverland{
	position:absolute;
	top:15px; left:15px;}	
#mobileMenu #mob_txtEverland{
	position:absolute;
	top: 145px;
	left: 14px;
	font-size: 28px;
	color:#024c99;
	font-weight:700;}	
#mobileMenu #mob_langChoice{
	text-align:center;
	position:fixed;
	color:#024c99;
	font-family: 'Open Sans', sans-serif;
	font-weight:700;
	font-size:14px;
	list-style:none;
	width:110px;
	margin:0;
	margin-left:-55px;
	left:50%;
	bottom:10%;}
#mobileMenu #mob_langChoice li{float:left; margin-right:25px; margin-bottom:0;}
#mobileMenu #mob_langChoice li.last{margin-right:0;}
#mobileMenu #mob_langChoice a{
	color:#024c99;
	text-decoration:none;}
#mobileMenu #mob_langChoice a:hover{
	color:#fff;}
#mobileMenu #mob_langChoice a.active{
	color:#fff;}

#mobileMenu #mob_menu{
	text-align:center;
	position:fixed;
	font-weight:700;
	font-size:7vw;
	text-transform:uppercase;
	list-style:none;
	width:100%;
	left:0px;
	top:40%;
	line-height:6vw;
	margin:0;}
#mobileMenu #mob_menu a{
	color:#024c99;
	text-decoration:none;}
#mobileMenu #mob_menu a:hover,#mobileMenu #mob_menu a.active{
	color:#fff;}	  


/*   HP MAP   */
#map{
	width:inherit;
	height:422px;
	position:relative;}
#membersMap{
	width:inherit;
	height:422px;
	position:relative;}
#membersMap #mapBG{
	z-index:2;
	position:absolute; top:0; left:0;}
#membersMap .mapPointer{
	z-index:4;
	position:absolute;
	background:url(../../img/map-point.png) no-repeat;
	background-size:cover;
	cursor:pointer;
	width:29px;
	height:41px;}
#membersMap .mapPointer.site{
	z-index:3;
	width:18px;
	height:25px;}
#membersMap .mapPointer.active,#membersMap .mapPointer:hover{
	background:url(../../img/map-selected-point.png) no-repeat;
	background-size:cover;}
#mapUnderLeft{
	float:left;
	position:relative;
	}
#mapUnderLeft #mapArrow{
	position:absolute;
	background:url(../../img/map-arrow.png) no-repeat;
	top:-17px;
	left:26px;
	width:33px; height:17px;
	z-index:3;}
#mapChoice{
	width:435px;
	height:217px;
	background-color:#024c99;
	padding:42px;}
#mapChoice h4{
	font-family: 'Mr Dafoe', cursive;
	font-size:44px;
	color:#f9de28;}
#mapChoice p{
	font-size:16px;
	color:#ffffff;}
#mapGrayBox{
	background-color:#f0f0f0;
	width:435px;
	height:217px;}
#mapInfo{
	float:left;
	background-color:#f9de28;
	width:435px;
	height:434px;
	color:#024c99;
	padding-left:36px;
	padding-right:36px;
	padding-top:25px;}
#closeMap{ display:none;}
#mapInfo h4{
	font-size:35px;
	margin-bottom:15px;}
#mapInfo p{
	font-size:18px;
	margin-bottom:30px;
	padding:0;}
#mapInfo a{
	border:#024c99 1px solid;
	padding:5px 10px;
	width:250px;
	color:#024c99;
	text-decoration:none;
	font-size:16px;
	text-transform:uppercase;
	font-weight:600;}





a.memberLogoLink{
	margin-right:50px;}
a.memberLogoLinkNoMargin{
	margin-right:0;}
.memberPage{
	padding-top:45px;
	margin-left:50px;}
.memberPage a.memberLogoItem{
	display:block;
	float:left;
	margin-right:150px;
	margin-bottom:50px;}
.memberPage a.memberLogoItem.right{
	margin-left:0;
	margin-right:0;}
#logoTitleContainer{margin:0 auto; text-align:center; width:420px;}
.membreLogoTitle{
	width:400px;
	margin-top:40px;
	margin-bottom:20px;
	/*margin:40px 0 20px 230px;*/}
#memberInfosMobile{
	display:none;}
.siteEtFiliales h4{
	color:#024c99;
	font-size:24px;
	padding: 0 15px;}
.siteEtFiliales p{
	margin:0;
	font-size:15px;}
.siteEtFiliales a{
	color:#024c99; text-decoration:none;}
.siteEtFiliales a:hover{
	text-decoration:underline;}
#membersPictures{
	width:870px;}	
#membersPictures div{
	float:left;
	height:290px;
	width:290px;}	
#membersPictures .widePic{
	width:580px;}
#membersPictures .blueBox{
	background-color:#024c99;}
#membersPictures .yellowBox{
	background-color:#f9de28;}
#membersPictures #memberInfos{
	background-color:#f9de28;
	color:#024c99;
	padding:15px 25px 0 25px;}
#membersPictures #memberInfos h4{
	font-size:24px;
	margin:0 0 15px 0;}
#membersPictures #memberInfos p{
	font-size:15px;
	color:#024c99;
	margin:0 0 15px 0;
	padding:0;}
#membersPictures #memberInfos a{
	color:#024c99;
	text-decoration:none;}
#membersPictures #memberInfos a:hover{
	text-decoration:underline;}
	
	
	
		
	
.contactPage a{
	color:#024c99;
	text-decoration:none;}
.contactPage a:hover{
	text-decoration:underline;}
	
#footerContainer{
	width:950px;
	background:#024C99;
	height:100px;
	margin:0 auto;
	position:relative;
	margin-top:100px;}
#footer{
	width:870px;
	margin:0 auto;
	padding-top:22px;
	height:54px;}
#footer #logo{
	float:left;}
#footer #copyright{
	float:right;
	color:#fff;
	padding-top:22px;
	font-size:14px;}
#footer #copyright a{
	color:#fff;
	text-decoration:none;}
#footer #copyright a:hover{
	text-decoration:underline;}
	
	/* POUR LES ECRANS PLUS PETITS QUE 1000 PIXELS*/
	
@media (max-width : 1000px ) and (orientation:landscape){
	#headerContent #headerQuote p{
		font-size:6vh;
		line-height:6.5vh;
		margin:0; padding:0;
		padding-left:15px;}
	#mobileMenu #mob_menu{
		top:30%;
		font-size:6vh;
		line-height:5vh}
	#mobileMenu #mob_langChoice{
		bottom:10px;;}
	}
	
@media (max-width : 1000px ) and (orientation:portrait){	
	#headerContent #headerQuote p{
		font-size:7vw;
		line-height:7.5vw;
		margin:0; padding:0;
		padding-left:15px}	
}
@media (max-width : 1000px ){
	h2{
		display:inline;
		font-weight:800;
		background:url(../../img/titleLine.png) no-repeat left top;
		color:#024c99;
		padding-top:10px;
		margin-left:15px;
		margin-bottom:15px;
		margin-top:60px;
		font-size:35px;}
	h3{ font-size:30px;}
	.toggle-menu{
		display:inline-block;}
	#langChoice,ul#mainMenu{
		display:none;}
	#mainContainer,#mainContent{
		width:100%;
		margin:0;
		padding:0;
		margin-top: -25px;
		padding-top: 1px;}
	#headerContainer{
		width:100%;
		margin:0;
		padding:0;
	}
	#headerContent{
		width:100%;
		margin:0;
		padding:0;
		height:100vh;}
	#headerContent #logoAstre{
		position:absolute;
		top:15px;
		left:15px;}
	#headerContent #beneluxUK{
		position:absolute;
		top: 145px;
		left: 14px;}
	#headerContent #headerQuote{
		position:absolute;
		bottom:15%;
		top:auto;
		right:auto;
		left:0px;
		width:100%;}
		
	#headerContainer.lightOnMobile{
		background:none;
		height: 260px;
		}
	#headerContainer.lightOnMobile #headerContent{
		width:100%;
		height:260px;
		margin:0;
		padding:0;}
	#headerContainer.lightOnMobile #headerContent #headerQuote{
		display:none;}
	
	
		
	#footerContainer{
		width:100%;}
	#footer{
		width:100%;}
	#footer #copyright{
		width:80%;
		margin-right:15px;
		text-align:right;}
	#footer #logo{
		float:left;
		margin-left:15px;}
	#map{
		width:100%;}
	#membersMap{
		width:100%;}

	#mapUnderLeft{
		display:none;
		}
	#mapInfo{
		display:none;
		position:fixed;
		top:0;
		left:0;
		width:100%;
		height:100%;
		background-color:#024c99;
		color:#ffffff;
		z-index:99;
		padding:50px 25px;
		}
	#closeMap{
		z-index:101;
		position:fixed;
		top:15px;
		right:15px;
		width:26px;
		height:26px;
		cursor:pointer;}
	#mapInfo p{
		color:#ffffff;}
	#mapInfo a{
		border:#ffffff 1px solid;
		padding:5px 10px;
		width:250px;
		color:#ffffff;
		text-decoration:none;
		font-size:16px;
		text-transform:uppercase;
		font-weight:600;}
		
	a.memberLogoLink{
		width:25%;
		margin-right:4%;
		margin-left:4%;}
	a.memberLogoLink img{
		width:25%;}
	a.memberLogoLinkNoMargin{
		width:25%;
		margin-left:4%;}
	a.memberLogoLinkNoMargin img{
		width:25%;}
	
	.memberPage{
		margin:0;}
	.memberPage a.memberLogoItem{
		width:42%;
		margin-right:5%;
		margin-left:5%;
		margin-bottom:50px;}
	.memberPage a.memberLogoItem img{
		width:100%;}
	.memberPage a.memberLogoItem.right{
		margin-right:0;}

	
#memberInfos{
	display:none;}
.blueBox,.yellowBox{
	display:none}
#membersPictures{
	width:100%;}
#membersPictures div{ height:auto;}
#membersPictures .widePic img,#membersPictures .squarePic img{ margin-bottom:15px;}
#membersPictures .widePic,#membersPictures .widePic img{ width:100%}
#membersPictures .squarePic img{ width:100%}
#membersPictures .squarePic{ width:50%}
#memberInfosMobile{
	display:block;
	width:435px;
	height:auto;
	margin:0 auto;
	background-color:#f9de28;
	color:#024c99;
	padding:15px 25px;}
#memberInfosMobile h4{
	font-size:24px;
	margin:0 0 15px 0;}
#memberInfosMobile p{
	font-size:15px;
	color:#024c99;
	margin:0 0 15px 0;
	padding:0;}
#memberInfosMobile a{
	color:#024c99;
	text-decoration:none;}
#memberInfosMobile a:hover{
	text-decoration:underline;}
}

	/* POUR LES ECRANS PLUS PETITS QUE 770 PIXELS*/
@media (max-width : 770px ){
	#footer #copyright{
		width:425px;
		padding-top:8px;}
}
	/* POUR LES ECRANS PLUS PETITS QUE 570 PIXELS*/
@media (max-width : 570px ){
	#footer #copyright{
		width:310px;}
	.memberPage a.memberLogoItem{
		width:90%;
		margin-right:5%;
		margin-left:5%;
		margin-bottom:50px;}
	.memberPage a.memberLogoItem.right{
		margin-right:5%;
		margin-left:5%;}
}
	/* POUR LES ECRANS PLUS PETITS QUE 450 PIXELS*/
@media (max-width : 450px ){
	#footer #copyright{
		width:240px;
		padding-top:0px;}
	.memberIllu{
		width:95%}
	#memberInfosMobile{
		display:block;
		width:100%;}
	#logoTitleContainer{width:100%;}
	.membreLogoTitle{
		width:100%;}
}