/**
 *
 *  STYLE COMPONENS
 *
 *
 *  [Table of contents]
 *
 *  [&. Content / #key]
 *  [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 *  Summary:
 *
 *
 *  1. BLOCK ITEM
 *       1.1. block info
 *       1.2. block category
 *       1.3. block rating counter
 *       1.4. block rating
 *       1.5. block button video
 *       1.6. block label
 *       1.7. block read more
 *       1.8. block comment
 *       1.9. block image
 *       1.10. block title
 *       1.11. block quote
 *
 *  2. BLOCK ITEM LAYOUT 1
 *       2.1. style 1
 *       2.2. style 2
 *       2.3. style 3
 *       2.4. style 4
 *       2.5. style 5
 *
 *  3. BLOCK ITEM LAYOUT 2
 *       3.1. style 1
 *
 *  4. BLOCK ITEM LAYOUT 3
 *       4.1. style 1
 *       4.2. style 2
 *
 *  5. BLOCK ITEM LAYOUT 4
 *       5.1. style 1
 *
 *  6. BLOCK GALLERY
 *       6.1. style 1
 *
 *  7. BLOCK VIDEOS
 *       7.1. style 1
 *
 *  8. TEMPLATE 12
 *       8.0. global style
 *       8.1. template 01
 *       8.2. template 02
 *       8.3. template 03
 *       8.4. template 04
 *       8.5. template 05
 *
 *  9. GRID LAYOUT
 *       9.0. global style
 *       9.1. grid layout 01
 *       9.2. grid layout 02
 *       9.3. grid layout 03
 *       9.4. grid layout 04
 *       9.5. grid layout 05
 *
 *  10. MANSORY LAYOUT
 *       10.0. global style
 *       10.1. tab filler
 *       10.2. isotop layout 1
 *       10.3. isotop layout 2
 *       10.4. button loadmore
 *
 *  11. ICON BOX
 *       11.0. global style
 *       11.1. tab filler
 *       11.2. isotop layout 1
 *       11.3. isotop layout 2
 *       11.4. button loadmore
 *
 *  12. TABS
 *       12.1. tab vertical
 *       12.2. tab horizontal
 *
 *  13. CAROUSEL
 *       13.1. carousel layout 1
 *       13.2. carousel layout 2
 *
 *  14. PAGINATION
 *       14.1. pagination 01
 *
 *  15. SLZ BUTTON
 *       15.1. button default
 *       15.2. button image
 *       15.3. group button
         15.4. button icon absolute
 *
 *  16. BTN BACK TO TOP
 *       16.1. btn default
 *
 *
 */


/*==============================================
=            1. BLOCK ITEM                     =
==============================================*/

/*----------  1.1. block info  --------------------*/

    .block-info {
        padding: 0;
        margin: 0;
        text-transform: capitalize;
        font-style: italic;
        list-style: none;
        font-size: 12px;
        font-weight: bold;
        line-height: 1;
    }

    .slz-posts .block-info {
        padding: 0;
    }

    .block-info li {
        display: inline-block;
        padding: 0 6px;
        line-height: 18px;
        position: relative;
    }

    .block-info li:first-child {
        padding-left: 0;
    }

    .block-info li:last-child {
        padding-right: 0;
    }

    .block-info li + li:before {
        position: absolute;
        content: "/";
        font-family: "FontAwesome";
        left: -2px;
        font-size: 12px;
    }

    .block-info .link {
        color: #9a9a9a;
    }

    .block-info .link:hover {
        color: #337ab7;
        text-decoration: none;
    }

    .block-info .info-left {
        float: left;
    }

    .block-info .info-right {
        float: right;
    }

    .block-content .block-text {
        font-size: 14px;
    }

/*----------  1.2. block category  ----------------*/

    .block-category {
        position: relative;
        display: inline-block;
        font-size: 12px;
        font-weight: 600;
        line-height: 18px;
        color: #337ab7;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    .block-category:hover {
        color: #337ab7;
        text-decoration: none;
    }

/*----------  1.3. block rating counter  ----------*/

    .block-rating {
        font-size: 14px;
        line-height: 30px;
        position: absolute;
        z-index: 10;
        top: 10px;
        right: 10px;
        width: 70px;
        height: 30px;
        text-align: center;
        color: #ffffff;
        background-color: #d73333;
    }

    .block-rating .icons {
        line-height: 1;
        color: #f9d116;
    }

    .block-rating .text {
        font-weight: 600;
        line-height: 1;
        margin-left: 12px;
    }

/*----------  1.4. block rating  ------------------*/

    .ratings {
        display: inline-block;
    }

    .star-rating {
        position: relative;
        display: block;
        line-height: 18px;
        width: 74px;
        height: 18px;
        overflow: hidden;
        font-size: 13px;
    }

    .star-rating:before {
        content: "\f005\f005\f005\f005\f005";
        top: 0;
        position: absolute;
        left: 1px;
        font-family: FontAwesome;
        color: #dadada;
        float: left;
        letter-spacing: 3px;
    }

    .star-rating span {
        overflow: hidden;
        float: left;
        top: 0;
        left: 0;
        position: absolute;
        padding-top: 1.5em;
        color: #f9d116;
    }

    .star-rating span:before {
        content: "\f005\f005\f005\f005\f005";
        top: 0;
        position: absolute;
        left: 1px;
        font-family: FontAwesome;
        letter-spacing: 3px;
    }

    .star-rating span.width-0 {
        width: 0%;
    }

    .star-rating span.width-10 {
        width: 10%;
    }

    .star-rating span.width-20 {
        width: 20%;
    }

    .star-rating span.width-30 {
        width: 30%;
    }

    .star-rating span.width-40 {
        width: 40%;
    }

    .star-rating span.width-50 {
        width: 50%;
    }

    .star-rating span.width-60 {
        width: 60%;
    }

    .star-rating span.width-70 {
        width: 70%;
    }

    .star-rating span.width-80 {
        width: 80%;
    }

    .star-rating span.width-90 {
        width: 90%;
    }

    .star-rating span.width-100 {
        width: 100%;
    }

/*----------  1.5. block button video  ------------*/

    .block-btn-video {
        position: absolute;
        z-index: 10;
        bottom: 0;
        left: 0;
        color: #ffffff;
    }

    .block-btn-video span {
        font-size: 0;
        display: inline-block;
        width: 38px;
        cursor: pointer;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        text-align: center;
        border-left: 1px solid rgba(255, 255, 255, 0.24);
        background-color: rgba(250, 250, 250, 0.3);
    }

    .block-btn-video span:first-child {
        border-left: none;
    }

    .block-btn-video span i {
        font-size: 14px;
        line-height: 36px;
        height: 36px;
    }

    .block-btn-video span:hover {
        background-color: rgba(250, 250, 250, 0.7);
    }

/*----------  1.6. block label  -------------------*/

    .block-label {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 4;
        color: #fff;
        background-color: rgba(0, 0, 0, 0.7);
        text-align: center;
        padding: 15px;
    }

    .block-label .text {
        font-size: 14px;
        font-weight: 700;
        line-height: 1;
    }

    .block-label .text.big {
        font-size: 20px;
    }

    .block-label .text.small {
        font-size: 10px;
    }

    .block-label .link-label {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0px;
        left: 0px;
        z-index: 4;
    }

/*----------  1.7. block read more  ---------------*/

    .block-read-more {
        display: block;
        color: #3a4d6a;
        font-size: 14px;
        text-transform: capitalize;
    }

    .block-read-more i {
        padding-left: 10px;
    }

    .block-read-more:hover {
        color: #337ab7;
    }

