:root {
    --black-1: #4E566B;
    --black-2: #262A37;

    --blue-1: #066BC9;
    --blue-2: #2B68FF;
    --blue-3: #40A3FF;

    --orange: #FB5607;
    --orange-dead: #9F7B6A;
    --orange-dead-text: #FFD8C5;

    --text-small: 0.625rem;
    --text-sub: 0.8125rem;
    --text-body: 1rem;
    --text-h6: 1.25rem;
    --text-h5: 1.5625rem;
    --text-h4: 1.9375rem;
    --text-h3: 2.4375rem;
    --text-h2: 3.0625rem;
    --text-h1: 3.8125rem;
}

body {
    font-size: 16px;
    font-family: "Poppins", sans-serif;
    background-color: #f9f9fD;
}

.primary-button-solid {
    background-color: var(--orange);
    padding: 0.9375rem 1.5625rem;
    border-radius: 0.4375rem;
    display: inline-block;
    color: #FDFDFF;
    text-decoration: none;
    font-size: var(--text-body);
    transition: all 0.3s ease-out;

    &:hover {
        background-color: var(--orange-dead);
        color: var(--orange-dead-text);
    }
}

.primary-button-outline {
    background-color: transparent;
    padding: 0.9375rem 1.5625rem;
    border-radius: 0.4375rem;
    display: inline-block;
    color: var(--orange);
    text-decoration: none;
    font-size: var(--text-body);
    border: 1px solid var(--orange);
    transition: all 0.3s ease-out;

    &:hover {
        background-color: var(--orange-dead);
        color: var(--orange-dead-text);
        border-color: var(--orange-dead);
    }
}

.nav-box-shadow {
    box-shadow: 0 0.625rem 2.1875rem rgba(8, 15, 40, 10%);
}

.navbar {
    background-color: #FDFDFF;
    padding-top: 0;
    padding-bottom: 0;

    .navbar-brand {

        @media(max-width:450px) {
            padding-left: 1rem;
        }

        img {
            width: auto;
            height: 4.875rem;

            @media(max-width:450px) {
                height: 3.125rem;
            }
        }

    }

    .navbar-toggler {
        color: var(--black-2);
        border: none !important;
        outline: none;
        box-shadow: none;
    }

    .navbar-nav {

        li.active,
        li:hover {
            >a {
                color: var(--blue-1);

                >span::after {
                    width: 100%;
                }
            }
        }

        a {
            text-decoration: none;
            font-size: var(--text-body);
            color: var(--black-2);
            padding: 0.625rem;
            display: inline-block;
            transition: all 0.3s ease-out;
            /* position: relative; */
        }

        a::after {
            /* content: none; */
        }

        span {
            position: relative;
        }

        span::after {
            content: '';
            height: 3px;
            border-radius: 3px;
            background-color: var(--blue-1);
            width: 0;
            position: absolute;
            bottom: 0;
            left: 0;
            transition: all 0.3s ease-out;
        }

        .dropdown-menu {
            padding-left: 0.625rem;
            border: none;
        }
    }

    .auth-button {
        display: flex;
        flex-direction: column;
        padding: 0.625rem;
        gap: 0.625rem;

        @media(min-width:576px) {
            flex-direction: row;
        }

        .join,
        .login {
            padding: 0.3125rem 0.9375rem;
            font-weight: normal;
            text-align: center;

            @media(max-width: 450px) {
                padding: 0.625rem 0.625rem;
            }
        }
    }
}

@media(min-width:1200px) {
    .navbar-nav {
        [data-child="haschild"]:hover {
            .dropdown-menu {
                opacity: 100;
                visibility: visible;
                transform: translateY(0);
            }
        }


        .dropdown-menu {
            display: block;
            visibility: hidden;
            opacity: 0;
            background-color: var(--blue-2);
            border-radius: 1.25rem;
            transition: all 0.3s ease-out;
            transform: translateY(-1rem);

            span {
                color: #FDFDFF;
                transition: all 0.3s ease-out;
            }

            li:hover {
                span {
                    color: var(--blue-3);
                }

                span::after {
                    content: none;
                }
            }
        }
    }
}

.header-banner {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 21.875rem;

    display: flex;
    align-items: center;

    overflow-x: auto;


    .banner-title {
        font-size: var(--text-h1);
        font-weight: bold;
        color: #FDFDFF;

        @media(max-width:450px) {
            margin-left: 0.9375rem;
        }
    }
}

