/* =====================================================
   Bootstrap Custom Utilities
   Replacement for Unify g-* utilities
   ===================================================== */


/* ---------------------------
   Padding utilities
   --------------------------- */

.p-10 {
    padding: 10px !important;
}

.p-20 {
    padding: 20px !important;
}

.p-30 {
    padding: 30px !important;
}


.pt-10 {
    padding-top: 10px !important;
}

.pt-20 {
    padding-top: 20px !important;
}

.pt-30 {
    padding-top: 30px !important;
}


.pb-10 {
    padding-bottom: 10px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.pb-30 {
    padding-bottom: 30px !important;
}


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

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

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


.py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
}



/* ---------------------------
   Margin utilities
   --------------------------- */

.m-10 {
    margin:10px !important;
}

.m-20 {
    margin:20px !important;
}

.m-30 {
    margin:30px !important;
}


.mt-10 {
    margin-top:10px !important;
}

.mt-20 {
    margin-top:20px !important;
}

.mt-30 {
    margin-top:30px !important;
}


.mb-10 {
    margin-bottom:10px !important;
}

.mb-20 {
    margin-bottom:20px !important;
}

.mb-30 {
    margin-bottom:30px !important;
}


.mx-20 {
    margin-left:20px !important;
    margin-right:20px !important;
}


.my-20 {
    margin-top:20px !important;
    margin-bottom:20px !important;
}



/* ---------------------------
   Responsive padding
   --------------------------- */

@media (min-width:768px) {

    .py-md-20 {
        padding-top:20px !important;
        padding-bottom:20px !important;
    }

    .px-md-20 {
        padding-left:20px !important;
        padding-right:20px !important;
    }

    .mt-md-20 {
        margin-top:20px !important;
    }

}


@media (min-width:992px) {

    .py-lg-30 {
        padding-top:30px !important;
        padding-bottom:30px !important;
    }

    .px-lg-30 {
        padding-left:30px !important;
        padding-right:30px !important;
    }

}



/* ---------------------------
   Font size utilities
   --------------------------- */

.fs-13 {
    font-size:13px !important;
}

.fs-16 {
    font-size:16px !important;
}

.fs-18 {
    font-size:18px !important;
}

.fs-20 {
    font-size:20px !important;
}

.fs-25 {
    font-size:25px !important;
}

.fs-30 {
    font-size:30px !important;
}


@media(min-width:768px){

    .fs-md-25 {
        font-size:25px !important;
    }

    .fs-md-30 {
        font-size:30px !important;
    }

}



/* ---------------------------
   Font weight
   --------------------------- */

.fw-400 {
    font-weight:400 !important;
}

.fw-500 {
    font-weight:500 !important;
}

.fw-600 {
    font-weight:600 !important;
}

.fw-700 {
    font-weight:700 !important;
}



/* ---------------------------
   Position helpers
   --------------------------- */

.position-relative {
    position:relative !important;
}

.position-absolute {
    position:absolute !important;
}


.top-0 {
    top:0 !important;
}

.start-0 {
    left:0 !important;
}



/* ---------------------------
   Border radius
   --------------------------- */

.rounded-10 {
    border-radius:10px !important;
}

.rounded-20 {
    border-radius:20px !important;
}



/* ---------------------------
   Width helpers
   --------------------------- */

.w-90 {
    width:90% !important;
}

.w-95 {
    width:95% !important;
}