/*---------Font Family---------

@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body {
    font-family: 'Rubik', sans-serif !important;
    background-color: white !important;
}

*/

body {
    background-color: white !important;
}

.hero .slideshow-type-bullet ul, .hero .non-slideshow-type-bullet ul{
    background-color: white !important;
}

.homepage-content-desktop{
    background-color: white !important;
}

#logo{
    background: url("https://s3.eu-central-1.amazonaws.com/img.smartair.co.il/custom/NewHomepage2020/logo.png") no-repeat !important;
    height: 24px !important;
    width: 134px !important;
    top: 25px !important;
}



#navbar-header{
    position: fixed;
}


/*-------------------------------Hero Image----------------------------*/

.hero.fix.hero--searchengine.se-on-top-0{
    height: 357px !important;
}

.slideshow-type-bullet.trav-width-handler-0.10483{
    height: 357px !important;
}

.hero.fix .slideshow-type-bullet ul, .hero.fix .non-slideshow-type-bullet ul{
    height: 353px !important;
}

.hero.fix .slideshow-type-bullet ul li, .hero.fix .non-slideshow-type-bullet ul li{
    background-image: url(https://s3.eu-central-1.amazonaws.com/img.smartair.co.il/custom/NewHomepage2020/Hero1919x323.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
 /*   transform: scale(1.2); */
    height: 340px !important;
}

.container-full-width .hero .slideshow-type-bullet ul li img, .container-full-width .hero .non-slideshow-type-bullet ul li img{
    display: none !important;
}

.search-area.template-hero-wide{
    position: unset !important;
    margin-bottom: 0px !important; /*When uploading to prod, needs to remove the script which has margin-bottom*/
    margin-top: 33px !important; 
}

/*-------------Search Engine design----------------*/

.search_engine_container .form-area .group-form .group-label.group-label-button{
    margin-left: 6px;
    background: #f0f0f4;
    border-radius: 5px;
}
.search_engine_container .form-area .group-label.group-label-date-field{
    margin-left: 6px;
    background: #f0f0f4;
    border-radius: 5px;
    cursor: pointer;
}

.search_engine_container .form-area input.last, .search_engine_container .form-area .chosen-single.last, .search_engine_container .form-area select.last, .search_engine_container .form-area .passengers.last{
    border-bottom-left-radius: 5px !important;
    border-top-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    border-top-right-radius: 5px !important;
}

.ri-map-pin-2-fill{
    color: #333f48;
}

.ri-calendar-event-fill{
    color: #333f48;
}

.search_engine_container .form-area .group-label.airport-group input[type='text'], .search_engine_container .form-area .group-label.group-label-date-field input[type='text']{
    color: #333f48;
}

/*--------------Search engine fields----------------- */


.group-label.group-label-button.outbound-city-group.airport-group.outbound-city-group-package{
    width: 210px !important;
}

.group-label.group-label-button.inbound-city-group.airport-group.inbound-city-group-package{
    width: 210px !important;
}

.search_engine_container .form-area .group-label.group-label-date-field{
    width: 232px !important;
}

.group-label.group-label-button.pax-group{
    width: 167px !important;
}

.search_engine_container .form-area .sf-submit-block input[type='submit']{
    width: 228px !important;
}



.search_engine_container .form-area .passengers.pax-hotel, .search_engine_container .form-area .passengers.pax-package{
    width: 181px !important;

}

.search_engine_container .form-area .passengers.pax-hotel .fa, .search_engine_container .form-area .passengers.pax-package .fa{
    float: right;
    margin-left: 5px;
}

.fa-bed {
    display: none;
}

.group-button.sf-submit-block{
    margin-left: 6px !important;
}


/*-------------------Tabs above the search engine--------------------------*/
.search-area.template-hero-wide .search_engine_toggler{
    height: 42px !important;
    width: 591px;
    background: #f0f0f4;
    border-radius: 25px;
    border-radius: 25px;
    border: solid 3px #F0F0F4;
}
.search-area.template-hero-wide .search_engine_toggler ul{
    height: 36px;
    width: 585px;
}

.search-area.template-hero-wide .search_engine_toggler ul li{
    margin-bottom: 36px;
    height: 36px;
    border-radius: 25px;
}

.search-area.template-hero-wide .search_engine_toggler ul li:first-child{
    width: 225px;
}

.search-area.template-hero-wide .search_engine_toggler ul li a{
    background: #f0f0f4;
    color: #3B3E4D;
    height: 7px;
}
.search-area.template-hero-wide .search_engine_toggler ul li:first-child a{
    border-radius: 25px;
}

.search-area.template-hero-wide .search_engine_toggler ul li:last-child a{
    border-radius: 25px;
}


.search-area.template-hero-wide .search_engine_toggler ul li a.active{
    color: #1b5af9;
    background: white;
    border-radius: 25px;
}

.search-area.template-hero-wide .search_engine_toggler ul li a.active:hover{
    background: white;
}

.search-area.template-hero-wide .search_engine_toggler ul li a:hover {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 25px;
    height: 7px;
}

.search-area.template-hero-wide .search_engine_toggler ul li:first-child a.active{
    width: 225px;
}

.search-area.template-hero-wide .search_engine_toggler ul li:first-child a{
    width: 225px;
}
/*Hidding of red line */
.search-area.template-hero-wide .search_engine_toggler ul li a.active:after, .search-area.template-hero-wide .search_engine_toggler ul li a:hover:after{
    height: 0px !important;
}

.search-area.template-hero-wide .search_engine_toggler ul li a:after{
    height: 0px !important;
}

/*Icons in Tabs */

.search-area.template-hero-wide .search_engine_toggler ul li a i{
    display: block !important;
    margin-right: 22px;
    position: absolute;
    font-size: 23px;
    margin-top: -16px;
    font-weight: 100;
}

/*--------- Flights only options ------------*/
.search_engine_container .form-area .more-options-top, .search_engine_container .form-area .mo-wrap{
    top: -70px !important;
}
.search_engine_container .form-area .more-options-top .mo-trig{
    background: transparent !important; /* When going live with this new design, need to remove the background of this element from smartair_style.css*/
    color: #1b5af9 !important; 
    letter-spacing: 0.2px;
    font-size: 13px !important;
    padding: 6px 30px !important;


}

#mo-roundtrip{
    width: 202px;
    height: 153px;
    border: solid 1px #bfc3c6;
    right: 250px;
    top: -82px !important;
}

