.second-section {
    position: relative;
    color: white;
    font-family: 'Mabook', sans-serif;
}

.second-section .second-section-text-scroll marquee {
    transform: rotate(3.2deg);
    margin: -60px -20px 0 -6px;
    white-space: nowrap;
    font-size: 60px;
    background-color: black;
    border-top: 5px solid #ff1a88;
    border-bottom: 5px solid #ffea41;
}

.second-section span {
    padding-left: 400px;
}

.second-section .second-section-image-1 {
    position: absolute;
}

.second-section .second-section-image-1 img {
    margin: -196px 0 0 40px;
    width: 340px;
    transform: rotate(-3deg);
}

.second-section .second-section-image-2 {
    display: none;
}

.second-section .second-section-background-image {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    background-image: url("../images/below-the-marquee-image.png");
    background-position: -2px 0;
    background-repeat: no-repeat;
    background-size: cover;
    height: 1154px;
    margin-top: -32px;
}

.second-section .second-section-background-image .second-section-text-container {
    display: flex;
    justify-content: space-between;
    max-width: 1140px;
    margin: -570px auto 0;
    padding: 0 60px;
    line-height: 30px;
}

.second-section .second-section-background-image .second-section-text-container .second-section-text-container-text {
    padding: 40px 0;
    margin: 10px 20px 0;
}

.second-section .second-section-background-image .second-section-text-container .text-2 {
    padding-right: 380px;
}

.second-section .roadmap-container {
    position: absolute;
    bottom: calc(100% - 27rem);
    width: 20rem;
    right: 6rem;
    z-index: 1;
}

.second-section .roadmap-container .roadmap {
    width: 315px;
    transition: transform 0.2s;
}

.second-section .roadmap-container .roadmap:hover {
    transform: scale(1.5);
}

.second-section .roadmap-container .roadmap:active {
    transform: scale(0.5);
}

.second-section .check-out-my-trailer-video {
    position: absolute;
    bottom: 8rem !important;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
}

.second-section .check-out-my-trailer-video video {
    border-radius: 10px;
    width: 396px;
}

.second-section .check-out-my-trailer-image img {
    position: absolute;
    width: 14.285rem;
    bottom: calc(50% - 11rem);
    z-index: 3;
    left: calc(50% - 31rem);
}

.second-section .second-section-text-scroll-2 {
    display: flex;
    margin-top: -20px;
}

.second-section .second-section-text-scroll-2 marquee {
    transform: rotate(-6deg);
    margin: -60px -20px 0 -6px;
    white-space: nowrap;
    font-size: 60px;
    background-color: black;
    border-top: 5px solid #21ffff;
    border-bottom: 5px solid #dbff08;
}

.roadmap-onclick-image .pc-tablet-image {
    display: none;
}

.roadmap-onclick-image .pc-tablet-image .pc-tablet-image-close-button {
    inset: 0;
}

.roadmap-onclick-image .pc-tablet-image .pc-tablet-image-close-button img {
    cursor: pointer;
    width: 32px;
    margin: 0;
    position: fixed;
    top: calc(100% - 37rem);
    left: 96%;
}

.roadmap-onclick-image .pc-tablet-image img {
    position: fixed;
    max-height: 100vh;
    width: 100%;
    inset: 0;
    display: flex;
    background-color: rgba(255, 255, 255, 0.75);
    align-items: center;
    z-index: 100;
    border-radius: 20px;
    margin: auto;
}

.roadmap-onclick-image .pc-tablet-image.active {
    display: block;
}

.roadmap-onclick-image .mobile-image {
    display: none;
}

/* Responsive */
@media (max-width:1070px) {
    .second-section .second-section-background-image .second-section-text-container {
        display: flex;
        flex-direction: column;
    }

    .second-section .second-section-background-image .text-1,
    .second-section .second-section-background-image .text-2 {
        display: flex !important;
        flex-direction: column !important;
        padding: 0 336px 0 0 !important;
        font-size: 14px !important;
    }
}

