/* ---------------------------------------------------
Bootstrap Responsive Spacing
--------------------------------------------------- */
/* ---------------------------------------------------
margin-top
--------------------------------------------------- */
.mt-auto {
    margin-top: auto !important;
}

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

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mt-xs {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mt-xs {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mt-xs {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mt-xs {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mt-xs {
        margin-top: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mt-sm {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mt-sm {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mt-sm {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mt-sm {
        margin-top: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mt-sm {
        margin-top: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mt-md {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mt-md {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mt-md {
        margin-top: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mt-md {
        margin-top: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mt-md {
        margin-top: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mt-lg {
        margin-top: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mt-lg {
        margin-top: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mt-lg {
        margin-top: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mt-lg {
        margin-top: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mt-lg {
        margin-top: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mt-xl {
        margin-top: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mt-xl {
        margin-top: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mt-xl {
        margin-top: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mt-xl {
        margin-top: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mt-xl {
        margin-top: 144px !important;
    }
}

/* ---------------------------------------------------
margin-bottom
--------------------------------------------------- */
.mb-auto {
    margin-bottom: auto !important;
}

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

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mb-xs {
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mb-xs {
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mb-xs {
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mb-xs {
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mb-xs {
        margin-bottom: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mb-sm {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mb-sm {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mb-sm {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mb-sm {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mb-sm {
        margin-bottom: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mb-md {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mb-md {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mb-md {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mb-md {
        margin-bottom: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mb-md {
        margin-bottom: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mb-lg {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mb-lg {
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mb-lg {
        margin-bottom: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mb-lg {
        margin-bottom: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mb-lg {
        margin-bottom: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mb-xl {
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mb-xl {
        margin-bottom: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mb-xl {
        margin-bottom: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mb-xl {
        margin-bottom: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mb-xl {
        margin-bottom: 144px !important;
    }
}

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

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

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

.ml-xs {
    margin-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .ml-xs {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .ml-xs {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .ml-xs {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .ml-xs {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .ml-xs {
        margin-left: 12px !important;
    }
}

.ml-sm {
    margin-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .ml-sm {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .ml-sm {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .ml-sm {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .ml-sm {
        margin-left: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .ml-sm {
        margin-left: 24px !important;
    }
}

.ml-md {
    margin-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .ml-md {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .ml-md {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .ml-md {
        margin-left: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .ml-md {
        margin-left: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .ml-md {
        margin-left: 48px !important;
    }
}

.ml-lg {
    margin-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .ml-lg {
        margin-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .ml-lg {
        margin-left: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .ml-lg {
        margin-left: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .ml-lg {
        margin-left: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .ml-lg {
        margin-left: 96px !important;
    }
}

.ml-xl {
    margin-left: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .ml-xl {
        margin-left: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .ml-xl {
        margin-left: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .ml-xl {
        margin-left: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .ml-xl {
        margin-left: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .ml-xl {
        margin-left: 144px !important;
    }
}

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

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

.mr-xs {
    margin-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mr-xs {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mr-xs {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mr-xs {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mr-xs {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mr-xs {
        margin-right: 12px !important;
    }
}

.mr-sm {
    margin-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mr-sm {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mr-sm {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mr-sm {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mr-sm {
        margin-right: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mr-sm {
        margin-right: 24px !important;
    }
}

.mr-md {
    margin-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mr-md {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mr-md {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mr-md {
        margin-right: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mr-md {
        margin-right: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mr-md {
        margin-right: 48px !important;
    }
}

.mr-lg {
    margin-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mr-lg {
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mr-lg {
        margin-right: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mr-lg {
        margin-right: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mr-lg {
        margin-right: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mr-lg {
        margin-right: 96px !important;
    }
}

.mr-xl {
    margin-right: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mr-xl {
        margin-right: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mr-xl {
        margin-right: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mr-xl {
        margin-right: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mr-xl {
        margin-right: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mr-xl {
        margin-right: 144px !important;
    }
}

/* ---------------------------------------------------
margin-horizontal
--------------------------------------------------- */
.mx-auto {
    margin-left: auto !important;
    margin-right: auto !important;
}

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

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mx-xs {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mx-xs {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mx-xs {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mx-xs {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mx-xs {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mx-sm {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mx-sm {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mx-sm {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mx-sm {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mx-sm {
        margin-left: 24px !important;
        margin-right: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mx-md {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mx-md {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mx-md {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mx-md {
        margin-left: 24px !important;
        margin-right: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mx-md {
        margin-left: 48px !important;
        margin-right: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mx-lg {
        margin-left: 8px !important;
        margin-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mx-lg {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mx-lg {
        margin-left: 32px !important;
        margin-right: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mx-lg {
        margin-left: 48px !important;
        margin-right: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mx-lg {
        margin-left: 96px !important;
        margin-right: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .mx-xl {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .mx-xl {
        margin-left: 24px !important;
        margin-right: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .mx-xl {
        margin-left: 48px !important;
        margin-right: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .mx-xl {
        margin-left: 72px !important;
        margin-right: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .mx-xl {
        margin-left: 144px !important;
        margin-right: 144px !important;
    }
}

/* ---------------------------------------------------
margin-vertical
--------------------------------------------------- */
.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

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

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .my-xs {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .my-xs {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .my-xs {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .my-xs {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .my-xs {
        margin-top: 12px !important;
        margin-bottom: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .my-sm {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .my-sm {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .my-sm {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .my-sm {
        margin-top: 12px !important;
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .my-sm {
        margin-top: 24px !important;
        margin-bottom: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .my-md {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .my-md {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .my-md {
        margin-top: 16px !important;
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .my-md {
        margin-top: 24px !important;
        margin-bottom: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .my-md {
        margin-top: 48px !important;
        margin-bottom: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .my-lg {
        margin-top: 8px !important;
        margin-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .my-lg {
        margin-top: 16px !important;
        margin-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .my-lg {
        margin-top: 32px !important;
        margin-bottom: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .my-lg {
        margin-top: 48px !important;
        margin-bottom: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .my-lg {
        margin-top: 96px !important;
        margin-bottom: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .my-xl {
        margin-top: 12px !important;
        margin-bottom: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .my-xl {
        margin-top: 24px !important;
        margin-bottom: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .my-xl {
        margin-top: 48px !important;
        margin-bottom: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .my-xl {
        margin-top: 72px !important;
        margin-bottom: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .my-xl {
        margin-top: 144px !important;
        margin-bottom: 144px !important;
    }
}

/* ---------------------------------------------------
margin
--------------------------------------------------- */
.m-auto {
    margin: auto !important;
}

.m-0 {
    margin: 0 !important;
}

.m-xs {
    margin: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .m-xs {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .m-xs {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .m-xs {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .m-xs {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .m-xs {
        margin: 12px !important;
    }
}

.m-sm {
    margin: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .m-sm {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .m-sm {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .m-sm {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .m-sm {
        margin: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .m-sm {
        margin: 24px !important;
    }
}

.m-md {
    margin: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .m-md {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .m-md {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .m-md {
        margin: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .m-md {
        margin: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .m-md {
        margin: 48px !important;
    }
}

.m-lg {
    margin: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .m-lg {
        margin: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .m-lg {
        margin: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .m-lg {
        margin: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .m-lg {
        margin: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .m-lg {
        margin: 96px !important;
    }
}

.m-xl {
    margin: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .m-xl {
        margin: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .m-xl {
        margin: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .m-xl {
        margin: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .m-xl {
        margin: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .m-xl {
        margin: 144px !important;
    }
}

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

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

/* ****************************************************** */
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .pt-xs {
        padding-top: 8px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    .pt-xs {
        padding-top: 8px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .pt-xs {
        padding-top: 8px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .pt-xs {
        padding-top: 8px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .pt-xs {
        padding-top: 12px !important;
    }
}

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

/* ****************************************************** */
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .pt-sm {
        padding-top: 8px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    .pt-sm {
        padding-top: 8px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .pt-sm {
        padding-top: 8px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .pt-sm {
        padding-top: 12px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .pt-sm {
        padding-top: 24px !important;
    }
}

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

/* ****************************************************** */
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .pt-md {
        padding-top: 8px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    .pt-md {
        padding-top: 8px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .pt-md {
        padding-top: 16px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .pt-md {
        padding-top: 24px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .pt-md {
        padding-top: 48px !important;
    }
}

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

/* ****************************************************** */
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .pt-lg {
        padding-top: 80px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    .pt-lg {
        padding-top: 16px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .pt-lg {
        padding-top: 100px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .pt-lg {
        padding-top: 100px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .pt-lg {
        padding-top: 100px !important;
    }
}

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

/* ****************************************************** */
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
    .pt-xl {
        padding-top: 12px !important;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
    .pt-xl {
        padding-top: 24px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .pt-xl {
        padding-top: 48px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .pt-xl {
        padding-top: 72px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .pt-xl {
        padding-top: 144px !important;
    }
}

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

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pb-xs {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pb-xs {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pb-xs {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pb-xs {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pb-xs {
        padding-bottom: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pb-sm {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pb-sm {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pb-sm {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pb-sm {
        padding-bottom: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pb-sm {
        padding-bottom: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pb-md {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pb-md {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pb-md {
        padding-bottom: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pb-md {
        padding-bottom: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pb-md {
        padding-bottom: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pb-lg {
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pb-lg {
        padding-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pb-lg {
        padding-bottom: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pb-lg {
        padding-bottom: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pb-lg {
        padding-bottom: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pb-xl {
        padding-bottom: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pb-xl {
        padding-bottom: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pb-xl {
        padding-bottom: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pb-xl {
        padding-bottom: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pb-xl {
        padding-bottom: 144px !important;
    }
}

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

.pl-xs {
    padding-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pl-xs {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pl-xs {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pl-xs {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pl-xs {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pl-xs {
        padding-left: 12px !important;
    }
}

.pl-sm {
    padding-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pl-sm {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pl-sm {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pl-sm {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pl-sm {
        padding-left: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pl-sm {
        padding-left: 24px !important;
    }
}

.pl-md {
    padding-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pl-md {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pl-md {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pl-md {
        padding-left: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pl-md {
        padding-left: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pl-md {
        padding-left: 48px !important;
    }
}

.pl-lg {
    padding-left: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pl-lg {
        padding-left: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pl-lg {
        padding-left: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pl-lg {
        padding-left: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pl-lg {
        padding-left: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pl-lg {
        padding-left: 96px !important;
    }
}

.pl-xl {
    padding-left: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pl-xl {
        padding-left: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pl-xl {
        padding-left: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pl-xl {
        padding-left: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pl-xl {
        padding-left: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pl-xl {
        padding-left: 144px !important;
    }
}

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

.pr-xs {
    padding-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pr-xs {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pr-xs {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pr-xs {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pr-xs {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pr-xs {
        padding-right: 12px !important;
    }
}

.pr-sm {
    padding-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pr-sm {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pr-sm {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pr-sm {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pr-sm {
        padding-right: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pr-sm {
        padding-right: 24px !important;
    }
}

.pr-md {
    padding-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pr-md {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pr-md {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pr-md {
        padding-right: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pr-md {
        padding-right: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pr-md {
        padding-right: 48px !important;
    }
}

.pr-lg {
    padding-right: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pr-lg {
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pr-lg {
        padding-right: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pr-lg {
        padding-right: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pr-lg {
        padding-right: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pr-lg {
        padding-right: 96px !important;
    }
}

.pr-xl {
    padding-right: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .pr-xl {
        padding-right: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .pr-xl {
        padding-right: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .pr-xl {
        padding-right: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .pr-xl {
        padding-right: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .pr-xl {
        padding-right: 144px !important;
    }
}

/* ---------------------------------------------------
padding-horizontal
--------------------------------------------------- */
.px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .px-xs {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .px-xs {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .px-xs {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .px-xs {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .px-xs {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .px-sm {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .px-sm {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .px-sm {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .px-sm {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .px-sm {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .px-md {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .px-md {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .px-md {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .px-md {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .px-md {
        padding-left: 48px !important;
        padding-right: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .px-lg {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .px-lg {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .px-lg {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .px-lg {
        padding-left: 48px !important;
        padding-right: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .px-lg {
        padding-left: 96px !important;
        padding-right: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .px-xl {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .px-xl {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .px-xl {
        padding-left: 48px !important;
        padding-right: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .px-xl {
        padding-left: 72px !important;
        padding-right: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .px-xl {
        padding-left: 144px !important;
        padding-right: 144px !important;
    }
}

/* ---------------------------------------------------
padding-vertical
--------------------------------------------------- */
.py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .py-xs {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .py-xs {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .py-xs {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .py-xs {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .py-xs {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .py-sm {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .py-sm {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .py-sm {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .py-sm {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .py-sm {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .py-md {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .py-md {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .py-md {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .py-md {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .py-md {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .py-lg {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .py-lg {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .py-lg {
        padding-top: 32px !important;
        padding-bottom: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .py-lg {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .py-lg {
        padding-top: 96px !important;
        padding-bottom: 96px !important;
    }
}

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

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .py-xl {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .py-xl {
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .py-xl {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .py-xl {
        padding-top: 72px !important;
        padding-bottom: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .py-xl {
        padding-top: 144px !important;
        padding-bottom: 144px !important;
    }
}

/* ---------------------------------------------------
padding
--------------------------------------------------- */
.p-0 {
    padding: 0 !important;
}

.p-xs {
    padding: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .p-xs {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .p-xs {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .p-xs {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .p-xs {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .p-xs {
        padding: 12px !important;
    }
}

.p-sm {
    padding: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .p-sm {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .p-sm {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .p-sm {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 992px) {
    .p-sm {
        padding: 12px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .p-sm {
        padding: 24px !important;
    }
}

.p-md {
    padding: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .p-md {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .p-md {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 768px) {
    .p-md {
        padding: 16px !important;
    }
}

@media only screen and (min-width : 992px) {
    .p-md {
        padding: 24px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .p-md {
        padding: 48px !important;
    }
}

.p-lg {
    padding: 8px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .p-lg {
        padding: 8px !important;
    }
}

@media only screen and (min-width : 480px) {
    .p-lg {
        padding: 16px !important;
    }
}

@media only screen and (min-width : 768px) {
    .p-lg {
        padding: 32px !important;
    }
}

@media only screen and (min-width : 992px) {
    .p-lg {
        padding: 48px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .p-lg {
        padding: 96px !important;
    }
}

.p-xl {
    padding: 12px !important;
}

/* ****************************************************** */
@media only screen and (min-width : 320px) {
    .p-xl {
        padding: 12px !important;
    }
}

@media only screen and (min-width : 480px) {
    .p-xl {
        padding: 24px !important;
    }
}

@media only screen and (min-width : 768px) {
    .p-xl {
        padding: 48px !important;
    }
}

@media only screen and (min-width : 992px) {
    .p-xl {
        padding: 72px !important;
    }
}

@media only screen and (min-width : 1200px) {
    .p-xl {
        padding: 144px !important;
    }
}

/* ****************************************************** */
/** Eigene Classen **/
/* ****************************************************** */
.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

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

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

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}