#mo-class{
    width: 202px;
    height: 250px;
    border: solid 1px #bfc3c6;
    z-index: 100;
}

.topopt-{
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.topopt-PE{
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px; 
}

#mo-direct{
    width: 202px;
    border: solid 1px #bfc3c6;
    right: 86px;
    top: -82px !important;
}

.mo-allfl-opt{
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.mo-directfl-opt{
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px; 
}

.search_engine_container .form-area .mo-wrap ul li{
    border-top: unset;
    height: 50px;
    width: 200px;
    padding: 15px 25px !important;
}

.search_engine_container .form-area .mo-wrap ul li.topopt-1{
    background: unset !important;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.search_engine_container .form-area .mo-wrap ul li.topopt-0{
    background: unset !important;
}


.search_engine_container .form-area .mo-wrap ul li.topopt-2{
    background: unset !important;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
}

.search_engine_container .form-area .mo-wrap ul li:hover{
    background-color: #f7f8f9 !important;
}

.search_engine_container .form-area .mo-wrap ul li.active{
    color: #3e3e52;
    font-weight: bold;
    letter-spacing: 0.2px;
    line-height: 1.58;
}

.search_engine_container .form-area .mo-wrap ul li.active::before{
    display: none;
}


.fa.fa-close.etOutboundProxy-remove.icon-remove{
    margin-right: 15px;
}

.clearfix{
    height: unset !important;
}

/*Open Jaw*/

.open-jaw--align{
    margin-top: 6px;
}

.open-jaw--align .group-form{
    display: block !important;
}

.open-jaw--align .group-form .group-label.group-label-button.second-outbound-city-group.airport-group{
    width: 243px;
}

.open-jaw--align .group-form .group-label.group-label-button.second-inbound-city-group.airport-group{
    width: 242.67px;
    margin-left: 2px;
}

/*------------------------------------------DESKTOP SCRIPTS----------------------------------------------*/
/*-----------------JavaScript, just for note --------------------------------
setTimeout(Changes, 500);
function Changes() {

$('.search-area.template-hero-wide').insertAfter('.hero.fix.hero--searchengine.se-on-top-0')

/*-----------------Icons for package tab--------------------------------
$('#airport_search_form_airport').next().removeClass('icon-plane').addClass('ri-map-pin-2-fill')
$('#package_search_form_city').next().removeClass('fa fa-building-o').addClass('ri-map-pin-2-fill')
$('#search_engine_search_engine_pack_inbound_date').next().removeClass('fa fa-calendar-o').addClass('ri-calendar-event-fill')

/*-----------------Icons for flight tab--------------------------------
$('#search_engine_search_engine_flight_outbound_airport').next().removeClass('icon-plane').addClass('ri-map-pin-2-fill');
$('#search_engine_search_engine_flight_inbound_airport').next().removeClass('icon-plane').addClass('ri-map-pin-2-fill');
$('#search_engine_search_engine_flight_inbound_date').next().removeClass('fa fa-calendar-o').addClass('ri-calendar-event-fill');

/*-----------------Icons for hotel tab--------------------------------
$('#hotel_search_form_city').next().removeClass('fa fa-building-o').addClass('ri-map-pin-2-fill');
$('#search_engine_hotel_inbound_date').next().removeClass('fa fa-calendar-o').addClass('ri-calendar-event-fill');


/*-------------------Tabs Icons------------------------
$('a[data-search_engine=".search_engine_package"]').html('<i class="ri-suitcase-2-fill"></i><div style="margin-right: 15px; margin-top: -8px;"><span style="height: 13px; width: 24px; background: #1b5af9; color: white; margin-left: 7px; border-radius: 3px; letter-spacing: 0.55px; padding-top: 1px; padding-bottom: 1px; padding-left: 4px; padding-right: 4px;">חדש</span><span style="color: #333f48 !important;">חבילה בהרכבה</div>');
$('a[data-search_engine=".search_engine_flight"]').html('<i class="ri-plane-line" style="margin-right: 55px; transform: rotate(270deg);"></i><div style="margin-right: 15px; margin-top: -8px;"><span style="color: #333f48 !important;">טיסה</div>');
$('a[data-search_engine=".search_engine_hotel"]').html('<i class="ri-hotel-fill" style="margin-right: 55px;"></i><div style="margin-right: 15px; margin-top: -8px;"><span style="color: #333f48 !important;">מלון</div>');

}; //End of timeout changes
/*-----------------------Colors change-------------------------------------------

setTimeout(ColorChange, 550);
function ColorChange() {
$('.ri-map-pin-2-fill').css('color','#333f48');
$('.ri-calendar-event-fill').css('color','#333f48');
};







/*-------------------------------------------------------Mobile Display!!!!-------------------------------------------------------*/

@media(max-width: 900px){
    .container-full-width.container-header{
        position: unset !important;
    }
    #navbar-header{
        position: unset;
    }
    .container-full-width{
        position: unset;
        --webkit-position: unset;
    }

    .fa.fa-bars{
        color: #1b5af9;
    }

    #navbar-header #new-search-results-header .mobile-header-menu{
        margin: 15px 0 0 10px;
    }

    #logo{
        margin-left: 20px;
        right: 60% !important;
        transform: unset !important;
    }

    .container #logo{
        left: 0% !important;
    }


    #searchEngineMobile{
        background: white;
    }

    #searchEngineMobile .search-engine-toggler-mobile ul{
        border-top: unset;
        background: #f0f0f4;
        border-radius: 25px;
        width: 85%;
        margin-left: auto;
        margin-right: auto;
        border: solid 3px #f2f5f7;
        height: 46px;

    }

    #searchEngineMobile .search-area{
        background: white !important;
    }

    #searchEngineMobile .search-engine-toggler-mobile .search-type-option, #searchEngineMobile .search-engine-toggler-mobile ul li a{
        border-bottom: unset;
        color: #333f48;

    }
    

    #searchEngineMobile .search-engine-toggler-mobile{
        background: white; 
    }
    #searchEngineMobile .search-engine-toggler-mobile ul li{
        width: 70%;
    }

    #searchEngineMobile .search-engine-toggler-mobile .search-type-option.active, #searchEngineMobile .search-engine-toggler-mobile ul li a.active{
        background: white !important;
        border-radius: 25px !important;
        height: 40px;
        color: #1b5af9 !important;
        border-bottom: unset !important;

    }
    
    #searchEngineMobile .form-option{
        background: #f0f0f4;
        border: unset;
        padding: 20px 16px;
        height: 60px;
        margin: 0 auto 6px;
    }

    .search-form-oneway.clearfix{
        margin-left: 10px;
        margin-right: 10px;
    }
    #searchEngineMobile .search-form-search-button{
        width: 94%;
        height: 60px;
        padding-top: 9px;
        margin-right: 10px;
        font-weight: 500;
        margin-left: 10px;
    }
    .form-option-image{
        position: absolute;
        margin-top: -4px;
    }
    .form-option-container{
        margin-right: 30px;
        margin-left: 30px;
    }

    .col-xs-24.form-option.non-stop .form-option-container{
        margin-left: 15px;
    }

    .search-date-fields{
        margin-right: 30px;
        margin-left: 30px;
    }

    #searchEngineMobile .form-option .form-option-image i{
        color: #333f48;
    }
    .search-form-header{
        background: white !important;
        max-width: 265px !important;
        margin: 0 auto 30px !important;

    }

    #searchEngineMobile .search-form-header .search-type-option, #searchEngineMobile .rooms-switcher .search-type-option, #searchEngineMobile .search-form-header .room-button, #searchEngineMobile .rooms-switcher .room-button{
        flex: unset !important;
        border-radius: 25px !important;
        width: 30px;
        height: 30px;
        border: solid 1.6px #1b5af9;
    }

    #searchEngineMobile .search-form-header .search-type-option.active, #searchEngineMobile .rooms-switcher .search-type-option.active, #searchEngineMobile .search-form-header .room-button.active, #searchEngineMobile .rooms-switcher .room-button.active{
        background: #1b5af9 !important;
    }

    .hero.fix.hero--searchengine .slideshow-type-bullet{
        display: none;
    }

    .search-type-option{
        padding: 8px !important;
    }

}

