/* 2023-11 Leonardo Molina */


@media (max-width: 1699.98px) {
    /* .service-box {
        width: 70%;
    } */

    .team-member {
        width: auto;
    }

    .service-box-name {
        font-size: 24px;
    }

    .our-job-content-header span {
        font-size: 1.6vw;
    }

    .our-job-content p {
        font-size: 12px;
    }

    .team-member-name {
        font-size: 22px;
    }

    .team-member:hover .team-member-name {
        transform: translateX(35px);
    }

    .team-member-intro {
        font-size: 16px;
        width: 80%;
        top: 250px;
    }
}

@media (max-width: 1399.98px) {
    .team-member {
        width: fit-content;
    }

    .service-box-name {
        font-size: 20px;
    }

    .service-box-description {
        font-size: 12px;
        top: 30%;
    }
}

@media (max-width: 1199.98px) {
    .service-box-name {
        font-size: 16px;
        padding-left: 14px;
    }

    .service-box-description {
        padding: 0 14px;
        left: calc(10vw + 14px);
    }

    .service-box-icon {
        width: 10vw;
    }

    .our-job-content-header span {
        font-size: 1.8vw;
    }

    .service-box {
        height: 15vw;
    }

    .home {
        gap: 60px;
    }

    .team-member {
        width: auto;
    }

    .projects-quantity {
        font-size: 7vw;
        display: block;
        width: 100%;
    }

    .projects-developed-label {
        font-size: 4vw;
    }

    .experience-time-label {
        font-size: 3vw;
    }

    .home-left-block {
        text-align: center;
        align-items: center;
    }

    .separator {
        width: 65%;
        margin: auto;
    }

    .navbar-star-r-1 {
        right: 0%;
    }

    .navbar-star-r-2 {
        right: 7%;
    }

    .navbar-star-r-3 {
        right: 14%;
    }

    .navbar-star-r-4 {
        right: 21%;
    }
}

@media (max-width: 991.98px) {
    .navbar-star-r-1 {
        right: 18%;
    }

    .navbar-star-r-2 {
        right: 26%;
    }

    .navbar-star-r-3 {
        right: 34%;
    }

    .navbar-star-r-4 {
        right: 42%;
    }

    .service-box-name {
        font-size: 20px;
        padding-left: 14px;
    }

    .our-job-content-header span {
        font-size: 2.5vw;
    }

    #our_team {
        background: rgba(93, 81, 243, 0.10);
        border-bottom: 1px rgba(245, 245, 245, 0.20) solid;
        background-clip: content-box;
    }

    .our-job-container {
        display: flex;
        flex-direction: column-reverse;
    }

    .clients-title {
        font-size: 40px;
        line-height: inherit;
    }

    .contact-us {
        font-size: xx-large;
    }

    /* .service-box {
        width: 80%;
    } */

    .projects-quantity {
        font-size: 8vw;
    }

    .projects-developed-label {
        font-size: 5vw;
    }

    .experience-time-label {
        font-size: 4vw;
    }

    .service-box-description {
        transform: scale(1);
    }

    .service-box:hover {
        transform: translateX(0%);
    }

    .service-box {
        width: 50vw;
        height: 22vw;
        padding: 16px;
    }

    .service-box-icon {
        width: 17.37vw;
        height: 100%;
    }

    .service-box-description {
        left: calc(17.37vw + 16px);
        padding: 0 14px;
        font-size: 1rem;
    }

    .team-member-name-sm {
        font-size: 2rem;
    }

    .team-member-intro-sm {

        font-size: 1rem;
        line-height: 2rem;
        font-weight: 400;
    }

    .flying-bot {
        margin-top: 5vw;
        margin-bottom: 4vw;
    }

    .linkedin-rounded-sm {
        position: absolute;
        top: 17px;
        right: 30px;
        width: 41px;
        height: 41px;
        border-radius: 30px;
    }
}


@media (max-width: 767.98px) {
    .service-box-name {
        font-size: 16px;
    }

    .team-member-img-rounded {
        width: 200px;
        height: 200px;
    }


    .floating-button {
        background-size: contain;
        width: 80px;
        bottom: 0px;
    }

    .floating-button:hover {
        background-size: contain;
        /* width: 180px; */
    }

    .carousel-item {
        transition: transform 1s;
    }

    .projects-quantity {
        font-size: 8vw;
    }

    .projects-developed-label {
        font-size: 5vw;
        line-height: 40px;
    }

    .experience-time-label {
        font-size: 4vw;
    }

    .service-box-icon {
        min-height: min-content;
        min-width: min-content;
    }

    /* .service-box-icon img {
        height: 70%;
    } */

    .our-job-content-header span {
        font-size: 30px;
    }

    .our-job-content p {
        font-size: 16px;
    }

    .our-job-content {
        border-top: 1px rgba(245, 245, 245, 0.20) solid;
        border-bottom: 1px rgba(245, 245, 245, 0.20) solid;
    }

    .our-job-content-bg {
        background: #3F0829;
    }

    .home-bg-wrapper::before {
        background-image: url('../assets/home_bg_sm.svg');
        background-size: cover;
    }

    .general-bg-wrapper::before {
        background-image: none;
    }

    #our_job {
        /* background: linear-gradient(0deg, rgba(14, 60, 118, 0.2), rgba(14, 60, 118, 0.2)),
        linear-gradient(0deg, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.2)); */
        background: rgba(14, 60, 118, 0.20);
        background-clip: content-box;
    }

    .service-box {
        width: 60vw;
        height: 26.4vw;
        padding: 16px;
    }

    .service-box-icon {
        width: 20.84vw;
        height: 100%;
    }

    .service-box-description {
        left: calc(20.84vw + 16px);
        padding: 0 14px;
        font-size: 0.85rem;
    }

    .flying-bot {
        margin-top: 19.05vw;
        margin-bottom: 7.58vw;
        width: 63.89vw;
        height: auto;
    }

    .carousel-inner .carousel-item.active,
    .carousel-inner .carousel-item-next,
    .carousel-inner .carousel-item-prev {
        justify-content: center;
        align-items: center;
    }

    .flying-bot-bg-sm {
        background-image: url('../assets/background_lines_sm.svg');
    }

    .linkedin-rounded-sm {
        width: 31px;
        height: 31px;
        border-radius: 20px;
    }
}

