@media (max-width: 575.98px) {
    .logo {
        height: 48px !important;
    }

    .logo-footer {
        height: 64px !important;
    }

    .welcome-container {
        height: calc(100vh - 80px) !important;
        color: white;
    }

    #welcome-top {
        margin-top: 80px !important;
    }

    .under-header {
        top: 80px !important;
        z-index: -2;
    }

    .skewed-div {
        position: relative;
        height: calc(100vh - 80px);
        background-repeat: no-repeat;
        background-position: center;
    }

    .skewed-div::before {
        content: "";
        position: absolute;
        left: 0 !important; /* Adjust as needed */
        width: 100% !important;
        height: 100%;
        background-color: rgba(26, 26, 26, 0.5);
        transform: skewX(0deg) !important; /* Adjust the angle of the skew */
    }

    .card-content {
        justify-content: flex-start !important;
    }

    .border-counter {
        border-left: 5px solid var(--bs-primary);
        padding-left: 12px;
    }

    .btn-works-welcome {
        width: 135px !important;
    }

    .img-about-us-founders-alex {
        background: url("../images/alex.png") no-repeat center;
        width: 300px !important;
        height: 330px;
        background-size: cover;
    }

    .img-about-us-founders-roli {
        background: url("../images/roli.png") no-repeat center;
        width: 300px !important;
        height: 330px;
        background-size: cover;
    }

    #team-img {
        background: url("../images/team-image.png") no-repeat center;
        background-size: cover;
        height: 320px;
        width: 100%;
    }

    .inside-card-width {
        width: 150px !important;
    }

    .inside-card-width-welcome {
        width: 150px !important;
    }

    #category-description {
        height: auto !important;
    }
}

@media (max-width: 768px) {

    .border-counter {
        border-left: 4px solid var(--bs-primary);
        padding-left: 10px;
    }

    .contact-info {
        border-radius: 0 0 0 150px;
        width: 75%;
        font-size: 12px;
        color: white;
        font-weight: 300;
        background-color: var(--bs-primary) !important;
    }

    .fa-5x {
        font-size: 3em !important;
    }

    .works-card::before {
        top: 8px;
        right: 8px;
        width: 0;
        height: 2px; /* Initial height of the line */
    }

    .works-card::after {
        top: 8px;
        right: 8px;
        width: 2px; /* Initial width of the line */
        height: 0;
    }

    .works-card:hover::before {
        width: 20px; /* Grow the line to cover the width of the element */
        height: 1px; /* Grow the line to cover the height of the element */
    }

    .works-card:hover::after {
        width: 1px; /* Grow the line to cover the width of the element */
        height: 20px; /* Grow the line to cover the height of the element */
    }


    .carousel-image {
        width: 100% !important;
        height: 400px !important;
    }
}

@media (min-width: 768px) and (max-width: 1300px) {
    .fa-5x {
        font-size: 4em !important;
    }

    .border-counter {
        border-left: 8px solid var(--bs-primary);
        padding-left: 14px;
    }

    .welcome-container {
        height: calc(100vh - 86px) !important;
        color: white;
    }

    #welcome-top {
        margin-top: 86px !important;
    }

    .under-header {
        top: 86px !important;
        z-index: -2;
    }

    .skewed-div {
        position: relative;
        height: calc(100vh - 86px);
        background-repeat: no-repeat;
        background-position: center;
    }

    .skewed-div::before {
        content: "";
        position: absolute;
        left: 0 !important; /* Adjust as needed */
        width: 100% !important;
        height: 100%;
        background-color: rgba(26, 26, 26, 0.2);
        transform: skewX(0deg) !important; /* Adjust the angle of the skew */
    }

    .inside-card-width {
        width: 250px !important;
    }

    #category-description {
        height: auto !important;
    }
}