/**
 *  STYLE DEFAULT FOR LAYOUT
 *
 *
 *  [Table of contents]
 *
 *  [&. Content / #key]
 *  [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 *  Summary:
 *
 *
 *  1. GLOBAL STYLE
 *
 *  2. LAYOUT BOXED
 *
 *  3. CAROUSEL 
 *
 *
 */

/*============================================
=            1. GLOBAL STYLE                 =
============================================*/


/*=========  End of Global style   =========*/




/*============================================
=            3. LAYOUT BOXED                 =
============================================*/

    .slz-boxed-layout{
        margin-left: auto;
        margin-right: auto;
        width: 1200px;
    }
    .slz-boxed-layout.layout-has-box-shadow{
        -webkit-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4);
        -moz-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4);
        box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.4);
    }
    .slz-boxed-layout.layout-has-border{
        border:1px solid #ccc;
    }
    .slz-boxed-layout.layout-algin-left{
        margin-left: 0px!important;
        margin-right: auto!important;
    }
    .slz-boxed-layout.layout-algin-right{
        margin-right: 0px!important;
        margin-left: auto!important;
    }


/*=========  End of Layout boxed  ==========*/



/*============================================
=            4. CAROUSEL                     =
============================================*/

    .slz-carousel-wrapper {
        position: relative;
    }

    .slz-carousel-wrapper .carousel-overflow {
        position: relative;
        overflow: hidden;
    }

    .slz-carousel-wrapper.no-arrows .slick-arrow {
        display: none !important;
    }

    .slz-carousel-wrapper.no-dots .slick-dots {
        display: none !important;
    }

    .slz-carousel-wrapper .slz-carousel {
        margin-right: -15px;
        margin-left: -15px;
    }

    .slz-carousel-wrapper .slz-carousel .slick-slide {
        padding-right: 15px;
        padding-left: 15px;
    }

    .slz-carousel-wrapper .slz-carousel .slick-slide img {
        width: 100%;
    }

    .slz-carousel-wrapper .slz-carousel .slick-slide .block-image .img-full {
        width: auto;
    }

    .slz-carousel-wrapper .slz-carousel-vertical .slick-dots {
        top: 50%;
        right: -50px;
        bottom: auto;

        width: auto;

        -webkit-transform: translateY(-50%);
           -moz-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
             -o-transform: translateY(-50%);
                transform: translateY(-50%);
    }

    .slz-carousel-wrapper .slz-carousel-vertical .slick-dots li {
        display: block;
    }

    .slz-carousel-wrapper .slick-arrow {
        position: absolute;
        z-index: 10;
        top: 50%;

        -webkit-transform: translate(0, -50%);
           -moz-transform: translate(0, -50%);
            -ms-transform: translate(0, -50%);
                transform: translate(0, -50%);

        background-color: #ffffff;
    }

    .slz-carousel-wrapper .slick-arrow.btn-prev {
        left: 0;
    }

    .slz-carousel-wrapper .slick-arrow.btn-prev i {
        margin-right: 10px;
    }

    .slz-carousel-wrapper .slick-arrow.btn-next {
        right: 0;
    }

    .slz-carousel-wrapper .slick-arrow.btn-next i {
        margin-left: 10px;
    }

    .slz-carousel-wrapper .slick-dots li button:before {
        font-size: 12px;
    }


/*=========  End of Carousel layout  =======*/






/*============================================
=            RESBONSIVE                      =
============================================*/

/*----------  min-width 1600px  ----------*/
@media screen and (min-width: 1600px) {}


/*----------  max-width 1024px  ----------*/
@media screen and (max-width: 1024px) {}


/*----------  max-width 768px  -----------*/
@media screen and (max-width: 768px) {}


/*----------  max-width 767px  -----------*/
@media screen and (max-width: 767px) {
    /*----------  carousel  --------------*/
    .slz-carousel-wrapper .slz-carousel {
        margin-right: -10px;
        margin-left: -10px;
    }

    .slz-carousel-wrapper .slz-carousel .slick-slide {
        padding-right: 10px;
        padding-left: 10px;
    }

}

/*----------  max-width 600px  ----------*/


/*----------  max-width 480px  ----------*/
@media screen and (max-width: 480px) {}


/*----------  max-width 414px  ----------*/
@media screen and (max-width: 414px) {}


/*----------  max-width 380px  ----------*/
@media screen and (max-width: 380px) {}


/*----------  max-width 320px  ----------*/
@media screen and (max-width: 320px) {}


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