@media (max-width: 575.98px) {

    .our-job-content-header span {
        font-size: 33px;
    }

    .team-member-name-sm {
        color: white;
        font-size: 16px;
        font-weight: bold;
    }

    .team-member-intro-sm {
        color: white;
        font-size: 11px;
        line-height: 13px;
        font-family: Inter;
        font-weight: 600;
        letter-spacing: 0.01em;
        text-align: left;
    }

    .home-right-block {
        gap: 2.33vw;

    }

    .our-team-title {
        font-size: 29px;
        line-height: normal;
        width: 95%;
    }

    .our-team-label {
        font-size: 14px;
        font-weight: 500;
        width: 95%;
    }

    .our-team-box {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .out-team-box {
        text-align: center;
    }

    .our-job-title-sm {
        font-size: 8.06vw;
        margin: 16.67vw 0 0 0;
    }

    .our-job-content-header {
        gap: 15px;
    }

    .our-job-content {
        gap: 10px;
    }

    .our-job-content p {
        width: 70%;
    }

    .contact-us-container {
        justify-content: center;
    }

    .contact-us {
        font-size: x-large;
        justify-content: center;
    }

    .contact-address {
        justify-content: center;
        text-align: center;
        flex-direction: column-reverse;
    }

    .copyright-text {
        margin: auto;
        font-size: 12px;
    }

    .copyright-box {
        display: flex;
        align-items: center;
    }

    .footer-logo {
        display: flex;
        align-items: center;
    }

    .footer-logo img {
        width: 50px;
    }

    .brand-name {
        font-size: 18px;
    }

    .our-job .our-job-title {
        line-height: normal;
        font-size: 8vw;
    }

    .projects-quantity {
        font-size: 16.47vw;
        line-height: 20.08vw;
    }

    .separator {
        margin: 3.8vw auto;
    }

    .service-box-name {
        font-size: 4.44vw;
        padding-left: 14px;
    }

    .service-box {
        width: 83.33vw;
        height: 36.67vw;
        display: flex;
        align-items: center;
        padding: 16px;
    }

    .service-box-icon {
        /* min-width: 100px; */
        /* min-height: 100px; */
        width: 28vw;
        height: 100%;
    }

    .service-box-icon img {
        width: 57.70%;
    }

    .service-box-description {
        font-size: 3.06vw;
        left: calc(28vw + 16px);
        padding: 0 14px;
    }

    .service-box:hover {
        transform: translateX(0%);
    }

    /* .service-box:hover .service-box-name {
        top: -40%;
    } */

    /* .service-box .service-box-name {
        top: -40%;
    } */

    /* .service-box .service-box-description {
        opacity: 1;
    } */

    /* .service-box-icon img {
        width: 80%;
    } */

    .projects-developed-label {
        font-size: 35px;
        max-width: 100vw;
    }

    .experience-time-label {
        font-size: 40px;
        line-break: normal;
        max-width: 100vw;
    }

    .home {
        gap: 48.48px;
    }

    .card-service {
        width: 58.61vw;
        height: calc(100vw * 0.5861 * 0.449);
        border-radius: 19.91px;
    }

    .card-service::before {
        border-radius: 19.91px;
    }

    .card-service .service-img {
        width: 30.65%;
        height: auto;
        left: calc(50% - 30.65%/2 + 11.32%/2);
        top: 4.62%;
        padding: 0;
    }

    .card-service .service-img img {
        position: relative;
        height: 100%;
        width: 100%;
        /* left: 35%; */
    }

    .card-sidebar {
        width: 11.32%;
        border-radius: 19.91px 0 0 19.91px;
    }

    .card-border {
        border-radius: 19.91px;
    }

    .card-service .service-name {
        /* width: 100%; */
        font-size: 16.55px;
        line-height: 21.12px;
        bottom: 10%;
        padding-left: 11.32%;
    }

    .card-service:hover .service-name {
        bottom: calc((50% - 15px/2));
    }

    .team-member-img-rounded {
        width: 100%;
        height: 100%;
    }

    .projects-developed-label {
        font-size: 7.73vw;
        line-height: 8.74vw;
    }

    .experience-time-label {
        font-size: 5.04vw;
    }

    .card-container:hover .service-name {
        bottom: calc((50% - 20px/2));
    }

    .clients-title {
        font-size: 5vw;
    }

    .linkedin-rounded-sm {
        width: 21px;
        height: 21px;
        border-radius: 10px;
    }
}