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

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

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

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

@media only screen and (max-width:1366px) {
    #header .container-xl {
        max-width: 1280px;
    }
}

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

@media (max-device-width: 1280px) and (max-device-height: 1024px) {
}

@media (max-device-width: 1280px) and (max-device-height: 960px) {
}

@media (max-device-width: 1280px) and (max-device-height: 800px) {
}

@media (max-device-width: 1280px) and (max-device-height: 768px) {
}

/*********** IPAD landscape ***********/
@media (min-width: 1024px) and (max-width: 1199px) {
    .footer .social-links a {
        height: 33px;
    }
    .footer-logo img {
        width: 40%;
    }
    .header .btn-getstarted + .btn-getstarted {
        margin-left: 5px;
    }
}
/*********** IPAD landscape ***********/

/*********** Ipad portrait and small tablet landscape ***********/
@media (min-width: 767px) and (max-width: 991px) {
    .hero .img-fluid {
        max-width: 100%;
        height: 350px;
    }
    .hero h1, .hero p, .hero .hero-img {
        text-align: center;
    }
}
/*********** Ipad portrait and small tablet landscape ***********/

/*********** mobile landscape and small tablet portrait ***********/
@media (min-width: 440px) and (max-width: 767px) {
    .hero .img-fluid {
        max-width: 100%;
        height: 300px;
    }
    .hero h1, .hero p, .hero .hero-img {
        text-align: center;
    }
    .work-process .steps-item{
        height:auto;
    }
}
/*********** mobile landscape and small tablet portrait ***********/

/*********** mobile portrait ***********/
@media only screen and (min-width: 300px) and (max-width: 479px) {
    .hero .img-fluid {
        max-width: 100%;
        height: 300px;
    }
    .hero h1, .hero p, .hero .hero-img {
        text-align: center;
    }
    .header .btn-getstarted + .btn-getstarted {
        margin-left: 0;
    }
    .header .btn-getstarted, .header .btn-getstarted:focus {
        padding: 8px 20px;
    }
    .work-process .steps-content {
        padding: 30px 20px 0;
        text-align: center;
    }
}
/*********** mobile portrait ***********/