.overview-container {
    padding: 24px;
}

.overview-container-dark {
    background-color: #00000033;
}

.overview-title {
    font-size: 24pt;
    line-height: 24pt;
    text-shadow: 2px 2px 20px #00000033;
    font-weight: bold;
    width: 100%;
}

.cover-text .overview-title {
    text-shadow: 2px 2px 20px #000000;
}

.cover-container {
    position: relative;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: right calc(-120px);
    background-color: #0a0c5a;
}

.cover-video {
    text-align: right;
}

.cover-video img {
    border-radius: 10px;
    width: 100%;
}

.cover-text-lead-container {
    text-shadow: 2px 2px 10px #000000, 2px 2px 10px #000000;
}

.cover-text {
    padding-bottom: 24px;
    color: #FFFFFF;
}

.explanation-container {
    position: relative;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: right calc(-120px);
    background-color: #0a0c5a;
    color: #FFFFFF
}

/* Features */

.features-item {
    overflow: hidden; /* Ensures that anything outside this container is not shown */
    border-radius: 10px;
    position: relative;
}

.features-item img {
    width: 100%;
    transition: transform 0.5s ease; /* Smooth transition for scaling effect */
    position: relative;
    z-index: 1;
    transform: scale(1.1);
}

.features-item-title {
    position: absolute;
    z-index: 2;
    bottom: 0;
    font-weight: bold;
    font-size: 18pt;
    padding-left: 16px;
    transition: transform 0.5s ease; /* Smooth transition for scaling effect */
}

.features-item small {
    position: absolute;
    z-index: 3;
    bottom: 20px;
    right: 16px;
    text-shadow: 2px 2px 5px #000000;
    color: #BBBBBB;
}

.features-item:hover img {
    transform: scale(1.2); /* Adjust scaling factor as needed */
}

.features-item:hover .features-item-title {
    transform: translateY(-25%); /* Adjust translation factor as needed */
}

.team-item {
    overflow: hidden; /* Ensures that anything outside this container is not shown */
    border-radius: 128px;
    width: 256px;
    position: relative;
    background-color: #FF0000;
    margin-left: auto;
    margin-right: auto;
}

.team-item img {
    width: 256px;
    transition: transform 0.5s ease; /* Smooth transition for scaling effect */
    position: relative;
    z-index: 1;
    transform: scale(1.1);
}

.team-item-title {
    position: absolute;
    z-index: 2;
    bottom: 0;
    font-weight: bold;
    font-size: 18pt;
    padding-left: 16px;
    transition: transform 0.5s ease; /* Smooth transition for scaling effect */
}

.team-item small {
    position: absolute;
    z-index: 3;
    bottom: 20px;
    right: 16px;
    text-shadow: 2px 2px 5px #000000;
    color: #BBBBBB;
}

.team-item:hover img {
    transform: scale(1.2); /* Adjust scaling factor as needed */
}

.team-item:hover .team-item-title {
    transform: translateY(-25%); /* Adjust translation factor as needed */
}

/* Apply this when there is no aside*/
@media (min-width: 576px) {}

@media (min-width: 768px) {
    .overview-container {
        padding: 48px;
    }
}

@media (min-width: 992px) {
    .overview-container {
        padding: 96px;
    }
}

@media (min-width: 1200px) {
    .cover-container {
        position: relative;
    }

    .cover-text {
        position: absolute;
        z-index: 2;
        padding-top: 0px;
    }

    .cover-video {
        position: relative;
        z-index: 1;
    }

    .overview-title {
        font-size: 36pt;
        line-height: 36pt;
    }

    .cover-text-lead-container {
        width: 800px;
    }
}

@media (min-width: 1200px) {
    .cover-video {
        height: 500px;
    }
    .cover-video img {
        width: 600px;
    }
}

@media (min-width: 1900px) {
    .cover-video img {
        width: 900px;
    }
}