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

    html {
        overflow-x: hidden;
    }

    .experience .quality {
        right: 30px;
    }

    .contact .contact-info {
        padding: 20px 18px;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        left: 40%;
    }
}

@media screen and (max-width: 992px) {
    .experience .quality {
        right: 10px;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        left: 40%;
    }

    .contact .contact-form {
        margin-bottom: 20px;
    }

    .contact .contact-info .location,
    .contact .contact-info .quick-contact,
    .contact .contact-info .opening-hours {
        margin-bottom: 27px;
    }

    .blog .pagination-div {
        margin: 40px 0;
    }
}


@media screen and (max-width: 844px) {
    .experience {
        padding: 120px 0 0 0;
    }

    .process .content h5 {
        padding: 0;
    }

    h5 {
        font-size: 20px;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        left: 45%;
    }
}

@media screen and (max-width: 820px) {

    .navbar .container .navbar-nav .nav-item {
        margin: 0 0 10px 0;
    }

    .experience {
        padding: 120px 0 0 0;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        left: 50%;
    }

    .testimoni .content .card .card-body {
        padding: 0px;
    }

    .contact .contact-form {
        margin-bottom: 20px;
    }

    .contact .features .content {
        margin-bottom: 20px;
    }

    .footer .content {
        margin-bottom: 30px;
    }

    .footer .heading .subcribe {
        position: relative;
        left: -20px;
        margin-top: 30px;
    }


}

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

    .navbar .container .navbar-nav .nav-item {
        margin: 0 0 10px 0;
    }

    .experience {
        padding: 120px 0 0 0;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        left: 50%;
    }

    .testimoni .content .card .card-body {
        padding: 0px;
    }

    .contact .contact-form {
        margin-bottom: 20px;
    }

    .contact .features .content {
        margin-bottom: 20px;
    }

    .footer .content {
        margin-bottom: 30px;
    }

    .footer .heading .subcribe {
        position: relative;
        left: -20px;
        margin-top: 30px;
    }

    .share {
        margin-bottom: 30px;
    }
}

@media screen and (max-width: 576px) {

    html {
        overflow-x: hidden;
    }

    h1 {
        font-size: 50px;
    }

    .header .content .button {
        margin-top: 24px;
        margin-right: 10px;
    }

    .experience {
        padding: 0;
    }

    .experience .quality {
        position: relative;
        top: -40px;
        right: 0;
    }

    .experience .container>.row {
        flex-direction: column-reverse;
    }

    .about img {
        margin-bottom: 16px;
    }

    .project .gallery-carousel .owl-carousel .owl-nav {
        top: -46px;
        left: 0;
    }

    .contact .contact-form {
        margin-bottom: 20px;
    }

    .project .heading h2 {
        color: #191A19;
        margin: 0 0 50px 0;
    }

    .project .gallery-carousel {
        position: relative;
        padding-left: 0;
        left: 0;
    }

    .footer .heading .subcribe {
        position: relative;
        left: 0;
        margin-top: 30px;
    }

    .footer .heading .subcribe .input-group input {
        margin-left: 12px;
    }

    .footer .heading .subcribe .input-group span {
        padding: 10px 0 10px 0;
    }

    .footer .heading .subcribe .input-group input {
        padding: 0;
    }

}


@media screen and (max-width: 360px) {

    html {
        overflow-x: hidden;
    }

    h2 {
        font-size: 37px;
    }

    .blog .pagination-div .pagination .page-item {
        margin: 0 5px;
    }

    .blog .pagination-div .pagination .page-item .page-link {
        font-size: 14px;
        padding: 3px 10px;
    }


}