@media screen and (max-device-width: 767px) and (orientation: portrait) {
    .header-nav {
        margin-top: 70px !important;
    }
}
@media screen and (max-device-width: 767px) and (orientation: portrait) {
    .divider {
        background-image: none !important;
        background-color: #ffd1a0;
    }
}
@media screen and (max-device-width: 767px) and (orientation: portrait) {
    .wow {
        display: none
    }
}
@media screen and (max-device-width: 767px) and (orientation: portrait) {
    .contact {
        margin-top: 273%;
    }
}
@media screen and (max-device-width: 767px) and (orientation: portrait) {
    .whyvideo {
        display: none
    }
}
@media only screen and (min-width: 767px) {
    /* For tablets: */
    .full-width {
        padding:20%;
    }

    #myVideo {
        right: 0;
        bottom: 0;
        min-width: 100%;
        min-height: 100%;
    }
    .statistics_section {
        background: url(/i/images.www/statistics-background.jpg);
        background-size: cover;
        background-position: 50%;
        transition: all .2s ease-in;
    }
    #myBtn {
        width: 200px;
        font-size: 18px;
        padding: 10px;
        border: none;
        background: #000;
        color: #fff;
        cursor: pointer;
    }

        #myBtn:hover {
            background: #ddd;
            color: black;
        }

    .content {
        position: absolute;
        bottom: 0;
       
        color: #f1f1f1;
        width: 100%;
        height: 100%;
    }

    .mbr-transparent {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .mbr-background-video,
    .mbr-background-video-preview {
        bottom: 0;
        left: 0;
        overflow: hidden;
        position: absolute;
        right: 0;
        top: 0;
    }

        .mbr-background-video-preview img {
            margin: 0 !important;
            width: 100% !important;
            height: 100% !important;
            overflow: hidden !important;
        }

    .mbr-section {
        overflow: hidden;
        position: relative;
    }

    .mbr-section--full-height {
        height: 100vh;
    }

    .mbr-section--bg-adapted {
        background-attachment: scroll;
        background-position: 50% 0;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .mbr-section__container {
        padding: 0;
        position: relative;
        z-index: 3;
    }

    .mbr-box {
        display: table;
        width: 100%;
    }

    .mbr-box__magnet {
        display: table-cell;
        float: none;
        height: 100%;
        min-width: 100%;
        margin: 0;
        text-align: center;
        vertical-align: middle;
    }

    .mbr-box__container {
        height: 50%;
    }


    .pattern {
        background-image: url(../images/pattern.png);
        background-repeat: repeat;
        background-attachment: scroll;
        width: 100%;
        height: 100%;
        position: absolute;
        z-index: 2;
        top: 0;
        left: 0;
    }



    @media (max-width: 767px) {
        .mbr-box__container {
            height: 100%;
        }
    }

    .mbr-overlay {
        background: #000;
        bottom: 0;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 2;
    }


    /* Video Content
===========================================
*/

    .vd-content-container {
        display: table;
        position: relative;
        width: 100%;
        height: 100%;
        color: #fff;
        background-size: cover;
    }

    .vd-content {
        display: table-cell;
        text-align: center;
        vertical-align: middle;
    }

        .vd-content h1 {
            font-family: 'Oswald', sans-serif;
            font-size: 54px;
            line-height: 62px;
            margin: 0;
            padding: 10px 0px 0px 0px;
            text-transform: uppercase;
            color: rgba(255, 255, 255, 1);
        }

        .vd-content h2 {
            font-family: 'Montserrat', sans-serif;
            font-size: 24px;
            line-height: 32px;
            font-weight: 200;
            margin: 0;
            padding: 0;
            color: rgba(255,255,255 .1);
        }

        .vd-content h3 {
            font-family: 'Bebas Neue Bold', sans-serif;
            font-size: 42px;
            line-height: 42px;
            font-weight: 700;
            margin: 0;
            color: rgba(176, 140, 82, 1);
            padding-bottom: 30px;
        }

        .vd-content p {
            font-size: 16px;
            line-height: 24px;
            font-weight: 400;
            max-width: 650px;
            margin: 0 auto;
            font-family: 'Montserrat', sans-serif;
        }

    strong {
        font-family: 'Montserrat Bold', sans-serif;
    }

    .vd-content .btn {
        margin-top: 30px;
    }

    .vd-content-footernav {
        margin: 0 auto;
        bottom: 0;
        left: 0;
        right: 0;
        font-family: 'Bebas Neue', sans-serif;
        padding-bottom: 1%;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 18px;
        position: absolute;
        color: #fff;
    }

        .vd-content-footernav i {
            font-size: 32px;
            color: #fff;
        }

    .fa-play {
        padding-right: 10px;
    }


    /* Media Queries
================================================
 */

    @media only screen and (max-width: 1200px) {
    }

    @media only screen and (max-width: 992px) {
    }

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

    @media only screen and (max-width: 640px) {
        .vd-content h1 {
            font-size: 30px;
            line-height: 40px;
        }

        .vd-content h2 {
            font-family: 'Montserrat', sans-serif;
            font-size: 14px;
            line-height: 18px;
        }

        .vd-content h3 {
            font-family: 'Bebas Neue Bold', sans-serif;
            font-size: 42px;
            line-height: 42px;
            margin: 0;
        }

        .vd-content p {
            font-size: 12px;
            line-height: 16px;
            font-weight: 400;
            max-width: 650px;
            margin: 0 auto;
            padding: 0px 20px 0px 20px;
            font-family: 'Montserrat', sans-serif;
        }

        .vd-content-footernav {
            margin: 0 auto;
            bottom: 0;
            left: 0;
            right: 0;
            font-family: 'Bebas Neue', sans-serif;
            padding-bottom: 10px;
            text-transform: uppercase;
            font-weight: 700;
            font-size: 10px;
            position: absolute;
            color: #fff;
        }
    }



    .btn {
        padding-left: 50px;
        padding-right: 50px;
        padding-top: 16px;
        padding-bottom: 16px;
        margin-top: 20px;
        font-size: 12px;
        font-weight: 200;
        border-radius: 0px;
        text-transform: uppercase;
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        -webkit-transition: all 0.5s ease-in-out;
        transition: all 0.5s ease-in-out;
    }


    .btn-solid {
        background: rgba(54,54,54,1);
        color: #fff;
        border: 4px solid rgba(54,54,54,1);
    }

        .btn-solid:hover {
            background: rgba(11,11,11,1);
            color: #fff;
            border: 4px solid rgba(11,11,11,1);
        }


    .btn-transparent {
        background: rgba(54,54,54,0);
        color: #fff;
        border: 4px solid rgba(255,255,255,1);
    }

        .btn-transparent:hover {
            background: rgba(255,255,255,1);
            color: #222;
            border: 4px solid rgba(255,255,255,1);
        }

    .btnmargin {
        margin: 0px 10px 0px 10px;
    }

    @keyframes animatedBackground {
        from {
            background-position: 0 0;
        }

        to {
            background-position: 100% 0;
        }
    }

    #animate-area2 {
        background-image: url(bg-clouds.png);
        background-position: 0px 0px;
        background-repeat: repeat-x;
        animation: animatedBackground 100s linear infinite;
    }

    #animate-area {
        background-image: url(bg-clouds.png);
        background-position: 0px 0px;
        background-repeat: repeat-x;
        animation: animatedBackground 0s linear infinite;
    }

    .rabbit {
        width: 5em;
        height: 3em;
        background: #ffffff;
        border-radius: 70% 90% 60% 50%;
        position: relative;
        box-shadow: -0.2em 1em 0 -0.75em #b78e81;
        @include transform(rotate(0deg) translate(-2em,0));
        animation: hop 1s infinite linear;
        z-index: 1;
        .no-flexbox &

{
    margin: 10em auto 0;
}

//tail, eye, feet
&:before {
    content: "";
    position: absolute;
    width: 1em;
    height: 1em;
    background: white;
    // tail border-radius:100%;
    top: 0.5em;
    left: -0.3em;
    box-shadow: 4em 0.4em 0 -0.35em #3f3334, // eye 0.5em 1em 0 white, // back foot 4em 1em 0 -0.3em white, // front foot 4em 1em 0 -0.3em white, 4em 1em 0 -0.4em white;
    ;
    animation: kick 1s infinite linear;
}

// ears
&:after {
    content: "";
    position: absolute;
    width: .75em;
    height: 2em;
    background: white;
    border-radius: 50% 100% 0 0;
    @include transform(rotate(-30deg));
    right: 1em;
    top: -1em;
    border-top: 1px solid #f7f5f4;
    border-left: 1px solid #f7f5f4;
    box-shadow: -0.5em 0em 0 -0.1em white;
}

}

