/*#################################
 Bootstrap overflow
 #################################*/

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

.overflow-x-hidden {
    overflow-x: hidden !important;
}

.overflow-x-auto {
    overflow-x: auto !important;
}

.overflow-y-hidden {
    overflow-y: hidden !important;
}

.overflow-y-auto {
    overflow-y: auto !important;
}

/*#################################
 Bootstrap btn lighter
 #################################*/

.btn-lighter,
.btn-lighter[aria-expanded="true"] {
    color: #212529;
    background-color: transparent;
    border-color: transparent;
}

.btn-lighter:hover {
    color: #212529;
    /*background-color: #f8f9fa;*/
    /*border-color: #f8f9fa;*/
    /*background-color: transparent;*/
    /*border-color: transparent;*/
}

.btn-lighter.focus, .btn-lighter:focus {
    /*box-shadow: 0 0 0 .2rem rgba(248,249,250,.5);*/
    box-shadow: none;
    /*background-color: transparent;*/
    /*border-color: transparent;*/

    /*color: #fff;*/
    /*background-color: #007bff;*/
    /*border-color: #007bff;*/
}

.btn-lighter[aria-expanded="true"] {
    /*color: #007bff;*/
    /*border-bottom-color: #dae0e5;*/
    /*border-bottom-color: #6c757d;*/
    /*background-color: #e2e6ea;*/
    /*border-color: #dae0e5*/
}

.btn-lighter.disabled, .btn-lighter:disabled {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa
}

.btn-lighter:not(:disabled):not(.disabled).active, .btn-lighter:not(:disabled):not(.disabled):active, .show > .btn-lighter.dropdown-toggle {
    color: #212529;
    background-color: #f8f9fa;
    border-color: #f8f9fa
}

.btn-lighter:not(:disabled):not(.disabled).active:focus, .btn-lighter:not(:disabled):not(.disabled):active:focus, .show > .btn-lighter.dropdown-toggle:focus {
    /*box-shadow: 0 0 0 .2rem rgba(248,249,250,.5);*/
    box-shadow: none;
}

.btn-lighter + .dropdown-menu .dropdown-item.active, .btn-lighter + .dropdown-menu .dropdown-item:active {
    color: #16181b;
    text-decoration: none;
    background-color: #f8f9fa;
}


/*#################################
 Bootstrap border color
 #################################*/

border-transparent {
    border-color: transparent !important;
}

/*#################################
 Bootstrap position
 #################################*/

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

.to-right {
    right: 0 !important;
}

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

.to-bottom {
    bottom: 0 !important;
}

.to-left-auto {
    left: auto !important;
}

.to-right-auto {
    right: auto !important;
}

.to-top-auto {
    top: auto !important;
}

.to-bottom-auto {
    bottom: auto !important;
}

/*#################################
 Bootstrap rounded
 #################################*/

