:root {
    --font-family: Abhaya Libre;
    --white: #FFFFFFFF;
    --primary: #016df3ff;
    --primary2: #9bc8ffff;
    --primary4: #7c83edff;
    --primary6: #07469eff;
    --light-primary: #f0f7ffff;
    --secondary1: #f3f6fbff;
    --secondary5: #fe763eff;
    --secondary6: #c4d5e6ff;
    --bg-landing-intro: #7c83edff;
    --tertiary1: #e8bb9aff;
    --tertiary1-6: #8c5228ff;
    --tertiary3: #f3e1c9ff;
    --tertiary3-6: #dbb385ff;
    --tertiary3-5: #eac79eff;
    --tertiary5: #1c59a6ff;
    /* --light-primary: #FCF2F2FF; */
    --text-grey: #565d6dff;
    --text-natural: #323743ff;
    --text-natural5: #9095a1ff;
    --text-natural6: #565d6dff;
    --text-natural7: #323743ff;
    --black: #171a1fff;
    --success65: #17a948ff;
    --landing-font-family: Abhaya Libre;
    --btn-conclusion-signup: #10253cff;
    --btn-conclusion-signup-bg: #a9c7e8ff;
}

@font-face {
    font-family: 'NotoSans';
    src: url('/fonts/NotoSans.ttf') format('truetype');
}

table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;

    td,
    th {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 8px;
    }

}

.title_h1,
.title-h1 {
    font-size: 3vw !important;
    line-height: 1.15 !important;
}

.title_h2,
.title-h2 {
    font-size: 2.82vw !important;
    line-height: 1.25 !important;
}

.title_h3,
.title-h3 {
    font-size: 1.875vw !important;
    line-height: 1.375 !important;
}

.title_h4,
.title-h4 {
    font-size: 1.5vw !important;
    line-height: 1.375 !important;
}

.title_h5,
.title-h5 {
    font-size: 1.25vw !important;
    line-height: 1.375 !important;
}

.title_h6,
.title-h6 {
    font-size: 1vw !important;
    line-height: 1.625 !important;
}

.title_h7,
.title-h7 {
    font-size: 0.9vw !important;
    line-height: 1.625 !important;
}

.label {
    font-size: 0.8vw !important;
    line-height: 1 !important;
}

.text {
    font-size: 0.8vw !important;
    line-height: 1 !important;
}

.d4 {
    font-size: 0.9vw !important;
    line-height: 3vw !important;
}

.text-white-space {
    white-space: pre-line;
}

.pd-bottom-0-3 {
    padding-bottom: 0.3vw;
}

.pd-bottom-1 {
    padding-bottom: 1vw;
}

.pd-bottom-1-5 {
    padding-bottom: 1.5vw;
}

.pd-bottom-2 {
    padding-bottom: 2vw;
}

.mg-left-2 {
    margin-left: 2vw;
}

.mg-left-3 {
    margin-left: 3vw;
}

.mg-left-5 {
    margin-left: 5vw;
}

.ul-cricle-style {
    list-style-type: circle;
}

.center-item {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.div_bg_img,
.div-bg-img {
    width: 100%;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0;
}

.div_container_center,
.div-container-center {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: wrap;
    width: 100%;
}

.button_verify_container,
.button-verify-container {
    opacity: 1;
    border: none;
    border-radius: 1.2vw;
    left: 0;
    color: var(--primary);
    background-color: var(--light-primary);
    width: 12vw;
    font-size: 1vw;
    margin-top: 0.8vw;
    max-height: 3vw;
    display: inline;
}

.icon_custom,
.icon-custom {
    font-size: 1.5vw;
}

.header {
    background-color: "#FFFFFFFF";
    height: 3vw;

    .header-left-branding {
        width: 22vw
    }

    .header-col-left {
        position: absolute;
        margin-top: 0.5vw;

        .header-left {
            display: flex;
            align-items: center;
            font-size: inherit;
            margin-left: 1.1vw;
            padding-top: 0;
            padding-left: 0.2vw;
            margin-top: -0.5vw
        }

        .header-sub-title {
            font-size: 1vw;
            margin-bottom: 0;
            font-weight: 600;
            color: "#565D6DFF";
        }

        .header-system-name {
            font-size: 0.8vw;
            margin-bottom: 0;
            font-weight: 600;
            line-height: 1.2;
            color: "#171A1FFF";
        }

        .header-e9-logo {
            margin-top: 0;
            width: 2.2vw;
            max-height: 2vw;
            height: 100%;
        }
    }

    .header-right {
        display: flex;
        justify-content: flex-end;
        padding-right: 5vw;
        margin-top: 0.5vw;
        width: 100%;

        .header-right-button {
            max-width: 10vw;
            font-size: 0.9vw;
            color: var(--primary);
            background-color: var(--light-primary);
            opacity: 1;
            border: none;
            border-radius: 1.2vw;
            max-height: 3vw;
            margin-bottom: 0.5vw;
            display: inline;
        }
    }
}

.col_no_padding {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.trapezoid_left {
    border-bottom: 2.5vw solid var(--black);
    border-left: 1.5vw solid var(--primary6);
    /* border-right: 0px solid transparent; */
    transform: rotate(180deg);
    height: 2vw;
    width: 100%;

    .text {
        transform: rotate(180deg);
        font-size: 0.7vw;
        line-height: 2vw;
        color: white;
    }
}

#square_ul {
    white-space: pre-line;
    padding-bottom: 1vw;
    margin-left: 4vw;
    list-style-type: square;
}

/*--------------------------------------------------
    ## Footer style
---------------------------------------------------*/

.footer_link {
    font-size: 1.3vw;
    font-weight: 500;
    color: var(--text-natural7);
    margin-right: 5vh;
}