body {
    font-family: 'Montserrat', sans-serif;
  }

/* .service{
    margin: 10px;
} */

.left-menu .logo img {
    width: 180px;
}

.left-menu .socials svg {
    font-size: 25px;
    color: wheat;
    padding: 3px;
}

.socials-contact svg {
    font-size: 25px;
    color: wheat;
    padding: 3px;
}

.customers {
    overflow: auto;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    height: 80px;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    background-blend-mode: multiply;
}

.customers .customers-content {
    overflow: hidden;
    /* display: none; */
    padding-top: 20px;
    /* background-color: #213A41; */
    color: #ffffff;
    border-radius: 28px;
    overflow: auto;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    background-blend-mode: multiply;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.customers .customers-content .back-btn {
    color: wheat;
    border-color: wheat;
}

.customers .customers-content .about{
    height: 100%;
    max-height: 100%;
    overflow-y: hidden;
    margin-top: 30px;
}

.projects {
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.projects {
    overflow: auto;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    height: 80px;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
}

.projects .projects-content {
    overflow-y: hidden;
    overflow: hidden;
    /* display: none; */
    padding-top: 20px;
    /* background-color: #213A41; */
    color: #ffffff;
    border-radius: 28px;
    overflow: auto;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    background-blend-mode: multiply;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.projects .projects-content .back-btn {
    color: wheat;
    border-color: wheat;
}

.projects .projects-content .about{
    height: 100%;
    max-height: 100%;
    overflow-y: hidden;
    margin-top: 30px;
}

.contact {
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.contact {
    overflow: auto;
    scrollbar-width: none!important; /* Firefox */
    -ms-overflow-style: none!important; /* IE and Edge */
    height: 80px;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
}

.contact .contact-content {
    height: 100%;
    overflow: hidden;
    scrollbar-width: none!important; /* Firefox */
    -ms-overflow-style: none!important; /* IE and Edge */
    /* display: none; */
    padding-top: 20px;
    /* background-color: #213A41; */
    color: #ffffff;
    border-radius: 28px;
    overflow: auto;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    background-blend-mode: multiply;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.contact .contact-content .back-btn {
    color: wheat;
    border-color: wheat;
}

.contact .contact-content .about{
    height: 100%;
    max-height: 100%;
    overflow-y: hidden;
    margin-top: 30px;
    margin-bottom: 30px;
}






.service .img {
    /* this is needed or the background will be offset by a few pixels at the top */
    overflow: auto;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    height: 110px;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    background-blend-mode: multiply;
}

h1 {
    top: 20%;
}

/* .service .img h1 {
    top: 30%;
} */

.service .content {
    overflow: auto;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    /* display: none; */
    padding-top: 20px;
    /* background-color: #213A41; */
    color: #ffffff;
    border-radius: 28px;
    overflow: auto;
    border-radius: 28px;
    background-size: cover!important;
    background-position: center!important;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}


.enableBlur>* {
    filter: blur(1.2px);
  }

.disableBlur {
    filter: blur(0)!important;
}

.service .content .back-btn {
    color: wheat;
    border-color: wheat;
}

.service .content .about{
    height: 100%;
    max-height: 100%;
    overflow-y: hidden;
    margin-top: 10px;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

.hidden {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
}

/* .services {
    transition-duration: 0.5s, 0s;
    transition-delay: 0s, 0.5s;
} */








/* FULL SCREEN WITH ANIMATION */






/* SCROLL BAR */

::-webkit-scrollbar {
    width: 20px;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #d6dee1;
    border-radius: 20px;
    border: 6px solid transparent;
    background-clip: content-box;
}