.rounded-left-0 {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.rounded-right-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

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

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


/*#################################
 Bootstrap form-control
 #################################*/

.form-control.disabled,
.form-control.readonly {
    background-color: #e9ecef;
    opacity: 1;
}

/*#################################
 Bootstrap fonts extends
 #################################*/

.h1, h1 {
    font-size: 40px !important;
    font-size: 2.5rem !important;
}

.h2, h2 {
    font-size: 32px !important;
    font-size: 2rem !important;
}

.h3, h3 {
    font-size: 28px !important;
    font-size: 1.75rem !important;
}

.h4, h4 {
    font-size: 24px !important;
    font-size: 1.5rem !important;
}

.h5, h5 {
    font-size: 20px !important;
    font-size: 1.25rem !important;
}

.h6, h6 {
    font-size: 16px !important;
    font-size: 1rem !important;
}

.h7 {
    font-size: 85% !important;
}

.h8 {
    font-size: 75% !important;
}

.h-normal {
    font-size: inherit !important;
}

/*#################################
 Bootstrap lineheight extends
 #################################*/

.lh-7 {
    line-height: 0.8 !important;
}

.lh-6 {
    line-height: 1 !important;
}

.lh-5 {
    line-height: 1.25 !important;
}

.lh-4 {
    line-height: 1.5 !important;
}

.lh-3 {
    line-height: 1.75 !important;
}

.lh-2 {
    line-height: 2 !important;
}

.lh-1 {
    line-height: 2.5 !important;
}

.lh-0 {
    line-height: 0 !important;
}

.lh-auto {
    line-height: normal !important;
}

@media (min-width: 576px) {
    .lh-sm-7 {
        line-height: 0.8 !important;
    }

    .lh-sm-6 {
        line-height: 1 !important;
    }

    .lh-sm-5 {
        line-height: 1.25 !important;
    }

    .lh-sm-4 {
        line-height: 1.5 !important;
    }

    .lh-sm-3 {
        line-height: 1.75 !important;
    }

    .lh-sm-2 {
        line-height: 2 !important;
    }

    .lh-sm-1 {
        line-height: 2.5 !important;
    }

    .lh-sm-0 {
        line-height: 0 !important;
    }

    .lh-sm-auto {
        line-height: normal !important;
    }
}

@media (min-width: 768px) {
    .lh-md-7 {
        line-height: 0.8 !important;
    }

    .lh-md-6 {
        line-height: 1 !important;
    }

    .lh-md-5 {
        line-height: 1.25 !important;
    }

    .lh-md-4 {
        line-height: 1.5 !important;
    }

    .lh-md-3 {
        line-height: 1.75 !important;
    }

    .lh-md-2 {
        line-height: 2 !important;
    }

    .lh-md-1 {
        line-height: 2.5 !important;
    }

    .lh-md-0 {
        line-height: 0 !important;
    }

    .lh-md-auto {
        line-height: normal !important;
    }
}

@media (min-width: 992px) {
    .lh-lg-7 {
        line-height: 0.8 !important;
    }

    .lh-lg-6 {
        line-height: 1 !important;
    }

    .lh-lg-5 {
        line-height: 1.25 !important;
    }

    .lh-lg-4 {
        line-height: 1.5 !important;
    }

    .lh-lg-3 {
        line-height: 1.75 !important;
    }

    .lh-lg-2 {
        line-height: 2 !important;
    }

    .lh-lg-1 {
        line-height: 2.5 !important;
    }

    .lh-lg-0 {
        line-height: 0 !important;
    }

    .lh-lg-auto {
        line-height: normal !important;
    }
}

@media (min-width: 1200px) {
    .lh-xl-7 {
        line-height: 0.8 !important;
    }

    .lh-xl-6 {
        line-height: 1 !important;
    }

    .lh-xl-5 {
        line-height: 1.25 !important;
    }

    .lh-xl-4 {
        line-height: 1.5 !important;
    }

    .lh-xl-3 {
        line-height: 1.75 !important;
    }

    .lh-xl-2 {
        line-height: 2 !important;
    }

    .lh-xl-1 {
        line-height: 2.5 !important;
    }

    .lh-xl-0 {
        line-height: 0 !important;
    }

    .lh-xl-auto {
        line-height: normal !important;
    }
}

/*#################################
 Bootstrap width extends
 #################################*/

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

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

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

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

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

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

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

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

.w-0 {
    width: 0 !important;
}

.w-auto {
    width: auto !important;
}

@media (min-width: 576px) {
    .w-sm-100 {
        width: 100% !important;
    }

    .w-sm-80 {
        width: 80% !important;
    }

    .w-sm-75 {
        width: 75% !important;
    }

    .w-sm-60 {
        width: 60% !important;
    }

    .w-sm-50 {
        width: 50% !important;
    }

    .w-sm-40 {
        width: 40% !important;
    }

    .w-sm-25 {
        width: 25% !important;
    }

    .w-sm-20 {
        width: 20% !important;
    }

    .w-sm-0 {
        width: 0 !important;
    }

    .w-sm-auto {
        width: auto !important;
    }
}

@media (min-width: 768px) {
    .w-md-100 {
        width: 100% !important;
    }

    .w-md-80 {
        width: 80% !important;
    }

    .w-md-75 {
        width: 75% !important;
    }

    .w-md-60 {
        width: 60% !important;
    }

    .w-md-50 {
        width: 50% !important;
    }

    .w-md-40 {
        width: 40% !important;
    }

    .w-md-25 {
        width: 25% !important;
    }

    .w-md-20 {
        width: 20% !important;
    }

    .w-md-0 {
        width: 0 !important;
    }

    .w-md-auto {
        width: auto !important;
    }
}

@media (min-width: 992px) {
    .w-lg-100 {
        width: 100% !important;
    }

    .w-lg-80 {
        width: 80% !important;
    }

    .w-lg-75 {
        width: 75% !important;
    }

    .w-lg-60 {
        width: 60% !important;
    }

    .w-lg-50 {
        width: 50% !important;
    }

    .w-lg-40 {
        width: 40% !important;
    }

    .w-lg-25 {
        width: 25% !important;
    }

    .w-lg-20 {
        width: 20% !important;
    }

    .w-lg-0 {
        width: 0 !important;
    }

    .w-lg-auto {
        width: auto !important;
    }
}

@media (min-width: 1200px) {
    .w-xl-100 {
        width: 100% !important;
    }

    .w-xl-80 {
        width: 80% !important;
    }

    .w-xl-75 {
        width: 75% !important;
    }

    .w-xl-60 {
        width: 60% !important;
    }

    .w-xl-50 {
        width: 50% !important;
    }

    .w-xl-40 {
        width: 40% !important;
    }

    .w-xl-25 {
        width: 25% !important;
    }

    .w-xl-20 {
        width: 20% !important;
    }

    .w-xl-0 {
        width: 0 !important;
    }

    .w-xl-auto {
        width: auto !important;
    }
}

@media (max-width: 575.98px) {
    .w-sm-100-down {
        width: 100% !important;
    }

    .w-sm-80-down {
        width: 80% !important;
    }

    .w-sm-75-down {
        width: 75% !important;
    }

    .w-sm-60-down {
        width: 60% !important;
    }

    .w-sm-50-down {
        width: 50% !important;
    }

    .w-sm-40-down {
        width: 40% !important;
    }

    .w-sm-25-down {
        width: 25% !important;
    }

    .w-sm-20-down {
        width: 20% !important;
    }

    .w-sm-0-down {
        width: 0 !important;
    }

    .w-sm-auto-down {
        width: auto !important;
    }
}

@media (max-width: 767.98px) {
    .w-md-100-down {
        width: 100% !important;
    }

    .w-md-80-down {
        width: 80% !important;
    }

    .w-md-75-down {
        width: 75% !important;
    }

    .w-md-60-down {
        width: 60% !important;
    }

    .w-md-50-down {
        width: 50% !important;
    }

    .w-md-40-down {
        width: 40% !important;
    }

    .w-md-25-down {
        width: 25% !important;
    }

    .w-md-20-down {
        width: 20% !important;
    }

    .w-md-0-down {
        width: 0 !important;
    }

    .w-md-auto-down {
        width: auto !important;
    }
}

@media (max-width: 991.98px) {
    .w-lg-100-down {
        width: 100% !important;
    }

    .w-lg-80-down {
        width: 80% !important;
    }

    .w-lg-75-down {
        width: 75% !important;
    }

    .w-lg-60-down {
        width: 60% !important;
    }

    .w-lg-50-down {
        width: 50% !important;
    }

    .w-lg-40-down {
        width: 40% !important;
    }

    .w-lg-25-down {
        width: 25% !important;
    }

    .w-lg-20-down {
        width: 20% !important;
    }

    .w-lg-0-down {
        width: 0 !important;
    }

    .w-lg-auto-down {
        width: auto !important;
    }
}

@media (max-width: 1199.98px) {
    .w-xl-100-down {
        width: 100% !important;
    }

    .w-xl-80-down {
        width: 80% !important;
    }

    .w-xl-75-down {
        width: 75% !important;
    }

    .w-xl-60-down {
        width: 60% !important;
    }

    .w-xl-50-down {
        width: 50% !important;
    }

    .w-xl-40-down {
        width: 40% !important;
    }

    .w-xl-25-down {
        width: 25% !important;
    }

    .w-xl-20-down {
        width: 20% !important;
    }

    .w-xl-0-down {
        width: 0 !important;
    }

    .w-xl-auto-down {
        width: auto !important;
    }
}


/*#################################
 Cursor
 #################################*/

.cursor-pointer {
    cursor: pointer !important;
}

.cursor-text {
    cursor: text !important;
}

/*#################################
 Card columns
 #################################*/

.card-columns-1 {
    -webkit-column-count: 1 !important;
    -moz-column-count: 1 !important;
    column-count: 1 !important;
}

.card-columns-2 {
    -webkit-column-count: 2 !important;
    -moz-column-count: 2 !important;
    column-count: 2 !important;
}

.card-columns-3 {
    -webkit-column-count: 3 !important;
    -moz-column-count: 3 !important;
    column-count: 3 !important;
}

.card-columns-4 {
    -webkit-column-count: 4 !important;
    -moz-column-count: 4 !important;
    column-count: 4 !important;
}

.card-columns-5 {
    -webkit-column-count: 5 !important;
    -moz-column-count: 5 !important;
    column-count: 5 !important;
}

.card-columns-auto {
    -webkit-column-count: auto !important;
    -moz-column-count: auto !important;
    column-count: auto !important;
}

@media (min-width: 576px) {
    .card-columns-sm-1 {
        -webkit-column-count: 1 !important;
        -moz-column-count: 1 !important;
        column-count: 1 !important;
    }

    .card-columns-sm-2 {
        -webkit-column-count: 2 !important;
        -moz-column-count: 2 !important;
        column-count: 2 !important;
    }

    .card-columns-sm-3 {
        -webkit-column-count: 3 !important;
        -moz-column-count: 3 !important;
        column-count: 3 !important;
    }

    .card-columns-sm-4 {
        -webkit-column-count: 4 !important;
        -moz-column-count: 4 !important;
        column-count: 4 !important;
    }

    .card-columns-sm-5 {
        -webkit-column-count: 5 !important;
        -moz-column-count: 5 !important;
        column-count: 5 !important;
    }

    .card-columns-sm-auto {
        -webkit-column-count: auto !important;
        -moz-column-count: auto !important;
        column-count: auto !important;
    }
}

@media (min-width: 768px) {
    .card-columns-md-1 {
        -webkit-column-count: 1 !important;
        -moz-column-count: 1 !important;
        column-count: 1 !important;
    }

    .card-columns-md-2 {
        -webkit-column-count: 2 !important;
        -moz-column-count: 2 !important;
        column-count: 2 !important;
    }

    .card-columns-md-3 {
        -webkit-column-count: 3 !important;
        -moz-column-count: 3 !important;
        column-count: 3 !important;
    }

    .card-columns-md-4 {
        -webkit-column-count: 4 !important;
        -moz-column-count: 4 !important;
        column-count: 4 !important;
    }

    .card-columns-md-5 {
        -webkit-column-count: 5 !important;
        -moz-column-count: 5 !important;
        column-count: 5 !important;
    }

    .card-columns-md-auto {
        -webkit-column-count: auto !important;
        -moz-column-count: auto !important;
        column-count: auto !important;
    }
}

@media (min-width: 992px) {
    .card-columns-lg-1 {
        -webkit-column-count: 1 !important;
        -moz-column-count: 1 !important;
        column-count: 1 !important;
    }

    .card-columns-lg-2 {
        -webkit-column-count: 2 !important;
        -moz-column-count: 2 !important;
        column-count: 2 !important;
    }

    .card-columns-lg-3 {
        -webkit-column-count: 3 !important;
        -moz-column-count: 3 !important;
        column-count: 3 !important;
    }

    .card-columns-lg-4 {
        -webkit-column-count: 4 !important;
        -moz-column-count: 4 !important;
        column-count: 4 !important;
    }

    .card-columns-lg-5 {
        -webkit-column-count: 5 !important;
        -moz-column-count: 5 !important;
        column-count: 5 !important;
    }

    .card-columns-lg-auto {
        -webkit-column-count: auto !important;
        -moz-column-count: auto !important;
        column-count: auto !important;
    }
}

@media (min-width: 1200px) {
    .card-columns-xl-1 {
        -webkit-column-count: 1 !important;
        -moz-column-count: 1 !important;
        column-count: 1 !important;
    }

    .card-columns-xl-2 {
        -webkit-column-count: 2 !important;
        -moz-column-count: 2 !important;
        column-count: 2 !important;
    }

    .card-columns-xl-3 {
        -webkit-column-count: 3 !important;
        -moz-column-count: 3 !important;
        column-count: 3 !important;
    }

    .card-columns-xl-4 {
        -webkit-column-count: 4 !important;
        -moz-column-count: 4 !important;
        column-count: 4 !important;
    }

    .card-columns-xl-5 {
        -webkit-column-count: 5 !important;
        -moz-column-count: 5 !important;
        column-count: 5 !important;
    }

    .card-columns-xl-auto {
        -webkit-column-count: auto !important;
        -moz-column-count: auto !important;
        column-count: auto !important;
    }
}

/*#################################
 CSS Outline
 #################################*/

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

/*#################################
 CSS Columns
 #################################*/

.columns-0 {
    -webkit-columns: 0 !important;
    -moz-columns: 0 !important;
    columns: 0 !important;
}

.columns-auto {
    -webkit-columns: auto !important;
    -moz-columns: auto !important;
    columns: auto !important;
}

.columns-2 {
    -webkit-columns: 2 !important;
    -moz-columns: 2 !important;
    columns: 2 !important;

    /* -webkit-margin-before: 0; */
    /* -webkit-margin-after: 0; */
}

.columns-3 {
    -webkit-columns: 3 !important;
    -moz-columns: 3 !important;
    columns: 3 !important;
}

.columns-4 {
    -webkit-columns: 4 !important;
    -moz-columns: 4 !important;
    columns: 4 !important;
}

.columns-5 {
    -webkit-columns: 5 !important;
    -moz-columns: 5 !important;
    columns: 5 !important;
}

@media (min-width: 576px) {
    .columns-sm-2 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-sm-3 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-sm-4 {
        -webkit-columns: 4 !important;
        -moz-columns: 4 !important;
        columns: 4 !important;
    }

    .columns-sm-5 {
        -webkit-columns: 5 !important;
        -moz-columns: 5 !important;
        columns: 5 !important;
    }

    .columns-sm-0 {
        -webkit-columns: 0 !important;
        -moz-columns: 0 !important;
        columns: 0 !important;
    }

    .columns-sm-auto {
        -webkit-columns: auto !important;
        -moz-columns: auto !important;
        columns: auto !important;
    }
}

@media (min-width: 768px) {
    .columns-md-2 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-md-3 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-md-4 {
        -webkit-columns: 4 !important;
        -moz-columns: 4 !important;
        columns: 4 !important;
    }

    .columns-md-5 {
        -webkit-columns: 5 !important;
        -moz-columns: 5 !important;
        columns: 5 !important;
    }

    .columns-md-0 {
        -webkit-columns: 0 !important;
        -moz-columns: 0 !important;
        columns: 0 !important;
    }

    .columns-md-auto {
        -webkit-columns: auto !important;
        -moz-columns: auto !important;
        columns: auto !important;
    }
}

@media (min-width: 992px) {
    .columns-lg-2 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-lg-3 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-lg-4 {
        -webkit-columns: 4 !important;
        -moz-columns: 4 !important;
        columns: 4 !important;
    }

    .columns-lg-5 {
        -webkit-columns: 5 !important;
        -moz-columns: 5 !important;
        columns: 5 !important;
    }

    .columns-lg-0 {
        -webkit-columns: 0 !important;
        -moz-columns: 0 !important;
        columns: 0 !important;
    }

    .columns-lg-auto {
        -webkit-columns: auto !important;
        -moz-columns: auto !important;
        columns: auto !important;
    }
}

@media (min-width: 1200px) {
    .columns-xl-2 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-xl-3 {
        -webkit-columns: 2 !important;
        -moz-columns: 2 !important;
        columns: 2 !important;
    }

    .columns-xl-4 {
        -webkit-columns: 4 !important;
        -moz-columns: 4 !important;
        columns: 4 !important;
    }

    .columns-xl-5 {
        -webkit-columns: 5 !important;
        -moz-columns: 5 !important;
        columns: 5 !important;
    }

    .columns-xl-0 {
        -webkit-columns: 0 !important;
        -moz-columns: 0 !important;
        columns: 0 !important;
    }

    .columns-xl-auto {
        -webkit-columns: auto !important;
        -moz-columns: auto !important;
        columns: auto !important;
    }
}

.gap-2 {
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em;
}

/*#################################
 Bootstrap btn circle
 #################################*/

.btn-circle-sm {
    width: 30px;
    height: 30px;
    padding: 6px 0px;
    border-radius: 50% !important;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
}

.btn-circle-md {
    width: 40px;
    height: 40px;
    padding: 8px 12px;
    border-radius: 50% !important;
    font-size: 16px;
    line-height: 1.33;
}

.btn-circle-lg {
    width: 50px;
    height: 50px;
    padding: 10px 15px;
    border-radius: 50% !important;
    font-size: 20px;
    line-height: 1.33;
}

.btn-circle-xl {
    width: 70px;
    height: 70px;
    padding: 16px 16px;
    border-radius: 50% !important;
    font-size: 24px;
    line-height: 1.33;
}

/*#################################
 Bootstrap caret extends
 #################################*/

.no-caret:before,
.no-caret:after {
    border: none;
    content: normal;
}

/*#################################
 Bootstrap link extends
 #################################*/

a,
a:hover,
a:focus {
    text-decoration: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

/*#################################
 Bootstrap text decoration extends
 #################################*/

.text-decoration-crossline,
.text-decoration-line-through {
    text-decoration: line-through !important;
}

.text-decoration-underline {
    text-decoration: underline !important;
}

.text-decoration-hover-underline:hover,
.text-decoration-hover-underline:focus {
    text-decoration: underline !important;
}

.text-decoration-active-underline.active,
.text-decoration-active-underline:active,
.text-decoration-active-underline[aria-expanded="true"] {
    text-decoration: underline !important;
}

.text-decoration-none {
    text-decoration: none !important;
}

.text-decoration-hover-none:hover,
.text-decoration-hover-none:focus {
    text-decoration: none !important;
}

.text-decoration-active-none.active,
.text-decoration-active-none:active,
.text-decoration-active-none[aria-expanded="true"] {
    text-decoration: none !important;
}

/*#################################
 Bootstrap text whitespace extends
 #################################*/

.text-normal {
    white-space: normal !important;
}

@media (min-width: 576px) {
    .text-sm-nowrap {
        white-space: nowrap !important;
    }

    .text-sm-normal {
        white-space: normal !important;
    }
}

@media (min-width: 768px) {
    .text-md-nowrap {
        white-space: nowrap !important;
    }

    .text-md-normal {
        white-space: normal !important;
    }
}

@media (min-width: 992px) {
    .text-lg-nowrap {
        white-space: nowrap !important;
    }

    .text-lg-normal {
        white-space: normal !important;
    }
}

@media (min-width: 1200px) {
    .text-xl-nowrap {
        white-space: nowrap !important;
    }

    .text-xl-normal {
        white-space: normal !important;
    }
}

/*#################################
 Bootstrap radius pills extends
 #################################*/

.mark-pill, .btn-pill, .badge-pill {
    border-radius: 30px !important;
}

.border-pill-0 {
    border-radius: 0 !important;
}

.border-pill-1 {
    border-radius: .186rem !important;
}

.border-pill-2 {
    border-radius: calc(.186rem * 2) !important;
}

.border-pill-3 {
    border-radius: calc(.186rem * 3) !important;
}

.border-pill-4 {
    border-radius: calc(.186rem * 4) !important;
}

.border-pill-30 {
    border-radius: 30px !important;
}

/*#################################
 Bootstrap colors extends
 #################################*/

.text-yellow {
    color: yellow !important;
}

.bg-yellow {
    background-color: yellow !important;
}

/*#################################
 Bootstrap horizontal line extends
 #################################*/

.hr-dashed-style {
    border-top-style: dashed !important;
}

/*#################################
 Bootstrap border style extends
 #################################*/

.border-top-dashed-style {
    border-top-style: dashed !important;
}

.border-bottom-dashed-style {
    border-bottom-style: dashed !important;
}

.border-left-dashed-style {
    border-left-style: dashed !important;
}

.border-right-dashed-style {
    border-right-style: dashed !important;
}

.border-top-2 {
    border-top-width: 2px !important;
}

.border-bottom-2 {
    border-bottom-width: 2px !important;
}

.border-left-2 {
    border-left-width: 2px !important;
}

.border-right-2 {
    border-right-width: 2px !important;
}

.border-top-3 {
    border-top-width: 3px !important;
}

.border-bottom-3 {
    border-bottom-width: 3px !important;
}

.border-left-3 {
    border-left-width: 3px !important;
}

.border-right-3 {
    border-right-width: 3px !important;
}

.border-top-success {
    border-top-color: #28a745 !important;
}

.border-bottom-success {
    border-bottom-color: #28a745 !important;
}

.border-left-success {
    border-left-color: #28a745 !important;
}

.border-right-success {
    border-right-color: #28a745 !important;
}

.border-top-danger {
    border-top-color: #dc3545 !important;
}

.border-bottom-danger {
    border-bottom-color: #dc3545 !important;
}

.border-left-danger {
    border-left-color: #dc3545 !important;
}

.border-right-danger {
    border-right-color: #dc3545 !important;
}

.border-top-warning {
    border-top-color: #ffc107 !important;
}

.border-bottom-warning {
    border-bottom-color: #ffc107 !important;
}

.border-left-warning {
    border-left-color: #ffc107 !important;
}

.border-right-warning {
    border-right-color: #ffc107 !important;
}

.border-top-primary {
    border-top-color: #007bff !important;
}

.border-bottom-primary {
    border-bottom-color: #007bff !important;
}

.border-left-primary {
    border-left-color: #007bff !important;
}

.border-right-primary {
    border-right-color: #007bff !important;
}

.border-top-light {
    border-top-color: #f8f9fa !important;
}

.border-bottom-light {
    border-bottom-color: #f8f9fa !important;
}

.border-left-light {
    border-left-color: #f8f9fa !important;
}

.border-right-light {
    border-right-color: #f8f9fa !important;
}

.border-top-secondary {
    border-top-color: #6c757d !important;
}

.border-bottom-secondary {
    border-bottom-color: #6c757d !important;
}

.border-left-secondary {
    border-left-color: #6c757d !important;
}

.border-right-secondary {
    border-right-color: #6c757d !important;
}

/*#################################
 Bootstrap navbar liner style extends
 #################################*/

.nav-tabs-liner {
    border: 0;
}

.nav-tabs-liner .nav-link {
    border: 0;
    box-shadow: 0px 1px 0px 0px #dee2e6;
}

.nav-tabs-liner .nav-link:hover {
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .3);
}

.nav-tabs-liner .nav-link.active,
.nav-tabs-liner .nav-link:active {
    background-color: #f8f9fa;
    box-shadow: 0px 0px 0px 1px #dee2e6;
}

/*Primary color*/
.nav-tabs-liner-primary .nav-link {
    border: 0;
    box-shadow: 0px 1px 0px 0px #dee2e6;
}

.nav-tabs-liner-primary .nav-link:hover {
    box-shadow: 0px 1px 0px 0px #007bff;
}

.nav-tabs-liner-primary .nav-link.active,
.nav-tabs-liner-primary .nav-link:active {
    color: #fff;
    background-color: #007bff;
    box-shadow: 0px 0px 0px 1px #007bff;
}

.nav-tabs-liner-primary .nav-link.disabled:hover {
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .3);
}

