@import url('https://fonts.googleapis.com/css?family=Vidaloka:400');
    @import '//fonts.googleapis.com/css?family=Montserrat:300,400,700';
    .demo{
        color:#f4d85a;
        font-family: 'Vidaloka', serif;
        font-family: "Montserrat",sans-serif;
    }
    .wc-snippet-gallery {
        display: flex;
        font-family: "Noto Sans",sans-serif;
    }
    .wc-snippet-gallery::after {
        clear: both;
        content: "";
        display: block;
    }
    .wc-snippet-gallery .grid-left {
        background: rgba(0, 0, 0, 0) url("/template/12be2b72/images/snippet-images/gallery-snippet-1.jpg") no-repeat scroll center center / cover ;
        flex: 0 0 50%;
        max-width: 50%;
        position: relative;
    }
    .wc-snippet-gallery .grid-right {
        flex-basis: 0;
        flex-grow: 1;
        width: 100%;
    }
    .wc-snippet-gallery .box {
        display: flex;
        flex-direction: column;
        height: 383px;
        justify-content: center;
        padding: 30px;
        position: relative;
        text-align: center;
    }
    .wc-snippet-gallery .box.text-content.red {
        background-color: #f4d85a;
    }

    .wc-snippet-gallery .text-content h3 {
        font-family: "Vidaloka",serif;
        font-size: 32px;
        line-height: 40px;
        max-height: 83px;
        overflow: hidden;
    }
    .wc-snippet-gallery .text-content.red h3 {
        color: #fff;
    }
    .wc-snippet-gallery .box.text-content.bg-white {
        background-color: #edf1f5;
    }
    .wc-snippet-gallery .text-content p {
        color: rgba(0, 0, 0, 0.77);
        font-family: "Montserrat",sans-serif;
        font-size: 13px;
        line-height: 24px;
        max-height: 72px;
        overflow: hidden;
    }
    .wc-snippet-gallery .text-content.red p {
        color: #fff;
    }
    .wc-snippet-gallery .text-content.bg-white h3 {
        color: #2d2e2e;
    }
    .wc-snippet-gallery .undrer-line {
        display: block;
        height: 2px;
        margin: 15px auto;
        width: 35px;
    }
    .wc-snippet-gallery .undrer-line.yellow {
        background-color: #f4d85a;
    }
    .wc-snippet-gallery .grid-right .box.text-image {
        background: rgba(0, 0, 0, 0) url("/template/12be2b72/images/snippet-images/gallery-snippet-2.jpg") no-repeat scroll center center / cover ;
    }
    .wc-snippet-gallery .grid-bottom .box.text-image {
        background: rgba(0, 0, 0, 0) url("/template/12be2b72/images/snippet-images/gallery-snippet-3.jpg") no-repeat scroll center center / cover ;
    }
    .wc-snippet-gallery .grid-top > div {
        float: left;
        width: 50%;
    }
    .wc-snippet-gallery .grid-bottom > div {
        float: left;
        width: 50%;
    }
    .wc-snippet-gallery .grid-right .grid-bottom .box.text-image {
        right: 50%;
    }
    .wc-snippet-gallery .grid-bottom .box.text-content {
        left: 50%;
    }
    .wc-snippet-gallery .waves-flung {
        bottom: 0;
        padding: 0 100px 30px 50px;
        position: absolute;
    }
    .wc-snippet-gallery .waves-flung h3 {
        background: #f4d85a none repeat scroll 0 0;
        display: inline-block;
        font-size: 32px;
        line-height: 36px;
        margin-bottom: -5px;
        max-height: 84px;
        overflow: hidden;
        padding: 8px 26px;
    }
    .wc-snippet-gallery .waves-flung p {
        background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0;
        color: #fff;
        display: inline-block;
        font-size: 15px;
        line-height: 24px;
        margin-top: 0;
        padding: 15px 26px;
    }
    .wc-snippet-gallery .expert-instractors a {
        background: #f4d85a none repeat scroll 0 0;
        color: #040404;
        display: inline-block;
        font-size: 12px;
        line-height: 29px;
        margin-bottom: 25px;
        padding: 3px 18px 0;
        text-transform: uppercase;
    }
    .wc-snippet-gallery a:hover {
        background: #000 none repeat scroll 0 0;
        color: #fff;
        text-decoration: none;
    }
    @media (max-width: 1200px) {
        .wc-snippet-gallery .grid-left {
            max-width: 46%;
        }
        .wc-snippet-gallery .waves-flung {
            padding: 0 35px 30px 20px;
        }
        .wc-snippet-gallery .text-content h3 {
            font-size: 25px;
            line-height: 35px;
            max-height: 68px;
        }
        .wc-snippet-gallery .waves-flung h3 {
            font-size: 28px;
            line-height: 35px;
        }
    }
    @media (max-width: 991px) {
        .wc-snippet-gallery {
            display: block;
        }
        .wc-snippet-gallery .grid-left {
            margin-bottom: 30px;
            max-width: inherit;
            min-height: 550px;
        }
    }
    @media (max-width: 767px) {
        .wc-snippet-gallery .grid-top > div {
            float: none;
            width: 100%;
        }
        .wc-snippet-gallery .grid-bottom .box.text-content {
            float: none;
            left: 0;
            width: 100%;
        }
        .wc-snippet-gallery .grid-right .grid-bottom .box.text-image {
            right: 0;
            width: 100%;
        }
        .wc-snippet-gallery .box.text-content.red {
            overflow: hidden;
        }
        .wc-snippet-gallery .grid-left {
            min-height: 430px;
        }
        .wc-snippet-gallery .text-content h3 {
            font-size: 26px;
        }
        .wc-snippet-gallery .waves-flung {
            padding: 0 15px 30px;
        }
        .wc-snippet-gallery .box {
            height: 337px;
        }
        .wc-snippet-gallery .text-content h3 {
            max-height: 71px;
        }

    }