/*----------  1.8. block comment  -----------------*/
    .block-comments {
        height: 25px;
    }

    .block-comments .comment-avatars {
        display: inline-block;
        height: inherit;
    }

    .block-comments .comment-avatars li {
        display: inline-block;
        position: relative;
        width: 25px;
        height: 25px;
        text-align: center;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        border: 2px solid #fff;
        margin-left: -5px;
        overflow: hidden;
    }

    .block-comments .comment-avatars li a {
        color: #fff;
        font-weight: 700;
        font-size: 11px;
    }

    .block-comments .comment-avatars li img {
        vertical-align: top;
    }

    .block-comments .comment-avatars li:nth-child(1) {
        background-color: #127b49;
        margin-left: 0;
        z-index: 7;
    }

    .block-comments .comment-avatars li:nth-child(2) {
        background-color: #e84949;
        z-index: 6;
    }

    .block-comments .comment-avatars li:nth-child(3) {
        background-color: #31a8cb;
        z-index: 5;
    }

    .block-comments .comment-counter {
        display: inline-block;
        color: #b5b5b5;
        padding-left: 10px;
        vertical-align: top;
    }

/*----------  1.9. Block image  -------------------*/

    .block-image {
        display: block;
        position: relative;
        overflow: hidden;
        margin-bottom: 0;
        background-color: #fff;
    }

    .block-image:before {
        display: block;
        content: '';
        padding-top: 67%;
    }

    .block-image:after {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 1;
        background-color: rgba(0, 0, 0, 0.5);
        transform: scale(0);
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
    }

    .block-image .img-full {
        width: auto;
        height: 100%;
        max-width: none;
        position: absolute;
        top: 0;
        left: 50%;
        margin: 0;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .block-image .link {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
        overflow: hidden;
        position: absolute;
    }

/*----------  1.10. block title  ------------------*/

    .block-title {
        position: relative;
        display: block;
        color: #333;
        line-height: 1.4;
        font-size: 20px;
        text-transform: capitalize;
        font-weight: 500;
        font-family: 'Roboto', serif;
    }

    .block-title:hover {
        text-decoration: none;
        color: #337ab7;
    }

    .block-title:focus {
        text-decoration: none;
    }

/*----------  1.11. block quote -------------------*/

    .block-quote-wrapper {
        position: absolute;
        z-index: 4;
        top: 50%;
        right: 10%;
        left: 10%;
        color: #fbe7ef;
        font-size: 16px;
        text-transform: uppercase;
        text-align: center;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
    }

    .block-quote-wrapper .block-quote {
        position: relative;
    }

    .block-quote-wrapper .block-quote:before {
        position: absolute;
        content: "\275e";
        font-size: 45px;
        top: -30px;
        left: 50%;
        opacity: 0.7;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }



/*==============================================
=            2. BLOCK ITEM LAYOUT 1            =
==============================================*/

/*----------  2.1. style 1  -----------------------*/

    .slz-block-item-01 {
        background-color: #ffffff;
        box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
        position: relative;
    }

    .slz-block-item-01 .block-content {
        padding: 15px 20px;
    }

    .slz-block-item-01 .block-info {
        margin-top: 10px;
        margin-bottom: 0;
    }

    .slz-block-item-01 .block-text {
        margin-top: 10px;
    }

    .slz-block-item-01 .block-read-more {
        margin-top: 10px;
    }

    .slz-block-item-01:hover .block-image:after {
        transform: scale(1);
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
    }

/*----------  2.2. style 2  -----------------------*/

    .slz-block-item-01.style-2 {
        display: table;
        width: 100%;
    }

    .slz-block-item-01.style-2 .block-image {
        display: table-cell;
        vertical-align: top;
        width: 48%;
    }

    .slz-block-item-01.style-2 .block-content {
        display: table-cell;
        vertical-align: top;
        width: auto;
    }

/*----------  2.3. style 3  -----------------------*/

    .slz-block-item-01.style-3 .block-content {
        position: absolute;
        z-index: 3;
        width: 100%;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.3);
        color: #FFF;
    }

    .slz-block-item-01.style-3 .block-info .link {
        color: #FFF;
    }

    .slz-block-item-01.style-3 .block-category {
        color: #FFF;
    }

    .slz-block-item-01.style-3 .block-category:after {
        background-color: #ffffff;
    }

    .slz-block-item-01.style-3 .block-title {
        color: #FFF;
    }

    .slz-block-item-01.style-3 .block-read-more {
        color: #FFF;
    }

/*----------  2.4. style 4  -----------------------*/

    .slz-block-item-01.style-4 .block-content {
        position: absolute;
        top: auto;
        left: 0;
        right: 0;
        bottom: 0;
        padding: 25px 30px;
        z-index: 4;
    }

    .slz-block-item-01.style-4 .block-content:before {
        position: absolute;
        content: '';
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(237, 237, 237, 0) 7%, rgba(0, 0, 0, 0.42) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#6b000000', GradientType=0);
    }

    .slz-block-item-01.style-4 .block-title {
        font-size: 32px;
        font-weight: 600;
        color: #fff;
        margin-bottom: 20px;
    }

    .slz-block-item-01.style-4 .block-info {
        color: #b4b4b4;
        margin-top: 0;
        line-height: 25px;
        font-size: 14px;
    }

    .slz-block-item-01.style-4 .block-info .link {
        color: inherit;
    }

    .slz-block-item-01.style-4 .block-info .link:hover {
        color: #337ab7;
    }

/*----------  2.5. style 5  -----------------------*/

    .slz-block-item-01.style-5 {
        box-shadow: none;
    }

    .slz-block-item-01.style-5 .block-image:before {
        padding-top: 60.6%;
    }

    .slz-block-item-01.style-5 .block-content {
        padding: 20px;
        background-color: #fafafa;
    }

    .slz-block-item-01.style-5 .block-content .block-title {
        margin-top: 10px;
    }

    .slz-block-item-01.style-5 .block-comments {
        margin-top: 15px;
    }

    .slz-block-item-01.style-5 .block-info {
        margin-top: 15px;
        line-height: 25px;
    }

    .slz-block-item-01.style-5 .block-text {
        margin-top: 15px;
        font-size: 15px;
    }



/*==============================================
=            3. BLOCK ITEM LAYOUT 2            =
==============================================*/

/*----------  3.1. style 1  -----------------------*/

    .slz-block-item-02 .block-image {
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
    }

    .slz-block-item-02 .block-content {
        display: table;
        width: 100%;
        padding-top: 20px;
    }

    .slz-block-item-02 .sub-content {
        display: table-cell;
        width: 100px;
    }

    .slz-block-item-02 .block-date {
        background-color: #555;
        width: 100px;
        height: 100px;
        text-align: center;
        padding: 10px;
        margin-bottom: 15px;
        border-radius: 10px;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
    }

    .slz-block-item-02 .block-date .big {
        font-size: 60px;
        font-weight: 700;
        line-height: 1;
        color: #fff;
        border-bottom: 1px solid rgba(255, 255, 255, 0.4);
    }

    .slz-block-item-02 .block-date .small {
        font-size: 18px;
        color: #fff;
    }

    .slz-block-item-02 .block-social {
        text-align: center;
    }

    .slz-block-item-02 .block-social li {
        margin-bottom: 10px;
    }

    .slz-block-item-02 .block-social li:last-child {
        margin-bottom: 0;
    }

    .slz-block-item-02 .block-social .icons {
        width: 20px;
        padding-right: 5px;
    }

    .slz-block-item-02 .block-social .link {
        display: inline-block;
        min-width: 50px;
        text-align: left;
    }

    .slz-block-item-02 .main-content {
        display: table-cell;
        padding-left: 30px;
        vertical-align: top;
    }

    .slz-block-item-02 .block-title {
        display: inline-block;
        margin-bottom: 15px;
    }

    .slz-block-item-02 .block-info {
        margin-bottom: 20px;
    }

    .slz-block-item-02 .block-info li {
        padding-left: 20px;
    }

    .slz-block-item-02 .block-info li:before {
        position: absolute;
        content: "\f111";
        font-family: FontAwesome;
        font-style: normal;
        font-size: 9px;
        left: 0;
    }

    .slz-block-item-02 .btn {
        padding: 0;
        border: none;
        margin-top: 10px;
    }

    .slz-block-item-02 .btn-icon {
        width: 25px;
        height: 25px;
        line-height: 25px;
        background-color: #555;
        color: #fff;
        margin-right: 10px;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
    }

    .slz-block-item-02 .btn-text {
        font-size: 16px;
        text-transform: capitalize;
    }