.breadcrumb-list {
    font-size: var(--text-sub);
    color: var(--black-1);
    margin-top: 1.25rem;

    @media(max-width:450px) {
        margin-left: 0.9375rem;
    }

    a {
        text-decoration: none;
        color: var(--black-1);
        display: inline-block;

        :hover {
            text-decoration: underline;
        }
    }

    .breadcrumb {
        margin: 0;
    }
}

.hero-section {
    background-color: #FBFBFB;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;

    .hero-container {
        @media(max-width:450px) {
            padding-left: 2.625rem;
            padding-right: 2.625rem;
        }
    }

    .tag {
        background-color: #E4E4E4;
        font-size: var(--text-h6);
        border-radius: 3.125rem;
        color: var(--blue-2);
        padding: 0.375rem 1.25rem;
        display: inline-block;

        @media(max-width: 467px) {
            font-size: var(--text-sub);
        }

        @media(max-width: 450px) {
            font-size: var(--text-sub);
        }

        @media(max-width: 340px) {
            font-size: var(--text-small);
        }
    }

    .headline {
        font-size: var(--text-h1);
        color: var(--black-2);
        font-weight: bold;
        line-height: 120%;
        margin-top: 1.875rem;
        overflow: hidden;

        @media(max-width: 450px) {
            font-size: var(--text-h3);
            margin-top: calc(1.875rem/2);
        }
    }

    .sub-headline {
        font-size: var(--text-h6);
        color: var(--black-1);
        line-height: 160%;
        margin-top: 1.875rem;

        @media(max-width: 450px) {
            font-size: var(--text-body);
            margin-top: calc(1.875rem/2);
        }
    }

    .cta {
        margin-top: 1.875rem;
        display: flex;
        gap: 1rem;

        @media(max-width: 450px) {
            margin-top: calc(1.875rem/2);

        }

        .main-button {
            box-shadow: 0.3125rem 0.625rem 1.1875rem rgba(8, 15, 40, 30%);

            @media(max-width: 450px) {
                box-shadow: 0.3125rem 0.625rem 1.1875rem rgba(8, 15, 40, 30%);
                font-size: var(--text-sub);
                line-height: 180%;
            }
        }

        .secondary-button {
            @media(max-width: 450px) {
                font-size: var(--text-sub);
                line-height: 180%;
            }
        }

    }

    .image-wrapper {
        padding: 0.25rem;

        @media(max-width:1199px) {
            padding-top: 2rem;
        }

        img {
            width: 100%;
            height: auto;
        }
    }
}