.search-form-search-button i{
    position: absolute;
    left: 85px;
    font-size: 20px;
}

#searchEngineMobile .form-option .styled-checkbox:checked+label:before{
    background: #1a58f5;
}

#searchEngineMobile .form-option .styled-checkbox+label:before{
    border: 1px solid #1a58f5;
}


/*-----------------JavaScript, just for note --------------------------------


setTimeout(MobChanges, 150);
function MobChanges(){
$('#searchEngineMobile').append('<div class="TabTitle" style="margin-right: 28px; margin-top: 20px; font-size: 18px; letter-spacing: 0.64px; font-weight: 500;"><div class="pkg"><span style="height: 13px; width: 24px; background: #1b5af9; color: white; margin-left: 7px; border-radius: 3px; letter-spacing: 0.55px; padding-top: 1px; padding-bottom: 1px; padding-left: 4px; padding-right: 4px;">חדש</span><span>חבילה בהרכבה</span></div><div class="flt" style="display: none;">טיסה</div><div class="htl" style="display: none;">מלון</div></div>');
$('.TabTitle').insertAfter('.search-engine-toggler-mobile');

$(document).on('click', function() {
if($('.search-engine-toggler-mobile ul li:nth-child(1) a').hasClass('active')){
    $('.pkg').css('display','block');
    $('.flt').hide();
    $('.htl').hide();
};

if($('.search-engine-toggler-mobile ul li:nth-child(2) a').hasClass('active')){
    $('.pkg').hide()
    $('.flt').css('display','block');
    $('.htl').hide();

};

if($('.search-engine-toggler-mobile ul li:nth-child(3) a').hasClass('active')){
    $('.pkg').hide();
    $('.flt').hide();
    $('.htl').css('display','block');

};

});

$('a[data-search-engine="package"]').html('<i class="ri-plane-line"></i><span style="font-size: 15px;">+</span><i class="ri-hotel-fill"></i>');
$('a[data-search-engine="flight"]').html('<i class="ri-plane-line"></i>');
$('a[data-search-engine="hotel"]').html('<i class="ri-hotel-fill"></i>');


};

let width = window.innerWidth;
if(width<=900){
setTimeout(MobChangesColor, 200);
function MobChangesColor(){
    $('a[data-search-engine="package"] .ri-plane-line').css('font-size','20px');
    $('a[data-search-engine="package"] .ri-plane-line').css('margin-right','5px');
    $('a[data-search-engine="package"] .ri-hotel-fill').css('font-size','20px');
    $('a[data-search-engine="package"] .ri-hotel-fill').css('margin-left','5px');
    $('a[data-search-engine="flight"] .ri-plane-line').css('font-size','20px');
    $('a[data-search-engine="hotel"] .ri-hotel-fill').css('font-size','20px');
};


setTimeout(TxtAboveSE, 150);
function TxtAboveSE(){
    $('body').append('<div class="TxtAboveSE" style="height: 80px; width: 289px; margin-left: auto; margin-right: auto; font-size: 30px; margin-top: 36px; margin-bottom: 29px; color: #333f48; letter-spacing: 0.4px; font-weight: 500;"><div>החופשה שלך</div><div>מתחילה כאן</div></div>');
    $('.TxtAboveSE').insertBefore('.dummy-homepage-also');
};

setTimeout(iconChange, 200);
function iconChange(){
    $('.icon-plane').removeClass('icon-plane').addClass('ri-map-pin-2-fill');
    $('.fa.fa-user').removeClass('fa fa-user').addClass('ri-user-fill');
    $('.fa.fa-calendar-o').removeClass('fa fa-calendar-o').addClass('ri-calendar-event-fill');
    $('.fa.fa-building-o').removeClass('fa fa-building-o').addClass('ri-map-pin-2-fill');
    $('.fa.fa-heart').removeClass('fa fa-heart').addClass('ri-coupon-3-fill');
};

setTimeout(fltType, 200);
function fltType(){
    $('.search-form-header').append('<div class="flttitles" style="position: absolute; margin-top: 35px; margin-right: -15px; letter-spacing: 0.2px;"><span class="rt" style="margin-left: 80px;">הלוך ושוב</span><span class="ow" style="margin-left: 58px;">כיוון אחד</span><span class="oj">חזרה מיעד אחר</span></div>')
    $('.search-type-option.roundtrip-option').html('');
    $('.search-type-option.oneway-option').html('');
    $('.search-type-option.openjaw-option').html('');
    
    
    
    $(document).on('click', function(){
    
    if($('.search-type-option.roundtrip-option').hasClass('active')){
        $('.rt').css('font-weight','bold');
        $('.ow').css('font-weight','normal');
        $('.oj').css('font-weight','normal');
    };

    if($('.search-type-option.oneway-option').hasClass('active')){
        $('.ow').css('font-weight','bold');
        $('.oj').css('font-weight','normal');
        $('.rt').css('font-weight','normal');
    };

    if($('.search-type-option.openjaw-option').hasClass('active')){
        $('.oj').css('font-weight','bold');
        $('.ow').css('font-weight','normal');
        $('.rt').css('font-weight','normal');
    };


    });
};

};

