header {
    background: white;
    z-index: 200;
    padding: 0;
}

header .navbar_list_item_link, header .navbar_list_item_link i {
    color: #5c5555;
}

header .navbar_list_item .dropdown-toggle:hover, header .navbar_list_item .dropdown-toggle:focus {
    color: black;
}

header.header_slide {
    background: black;
}

.burger_menu:hover .burger_menu_text, .burger_menu.open .burger_menu_text {
    color: black;
}

.burger_menu:hover .side_button span, .burger_menu.open .side_button span {
    color: black;
}


.tabs-nav {
    position: fixed;
    width: 100vw;
    background: white;
    z-index: 99;
    top: 108px;
}
.nav-tabs {
    padding: 0 !important;
    border: none;
}

.prop-div, .value-div {
    height: calc(100% - 188px);
    margin-top: 137px;
    min-width: 750px;
    text-align: center;
}

.prop-div {
    width: 65%;
}

.value-div {
    width: 100%;
    padding: 0 9vw;
    overflow: hidden;
    position: relative;
    transition: all 0.251s linear;
}

.value-div > .story-img, .value-div > .roadmap-img {
    flex-shrink: 0;
}

.value-div .value-text {
    min-height: 50%;
    height: 65%;
    max-height: 100%;
    justify-content: center;
}

.value-div .value-title {
    color: black;
    font-weight: bold;
}

.extra-block {
    transform: translateY(400px);
    /*opacity: 0;*/
}

#story .section .value-div > .value-text {
    transform: translateY(400px);
    transition: 0.75s all linear;
    /*opacity: 0;*/
    /*visibility: hidden;*/
}

#roadmap .section .value-div > .value-text {
    transform: translateY(400px);
    transition: 0.75s all linear;
    /*opacity: 0;*/
    /*visibility: hidden;*/
}

#story .section:nth-child(odd) .extra-block {
    background: #1C1C1C;
    width: 450px;
    height: 312px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    transition: all 0.75s linear;
}

#story .section:nth-child(even) .extra-block {
    background: #E51937;
    width: 594px;
    height: 312px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
    transition: all 0.75s linear;
}

#roadmap .section:nth-child(odd) .extra-block {
    background: #1C1C1C;
    width: 450px;
    height: 312px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: -1;
    transition: all 0.75s linear;
}

#roadmap .section:nth-child(even) .extra-block {
    background: #E51937;
    width: 594px;
    height: 312px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
    transition: all 0.75s linear;
}

@media (min-width: 768px) {
    #story .section .value-div > * {
        opacity: 0;
        transition: all 0.75s;
    }
    #roadmap .section .value-div > * {
        opacity: 0;
        transition: all 0.75s;
    }
}

#story .section.active .value-div > * {
    transform: translateY(0);
    opacity: 1;
}

#roadmap .section.active .value-div > * {
    transform: translateY(0);
    opacity: 1;
}

.section.active .value-div {
     transform: translateY(100px);
}

@media (max-width: 768px) {
    .section.active .value-div {
        transform: translateY(0);
    }

    .value-div .value-text p.value-title {
        font-size: 16px;
    }

    .value-div .value-text p, .value-div .value-text span {
        font-size: 12px !important;
    }
}
.value-div img {
    height: 65%;
    min-height: 300px;
}

/*#roadmap .value-div img {*/
/*    height: 40%;*/
/*    min-height: 300px;*/
/*}*/

/*#roadmap .value-div .value-text {*/
/*    min-height: 300px;*/
/*    height: 40%;*/
/*    max-height: 100%;*/
/*    justify-content: center;*/
/*}*/

#roadmap .fp-section.fp-table, .fp-slide.fp-table {
    display: block !important;
}
.extra-block {
    transform: translateY(400px);
}

.prop-title {
    color: #E51937;
}
.prop-div .prop-image {
    max-width: 100%;
    max-height: 57%;
}

#nav-tab .nav-link {
    padding: 20px !important;
    pointer-events: auto;
    border: none;
    outline: none;
    border-bottom: 3px solid #3B3B3B;
    color: #000000;
    font-family: Avenir LT, serif;
}

#nav-tab .nav-link.active {
    color: #E51937;
    border-bottom: 3px solid #E83953;
    font-family: Avenir EX-BD, serif;
}

