/**
 * @package Helix Framework
 * @author JoomShaper http://www.joomshaper.com
 * @copyright Copyright (c) 2010 - 2016 JoomShaper
 * @license http://www.gnu.org/licenses/gpl-2.0.html GNU/GPLv2 or later
 */

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1600px) {
    .variation-agency .sppb-addon-image-content.aligment-left .sppb-content-holder {
        padding: 120px 0 120px 100px;
    }
    .varition-advance .controller-wrapper .owl-dots {
        right: -450px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    //header
    #sp-header .logo-slogan{
        margin-left: 15px;
        padding-left: 20px;
    }
    .variation-applanding{
        #sp-header .logo-slogan{
            padding-left: 8px;
        }
    }
    // ********* Pagebuilder Addons ********* //
    //nav tabs
    .sppb-addon-tab .sppb-nav-tabs{
        padding: 0 15px;
        >li{
            margin: 0 5px;
            >a{
                padding: 0;
                i.fa{
                    font-size: 18px;
                }
            }
        }
    }
    //Slider
    .sppb-slider-wrapper.varition-simple{
        .customNavigation{
            padding-left: 15px;
        }
    }
    //Latest Article
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-title{
        margin-left: 40px !important;
    }
    // ********* Mixed ********* //
    .applanding-static-slider{
        .app-slide-left{
            padding: 0 100px 0px 0px !important;
        }
    }
    .advanced-2 .sppb-tab-pane img {
        right: -80px;
        max-width: 450px;
    }
    #app-desicribe{
        padding: 120px 0 300px 0 !important;
    }
    .sppb-carousel.watch{
        margin-left: 80px;
    }
}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

    // Global Button
    .btn, .sppb-btn{
        padding: 0 25px !important;
    }

    // Global Typograph
    h1{
        font-size: 38px !important;
        line-height: 40px !important;
        small{
            letter-spacing: inherit !important;
        }
    }
    h2{
        font-size: 36px !important;
        line-height: 38px !important;
    }
    h3{
        font-size: 22px !important;
        line-height: 25px !important;
    }
    h4, h5{
        font-size: 18px !important;
        line-height: 22px !important;
    }
    .sp-custom-paragraph1{
        font-size: 32px;
    }

    // Header logo
    #sp-header .logo-slogan{
        margin-left: 15px;
        padding-left: 20px;
    }
    .sp-megamenu-wrapper{
        margin-right: 15px;
    }
    .variation-agency #offcanvas-toggler >i,
    .variation-creative #offcanvas-toggler >i{
        color: #4f5362;
    }
    //************ variations *************//
    // App landing¸
    .variation-applanding #sp-header .logo-slogan{
        margin-left: 10px;
        padding-left: 12px
    }
    //menu
    .show-menu>.text{
        display: none;
    }
    .app-slide-left{
        padding: 70px 50px 0px 0px !important;
    }

    // ********* Pagebuilder Addons ********* //
    .sppb-image-content-title{
        font-size: 28px !important;
    }

    //tab
    .sppb-addon-tab.advanced .sppb-nav-tabs{
        margin: 0;
        >li{
            margin-right: 20px;
        }
    }
    .sppb-addon-tab .sppb-nav-tabs{
        padding: 0 10px;
        >li{
            margin: 0;
        }
    }
    .advanced-2{
        ul.sppb-nav-tabs{
            margin-top: 50px;
        }
        .sppb-tab-pane img {
            max-width: 360px;
        }
    }
    .sppb-addon-tab.advanced .sppb-tab-content .right-content{
        padding: 0px 0 0px 40px;
    }

    //slideshow fullwidth
    .varition-thumb .sppb-slide-item-bg .sppb-slideshow-fullwidth-item-text{
        padding-left: 30px;
    }
    .corporate-slider {
        .varition-corporate {
            .sppb-slide-item-bg {
                .slide-img-wrap {
                    img{
                        max-width: 550px;
                    }
                }
            }
        }
        .customNavigation {
            padding-top: 0;
        }
    }
    //Person
    .sppb-addon-persion .sppb-person-image .sppb-person-social-icons >ul.sppb-person-social >li{
        margin-right: 5px !important;
    }
    // Sp Pagebuilder Addon Call to action
    .sppb-addon-cta {
        padding: 50px 20px;
    }
    //video content
    .sppb-addon-image-content.aligment-left .sppb-content-holder{
        margin-left: 29px;
        padding: 120px 0 120px 0;
    }
    .variation-agency .sppb-addon-image-content.aligment-left .sppb-content-holder {
        padding: 120px 0 120px 60px;
    }
    .varition-advance .controller-wrapper .owl-dots {
        right: -350px;
    }
    //animate number
    .sppb-addon-animated-number .sppb-animated-number{
        font-size: 58px !important;
        line-height: 70px !important;
    }
    //Latest Article
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-title{
        margin-left: 15px !important;
        margin-top: 40px !important;
    }
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-meta{
        float: left !important;
        margin-right: 0 !important;
        margin-left: 15px;
        margin-top: 0 !important;
    }
    //Pricing-table
    .sppb-addon-pricing-table .sppb-pricing-box{
        padding: 40px 20px 50px !important;
    }
    //Contact-from
    .sppb-addon-ajax-contact{
        padding: inherit !important;
    }

    // ********* Mixed ********* //
    .applanding-static-slider .app-slide-left {
        padding: 0 !important;
    }
    .sppb-carousel.watch {
        margin-left: 20px;
        &:after{
            margin-right: -20px;
        }
    }
    #app-features .sppb-addon-feature{
        margin-top: 60px;
        &:before{
            right: -35px;
            top: 12px;
            width: 45px;
        }
        &:after{
            right: 5px;
            top: 9px;
        }
        &.sppb-text-right {
            padding-right: 30px;
        }
        &.sppb-text-left {
            padding-left: 30px;
            &:before {
                left: -35px;
            }
            &:after {
                right: auto;
                left: 9px;
            }
        }
        &.sppb-text-left:first-of-type {
            margin-top: 60px;
        }
    }
    #app-desicribe {
        padding: 120px 0 !important;
    }
    .app-right-content{
        padding: 0 !important;
        .sppb-addon-tab .sppb-nav-tabs >li{
            margin-right: 10px;
        }
    }
    //Rtl Css
    body.rtl {
        .sppb-addon-image-content div.sppb-col-sm-offset-6 {
            margin-left: 0;
            margin-right: 0;
            width: 100%;
        }
        div.sppb-addon-ajax-contact .message-submit {
            padding-left: 0;
            padding-right: 0;
        }
        div.sppb-addon-image-content.aligment-left .sppb-content-holder {
            padding: 120px 0px 120px 0;
        }
    }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

    //Global
    .btn, .sppb-btn{
        padding: 0 25px !important;
        line-height: 40px !important;
        font-size: 14px !important;
    }

    // Global Typograph
    h1{
        font-size: 30px !important;
        line-height: 35px !important;
        small{
            letter-spacing: inherit !important;
        }
    }
    h2{
        font-size: 25px !important;
        line-height: 30px !important;
    }
    h3{
        font-size: 20px !important;
        line-height: 25px !important;
    }
    h4{
        font-size: 18px !important;
        line-height: 23px !important;
    }
    //mixed responsive
    .spb-res-margin{
        margin: 50px 0 !important; // Decrease Section margin, when widows size less than 768px;
    }
    .spb-res-padding{
        padding: 50px 0 !important; // Decrease Section padding, when widows size less than 768px;
    }
    .spb-res-mixed-padding{
        padding: 50px 0 100px !important; // Decrease Section padding, when widows size less than 768px;
    }

    .app-slide-left{
        padding: 70px 0px 0px 0px !important;
    }

    //header
    #sp-menu {
        padding-right: 50px;
        .oneclip-top-search{
            right: 15px;
        }
    }
    #top-search-input-wrap.top-search-input-wrap{
        margin: 0;
        .sp_search_input input{
            height: 50px !important;
            font-size: 18px;
        }
    }

    //********* Variations ************* //
    // Corporate
    .corporate-static-header .sppb-addon-cta {
        padding: 180px 0 100px 0;
    }
    .headline-wrapper{
        margin: 0 100px 30px 100px;
    }

    // app landing
    #app-features .sppb-addon-feature.sppb-text-right{
        padding-right: 55px;
    }

    #app-features .sppb-addon-feature.sppb-text-left{
        padding-left: 55px;
    }

    #app-features .sppb-addon-feature{
        margin-top: 60px;
        &:before{
            width: 70px;
            right: -32px;
        }

        &.sppb-text-left:before{
            left: -31px;
        }
    }

    #app-features .sppb-addon-feature.sppb-text-left:first-of-type{
        margin-top: 85px;
    }

    //variation-portfolio
    .variation-portfolio #sp-header >.container{
        padding: 0 15px;
    }
    .varition-thumb .sppb-slide-item-bg .sppb-slideshow-fullwidth-item-text{
        padding-left: 15px;
    }
    .varition-thumb .controller-wrapper i.fa{
        font-size: 30px;
    }
    //varition-simple
    .varition-simple{
        padding-top: 0;
    }
    //********* Pagebuilder addons ************* //

    //slideshow full
    .varition-advance .sppb-slideshow-fullwidth-item-text .sppb-fullwidth-title{
        min-width: 280px;
        font-size: 36px !important;
    }
    .sppb-slider-fullwidth-wrapper .customNavigation{
        padding-top: 35px;
        padding-left: 13px;
    }
    .varition-simple .sppb-fullwidth-title{
        text-align: center;
    }
    .varition-simple .sppb-fw-slider-button-wrapper {
        text-align: center;
        margin-bottom: 50px;
    }
    .sppb-slider-wrapper.varition-simple .customNavigation{
        padding-left: 0;
        text-align: center;
    }
    .varition-advance{
        .sppb-slide-item-bg:before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0,0,0,.5);
        }
        .sppb-slideshow-fullwidth-item-wrapper {
            min-height: 400px;
            display: table;
            color: #fff;
        }
        .sppb-slideshow-fullwidth-item-text .sppb-fullwidth-title{
            padding-bottom: 20px;
            &:after{
                background: #fff !important;
            }
        }
        .image-holder{
            width: 100%;
        }
        .controller-wrapper{
            margin-top: -85px;
            .customNavigation {
                font-size: 30px;
                top: -15px;
            }
            .owl-dots{
                top: -15px;
                right: -150px;
            }
        }

    }
    //feature
    .sppb-addon-feature{
        margin-bottom: 30px;
    }
    //video-content
    .sppb-addon-video-content .sppb-video-icon{
        font-size: 80px;
    }
    .variation-agency .sppb-addon-image-content.aligment-left .sppb-content-holder {
        padding: 50px 0;
    }
    .sppb-addon-image-content.aligment-left .sppb-content-holder{
        padding: 50px 0;
        margin: 0;
    }
    // Tab
    .sppb-addon-tab .sppb-nav-tabs{
        padding: 0;
        >li{
            margin: 0;
            width: 50%;
            > a{
                font-size: 14px;
                padding: 0 5px;
            }
        }
    }
    .sppb-addon-tab.advanced .sppb-nav-tabs >li{
        margin: 0;
    }
    .sppb-addon-tab.advanced .sppb-tab-content .right-content{
        padding: 0px 0 0px 15px;
    }
    .advanced-2{
        ul.sppb-nav-tabs{
            width: 100%;
            margin-top: 0;
            margin-bottom: 30px;
            li{
                width: 100%;
                &:after{
                    font-size: 20px;
                    top: 0;
                    line-height: 40px;
                }
                a{
                    padding: 10px 20px;
                }
            }
        }
        .sppb-tab-pane{
            text-align: center;
            img{
                position: inherit;
                display: inline-block;
            }
        }
    }
    .sppb-tab-pane img{
        width: 100%;
    }
    .sppb-addon-single-image{
        .sppb-addon-content{
            img{
                width: 100%;
            }
        }
    }
    //icon
    .sppb-icon{
        i.fa{
            font-size: 40px !important;
            width: 40px !important;
            height: 40px !important;
            line-height: 40px !important;
        }
    }
    //animated number
    .sppb-addon-animated-number{
        margin-bottom: 40px;
        .sppb-animated-number{
            font-size: 30px !important;
            line-height: 1 !important;
        }
    }
    .sppb-addon-animated-number.advanced{
        padding: 0 15px;
    }
    .sppb-addon-persion .sppb-person-designation{
        font-size: 14px;
    }
    //cta
    .sppb-addon-cta .sppb-cta-subtitle{
        font-size: 18px !important;
    }
    .sppb-addon-cta.sp-cutom-cta {
        padding: 30px 0 30px 30px;
        margin: 30px 0;
    }
    //persion
    .sppb-addon-persion{
        margin-bottom: 30px;
        .sppb-person-image{
            img{
                width: 100%;
            }
        }
    }
    //pricing table
    .sppb-addon-pricing-table{
        margin-bottom: 30px;
    }
    .sppb-addon-pricing-table.simple .sppb-pricing-header{
        .sppb-pricing-title{
            font-size: 20px;
        }
        .sppb-pricing-price{
            font-size: 50px;
        }
    }
    .sppb-addon-pricing-table{
        .sppb-pricing-box .sppb-pricing-header .sppb-pricing-title{
            font-size: 22px;
        }
        .sppb-pricing-box .sppb-pricing-header  .sppb-pricing-price{
            font-size: 30px;
        }
    }
    //testimonial pro
    .sppb-testimonial-pro{
        .sppb-item{
            >div{
                margin-bottom: 20px;
            }
        }
    }
    //clients
    .sppb-addon-clients{
        .sppb-row{
            >div{
                margin-bottom: 30px;
            }
        }
    }
    //articles
    .sppb-addon-articles{
        .sppb-addon-article{
            >a{
                display: block;
                float: none !important;
                img{
                    width: 100%;
                }
            }
        }
        &.advanced .sppb-addon-article .sppb-img-wrapper img{
            max-width: 100%;
        }
    }
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-title{
        margin-top: 5px !important;
    }
    //contact form
    .sppb-addon-ajax-contact {
        padding: 0;
        .input-fields{
            width: 100%;
        }
        .message-submit{
            width: 100%;
            padding-left: 0;
        }
    }
    //********* Mixed ************* //
    #sp-page-builder .sppb-section-title .sppb-title-heading{
        margin-bottom: 20px !important;
    }
    .sp-custom-paragraph1{
        font-size: 25px;
    }
    .sp-custom-paragraph2{
        font-size: 17px;
        line-height: 1.6;
    }
    .sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-title{
        font-size: 22px !important;
    }
    .applanding-top-bar{
        .sppb-row{
            padding: 0 15px;
            >div{
                float: left;
                &:last-child{
                    float: right;
                }
            }
        }
    }
    .applanding-static-slider{
        .sppb-addon-title {
            display: inline-block;
        }
        .app-slide-left{
            margin-bottom: 50px;
        }
    }
    #app-features .sppb-addon-feature{
        margin-top: 30px;
        *{
            text-align: center;
        }
        &:before, &:after{
            display: none;
        }
        .sppb-feature-box-title{
            font-size: 22px !important;
            font-weight: 400 !important;
        }
        &.sppb-text-right{
            padding-right: 0;
        }
        &.sppb-text-left{
            padding-left: 0;
        }
    }

    .sppb-carousel.watch{
        margin-top: 50px;
    }
    .sppb-addon-screenshot-slider:before {
        height: 570px;
        top: 5px;
        width: 290px;
    }
    .sppb-testimonial-pro .sppb-carousel-indicators{
        bottom: 0;
    }
    #app-newsletter .acymailing_module{
        margin: 0 !important;
    }
    #app-desicribe{
        padding: 50px 0 !important;
    }
    //Blog-Listing
    .sp-page-title ol.breadcrumb {
        text-align: inherit;
        position: inherit;
        top: inherit;
    }
    //footer
    #sp-footer1 {
        text-align: center;
    }
    #sp-footer2 {
        text-align: center;
        margin-top: 15px;
    }
    .corporate-slider {
        .varition-corporate {
            .sppb-slide-item-bg {
                .slide-img-wrap {
                    bottom: 0;
                    left: auto;
                    position: relative;
                    right: 0;
                    top: auto;
                    width: 80%;
                }
                .sppb-slideshow-fullwidth-item-wrapper {
                    .sppb-slideshow-fullwidth-item-text {
                        padding: 40px 0 45px;
                    }
                }
            }
        }
        .customNavigation {
            padding-top: 0;
            >a.sppbSlidePrev,
            >a.sppbSlideNext{
                left: inherit !important;
                right: 45px;
                bottom: 0;
                top: inherit;
                color: #fff;
                font-size: 50px;
                opacity: 1;
                padding: 0;
            }
            >a.sppbSlideNext{
                right: 30px !important;
            }
        }
    }
}

