:root {
    --gray: #f6f6f7;
    --gray-darker: #333333;
    --light-gray: #CECECE;
    --midnight-blue: #020A13;
    --golden-sun: #F4D279;
    --lime-green: #6FD600;
    --lavender-pastel: #EDCFFC;
    --dark-green: #304A2F;
    --success: #28A745;
    --white: #ffffff;
    --border-color: #E8E8E8;
    --font-size-32: 18px;
    --font-size-24: 16px;
    --font-size-18: 14px;
    --font-size-16: 14px;
    --font-size-14: 10px;
    --font-size-12: 8px;
    /* --box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; */
    --box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

@media (min-width: 768px) {
    :root {
        --font-size-32: 24px;
        --font-size-24: 18px;
        --font-size-18: 16px;
        --font-size-16: 14px;
        --font-size-14: 12px;
        --font-size-12: 10px;
    }
}

@media (min-width: 992px) {
    :root {
        --font-size-32: 24px;
        --font-size-24: 24px;
        --font-size-18: 18px;
        --font-size-16: 16px;
        --font-size-14: 14px;
        --font-size-12: 12px;
    }
}

/*----- global class start ------*/
h2 {
    font-size: var(--font-size-32);
    color: var(--midnight-blue);
    font-weight: bold;
    line-height: normal;
    font-style: normal;
}

h3 {
    font-size: var(--font-size-24);
    color: var(--midnight-blue);
    font-weight: 600;
    line-height: normal;
    font-style: normal;
}

h4 {
    font-size: var(--font-size-24);
    color: var(--midnight-blue);
    font-weight: 600;
    line-height: normal;
    font-style: normal;
    text-transform: capitalize;
}

p {
    font-size: var(--font-size-16);
    color: var(--midnight-blue);
    font-weight: 400;
    line-height: normal;
    font-style: normal;
}
span {
    font-size: var(--font-size-16);
    color: var(--midnight-blue);
    font-weight: 400;
    line-height: normal;
    font-style: normal;
}
strong {
    font-size: var(--font-size-16);
    color: var(--midnight-blue);
    line-height: normal;
    font-style: normal;
}

.custom-button {
    padding: 12px 24px;
    display: inline-block;
    font-size: 14px;
    color: var(--white);
    background: var(--success);
    font-weight: 700;
    text-decoration: none;
    border-radius: 8px;
    border: none;
    text-transform: uppercase;
}
.custom-button:hover{
    color: var(--white);
}
a{
    font-size: var(--font-size-16);
    color: var(--success);
    font-weight: 600;
    line-height: normal;
    font-style: normal;
    text-decoration: none; 
}
a:hover{
    color: var(--success);
}
/*---- global class end -----*/

/*----- bootsrap accordian customization -----*/
.accordion-button:not(.collapsed){
    color: var(--midnight-blue);
    font-size: var(--font-size-16);
    font-weight: 700;
    background: #28a7453b;
}
.accordion-button:focus{
    border: none;
    box-shadow: none;
}
/*----- bootstrap accordian customization end ----*/