.section .prop-div > * {
    transform: translateY(200px);
    transition: all 1s linear;
    opacity: 0;
}

.section.active .prop-div > * {
    transform: translateY(0);
    opacity: 1;
}

#story .fp-tableCell, #story .fp-tableCell {
    display: flex !important;
}

@media (max-width: 767px) {
    .tabs-nav {
        position: relative;
    }
    .nav-tabs {
        padding: 20px 15px;
        border: none;
    }

    #nav-tab .nav-link {
        padding: 0;
        font-size: 16px !important;
    }

    .prop-div, .value-div {
        height: unset;
        margin-top: 0;
        width: 100vw;
        padding: 0 15px;
        min-width: unset;
        text-align: center;
    }

    #story .section.active .value-div > * {
        transform: unset;
    }

    #roadmap .section.active .value-div > * {
        transform: unset;
    }

    .section .prop-div > * {
        transform: unset;
        transition: all 0s linear;
        opacity: 1;
    }

    .section.active .prop-div > * {
        transform: unset;
        opacity: 1;
    }

    .prop-title, .prop-sub, .value-title, .value-sub {
        text-align: left;
    }

    .prop-title, .value-title {
        font-size: 20px;
        font-family: Avenir LT, serif;
        color: #000000;
        margin-bottom: 15px;
        text-align: center;
    }

    .prop-sub, .value-sub {
        font-size: 15px;
        line-height: 22px;
        margin-bottom: 15px;
        text-align: center;
    }

    .prop-div, .value-div {
        margin-bottom: 25px;
    }

    .extra-block {
        display: none;
    }

    #story .section .value-div {
        flex-direction: column !important;
        gap: 15px;
    }

    #story .section .value-div > .value-text {
        transform: unset;
        opacity: 1;
        visibility: visible;
        text-align: center !important;
    }

    #roadmap .section .value-div > .value-text {
        transform: unset;
        opacity: 1;
        visibility: visible;
        text-align: center !important;
    }

    .gap-70 {
        gap: unset;
    }

    .gap-30 {
        gap: unset;
    }

    .value-text {
        margin-bottom: 15px;
    }

    #roadmap .fp-tableCell {
        align-items: start;
        display: flex;
    }
    #roadmap .value-div {
        flex-direction: column !important;
        gap: 15px;
        justify-content: start;
    }

    .timeline-dots {
        gap: 20px;
    }

    #story .section.active .value-div {
        transform: unset;
    }

    #roadmap .section.active .value-div {
        transform: unset;
    }

    /*#roadmap .value-div .value-text {*/
    /*    justify-content: start;*/
    /*    min-height: unset;*/
    /*}*/

    /*#roadmap .value-div img {*/
    /*    min-height: unset;*/
    /*}*/

    .value-div img {
        height: unset;
        min-height: unset;
        max-width: 100%;
    }
}

@media (max-width: 1599px) and (min-width: 768px) {
    .value-div img {
        max-width: 785px;
    }
}

.timeline {
    bottom: 3%;
}

.timeline-dots {
    height: 66px;
}

.timeline-dot {
    width: 22px;
    height: 22px;
    background: #E51937;
    border-radius: 50%;
    position: relative;
    transition: all 0.5s linear;
}

.timeline-dot p {
    display: none;
}

.timeline-dot:not(:last-child):after {
    display: block;
    background: #E51937;
    height: 3px;
    width: 30px;
    right: -30px;
    content: "";
    top: calc(50% - 1px);
    position: absolute;
}

.timeline-dot.active {
    width: 66px;
    height: 66px;
}

.timeline-dot.active p {
    display: block;
    color: white;
    font-size: 14px;
    text-align: center;
}

footer {
    width: 100vw;
}

header a, header button, footer a, footer button {
    pointer-events: auto;
}

@media (max-width: 768px) {
    .tabs-nav {
        top: 59px;
    }

    #nav-tabContent {
        margin-top: 90px !important;
    }

    .timeline-dot {
        width: 10px;
        height: 10px;
    }

    .timeline-dot.active {
        width: 55px;
        height: 55px;
    }

    .timeline-dot.active p {
        font-size: 12px;
    }

}

p {
    margin: 0;
}