.clouds {
    background: white;
    width: 2em;
    height: 2em;
    border-radius: 100% 100% 0 0;
    position: relative;
    top: -5em;
    @include opacity(0);
    @include transform(translate(0,0));
    animation: cloudy 1s infinite linear forwards;
    box-shadow: 5em 2em 0 -0.3em white, -2em 2em 0 0 white;
    &:before,&:after

{
    content: '';
    position: absolute;
    box-shadow: 5em 2em 0 -0.3em white, -2em 2em 0 white;
}

&:before {
    width: 1.25em;
    height: 1.25em;
    border-radius: 100% 100% 0 100%;
    background: white;
    left: -30%;
    bottom: 0;
}

&:after {
    width: 1.5em;
    height: 1.5em;
    border-radius: 100% 100% 100% 0;
    background: white;
    right: -30%;
    bottom: 0;
}

}


@keyframes hop {
    20% {
        @include transform(rotate(-10deg) translate(1em,-2em));
        box-shadow: -0.2em 3em 0 -1em #b78e81;
    }

    40% {
        @include transform(rotate(10deg) translate(3em,-4em));
        box-shadow: -0.2em 3.25em 0 -1.1em #b78e81;
    }

    60%,75% {
        @include transform(rotate(0) translate(4em,0));
        box-shadow: -0.2em 1em 0 -0.75em #b78e81;
    }
}



@keyframes kick {
    20%,50% {
        box-shadow: 4em 0.4em 0 -0.35em #3f3334, 0.5em 1.5em 0 white, 4em 1.75em 0 -0.3em white, 4em 1.75em 0 -0.3em white, 4em 1.9em 0 -0.4em white;
    }

    40% {
        box-shadow: 4em 0.4em 0 -0.35em #3f3334, 0.5em 2em 0 white, 4em 1.75em 0 -0.3em white, 4.2em 1.75em 0 -0.2em white, 4.4em 1.9em 0 -0.2em white;
    }
}

@keyframes cloudy {
    40% {
        @include opacity(0.75);
        @include transform(translate(-3em,0));
    }

    55% {
        @include opacity(0);
        @include transform(translate(-4em,0));
    }

    90% {
        @include transform(translate(0,0));
    }
}