@media only screen and (max-width : 480px) {
    .applanding-top-bar{
        a>img{
            width: 100px !important;
        }
        a.sppb-btn{
            font-size: 12px !important;
        }
    }
    //addon cta
    .sppb-addon-cta{
        .sppb-btn{
            margin-top: 20px;
        }
    }
    .varition-thumb .sppb-slide-item-bg .sppb-slideshow-fullwidth-item-text .sppb-fullwidth-title{
        max-width: 300px;
    }
    .varition-thumb .controller-wrapper {
        bottom: 35px;
        h4{
            font-size: 16px !important;
            line-height: 1.3 !important;
        }
    }
    .varition-thumb .sppb-slide-item-bg{
        height: 450px;
    }
    //tabs
    .advanced-2 .sppb-tab-pane img{
        max-width: 250px;
    }
    //simpleportfolio
    .sp-simpleportfolio .sp-simpleportfolio-filter > ul > li{
        margin-bottom: 15px;
    }
    #sp-header .logo-slogan{
        display: none;
    }
    .sppb-addon-tab .sppb-nav-tabs >li > a{
        padding: 10px;
        line-height: 1.3;
    }
    #app-video-description .sppb-modal-selector{
        margin: 0;
    }
    #app-video-description .sppb-modal-selector:after{
        font-size: 40px;
    }
    //Ltest Article
    .sppb-addon-articles.advanced .sppb-addon-article{
        background-color: transparent !important;
    }
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-title{
        margin-left: 0 !important;
    }
    .sppb-addon-articles.advanced .sppb-addon-article .sppb-article-meta{
        margin-left: 0;
    }
    .corporate-slider {
        .varition-corporate {
            .sppb-slide-item-bg {
                min-height: 450px;
                .slide-img-wrap{
                    display: none;
                }
                .sppb-slideshow-fullwidth-item-wrapper {
                    .sppb-slideshow-fullwidth-item-text {
                        padding: 40px 0 70px;
                    }
                }
            }
        }
    }

}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}