@media (max-width:990px) {
    .second-section .check-out-my-trailer-video {
        position: absolute;
        bottom: 15rem !important;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
    }

    .second-section .check-out-my-trailer-video video {
        border-radius: 10px;
        width: 280px;
    }

    .second-section .check-out-my-trailer-image img {
        position: absolute;
        width: 12rem;
        bottom: calc(50% - -3rem);
        left: calc(50% - 5.5rem);
        transform: rotate(104deg);
    }
}

@media (min-width: 801px) and (max-width:990px) {
    .second-section .check-out-my-trailer-image img {
        position: absolute;
        width: 12rem;
        bottom: calc(50% - 0rem);
        left: calc(50% - 5.5rem);
        transform: rotate(104deg);
    }

    .second-section .check-out-my-trailer-video {
        position: absolute;
        bottom: 10rem !important;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
    }
}

@media (max-width:840px) {
    .second-section .second-section-background-image .second-section-text-container .second-section-text-container-text {
        margin: 0;
    }
    .second-section-background-image .second-section-text-container-text {
        font-size: 14px !important;
    }
}

@media (max-width:800px) {
    .second-section .second-section-image-1 {
        display: none;
    }

    .second-section .second-section-image-2 {
        display: block;
    }

    .second-section .second-section-image-2 {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin-top: -584px;
    }

    .second-section .second-section-image-2 img {
        width: 200px;
    }

    .second-section .second-section-text-scroll marquee {
        font-family: 'Mabook', sans-serif;
        transform: rotate(3.2deg);
        margin: -60px -20px 0 -6px;
        white-space: nowrap;
        font-size: 24px;
        background-color: black;
        border-top: 5px solid #ff1a88;
        border-bottom: 5px solid #ffea41;
    }

    .second-section .second-section-text-scroll-2 {
        display: flex;
        margin-top: 0 !important;
    }

    .second-section .second-section-text-scroll-2 marquee {
        font-family: 'Mabook', sans-serif;
        transform: rotate(-5.5deg);
        margin: -60px -20px 22px -80px;
        white-space: nowrap;
        font-size: 24px;
        background-color: black;
        border-top: 5px solid #21ffff;
        border-bottom: 5px solid #dbff08;
    }

    .second-section .roadmap-container {
        position: absolute;
        bottom: calc(100% - 66.5rem) !important;
        left: calc(100% - 12rem) !important;
        width: 0 !important;
        right: 0 !important;
    }

    .second-section .roadmap-container .roadmap {
        width: 200px;
    }

    .second-section .second-section-background-image .second-section-text-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        max-width: 1140px;
        margin: -750px auto 0;
        padding: 0 10px;
        line-height: 30px;
    }

    @media (max-width: 570px) {
        .second-section .roadmap-container {
            position: absolute;
            bottom: calc(100% - 66.5rem) !important;
            left: calc(100% - 12rem) !important;
            width: 0 !important;
            right: 0 !important;
        }

        .second-section .roadmap-container .roadmap {
            width: 175px;
        }
    }

    .second-section .second-section-background-image .second-section-text-container .second-section-text-container-text {
        padding: 0 !important;
    }

    .second-section .second-section-background-image .second-section-text-container .text-1 {
        margin-bottom: 20px;
    }

    .second-section .second-section-background-image .second-section-text-container .text-2 {
        margin-top: 20px;
        padding-right: 0;
    }

    .second-section .check-out-my-trailer-video {
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center;
    }
}

@media (max-width:768px) {
    .roadmap-onclick-image .pc-tablet-image img {
        display: none !important;
    }

    .roadmap-onclick-image .mobile-image {
        padding: 0 20px;
        display: none !important;
        inset: 0;
        position: fixed;
        z-index: 100;
        overflow-y: scroll;
    }

    .roadmap-onclick-image .mobile-image.active {
        display: block !important;
    }

    .roadmap-onclick-image .mobile-image img {
        border-radius: 20px;
        width: 100%;
    }

    .roadmap-onclick-image .mobile-image .mobile-image-close-button {
        inset: 0;
    }

    .roadmap-onclick-image .mobile-image .mobile-image-close-button img {
        cursor: pointer;
        position: fixed;
        top: 8px;
        right: 28px;
        width: 32px;
    }
}