.why-us-section {
    background-color: var(--blue-2);
    margin-top: 3rem;
    color: #FDFDFF;
    padding-bottom: 6rem;
    transition: all 0.3s ease-out;

    @media(max-width: 450px) {
        margin-top: 7rem;
        padding-left: 1.875rem;
        padding-right: 1.875rem;
        padding-bottom: 5rem;
    }

    @media(max-width: 370px) {
        margin-top: 9rem;

    }

    .stats-container {
        background: linear-gradient(to bottom right, var(--blue-3), var(--blue-2));
        border-radius: 1.25rem;
        padding-left: 3.125rem !important;
        padding-right: 2.875rem !important;
        /* padding-top: 2.5rem !important; */
        /* padding-bottom: 2.5rem !important; */
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
        transform: translateY(-3rem);
        box-shadow: 0 0.9375rem 2.1875rem rgba(44, 71, 162, 20%);

        @media(max-width: 450px) {
            transform: translateY(-25%);
        }

        .stats-item {

            @media(max-width: 450px) {
                padding-top: 1rem !important;
                padding-bottom: 1rem !important;
            }

            .stats-icon {
                img {
                    width: 3.125rem;
                    height: 3.125rem;


                    @media(max-width:450px) {
                        width: calc(3.125rem*0.8);
                        height: calc(3.125rem*0.8);
                    }
                }
            }

            .stats-text {
                display: flex;
                flex-direction: column;
                gap: 0.625rem;

                @media(max-width:450px) {
                    gap: calc(0.625rem*0.8);
                }

                .counter {
                    font-size: var(--text-h4);
                    font-weight: bold;

                    @media(max-width:450px) {
                        font-size: var(--text-h5);
                    }

                    span {
                        font-size: var(--text-h6);
                        font-weight: lighter;

                        @media(max-width:450px) {
                            font-size: var(--text-body);
                        }
                    }
                }

                .title {
                    font-size: var(--text-body);
                    font-weight: bold;

                    @media(max-width:450px) {
                        font-size: var(--text-sub);
                    }
                }

                .desc {
                    font-size: var(--text-sub);
                    font-weight: 300;

                    @media(max-width:450px) {
                        font-size: var(--text-small);
                    }
                }
            }
        }
    }

    .section-content {
        margin-top: 1rem;

        @media(max-width: 450px) {
            margin-top: -5rem;
        }

        .title {
            text-align: center;
            font-size: var(--text-h3);
            font-weight: bold;

            @media(max-width: 450px) {
                font-size: var(--text-h4);
            }
        }

        .desc {
            margin-top: 1.5rem;
            font-size: var(--text-h6);
            line-height: 160%;
            text-align: center;
            font-weight: 300;

            @media(max-width: 450px) {
                font-size: var(--text-body);
                margin-top: 1rem;
            }
        }
    }

    .advantages {
        margin-top: 2.5rem;

        @media(max-width: 450px) {
            margin-top: 1.875rem !important;
        }

        .item {
            text-align: center;

            @media(max-width: 450px) {
                padding-top: 1.875rem !important;
            }

            .icon {
                width: 3.125rem;
                height: 3.125rem;
                overflow: hidden;
                margin: 0 auto;

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }

            .title {
                margin-top: 1.25rem;
                font-size: var(--text-body);
                line-height: 160%;
                font-weight: 600;
            }

            .desc {
                margin: 0 auto;
                margin-top: 0.625rem;
                font-size: var(--text-sub);
                font-weight: 300;
                line-height: 160%;
                max-width: 15.625rem;

            }
        }

        @media(min-width: 576px) {
            .item {
                text-align: left;

                .icon {
                    margin: 0;
                }
            }
        }
    }
}

.our-mission-neutral-section {
    /* margin-top: 1.25rem; */

    .our-mission,
    .neutral {
        /* background-color: #F6FBFF; */
        background-color: transparent;
        border-radius: 1.25rem;
        padding-top: 1.875rem;
        padding-left: 1.875rem;
        padding-right: 1.875rem;
        /* padding-bottom: 1rem; */
        /* margin-top: 1.25rem; */

        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);

            @media(max-width: 450px) {
                font-size: var(--text-h5);
            }
        }

        .desc {
            color: var(--black-1);
            font-size: var(--text-body);
            font-weight: 300;
            margin-top: 0.625rem;
            line-height: 160%;

            @media(max-width: 450px) {
                font-size: var(--text-sub);
            }
        }
    }
}

.cta-banner-section {
    background-color: #000112;
    border-radius: 1.25rem;
    color: #FDFDFF;
    padding: 3.5rem 3.125rem;
    margin-top: 4.375rem;
    position: relative;
    overflow: hidden;

    @media(max-width: 450px) {
        margin-top: 2.125rem;
        padding-left: 1.875rem;
        padding-right: 1.875rem;
    }

    .image {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        z-index: 0;
        /* background-color: red; */

        mix-blend-mode: lighten;
        opacity: .4;

        @media(min-width:1200px) {
            width: 50%;
            mix-blend-mode: normal;
            opacity: 1;
        }

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;

            object-position: right center;
        }
    }

    .title {
        font-size: var(--text-h5);
        font-weight: bold;
        line-height: 130%;
        overflow: hidden;
        z-index: 2;
        position: relative;
    }

    @media(min-width:576px) {
        .title {
            font-size: var(--text-h3);
        }
    }

    .desc {
        font-size: var(--text-body);
        font-weight: 300;
        line-height: 160%;
        margin-top: 0.625rem;
        z-index: 2;
        position: relative;
    }

    .cta {
        margin-top: 1.875rem;
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: flex-start;
        z-index: 2;
        position: relative;

        @media(min-width: 576px) {
            flex-direction: row;
        }

        .secondary-button {
            border: solid 1px #FDFDFF;
            color: #FDFDFF;

            &:hover {
                border-color: var(--orange-dead);
            }
        }

    }
}

