html, body {
    overflow-x: hidden;
}

.home-page-banner {
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    transition: left 600ms;
}


.home-page-banner-container {
    height: 300px;
    position: relative;
}


.home-page-banner-overlay {
    background: #44444460;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transition: left 750ms;
}

.home-page-banner-forward {
    position: absolute;
    right: 10px;
    top: 6rem;
    z-index: 3;
    background: transparent;
    display: none;
}

.home-page-banner-backward {
    position: absolute;
    left: 10px;
    top: 6rem;
    z-index: 3;
    background: transparent;
    display: none;
}

.home-page-banner-forward:hover, .home-page-banner-backward:hover {
    background: #8f8f8f30;
}


.home-page-banner-content-wrapper {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 2;
}

.home-page-banner-tracking-bar-wrapper {
    position: absolute;
    top: 93%; left: 0;
    width: 100%;
    z-index: 2;
}

.home-page-action {
    transition: transform 200ms;
}

.home-page-action:hover {
    transform: scale(1.1);
}

.home-page-hidden-action {
    display: none;
}

.home-page-partner {
    transition: left, 500ms;
    filter: grayscale(100%);
}
.home-page-partner:hover {
    filter: none;
}

.home-page-event-info {
    height: 4rem;
    transition: height 200ms;
}

.home-page-event-info:hover {
    height: 12rem;
    background: #33333366;
}
.home-page-event-info:hover .home-page-event-info-text {
    display: block;
}


@media (max-width: 768px) {
    .home-page-3-slide {
        width: 300%;
    }
}

@media (max-width: 1024px) {
    .home-page-event-info {
        height: 15rem;
        background: #33333366;
    }
    .home-page-event-info-text {
        display: block;
    }
}


@media(min-width: 768px) {
    .home-page-banner-forward { right: 20px; }
    .home-page-banner-backward { left: 20px; }
}

@media(min-width: 1024px) {
    .home-page-banner-container {
        height: 400px;
    }
    .home-page-banner-forward, .home-page-banner-backward {
        top: 11rem;
    }
    .home-page-banner-forward { right: 20px; display: block; }
    .home-page-banner-backward { left: 20px; display: block; }
    .home-page-partner {
    }
}

@media(min-width: 1280px) {
    .home-page-banner-container {
        height: 500px;
    }
    .home-page-banner-forward, .home-page-banner-backward {
        top: 11rem;
    }
    .home-page-banner-forward { right: 10px; display: block; }
    .home-page-banner-backward { left: 10px; display: block; }
    .home-page-partner {
    }
}

@media(min-width: 1400px) {
    .home-page-banner-forward { right: 40px; display: block; }
    .home-page-banner-backward { left: 40px; display: block; }
}
