@media screen and (max-width:1200px) {
    .container {
        width: 100%;
    }
}

@media screen and (max-width:1000px) {
    .logo {
        margin-left: 30px;
    }

    .service-col, .work-col {
        width: 33.33333333333333%;
    }

    .about {
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

    .contact {
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

    .contact-form a {
        text-align: center;
        position: absolute;
        /* left: 156px; */
        margin-left: 22%;
        right: auto;
    }
}

@media screen and (min-width:768px) {

    .menu {
        display: block !important;
    }
}

@media screen and (max-width:768px) {
    .service-col, .work-col {
        width: 90%;
        margin-bottom: 30px;
        text-align: justify;
        margin-left: 26px;
    }

    .menu, .menu li {
        float: none;
    }

    .logo {
        float: none;
        display: inline-block;
    }

        .logo img {
            width: auto;
        }

    .menu li a {
        text-align: center;
        padding: 12px;
    }

    .menu {
        /*border-bottom: 1px solid #2f937b;*/
        display: none;
    }

    .toggle {
        display: inline-block;
    }

    .about {
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

    .about-box {
        width: 30%;
        float: right;
        margin-left: 40px;
        text-align: justify;
    }

        .about-box p {
            color: #1d1c28;
        }

    .contact {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .contact-form a {
        text-align: center;
        position: absolute;
        /* left: 156px; */
        padding: 10px 3px 10px 3px;
        right: auto;
    }


    .footer-col {
        width: 100%;
        float: none;
    }

    .contact-form a {
        text-align: center;
        position: absolute;
        margin-left: 10%;
        left: 30%;
        right: 42%;
    }

    .footer-col .social-icon {
        float: none;
        margin-bottom: 12px;
        margin-left: -5px;
    }
}

@media screen and (max-width:570px) {
    .services {
        margin-bottom: -20%;
    }

    .work {
        padding: 30px 0;
    }

    .service-col {
        width: 95%;
        margin-left: 12px;
        margin-bottom: 76px;
    }

    .work-col {
        width: 95%;
        margin-left: 12px;
        margin-bottom: 20px;
    }

    .service-col .service-cap {
        float: left;
        width: 62%;
        margin-left: 30px;
        margin-top: -50px;
        text-align: justify;
    }

    .about {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    .contact {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .contact-cap {
        width: 72%;
        margin-left: 10%;
        line-height: 2;
    }
    /*.about-box {
        width: 30%;
        float: right;
        margin-left: 40px;
        text-align: justify;
    }*/
    .about-box {
        width: 76%;
        float: left;
        /* margin-left: 40px; */
        text-align: justify;
    }

        .about-box p {
            color: #1d1c28;
        }

    .contact-form a {
        text-align: center;
        position: absolute;
        /* left: 156px; */
        padding: 10px 3px 10px 3px;
        right: auto;
    }

    /*.footer-col {
        width: 50%;
    }*/
}