.members-of-section {

    margin-top: 5rem;

    @media(max-width: 450px) {
        margin-top: 2rem;
    }

    .title {
        font-weight: bold;
        font-size: var(--text-body);
        color: var(--blue-1);
        text-align: center;
    }

    .list {
        display: flex;
        gap: 2.5rem;
        flex-wrap: wrap;
        justify-content: center;
        margin-top: 0.625rem;

        @media(max-width: 450px) {
            gap: 1.25rem;
        }

        a {
            img {
                height: 3.125rem;
                width: auto;
            }
        }
    }
}

.footer-section {
    background-color: #E4E4E4;
    margin-top: 5rem;
    padding-top: 1.5625rem;
    padding-bottom: 1.6875rem;

    @media(max-width: 450px) {
        margin-top: 2rem;
        padding-top: 1.875rem;
        padding-left: 1.875rem;
        padding-right: 1.875rem;
    }

    .title {
        font-size: var(--text-body);
        font-weight: bold;
        color: var(--blue-1);
    }

    .list-menu {

        .sub-section {
            margin-top: 1.875rem;

            @media(max-width:450px) {
                margin-top: 0;
            }

            ul {
                list-style: none;
                margin: 0;
                padding: 0;

                li {
                    margin-top: 0.625rem;

                    a {
                        font-size: var(--text-sub);
                        font-weight: 300;
                        color: var(--black-2);
                        text-decoration: none;

                        :hover {
                            text-decoration: underline;
                        }
                    }
                }
            }
        }

        @media(max-width:450px) {
            .connect-item {
                margin-top: 1.875rem;
            }
        }
    }


    .contact-us {
        margin-top: 1.875rem;

        ul {
            list-style: none;
            margin: 0;
            padding: 0;

            li {
                display: flex;
                align-items: center;
                gap: 0.625rem;
                margin-top: 0.625rem;

                .icon {
                    width: 1.25rem;
                    color: var(--blue-2);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                }

                .value {
                    font-weight: 300;
                    font-size: var(--text-sub);
                    color: var(--black-2);

                    a {
                        color: var(--black-2);
                    }
                }
            }
        }
    }
}

.copyright-section {
    background-color: #E4E4E4;
    padding-bottom: 1.875rem;
    padding-top: 0;

    p {
        text-align: center;
        color: var(--black-1);
        font-size: var(--text-sub);
        font-weight: 300;
        margin: 0;
        padding: 0;

        a {
            text-decoration: none;
            color: var(--black-1);
        }

        a:hover {
            text-decoration: underline !important;
        }
    }
}

.back-to-top {
    width: 3.125rem;
    height: 3.125rem;
    background-color: #FDFDFF;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    right: 0.625rem;
    bottom: 0.625rem;
    color: var(--blue-2);
    box-shadow: 0 0.25rem 0.625rem 0 rgba(125, 126, 197, 20%);
}

/* MODULE & PAGES */