/*==============================================
=            4. BLOCK ITEM LAYOUT 3            =
==============================================*/

/*----------  4.1. style 1  -----------------------*/

/*----------  4.1. style 2  -----------------------*/

 

/*==============================================
=            5. BLOCK ITEM LAYOUT 4            =
==============================================*/ 

/*----------  5.1. style 1  -----------------------*/



/*==============================================
=            6. BLOCK ITEM GALLERY             =
==============================================*/

/*----------  6.1. style 1  -----------------------*/

    .slz-block-gallery-01 {
        position: relative;
    }

    .slz-block-gallery-01 .block-content {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 5;
        text-align: center;
        background-color: rgba(255, 255, 255, 0.8);
        opacity: 0;
        pointer-events: none;
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
    }

    .slz-block-gallery-01 .block-content .block-content-wrapper {
        position: absolute;
        width: 100%;
        padding: 0px 15px;
        top: 50%;
        transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -webkit-transform: translate(0, -50%);
    }

    .slz-block-gallery-01 .block-content .icon-block {
        font-size: 60px;
    }

    .slz-block-gallery-01 .block-content .icon-block + .img-block {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .img-block {
        position: relative;
        width: 60px;
        overflow: hidden;
        display: block;
        margin-right: auto;
        margin-left: auto;
    }

    .slz-block-gallery-01 .block-content .img-block:before {
        content: "";
        display: block;
        padding-top: 100%;
    }

    .slz-block-gallery-01 .block-content .img-block .img-full {
        width: auto;
        height: 100%;
        max-width: none;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .slz-block-gallery-01 .block-content .block-category {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .block-title {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .block-info {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .block-text {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .block-read-mores {
        margin-top: 10px;
    }

    .slz-block-gallery-01 .block-content .block-zoom-img {
        margin-top: 10px;
        pointer-events: auto;
    }

    .slz-block-gallery-01 .block-content .block-read-mores {
        display: inline-block;
        margin-right: 0;
        margin-left: 0px;
        pointer-events: auto;
    }

    .slz-block-gallery-01 .block-content .block-read-mores + .block-zoom-img {
        display: inline-block;
        margin-left: 20px;
        margin-right: 0px;
        color: #213047;
    }

    .slz-block-gallery-01 .block-content .block-zoom-img:hover {
        color: #337ab7;
    }

    .slz-block-gallery-01 .block-content .slz-icon {
        display: inline-block;
        margin-left: 5px;
        padding-left: 0px;
        font-style: normal;
    }

    .slz-block-gallery-01 .block-content .slz-icon:before {
        font-family: 'FontAwesome';
        font-size: 14px;
    }

    .slz-block-gallery-01 .block-content .slz-icon.icon-read-more:before {
        content: "\f067";
    }

    .slz-block-gallery-01 .block-content .slz-icon.icon-zoom-in:before {
        content: "\f00e";
    }

    .slz-block-gallery-01:hover .block-content {
        opacity: 1;
    }



/*==============================================
=            7. BLOCK ITEM VIDEOS              =
==============================================*/

/*----------  7.1. style 1  -----------------------*/

    .slz-block-video .block-video {
        display: block;
        position: relative;
        overflow: hidden;
        margin-bottom: 0;
        background-color: #000;
    }

    .slz-block-video .block-video:before {
        display: block;
        content: '';
        padding-top: 67%;
    }

    .slz-block-video .btn-play {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 3;
        cursor: pointer;
        text-align: center;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }

    .slz-block-video .btn-play .icons {
        font-size: 18px;
        color: #fff;
        width: 50px;
        width: 50px;
        width: 50px;
        line-height: 46px;
        border: 2px solid #fff;
        background-color: rgba(255,255,255, 0.2);
        border-radius: 50%;
    }

    .slz-block-video .btn-play .icons:before {
        margin-left: 4px;
    }

    .slz-block-video .btn-close {
        position: absolute;
        top: 45px;
        right: 15px;
        z-index: 6;
        cursor: pointer;
        text-align: center;
        opacity: 0;
        visibility: hidden;
    }

    .slz-block-video .icons {
        font-size: 20px;
        color: #fff;
    }

    .slz-block-video .text {
        font-size: 20px;
        margin-top: 5px;
        color: #fff;
    }

    .slz-block-video .img-full {
        width: auto;
        height: 100%;
        max-width: none;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .slz-block-video .video-embed {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: 5;
        border: none;
        opacity: 0;
        visibility: hidden;
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
    }

    .slz-block-video .show-video {
        opacity: 1;
        visibility: visible;
    }

    .slz-block-video .btn-close.show-video {
        opacity: 0;
        visibility: hidden;
    }

    .slz-block-video:hover .btn-close.show-video {
        opacity: 1;
        visibility: visible;
    }



/*==============================================
=            8. TEMPLATE                      =
==============================================*/

/*----------  8.0. global style  -----------------*/

    .list-layout {
        margin-left: -15px;
        margin-right: -15px;
        font-size: 0;
    }

    .list-layout .element {
        display: inline-block;
        vertical-align: top;
        padding: 0 15px;
        margin-top: 30px;
        font-size: 14px;
    }

    .list-layout.column-1 .element {
        width: 100%;
    }

    .list-layout.column-1 .element:first-child {
        margin-top: 0;
    }

    .list-layout.column-2 .element {
        width: 50%;
    }

    .list-layout.column-2 .element:nth-child(-n + 2) {
        margin-top: 0;
    }

    .list-layout.column-3 .element {
        width: 33.3333%;
    }

    .list-layout.column-3 .element:nth-child(-n + 3) {
        margin-top: 0;
    }

    .list-layout.column-4 .element {
        width: 25%;
    }

    .list-layout.column-4 .element:nth-child(-n + 4) {
        margin-top: 0;
    }

    .style-no-image .list-layout .element {
        margin-top: 0;
    }

    .style-no-image .list-layout .slz-block-item-01.style-2 {
        padding-top: 6px;
        margin-top: 10px;
        border-top: 1px solid #cccccc;
    }

    .style-no-image .list-layout.column-1 .element {
        width: 100%;
    }

    .style-no-image .list-layout.column-1 .element:first-child .slz-block-item-01.style-2 {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    .style-no-image .list-layout.column-2 .element {
        width: 50%;
    }

    .style-no-image .list-layout.column-2 .element:nth-child(-n + 2) .slz-block-item-01.style-2 {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    .style-no-image .list-layout.column-3 .element {
        width: 33.3333%;
    }

    .style-no-image .list-layout.column-3 .element:nth-child(-n + 3) .slz-block-item-01.style-2 {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    .style-no-image .list-layout.column-4 .element {
        width: 25%;
    }

    .style-no-image .list-layout.column-4 .element:nth-child(-n + 4) .slz-block-item-01.style-2 {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

/*----------  8.1. template 01  ------------------*/

    .slz-template-01 .slz-block-item-01 {
        box-shadow: none;
        background-color: #fafafa;
    }

    .slz-template-01 .list-layout {
        margin-top: 30px;
    }

    .slz-template-01 .list-layout .block-title {
        font-size: 15px;
    }

    .slz-template-01 .list-layout .block-category,
    .slz-template-01 .list-layout .block-info {
        font-size: 11px;
        text-transform: capitalize;
    }

    .slz-template-01 .list-layout .block-info {
        margin-top: 5px;
    }

    .slz-template-01 .list-layout .slz-block-item-01 {
        background-color: #fff;
    }

    .slz-template-01 .list-layout .slz-block-item-01 .block-content {
        padding: 10px 0 0 0;
    }

    .slz-template-01 .list-layout .slz-block-item-01.style-2 .block-image {
        width: 120px;
    }

    .slz-template-01 .list-layout .slz-block-item-01.style-2 .block-content {
        padding: 0;
        width: calc(100% - 120px);
    }

    .slz-template-01 .list-layout .slz-block-item-01.style-2 .block-image + .block-content {
        padding: 0 0 0 15px;
    }

    .slz-template-01 .list-layout .slz-block-item-01.style-3 .block-info {
        display: none;
    }

    .slz-template-01 .list-layout .slz-block-item-01.style-3 .block-content {
        padding: 10px;
    }

    .slz-template-01.style-no-image .list-layout {
        margin-top: 20px;
    }

/*----------  8.2. template 02  ------------------*/

    .slz-template-02 {
        margin: 0 -15px;
        font-size: 0;
        width: calc(100% + 30px);
    }

    .slz-template-02 .slz-block-item-01 {
        box-shadow: none;
        background-color: #fafafa;
    }

    .slz-template-02 .main-layout {
        display: inline-block;
        width: 50%;
        vertical-align: top;
        padding: 0 15px;
        font-size: 14px;
    }

    .slz-template-02 .main-layout .block-image:before {
        padding-top: 75%;
    }

    .slz-template-02 .list-layout {
        width: 50%;
        display: inline-block;
        vertical-align: top;
        margin-top: 0;
        padding: 0 15px;
    }

    .slz-template-02 .list-layout .block-title {
        font-size: 15px;
    }

    .slz-template-02 .list-layout .block-category,
    .slz-template-02 .list-layout .block-info {
        font-size: 11px;
        text-transform: capitalize;
    }

    .slz-template-02 .list-layout .block-info {
        margin-top: 5px;
    }

    .slz-template-02 .list-layout .slz-block-item-01 {
        background-color: #fff;
    }

    .slz-template-02 .list-layout .slz-block-item-01 .block-content {
        padding: 10px 0 0 0;
    }

    .slz-template-02 .list-layout .slz-block-item-01.style-2 .block-image {
        width: 120px;
    }

    .slz-template-02 .list-layout .slz-block-item-01.style-2 .block-content {
        padding: 0;
        width: calc(100% - 120px);
    }

    .slz-template-02 .list-layout .slz-block-item-01.style-2 .block-image + .block-content {
        padding: 0 0 0 15px;
    }

    .slz-template-02 .list-layout .slz-block-item-01.style-3 .block-info {
        display: none;
    }

    .slz-template-02 .list-layout .slz-block-item-01.style-3 .block-content {
        padding: 10px;
    }

    .slz-template-02.style-no-image .main-layout {
        width: 60%;
    }

    .slz-template-02.style-no-image .list-layout {
        width: 40%;
    }

/*----------  8.3. template 03  ------------------*/

    .slz-template-03.block-right-left .slz-list-block .item:nth-child(even) {
        direction: rtl;
    }

    .slz-template-03.block-right-left .slz-list-block .item:nth-child(even) .block-content {
        direction: ltr;
        padding: 0 20px 0 0;
    }

    .slz-template-03 .slz-block-item-01 {
        box-shadow: none;
    }

    .slz-template-03 .slz-block-item-01 .block-content {
        padding: 15px 0 0 0;
    }

    .slz-template-03 .slz-block-item-01.style-2 .block-image {
        width: 240px;
    }

    .slz-template-03 .slz-block-item-01.style-2 .block-content {
        padding: 0;
        width: calc(100% - 240px);
    }

    .slz-template-03 .slz-block-item-01.style-2 .block-image + .block-content {
        padding: 0 0 0 20px;
    }

/*----------  8.4. template 04  ------------------*/

    .slz-top-news .top-news-wrapper {
        background-color: #fafafa;
        padding: 20px;
    }

    .top-news-wrapper .item {
        margin-bottom: 15px;
        padding-bottom: 12px;
        border: none;
        text-align: left;
        border-bottom: 1px solid #ebebeb;
        display: table;
        width: 100%;
    }

    .top-news-wrapper .item .post-number {
        padding-right: 10px;
        color: #337ab7;
        display: table-cell;
        font-weight: 700;
        vertical-align: top;
        line-height: 24px;
        width: 30px;
    }

    .top-news-wrapper .item .post-info {
        top: 0;
    }

    .top-news-wrapper .item .post-info .title {
        color: #666c72;
    }

    .top-news-wrapper .item .post-info .title:hover {
        color: #337ab7;
    }

    .top-news-wrapper .item:last-child {
        margin-bottom: 0;
        border-bottom: 0;
        padding-bottom: 0;
    }

/*----------  8.5. template 05  ------------------*/

    .slz-recent-post .media {
        border-top: 1px solid #e9ebef;
        padding-top: 15px;
        margin-top: 15px;
    }

    .slz-recent-post .media:first-child {
        padding-top: 0;
        border-top: none;
        margin-top: 0;
    }

    .slz-recent-post .media-left {
        padding-right: 15px;
    }

    .slz-recent-post .media-right {
        padding-left: 0;
        width: 100%;
    }

    .slz-recent-post .wrapper-image {
        position: relative;
        width: 80px;
        display: block;
        overflow: hidden;
    }

    .slz-recent-post .wrapper-image:before {
        content: "";
        display: block;
        padding-top: 100%;
    }

    .slz-recent-post .wrapper-image img {
        height: 100%;
        width: auto;
        max-width: none;
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .slz-recent-post .media-heading {
        font-size: 15px;
        color: #213047;
        display: block;
        text-transform: capitalize;
    }

    .slz-recent-post .media-heading:hover {
        color: #337ab7;
    }

    .slz-recent-post .meta {
        margin: 0 -12px;
        line-height: 18px;
    }

    .slz-recent-post .meta > .icons {
        margin: 0 0 0 12px;
        color: #666c72;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
    }

    .slz-recent-post .meta-info {
        font-size: 12px;
        color: #9aa7bc;
        display: inline-block;
        margin: 0 12px;
        text-transform: capitalize;
    }

    .slz-recent-post .meta-info .link {
        color: #9aa7bc;
        padding-left: 5px;
    }

    .slz-recent-post .meta-info .link:hover,
    .slz-recent-post .meta-info .link:focus {
        color: #337ab7;
    }

    .slz-recent-post .icon-meta {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .slz-recent-post .view .icon-meta:before {
        content: "\f06e";
    }

    .slz-recent-post .comment .icon-meta:before {
        content: "\f086";
    }

    .slz-recent-post .block-info {
        margin-bottom: 0;
    }



/*==============================================
=            9. GRID LAYOUT                   =
==============================================*/

/*----------  9.0. global style  -----------------*/

    .slz-block-grid {
        margin: -15px;
    }

    .slz-block-grid .block-element {
        float: left;
        padding: 15px;
    }

    .slz-block-grid.right .block-element {
        float: right;
    }

    .slz-block-grid .small-block .block-title {
        font-size: 16px;
    }

/*----------  9.1. grid layout 01  ---------------*/

    .slz-block-grid.style-1 .small-block {
        width: 25%;
    }

    .slz-block-grid.style-1 .small-block .block-info {
        display: none;
    }

    .slz-block-grid.style-1 .big-block {
        width: 50%;
    }

    .slz-block-grid.style-1 .big-block .block-image:before {
        padding-top: calc(67% + 10px);
    }

/*----------  9.2. grid layout 02  ---------------*/

    .slz-block-grid.style-2 .small-block {
        width: 35%;
    }

    .slz-block-grid.style-2 .small-block .block-info {
        display: none;
    }

    .slz-block-grid.style-2 .big-block {
        width: 65%;
    }

    .slz-block-grid.style-2 .big-block .block-image:before {
        padding-top: calc(75% - 9px);
    }

/*----------  9.3. grid layout 03  ---------------*/

    .slz-block-grid.style-3 .small-block {
        width: 25%;
    }

    .slz-block-grid.style-3 .small-block .block-info {
        display: none;
    }

    .slz-block-grid.style-3 .medium-block {
        width: 50%;
    }

    .slz-block-grid.style-3 .medium-block .block-info {
        display: none;
    }

    .slz-block-grid.style-3 .medium-block .block-image:before {
        padding-top: 50%;
    }

    .slz-block-grid.style-3 .big-block {
        width: 50%;
    }

    .slz-block-grid.style-3 .big-block .block-image:before {
        padding-top: calc(90% - 15px);
    }

/*----------  9.4. grid layout 04  ---------------*/

    .slz-block-grid.style-4 .block-element {
        width: 50%;
    }

    .slz-block-grid.style-4 .block-image:before {
        padding-top: 67%;
    }

/*----------  9.5. grid layout 05  ---------------*/

    .slz-block-grid.style-5 .block-element {
        width: 33.3333%;
    }

/*----------  9.6. grid layout 06  ---------------*/

    .slz-block-grid.style-6 .big-block {
        width: 50%;
    }

    .slz-block-grid.style-6 .small-block {
        width: 20%;
    }

/*----------  9.7. grid layout 07  ---------------*/
    .slz-block-grid.style-7 .medium-block {
        width: 33.3333%;
    }

    .slz-block-grid.style-7 .small-block {
        width: 25%;
    }



/*==============================================
=            10. MANSORY LAYOUT                =
==============================================*/

/*----------  10.0. global style  -----------------*/

    .slz-block-mansory .slz-isotope-grid {
        margin: 0 -15px;
    }

    .slz-block-mansory .slz-isotope-grid .grid-item {
        padding: 15px;
    }

/*----------  10.1. tab filler  -------------------*/
    .tab-filter {
        margin: 0 0 20px 0;
        padding: 0;
        list-style: none;
        display: inline-block;
        text-align: center;
    }

    .tab-filter li {
        display: inline-block;
        margin: 3px 15px 3px 15px;
    }

    .tab-filter li:first-child {
        margin-left: 0;
    }

    .tab-filter li:last-child {
        margin-right: 0;
    }

    .tab-filter li .link {
        position: relative;
        text-transform: capitalize;
        color: #213047;
        cursor: pointer;
    }

    .tab-filter li .link:hover {
        color: #337ab7;
    }

    .tab-filter li.active .link {
        color: #337ab7;
    }

/*----------  10.2. isotop layout 1  --------------*/

    .slz-isotope-grid {
        font-size: 0;
        margin: -8px;
    }

    .slz-isotope-grid .grid-sizer {
        width: 1%;
    }

    .slz-isotope-grid .grid-item {
        padding: 8px;
        font-size: 14px;
        vertical-align: top;
        display: inline-block;
    }

    .slz-isotope-grid .grid-item > .img-full {
        width: 100%;
        display: block;
        max-width: none;
    }

    .slz-isotope-grid .grid-item-wrapper {
        overflow: hidden;
        position: relative;
    }

    .slz-isotope-grid .grid-item-wrapper:before {
        content: "";
        display: block;
        padding-top: 80%;
    }

    .slz-isotope-grid .grid-item-wrapper > .img-full {
        width: auto;
        height: 100%;
        display: block;
        max-width: none;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }

    .slz-isotope-grid .grid-item-height-2 .grid-item-wrapper:before {
        adding-top: calc(160% + 16px);
    }

    .slz-isotope-grid.column-2 .grid-item {
        width: 50%;
    }

    .slz-isotope-grid.column-3 .grid-item {
        width: 33.3333%;
    }

    .slz-isotope-grid.column-4 .grid-item {
        width: 25%;
    }

    .slz-isotope-grid.column-5 .grid-item {
        width: 20%;
    }

/*----------  10.3. isotop layout 2  --------------*/

    .slz-isotope-grid-2 {
        font-size: 0;
        margin: -8px;
    }

    .slz-isotope-grid-2 .grid-sizer {
        width: 1%;
    }

    .slz-isotope-grid-2 .grid-item {
        margin: 8px;
        font-size: 14px;
        overflow: hidden;
        position: relative;
        vertical-align: top;
        display: inline-block;
    }

    .slz-isotope-grid-2 .grid-item:before {
        content: "";
        display: block;
        padding-top: 80%;
    }

    .slz-isotope-grid-2 .grid-item > .img-full {
        width: auto;
        height: 100%;
        display: block;
        max-width: none;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }

    .slz-isotope-grid-2 .grid-item > div {
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
    }

    .slz-isotope-grid-2 .grid-item > div .block-image {
        width: 100%;
        height: 100%;
    }
    .slz-posts-mansory .slz-isotope-grid-2 .grid-item:before {
        padding-top: 122%;
    }
    .slz-isotope-grid-2 .grid-item > .slz-block-item-01.style-1 .block-image{
        height: 56%;
    }
    .slz-isotope-grid-2 .grid-item > div .block-image:before {
        content: none;
    }

    .slz-isotope-grid-2 .grid-item-height-2:before {
        padding-top: calc(160% + 16px);
    }

    .slz-isotope-grid-2.column-3 .grid-item {
        width: calc(33.3333% - 16px);
    }

    .slz-isotope-grid-2.column-3 .grid-item-width-2 {
        width: calc(66.6666% - 16px);
    }

    .slz-isotope-grid-2.column-3 .grid-item-width-2:before {
        padding-top: calc(80% + 2.5px);
    }

    .slz-isotope-grid-2.column-3 .grid-item-height-1:before {
        padding-top: calc(40% - 6.5px);
    }

    .slz-isotope-grid-2.column-4 .grid-item {
        width: calc(25% - 16px);
    }

    .slz-isotope-grid-2.column-4 .grid-item-width-2 {
        width: calc(50% - 16px);
    }

    .slz-isotope-grid-2.column-4 .grid-item-width-2:before {
        padding-top: calc(80% + 2.5px);
    }

    .slz-isotope-grid-2.column-4 .grid-item-height-1:before {
        padding-top: calc(40% - 6.5px);
    }

    .slz-isotope-grid-2.column-5 .grid-item {
        width: calc(20% - 16px);
    }

    .slz-isotope-grid-2.column-5 .grid-item-width-2 {
        width: calc(40% - 16px);
    }

    .slz-isotope-grid-2.column-5 .grid-item-width-2:before {
        padding-top: calc(80% + 3.2px);
    }

    .slz-isotope-grid-2.column-5 .grid-item-height-1:before {
        padding-top: calc(40% - 6.4px);
    }

/*----------  10.4. button loadmore  --------------*/

    .btn-loadmore-wrapper {
        display: block;
        margin-top: 50px;
        text-align: center;
    }

    .btn-loadmore-wrapper .slz-btn {
        display: inline-block;
    }

    .btn-loadmore {
        color: #fff;
        height: 40px;
        padding: 0 30px;
        font-weight: 700;
        line-height: 38px;
        text-align: center;
        letter-spacing: 1px;
        display: inline-block;
        text-transform: uppercase;
        border: 1px solid #337ab7;
        background-color: #337ab7;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
    }

    .btn-loadmore:hover {
        border-color: #4f93ce;
        background-color: #4f93ce;
        color: #fff;
    }



/*==============================================
=            11. ICON BOX                      =
==============================================*/

/*----------  11.1. icon box 1  -------------------*/

    .slz-icon-box-1 {
        display: table;
        width: 100%;
        position: relative;
        padding: 20px;
        //border: 1px solid #ddd;
    }

    .slz-icon-box-1 .icon-cell {
        display: table-cell;
        text-align: center;
    }

    .slz-icon-box-1 .content-cell {
        display: table-cell;
        vertical-align: top;
        text-align: left;
        padding-left: 15px;
    }

    .slz-icon-box-1 .wrapper-icon {
        width: 70px;
        height: 70px;
        line-height: 68px;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        border: 1px solid #213047;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
    }

    .slz-icon-box-1 .wrapper-icon .slz-icon {
        color: #213047;
        font-size: 30px;
        line-height: inherit;
        position: relative;
        z-index: 5;
    }

    .slz-icon-box-1 .wrapper-icon.bg-image {
        position: relative;
        border: none;
        width: auto;
        height: auto;
        line-height: inherit;
    }

    .slz-icon-box-1 .wrapper-icon.bg-image .bg-image-icon {
        position: relative;
    }

    .slz-icon-box-1 .wrapper-icon.bg-image .bg-image-icon2 {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        opacity: 0;
    }

    .slz-icon-box-1 .wrapper-icon.bg-image .slz-icon {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
    }

    .slz-icon-box-1 .wrapper-icon.bg-image:hover .bg-image-icon ~ .bg-image-icon2 {
        opacity: 1;
    }

    .slz-icon-box-1 .wrapper-icon-image {
        display: inline-block;
        min-width: 70px;
    }

    .slz-icon-box-1 .wrapper-icon-image .slz-icon-img {
        display: block;
        max-width: 100%;
    }

    .slz-icon-box-1 .wrapper-info .title {
        font-size: 18px;
        font-weight: 700;
        margin: 0 0 10px 0;
        text-transform: capitalize;
        color: #213047;
    }

    .slz-icon-box-1 .wrapper-info .description {
        margin-bottom: 15px;
        font-size: inherit;
    }

    .slz-icon-box-1 .wrapper-info .description:last-child {
        margin-bottom: 0;
    }

    .slz-icon-box-1 .wrapper-info .btn {
        background-color: #fafafa;
        color: #666c72;
        border: 1px solid #fafafa;
    }

    .slz-icon-box-1 .wrapper-info .btn .icons {
        margin-left: 10px;
    }

    .slz-icon-box-1.style-vertical .icon-cell {
        display: block;
        text-align: center;
    }

    .slz-icon-box-1.style-vertical .content-cell {
        display: block;
        text-align: center;
        padding-top: 15px;
        padding-left: 0;
    }

    .slz-icon-box-1.style-vertical.left .icon-cell {
        text-align: left;
    }

    .slz-icon-box-1.style-vertical.left .content-cell {
        text-align: left;
    }

    .slz-icon-box-1.style-vertical.right .icon-cell {
        text-align: right;
    }

    .slz-icon-box-1.style-vertical.right .content-cell {
        text-align: right;
    }

/*----------  11.2. icon box 2  -------------------*/

    .slz-icon-box-2 {
        padding: 20px;
        //border: 1px solid #ddd;
    }

    .slz-icon-box-2 .icon-cell {
        display: block;
        text-align: left;
    }

    .slz-icon-box-2 .content-cell {
        display: block;
        text-align: left;
        padding-top: 15px;
    }

    .slz-icon-box-2 .wrapper-icon {
        display: inline-block;
        vertical-align: top;
        margin-right: 20px;
    }

    .slz-icon-box-2 .wrapper-icon .slz-icon {
        color: #213047;
        font-size: 24px;
        line-height: inherit;
        position: relative;
        z-index: 2;
    }

    .slz-icon-box-2 .wrapper-icon-image {
        display: inline-block;
        vertical-align: top;
        margin-right: 20px;
    }

    .slz-icon-box-2 .wrapper-icon-image .slz-icon-img {
        display: block;
        max-width: 100%;
    }

    .slz-icon-box-2 .title {
        margin: 0;
        line-height: 1.5;
        font-size: 18px;
        font-weight: 700;
        color: #213047;
        vertical-align: top;
        display: inline-block;
        text-transform: capitalize;
    }

    .slz-icon-box-2 .wrapper-info .description {
        margin-bottom: 15px;
        font-size: inherit;
    }

    .slz-icon-box-2 .wrapper-info .description:last-child {
        margin-bottom: 0;
    }

    .slz-icon-box-2 .wrapper-info .btn {
        background-color: #fafafa;
        color: #666c72;
        border: 1px solid #fafafa;
    }

    .slz-icon-box-2 .wrapper-info .btn .icons {
        margin-left: 10px;
    }



/*==============================================
=            12. TABS                          =
==============================================*/

/*----------  12.1. tab vertical  -----------------*/

    .slz-tab-vertical {
        display: table;
        width: 100%;
    }

    .slz-tab-vertical .tab-list-wrapper {
        display: table-cell;
        width: 15%;
        vertical-align: middle;
    }

    .slz-tab-vertical .tab-list {
        position: relative;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
              flex-direction: column;
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
              justify-content: space-between;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
    }

    .slz-tab-vertical .tab-list li {
        display: block;
        max-width: 100px;
        text-align: center;
        line-height: 1.22;
    }

    .slz-tab-vertical .tab-list li .link {
        font-size: 18px;
        color: #213047;
        cursor: pointer;
        position: relative;
        text-transform: capitalize;
    }

    .slz-tab-vertical .tab-content {
        display: table-cell;
        width: 85%;
    }

    .slz-tab-vertical .text-content {
        display: block;
    }

/*----------  12.2. tab horizontal  ---------------*/

    .slz-tab .tab-list {
        display: inline-block;
        position: relative;
        line-height: 1;
        margin-bottom: 30px;
    }

    .slz-tab .tab-list li {
        display: inline-block;
        margin: 0 20px;
    }

    .slz-tab .tab-list li:first-child {
        margin-left: 0;
    }

    .slz-tab .tab-list li:last-child {
        margin-right: 0;
    }

    .slz-tab .tab-list li .link {
        font-size: 18px;
        padding-bottom: 10px;
        color: #213047;
        cursor: pointer;
        position: relative;
        text-transform: capitalize;
    }

    .slz-tab .tab-list li.active .link {
        border-bottom: 1px solid #ccc;
    }

    .slz-tab .text-content {
        display: block;
    }



/*==============================================
=            13. CAROUSEL                      =
==============================================*/

/*----------  13.1. carousel layout 1  -------------*/

    .slz-carousel-syncing .slider-for .image-gallery-wrapper {
        display: block;
        position: relative;
        overflow: hidden;
        margin-bottom: 0;
        background-color: #000;
    }

    .slz-carousel-syncing .slider-for .image-gallery-wrapper:before {
        display: block;
        content: '';
        padding-top: 67%;
    }

    .slz-carousel-syncing .slider-for .image-gallery-wrapper .images {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 3;
    }

    .slz-carousel-syncing .slider-for .image-gallery-wrapper img {
        width: auto;
        height: 100%;
        max-width: none;
        position: absolute;
        top: 0;
        left: 50%;
        margin: 0;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -moz-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
    }

    .slz-carousel-syncing .slider-for .image-gallery-wrapper .content {
        position: absolute;
        z-index: 3;
        width: 100%;
        bottom: 0;
        background-color: rgba(0, 0, 0, 0.3);
        color: #FFF;
        padding: 15px 20px;
    }

    .slz-carousel-syncing .slider-for + .slider-nav {
        margin-top: 10px;
    }

    .slz-carousel-syncing .slider-nav {
        margin: 0 -5px;
    }

    .slz-carousel-syncing .slider-nav .item {
        padding: 0 5px 0 5px;
        cursor: pointer;
    }

    .slz-carousel-syncing .slider-nav + .slider-for {
        margin-top: 10px;
    }

    .slz-carousel-syncing .slick-prev {
        left: 0;
        z-index: 5;
    }

    .slz-carousel-syncing .slick-next {
        right: 0;
        z-index: 5;
    }

    .slz-carousel-syncing .slick-prev,
    .slz-carousel-syncing .slick-next {
        background-color: rgba(255, 255, 255, 0.2);
        width: 40px;
        height: 40px;
        line-height: 40px;
        color: #213047;
        z-index: 5;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
    }

    .slz-carousel-syncing .slick-prev {
        left: 0;
    }

    .slz-carousel-syncing .slick-prev:before {
        font-family: "fontAwesome";
        content: "\f104";
        line-height: inherit;
    }

    .slz-carousel-syncing .slick-next {
        right: 0;
    }

    .slz-carousel-syncing .slick-next:before {
        font-family: "fontAwesome";
        content: "\f105";
        line-height: inherit;
    }



/*==============================================
=            14. PAGINATION                    =
==============================================*/

/*----------  14.1. pagination 01  -----------------*/

    .slz-pagination {
        font-size: 14px;
    }

    .slz-pagination .pagination{
        margin-bottom: 0px;
    }

    .slz-pagination .nav-links {
        display: inline-block;
        padding-left: 0;
        margin: 0;
        border-radius: 4px;
    }

    .slz-pagination .nav-links a.page-numbers,
    .slz-pagination .nav-links span {
        display: inline-block;
        color: #213047;
        border: none;
        padding: 0;
        margin: 0 3px;
        min-width: 32px;
        height: 32px;
        line-height: 32px;
        text-align: center;
        background-color: transparent;
        text-transform: capitalize;
    }

    .slz-pagination .nav-links a.page-numbers:hover,
    .slz-pagination .nav-links span:hover {
        background-color: #337ab7;
        color: #FFF;
    }

    .slz-pagination .nav-links a.page-numbers.prev,
    .slz-pagination .nav-links span.prev {
        margin-left: 0px;
        padding-left: 5px;
        padding-right: 5px;
    }

    .slz-pagination .nav-links a.page-numbers.next,
    .slz-pagination .nav-links span.next {
        margin-right: 0px;
        padding-left: 5px;
        padding-right: 5px;
    }

    .slz-pagination .nav-links .current {
        background-color: #337ab7;
        color: #FFF;
    }



/*==============================================
=            15. SLZ BUTTON                    =
==============================================*/

/*----------  15.1. button default  ---------------*/

    .slz-btn {
        color: #fff;
        height: 40px;
        padding: 0 30px;
        font-weight: 700;
        line-height: 38px;
        text-align: center;
        letter-spacing: 1px;
        display: inline-block;
        text-transform: uppercase;
        border: 1px solid #337ab7;
        background-color: #337ab7;
        border-radius: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
    }

    .slz-btn:hover {
        border: 1px solid;
        border-color: #4f93ce;
        background-color: #4f93ce;
        color: #ffffff;
    }

    .slz-btn:focus {
        border: 1px solid;
        border-color: #285f8f;
        background-color: #285f8f;
        color: #ffffff;
    }

    .slz-btn > .btn-icon + .btn-text {
        margin-left: 10px;
    }

    .slz-btn > .btn-text + .btn-icon {
        margin-left: 10px;
    }

    .slz-btn .btn-icon.slz-icon{
        vertical-align: -2px;
    }

    .slz-btn .btn-icon.slz-icon:before{
        margin-left: 0;
    }

    .slz-btn.slz-btn-image {
        background-color: transparent !important;
    }

/*----------  15.2. button image  -----------------*/

    .btn-img {
        width: 200px;
        height: auto;
        padding: 0;
        margin: 0;
        border: 0;
        background-color: transparent !important;
    }

    .btn-img:hover,
    .btn-img:focus {
        border: none;
        background-color: transparent;
    }

    .btn-img:hover img,
    .btn-img:focus img {
        opacity: 0.9;
    }

    .btn-img img {
        width: 100%;
    }

/*----------  15.3. group button  -----------------*/

    .slz-group-btn .slz-btn {
        margin-left: 15px;
    }

    .slz-group-btn .slz-btn:first-child {
        margin-left: 0;
    }

/*----------  15.4. button icon absolute  ---------*/
    .btn-absolute {
        padding: 0 40px 0 30px;
    }
    .btn-absolute .btn-icon {
        position: absolute;
        right: -20px;
        top: 50%;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        border: none;
        font-size: 14px;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        margin-left: 0;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transition: all 0.5s ease;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
    }



/*==============================================
=            16. COMMENT RATING                =
==============================================*/

    .stars-rating .review:after {
        content: "\f005\f005\f005\f005\f005";
        top: 0;
        position: absolute;
        left: 0;
        font-family: FontAwesome;
        color: #dadada;
        float: left;
        overflow: hidden;
        text-indent: 0;
    }

    .comment-form-rating {
        margin: 0 -15px;
    }

    .comment-form-rating .stars a,
    .stars-rating .review {
        width: 2em;
        position: relative;
        display: inline-block;
        text-indent: -999px;
        margin-right: 1em;
        border-right: 1px solid #EEE;
    }

    .stars-rating .review {
        border-right: none;
        margin-right: 0;
    }

    .comment-form-rating .stars a:before,
    .stars-rating .review:before {
        content: "\f006";
        top: 0;
        position: absolute;
        left: 0;
        font-family: FontAwesome;
        color: #f9d116;
        float: left;
        overflow: hidden;
        text-indent: 0;
        z-index: 5;
    }

    .comment-form-rating .stars a.star-2,
    .stars-rating .review {
        width: 3em;
    }

    .comment-form-rating .stars a.star-3,
    .stars-rating .review.star-3 {
        width: 4em;
    }

    .comment-form-rating .stars a.star-4,
    .stars-rating .review.star-4 {
        width: 5em;
    }

    .comment-form-rating .stars a.star-5,
    .stars-rating .review.star-5 {
        width: 6em;
        border-right: none;
        margin-right: 0;
    }

    .comment-form-rating .stars a.star-2:before {
        content: "\f006\f006";
    }
    .comment-form-rating .stars a.star-3:before {
        content: "\f006\f006\f006";
    }
    .comment-form-rating .stars a.star-4:before {
        content: "\f006\f006\f006\f006";
    }
    .comment-form-rating .stars a.star-5:before {
        content: "\f006\f006\f006\f006\f006";
    }
    .comment-form-rating .stars a.star-1.active:before,
    .comment-form-rating .stars a.star-1:hover:before,
    .stars-rating .review.star-1:before {
        content: "\f005";
    }
    .comment-form-rating .stars a.star-2.active:before,
    .comment-form-rating .stars a.star-2:hover:before,
    .stars-rating .review.star-2:before {
        content: "\f005\f005";
    }
    .comment-form-rating .stars a.star-3.active:before,
    .comment-form-rating .stars a.star-3:hover:before,
    .stars-rating .review.star-3:before {
        content: "\f005\f005\f005";
    }
    .comment-form-rating .stars a.star-4.active:before,
    .comment-form-rating .stars a.star-4:hover:before,
    .stars-rating .review.star-4:before {
        content: "\f005\f005\f005\f005";
    }
    .comment-form-rating .stars a.star-5.active:before,
    .comment-form-rating .stars a.star-5:hover:before,
    .stars-rating .review.star-5:before {
        content: "\f005\f005\f005\f005\f005";
    }



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

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

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

    /*----------  grid layout  ----------*/
    .slz-block-grid.style-2 .big-block .block-image:before {
        padding-top: calc(75% - 5px);
    }

    .slz-block-grid.style-3 .big-block .block-image:before {
        padding-top: calc(90% - 10px);
    }
}

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

    /*----------  template  ----------*/
    .list-layout.column-4 .element {
        width: 50%;
    }
    .list-layout.column-4 .element:nth-child(-n + 4) {
        margin-top: 30px;
    }
    .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 0;
    }
    .style-no-image .list-layout.column-4 .element {
        width: 50%;
    }
    .style-no-image .list-layout.column-4 .element:nth-child(-n + 4) {
        padding-top: 6px;
        margin-top: 10px;
        border-top: 1px solid #cccccc;
    }
    .style-no-image .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    /*----------  grid layout  ----------*/
    .slz-block-grid.style-1 .small-block {
        width: 50%;
    }
    .slz-block-grid.style-1 .big-block {
        width: 100%;
    }
    .slz-block-grid.style-1 .big-block .block-image:before {
        padding-top: 67%;
    }
    .slz-block-grid.style-2 .small-block {
        width: 50%;
    }
    .slz-block-grid.style-2 .big-block {
        width: 100%;
    }
    .slz-block-grid.style-2 .big-block .block-image:before {
        padding-top: 67%;
    }
    .slz-block-grid.style-3 .small-block {
        width: 50%;
    }
    .slz-block-grid.style-3 .medium-block {
        width: 100%;
    }
    .slz-block-grid.style-3 .big-block {
        width: 100%;
    }
    .slz-block-grid.style-3 .big-block .block-image:before {
        padding-top: 67%;
    }
}

/*----------  4. screen 767  ---------------------*/
@media screen and (max-width: 767px) {

    /*----------  template  ----------*/
    .list-layout {
        margin-left: -10px;
        margin-right: -10px;
    }

    .list-layout .element {
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 20px;
    }

    .slz-template-01 .list-layout {
        margin-top: 20px;
    }

    .slz-template-02 {
        margin: 0 -10px;
        font-size: 0;
        width: calc(100% + 20px);
    }

    .slz-template-02 .main-layout {
        padding: 0 10px;
    }

    .slz-template-02 .list-layout {
        padding: 0 10px;
    }

    .list-layout.column-4 .element:nth-child(-n + 4) {
        margin-top: 20px;
    }

    .list-layout.column-2 .element:nth-child(-n + 2),
    .list-layout.column-3 .element:nth-child(-n + 3),
    .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 20px;
    }

    .list-layout.column-3 .element,
    .list-layout.column-4 .element {
        width: 50%;
    }

    .list-layout.column-3 .element:nth-child(-n + 2),
    .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 0px;
    }

    .style-no-image .list-layout.column-3 .element,
    .style-no-image .list-layout.column-4 .element {
        width: 50%;
    }

    .style-no-image .list-layout.column-3 .element:nth-child(-n + 3),
    .style-no-image .list-layout.column-4 .element:nth-child(-n + 3) {
        padding-top: 6px;
        margin-top: 10px;
        border-top: 1px solid #cccccc;
    }

    .style-no-image .list-layout.column-3 .element:nth-child(-n + 2),
    .style-no-image .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    /*----------  grid layout  ----------*/
    .slz-block-grid.style-1,
    .slz-block-grid.style-2,
    .slz-block-grid.style-3,
    .slz-block-grid.style-4,
    .slz-block-grid.style-5,
    .slz-block-grid.style-6,
    .slz-block-grid.style-7 {
        margin: 0 -10px;
    }
    .slz-block-grid.style-1 .block-element ,
    .slz-block-grid.style-2 .block-element ,
    .slz-block-grid.style-3 .block-element ,
    .slz-block-grid.style-4 .block-element ,
    .slz-block-grid.style-5 .block-element ,
    .slz-block-grid.style-6 .block-element ,
    .slz-block-grid.style-7 .block-element {
        padding: 10px;
    }

}

/*----------  5. screen 600  ---------------------*/
@media screen and (max-width: 600px) {

    /*----------  template  ----------*/
    .slz-template-02 .main-layout,
    .slz-template-02 .list-layout,
    .slz-template-02.style-no-image .list-layout,
    .slz-template-02.style-no-image .main-layout {
        width: 100%;
    }

    .slz-template-02 .list-layout,
    .slz-template-02.style-no-image .list-layout {
        margin-top: 20px;
    }
}

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

    /*----------  block item  ----------*/
    .slz-block-item-01.style-2 .block-image,
    .slz-block-item-01.style-2 .block-content {
        width: 100%;
        display: block;
    }

    /*----------  template  ----------*/
    .list-layout.column-2 .element,
    .list-layout.column-3 .element,
    .list-layout.column-4 .element {
        width: 100%;
    }
    .list-layout.column-2 .element:nth-child(-n + 2),
    .list-layout.column-3 .element:nth-child(-n + 2),
    .list-layout.column-4 .element:nth-child(-n + 2) {
        margin-top: 20px;
    }
    .list-layout.column-2 .element:first-child,
    .list-layout.column-3 .element:first-child,
    .list-layout.column-4 .element:first-child {
        margin-top: 0;
    }
    .style-no-image .list-layout.column-2 .element,
    .style-no-image .list-layout.column-3 .element,
    .style-no-image .list-layout.column-4 .element {
        width: 100%;
    }
    .style-no-image .list-layout.column-2 .element:nth-child(-n + 2),
    .style-no-image .list-layout.column-3 .element:nth-child(-n + 2),
    .style-no-image .list-layout.column-4 .element:nth-child(-n + 2) {
        padding-top: 6px;
        margin-top: 10px;
        border-top: 1px solid #cccccc;
    }
    .style-no-image .list-layout.column-2 .element:first-child,
    .style-no-image .list-layout.column-3 .element:first-child,
    .style-no-image .list-layout.column-4 .element:first-child {
        margin-top: 0;
        padding-top: 0;
        border-top: none;
    }

    /*----------  grid layout  ----------*/
    .slz-block-grid.style-1 .small-block {
        width: 100%;
    }
    .slz-block-grid.style-1 .small-block .block-info {
        display: block;
    }
    .slz-block-grid.style-2 .small-block {
        width: 100%;
    }
    .slz-block-grid.style-2 .small-block .block-info {
        display: block;
    }
    .slz-block-grid.style-3 .small-block {
        width: 100%;
    }
    .slz-block-grid.style-3 .small-block .block-info {
        display: block;
    }
    .slz-block-grid.style-3 .medium-block .block-info {
        display: block;
    }
    .slz-block-grid.style-3 .medium-block .block-image:before {
        padding-top: 67%;
    }

}

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

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

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