/* v.1 */
/* Starter */
body{
    margin: 0;
}
div {
    box-sizing: border-box;
}
p, h1, h2, h3, h4, h5, h6{
    margin: 0;
}
/* Margin Classes */
.m_0 {
    margin: 0;
}
.m_5 {
    margin: 5px;
}
.m_10 {
    margin: 10px;
}
.m_15 {
    margin: 15px;
}
.m_20 {
    margin: 20px;
}

/* Margin Top Classes */
.mt_0 {
    margin-top: 0;
}
.mt_5 {
    margin-top: 5px;
}
.mt_10 {
    margin-top: 10px;
}
.mt_15 {
    margin-top: 15px;
}
.mt_20 {
    margin-top: 20px;
}

/* Margin Right Classes */
.mr_0 {
    margin-right: 0;
}
.mr_5 {
    margin-right: 5px;
}
.mr_10 {
    margin-right: 10px;
}
.mr_15 {
    margin-right: 15px;
}
.mr_20 {
    margin-right: 20px;
}

/* Margin Bottom Classes */
.mb_0 {
    margin-bottom: 0;
}
.mb_5 {
    margin-bottom: 5px;
}
.mb_10 {
    margin-bottom: 10px;
}
.mb_15 {
    margin-bottom: 15px;
}
.mb_20 {
    margin-bottom: 20px;
}
.mb_25 {
    margin-bottom: 25px;
}

/* Margin Left Classes */
.ml_0 {
    margin-left: 0;
}
.ml_5 {
    margin-left: 5px;
}
.ml_10 {
    margin-left: 10px;
}
.ml_15 {
    margin-left: 15px;
}
.ml_20 {
    margin-left: 20px;
}

/* Padding Classes */
.p_0 {
    padding: 0;
}
.p_5 {
    padding: 5px;
}
.p_10 {
    padding: 10px;
}
.p_15 {
    padding: 15px;
}
.p_20 {
    padding: 20px;
}

/* Padding Top Classes */
.pt_0 {
    padding-top: 0;
}
.pt_5 {
    padding-top: 5px;
}
.pt_10 {
    padding-top: 10px;
}
.pt_15 {
    padding-top: 15px;
}
.pt_20 {
    padding-top: 20px;
}

/* Padding Right Classes */
.pr_0 {
    padding-right: 0;
}
.pr_5 {
    padding-right: 5px;
}
.pr_10 {
    padding-right: 10px;
}
.pr_15 {
    padding-right: 15px;
}
.pr_20 {
    padding-right: 20px;
}

/* Padding Bottom Classes */
.pb_0 {
    padding-bottom: 0;
}
.pb_5 {
    padding-bottom: 5px;
}
.pb_10 {
    padding-bottom: 10px;
}
.pb_15 {
    padding-bottom: 15px;
}
.pb_20 {
    padding-bottom: 20px;
}

/* Padding Left Classes */
.pl_0 {
    padding-left: 0;
}
.pl_5 {
    padding-left: 5px;
}
.pl_10 {
    padding-left: 10px;
}
.pl_15 {
    padding-left: 15px;
}
.pl_20 {
    padding-left: 20px;
}
.pv_20{
    padding-top: 20px;
    padding-bottom: 20px;
}
.p_10_15{
    padding: 10px 15px;
}
.p_10_20{
    padding: 10px 20px;
}
.p_15_20{
    padding: 15px 20px;
}
.p_25_20{
    padding: 25px 20px;
}
.p_h_20{
    padding-left: 20px;
    padding-right: 20px;
}
.mv_10{
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}
.mv_20{
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}
.container{
    max-width: 1140px;
    margin: auto;
}
.w_20{
    width: 20%;
}
.w_30{
    width: 30%;
}
.w_50{
    width: 50%;
}
.w_70{
    width: 70%;
}
.w_full{
    width: 100%;
}
.relative{
    position: relative;
}
.flex{
    display: flex;
}
.flex_col{
    display: flex;
    flex-direction: column;
}
.wrap{
    flex-wrap: wrap;
}
.space-between{
    justify-content: space-between;
}
.center{
    text-align: center;
    justify-content: center;
    align-items: center;
}
.align_top{
    align-items: flex-start;
}
.align_bottom{
    align-items: flex-end;
}
.align_center{
    align-items: center;
}
.justify_center{
    justify-content: center;
}
.gap_0{
    gap:0 !important;
}
.gap_5{
    gap: 5px;
}
.gap_10{
    gap: 10px;
}
.gap_15{
    gap: 15px;
}
.gap_20{
    gap: 20px;
}

/* font Size */
.f_14 {
    font-size: 14px;
}

.f_16 {
    font-size: 16px;
}

.f_18 {
    font-size: 18px;
}

.f_20 {
    font-size: 20px;
}

.f_22 {
    font-size: 22px;
}

.f_24 {
    font-size: 24px;
}

.f_26 {
    font-size: 26px;
}

.f_28 {
    font-size: 28px;
}

.opacity_0{
    opacity: 0;
}
.bold{
    font-weight: 700;
}
.red{
    color: #D23535;
}
.green{
    color: #00B57A;
}
.statusBtn{
    padding: 25px;
    background-color: #F8AD25;
    border-radius: 10px;
}
.scroll{
    overflow: scroll;
}

/* responsiveness */
@media (max-width: 767px){
    .m_f_24px{
        font-size: 24px !important;
    }
    .m_f_15px{
        font-size: 15px !important;
        line-height: 1.5;
    }
    .flex_col_m{
        flex-direction: column;
    }
    .flex_col_rev_m{
        flex-direction: column-reverse;
    }
    .m_w_full{
        width: -webkit-fill-available !important;
    }
    .m_align_left{
        text-align: left;
    }
    .center_m{
        justify-content: center;
        text-align: center;
        align-items: center;
    }
    .gap_0_m{
        gap: 0;
    }
    .gap_10_m{
        gap: 10px;
    }
    .mr_20_m{
        margin-right: 20px;
    }
    .m_0_m{
        margin: 0;
    }
    .p_0_m{
        padding: 0 !important;
    }
}
/* End Starter */