.about-us-module {

    margin-top: 1.25rem;

    .block {

        @media(max-width:450px) {
            padding-right: 15px;
            padding-left: 15px;
        }

        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);

            @media(max-width:450px) {
                font-size: var(--text-h5);
            }
        }

        .desc {
            font-size: var(--text-body);
            color: var(--black-1);
            line-height: 160%;
            font-weight: normal;
            margin-top: 1.25rem;

            @media (max-width:450px) {
                margin-top: 0.625rem;
                font-size: var(--text-sub);
            }
        }
    }

    .why {
        margin-top: 1.875rem;
    }

    .image-1 {
        max-width: 26rem;
        max-height: 28.875rem;
        width: 100%;
        height: 100%;
        overflow: hidden;
        border-radius: 1.25rem;
        margin: 0 auto;
        margin-top: 1.875rem;

        @media(min-width:992px) {
            margin-top: 0;
        }

        img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
        }
    }

    .where-wrapper {
        background-color: #FDFDFF;
        padding-top: 3.75rem;
        padding-bottom: 3.75rem;
        margin-top: 2.5rem;

        @media(max-width:450px) {
            padding-top: 1.875rem;
            padding-bottom: 0;
            margin-top: 1.25rem;
        }

        .image-2 {
            max-width: 81rem;
            max-height: 23.75rem;
            width: 100%;
            height: 100%;
            overflow: hidden;
            border-radius: 1.25rem;
            margin: 0 auto;
            margin-top: 1.875rem;

            @media(max-width:450px) {
                margin-top: 0.9375rem;
            }

            img {
                object-fit: cover;
                width: 100%;
                height: 100%;
            }
        }
    }

    .last-wrapper {
        padding-top: 2.5rem;
        padding-bottom: 1.25rem;

        @media(max-width:450px) {
            padding-top: 1.25rem;
            padding-bottom: 0;
        }

        .text-wrapper {
            background-color: #F6FBFF;
            border-radius: 1.25rem;
            /* padding: 1.875rem; */
            padding: 1rem;

            @media(max-width: 450px) {
                background-color: transparent;
                padding-left: 0.9375rem;
                padding-right: 0.9375rem;
                padding-top: 0;
                padding-bottom: 0;
                margin-top: 1.25rem;
            }
        }

        .neutral {
            margin-top: 1.25rem;

            @media(max-width: 450px) {
                margin-top: 1.25rem;
            }
        }

        .how-we {
            margin-top: 1.25rem;

            @media(max-width: 450px) {
                margin-top: 1.25rem;
            }
        }

        .image-3 {
            max-width: 32.4375rem;
            max-height: 41.25rem;
            width: 100%;
            height: 100%;
            overflow: hidden;
            border-radius: 1.25rem;
            margin: 0 auto;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }
    }

    .banner-wrapper {
        background-color: #FDFDFF;
        padding-top: 1.25rem;
        /* padding-top: -100rem !important; */

        @media(max-width:450px) {
            padding-top: 0;
        }

        .cta-banner-section {
            margin-top: 1.875rem;
        }
    }
}

.lets-connect-module {
    margin-top: 1.25rem;

    @media(max-width:450px) {
        padding-right: 0.9375rem;
        padding-left: 0.9375rem;
    }

    .block {
        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);

            @media(max-width:450px) {
                font-size: var(--text-h5);
            }
        }

        .desc {
            font-size: var(--text-body);
            color: var(--black-1);
            line-height: 160%;
            font-weight: normal;
            margin-top: 1.25rem;

            overflow-x: auto;

            @media(max-width:450px) {
                font-size: var(--text-sub);
                margin-top: 0.625rem;
            }
        }

        p {
            margin-bottom: 0;
        }


        ol {
            margin-left: 1rem;
        }

        ul {
            list-style: none;
            padding-left: 0;
            margin: 0;
            /* margin-left: 1.625rem; */
            margin-left: 3rem;
            margin-top: 1rem;
            margin-bottom: 1rem;

            li::before {
                content: "•";
                color: var(--black-1);
                display: inline-block;
                width: 1rem;
                margin-left: -1rem;
            }
        }

        a {
            color: var(--orange);
            font-weight: bold;
        }

        table {
            width: 100%;
            color: var(--black-1);
            margin-top: 1.25rem;

            thead {
                font-size: var(--text-h6);
                font-weight: bold;
                line-height: 160%;
                border-bottom: 1px solid #E4E4E4;

                @media(max-width:450px) {
                    font-size: var(--text-body);
                }

                th {
                    padding: 0.625rem;
                }
            }

            tbody {
                font-size: var(--text-body);
                line-height: 160%;

                @media(max-width:450px) {
                    font-size: var(--text-sub);
                }

                tr:nth-child(even) {
                    background-color: #F6FBFF;
                }

                td {
                    padding: 0.9375rem 0.625rem;
                }
            }

            a {
                font-size: var(--text-body);
                color: var(--black-1);
                font-weight: normal;
            }
        }


    }

    .where {
        margin-top: 1.875rem;

        @media(max-width:450px) {
            margin-top: 0.9375rem;

        }
    }

}

