/*

    CSS Helpers

*/

/* Borders */

.border-1 {
    border: 1px solid #000000;
}

.border-2 {
    border: 2px solid #000000;
}

.border-3 {
    border: 3px solid #000000;
}

/* Top Margin */

.mt-0, .margin-top-0 {
    margin-top: 0 !important;
}

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

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

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

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

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

/* Bottom Margin */

.mb-0, .margin-bottom-0 {
    margin-bottom: 0 !important;
}

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

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

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

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

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

/* Left Margin */

.ml-auto, .margin-left-auto {
    margin-left: auto !important;
}

.ml-0, .margin-left-0 {
    margin-left: 0 !important;
}

.ml-5, .margin-left-5 {
    margin-left: 5px !important;
}

.ml-10, .margin-left-10 {
    margin-left: 10px !important;
}

.ml-15, .margin-left-15 {
    margin-left: 15px !important;
}

.ml-20, .margin-left-20 {
    margin-left: 20px !important;
}

.ml-30, .margin-left-30 {
    margin-left: 30px !important;
}

/* Right Margin */

.mr-auto, .margin-right-auto {
    margin-right: auto !important;
}

.mr-0, .margin-right-0 {
    margin-right: 0 !important;
}

.mr-5, .margin-right-5 {
    margin-right: 5px !important;
}

.mr-10, .margin-right-10 {
    margin-right: 10px !important;
}

.mr-15, .margin-right-15 {
    margin-right: 15px !important;
}

.mr-20, .margin-right-20 {
    margin-right: 20px !important;
}

.mr-30, .margin-right-30 {
    margin-right: 30px !important;
}

/* Top Padding */

.pt-0, .padding-top-0 {
    padding-top: 0 !important;
}

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

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

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

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

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

/* Bottom Padding */

.pb-0, .padding-bottom-0 {
    padding-bottom: 0 !important;
}

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

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

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

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

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

/* Left Padding */

.pl-0, .padding-left-0 {
    padding-left: 0 !important;
}

.pl-5, .padding-left-5 {
    padding-left: 5px !important;
}

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

.pl-15, .padding-left-15 {
    padding-left: 15px !important;
}

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

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

/* Right Padding */

.pr-0, .padding-right-0 {
    padding-right: 0 !important;
}

.pr-5, .padding-right-5 {
    padding-right: 5px !important;
}

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

.pr-15, .padding-right-15 {
    padding-right: 15px !important;
}

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

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

/* Special Cases */

@media only screen and (max-width: 768px) {

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

}