/* Media Queries for responsive design */
@media (max-width: 575.98px) {
    .why-box-header .title {
        height: 35px;
    }

    .join-us {
        height: 840px;
    }

    .hero-content {
        padding-top: 40px;
    }

    .hero .font-size-18 * {
        font-size: calc((18px / 1.5) - 1px);
    }

    .important .intro-text-wrapper,
    .half-split .right-side,
    .container {
        padding-right: 30px !important;
        padding-left: 30px !important;
    }

    .about-us-content img {
        height: auto;
    }

    .hero-little .font-size-60 * {
        font-size: calc(60px / 1.6);
    }

    footer img.phone-icon {
        width: 24px;
        height: 24px;
    }

    .why-us .font-size-20 * {
        font-size: calc(20px / 1.25);
    }

    .services-products .card-body p,
    .hero p {
        margin-bottom: 0;
    }

    .hero {
        height: 70vh;
    }

    .services-list .items img,
    .about-us-content img,
    .services-list .image-wrapper,
    .about-us-content img {
        max-width: 100%;
    }

    .hero-little {
        height: 140px;
    }

    .services-list .btn.btn-filled-blue,
    .hero .btn.btn-transparent-white,
    .hero .btn.btn-filled-blue {
        padding-top: calc(16px / 1.8);
        padding-right: calc(39px / 1.8);
        padding-bottom: calc(16px / 1.8);
        padding-left: calc(39px / 1.8);
    }

    .hero .font-size-16 * {
        font-size: calc(16px / 1.5);
    }

    .hero .font-size-60 * {
        font-size: calc(60px / 2.5);
    }

    .important .intro-text-wrapper {
        max-width: 100%;
        padding-right: 12px;
        padding-left: 12px;
        padding-top: 0;
        padding-bottom: 3rem;
    }


    .half-split .right-side {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .half-split .right-side .content {
        padding-left: 0;
        max-width: 100%;
    }

    .places .card,
    .services-products .card {
        align-items: normal;
        max-width: 100%;
    }

    .why-box {
        padding: 1rem 0.5rem !important;
    }

    .important,
    .why-us {
        padding-bottom: 0 !important;
    }

    .services-list,
    .about-us,
    .places,
    .important,
    .why-us,
    .references,
    .half-split .right-side,
    .services-products {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }



    .font-size-60 * {
        font-size: calc(60px / 1.5);
    }

    .font-size-48 * {
        font-size: calc(48px / 1.5);
    }

    .font-size-40 * {
        font-size: calc(40px / 1.4);
    }

    .font-size-32 * {
        font-size: calc(32px / 1.3);
    }

    .font-size-24 * {
        font-size: calc(24px / 1.2);
    }

    .font-size-20 * {
        font-size: calc(20px / 1.2);
    }

    .font-size-18 * {
        font-size: calc((18px / 1.1) - 1px);
    }

    .font-size-16 * {
        font-size: calc(16px);
    }

    .font-size-15 * {
        font-size: calc(15px);
    }

    .font-size-14 * {
        font-size: calc(14px);
    }

    .font-size-13 * {
        font-size: calc(13px);
    }



    /*NAVBAR*/
    .navbar-custom {
        height: 70px;
    }

    .navbar-custom a.navbar-brand img {
        width: 70%;
        height: auto;
    }

    .navbar-top {
        display: none;
    }

    .navbar-bottom li.nav-item.mobileshow {
        display: block;
    }

    .navbar-toggler {
        right: 15px;
        top: 20px;
    }

    .navbar-collapse {
        display: flex;
        justify-content: flex-end;
    }

    .dark.navbar-nav {
        padding: 15px;
        background: #1E1E1E;
        position: absolute;
        top: 66px;
    }

    .white.navbar-nav {
        padding: 15px;
        background: #FFFFFF;
        position: absolute;
        top: 66px;
    }

    .navbar-nav .dropdown-menu {
        position: absolute !important;
    }
}

/* Extra small devices (phones, less than 576px) */
@media (min-width: 576px) and (max-width: 767.98px) {
    .why-box-header .title {
        height: 50px;
    }

    .about-us-content img {
        height: 450px;
    }

    .hero-little .font-size-60 * {
        font-size: calc(60px / 1.5);
    }

    footer img.phone-icon {
        width: 32px;
        height: 32px;
    }

    .why-us .font-size-20 * {
        font-size: calc(20px / 1.15);
    }

    .services-products .card-body p,
    .hero p {
        margin-bottom: 0;
    }

    .hero .font-size-60 * {
        font-size: calc(60px / 2.5);
    }

    .hero .font-size-18 * {
        font-size: calc((18px / 1.3));
    }

    .hero .font-size-16 * {
        font-size: calc(16px / 1.5);
    }

    .hero {
        height: 80vh;
    }

    .services-list .btn.btn-filled-blue,
    .hero .btn.btn-transparent-white,
    .hero .btn.btn-filled-blue {
        padding-top: calc(16px / 1.35);
        padding-right: calc(39px / 1.35);
        padding-bottom: calc(16px / 1.35);
        padding-left: calc(39px / 1.35);
    }

    .services-list .items img,
    .about-us-content img,
    .services-list .image-wrapper,
    .about-us-content img {
        max-width: 100%;
    }

    .hero-little {
        height: 150px;
    }

    .important .intro-text-wrapper {
        max-width: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }

    .half-split .right-side {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .half-split .right-side .content {
        padding-left: 0;
        max-width: 540px;
    }

    .places .card,
    .services-products .card {
        align-items: normal;
        max-width: 100%;
    }

    .why-box {
        padding: 1rem 0.5rem !important;
    }

    .why-us {
        padding-bottom: 0 !important;
    }

    .why-us {
        padding-bottom: 0 !important;
    }

    .services-list,
    .about-us,
    .places,
    .important,
    .why-us,
    .references,
    .half-split .right-side,
    .services-products {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }


    .font-size-60 * {
        font-size: calc(60px / 1.4);
    }

    .font-size-48 * {
        font-size: calc(48px / 1.45);
    }

    .font-size-40 * {
        font-size: calc(40px / 1.3);
    }

    .font-size-32 * {
        font-size: calc(32px / 1.2);
    }

    .font-size-24 * {
        font-size: calc(24px / 1.1);
    }

    .font-size-20 * {
        font-size: calc(20px / 1.1);
    }

    .font-size-18 * {
        font-size: calc((18px / 1.05) - 1px);
    }

    .font-size-16 * {
        font-size: calc(16px);
    }

    .font-size-15 * {
        font-size: calc(15px);
    }

    .font-size-14 * {
        font-size: calc(14px);
    }

    .font-size-13 * {
        font-size: calc(13px);
    }

    /*NAVBAR*/
    .navbar-custom {
        height: 70px;
    }

    .navbar-custom a.navbar-brand img {
        width: 70%;
        height: auto;
    }

    .navbar-top {
        display: none;
    }

    .navbar-bottom li.nav-item.mobileshow {
        display: block;
    }

    .navbar-toggler {
        right: 15px;
        top: 20px;
    }

    .navbar-collapse {
        display: flex;
        justify-content: flex-end;
    }

    .dark.navbar-nav {
        padding: 15px;
        background: #1E1E1E;
        position: absolute;
        top: 66px;
    }

    .white.navbar-nav {
        padding: 15px;
        background: #FFFFFF;
        position: absolute;
        top: 66px;
    }

    .navbar-nav .dropdown-menu {
        position: absolute !important;
    }
}

/* Medium devices (tablets, less than 992px) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .why-box-header .title {
        height: 40px;
    }

    .about-us-content img {
        height: 550px;
    }

    .hero-little .font-size-60 * {
        font-size: calc(60px / 1.35);
    }

    footer img.phone-icon {
        width: 38px;
        height: 38px;
    }

    .why-us .font-size-20 * {
        font-size: calc(20px / 1.1);
    }

    .services-products .card-body p,
    .hero p {
        margin-bottom: 0;
    }

    .hero .font-size-60 * {
        font-size: calc(60px / 1.35);
    }

    .hero {
        height: 90vh;
    }


    .services-list .btn.btn-filled-blue,
    .hero .btn.btn-transparent-white,
    .hero .btn.btn-filled-blue {
        padding-top: calc(16px / 1.2);
        padding-right: calc(39px / 1.2);
        padding-bottom: calc(16px / 1.2);
        padding-left: calc(39px / 1.2);
    }

    .hero-little {
        height: 170px;
    }

    .services-list .items img,
    .about-us-content img,
    .services-list .image-wrapper,
    .about-us-content img {
        max-width: 100%;
    }

    .important .intro-text-wrapper {
        max-width: 100%;
        padding-top: 0;
        padding-bottom: 0;
    }

    .join-us {
        height: 680px;
    }

    .half-split .right-side {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .half-split .right-side .content {
        padding-left: 0;
        max-width: 720px;
    }

    .places .card,
    .services-products .card {
        align-items: normal;
        max-width: 100%;
    }

    .why-box {
        padding: 1rem 0.5rem !important;
    }

    .why-us {
        padding-bottom: 0 !important;
    }

    .services-list,
    .about-us,
    .places,
    .important,
    .why-us,
    .references,
    .half-split .right-side,
    .services-products {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .font-size-60 * {
        font-size: calc(60px / 1.25);
    }

    .font-size-48 * {
        font-size: calc(48px / 1.15);
    }

    .font-size-40 * {
        font-size: calc(40px / 1.2);
    }

    .font-size-32 * {
        font-size: calc(32px / 1.15);
    }

    .font-size-24 * {
        font-size: calc(24px / 1.1);
    }

    .font-size-20 * {
        font-size: calc(20px / 1.05);
    }

    .font-size-18 * {
        font-size: calc((18px / 1.05) - 1px);
    }

    .font-size-16 * {
        font-size: calc(16px);
    }

    .font-size-15 * {
        font-size: calc(15px);
    }

    .font-size-14 * {
        font-size: calc(14px);
    }

    .font-size-13 * {
        font-size: calc(13px);
    }

    /*NAVBAR*/
    .navbar-custom {
        height: 70px;
    }

    .navbar-custom a.navbar-brand img {
        width: 70%;
        height: auto;
    }

    .navbar-top {
        display: none;
    }

    .navbar-bottom li.nav-item.mobileshow {
        display: block;
    }

    .navbar-toggler {
        right: 15px;
        top: 20px;
    }

    .navbar-collapse {
        display: flex;
        justify-content: flex-end;
    }

    .dark.navbar-nav {
        padding: 15px;
        background: #1E1E1E;
        position: absolute;
        top: 66px;
    }

    .white.navbar-nav {
        padding: 15px;
        background: #FFFFFF;
        position: absolute;
        top: 66px;
    }

    .navbar-nav .dropdown-menu {
        position: absolute !important;
    }
}

/* Large devices (desktops, less than 1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .hero .font-size-60 * {
        font-size: calc(60px / 1.4);
    }

    .why-box-header .title {
        height: 60px;
    }

    footer .city-list.col-lg-2 {
        width: 21.666667%;
    }

    footer img.phone-icon {
        width: 38px;
        height: 38px;
    }

    .references,
    .services-list,
    .about-us {
        padding-top: 4rem;
    }

    .services-list .items img,
    .about-us-content img,
    .services-list .image-wrapper,
    .about-us-content img {
        max-width: 100%;
    }

    .places .card,
    .services-products .card {
        align-items: normal;
        max-width: 100%;
    }

    .why-box {
        padding: 1rem 0.5rem !important;
    }

    .font-size-60 * {
        font-size: calc(60px / 1.1);
    }

    .font-size-48 * {
        font-size: calc(40px / 1.1);
    }

    .font-size-40 * {
        font-size: calc(40px / 1.05);
    }

    .font-size-32 * {
        font-size: calc(32px / 1.05);
    }

    .font-size-24 * {
        font-size: calc(24px);
    }

    .font-size-20 * {
        font-size: calc(20px);
    }

    .font-size-18 * {
        font-size: calc(18px - 1px);
    }

    .font-size-16 * {
        font-size: calc(16px);
    }

    .font-size-15 * {
        font-size: calc(15px);
    }

    .font-size-14 * {
        font-size: calc(14px);
    }

    .font-size-13 * {
        font-size: calc(13px);
    }

    /*NAVBAR*/
    .navbar-custom {
        height: 70px;
    }

    .navbar-custom a.navbar-brand img {
        width: 70%;
        height: auto;
    }

    .navbar-top {
        display: none;
    }

    .navbar-bottom li.nav-item.mobileshow {
        display: block;
    }

    .navbar-toggler {
        right: 15px;
        top: 20px;
    }

    .navbar-collapse {
        display: flex;
        justify-content: flex-end;
    }

    .dark.navbar-nav {
        padding: 15px;
        background: #1E1E1E;
        position: absolute;
        top: 66px;
    }

    .white.navbar-nav {
        padding: 15px;
        background: #FFFFFF;
        position: absolute;
        top: 66px;
    }

    .navbar-nav .dropdown-menu {
        position: absolute !important;
    }
}


@media (max-width: 992px) {
    .service-card {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width: 1200px) and (max-width: 1400px) {
    .hero .font-size-60 * {
        font-size: calc(60px / 1.3);
    }

    footer .city-list.col-lg-2 {
        width: 21.666667%;
    }

    .why-box-header .title {
        height: 50px;
    }
}