/* Bootstrap 4-style auto-sizing columns for Bootstrap 3 */

.pl-15 {
    padding-left: 15px !important;
}
.pr-15 {
    padding-right: 15px !important;
}
/* .col-auto - Auto-width column based on content */
.col-auto {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
}

/* .col - Equal-width flexible column */
.col {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
}

/* .col-6 - Half-width column */
.col-6 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    width: 50%;
    float: left;
}

/* .col-12 - Full-width column */
.col-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    width: 100%;
    float: left;
}

/* .col-none - Hide column */
.col-none {
    display: none !important;
}

/* Display utility - Hide element */
.d-none {
    display: none !important;
}

/* Flexbox utilities */
.flex-wrap {
    flex-wrap: wrap !important;
}
.flex-nowrap {
    flex-wrap: nowrap !important;
}

/* Padding utilities */
.p-0 { padding: 0 !important; }
.p-1 { padding: 0.25rem !important; }
.p-2 { padding: 0.5rem !important; }
.p-3 { padding: 1rem !important; }
.p-4 { padding: 1.5rem !important; }
.p-5 { padding: 3rem !important; }
.p-15 { padding: 15px !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pt-5 { padding-top: 3rem !important; }
.pt-15 { padding-top: 15px !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pb-5 { padding-bottom: 3rem !important; }
.pb-15 { padding-bottom: 15px !important; }

.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: 0.25rem !important; }
.pl-2 { padding-left: 0.5rem !important; }
.pl-3 { padding-left: 1rem !important; }
.pl-4 { padding-left: 1.5rem !important; }
.pl-5 { padding-left: 3rem !important; }
.pl-15 { padding-left: 15px !important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: 0.25rem !important; }
.pr-2 { padding-right: 0.5rem !important; }
.pr-3 { padding-right: 1rem !important; }
.pr-4 { padding-right: 1.5rem !important; }
.pr-5 { padding-right: 3rem !important; }
.pr-15 { padding-right: 15px !important; }

.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.px-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
.px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
.px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.px-5 { padding-left: 3rem !important; padding-right: 3rem !important; }
.px-15 { padding-left: 15px !important; padding-right: 15px !important; }

.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.py-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
.py-15 { padding-top: 15px !important; padding-bottom: 15px !important; }

/* Small screens and up (≥768px) */
@media (min-width: 768px) {
    .col-sm-auto {
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
}

/* Medium screens and up (≥992px) */
@media (min-width: 992px) {
    .col-md-auto {
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
    .col-md-block {
        display: block !important;
    }
    .d-md-block {
        display: block !important;
    }
    .flex-wrap-md {
        flex-wrap: wrap !important;
    }
    .flex-md-nowrap {
        flex-wrap: nowrap !important;
    }

    /* Medium screen padding utilities */
    .p-md-0 { padding: 0 !important; }
    .p-md-1 { padding: 0.25rem !important; }
    .p-md-2 { padding: 0.5rem !important; }
    .p-md-3 { padding: 1rem !important; }
    .p-md-4 { padding: 1.5rem !important; }
    .p-md-5 { padding: 3rem !important; }
    .p-md-15 { padding: 15px !important; }

    .pt-md-0 { padding-top: 0 !important; }
    .pt-md-1 { padding-top: 0.25rem !important; }
    .pt-md-2 { padding-top: 0.5rem !important; }
    .pt-md-3 { padding-top: 1rem !important; }
    .pt-md-4 { padding-top: 1.5rem !important; }
    .pt-md-5 { padding-top: 3rem !important; }
    .pt-md-15 { padding-top: 15px !important; }

    .pb-md-0 { padding-bottom: 0 !important; }
    .pb-md-1 { padding-bottom: 0.25rem !important; }
    .pb-md-2 { padding-bottom: 0.5rem !important; }
    .pb-md-3 { padding-bottom: 1rem !important; }
    .pb-md-4 { padding-bottom: 1.5rem !important; }
    .pb-md-5 { padding-bottom: 3rem !important; }
    .pb-md-15 { padding-bottom: 15px !important; }

    .pl-md-0 { padding-left: 0 !important; }
    .pl-md-1 { padding-left: 0.25rem !important; }
    .pl-md-2 { padding-left: 0.5rem !important; }
    .pl-md-3 { padding-left: 1rem !important; }
    .pl-md-4 { padding-left: 1.5rem !important; }
    .pl-md-5 { padding-left: 3rem !important; }
    .pl-md-15 { padding-left: 15px !important; }

    .pr-md-0 { padding-right: 0 !important; }
    .pr-md-1 { padding-right: 0.25rem !important; }
    .pr-md-2 { padding-right: 0.5rem !important; }
    .pr-md-3 { padding-right: 1rem !important; }
    .pr-md-4 { padding-right: 1.5rem !important; }
    .pr-md-5 { padding-right: 3rem !important; }
    .pr-md-15 { padding-right: 15px !important; }

    .px-md-0 { padding-left: 0 !important; padding-right: 0 !important; }
    .px-md-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
    .px-md-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
    .px-md-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
    .px-md-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
    .px-md-5 { padding-left: 3rem !important; padding-right: 3rem !important; }
    .px-md-15 { padding-left: 15px !important; padding-right: 15px !important; }

    .py-md-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
    .py-md-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
    .py-md-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
    .py-md-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
    .py-md-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
    .py-md-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
    .py-md-15 { padding-top: 15px !important; padding-bottom: 15px !important; }

    .col-md-20p {
        width: 20%;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        float: left;
    }

    .col-md-80p {
        width: 80%;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        float: left;
    }
}

/* Large screens and up (≥1200px) */
@media (min-width: 1200px) {
    .col-lg-auto {
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: 100%;
    }
}