.join-module {
    margin-top: 1.25rem;

    @media(max-width:450px) {
        padding-right: 0.9375rem;
        padding-left: 0.9375rem;
    }

    .block {
        margin-top: 1.5625rem;

        @media(max-width:450px) {
            margin-top: 1.75rem;
        }

        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);
        }

        .desc {
            font-size: var(--text-body);
            color: var(--black-1);
            line-height: 160%;
            font-weight: normal;
            margin-top: 1.25rem;

            @media(max-width:450px) {
                /* font-size: var(--text-sub); */
                margin-top: 0.5rem;
                /* margin-top: 0; */
            }
        }
    }

    h6 {
        margin: 0;
        color: var(--blue-2);
        font-size: var(--text-h6);
        font-weight: bold;
    }

    a {
        color: var(--orange);
        font-weight: bold;
    }

    ul {
        list-style: none;
        padding-left: 0;
        margin: 0;
        margin-left: 1.625rem;
        /* margin-top: 1.25rem; */
        margin-top: 0.5rem;
        color: var(--black-1);

        @media(max-width:450px) {
            margin-top: 0.5rem;
        }

        li::before {
            content: "✔";
            color: #14AE5C;
            display: inline-block;
            width: 1.5rem;
            margin-left: -1.5rem;
            font-weight: bold;
            font-size: var(--text-h6);
        }
    }

    /* .block {
        margin-top: 1.25rem;
    } */

    .form-section {
        margin-top: 3.125rem;

        @media(max-width:450px) {
            margin-top: 1rem;
        }

        .title {
            font-size: var(--text-h3);
            font-weight: bold;
            color: var(--blue-2);
            text-align: center;
        }

        label {
            color: var(--black-2);
        }

        input {
            border-color: #E4E4E4;
            border-radius: 0.3125rem;

            &:focus {
                box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;
            }
        }

        .right-section {
            margin-top: 0.9063rem;
        }

        @media(min-width: 992px) {
            .right-section {
                margin-top: 0;
            }
        }

        .form-item~.form-item {
            margin-top: 0.9063rem;
        }

        .primary-button-solid {
            border: none;
            padding: 0.75rem 1.25rem;
        }

        .primary-button-outline {
            border: 1px solid var(--blue-1);
            color: var(--blue-1);
            padding: 0.75rem 1.25rem;

            &:hover {
                background-color: var(--orange-dead);
                color: var(--orange-dead-text);
                border-color: var(--orange-dead);
            }
        }


        .card {
            margin-top: 1.875rem;
            background-color: #FDFDFF;
            border-radius: 1.25rem;
            box-shadow: 0 0.9375rem 2.1875rem 0 rgba(44, 71, 162, 20%);
            padding: 2.5rem;
            border: none;

            @media(max-width:450px) {
                margin-top: 0.7rem;
            }
        }

        .notice {
            margin-top: 1.5rem;
            font-size: var(--text-body);
            color: var(--orange);
            font-style: italic;
            line-height: 160%;
        }

        .button-wrapper {
            margin-top: 1.5rem;
        }
    }
}

.participants-module {
    margin-top: 1.25rem;

    @media(max-width:450px) {
        padding-left: 0.9375rem;
        padding-right: 0.9375rem;
    }

    .title {
        font-size: var(--text-h4);
        font-weight: bold;
        color: var(--black-2);

        @media(max-width:450px) {
            font-size: var(--text-h5);
        }
    }

    .table-wrapper~.table-wrapper {
        margin-top: 2.5rem;
    }

    .table-wrapper {
        overflow-x: auto;

        table {
            width: 100%;
            color: var(--black-1);
            margin-top: 1.25rem;

            thead {
                font-size: var(--text-h6);
                font-weight: bold;
                line-height: 160%;
                border-bottom: 1px solid #E4E4E4;

                @media(max-width:450px) {
                    font-size: var(--text-body);
                }

                th {
                    padding: 0.625rem;
                }
            }

            tbody {
                font-size: var(--text-body);
                line-height: 160%;

                @media(max-width:450px) {
                    font-size: var(--text-sub);
                }

                tr:nth-child(even) {
                    background-color: #F6FBFF;
                }

                td {
                    padding: 0.9375rem 0.625rem;
                }
            }

            a {
                font-size: var(--text-body);
                color: var(--black-1);
                font-weight: normal;
            }
        }
    }

    .banner-wrapper {
        .title {
            color: #FDFDFF;
        }
    }
}

