/* =Responsive Structure / mobile first
----------------------------------------------- */



@media (min-width: 370px) {
    
    
    
    
}

@media (min-width: 520px) {
    

      
    .container { padding: 0 50px 0; }
    #mobile-menu ul li a, .pageMainColMain, .contentFullPageSection, 
    .singleProductOtherSection, .main, .espaceProTopForm, .espaceProTopInfos  { padding-left: 50px; padding-right: 50px; }

    
    /*** home ***/
    .slideshowContainer { padding-top: 50px; }
    .homeSlideshow, .homeSlideshowItems, .homeSlideshowItems img.backgroundImage { height: 400px; }
    .slideItemContainer .messageImageLink { top: 50px; }
    
  
    
    .priceTableQty, .priceTableHeaderQty, .priceTableNBpeople, .priceTableHeaderNBpeople { display: table-cell; }
    
    
    /*** slick slider / carousel ***/
    .slick-list { padding-right: 0; margin-right: 0; }
    .slick-list:before { display: none; } 
    
    
}










@media (min-width: 768px) {
    

    
    .breadcrumb { display: block; }
    
    #menuPro { display: block; }
    .logoPro a.logoImage { position: relative; display: block; }
    .logoPro a.logoImage:after { 
        content: ''; position: absolute; right: -40px; top: 16px; z-index: 2; width: 35px; height: 32px;
        background: transparent url(img/vignette-logo-pro.png) no-repeat 0 0; background-size: 32px 32px;
    }
    
    /*** home ***/

    .partnersWebsiteArea { background: #333 url(img/partner-map.png) no-repeat 50% 50%; }
    
    
    .allDestinationsLink { float: right; max-width: 200px; padding-top: 10px; }
    .homeSearchWrapper form { float: left; width: 400px; margin-top: 0; }
    
    .homeLeftColumn .container { float: left; width: 50%; }
    .homeLeftColumn .pubTvArea { float: right; width: 50%; }
    
    .optionsForm { text-align: right; }
    
    .homeSlideRoomsWrapper { display: block; }
    .homeSlideshow, .homeSlideshowItems, .homeSlideshowItems img.backgroundImage { height: 600px; }
    .homeSlideshowItems img.messageImage { max-height: 420px; }
    
    .homeSocialCol { padding: 50px 50px; }
    
    .productCarousel .sejourVignette { float: left; width: 50%; }
    
    /*** footer ***/
    .FooterLinksListsRow { text-align: left; }
    .footerColumnInner { min-height: 280px; padding-top: 50px; }
    .footerList li { margin-bottom: 5px; }
    .footerList li span { display: block; }
    
    .footerPhone span { margin-top: 0; }
    
    .footerIconsLinks { text-align: center; }
    .footerIconsLinks > div { float: left; width: 25%; border: 0; text-align: center; padding: 25px 45px; }
    .footerIconsLinks a { border: 2px solid #FFF; border-radius: 20px; padding: 5px 15px; justify-content: center;  }
    .footerIconsLinks a i { font-size: 35px; line-height: 50px; }
    .footerIconsLinks a label {  }

    
    /*** liste sejour ***/
    .productInfos { padding-top: 0; }
    .productInfos .sejourPrice { float: right; width: 140px; margin-top: 0; }
    .thematiquesListWrapper .container { padding-top: 50px; padding-bottom: 50px; }
    
    .pagePagination { padding-top: 0; display: inline-block; text-align: center; }
    
    .sejourListDescriptionTxt { width: 70%; float: left; padding: 50px 0 100px; }
    
    .sejourListDescriptionIcon { width: 15%; float: left; padding-top: 65px; font-size: 80px; }
    
    .sejourItemInList.col-sm-6:nth-child(odd) { clear: both; }
    
    /*** liste combines ***/
    .combineFeatures { background-color: rgba(232, 78, 15, 0.1); margin-left: -142px; padding: 13px 10px 10px 150px; float: right; width: 100%; position: relative; z-index: 1; }
    .combineListTotal { float: left; }
    .combineListTextLink { float: right; }
    .combinesList .productInfos .sejourPrice { float: left; position: relative; z-index: 2; width: 142px; border-right: 2px solid #fff; }
    
    /*** single sejour ***/
    .unslider-arrow, .produitSliderWrapper .slick-arrow { bottom: 5px; }
    .unslider-arrow.next, .produitSliderWrapper .slick-arrow.slick-next { right: 5px!important; }
    .unslider-arrow.prev, .produitSliderWrapper .slick-arrow.slick-prev { right: 45px; }
    
    .imagesRightSection img:first-child { margin-top: 0; }
    .productImageRoom img { width: auto; height: 104px; float: right; }
    
    .excursionImageWrapper { margin-bottom: 0; float: left; width: 30%; padding-right: 20px; }
    .excursionDescriptionWrapper { float: right; width: 70%; }
    .excursionHeader .excursionTitle, .excursionInfos { float: left; width: 100%; margin-right: -120px; padding-right: 120px; }
    .excursionHeader .excursionPrice, .excursionInfosWrapper .readMoreWrapper { float: right; width: 120px; text-align: right; }
    
    .singleProductOtherSection .sejourVignette { float: left; width: 25%; padding-left: 15px; padding-right: 15px; }
    .singleProductOtherSection .sejourVignette:nth-child(4n+1) { clear: both; }
    
    
    /*** single combine ***/
    
    .hotelInSingleCombineList { text-align: left; padding-bottom: 15px; }
    .hotelInSingleCombineList .hotelThumbnail { padding-right: 10px; padding-bottom: 0; }
    
    .hotelInSingleCombineList ul.productMediaLinks { font-size: 12px; line-height: 15px; text-align: right; padding-top: 0; padding-bottom: 0; }
    .hotelRowName { padding: 10px 0 0; min-height: 60px; }
    
    .hotelFormule { padding-top: 0; padding-bottom: 0; }
    .HotelDetailsDisplayLinks { text-align: right; position: relative; top: -10px; }
 
    /*** tarifs ***/
    .tarifsPageHeader1 h2 { float: left; width: 70%; }
    .supplementsLink { float: right; width: 30%; margin-top: 0; text-align: right; }
    
    #tarifCancel span { display: inline; }
    
    .tarifs1MainForm form p { float: left; width: 100%; }
    .tarifs1MainForm form label { float: left; width: 35%; text-align: right; padding: 7px 20px 0 0; }
    .tarifs1MainForm form .bootstrap-select { float: left; width: 45%; }
    
    .tarifs1MainForm form .radioBtnLine p { display: inline; float: none; width: auto; margin-top: 0; }
    .tarifs1MainForm form .radioBtnLine label { display: inline-block; float: none; }
    .tarifs1MainForm form .radioBtnLine label.radioCompagnieLabel  { text-align: left; position: relative; top: 30px; width: auto; }
    .iconCompagnie { top: 7px; margin-left: 10px; }
    .tarifs1MainForm form .radioBtnLine .helper { display: inline-block; }
    
    
    /*** tarifs 2 ***/
    .tarifs2InfosRecap { width: 80%; margin: 0 auto; }
    .tarifs2InfosRecap .infoItem { float: left; width: 40%; margin-left: 20%; }
    .tarifs2InfosRecap .infoItem:nth-child(2n+1) { clear: both; margin-left: 0; }
    
    /*** tarifs 3 ***/
    
    .tarifs3MainRow .sectionHeader h2 { float: left; }
    .tarifs3MainRow .sectionHeader .sectionHeaderRight { float: right; padding-top: 15px; }
    .tarifs3MainRow .sectionHeader .sectionHeaderRight label { margin-left: 10px; }
    
    .tarifs3MainRow .flightRow { float: left; width: 100%; }
    .tarifs3MainRow .flightNumber { float: right; width: 20%; text-align: right; }
    .tarifs3MainRow .flightDeparture, .tarifs3MainRow .flightArrival { float: left; width: 40%; }
    .tarifs3MainRow .flightDeparture span, .tarifs3MainRow .flightArrival span { display: block; }
    .tarifs3MainRow .flightArrival i { display: block; }
    
    .assuranceName, .assuranceNickname { display: inline; }
    
    /*** tarifs 4 ***/
    .priceTable td, .priceTable thead th { padding: 10px; }
    
    .sectionHeaderTarifsTable h2 { float: left; }
    .sectionHeaderRight { float: right; }
    
    .specialOfferInfos { float: left; }
    .specialOfferThumbnail { margin-bottom: 0; float: right; width: 175px; }
    
    .buyerLeftFields { float: left; width: 47%; }
    .buyerRightFields { float: right; width: 47%; }
    .buyerAddressWrapper { min-height: 141px; }
    
    /*** espace Pro ***/
    .espaceProFirstRow  { padding-top: 30px; }
    .espaceProFirstRow > .row { display: flex; }
    .espaceProTopInfos  { padding-left: 30px; padding-right: 30px; height: 100%; border-radius: 2px; }
    .espaceProTopForm { border-radius: 2px; }
    
    .espaceProTopForm p { float: left; width: 48%; margin-left: 4%; margin-bottom: 20px; }
    .espaceProTopForm p:nth-child(2n+1) { clear: both; margin-left: 0; } 
     
    
    .espaceProSejourListSection .sejourVignette { float: left; width: 20%; }
    
    .newsInList:nth-child(3n+1) { clear: both; }
    
    
    
}




@media (min-width: 992px) {
    
    /*** publicite accueil ***/
    .homeMobilePub { display: none; }
    .page-home .contentWrapper { background-color: #FFF; padding-top: 150px; background-repeat: no-repeat; background-position: 50% 0; background-image: url(../photos/pub-ecran.jpg); }
    .homeContent { max-width: 1180px; margin: 0 auto 0; background: #FFF;   }
    
    
    #menu-toggle { margin-top: 29px; }
    #logoWrapper a { padding-top: 33px; padding-bottom: 30px; width: 300px; }
    .logoPro a.logoImage:after { top: 29px; }
    #mobile-menu { top: 89px; height: calc(100% - 89px); }
    #mobile-menu ul > li .listWrapper { top: 89px; height: calc(100% - 89px); }
    
    #menuPro { font-size: 14px; line-height: 18px; }
    #menuPro > ul > li > a { padding-left: 15px; padding-right: 15px; }
    
    .homeSearchWrapper input[type="text"] { width: 300px; }
    
    /*** home ***/
    
    .homeSearchWrapper form { width: 600px; }
    
    
    .homeSlideshow { float: left; width: calc(100% - 266px); }
    .homeSlideshowItems img.roomImage { display: block; }

    .slideshowControls a { height: 15px; width: 15px; margin: 0 2px; }
    #skyPub { display: block; float: right; }
    
    
    .partnerTitle span { display: block; }
    
    .homeSocial a { font-size: 17px; line-height: 34px;  height: 38px; width: 38px; top: 2px; }
    
    .homeMainRow { position: relative; }
    
    .pubTvArea {  }
    
    .productCarousel .sejourVignette { width: 25%; }
    
    /*** footer ***/
    .footerColumnInner { padding-left: 45px; padding-right: 45px; min-height: 250px; }
    .footerRight { width: 150px; float: right; text-align: right; }
    .footerLeft { float: left; margin-left: 0; margin-right: 0; padding-left: 0; }
    
    .footerCenter { clear: none; padding-top: 2px; }
    
    /*** liste sejour ***/
    .container.filtersSearch { }
    
    .priceSliderMobileWrapper { display: none; }
    
    .filtersWidget ul li { padding: 4px 0; font-size: 14px; }
    .filtersWidget label:before { top: -2px; }
    .filtersWidget label:after { top: 2px; }
    
    .listSearchHeader { display: flex; }
    .listSearchHeader .submitWrapper { margin-left: 15px; padding: 0; }
    .listSearchHeader .magicTextSearchInput { max-width: 300px; }
    
    #moreFiltersArea { display: none; }
    .listSearchHeaderMobile { display: none; }
    
    .mobileOnlyText { display: none; }
    
    .filterMoisDepart, .filterNombreNuites { float: none; width: 100%; margin-right: 0;}
        
    /*** liste combines ***/
    .combineListHotelItem:hover { background-color: rgba(232, 78, 15, 0.05); } 

    
    /*** sejour single ***/
    
    .headerCloneWrapper { display: block; top: -100px; }
    .sejourSrollDown .headerCloneWrapper { top: -0px; }
    .mobileRsvpBtn { display: none; }
    .page-sejour #pageWrapper { padding-bottom: 0; }
    
    .sejourSlideshow ul li { }
    .unslider-arrow, .produitSliderWrapper .slick-arrow { bottom: 40px; }
    .unslider-arrow.next, .produitSliderWrapper .slick-arrow.slick-next { right: 35px!important; right: calc(7.5% - 35px) !important; }
    .unslider-arrow.prev, .produitSliderWrapper .slick-arrow.slick-prev { right: 72px; right: 7.5%; }
    
   
    
    .productImageRoom img { height: 108px; }
    
    .productPDFLink { padding-left: 50px; text-align: left; }
    .productPDFLink i { font-size: 40px; position: absolute; left: 0px; top: 10px; }
    
    .productPageHeaderRow {  }
    .productMainRow { }
    .pageMainColRight { float: right; width: 15%; display: block; }
    .pageMainColLeft { float: left; width: 15%; }
    .pageHeaderMain { width: 70%; background: #fff; position: relative; top: -25px; z-index: 2; padding: 0 25px; margin: 0 auto; }
    .pageHeaderMain:before { content: ''; position: absolute; width: 100%; height: 50px; left: 0; bottom: 100%; z-index: 1; background: #fff; }
    
    
    .singleNoteLink { border: 1px solid #E84E0F; padding: 20px; min-height: 128px; }
    .singleNoteLink:hover { background-color: rgba(232, 78, 15, 0.1); }
    .noteLink { display: block; }
    
    .productPageHeaderRow h1 { font-size: 44px; line-height: 44px; }
    
    .pageMainColMain { float: right; width: 70%; padding-left: 25px; padding-right: 25px; }
    .productPriceWrapper { min-height: 128px; margin-top: 0; text-align: left; padding: 30px 0 30px; display: flex; justify-content: space-between; align-items: last baseline; }
    
    .productPriceTitle { width: 20%; padding-top: 10px; margin-bottom: 0;  }
    .productPriceTitle span { max-width: 100px; display: block; }
    .singleProductPrice { width: 30%; padding-top: 0; margin-bottom: 0; }
    .singleProductPrice span { padding-bottom: 3px; padding-left: 2px; }
    
    .singleProductDuration {  width: 25%; padding-top: 40px; margin-bottom: 0; }
    
    .singleProductPriceComment { width: 25%;  padding: 5px 0 0; }
    
    
    .tarifsSpeciauxInfos { padding: 10px 0; }
    .tarifsSpeciauxInfos a { display: inline-flex; align-items: center; }
    .tarifsSpeciauxInfos > p { font-size: 13px; line-height: 16px; }
    .tarifsSpeciauxInfos a i { position: relative; top: -4px; }
    
    .avisClientHeader { display: flex; align-items: flex-end; justify-content: center; }
    .avisClientHeader > div { flex-grow: 1; }
    
    .avisClientHeader .noteWrapper { font-size: 12px; line-height: 14px; width: 80px; padding: 10px 10px 5px; }
    .avisClientHeader .note { font-size: 12px; padding-top: 5px; }
    .avisClientHeader .note span { font-size: 24px; }
    
    /*** single combine ***/
    .productPageHeaderRow.combinePageHeader .pageHeaderMain { padding: 0 25px; }
    .hotelsListHeader { text-align: left; }
    .hotelsListHeader h3 span { display: inline; }

    /*** home ***/
    .homeBottomRow { display: flex; justify-content: center; }
    .homeBottomRow .homeAboutUsText { width: 45%; padding-right: 50px; }
    .homeBottomRow .homeSocialCol { width: 30%;  }
    .homeBottomRow .pubTvArea { width: 25%; padding-right: 0; }
    .pubTvArea:before { content:''; display: block; position: absolute; z-index: 0; left: 100%; width: 1000px; top: 0; height: 100%; background-color: rgba(232, 78, 15, 0.2); }
    
    /*** tarifs ***/
    
    .tarifsBreadcrumb { display: block; }
    #tarifCancel { padding-top: 25px; }
                  
    .tarifs1MainForm { float: left; width: 68%; border-right: 1px solid #fff; }
    .tarifs1Conditions { padding-top: 45px; padding-bottom: 45px; float: right; width: 32%; }
    .tarifs1Conditions h4 { margin-bottom: 15px; }
    
    .hideOnMobile { display: inline; }
    .flip-scroll table { text-align: center; margin: 0 auto; }
    
    .tarifsPriceTableMobile { display: none; }
    .tarifsPriceTableScreen { display: block; }
    
    .mobileFixedBtn { display: none; }
    
    /*** tarifs etape 2 ***/
    
    .tarifs2FirstRow form fieldset.tarifs2FirstRowFirstLine p { float: left; width: 40%;  }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowFirstLine p:first-child, 
    .tarifs2FirstRow form fieldset.tarifs2FirstRowFirstLine p:last-child { width: 25%;  }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowFirstLine p.numberDigitSelectWrapper .bootstrap-select { float: none; display: inline-block; width: 50px; }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowFirstLine p label { float: left; width: 100%; text-align: right; padding: 5px 60px 0 0; margin-right: -50px; }
    
    .tarifs2FirstRow form fieldset.tarifs2FirstRowSecondLine  { text-align: center;   }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowSecondLine .radioBtnLine p { display: inline-block; }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowSecondLine p label { }
    .tarifs2FirstRow form fieldset.tarifs2FirstRowSecondLine p .bootstrap-select { width: 275px; }
    
    .tarifs2FirstRow form fieldset .radioBtnLine { padding-top: 10px; }
    .tarifs2FirstRow form fieldset .radioBtnLine li { display: inline-block; border: 1px dotted rgba(0, 42, 63, 0.3); padding: 10px; border-radius: 5px; margin: 10px 5px; }

    .tarifs2InfosRecap .infoItem { width: 30%; margin-left: 5%; }
    .tarifs2InfosRecap .infoItem:nth-child(2n+1) { clear: none; margin-left: 5%; }
    .tarifs2InfosRecap .infoItem:nth-child(3n+1) { clear: both; margin-left: 0; }
    
    /*** tarifs 3 ***/
    .tarifsSmallWidthSection { max-width: 600px; margin: 0 auto; }

    .tarifs3MainRow .sectionHeader h2, .tarifsPageHeader4 h2,  .passengersInfosSectionTitle { padding-right: 0; }
    .tarifs3MainRow .sectionHeader h2 > i , .tarifsPageHeader4 h2 > i, .passengersInfosSectionTitle > i { right: calc(100% + 10px);  }
    
    /*** espace pro ***/
    .espaceProMainForm { width: 85%; margin: 0 auto; }
    
    /*** Blog ***/
    .articleImageArea { margin-bottom: 0; }
    .articleInList { margin-bottom: 70px; }
    .blogTitleImage { max-width: 460px; }
    .singleArticleFooter { display: flex; align-items: center; width: 100%; justify-content: space-between; }
    .singleArticleFooter .socialShare ul li a { width: 60px; line-height: 56px; font-size: 30px; }
    .singleArticleFooter .back2BlogWrapper .btn { margin-top: 30px; }
    
    /*** Guides ***/
    
    .txt .sousMenuContent ul li a { padding: 15px 20px; }
    .txt .sousMenuContent ul li a:hover { padding-left: 25px; padding-right: 15px; }
}


@media (min-width: 1080px) {
    
    
    
    
    #menuPro > ul > li > a { padding-left: 23px; padding-right: 23px; }
    
    /*** home ***/
    
    .homeSearchWrapper form { width: 650px; }
    
    
    .slideshowControls {  bottom: 10px; }
    
    .partnerItem a img { max-width: 200px; }
    
    /*** liste sejour ***/
    
    /*** liste combines ***/
    .combineListHotelItem { margin-bottom: 7px; }
    
    /*** sejour ***/
    

    
    .productPDFLink { padding-left: 55px; }
    
    .productImageRoom img { height: 118px; }
    
    
    /*** combine ***/
    .hotelRowName { padding: 16px 0 0; }
    
    /*** tarifs ***/
    .tarifsStep { padding-right: 18px; padding-left: 15px; }
    #headerRightTarifs { width: 780px; }
    
    /*** tarifs 2 ***/
    .tarifs2FirstRow form fieldset.tarifs2FirstRowSecondLine p label {  width: auto; }
    
    
    /*** tarifs 3 ***/
    
    
}

@media (min-width: 1225px) {
    
    /*** header menu ***/
    .main-menu { display: block; }
    #mobile-menu, #menu-toggle { display: none; }
    #headerRight { display: block; }
    
    
    .back2topWrapper { position: fixed; right: 20px; bottom: 20px; width: 50px; height: 50px; padding: 0; background: transparent; display: none; z-index: 99; }
    .back2topWrapper a { color: #FFF; z-index: 999; display: block; border-radius: 5px; background: #E84E0F;  }
    .back2topWrapper a:hover { color: #fff; background: #002A3F; }
    .back2topWrapper a span { display: none; }
    .back2topWrapper a i { display: block; font-size: 30px;  }
    .back2topWrapper a i:before { line-height: 50px; }
    
    .productCarousel .sejourVignette { width: 20%; }
    
    /*** blog ***/
    .blogHomeContentWrapper .col-md-4 { padding-left: 70px; }
    .singleArticleHeader { margin-bottom: 50px; padding-top: 50px; }
    .singleArticleHeader img { border-width: 15px; }
}


@media (min-width: 1410px) {
    .containerLayout { margin-left: auto; margin-right: auto; max-width: 1400px; margin-left: auto; margin-right: auto; }
    
}



@media (min-width: 2140px) {
    #pageWrapper { margin: 0 10%; box-shadow: 0 0 50px rgba(0, 0, 0, 0.3); max-width: 80vw; }
    .containerLayout { margin-left: auto; margin-right: auto; }
    .headerCloneWrapper { padding: 0 10%; }
}