/**
 *    [Table of contents]
 *
 *    [&. Content / #key]
 *    [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 *    Summary:
 *
 *    1. RESPONSIVE SCREEN
 *		  - 1.0. Responsive for layout boxed style
 *        - 1.1. Media screen max width 1600px
 *        - 1.2. Media screen max width 1024px
 *        - 1.3. Media screen max width 768px
 *        - 1.4. Media screen max width 767px
 *        - 1.5. Media screen max width 600px
 *        - 1.6. Media screen max width 480px
 *        - 1.7. Media screen max width 414px
 *        - 1.8. Media screen max width 380px
 *        - 1.9. Media screen max width 320px
 */


/*=========================================
=            RESPONSIVE SCREEN            =
=========================================*/

/*----------  1.0. Responsive for layout boxed style  ----------*/

@media (min-width:992px) and (max-width:1023px) {
    .body-wrapper.style-boxed {
        width: auto!important
    }
    .body-wrapper.style-boxed .header-middle {
        width: auto;
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    .body-wrapper.style-boxed {
        width: 1000px!important
    }
    .body-wrapper.style-boxed .header-middle {
        width: 1000px;
    }
    .body-wrapper.style-boxed .container {
        width: 100%
    }
}

@media (min-width:1200px) {
    .body-wrapper.style-boxed .container {
        width: 100%
    }
}

@media screen and (max-width: 991px) {
	 /*boxed style*/
    .body-wrapper.style-boxed {
        width: auto!important
    }

    .body-wrapper.style-boxed .header-middle {
        width: auto;
    }
}
/*----------  1.1. Media screen max width 1600px  ----------*/

/*----------  1.2. Media screen max width 1024px  ----------*/

/*----------  1.3. Media screen max width 768px  ----------*/
    @media screen and (max-width: 768px) {
        .banner-subcribe .subcribe-info {
            width: 100%;
            float: none;
        }
        .banner-subcribe .slz-btn {
            float: none;
        }

        .slz-block-video .title {
            font-size: 30px;
        }
        .slz-block-item-01 .block-content {
            padding: 20px;
        }

        .slz-template-03 .slz-block-item-01.style-1 .block-content,
        .slz-template-03 .slz-block-item-01.style-2 .block-image + .block-content, 
        .slz-template-03.block-right-left .slz-list-block .item:nth-child(even) .block-content {
            padding: 20px;
        }
        .template-higher-top {
            margin-top: 100px;
        }
    
        .template-sidebar-full #page-sidebar .slz-widget {
            width: 50%;
        }

        .template-sidebar-full #page-sidebar .slz-widget:nth-child(-n + 3) {
            margin-top: 60px;
        }

        .template-sidebar-full #page-sidebar .slz-widget:nth-child(-n + 2) {
            margin-top: 0;
        }
        
         .banner-subcribe.slz-banner-01{
            text-align: center;
        }
        .vc_column_container{
            width: 100%;
        }
        .slz-banner-01 .content-wrapper{
            padding: 45px 60px 80px 60px;
        }
        .banner-subcribe .slz-btn{
            margin-top: 20px;
        }
        .banner-subcribe .subcribe-info h1.title{
            padding-bottom: 20px;
            font-size: 26px;
        }
        .banner-subcribe .subcribe-info .description p{
            font-size: 16px;
        }
        .slz-teams .slz-about-me-02.style-02 .heading-right{
            width: 100%;
        }
        .slz-teams .slz-about-me-02.style-02 .content-wrapper{
            padding-left: 15px;
        }
        .slz-teams .slz-about-me-02.style-02 .heading-left{
            margin-bottom: 15px;
        }
        .slz-page-404 .title {
            font-size: 36px;
        }
        .slz-page-404 img{
            width: 80%;
        }
    }
/*----------  1.4. Media screen max width 767px  ----------*/
    @media screen and (max-width: 767px) {
        .template-sidebar-full #page-sidebar .slz-widget {
            width: 100%;
            margin-top: 100px;
        }
        .template-sidebar-full #page-sidebar .slz-widget:nth-child(-n + 2) {
            margin-top: 100px;
        }
        .template-sidebar-full #page-sidebar .slz-widget:first-child {
            margin-top: 0;
        }
        .template-sidebar-full #page-sidebar .slz-widget:nth-child(2n) {
            padding-left: 15px;
            margin-top: 100px;
        }
        .template-sidebar-full #page-sidebar .slz-widget:nth-child(2n + 1) {
            padding-right: 15px
        }
        .slz-page-404 .title {
            font-size: 30px;
        }
        .slz-page-404 img{
            width: 80%;
        }
    }

/*----------  1.5. Media screen max width 600px  ----------*/
    @media screen and (max-width: 600px) {
        .wpcf7 .cf7-form-control.input-alt {
            width: 100%;
            margin: 0 0 10px;
        }        
        .slz-banner-01 .content-wrapper{
            padding: 25px 15px 60px 15px;
        }
        .slz-teams .slz-about-me-02 .image-wrapper{
            display: block;
            width: 100%;
        }
        .slz-teams .slz-about-me-02.style-02 .content-wrapper{
            display: block;
            width: 100%;
        }
        .slz-teams .slz-about-me-02.style-02 .content-wrapper{
            padding-left: 0;
        }
        .slz-teams .slz-about-me-02.style-02 .block-wrapper{
            padding-bottom: 20px;
        }
        .slz-teams .slz-about-me-02.style-02 .heading-left{
            margin-bottom: 20px;
        }
        .slz-list-block.slz-column-5 > .item:nth-child(-n + 3){
            margin-top: 30px;
        }
        .slz-teams .slz-about-me-02.style-02 .heading-left{
            margin-bottom: 10px;
        }
        .slz-teams .slz-about-me-02.style-02 .info-wrapper{
            padding-top: 10px;
        }
    }

/*----------  1.6. Media screen max width 480px  ----------*/

    @media screen and (max-width:480px) {
        .slz-page-404 .slz-btn{
            display: block;
            max-width: 480px;
            width: 60%;
            display:inline-block;
        }
        .slz-page-404 .title {
            font-size: 20px;
        }
        .slz-page-404 img {
            width: 80%;
        }

        .slz-banner-01 .title{
            font-size: 30px;
        }

        .slz-title-command .title-command-wrapper .title {
            font-size: 28px !important;
        }
        .slz-list-block .slz-progress-bar-02 {
            padding: 10px 0;
        }
    }
    

/*----------  1.7. Media screen max width 414px  ----------*/

    @media screen and (max-width: 414px) {
        .wpcf7 .cf7-form-control.left,
        .wpcf7 .cf7-form-control.right {
            width: 100%;
            margin: 0 0 10px;
        }

    
        .template-sidebar-full #page-sidebar .slz-widget {
            width: 100%;
        }

        .template-sidebar-full #page-sidebar .slz-widget:nth-child(-n + 2) {
            margin-top: 60px;
        }

        .template-sidebar-full #page-sidebar .slz-widget:first-child{
            margin-top: 0;
        }
    }
    
/*----------  1.8. Media screen max width 380px  ----------*/

    @media screen and (max-width: 380px) {
        .slz-page-404 .title {
            font-size: 16px;
        }
    }
/*----------  1.9. Media screen max width 320px  ----------*/

    @media screen and (max-width: 320px) {
        .slz-block-video .btn-play:after {
            font-size: 12px;
        }
    }

/*=====  End of RESPONSIVE SCREEN  ======*/
