@media only screen and (max-width: 1200px) {
    .main-container,
    .section-wrapper2{
        max-width: none;
        width: calc(100% - 40px);
        margin: 0 auto;
    }
}
@media only screen and (min-width: 1024px) {
    .nav-links{
        display: flex !important;
    }
    body.video-playing .welcome-text {
        transform: translateY(0px);
        opacity: 1;
    }
}
@media only screen and (max-width: 1024px) {
    .section-wrapper,
    .section-wrapper1,
    .section-wrapper3{
        max-width: none;
        width: calc(100% - 40px);
        margin: 0 auto;
    }
    .header-outer{
        padding-top: 20px;
    }
    .header .header-logo img{
        width: 100px;
        height: 37px;
    }
    .header .demo-section > div{
        display: none;
    }
    .header .nav{
        position: relative;
    }
    .header .nav .nav-menu{
        display: flex;
        width: 33px;
        background: #ff535f;
        height: 33px;
        border-radius: 3px;
        align-items: center;
        padding: 7px;
        flex-direction: column;
        justify-content: center;
    }
    .header .nav .nav-menu span{
        background: #fff;
        height: 3px;
        width: 100%;
        margin-bottom: 3px;
        border-radius: 3px;
    }
    .header .nav .nav-menu span:last-child{
        margin-bottom: 0;
    }
    .header .nav .nav-links{
        display: none;
        position: absolute;
        right: 0;
        top:40px;
        background: rgba(0,0,0,1);
        padding: 20px 20px 10px 20px;
        width: 150px;
        border-radius: 10px;
        border:solid 1px #ff535f;
    }
    .header .nav .nav-links a{
        display: block;
        width: 100%;
        margin-bottom: 14px;
    }
    .banner .video-overlay {
        top:auto;
        bottom: 5%;
        transform:translateY(0);
    }
    .banner .watch-video{
        padding-top: 30px;
    }   
    .welcome-text{
        transform: translateY(0%);
        margin: 20px 0 0 0;
        padding: 20px;
        width: 100%;
    }
    .welcome-text img{
        max-width: 100px;
    }
    .why-choose{
        background: none;
    }
    .why-choose .why-choose-bg-line{
        display: none;
    }
    .benefits-wrapper{
        margin-top: 0;
    }
    .sections,
    .sections.section-3,
    .sections.section-4{
        margin-top: 20px;
        margin-bottom: 0;
    }
    .sections.section-5{
        padding: 20px 0;
    }
    .f-highlight-inner{
        padding-top: 20px;
    }
    .f-highlight-inner .section-wrapper{
        width: 100%;
    }
    .news-wrapper{
        background: none;
        padding: 0;
    }
    .news-wrapper > div{
        margin: 10px 20px 10px 0;
        width:calc(50% - 10px);
    }
    .news-wrapper > div:nth-child(2n){
        margin-right: 0;
    }
    .footer{
        margin-top: 20px;
        padding: 50px 0;
        background: url("../img/footer-bg.png") repeat-x left top;
        background-size:100% auto;
    }
    .footer .footer-bottom{
        margin-top: 20px;
    }
    .news-wrapper > div > span:nth-child(3){
        padding-left: 0;
    }

    .banner-video video {
        height: 580px;
    }
}
@media only screen and (max-width: 900px) {
    .about-wrapper{
        flex-wrap: wrap;
    }
    .about-wrapper > div{
        width: 100%;
    }
    .about-wrapper > div:last-child{
        padding: 0;
    }
    .about-wrapper > div img{
        width: 100%;
        max-width: 500px;
    }
    .about-wrapper .testimonial{
        padding-left: 0;
        padding-top: 70px;
    }
    .about-wrapper .testimonial .testimonial-user{
        margin-top: 20px;
    }
    .footer .footer-wrapper{
        flex-wrap: wrap;
    }
    .footer .footer-wrapper > div{
        width:50%;
        margin-bottom: 50px;
    }
    .footer .footer-wrapper > div:last-child{
        margin-bottom: 0;
    }
    .footer .footer-wrapper .footer-subscribe input, .footer .footer-wrapper .footer-subscribe button{
        max-width: 200px;
    }
}
@media only screen and (max-width: 700px) {
    .why-choose .section-wrapper > div{
        width: 100%;
    }
    .features .features-wrapper > div{
        width: calc(50% - 20px);
    }
    .f-highlight{
        padding-bottom: 0;
    }
    .f-highlight-wrapper > div:last-child{
        padding-top: 20px;
    }
    .sections.section-1,
    .sections.section-2,
    .features,
    .f-highlight,
    .f-highlight-inner{
        background: none;
    }
    .blog-wrapper > div{
       /* width: calc(50% - 10px); */
    }
    .blog-wrapper > div:nth-child(2)
    {
        margin-right: 0;
    }
}
@media only screen and (max-width: 600px) {
    .benefits > div{
        width: 100%;
        padding: 20px 0 !important;
        margin: 0 !important;
    }
    .benefits > div:last-child, .benefits > div:nth-last-child(2){
        border-bottom: dotted 2px #bcbcbc;
    }
    .benefits > div:nth-child(2n+1)::before{
        display: none;
    }
    .f-highlight-wrapper{
        flex-wrap: wrap;
        padding: 20px;
    }
    .f-highlight-wrapper > div{
        width: 100%;
    }
    .f-highlight-wrapper > div img{
        width: 100%;
    }
    .f-highlight-wrapper > div:last-child{
        padding-left: 0px;
    }
    .news-wrapper > div{
        margin: 20px 0;
        width:100%;
    }
}
@media only screen and (max-width: 713px) {
    .banner .banner-text > div:last-child > span > h1{
        font-size: 30px;
    }
}
@media only screen and (max-width: 500px) {
    .features .features-wrapper > div{
        width: 100%;
        margin: 10px 0;
    }
    .blog-wrapper > div{
        width: 100%;
        margin: 10px 0;
    }
    .blog-wrapper > div .img-holder img{
        width: 100%;
    }
    .footer .footer-wrapper > div{
        width: 100%;
        padding: 0;
    }
    .footer .footer-bottom{
        flex-wrap: wrap;
    }
    .footer .footer-bottom > div{
        width: 100%;
        justify-content: flex-start !important;
        margin: 5px 0;
    }

    .banner .video-overlay {
        bottom: 12%;
        left: 25%;
        width:70%;
    }


    .banner-video video {
        height: 480px;
    }
    .banner .banner-text > div:last-child  > span > h1{
        font-size: 30px;
    }
    html .blocker{
        padding: 0;
    }
    .modal.contact-form-popup a.close-modal{
        right: 5px;
        top:5px;
    }
    .modal.contact-form-popup{
        border-radius: 0;
        margin-bottom: 0;
    }
    .banner .watch-video{
        padding-bottom: 0px;
        padding-top: 5px;
    }
}

@media only screen and (max-width: 400px) {
    .banner .video-overlay{
        bottom:15%;
    }

    .banner .banner-text > div:first-child > span > h1{
        font-size: 12px;
    }

    .banner .banner-text > div:last-child > span > h1{
        font-size: 20px;
    }
}