.upcoming-events-title,
.past-events h2 {
    margin: 2rem 0;
    font-size: 2.8rem;
    color: var(--primary);
    text-align: center;
}

.past-events {
    width: 96%;
    margin: 0 auto;
}

.past-events-count {
    margin-bottom: 1.2rem;
    font-size: 1.8rem;
    text-align: right;
}

.past-events h2 {
    margin: 4rem 0;
}

.current-position {
    color: var(--tertiary);
    font-size: 4.8rem;
    margin-left: 13px;
    min-width: 2.8rem;
    display: inline-block;
}

.carousel-container {
    position: relative;
    max-width: 1436px;
    margin: 0 auto;
}

.carousel-inner {
    width: 1200px;
    height: 627px;
    margin: 0 auto;
}

.carousel-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
    cursor: pointer;
}

.carousel-item.active {
    opacity: 1;
}

.carousel-item-inner {
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
}

.carousel-control-prev,
.carousel-control-next {
    width: 10%;
    opacity: 1;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    display: flex;
    position: relative;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    background-image: none;
}

.event-chevron::before {
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    border: 8px dotted var(--tertiary);
    border-width: 0 8px 8px 0;
}

.event-details {
    font-size: 1.7rem;
    display: flex;
    flex-direction: column;
    margin-bottom: 3rem;
    padding: 4rem 3.5rem;
    border: 2px solid #EAEAEA;
    border-radius: 12px;
}

.event-details-left,
.event-details-right {
    width: 100%;
}

.event-details-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 2rem;
}

.event-name {
    position: relative;
    top: 0;
    font-family: "triple-dot-digital";
    font-size: 1.3rem;
    color: var(--primary);
    margin-bottom: 1.75rem;
}

.event-title {
    font-size: 1.7rem;
    margin: 0 0 1.5rem;
    line-height: 1.33;
    color: #434343;
}

.event-speaker-date {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 1.5rem;
    text-align: left;
    font-family: "mulishregular";
    color: #434343;
    width: 100%;
}

.event-speaker-container,
.event-date,
.event-location {
    width: 100%;
}

.event-speaker-container {
    margin-bottom: 0.5rem;
    display: flex;
}

.event-speakers {
    margin-left: 0.6rem;
}

.event-date {
    margin-bottom: 0.5rem;
}

.event-date,
.event-location {
    margin-left: 3rem;
}

.event-speaker-container img {
    position: relative;
    align-self: center;
    width: 1.7rem;
    height: 1.7rem;
    margin-right: 4px;
}

.event-watch {
    width: 100%;
}

.event-watch .theme-btn {
    width: 120px;
    margin: 0 auto;
    height: 48px;
    padding: 0;
    font-family: "mulishsemibold";
    background: var(--secondary);
    text-align: center;
}

.event-watch .view-btn {
    color: var(--tertiary);
    font-family: "mulishbold";
}

.loading-events {
    color: var(--neutral);
    font-family: "mulishbold";
}

.loading-events .spinner-border {
    color: #d26f5d;
}

@media (max-width: 768px) {
    .past-events h2 {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .carousel-inner {
        width: 280px;
        height: 146px;
    }

    .event-details {
        padding: 2rem 1.5rem;
    }

    .event-details-right {
        margin-top: 1.5rem;
    }

    .event-title {
        margin-bottom: 1rem;
    }

    .event-speaker-date {
        font-size: 1.4rem;
    }

    .event-date,
    .event-location {
        margin-left: 0;
    }

    .event-watch .theme-btn {
        height: 40px;
        font-size: 1.8rem;
    }
}

@media (min-width: 769px) {
    .event-details {
        flex-direction: row;
        justify-content: space-between;
    }

    .event-details-left {
        flex-basis: 62%;
    }

    .event-details-right {
        flex-basis: 34%;
        flex-direction: row;
        align-items: center;
        margin-top: 0;
    }

    .event-speaker-date {
        flex-grow: 1;
        align-items: flex-start;
        margin-right: 2%;
        margin-bottom: 0;
    }

    .event-watch {
        width: 165px;
    }

    .event-watch .theme-btn {
        min-width: 120px;
    }

    .event-name {
        top: 12px;
    }

    .event-title {
        margin: 1.5rem 0 0;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .carousel-inner {
        width: 575px;
        height: 300px;
    }

    .event-details {
        padding: 1.5rem 1rem;
    }
}

@media (min-width: 1025px) and (max-width: 1600px) {
    .upcoming-events-title,
    .past-events h2 {
        font-size: 2.4rem;
    }
    .upcoming-events-title {
        margin: 1rem 0 2rem;
    }
    .past-events h2 {
        margin: 4.5rem 0 3;
    }
    .carousel-inner {
        width: 780px;
        height: 408px;
    }
    .current-position {
        font-size: 3.6rem;
        min-width: 2rem;
    }
    .past-events-count {
        font-size: 1.6rem;
    }
    .event-details {
        padding: 3rem 2rem;
        margin-bottom: 2.5rem;
    }
}


@media (min-width: 1601px),
screen and (min-device-width: 1601px) {
    .event-details {
        font-size: 2rem;
    }
    .event-speaker-container img {
        width: 2rem;
        height: 2rem;
    }
    .event-name {
        font-size: 1.6rem;
    }
    .event-title {
        font-size: 2.4rem;
    }
    .event-watch {
        width: 175px;
    }
}