.nav-tabs-liner-primary .nav-link.disabled.active,
.nav-tabs-liner-primary .nav-link.disabled:active {
    color: #6c757d;
    /*color: #ced4da;*/
    background-color: #f8f9fa;
}

/*#################################
 Bootstrap tables extends
 #################################*/

@media (min-width: 0px) and (max-width: 1199px) {
    .table-responsive-vertical table,
    .table-responsive-vertical thead,
    .table-responsive-vertical tbody,
    .table-responsive-vertical th,
    .table-responsive-vertical td,
    .table-responsive-vertical tr {
        display: block;
    }

    .table-responsive-vertical thead tr,
    .table-responsive-vertical table > tbody:first-child > tr:first-child {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive-vertical td {
        white-space: normal;
        text-align: left;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .table-responsive-vertical td:before {
        text-align: left;
        display: block;
        margin-right: 1em;
        font-weight: bold;
        color: #212529;
    }

    .table-responsive-vertical td:before {
        content: attr(data-title);
    }

    .table-responsive-vertical td:not([data-title]):before {
        content: normal;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .table-responsive-vertical td {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .table-responsive-vertical td:before {
        white-space: nowrap;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .table-responsive-vertical td:before {
        display: inline-block;
    }

    .table-responsive-vertical td:before {
        content: attr(data-title);
    }
}

@media (min-width: 1200px) {
}


/*#################################
 Bootstrap accordion extends
#################################*/

.accordion > .card:first-child:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

/*#################################
 Bootstrap datepicker extends
 #################################*/

.datetimepicker .bootstrap-datetimepicker-widget table thead tr:first-child th {
    border-top-width: 0;
}

.datetimepicker .bootstrap-datetimepicker-widget table thead tr th {
    border-bottom-width: 1px;
}

.datetimepicker .bootstrap-datetimepicker-widget .prev,
.datetimepicker .bootstrap-datetimepicker-widget .next {
    width: auto;
    height: auto;
    line-height: 1;
    vertical-align: middle;
}

.datetimepicker .bootstrap-datetimepicker-widget .picker-switch {
    font-size: 20px;
    font-size: 1.25rem;
    font-weight: 300;
    vertical-align: middle;
    height: auto;
    line-height: 1;
}

.datetimepicker .bootstrap-datetimepicker-widget .prev,
.datetimepicker .bootstrap-datetimepicker-widget .next,
.datetimepicker .bootstrap-datetimepicker-widget .picker-switch {
    padding: 4.8px;
    padding: .3rem;
}

/*#################################
 Bootstrap list-group extends
 #################################*/

.list-group-striped > .list-group-item:nth-child(odd) {
    background: #f8f9fa;
}

/*#################################
 Bootstrap visibility
 #################################*/

.visible {
    visibility: visible !important;
}

.invisible {
    visibility: hidden !important;
}

.hidden {
    position: absolute !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    width: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
    top: -9999px !important;
    left: -9999px !important;
}

input.hidden:not([type='button']):not([type='search']):not([type='submit']):not([type='reset']):not([type='file']),
textarea.hidden {
    left: 0px !important;
    bottom: 0px !important;
    top: auto !important;
}


/*#################################
 Bootstrap fieldset
 #################################*/

fieldset {

}

/*#################################
 Bootstrap WYSIWYG
 #################################*/

textarea.form-control {
    min-height: calc(2.25rem + 2px);
}

.jodit_container > .jodit_toolbar > li:first-child {
    margin-left: 0 !important;
}

.jodit_container {
    min-height: 0 !important;
}

.jodit_container .jodit_workplace,
.jodit_container .jodit_wysiwyg {
    max-height: 100px !important;
    height: 100px !important;
    min-height: 100px !important;
}

.jodit_container > .jodit_toolbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

/*#################################
 Bootstrap Spacing
 #################################*/

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 576px) {
    .p-sm-5px {
        padding: 5px !important;
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 768px) {
    .p-md-5px {
        padding: 5px !important;
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 992px) {
    .p-lg-5px {
        padding: 5px !important;
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 1200px) {
    .p-xl-5px {
        padding: 5px !important;
    }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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


/*#################################
 Bootstrap modal extra large
 #################################*/

@media (min-width: 992px) {
    .modal-lg,
    .modal-xl {
        max-width: 800px;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1140px;
    }
}

/*#################################
 Bootstrap miltilangual supports
 #################################*/

.multilangual > .form-group {
    position: absolute !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    width: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    border: 0 !important;
    top: -9999px !important;
    left: -9999px !important;
}

.multilangual > .form-group:not(.hidden):first-child,
.multilangual > .form-group.active {
    position: static !important;
    overflow: visible !important;
    width: auto !important;
    height: auto !important;
    margin: initial !important;
    padding: initial !important;
}

.is-invalid .input-group-append .btn,
.is-invalid .input-group-prepend .btn,
.is-invalid ~ .input-group-append .btn,
.is-invalid ~ .input-group-prepend .btn {
    background-color: #dc3545;
    border-color: #dc3545;
}

.is-invalid .input-group-append .input-group-text,
.is-invalid .input-group-prepend .input-group-text,
.is-invalid ~ .input-group-append .input-group-text,
.is-invalid ~ .input-group-prepend .input-group-text {
    border-color: #dc3545;
}

.is-valid .input-group-append .btn,
.is-valid .input-group-prepend .btn,
.is-valid ~ .input-group-append .btn,
.is-valid ~ .input-group-prepend .btn {
    background-color: #28a745;
    border-color: #28a745;
}

.is-valid .input-group-append .input-group-text,
.is-valid .input-group-prepend .input-group-text,
.is-valid ~ .input-group-append .input-group-text,
.is-valid ~ .input-group-prepend .input-group-text {
    border-color: #28a745;
}

.is-invalid .input-group-append .btn.focus,
.is-invalid .input-group-append .btn:focus,
.is-invalid .input-group-prepend .btn.focus,
.is-invalid .input-group-prepend .btn:focus,
.is-invalid ~ .input-group-append .btn.focus,
.is-invalid ~ .input-group-append .btn:focus,
.is-invalid ~ .input-group-prepend .btn.focus,
.is-invalid ~ .input-group-prepend .btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.37);
}

.is-valid .input-group-append .btn.focus,
.is-valid .input-group-append .btn:focus,
.is-valid .input-group-prepend .btn.focus,
.is-valid .input-group-prepend .btn:focus,
.is-valid ~ .input-group-append .btn.focus,
.is-valid ~ .input-group-append .btn:focus,
.is-valid ~ .input-group-prepend .btn.focus,
.is-valid ~ .input-group-prepend .btn:focus {
    box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, .25);
}

/*#################################
 Bootstrap validation fix
 #################################*/

.is-invalid ~ .invalid-tooltip,
.is-invalid ~ .invalid-feedback {
    display: block;
}

/*.is-valid .input-group-text*/