body {
    font-family: 'H-NotoSans-Regular';
   
    background-color: var(--bg-color);
    --bg-color: #ffffff;
    --main-color: #00A7CB;
    --main-color-opacity:#7AC6CB;
    
    --light-main-color:#E5F5F2;
    --btns-colr: #00A7CB;
    --text-color: #797C7F;
    --title-color: #222733;
    --secondary-color: #0E556C;
    --tab-bg:#D2D3D5;
    --section-color:#F9F9F9;
    --alt-bg-color: #DEF1F2;
    
    --shadow-1: 0 0 24px rgba(0, 153, 163, 0.24);
    --shadow-2: 0 0 40px rgba(14, 85, 108, 0.32);
    --shadow-3: 0 0 40px rgba(14, 85, 108, 0.16);
    --shadow-4: 0 0 16px rgba(14, 85, 108, 0.8);
    overflow-x: hidden;
}
/* section{
    overflow-x: hidden;
    overflow-y: auto;
} */
/*Padding*/
.py-80{
    padding: 80px 0;
}
.py-40{
    padding: 40px 0;
}
.pt-40{
    padding-top: 40px;
}
.mb-40{
    margin-bottom: 40px;
}
.mt-40{
    margin-top: 40px;
}
.mb-24{
    margin-bottom: 24px;
}
.mb-16{
    margin-bottom: 16px;
}
.mb-8{
    margin-bottom: 8px;
}
.pb-80{
    padding-bottom: 80px;
}
.p-40{
    padding: 40px;
}
.gallery-pad{
    padding: 8px 24px;
}
.gap-40{
    gap: 40px;
}
.gap-24{
    gap: 24px;
}
.gap-8{
    gap: 8px;
}
.gap-16{
    gap: 16px;
}
.text-gray{
    color: var(--text-color);
}
.title-color{
    color: var(--title-color);
}
.radius-8{
    border-radius: 8px;
}
.radius-50{
    border-radius: 50px;
}
.radius-16{
    border-radius: 16px;
}
.h-100{
    height: 80%;
}
.vh-100{
    height: 100vh;
}
.colored{
    color: var(--main-color);
}
.colored-white{
    color: var(--bg-color);
}

.btn-bck{
    background-color:var(--btns-colr);
}
.main-bck{
    background-color: var(--main-color);
}
.secondary-color{
    color: var(--secondary-color);
}
.bg-sec{
    background-color: var(--section-color);
}
.bg-gray{
    background-color: var(--tab-bg);
}
.z-1{
    z-index: 10;
}
.w-50{
    width: 50%;
}
.w-100{
    width: 100%;
}
.fz-22{
    font-size: 1.375rem;
}
.fz-20{
    font-size: 1.25rem;
}
.normal-lineheight{
    line-height: 27.24px;
}
.fw-normal{
    font-family: 'H-NotoSans-Regular';
}
.trans-3{
    transition: all 0.3s ease-in-out;
}
@media (min-width:1200px) {
    .h-lg-100{
        height: 100%;
    }
}
@media (max-width:992px) {
    .m-sm-auto{
        margin: auto;
    }
}