/**** conception et integration par Raphael Wittmannn et EXOTISMES 
 * author url : https://raphaelwittmann.net/
 ******/

/*
 *  FONTS
 */ 
body, input { font-family: 'lato', 'Arial', sans-serif; }

.pageHeader h1, .yellowStars:after, .pageHeader.destinationHeader h2, .pokerTxt { font-family: 'lato-light', 'Arial', sans-serif; }


/*
 *  GENERAL
 */ 
html { height: 100%; }
body { background: #E84E0F; font-size: 16px; line-height: 1; color: #FDEDE7; text-align: center; min-height: 100%; }
.contentWrapper { color: #002A3F; background: #E84E0F; overflow-x: hidden; width: 100%;  }
a { text-decoration: none; color: #002A3F;  }


.clearfix:before, .clearfix:after { clear: both; content: " "; display: table; }

.yellowStars { font-size: 9px; letter-spacing: -0.7px; white-space: nowrap; padding: 0 12px 0 0; position: relative; top: -2px; display: inline-block; }
.normeNL:after { 
    content: 'NL'; font-size: 8px; line-height: 8px; letter-spacing: 0.3px;
    position: absolute; right: -2px; top: 1px; z-index: 1;
}

.normeNF:after { 
    content: 'NF'; font-size: 8px; line-height: 8px; letter-spacing: 0.3px;
    position: absolute; right: -2px; top: 1px; z-index: 1;
}


img { display: block; max-width: 100%; height: auto; }

.btn, input[type="submit"] { background: #002A3F; border: 1px solid #002A3F; color: #fff; border-radius: 16px; padding: 5px 15px; font-size: 13px; display: inline-block; }
.btn:hover, input[type="submit"]:hover { background: #fff; color: #002A3F; }
/*
 *  Structure
 */ 
.mainContent { position: relative; padding-bottom: 50px; }
/*
 *  HEADER
 */ 

.navBar { background: #fff; color: #002A3F; border-bottom: 1px solid #E84E0F; display: flex; justify-content: space-between; align-items: center; }
.messagesLink { border-left: 1px solid #E84E0F; position: relative; width: 40px; height: 40px; text-align: center; }
.messagesLink i { font-size: 21px; line-height: 40px; }
.messagesLink .notificationDot { position: absolute; right: 3px; top: 3px; font-size: 10px; line-height: 15px; background: #E84E0F; border-radius: 100%; width: 15px; text-align: center; font-weight: bold; }
.messagesLink:hover, .backHeaderLink:hover { background-color: rgba(232, 78, 15, 0.1); } 

.backHeaderLink { border-right: 1px solid #E84E0F; width: 40px; height: 40px; text-align: center; font-size: 21px; line-height: 40px; color: #E84E0F;}
.navBar h1 { color: #E84E0F; font-size: 21px; }

.iconExo { height: 16px; width: auto; margin: 0 10px; }
.logoExo { height: 16px; width: auto; margin-right: 40px; }

/*
 *  MENU
 */ 
.navigationWrapper { display: none; }
body.home .navigationWrapper { display: block; }

.mainNavigation { text-align: left; display: flex; justify-content: center; align-items: center; padding: 25px 20px;  }
.mainNavigation ul li { border-bottom: 1px solid #fff; }
.mainNavigation ul li:last-child { border-bottom: 0; }
.mainNavigation ul li a { color: #fff; font-size: 21px; display: block; padding: 10px 0 10px 40px; position: relative; }
.mainNavigation ul li a:hover { opacity: 0.9; }
.mainNavigation ul li a i { opacity: 0.7; margin-right: 10px; position: absolute; z-index: 1; left: 0; top: 8px; }

.downloadsWrapper { background: #fff; padding: 15px 20px 10px; color: #002A3F; font-size: 11px; }
.downloadsWrapper ul { margin-top: 5px; display: flex; justify-content: center; }
.downloadsWrapper ul li { margin: 5px 5px; }

/*
 *  Log in
 */ 

.logTopWrapper { background: #fff; color: #002A3F; font-size: 14px; line-height: 1.2; padding: 20px; min-height: 60vh; display: flex; flex-direction: column; justify-content: space-around; }
.logLogoWrapper { color: #E84E0F; font-size: 11px; line-height: 1.2; padding-bottom: 20px; }
.logLogoWrapper .logLogo { max-width: 212px; margin: 15px auto; width: 100%; }
.logLogoWrapper .logIcon { max-width: 108px; margin: 0 auto; width: 100%; }

.logForm p { margin: 12px 0 5px; }
.logFieldset { display: flex; justify-content: center; }
.NumeroReza { display: none; }
.logForm input[type="text"], .logForm input[type="number"], .logForm input[type="password"] { border: 2px solid #002A3F; text-align: center; max-width: 113px; padding: 5px; color: #002A3F; line-height: 26px; font-size: 20px; letter-spacing: 1px; }
.logForm input.userLoginInput { max-width: 154px; }
.logForm .submitLink { cursor: pointer; background: #002A3F; color: #fff; border: 0; width: 40px; line-height: 40px; margin-left: 2px; display: block; }

.logBottomWrapper { color: #fff; padding: 20px; min-height: 40vh; display: flex; justify-content: center; align-items: center; }
.agenceNamelabel { font-size: 11px; opacity: 0.7; }
.agenceName { font-size: 17px; margin: 15px 0; }
.agenceContacts ul { display: flex; justify-content: center; }
.agenceContacts ul li { margin: 0 10px;  }
.agenceContacts ul a { color: #E84E0F; background: #fff; border-radius: 100%; display: block; height: 40px; width: 40px; line-height: 40px; text-align: center; font-size: 20px; }
.agenceContacts ul a:hover { background: rgba(255,255,255, 0.7); }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none;  margin: 0;}
input[type=number] {  -moz-appearance: textfield;}

/*
 *  Urgence
 */ 

.urgenceWrapper { padding: 25px 0; color: #fff; }
.urgenceForm { background: #fff; border-radius: 3px; padding: 20px; margin: 25px auto 15px; text-align: left; max-width: 500px; color: #002A3F; }
.urgenceForm label { display: block; font-size: 14px; margin-bottom: 4px; }
.urgenceForm input[type="text"], .urgenceForm input[type="email"] { display: block; margin-bottom: 15px; background: #fff; border: 1px solid #002A3F; color: #002A3F; width: 100%; border-radius: 3px; font-size: 15px; padding: 7px; }
.urgenceForm input[type="text"]:focus, .urgenceForm input[type="email"]:focus { color: #E84E0F; }

.notNow { font-size: 11px; }
.notNow a { text-decoration: underline; }

.iti {
	color : #002A3F;
	width : 100%;
	margin-bottom: 20px;
}
/*
 *  Home
 */ 

.agencePartnerWrapper { background: #002A3F; border-radius: 20px 20px 0 0;  position: fixed; z-index: 99; bottom: 0; left: 20px; right: 20px; color: #fff; }
.agenceTopInfos { padding: 10px 20px; }
.agencePartnerWrapper .agenceContacts { display: none; padding: 15px 20px 25px; }
.agencePartnerWrapper .agenceName { margin: 5px 0 0; }

/*
 *  Page content
 */ 
.pageContent { padding: 15px 20px; }

.pageTitle { font-size: 11px; }
.pageRef { font-size: 11px; margin-top:15px;  }

.pageContent h3 { font-size: 20px; text-align: left; position: relative; color: #fff; margin: 5px 20px 5px 0; }
.pageContent h3:after { content: ''; display: block; border-top: 1px solid #fff; width: 100%; height: 0; position: relative; z-index: 0; top: -10px; } 
.pageContent h3 .titleFilet { background: #E84E0F; display: inline-block; padding: 0 5px 5px 0; position: relative; z-index: 1;}

.alerteWrapper { background: #002A3F; color: #fff; font-size: 11px; padding: 10px; border-radius: 3px; line-height: 1.4; text-align: left; margin: 0 20px 20px;  display: flex; align-items: center; }
.alerteWrapper > i { font-size: 20px; margin-right: 10px; }
.alerteWrapper a { color: #fff; text-decoration: underline; }


/*
 *  Vols
 */ 
.volItemWrapper { margin-bottom: 15px; width: calc(100% + 20px); }
.volNumber { text-align: left;  }
.volNumber > span { display: inline-block; background: #FADACC; border-radius: 3px 3px 0 0; padding: 5px 10px; font-size: 12px; color: #E84E0F; }
.volItemContent { display: flex; align-items: center; }
.volItemInfos { background: #fff; color: #002A3F; border-radius: 0 3px 3px 3px; padding: 10px 10px; text-align: left; width: calc(100% - 20px); font-size: 13px; }
.volItemInfos p { margin-bottom: 5px; display: flex; }
.volItemInfos p:last-child { margin-bottom: 0; }
.volItemInfos .volDate { margin-right: 20px; }
.volItemInfos .volHeure { margin-right: 20px; }

.volItemLink { text-align: center; color: #fff; width: 40px; line-height: 30px; }

.btnWrapper { padding-top: 15px; }

/*
 *  Passagers
 */ 
.itemsList { padding: 18px 0; }
.itemsList .itemInList { background: #fff; text-align: left; border-radius: 3px; padding: 15px; margin-bottom: 15px; }
.itemsList .itemInList p { margin-bottom: 5px; }
.itemsList .itemInList p:last-child { margin-bottom: 0; }
.smallTxt { font-size: 11px; }
.orangeTxt { color: #E84E0F; }

.noResults { color: #fff; margin: 35px 0; font-style: italic; }

.itemLinkInList { display: flex; align-items: center; }
.itemLinkInList > .thumbnail { width: 50px; height: auto; margin-right: 15px; }
.itemLinkInList > .itemInfos { width: calc(100% - 100px); margin-right: 10px; }
.itemLinkInList > .itemInfos h5 { font-weight: bold; }
.itemLinkInList > .itemInfos p { margin-top: 5px; font-size: 13px; }
.itemLinkInList > .arrowIcon { width: 25px; }

/*
 *  Ma liste
 */ 

.maListeWrapper { text-align: left; margin-top: 15px; }
.maListeWrapper ul li { margin-bottom: 10px; border-top: 1px solid #fff; padding-top: 10px; }
.maListeWrapper ul li input[type="checkbox"] { display: none; }
.maListeWrapper ul li label { padding-left: 25px; position: relative; }
.maListeWrapper ul li label:before { content:''; display: block; width: 20px; height: 20px; border: 1px solid #fff; position: absolute; z-index: 1; top: -2px; left: 0; border-radius: 100%; }
.maListeWrapper ul li label:after { content:''; display: none; width: 14px; height: 14px; background: #fff; position: absolute; z-index: 1; top: 1px; left: 3px; border-radius: 100%; }

.maListeWrapper ul li input[type="checkbox"]:checked + label:after { display: block; }

.moreInfos { display: inline-block; border: 1px solid #002A3F; font-size: 11px; line-height: 18px; border-radius: 100%; height: 20px; width: 20px; text-align: center; float: right; position: relative; top: -2px; font-weight: bold;  }
.infosContent { display: none; }


/*
*  Formalités d'entrées
*/


/*.formalitesContainer {
	background-color: white;
	color : #002A3F !important;
	text-align: justify;
	padding : 10px;
	
}


.formalitesContainer h3::after {
	display: none;
}


.formalitesContainer ul li {
	list-style: disc;
    list-style-position: inside; 
    margin-top: 3px;    
}
*/


.formalitesContainer { font-size: 14px; line-height: 18px; background-color: #fff; padding :  20px; 	text-align: justify; }

.formalitesContainer h3 { color : #002A3F !important; padding-top : 10px; padding-bottom :  10px; text-align: center; }
.formalitesContainer h3::after { display: none; }

.formalitesContainer h2 { font-size: 22px !important;} 

.formalitesContainer h4 {
    color: #0082AE;
    margin-top: 18px;
    font-size: 20px;
    font-weight: bold;
}
.formalitesContainer p { margin-top: 18px; }
.formalitesContainer ul { list-style: disc; margin-left: 12px; margin-top: 9px; margin-bottom: 9px; }
.formalitesContainer ul li { list-style: disc; margin-top: 3px; }

.formalitesContainer p.smallTxt { margin-top: 5px; color: #666; font-size: 12px; line-height: 16px; }

.formalitesContainer .excerpt { font-size: 18px; line-height: 26px; }

.formalitesContainer blockquote {
    font-size: 22px; line-height: 25px; color: #868686; font-style: italic; margin-bottom: 10px; padding-left: 40px;
    position: relative; letter-spacing: 0.3px;
}

.formalitesContainer a { text-decoration: underline;  }

/*
* Light box
*/

body.lightboxActivated { position: fixed; left: 0; right: 0; }
.lightBoxWrapper { display: block; position: fixed; z-index: 9999; top: 0; left: 100%; right: 0; bottom: 0; overflow-x: hidden; overflow-y: auto; background: rgba(0,42,63,0.7); opacity: 0; transition: opacity 0.2s ease; pointer-events: none; visibility: hidden;}
.lightboxActivated .lightBoxWrapper { display: block; visibility: visible; opacity: 1; left: 0; pointer-events: auto; }
.lightBoxWrapper .lightBoxContent { opacity: 0; transition: opacity 0.4s ease, top 0.4s ease; position: relative; top: -30px; }
.lightboxActivated .lightBoxWrapper .lightBoxContent { opacity: 1; top: 0; }

.lightBoxWrapper .lightbox { padding: 50px 20px; display: flex; align-items: center; justify-content: center; overflow: scroll;  min-height: 100%; }
.lightBoxContent { background: #fff; color: #002A3F; border-radius: 3px; padding: 35px 20px; text-align: left; max-width: 740px; position: relative; }
a.closeLightBox { position: absolute; z-index: 1; right: 10px; top: 0px; display: block; color: #E84E0F; cursor: pointer; padding: 2px; font-size: 22px; opacity: 0.7; }
a.closeLightBox:hover { opacity: 1;  } 
.lightBoxContent a { text-decoration: underline; }



/*
 *  Messages
 */ 

.messageInList { background: #fff; border-radius: 3px; padding: 10px; margin-bottom: 15px; text-align: left; }
.messageInList > a { position: relative; padding-left: 15px; display: block; }
.messageInList h5 { margin-top: 3px; }
.messageInList .messageDate { opacity: 0.5; }
.messageInList.messageNonLu h5 { font-weight: bold; } 
.messageInList.messageNonLu > a:before { content:''; display: block; width: 10px; height: 10px; background: #002A3F; border-radius: 100%; position: absolute; left: 0px; top: 17px; }


/*
 *  Hebergement
 */ 
.hebergementInList { display: flex; align-items: center; margin-bottom: 15px; width: calc(100% + 20px); } 
.hebergementInfos { background: #fff; border-radius: 3px; padding: 10px; text-align: left; width: calc(100% - 20px); font-size: 13px; }
.hebergementDate { font-weight: bold; }
.hebergementPhoto { margin-bottom: 10px; border-radius: 3px 3px 0 0; }
.hebergementOptions { margin: 5px 0; }
.hebergementInList .chambre { opacity: 0.5; }
.itemLink { text-align: center; color: #fff; width: 40px; line-height: 30px; }



/*
 *  Count down
 */ 

.countDownWrapper { display: none;  }
#dateVoyage { display: none; }
.countDown { color: #fff; font-size: 15px; line-height: 1.3; margin-top: 10px; }
.labelCountDown { white-space: nowrap; }


.homeDektopWrapper { padding: 15px 20px; max-width: 700px; margin: 0 auto; }

.homeRecapitulatif { display: none; }
.homeRecapitulatif p { margin-top: 15px; }
.homeRecapitulatif a { font-weight: bold; border-bottom: 1px solid #002A3F; display: inline-block; padding-bottom: 3px; }

/*
 *  Fin du voyage
 */ 
.navBar3 { background: #fff; color: #002A3F; display: flex; justify-content: space-between; align-items: center; }
.messagesLink3 { position: relative; width: 40px; height: 40px; text-align: center; }
.messagesLink3 i { font-size: 21px; line-height: 40px; }
.messagesLink3 .notificationDot { position: absolute; right: 3px; top: 3px; font-size: 10px; line-height: 15px; background: #E84E0F; border-radius: 100%; width: 15px; text-align: center; font-weight: bold; }


.backHeaderLink2 { border-right: 1px solid #E84E0F; width: 40px; height: 40px; text-align: center; font-size: 21px; line-height: 40px; color: #E84E0F;}
.navBar3 h1 { color: #E84E0F; font-size: 21px; }

.iconExo3 { height: 16px; width: auto; margin: 0 10px; }
.logoExo3 { height: 16px; width: auto; margin-right: 40px; }

 
 /*
 *  Déconnexion
 */ 
.navBar2 { background: #fff; color: #002A3F; display: flex; justify-content: space-between; align-items: center; }
.messagesLink2 { position: relative; width: 40px; height: 40px; text-align: center; }
.messagesLink2 i { font-size: 21px; line-height: 40px; }
.messagesLink2 .notificationDot { position: absolute; right: 3px; top: 3px; font-size: 10px; line-height: 15px; background: #E84E0F; border-radius: 100%; width: 15px; text-align: center; font-weight: bold; }
.messagesLink2:hover, .backHeaderLink2:hover { background-color: rgba(232, 78, 15, 0.1); } 

.backHeaderLink2 { border-right: 1px solid #E84E0F; width: 40px; height: 40px; text-align: center; font-size: 21px; line-height: 40px; color: #E84E0F;}
.navBar2 h1 { color: #E84E0F; font-size: 21px; }

.iconExo2 { height: 16px; width: auto; margin: 0 10px; }
.logoExo2 { height: 16px; width: auto; margin-right: 40px; }

.textLogout { display: inline-block; font-size: 16px; padding-bottom: 3px; }
.linkLogout { font-weight: bold; display: inline-block;   padding-bottom: 3px; text-decoration:  underline !important; }
.wonderpush-bell{display : none !important;}

.homeSocial {
	/*bottom: 0;
	position: absolute;*/
    padding: 15px 0 20px;
    background: url(../../img/dot-horizontal.png) repeat-x 0 0, url(../../img/dot-horizontal.png) repeat-x 0 100%;
    margin-top: 30%;
    color: #666;
    font-size: 13px;
}

.homeSocial div {
  margin-top: 10px;	
}

.homeSocial label {
  margin-top: 10px;	
}

.homeSocial a { 
    color: #999999; font-size: 28px; line-height: 44px; border: 2px solid #999; background: #fff; height: 48px; width: 48px; 
    text-align: center; border-radius: 30px; position: relative; top: 5px; margin-left: 5px; outline: 0; display: inline-block;
}
.homeSocial a[href*="facebook"] {margin-left:0px}

.homeSocial a i:before { position: relative; top: 1px; } 

.homeSocial a:hover { background: #666; color: #fff; border-color: #666; }

