/* Bootstrap 4 'table alignment' utility classes*/

.align-baseline {
    vertical-align: baseline !important;
}

.align-top {
    vertical-align: top !important;
}

.align-middle {
    vertical-align: middle !important;
}

.align-bottom {
    vertical-align: bottom !important;
}

.align-text-bottom {
    vertical-align: text-bottom !important;
}
.align-text-top {
    vertical-align: text-top !important;
}


/* Bootstrap 4 "Spacing", padding and margin selectors */
.m-0 {
    margin: 0 !important;
}

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

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

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

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

.m-1 {
    margin: 0.25rem !important;
}

.mt-1,
.my-1 {
    margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
    margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
    margin-left: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.mt-2,
.my-2 {
    margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
    margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
    margin-left: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.mt-3,
.my-3 {
    margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
    margin-right: 1rem !important;
}

.mb-3,
.my-3 {
    margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
    margin-left: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.mt-4,
.my-4 {
    margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
    margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
    margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
    margin-left: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.mt-5,
.my-5 {
    margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
    margin-right: 3rem !important;
}

.mb-5,
.my-5 {
    margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
    margin-left: 3rem !important;
}

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

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

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

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

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

.p-1 {
    padding: 0.25rem !important;
}

.pt-1,
.py-1 {
    padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
    padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
    padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
    padding-left: 0.25rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.pt-2,
.py-2 {
    padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
    padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
    padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
    padding-left: 0.5rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.pt-3,
.py-3 {
    padding-top: 1rem !important;
}

.pr-3,
.px-3 {
    padding-right: 1rem !important;
}

.pb-3,
.py-3 {
    padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
    padding-left: 1rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.pt-4,
.py-4 {
    padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
    padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
    padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
    padding-left: 1.5rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.pt-5,
.py-5 {
    padding-top: 3rem !important;
}

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

.pb-5,
.py-5 {
    padding-bottom: 3rem !important;
}

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

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

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

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

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

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

@media (min-width: 768px) {
    .m-sm-0 {
        margin: 0 !important;
    }

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

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

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

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

    .m-sm-1 {
        margin: 0.25rem !important;
    }

    .mt-sm-1,
    .my-sm-1 {
        margin-top: 0.25rem !important;
    }

    .mr-sm-1,
    .mx-sm-1 {
        margin-right: 0.25rem !important;
    }

    .mb-sm-1,
    .my-sm-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-sm-1,
    .mx-sm-1 {
        margin-left: 0.25rem !important;
    }

    .m-sm-2 {
        margin: 0.5rem !important;
    }

    .mt-sm-2,
    .my-sm-2 {
        margin-top: 0.5rem !important;
    }

    .mr-sm-2,
    .mx-sm-2 {
        margin-right: 0.5rem !important;
    }

    .mb-sm-2,
    .my-sm-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-sm-2,
    .mx-sm-2 {
        margin-left: 0.5rem !important;
    }

    .m-sm-3 {
        margin: 1rem !important;
    }

    .mt-sm-3,
    .my-sm-3 {
        margin-top: 1rem !important;
    }

    .mr-sm-3,
    .mx-sm-3 {
        margin-right: 1rem !important;
    }

    .mb-sm-3,
    .my-sm-3 {
        margin-bottom: 1rem !important;
    }

    .ml-sm-3,
    .mx-sm-3 {
        margin-left: 1rem !important;
    }

    .m-sm-4 {
        margin: 1.5rem !important;
    }

    .mt-sm-4,
    .my-sm-4 {
        margin-top: 1.5rem !important;
    }

    .mr-sm-4,
    .mx-sm-4 {
        margin-right: 1.5rem !important;
    }

    .mb-sm-4,
    .my-sm-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-sm-4,
    .mx-sm-4 {
        margin-left: 1.5rem !important;
    }

    .m-sm-5 {
        margin: 3rem !important;
    }

    .mt-sm-5,
    .my-sm-5 {
        margin-top: 3rem !important;
    }

    .mr-sm-5,
    .mx-sm-5 {
        margin-right: 3rem !important;
    }

    .mb-sm-5,
    .my-sm-5 {
        margin-bottom: 3rem !important;
    }

    .ml-sm-5,
    .mx-sm-5 {
        margin-left: 3rem !important;
    }

    .p-sm-0 {
        padding: 0 !important;
    }

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

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

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

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

    .p-sm-1 {
        padding: 0.25rem !important;
    }

    .pt-sm-1,
    .py-sm-1 {
        padding-top: 0.25rem !important;
    }

    .pr-sm-1,
    .px-sm-1 {
        padding-right: 0.25rem !important;
    }

    .pb-sm-1,
    .py-sm-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-sm-1,
    .px-sm-1 {
        padding-left: 0.25rem !important;
    }

    .p-sm-2 {
        padding: 0.5rem !important;
    }

    .pt-sm-2,
    .py-sm-2 {
        padding-top: 0.5rem !important;
    }

    .pr-sm-2,
    .px-sm-2 {
        padding-right: 0.5rem !important;
    }

    .pb-sm-2,
    .py-sm-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-sm-2,
    .px-sm-2 {
        padding-left: 0.5rem !important;
    }

    .p-sm-3 {
        padding: 1rem !important;
    }

    .pt-sm-3,
    .py-sm-3 {
        padding-top: 1rem !important;
    }

    .pr-sm-3,
    .px-sm-3 {
        padding-right: 1rem !important;
    }

    .pb-sm-3,
    .py-sm-3 {
        padding-bottom: 1rem !important;
    }

    .pl-sm-3,
    .px-sm-3 {
        padding-left: 1rem !important;
    }

    .p-sm-4 {
        padding: 1.5rem !important;
    }

    .pt-sm-4,
    .py-sm-4 {
        padding-top: 1.5rem !important;
    }

    .pr-sm-4,
    .px-sm-4 {
        padding-right: 1.5rem !important;
    }

    .pb-sm-4,
    .py-sm-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-sm-4,
    .px-sm-4 {
        padding-left: 1.5rem !important;
    }

    .p-sm-5 {
        padding: 3rem !important;
    }

    .pt-sm-5,
    .py-sm-5 {
        padding-top: 3rem !important;
    }

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

    .pb-sm-5,
    .py-sm-5 {
        padding-bottom: 3rem !important;
    }

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

    .m-sm-auto {
        margin: auto !important;
    }

    .mt-sm-auto,
    .my-sm-auto {
        margin-top: auto !important;
    }

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

    .mb-sm-auto,
    .my-sm-auto {
        margin-bottom: auto !important;
    }

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

@media (min-width: 992px) {
    .m-md-0 {
        margin: 0 !important;
    }

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

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

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

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

    .m-md-1 {
        margin: 0.25rem !important;
    }

    .mt-md-1,
    .my-md-1 {
        margin-top: 0.25rem !important;
    }

    .mr-md-1,
    .mx-md-1 {
        margin-right: 0.25rem !important;
    }

    .mb-md-1,
    .my-md-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-md-1,
    .mx-md-1 {
        margin-left: 0.25rem !important;
    }

    .m-md-2 {
        margin: 0.5rem !important;
    }

    .mt-md-2,
    .my-md-2 {
        margin-top: 0.5rem !important;
    }

    .mr-md-2,
    .mx-md-2 {
        margin-right: 0.5rem !important;
    }

    .mb-md-2,
    .my-md-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-md-2,
    .mx-md-2 {
        margin-left: 0.5rem !important;
    }

    .m-md-3 {
        margin: 1rem !important;
    }

    .mt-md-3,
    .my-md-3 {
        margin-top: 1rem !important;
    }

    .mr-md-3,
    .mx-md-3 {
        margin-right: 1rem !important;
    }

    .mb-md-3,
    .my-md-3 {
        margin-bottom: 1rem !important;
    }

    .ml-md-3,
    .mx-md-3 {
        margin-left: 1rem !important;
    }

    .m-md-4 {
        margin: 1.5rem !important;
    }

    .mt-md-4,
    .my-md-4 {
        margin-top: 1.5rem !important;
    }

    .mr-md-4,
    .mx-md-4 {
        margin-right: 1.5rem !important;
    }

    .mb-md-4,
    .my-md-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-md-4,
    .mx-md-4 {
        margin-left: 1.5rem !important;
    }

    .m-md-5 {
        margin: 3rem !important;
    }

    .mt-md-5,
    .my-md-5 {
        margin-top: 3rem !important;
    }

    .mr-md-5,
    .mx-md-5 {
        margin-right: 3rem !important;
    }

    .mb-md-5,
    .my-md-5 {
        margin-bottom: 3rem !important;
    }

    .ml-md-5,
    .mx-md-5 {
        margin-left: 3rem !important;
    }

    .p-md-0 {
        padding: 0 !important;
    }

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

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

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

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

    .p-md-1 {
        padding: 0.25rem !important;
    }

    .pt-md-1,
    .py-md-1 {
        padding-top: 0.25rem !important;
    }

    .pr-md-1,
    .px-md-1 {
        padding-right: 0.25rem !important;
    }

    .pb-md-1,
    .py-md-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-md-1,
    .px-md-1 {
        padding-left: 0.25rem !important;
    }

    .p-md-2 {
        padding: 0.5rem !important;
    }

    .pt-md-2,
    .py-md-2 {
        padding-top: 0.5rem !important;
    }

    .pr-md-2,
    .px-md-2 {
        padding-right: 0.5rem !important;
    }

    .pb-md-2,
    .py-md-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-md-2,
    .px-md-2 {
        padding-left: 0.5rem !important;
    }

    .p-md-3 {
        padding: 1rem !important;
    }

    .pt-md-3,
    .py-md-3 {
        padding-top: 1rem !important;
    }

    .pr-md-3,
    .px-md-3 {
        padding-right: 1rem !important;
    }

    .pb-md-3,
    .py-md-3 {
        padding-bottom: 1rem !important;
    }

    .pl-md-3,
    .px-md-3 {
        padding-left: 1rem !important;
    }

    .p-md-4 {
        padding: 1.5rem !important;
    }

    .pt-md-4,
    .py-md-4 {
        padding-top: 1.5rem !important;
    }

    .pr-md-4,
    .px-md-4 {
        padding-right: 1.5rem !important;
    }

    .pb-md-4,
    .py-md-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-md-4,
    .px-md-4 {
        padding-left: 1.5rem !important;
    }

    .p-md-5 {
        padding: 3rem !important;
    }

    .pt-md-5,
    .py-md-5 {
        padding-top: 3rem !important;
    }

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

    .pb-md-5,
    .py-md-5 {
        padding-bottom: 3rem !important;
    }

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

    .m-md-auto {
        margin: auto !important;
    }

    .mt-md-auto,
    .my-md-auto {
        margin-top: auto !important;
    }

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

    .mb-md-auto,
    .my-md-auto {
        margin-bottom: auto !important;
    }

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

@media (min-width: 1200px) {
    .m-lg-0 {
        margin: 0 !important;
    }

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

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

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

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

    .m-lg-1 {
        margin: 0.25rem !important;
    }

    .mt-lg-1,
    .my-lg-1 {
        margin-top: 0.25rem !important;
    }

    .mr-lg-1,
    .mx-lg-1 {
        margin-right: 0.25rem !important;
    }

    .mb-lg-1,
    .my-lg-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-lg-1,
    .mx-lg-1 {
        margin-left: 0.25rem !important;
    }

    .m-lg-2 {
        margin: 0.5rem !important;
    }

    .mt-lg-2,
    .my-lg-2 {
        margin-top: 0.5rem !important;
    }

    .mr-lg-2,
    .mx-lg-2 {
        margin-right: 0.5rem !important;
    }

    .mb-lg-2,
    .my-lg-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-lg-2,
    .mx-lg-2 {
        margin-left: 0.5rem !important;
    }

    .m-lg-3 {
        margin: 1rem !important;
    }

    .mt-lg-3,
    .my-lg-3 {
        margin-top: 1rem !important;
    }

    .mr-lg-3,
    .mx-lg-3 {
        margin-right: 1rem !important;
    }

    .mb-lg-3,
    .my-lg-3 {
        margin-bottom: 1rem !important;
    }

    .ml-lg-3,
    .mx-lg-3 {
        margin-left: 1rem !important;
    }

    .m-lg-4 {
        margin: 1.5rem !important;
    }

    .mt-lg-4,
    .my-lg-4 {
        margin-top: 1.5rem !important;
    }

    .mr-lg-4,
    .mx-lg-4 {
        margin-right: 1.5rem !important;
    }

    .mb-lg-4,
    .my-lg-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-lg-4,
    .mx-lg-4 {
        margin-left: 1.5rem !important;
    }

    .m-lg-5 {
        margin: 3rem !important;
    }

    .mt-lg-5,
    .my-lg-5 {
        margin-top: 3rem !important;
    }

    .mr-lg-5,
    .mx-lg-5 {
        margin-right: 3rem !important;
    }

    .mb-lg-5,
    .my-lg-5 {
        margin-bottom: 3rem !important;
    }

    .ml-lg-5,
    .mx-lg-5 {
        margin-left: 3rem !important;
    }

    .p-lg-0 {
        padding: 0 !important;
    }

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

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

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

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

    .p-lg-1 {
        padding: 0.25rem !important;
    }

    .pt-lg-1,
    .py-lg-1 {
        padding-top: 0.25rem !important;
    }

    .pr-lg-1,
    .px-lg-1 {
        padding-right: 0.25rem !important;
    }

    .pb-lg-1,
    .py-lg-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-lg-1,
    .px-lg-1 {
        padding-left: 0.25rem !important;
    }

    .p-lg-2 {
        padding: 0.5rem !important;
    }

    .pt-lg-2,
    .py-lg-2 {
        padding-top: 0.5rem !important;
    }

    .pr-lg-2,
    .px-lg-2 {
        padding-right: 0.5rem !important;
    }

    .pb-lg-2,
    .py-lg-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-lg-2,
    .px-lg-2 {
        padding-left: 0.5rem !important;
    }

    .p-lg-3 {
        padding: 1rem !important;
    }

    .pt-lg-3,
    .py-lg-3 {
        padding-top: 1rem !important;
    }

    .pr-lg-3,
    .px-lg-3 {
        padding-right: 1rem !important;
    }

    .pb-lg-3,
    .py-lg-3 {
        padding-bottom: 1rem !important;
    }

    .pl-lg-3,
    .px-lg-3 {
        padding-left: 1rem !important;
    }

    .p-lg-4 {
        padding: 1.5rem !important;
    }

    .pt-lg-4,
    .py-lg-4 {
        padding-top: 1.5rem !important;
    }

    .pr-lg-4,
    .px-lg-4 {
        padding-right: 1.5rem !important;
    }

    .pb-lg-4,
    .py-lg-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-lg-4,
    .px-lg-4 {
        padding-left: 1.5rem !important;
    }

    .p-lg-5 {
        padding: 3rem !important;
    }

    .pt-lg-5,
    .py-lg-5 {
        padding-top: 3rem !important;
    }

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

    .pb-lg-5,
    .py-lg-5 {
        padding-bottom: 3rem !important;
    }

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

    .m-lg-auto {
        margin: auto !important;
    }

    .mt-lg-auto,
    .my-lg-auto {
        margin-top: auto !important;
    }

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

    .mb-lg-auto,
    .my-lg-auto {
        margin-bottom: auto !important;
    }

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

/* Bootstrap 4 Flex Utility Classes */

.d-flex {
    display: flex !important;
}

.flex-row {
    flex-direction: row !important;
}

.flex-column {
    flex-direction: column !important;
}

.flex-row-reverse {
    flex-direction: row-reverse !important;
}

.flex-column-reverse {
    flex-direction: column-reverse !important;
}

.flex-wrap {
    flex-wrap: wrap !important;
}

.flex-nowrap {
    flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
    flex-wrap: wrap-reverse !important;
}

.flex-fill {
    flex: 1 1 auto !important;
}

.flex-grow-0 {
    flex-grow: 0 !important;
}

.flex-grow-1 {
    flex-grow: 1 !important;
}

.flex-shrink-0 {
    flex-shrink: 0 !important;
}

.flex-shrink-1 {
    flex-shrink: 1 !important;
}

.justify-content-start {
    justify-content: flex-start !important;
}

.justify-content-end {
    justify-content: flex-end !important;
}

.justify-content-center {
    justify-content: center !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

.justify-content-around {
    justify-content: space-around !important;
}

.align-items-start {
    align-items: flex-start !important;
}

.align-items-end {
    align-items: flex-end !important;
}

.align-items-center {
    align-items: center !important;
}

.align-items-baseline {
    align-items: baseline !important;
}

.align-items-stretch {
    align-items: stretch !important;
}

.align-content-start {
    align-content: flex-start !important;
}

.align-content-end {
    align-content: flex-end !important;
}

.align-content-center {
    align-content: center !important;
}

.align-content-between {
    align-content: space-between !important;
}

.align-content-around {
    align-content: space-around !important;
}

.align-content-stretch {
    align-content: stretch !important;
}

.align-self-auto {
    align-self: auto !important;
}

.align-self-start {
    align-self: flex-start !important;
}

.align-self-end {
    align-self: flex-end !important;
}

.align-self-center {
    align-self: center !important;
}

.align-self-baseline {
    align-self: baseline !important;
}

.align-self-stretch {
    align-self: stretch !important;
}

@media (min-width: 576px) {
    .flex-sm-row {
        flex-direction: row !important;
    }

    .flex-sm-column {
        flex-direction: column !important;
    }

    .flex-sm-row-reverse {
        flex-direction: row-reverse !important;
    }

    .flex-sm-column-reverse {
        flex-direction: column-reverse !important;
    }

    .flex-sm-wrap {
        flex-wrap: wrap !important;
    }

    .flex-sm-nowrap {
        flex-wrap: nowrap !important;
    }

    .flex-sm-wrap-reverse {
        flex-wrap: wrap-reverse !important;
    }

    .flex-sm-fill {
        flex: 1 1 auto !important;
    }

    .flex-sm-grow-0 {
        flex-grow: 0 !important;
    }

    .flex-sm-grow-1 {
        flex-grow: 1 !important;
    }

    .flex-sm-shrink-0 {
        flex-shrink: 0 !important;
    }

    .flex-sm-shrink-1 {
        flex-shrink: 1 !important;
    }

    .justify-content-sm-start {
        justify-content: flex-start !important;
    }

    .justify-content-sm-end {
        justify-content: flex-end !important;
    }

    .justify-content-sm-center {
        justify-content: center !important;
    }

    .justify-content-sm-between {
        justify-content: space-between !important;
    }

    .justify-content-sm-around {
        justify-content: space-around !important;
    }

    .align-items-sm-start {
        align-items: flex-start !important;
    }

    .align-items-sm-end {
        align-items: flex-end !important;
    }

    .align-items-sm-center {
        align-items: center !important;
    }

    .align-items-sm-baseline {
        align-items: baseline !important;
    }

    .align-items-sm-stretch {
        align-items: stretch !important;
    }

    .align-content-sm-start {
        align-content: flex-start !important;
    }

    .align-content-sm-end {
        align-content: flex-end !important;
    }

    .align-content-sm-center {
        align-content: center !important;
    }

    .align-content-sm-between {
        align-content: space-between !important;
    }

    .align-content-sm-around {
        align-content: space-around !important;
    }

    .align-content-sm-stretch {
        align-content: stretch !important;
    }

    .align-self-sm-auto {
        align-self: auto !important;
    }

    .align-self-sm-start {
        align-self: flex-start !important;
    }

    .align-self-sm-end {
        align-self: flex-end !important;
    }

    .align-self-sm-center {
        align-self: center !important;
    }

    .align-self-sm-baseline {
        align-self: baseline !important;
    }

    .align-self-sm-stretch {
        align-self: stretch !important;
    }
}

@media (min-width: 768px) {
    .flex-md-row {
        flex-direction: row !important;
    }

    .flex-md-column {
        flex-direction: column !important;
    }

    .flex-md-row-reverse {
        flex-direction: row-reverse !important;
    }

    .flex-md-column-reverse {
        flex-direction: column-reverse !important;
    }

    .flex-md-wrap {
        flex-wrap: wrap !important;
    }

    .flex-md-nowrap {
        flex-wrap: nowrap !important;
    }

    .flex-md-wrap-reverse {
        flex-wrap: wrap-reverse !important;
    }

    .flex-md-fill {
        flex: 1 1 auto !important;
    }

    .flex-md-grow-0 {
        flex-grow: 0 !important;
    }

    .flex-md-grow-1 {
        flex-grow: 1 !important;
    }

    .flex-md-shrink-0 {
        flex-shrink: 0 !important;
    }

    .flex-md-shrink-1 {
        flex-shrink: 1 !important;
    }

    .justify-content-md-start {
        justify-content: flex-start !important;
    }

    .justify-content-md-end {
        justify-content: flex-end !important;
    }

    .justify-content-md-center {
        justify-content: center !important;
    }

    .justify-content-md-between {
        justify-content: space-between !important;
    }

    .justify-content-md-around {
        justify-content: space-around !important;
    }

    .align-items-md-start {
        align-items: flex-start !important;
    }

    .align-items-md-end {
        align-items: flex-end !important;
    }

    .align-items-md-center {
        align-items: center !important;
    }

    .align-items-md-baseline {
        align-items: baseline !important;
    }

    .align-items-md-stretch {
        align-items: stretch !important;
    }

    .align-content-md-start {
        align-content: flex-start !important;
    }

    .align-content-md-end {
        align-content: flex-end !important;
    }

    .align-content-md-center {
        align-content: center !important;
    }

    .align-content-md-between {
        align-content: space-between !important;
    }

    .align-content-md-around {
        align-content: space-around !important;
    }

    .align-content-md-stretch {
        align-content: stretch !important;
    }

    .align-self-md-auto {
        align-self: auto !important;
    }

    .align-self-md-start {
        align-self: flex-start !important;
    }

    .align-self-md-end {
        align-self: flex-end !important;
    }

    .align-self-md-center {
        align-self: center !important;
    }

    .align-self-md-baseline {
        align-self: baseline !important;
    }

    .align-self-md-stretch {
        align-self: stretch !important;
    }
}

@media (min-width: 992px) {
    .flex-lg-row {
        flex-direction: row !important;
    }

    .flex-lg-column {
        flex-direction: column !important;
    }

    .flex-lg-row-reverse {
        flex-direction: row-reverse !important;
    }

    .flex-lg-column-reverse {
        flex-direction: column-reverse !important;
    }

    .flex-lg-wrap {
        flex-wrap: wrap !important;
    }

    .flex-lg-nowrap {
        flex-wrap: nowrap !important;
    }

    .flex-lg-wrap-reverse {
        flex-wrap: wrap-reverse !important;
    }

    .flex-lg-fill {
        flex: 1 1 auto !important;
    }

    .flex-lg-grow-0 {
        flex-grow: 0 !important;
    }

    .flex-lg-grow-1 {
        flex-grow: 1 !important;
    }

    .flex-lg-shrink-0 {
        flex-shrink: 0 !important;
    }

    .flex-lg-shrink-1 {
        flex-shrink: 1 !important;
    }

    .justify-content-lg-start {
        justify-content: flex-start !important;
    }

    .justify-content-lg-end {
        justify-content: flex-end !important;
    }

    .justify-content-lg-center {
        justify-content: center !important;
    }

    .justify-content-lg-between {
        justify-content: space-between !important;
    }

    .justify-content-lg-around {
        justify-content: space-around !important;
    }

    .align-items-lg-start {
        align-items: flex-start !important;
    }

    .align-items-lg-end {
        align-items: flex-end !important;
    }

    .align-items-lg-center {
        align-items: center !important;
    }

    .align-items-lg-baseline {
        align-items: baseline !important;
    }

    .align-items-lg-stretch {
        align-items: stretch !important;
    }

    .align-content-lg-start {
        align-content: flex-start !important;
    }

    .align-content-lg-end {
        align-content: flex-end !important;
    }

    .align-content-lg-center {
        align-content: center !important;
    }

    .align-content-lg-between {
        align-content: space-between !important;
    }

    .align-content-lg-around {
        align-content: space-around !important;
    }

    .align-content-lg-stretch {
        align-content: stretch !important;
    }

    .align-self-lg-auto {
        align-self: auto !important;
    }

    .align-self-lg-start {
        align-self: flex-start !important;
    }

    .align-self-lg-end {
        align-self: flex-end !important;
    }

    .align-self-lg-center {
        align-self: center !important;
    }

    .align-self-lg-baseline {
        align-self: baseline !important;
    }

    .align-self-lg-stretch {
        align-self: stretch !important;
    }
}

@media (min-width: 1200px) {
    .flex-xl-row {
        flex-direction: row !important;
    }

    .flex-xl-column {
        flex-direction: column !important;
    }

    .flex-xl-row-reverse {
        flex-direction: row-reverse !important;
    }

    .flex-xl-column-reverse {
        flex-direction: column-reverse !important;
    }

    .flex-xl-wrap {
        flex-wrap: wrap !important;
    }

    .flex-xl-nowrap {
        flex-wrap: nowrap !important;
    }

    .flex-xl-wrap-reverse {
        flex-wrap: wrap-reverse !important;
    }

    .flex-xl-fill {
        flex: 1 1 auto !important;
    }

    .flex-xl-grow-0 {
        flex-grow: 0 !important;
    }

    .flex-xl-grow-1 {
        flex-grow: 1 !important;
    }

    .flex-xl-shrink-0 {
        flex-shrink: 0 !important;
    }

    .flex-xl-shrink-1 {
        flex-shrink: 1 !important;
    }

    .justify-content-xl-start {
        justify-content: flex-start !important;
    }

    .justify-content-xl-end {
        justify-content: flex-end !important;
    }

    .justify-content-xl-center {
        justify-content: center !important;
    }

    .justify-content-xl-between {
        justify-content: space-between !important;
    }

    .justify-content-xl-around {
        justify-content: space-around !important;
    }

    .align-items-xl-start {
        align-items: flex-start !important;
    }

    .align-items-xl-end {
        align-items: flex-end !important;
    }

    .align-items-xl-center {
        align-items: center !important;
    }

    .align-items-xl-baseline {
        align-items: baseline !important;
    }

    .align-items-xl-stretch {
        align-items: stretch !important;
    }

    .align-content-xl-start {
        align-content: flex-start !important;
    }

    .align-content-xl-end {
        align-content: flex-end !important;
    }

    .align-content-xl-center {
        align-content: center !important;
    }

    .align-content-xl-between {
        align-content: space-between !important;
    }

    .align-content-xl-around {
        align-content: space-around !important;
    }

    .align-content-xl-stretch {
        align-content: stretch !important;
    }

    .align-self-xl-auto {
        align-self: auto !important;
    }

    .align-self-xl-start {
        align-self: flex-start !important;
    }

    .align-self-xl-end {
        align-self: flex-end !important;
    }

    .align-self-xl-center {
        align-self: center !important;
    }

    .align-self-xl-baseline {
        align-self: baseline !important;
    }

    .align-self-xl-stretch {
        align-self: stretch !important;
    }
}

/* Scaffolding */
html {
    position: relative;
}

/* Buttons */

/* Login */
.login-container {
    margin: 0 auto;
    margin-top: 60px;
}

@media (min-width: 480px) {
    .login-container {
        width: 460px;
    }
}

@media (min-width: 768px) {
    .login-container {
        width: 460px;
    }
}

footer .img-svg, .footer .img-svg {
    height: 30px;
}

/* Workarounds */
    /* TODO: ALWAYS look for better solutions for these use cases and ALWAYS add comments */
    .alert:empty {
    display: none; /* Fixes an issue with the FeedbackSummary control not hiding success, information, or warning message containers */
}

.prev{
    background: url("/Images/arrow-left.svg") no-repeat;
    background-position: center; 
}
.next{
    background: url("/Images/arrow-right.svg") no-repeat;
    background-position: center; 
}

/* Display visible is automatically changing the display to a block format, but what if
   we want display inline. Here is a simple extender class for that.
*/
@media(max-width: 767px){
    .visible-xs.v2{
        display: inline !important;
    }
}

/*Precision Logo and banner CSS*/
/*Banner for Sandbox*/
.prec-test-banner {
    color: #f2f2f2;
    background-color: #e6ac00;
    font-family: Georgia, serif;
    background: -webkit-linear-gradient(bottom right,#e6ac00, #ff9900); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #e6ac00, #ff9900); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #e6ac00, #ff9900); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #e6ac00, #ff9900); /* Standard syntax */
    border-bottom: solid 5px #e68a00;
    font-size: 1.3em;
    padding-left: 1em;
    padding-right: 1em; /* fixes an issue with horizintal scrollbar showing sometimes when the banner is showing */
}

/*Banner colors for DevMachine*/
.prec-test-banner.devmachine {
    background: -webkit-linear-gradient(bottom right,#8391e6, #3f5279); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #8391e6, #3f5279); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #8391e6, #3f5279); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #8391e6, #3f5279); /* Standard syntax */
    border-bottom: solid 5px #8b95c6;
}

/*Banner colors for Acceptance*/
.prec-test-banner.acceptance {
    background: -webkit-linear-gradient(bottom right,#9bd200, #709e00); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom right, #9bd200, #709e00); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom right, #9bd200, #709e00); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom right, #9bd200, #709e00); /* Standard syntax */
    border-bottom: solid 5px #91b304;
}


.prec-test-banner a {
    color: #f2f2f2;
}
    .prec-test-banner a.issues-detected-icon {
        text-decoration: none;
        padding: 0 4px;
        margin: 0 4px;
        background-color: #fff;
        border-radius: 5px;
    }

/* Makes the banner look like it's "outside the site" on larger screens */
@media (min-width: 425px) {
    .prec-test-banner .container {
        width: 90%;
    }
}

.affix {
    top: 0;
    width: 100%;
    z-index: 1000;
}

.btn-close-banner {
    /*padding: 5px;
    padding-right: 10px;*/
    color: #888;
    text-decoration: none;
}

.prec-test-banner .btn-close-banner {
    color: #fff;
}

.btn-close-banner:hover, .btn-close-banner:focus{
    color: #8c8ee8;
    text-decoration: none;
    cursor: pointer;
}

/* reduce the font size on small screens so the entire text will fit without wrapping to 3 lines (limit to two lines wrapping) */
@media (max-width: 360px) {
    .prec-test-banner {
        font-size: .95em;
    }
}

dl dt span.glyphicon[data-toggle="collapse"]   {
    cursor: pointer;
}

.errortracedetails {
    word-wrap: break-word; /* This fixes an issue on smaller devices with the filename display that has no spaces */
    cursor: pointer;
}

.break-all {
    word-break: break-all;
}

    .errortracedetails h1 {
        color: #d9534f;
        font-size: 18px;
    }

    .errortracedetails h2 {
        color: maroon;
        font-size: 14pt;
    }

    .errortracedetails .marker {
        font-weight: bold;
        color: black;
        text-decoration: none;
    }

    .errortracedetails .version {
        color: gray;
    }

    .errortracedetails .error {
        margin-bottom: 10px;
    }

    .errortracedetails .expandable {
        text-decoration: underline;
        font-weight: bold;
        color: navy;
    }

/* Meant for affix items that need to be on a level higher than and above everything else... global progress bar and global error 
    Even above modals and above other affix top items like navbars.
*/
.affix.affix-top.affix-global {
    width: 100%;
    z-index: 10000;
}

/* The bootstrap progress bar forces you to set the width to override it i.e. it doesn't fill it's container unless you specify it to here */
.affix-global .progress-bar {
    width:100%;
}

#globalErrorBar div.alert > strong {
    display: none;
}

#globalErrorBar div.alert.alert-warning > strong.alert-warning {
    display: inline;
}

#globalErrorBar div.alert.alert-danger > strong.alert-danger {
    display: inline;
}
        
/* END SHELL CHANGES.  Please place all custom site work in the next section. */

/* BEGIN SHELL 1.1 Changes */
a.editable-click:hover {
    color: #1B3449;
    cursor: pointer;
}

    /* Adds edit icon after an x-editable*/
    a.editable-click:hover::after {
        content: ' \f040';
        font-family: FontAwesome;
        color: rgba(27, 52, 73, 0.78);
        font-style: normal;
    }

    /* PREC-830 adds the same edit icon but not on hover and is transparent.  This keeps the width from resizing on hover */
    a.editable-click::after {
        content: ' \f040';
        font-family: FontAwesome;
        color: rgba(146, 146, 146, 0.27);
        font-style: normal;
    }

    /* Removes edit icon after an x-editable when it's disabled */
    a.editable-disabled::after, a.editable-disabled:hover::after {
        content: '';
    }

/* Begin x-editable formatting to have an inline edit fill it's parent container */
.editable-container.editable-inline {
    width: 100%;
}

.editable-inline div.control-group.form-group {
    width: 100%;
    padding-right: 85px;
}

.editable-inline .editable-input {
    width: 100%;
}

    .editable-inline .editable-input .form-control {
        width: 100%;
    }

/* Begin x-editable formatting to setup the buttons on xeditable Date Select so it looks good when it's set to ButtonLocation="Bottom"
    The clear button seems to only appear on the date select but buttons-bottom can be on any but it always looks best pulled right. */
.editable-container:not(.editable-inline) .editable-clear a {
    float: left !important;
}

.editable-container:not(.editable-inline) .editable-buttons-bottom {
    text-align: right !important;
}

/* Error text overflow keep inside parent container */
div.editable-error-block.help-block {
    overflow-wrap: break-word;
}

div.error-hint {
    position: relative;
    float: left;
    text-align: left;
}

/* Error Hint */
span.error-hint {
	padding: 8px 11px;
	width: 212px;
	color: rgb(255, 255, 255);
	font-size: 14px;
	font-weight: bold;
	background: rgb(204, 54, 54);
	border: 1px solid rgb(255, 255, 255);
	border-radius: 5px;
	pointer-events: none;
	visibility: visible;
	position: absolute;
    bottom: 0; /* This + margin will have the error above and it will 'grow up' in height so it's always above the element you're validating */
	margin-bottom: 44px;
    z-index: 999;
	/*display: none;*/
}

div.error-hint > span.error-hint {
    margin-bottom: 5px;
}

span.error-hint:after {
    content: "";
    position: absolute;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-top: 12px solid rgb(204, 54, 54);
    margin-top: -2px;
    z-index: 1;
    top: 100%;
    left: 30px;
    margin-left: -20px;
}

/* Error hint right */
span.error-hint-right {
    margin-left: 8px;
    margin-top: -6px; /* purposely raised slightly to accomodate really short elements */
    bottom: auto;
}

span.error-hint-select2 {
    margin-left: -160px;
}

    span.error-hint-right:after {
        content: "";
        position: absolute;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        border-right: 12px solid rgb(204, 54, 54);
        margin-top: -2px;
        z-index: 1;
        right: 100%;
        top: 12px;
        left: 0;
        margin-left: -60px;
    }


/* Error hint condensed */
.error-hint-condensed span.error-hint {
    padding: 4px 11px;
    width: auto;
    color: rgb(204, 54, 54);
    font-size: 12px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgb(204, 54, 54);
    cursor: pointer;
    pointer-events: auto;
    transition: background 0.15s ease-in-out;
}

    .error-hint-condensed span.error-hint:hover {
        background: rgba(255, 255, 255, 1);
    }

    .error-hint-condensed span.error-hint div {
        display: inline;
        margin-left: 5px;
        background: rgba(255, 255, 255, 1);
    }

        .error-hint-condensed span.error-hint div.error-hint-description {
            opacity: 0;
            transform: scale(0);
            display: none;
            background: rgba(255, 255, 255, 0.9);
            transition: display 0s linear, opacity 0.15s ease-in-out 0.15s, transform 0.3s ease-in-out 0.15s;
        }

        .error-hint-condensed span.error-hint:hover div.error-hint-description {
            opacity: 1;
            transform: scale(1);
            display: inline;
        }

.error-hint-condensed div.error-hint > span.error-hint {
    margin-bottom: 10px;
}

.error-hint-condensed span.error-hint:before,
.error-hint-condensed span.error-hint-right:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: "\f071";
}

.error-hint-condensed span.error-hint:after {
    content: "";
    position: absolute;
    border-top: 12px solid rgb(204, 54, 54);
    border-left: 13px solid transparent;
    border-right: 13px solid transparent;
    margin-top: 0;
    z-index: 1;
    top: 100%;
    left: 5px;
    margin-left: 0;
}

/* Error hint right */
.error-hint-condensed span.error-hint-right {
    margin-left: 8px;
    margin-top: -6px; /* purposely raised slightly to accomodate really short elements */
    bottom: auto;
}

    .error-hint-condensed span.error-hint-right:after {
        content: "";
        position: absolute;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        border-right: 12px solid rgb(204, 54, 54);
        margin-top: -2px;
        z-index: 1;
        right: 100%;
        top: 6px;
        left: 0;
        margin-left: -60px;
    }


.text-ellipsis {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/* Fixes an issue when toggle buttons are inside td element (bootstrap overrides the btn padding to be 0 so this re-centers */
div.toggle.btn label.btn {
    padding-top: 6px;
    padding-bottom: 6px;
}

.btn-danger-is-temp-setting label.btn.btn-danger:after {
    content: '(\f09c  temp)';
    font-family: FontAwesome;
    margin-left: 5px;
}

.efcache-toggle .alert {
    margin-top: 12px;
}

.shell-settings-quick-menu li > label:first-of-type {
    width: 125px;
}

.shell-settings-quick-menu li > span:first-of-type {
    padding-right:15px;
}

.prec-test-banner ul.shell-settings-quick-menu,
.prec-test-banner ul.shell-MailIntercept-quick-menu {
    color: #222;
}

@media (max-width: 991px) {
    .tip-mobile {
        text-decoration: underline dotted;
    }
}

/* Error page stylings */
.default-error-page .errortracedetails {
    cursor: default;
}

.default-error-page.error-severity-userwillunderstand .errortracedetails,
.default-error-page.error-severity-requiresadminassistance .errortracedetails {
    display: none;
}

.default-error-page .alert h1, .default-error-page .alert h2 {
    margin-top: 10px;
}

.default-error-page .error-image img {
    padding: 0;
    background-color: #000;
    color: #ddd;
    border-color: #000;
    border-radius: 5px;
}

/* This is part of the footer helper */
html, body.shell-footer-helper, form.shell-footer-helper {
    min-height: 100%;
    height: 100vh;
    height: 100%
}

form.shell-footer-helper {
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 100%;
    flex-direction: column;
}

/* This will only work if the div is an immediate child of the form so we specify the selector to be clear */
/* This gets the oterwrapper div to take up the entire center of the flexbox, which has already been set in the form to be column based */
/* That will effectively push anything else below this div to the footer */
form > div.shell-footer-helper {
    flex: 1 0 auto;
}

/* the height: auto; helps to remove the vertical scrollbar */
footer, .footer {
    /* removing this and using the footer helper instead.  This can have some issues in some cases and the other is more consistent
    bottom: 0; 
    position: absolute; */
    height: auto;
    margin-top: 10px;
    padding-top: 10px;
    width: 100%;
    background-color: #484848;
    border-top: 1px solid #181818;
    color: #fff;
    font-size: 12px;
}

    footer .powered-by a, .footer .powered-by a,
    footer .powered-by a:hover, .footer .powered-by a:hover {
        color: #5bc0de
    }

footer .container, .footer container {
    border: 0;
    background-color: transparent;
}

.footer-logo {
    width: 124px;
    max-width: 124px;
    margin-bottom: 5px;
}

/* Adds the dropdown caret to the multi-select2.  This only adds it to the standalone one, the xeditable uses v2 so add classes for that if you want it on xeditable as well */
.select2v4-container--default .select2v4-selection--multiple .select2v4-selection__rendered {
    /* This adds padding to the outer container so the placholder input box (when the multiselect is empty) doesn't wrap to the next line */
    padding-right: 22px;
}

/* this adds the actual dropdown arrow to the right of the multi-select input box, it uses negative margin to pull itself into the padded region of it's parent container */
.select2v4-selection--multiple ul.select2v4-selection__rendered:before {
    width: 0;
    height: 0;
    content: " ";
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px dashed;
    /* alternative narrow dropdown arrow similar to chrome dropdowns 
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 6px dashed;*/
    margin-top: 13px;
    float: right;
    margin-right: -16px;
}

/* Updating this to target IE specific because it causes an issue when searching where the first part of the search text is hidden after selecting at least one item.  
    That issue was happening on all browsers but now that we're targeting IE specific, it's only happening on IE.  */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .select2v4-container--default .select2v4-search--inline .select2v4-search__field {
        margin-left: -30px; /* This is a hacky workaround we have to do to keep the dropdown arrow from causing a wrapping issue (making the select box show double height) on IE when there are no items in the select box.  We can't control the width of this input field so we shift left with negative margin, then add the same amount in padding back, which effectively works.*/
        padding-left: 30px;
    }
}

/*Same fix as above but specific fix for Edge as welll as IE*/
@supports (-ms-ime-align:auto) {
    .select2v4-container--default .select2v4-search--inline .select2v4-search__field {
        margin-left: -30px; 
        padding-left: 30px;
    }
}

.modal-body.scrollable {
    max-height: 500px;
    overflow: auto;
}

.sidebar-nav > li:first-child a {
    border-bottom: 1px solid rgba(204, 204, 204, 0.6);
}

.panel .alert {
    border-radius: 0;
}

.ie-only {
    display: none;
}

@media (-ms-high-contrast: none), (-ms-high-contract: active) {
    .ie-only {
        display: block;
    }
}

.ie-banner {
    border-radius: 0;
}

.report-a-bug-panel {
    z-index: 500;
    width: 300px;
    position: fixed;
    bottom: 5px;
    right: 5px;
}

    .report-a-bug-panel .panel,
    .report-a-bug-panel .panel-heading {
        border-top-right-radius: 0;
    }

    .report-a-bug-panel #btnReportBug {
        border-radius: 2px 2px 0 0;
    }

    .report-a-bug-panel #pnlReportBug {
        margin-bottom: 10px;
    }

    .report-a-bug-panel .close {
        color: white;
        text-shadow: none;
        opacity: 1;
    }


@media (max-width: 767px) {
    .report-a-bug-panel {
        width: 200px;
        position: fixed;
        right: 5px;
        bottom: 5px;
    }

        .report-a-bug-panel #btnReportBug span {
            display: none;
        }
}

.edge-legacy {
    display: none;
}

@supports (-ms-ime-align:auto) {
    .edge-legacy {
        display: block;
    }
}

.flex-centered {
    display: flex;
    justify-content: center;
    align-items: center;
}

.flex-centered-horizontal {
    display: flex;
    align-items: center;
}

.flex-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.bulk-edit-highlight {
    background-color: #dff0d8 !important;
    border-color: #d6e9c6 !important;
    color: #3c763d !important;
}

.multi-factor-authentication-panel {
    display: flex;
    flex-direction: column;
    padding: 1em;
    gap: 1em;
}

/* Overriding default bootstrap-social styling to improve visual consistency. 
   Removed border-right and decreased font size to 1.4em for the first child element within .btn-social */
.btn-social > :first-child {
    border-right: none;
    font-size: 1.4em;
}

.grecaptcha-badge {
    visibility: hidden;
}

.mfa-input {
    width: 45px;
    margin: 0 3px;
    text-align: center;
    transition: all 0.2s ease-in-out;
    font-size: xx-large;
    border-radius: 10px;
}

.mfa-input:focus {
    outline: none;
   /* border-bottom: 1px solid #000;*/
}

/* Chrome, Safari, Edge, Opera */
.mfa-input::-webkit-outer-spin-button,
.mfa-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.mfa-input[type=number] {
    -moz-appearance: textfield;
}

.no-bullets {
    list-style-type: none;
}

.w-auto {
    width: auto;
}

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

.border-0 {
    border: none !important;
}

.outline-0 {
    outline: none !important;
}

.pointer-events-none {
    pointer-events: none !important;
}

.mfa-remember-browser {
    width: 16px;
    height: 16px;
    display: inline-block;
}

.mfa-remember-browser input[type=checkbox] {
    width: 16px;
    height: 16px;
    margin: 0;
}

.modal-xl {
    width: 1200px;
}

.pre-wrap {
    white-space: pre-wrap;
}

.meld-bottom {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    margin-bottom: 0;
}

.meld-top {
    border-top-right-radius: 0 !important;
    border-top-left-radius: 0 !important;
    margin-top: 0;
}

/* Small devices (tablets) */
@media (min-width: 768px) {
    .meld-top-sm {
        border-top-right-radius: 0 !important;
        border-top-left-radius: 0 !important;
        margin-top: 0;
    }
}

/* Medium devices (desktops) */
@media (min-width: 992px) {
    .meld-top-md {
        border-top-right-radius: 0 !important;
        border-top-left-radius: 0 !important;
        margin-top: 0;
    }
}

/* Large devices (large desktops) */
@media (min-width: 1200px) {
    .meld-top-lg {
        border-top-right-radius: 0 !important;
        border-top-left-radius: 0 !important;
        margin-top: 0;
    }
}

/* END SHELL 1.1 changes */

/* BEGIN CUSTOM SITE CHANGES */

/*
    This file is meant to be shell specific, but if you have to add something site specific then add it below this comment.
    Put Shell specific stuff above this comment.  In the shell, below this comment should be blank to help with merges.
*/

.hover-pointer:hover{
    cursor: pointer;
}

.nim-required::after {
    content: '*';
    color: #B2272D;
    display: inline-block;
    padding-left: 2px;
}