.peering-module {
    margin-top: 1.25rem;

    @media(max-width:450px) {
        padding-left: 0.9375rem;
        padding-right: 0.9375rem;
    }

    .block {

        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);
            text-align: center;
        }

        .desc {
            font-size: var(--text-body);
            color: var(--black-1);
            line-height: 160%;
            font-weight: normal;
            /* margin-top: 1.25rem; */
            margin-top: 0.25rem;

            overflow-x: auto;
        }
    }

    ol {
        margin-left: 1rem;
    }

    ul {
        list-style: none;
        padding-left: 0;
        margin: 0;
        margin-left: 3rem;
        margin-top: 1rem;
        margin-bottom: 1rem;

        li::before {
            content: "•";
            color: var(--black-1);
            display: inline-block;
            width: 1rem;
            margin-left: -1rem;
        }
    }

    .peering {
        max-width: 480px;
        margin: 0 auto;
        margin-top: calc(1.25rem + 1.625rem);

        @media(max-width:450px) {
            margin-bottom: 50px;
        }

        .icon {
            font-size: calc(var(--text-h1)*1);
            text-align: center;
            color: var(--orange);
        }

        .desc {
            text-align: center;
        }
    }

    table {
        width: 100%;
        color: var(--black-1);
        /* margin-top: 2.5rem; */
        margin-top: 3.5rem;
        overflow-x: auto;

        @media(max-width:450px) {
            margin-top: 0;
        }

        thead {
            font-size: var(--text-h6);
            font-weight: bold;
            line-height: 160%;
            border-top: 1px solid #E4E4E4;
            border-bottom: 1px solid #E4E4E4;

            @media(max-width:450px) {
                font-size: var(--text-body);
            }

            th {
                padding: 0.625rem;
                text-align: center;
            }
        }

        tbody {
            font-size: var(--text-body);
            line-height: 160%;

            @media(max-width:450px) {
                font-size: var(--text-sub);
            }

            tr:nth-child(even) {
                background-color: #F6FBFF;
            }

            tr:last-child {
                border-bottom: 1px solid #e4e4e4;
            }

            td {
                padding: 0.9375rem 0.625rem;
            }
        }

        a {
            font-size: var(--text-body);
            color: var(--black-1);
            font-weight: normal;
        }
    }

}

.pages-module {
    margin-top: 1.25rem;
    color: var(--black-1);

    @media(max-width:450px) {
        padding-left: 0.9375rem;
        padding-right: 0.9375rem;
    }

    .block~.block {
        margin-top: 2rem;

        @media(max-width:450px) {
            margin-top: 2rem;
        }
    }

    .block {
        .title {
            font-size: var(--text-h4);
            font-weight: bold;
            color: var(--black-2);

            @media(max-width:450px) {
                font-size: var(--text-h5);
            }
        }

        .desc {
            font-size: var(--text-body);
            color: var(--black-1);
            line-height: 160%;
            font-weight: normal;
            /* margin-top: 1.25rem; */
            margin-top: 0.25rem;

            @media(max-width:450px) {
                font-size: var(--text-sub);
                margin-top: 0.5rem;
            }
        }

    }

    p {
        margin-bottom: 0;
    }

    ol {
        margin-left: 1rem;

        @media(max-width:450px) {
            font-size: var(--text-sub);
            margin-left: calc(1rem*0.1);
        }
    }

    ul {
        list-style: none;
        padding-left: 0;
        margin: 0;
        margin-left: 3rem;
        margin-top: 1rem;
        margin-bottom: 1rem;

        @media(max-width:450px) {
            margin-left: calc(3rem*0.8);
            font-size: var(--text-sub);
        }

        li::before {
            content: "•";
            color: var(--black-1);
            display: inline-block;
            width: 1rem;
            margin-left: -1rem;
        }
    }

    a {
        color: var(--orange);
        font-weight: bold;
    }

    .banner-wrapper {
        a {
            font-weight: normal;
            color: white;
        }
    }

    table {
        width: 100%;
        color: var(--black-1);
        margin-top: 1.25rem;

        thead {
            font-size: var(--text-h6);
            font-weight: bold;
            line-height: 160%;
            border-bottom: 1px solid #E4E4E4;


            th {
                padding: 0.625rem;
            }
        }

        tbody {
            font-size: var(--text-body);
            line-height: 160%;

            tr:nth-child(even) {
                background-color: #F6FBFF;
            }

            td {
                padding: 0.9375rem 0.625rem;
            }
        }

        a {
            font-size: var(--text-body);
            color: var(--black-1);
            font-weight: normal;
        }
    }

    .image {
        overflow: hidden;
        border-radius: 0.625rem;

        img {
            object-fit: cover;
            width: 100%;
            height: 100%;
        }
    }

    .cta-banner-section {
        margin-top: 1.875rem;

        @media(max-width: 450px) {
            margin-top: 0;
        }
    }
}