﻿/**
*   TVLY Responsive Styles
*
*/

@media screen and (max-width: 1200px) {
    #main-banner .bannerContent .main-logo img {
        width: 80%;
    }

    #main-banner .bannerContent h1 {
        font-size: 35px;
    }

    .single #main-banner .bannerContent {
        bottom: 10px;
    }

        .single #main-banner .bannerContent .main-logo {
            bottom: 45px;
        }

        .single #main-banner .bannerContent h1 {
            font-size: 28px;
        }
        #top-menu li {
            padding-right: 12px;
        }
}

@media screen and (max-width: 1024px) {
    #top-menu li {
        padding-right: 9px;
    }

    #main-banner .bannerContent {
        /*left: 20px;
        bottom: 20px;*/
    }

    .single #main-banner .bannerContent h1 {
        padding-bottom: 0;
    }

    .single #main-banner .bannerContent .main-logo {
        bottom: 30px;
    }

    .jcarSliderWrap ul li .posts li .recentPostContent h3 {
        font-size: 20px;
    }

    .jcarSliderWrap ul li .posts li:first-of-type .recentPostContent h3 {
        font-size: 25px;
    }

    .et_pb_pagebuilder_layout .entry-content {
        padding-left: 15px;
    }

    .site-footer-wrap {
        padding: 0 15px;
    }

        .site-footer-wrap li > a {
            margin-right: 8px;
        }

    .container {
        max-width: 96%;
    }

    #main-footer .container {
        max-width: 100%;
    }
}

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

    .et_header_style_centered #main-header {
        padding: 5px 0 5px;
    }

    .et_header_style_centered #main-header .container{
        height: 40px;
    }

    #main-header .logo_container {
        display: block;
        position: absolute;
        left: 0;
        bottom: 0;
    }

        #main-header .logo_container a {
            display: block;
        }

    .et_header_style_centered .mobile_nav .select_page {
        text-indent: -9999px;
    }

    .menu-travelocity-sub-menu-container {
        display: none;
    }

    .single .menu-travelocity-sub-menu-container {
        display: none;
    }

    #main-banner .bannerContainer {
        height: 244px;
        display: flex;
        justify-content: center;
    }

        #main-banner .bannerContainer img {
            height: 100%;
            display: block;
            width: auto;
            flex: none;
        }

    .single #main-banner .bannerContent {
        bottom: 20px;
    }

        .single #main-banner .bannerContent .main-logo {
            bottom: 60px;
        }

    .single #main-content .container {
        padding-top: 30px;
    }

    #et-main-area .et_pb_column#tfg_cta {
        width: 100% !important;
    }

    #et-main-area .et_pb_column#tfg_recent_posts {
        width: 100% !important;
    }

    .page-homepage.et_pb_gutters3 .et_pb_column_3_4, .et_right_sidebar #left-area {
        margin-right: 0;
        padding-right: 0;
    }

    .et_pb_widget {
        float: none;
    }
}

@media only screen and (max-width: 768px){
    .et_monarch .et_social_networks li, .et_monarch .et_social_mobile .et_social_networks li, .et_monarch .et_social_networks li:nth-child(n+2), .et_monarch .et_social_mobile .et_social_networks li:nth-child(n+2){
        width: unset !important;
        display: inline-block !important;
        clear: unset !important;
        margin: 0 20px 0 0 !important;
    }
}

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

    .jcarSliderWrap {
        max-width: 96vw;
        margin: 20px 4% 0;
    }

        .jcarSliderWrap .jcarousel-wrapper {
            height: 96vw;
        }

        .jcarSliderWrap .jcarousel {
            width: 100%;
            margin-left: 0;
        }

        .jcarSliderWrap ul li .posts li {
            width: 100%;
            height: 96vw;
            padding-right: 0;
            float: none;
        }

            .jcarSliderWrap ul li .posts li:first-of-type {
                padding-right: 0;
                height: 96vw;
            }
}

@media screen and (max-width: 414px) {
    .whatsTrending .et_pb_post {
        width: 97%;
        float: none;
        margin-right: 0;
    }

        .whatsTrending .et_pb_post h2 {
            font-size: 26px;
        }

    #main-banner .bannerContainer {
        height: 70vw;
        display: flex;
        justify-content: center;
        max-height: 100vw;
    }

    #main-banner .bannerContent .main-logo {
        bottom: 80px;
    }
}
