@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap');

:root {
    /* .5rem = 8px, 1rem = 16px, 1.5rem = 24px ... */
    --big-font-size: 1rem;
    --h2-font-size: 1.75rem;
    --h3-font-size: 1.5rem;
    --h4-font-size: 1.125rem;
    --h5-font-size: 1rem;
    --normal-font-size: .938rem;
    --small-font-size: .813rem;

    --font-reg-400: 400;
    --font-medium: 500;
    --font-semi-bold: 600;
    --font-bold-700: 700;
    --font-normal: normal;

     --body-font-family: 'Poppins', sans-serif;
    --body-font-family-promoter: 'Nunito', sans-serif;
    --body-font-family-lato: 'Lato', sans-serif;

    --white-color: #FFFFFF;
    --black-color: #000000;
    --black-med-color: #171717;
    --gray-color: #605D64;

}

@media screen and (min-width: 968px) {
     /* .75rem = 12 .875rem=14 , 1rem=16px 1.125rem=18 ...*/
    :root {
        --big-font-size: 2.5rem;
        --h2-font-size: 2rem;
        --h3-font-size: 1.5625rem; /* 25px*/
        --h4-font-size: 1.125rem;
        --h5-font-size: 1rem;
        --normal-font-size: .875rem;
        --small-font-size: .75rem;
    }
}

.h1-home{
    font-family: var(--body-font-family);
    font-size: var(--big-font-size);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    line-height: 48px;
    color: var(--gray-color-dark);
    text-align: left;
}

.h2-home{
    font-family: var(--body-font-family);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h2-font-size);
    line-height: 48px;
    color: var(--body-color-bg-light);
}

.h3-home{
    font-family: var(--body-font-family);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h3-font-size);
    line-height: 37px;
    color: var(--gray-color-dark);
}

.h4-home{
    font-family: var(--body-font-family);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h4-font-size);
    line-height: 28px;
    color: var(--gray-color-mid);
}

.h5-home{
    font-family: var(--body-font-family-lato);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h5-font-size);
    line-height: 24px;
    color: var(--first-color);
}
/*14*/
.h6-home{
    font-family: var(--body-font-family-lato);
    font-style: normal;
    font-weight: var(--font-reg-400);
    font-size: var(--normal-font-size);
    line-height: 24px;
    color: var(--gray-color-light);
}
/*12*/
.p-home{
    font-family: var(--body-font-family-lato);
    font-style: normal;
    font-weight: var(--font-reg-400);
    font-size: var(--small-font-size);
    line-height: 24px;
    color: var(--gray-color-mid);
}

.h4-adc{
    font-weight: var(--font-reg-400);
    color: #E0E0E0;
    font-size: 1em;
}

.h3-adc{
    font-weight: var(--font-reg-400);
    color: #E0E0E0;
    font-size: 1.5em;
}

.h3-detail-center{
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 7%;
    color: #fff0ff;
}

.p-date{
    color: var(--first-color);
}

.p-dark{
    color: var(--gray-color-dark)!important;
}

.p-light{
    color: var(--white-color)!important;
}

.height-17 {
    line-height: 17px!important;
}

.height-21 {
    line-height: 21px!important;
}

.height-17:hover{
    color: var(--first-color);
    text-decoration: none;
}

.weight-height {
    font-weight: 600;
    line-height: 14px;
}

.dwop-item{
    white-space: nowrap;
    /*padding: 0 0.5rem;*/
}

.weight-height:hover{
    color: var(--first-color);
    text-decoration: none;
}

.v-center{
    display: flex;
    align-items: center;
}

.h2-text{
    font-family: Poppins;
    font-size: 25px;
    font-style: normal;
    font-weight: 600;
    line-height: 38px;
    letter-spacing: -0.01em;
    text-align: left;
}


@media (max-width: 968px) {
    .h1-home {
        line-height: 25px !important;
    }
}


.lh-2{
    line-height: 2.5rem;
}

@media (min-width: 968px) {
    .h6-banner{
        font-size: var(--h4-font-size)!important;
    }
}


.span-blue{
    color: var(--second-color) !important;
}

.decoration-none{
    text-decoration: none!important;
}

.h2-promoter{
    font-family: Nunito;
    font-style: normal;
    font-weight: 600;
    font-size: 32px;
    line-height: 44px;
    display: flex;
    align-items: center;
    color: #171717;
}

@media screen and (max-width: 968px) {
    .h2-promoter{
        font-size: 1.25rem;
    }
    .lh-2{
        line-height: 2rem;
    }
}

.h3-promoter{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: bold;
    font-size: var(--h3-font-size);
    line-height: 34px;
    color: var( --black-color);
}

.h4-promoter{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: bold;
    font-size: var(--h4-font-size);
    line-height: 28px;
    color: var(--black-color);
}

.h5-promoter{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h5-font-size);
    line-height: 24px;
    color: var(--white-color);
}

.h5-promoter-modal{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: var(--font-semi-bold);
    font-size: var(--h5-font-size);
    line-height: 1rem;
    color: var(--gray-color);
}

.h6-promoter{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: var(--font-reg-400);
    font-size: var(--normal-font-size);
    line-height: 24px;
    color: var(--first-color);
}

.p-promoter{
    font-family: var(--body-font-family-promoter);
    font-style: normal;
    font-weight: var(--font-reg-400);
    font-size: var(--small-font-size);
    line-height: 24px;
    color: var(--white-color);
}

.p-vendor{
    font-size: 14px;
    line-height: 17px;
    color: #212529;
}

.p-vendor-12{
    font-weight: normal;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.7);
}

.h3-white{
    color: var(--white-color);
}