@import url("./fonts.css");

.navbar {
    height: 80px;
}

.dark-mode {
    background-color: #000000;
    color: #ffffff;
}

.invalid {
    border: 2px solid red;
}

.validation-message {
    color: red;
}

.hover-grow:hover {
    transform: scale(1.5); /* Adjust scale value as needed */
    transition: transform 0.3s ease; /* Smooth transition */
}

#blazor-error-ui {
    color: white;
    background: #343a40;
    bottom: 0;
    box-shadow: 0 -1px 2px #000000;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .reload {
        font-weight: bold;
    }

    #blazor-error-ui .dismiss {
        cursor: pointer;
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

#update-available {
    visibility: hidden;
    background-color: #4A494A;
    color: #fff;
    text-align: center;
    border-radius: .5rem;
    padding: 1rem;
    position: fixed;
    z-index: 1;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -10%);
}

    #update-available.show {
        visibility: visible;
        -webkit-animation: updateFade 0.5s;
        animation: updateFade 0.5s;
    }

    #update-available a.reload {
        color: #4e9f9e;
        cursor: pointer;
        font-weight: bold;
    }

/* FROM Web App*/
body {
    font-family: "Roboto", sans-serif;
    font-weight: 400;
    background-color: #FCFCFC;
    color: #4A494A;
    height: 100%;
    min-height: 100%;
}

    body[data-dark='true'] {
        background-color: #191d21;
        color: #d1d1d1;
    }

        body[data-dark='true'] h1,
        body[data-dark='true'] h2,
        body[data-dark='true'] h3,
        body[data-dark='true'] h4,
        body[data-dark='true'] h5,
        body[data-dark='true'] h6,
        body[data-dark='true'] .alerts {
            color: #d1d1d1;
        }

        body[data-dark='true'] .text-secondary {
            color: #d1d1d1 !important;
        }

        body[data-dark='true'] .form-control {
            border: 2px solid #dddddd;
            border: 2px solid rgba(255, 255, 255, .25);
            background-color: transparent;
        }

            body[data-dark='true'] .form-control:focus {
                border: 2px solid #4e9f9e;
            }

                body[data-dark='true'] .form-control:valid ~ .form-control-placeholder,
                body[data-dark='true'] .form-control:valid ~ .form-control-show-placeholder,
                body[data-dark='true'] .form-control:focus ~ .form-control-show-placeholder,
                body[data-dark='true'] .form-control:placeholder-shown ~ .form-control-show-placeholder,
                body[data-dark='true'] .form-control:focus ~ .form-control-placeholder {
                    background-image: linear-gradient(to bottom, transparent 42%, #191d21 42%);
                }

            body[data-dark='true'] .form-control:disabled ~ .form-control-show-placeholder,
            body[data-dark='true'] .form-control[readonly] ~ .form-control-show-placeholder {
                background-image: linear-gradient(to bottom, transparent 61%, #191d21 61%);
            }

/* Main Layout*/
.content {
    min-height: calc(100vh - 80px - 60px - 44px);
    overflow-x: hidden;
}
.content-blank {
    min-height: calc(100vh - 9.725rem);
    overflow-x: hidden;
}

.content-na {
    min-height: calc(100vh - 5.313rem);
    background-color: #384F80;
    background-image: url('/images/MSE-Background.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

    .content-na .validation-message {
        color: #EEF3DC;
    }

    .content-na .not-found {
        align-items: center;
        height: 80vh;
    }

        .content-na .not-found * {
            color: #ffffff;
        }

        .content-na .not-found #welcomeImage {
            margin-top: 5%;
            margin-bottom: 10%;
            display: block;
            text-indent: 100%;
            overflow: hidden;
            background-image: url('/images/MSE-LOGO-WHITE.png');
            background-repeat: no-repeat;
            background-position: center top;
            background-size: contain;
            height: 150px;
            cursor: pointer;
        }
/*NAVIGATION STYLES*/
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(74, 73, 74, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")
}

/* BREADCRUMBS */
.breadcrumb {
    background-color: transparent;
}

.breadcrumb-item a {
    padding-left: .5rem;
}

.breadcrumb-item + .breadcrumb-item::before {
    content: "";
    border-top: .4em solid;
    border-right: .4em solid transparent;
    border-left: .4em solid transparent;
    margin-top: .5rem;
    padding: 0;
    -webkit-transform: rotate( 270deg );
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    display: inline-block;
    vertical-align: text-top;
}

/* ALERTS */
.fa-stack.fa-lg {
    height: auto;
    top: -7px;
}

.alerts {
    color: #4A494A;
}

    .alerts:hover svg {
        color: #4e9f9e;
        animation: bellshake .7s cubic-bezier(.36,.07,.19,.97) both infinite;
    }

.shake svg {
    animation: bellshake .7s cubic-bezier(.36,.07,.19,.97) both 5;
}

.new-alerts svg {
    color: tomato;
    font-size: 0.525rem;
    right: -0.65rem;
    top: -0.55rem;
    width: auto;
}

/* Overrides */
/** {
    box-shadow: none !important;
}*/
/*::-webkit-calendar-picker-indicator {
    filter: invert(58%) sepia(30%) saturate(607%) hue-rotate(130deg) brightness(92%) contrast(86%);
}*/
:focus {
    outline: unset;
}

select {
    color: #404041;
}

h1, h2, h3, h4, h5, h6 {
    color: #404041;
}

a, a:hover, a:active, a:focus {
    color: #384F80;
}
/* Scollbar */
.scrollbar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #000000;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
    background-color: #F5F5F5;
    border-radius: 0.625rem;
}

.scrollbar::-webkit-scrollbar {
    width: 0.75rem;
    background-color: #F5F5F5;
    border-radius: 0.625rem;
}

.scrollbar::-webkit-scrollbar-thumb {
    border-radius: 0.625rem;
    -webkit-box-shadow: inset 0 0 6px #000000;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
    background-color: #999999;
}

.scrollbar-thin::-webkit-scrollbar {
    width: 0.375rem;
}

/* Dropdowns */
.dropdown-item.active, .dropdown-item:active {
    text-decoration: none;
    background-color: #384F80;
    background-color: rgba(56, 79, 128, .2);
    color: #384f80;
    cursor: pointer;
}

.dropdown-toggle {
    font-size: 14px;
}
/* Rotate the caret if expanded */
a.dropdown-toggle::after {
    margin-left: .75em;
    vertical-align: .1em;
    border-top: .4em solid;
    border-right: .4em solid transparent;
    border-left: .4em solid transparent;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.show > a.dropdown-toggle::after, a[data-toggle="collapse"]:not(.collapsed).dropdown-toggle::after {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.dropdown-menu.fade {
    display: block;
    opacity: 0;
    pointer-events: none;
}

.show > .dropdown-menu.fade {
    pointer-events: auto;
    opacity: 1;
}

.expandable.collapsed .fa-chevron-down {
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

.expandable:not(.collapsed) .fa-chevron-down {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}
/* Inputs */
.input-group > .custom-file .custom-file-input:focus ~ .custom-file-label, .input-group > .custom-select:focus, .input-group > .form-control:focus {
    z-index: auto;
}

.input-group-append .btn, .input-group-prepend .btn {
    z-index: auto;
}

.form-control {
    border: 2px solid #ced4da;
    border-radius: .5rem;
}

    .form-control:focus {
        border-color: #ced4da;
    }

        .form-control:focus, .form-control:focus ~ button {
            border-color: #4E9F9E;
        }

.form-control-placeholder,
.form-control-show-placeholder {
    position: absolute;
    top: 0;
    transition-property: transform, font-size, padding;
    transition-duration: 200ms;
    margin: 0.3rem 0.625rem;
    padding-bottom: 0;
    color: #6c757d;
    pointer-events: none;
}

.form-control:valid ~ .form-control-placeholder,
.form-control:valid ~ .form-control-show-placeholder,
.form-control:focus ~ .form-control-show-placeholder,
.form-control:placeholder-shown ~ .form-control-show-placeholder,
.form-control:focus ~ .form-control-placeholder {
    font-size: 0.75rem;
    margin: 0 0.625rem;
    transform: translateY(-62%);
    background-image: linear-gradient(to bottom, transparent 42%, #ffffff 42%);
}

.form-control:disabled ~ .form-control-show-placeholder,
.form-control[readonly] ~ .form-control-show-placeholder {
    background-image: linear-gradient(to bottom, transparent 61%, #e9ecef 61%);
}

.form-control:disabled:not(:placeholder-shown) ~ .form-control-show-placeholder {
    font-size: 0.75rem;
    margin: 0 0.625rem;
    transform: translateY(-62%);
}

.form-control:focus ~ .form-control-placeholder, .form-control:focus ~ .form-control-show-placeholder {
    color: #4E9F9E;
}

.placeholder-hide::-webkit-input-placeholder {
    font-size: 0;
}

label {
    font-size: 0.875rem;
    padding: .375rem;
    padding-top: .2rem;
}

.label.active {
    color: #404041;
}

.custom-control {
    z-index: auto;
}

.custom-control-input {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%404041' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
}

.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
    color: #404041;
    background-color: #384f80;
    background-color: rgba(56, 79, 128, 0.2);
    border-color: #384f80;
}

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #384f80;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #ced4da;
    border-color: #384f80;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #404041;
    background-color: #ced4da;
}

.custom-checkbox .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: none;
}

/***** Multiselect Dropdown with Checkboxes *****/
.checkbox-menu-btn {
    position: relative;
}

    .checkbox-menu-btn button {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23404041' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
        background-repeat: no-repeat;
        background-position: right .75rem center;
        background-size: 16px 12px;
        text-align: left;
        border: 2px solid #ced4da;
    }

        .checkbox-menu-btn button:hover {
            border: 2px solid #478e8d;
        }

        .checkbox-menu-btn button:focus {
            border-color: #478e8d;
            outline: 0;
            box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
        }

        .checkbox-menu-btn button:active {
            border-color: #ced4da;
        }

.checkbox-menu input:hover,
.checkbox-menu input:focus {
    cursor: pointer;
}

.checkbox-hover {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
}

    .checkbox-hover:hover,
    .checkbox-hover:focus {
        background-color: #384f80;
        background-color: rgba(56, 79, 128, 0.2);
        cursor: pointer;
    }

    .checkbox-hover.active,
    .checkbox-hover.active label {
        /*background-color: #384f80;*/
        font-weight: bold;
    }

.form-check-input:checked {
    background-color: #fff;
    border-color: #fff;
}

    .form-check-input:checked[type=checkbox] {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
        border-radius: .25em;
    }
/*Set Bootstrap 'btn, label, text' to EDGE colors*/
.btn {
    border-radius: .5rem;
    border: 2px solid transparent;
    font-size: 14px;
    font-weight: bold;
}

.btn-success, .label-success {
    background-color: #4E9F9E;
    border-color: #4E9F9E;
}

    .btn-success:hover, .btn-success.focus, .btn-success:focus {
        background-color: #478e8d;
        border-color: #478e8d;
    }

    .btn-success.disabled, .btn-success:disabled {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }

    /*.btn-success.focus, .btn-success:focus {
        box-shadow: 0 0 0 0.2rem rgba(78, 159, 158, .5);
    }*/

    .btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show > .btn-success.dropdown-toggle {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }

.btn-outline-success {
    border-color: #4E9F9E;
    color: #4E9F9E;
}

    .btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, .show > .btn-outline-success.dropdown-toggle {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }

    .btn-outline-success:hover {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }


.btn-primary, .label-primary {
    background-color: #4E9F9E;
    border-color: #4E9F9E;
}

    .btn-primary.disabled, .btn-primary:disabled {
        background-color: #4E9F9E;
        background-color: rgba(71, 142, 141, 0.8);
        border-color: #4E9F9E;
        border-color: rgba(71, 142, 141, 0.8);
        color: #fff;
    }

    .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
        background-color: #4E9F9E;
        background-color: rgba(71, 142, 141, 0.8);
        border-color: #4E9F9E;
        border-color: rgba(71, 142, 141, 0.8);
        color: #fff;
    }

    .btn-primary:hover, .btn-primary.focus, .btn-primary:focus {
        background-color: #4E9F9E;
        background-color: rgba(71, 142, 141, 0.8);
        border-color: #4E9F9E;
        border-color: rgba(71, 142, 141, 0.8);
        color: #fff;
    }

.btn-outline-primary {
    border-color: #4E9F9E;
    color: #4E9F9E;
}

    .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }

    .btn-outline-primary:hover {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
        color: #fff;
    }

    .btn-outline-primary.disabled, .btn-outline-primary:disabled {
        color: #4E9F9E;
        color: rgba(71, 142, 141, 0.8);
    }

        .btn-outline-primary.disabled:hover, .btn-outline-primary:disabled:hover {
            color: #4E9F9E;
            background-color: #fff;
            border-color: #ced4da;
        }

.btn-outline-secondary {
    border-color: #6c757d;
}

.btn-warning {
    background-color: #EEF3DC;
    border-color: #EEF3DC;
}

    .btn-warning:hover {
        background-color: #EEF3DC;
        border-color: #EEF3DC;
    }

.btn-group > .btn {
    float: none;
}

.btn-block {
    white-space: normal;
}

.btn-group-xs > .btn, .btn-xs {
    font-size: .875rem;
    line-height: .5;
    padding: .5rem .4rem;
}

/* Date Range Picker */
body[data-dark='true'] .daterangepicker, body[data-dark='true'] .daterangepicker .drp-buttons .cancelBtn {
    color: #4a494a
}

.daterangepicker {
    box-shadow: 0 0 10px rgb(0 0 0 / 40%) !important;
}

    .daterangepicker .ranges li.active, .daterangepicker td.start-date, .daterangepicker td.end-date, .daterangepicker td.active:hover {
        background-color: #384F80;
    }

    .daterangepicker .ranges li:hover, .daterangepicker td.available:hover, .daterangepicker th.available:hover, .daterangepicker td.in-range {
        color: #404041;
        background-color: #D1DDEB;
    }

    .daterangepicker .cancelBtn:hover {
        text-decoration: underline;
    }
/* Font color classes */
.text-success {
    color: #4E9F9E !important;
}

a.text-success:focus, a.text-success:hover {
    color: #478e8d !important;
    color: rgba(71, 142, 141, 0.8) !important;
}

.text-warning {
    color: #EEF3DC !important;
}

a.text-warning:focus, a.text-warning:hover {
    color: #c1c7a9 !important;
}

.text-primary {
    color: #384F80 !important;
}

.text-secondary {
    color: #4A494A;
}

.text-xs {
    font-size: 60%;
}

.vertical-divider::before {
    background: #ced4da;
    width: 1px;
    content: "";
    display: inline-block;
    position: relative;
    vertical-align: middle;
    min-height: 1.5rem;
}

/* Override Bootstrap sizes */
.pt-2_5 {
    padding-top: .75rem !important;
}

.mb-6 {
    margin-bottom: 6rem !important;
}

.validation-summary-errors ul {
    list-style: unset;
    list-style-type: none;
}

.label {
    padding: .5em .5em .5em;
}

/* Query Linker */
.linker {
    display: inline-flex;
}

    .linker::before {
        content: "";
        position: absolute;
        right: -1.5rem;
        left: 3rem;
        top: .7rem;
        border-bottom: 3px solid #ced4da;
    }

    .linker::after {
        content: "";
        position: absolute;
        top: -1.5rem;
        left: 3rem;
        height: 4rem;
        border-left: 3px solid #ced4da;
    }

    .linker.linker-first::after {
        height: 2.4rem;
        top: .8rem;
    }

    .linker.linker-last::after {
        height: 2.3rem;
    }

    .linker.linked::before, .linker.linked::after,
    .linker.linked-both::before, .linker.linked-both::after,
    .linker.linked-top::before, .linker.linked-bottom::before {
        border-color: #4A494A;
    }

    .linker:not(.linker-last).linked-top::after {
        border-image: linear-gradient(to bottom, #4A494A 59%, #ced4da 59%) 1;
    }

    .linker:not(.linker-last).linked-bottom::after {
        border-image: linear-gradient(to bottom, #ced4da 55%, #4A494A 55%) 1
    }

.linker-action {
    position: absolute;
    top: .1rem;
    left: 2rem;
    cursor: pointer;
    z-index: 1;
}

    .linker-action.linked .fa-circle {
        color: #4E9F9E;
    }

    .linker-action.linked .fa-minus {
        color: #FCFCFC;
    }

    .linker-action .fa-circle {
        color: #ced4da;
    }

    .linker-action .fa-plus {
        color: #4A494A;
    }

/* Table Range Filters */
input[type=range] {
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    overflow: hidden;
    background: linear-gradient(#4E9F9E, #4E9F9E) no-repeat center;
    background-size: 100% 2px;
    pointer-events: none;
}

    input[type=range]:active,
    input[type=range]:focus {
        outline: none;
    }

    input[type=range]::-webkit-slider-thumb {
        height: 1rem;
        width: 1rem;
        border-radius: 1rem;
        z-index: 1;
        background-color: #ffffff;
        position: relative;
        margin: .313rem 0;
        cursor: pointer;
        -webkit-appearance: none;
        pointer-events: all;
        box-shadow: 0 1px 4px 0.5px #000000;
        box-shadow: 0 1px 4px 0.5px rgba(0, 0, 0, 0.25);
    }

    input[type=range]::-webkit-slider-runnable-track {
    }

.multi-range {
    position: relative;
}

    .multi-range input[type=range] {
        position: absolute;
    }

        .multi-range input[type=range]:nth-child(1)::-webkit-slider-thumb::before {
            background-color: #ffffff;
        }

        .multi-range input[type=range]:nth-child(2) {
            background: none;
            margin-left: 1rem;
        }

            .multi-range input[type=range]:nth-child(2)::-webkit-slider-thumb::before {
                background-color: #384F80;
            }

/* Icons */
.chart-icon {
    content: url("/images/chart-icon.svg");
    filter: invert(50%) sepia(8%) saturate(2247%) hue-rotate(130deg) brightness(111%) contrast(89%);
    width: 1.5rem;
}

.chart-icon-bms {
    content: url("/images/chart-icon.svg");
    filter: invert(89%) sepia(27%) saturate(110%) hue-rotate(33deg) brightness(104%) contrast(92%);
    width: 2rem;
}

.chart-icon-loader {
    content: url("/images/chart-icon-loader.svg");
    filter: invert(50%) sepia(8%) saturate(2247%) hue-rotate(130deg) brightness(111%) contrast(89%);
    width: 5rem;
}

.chart-icon-loader-xl {
    width: 10rem;
}

.chart-icon-bms-sm {
    content: url("/images/chart-icon.svg");
    filter: invert(89%) sepia(27%) saturate(110%) hue-rotate(33deg) brightness(104%) contrast(92%);
    width: 1.2rem;
}

.search-icon {
    content: url("/images/search-icon.svg");
    filter: invert(50%) sepia(8%) saturate(2247%) hue-rotate(130deg) brightness(111%) contrast(89%);
    width: 1.2rem;
}

.dynamic-icon {
    content: url("/images/dynamic-portfolio-icon.svg");
    filter: invert(50%) sepia(8%) saturate(2247%) hue-rotate(130deg) brightness(111%) contrast(89%);
    width: 1.5rem;
}

.portfolio-icon {
    content: url("/images/traditional-portfolio-icon.svg");
    filter: invert(50%) sepia(8%) saturate(2247%) hue-rotate(130deg) brightness(111%) contrast(89%);
    width: 1.5rem;
}

.close-icon {
    content: url("/images/close-icon.svg");
    width: 1rem;
}

body[data-dark='true'] .close-icon {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate( 0deg) brightness(1000%) contrast(1000%);
}

/* Rounded Toggle Switch (Sliders)*/
.slider.round {
    border-radius: 34px !important;
}

    .slider.round:before {
        border-radius: 50%;
    }
/* Slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #999999;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 13px;
        width: 13px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

.slider-sm {
    width: 27px;
    height: 14px;
}

    .slider-sm:before {
        height: 10px;
        width: 10px;
    }

input:checked + .slider {
    background-color: #4e9f9e;
}

input:checked:disabled + .slider {
    background-color: #4E9F9E;
    background-color: rgba(71, 142, 141, 0.6);
}

input:focus + .slider {
    box-shadow: 0 0 1px #4e9f9e;
}

input:checked + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 17px;
    margin-bottom: 0;
    line-height: 1.125rem;
    vertical-align: text-top;
}

    /* Hide default HTML checkbox */
    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

        .switch input:disabled + .slider {
            cursor: not-allowed;
        }

/* Loader */
#wrapper {
    background: #525252;
    background: rgba(0, 0, 0, 0.7);
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
    position: fixed;
    transition: opacity .7s;
    z-index: 3;
}

    #wrapper.fade {
        opacity: 0;
    }

#loader {
    border-radius: 50% !important;
    height: 10em;
    width: 10em;
    -ms-transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    -webkit-transform: translateZ(0);
    animation: mainLoader 1.1s infinite linear;
    border-bottom: 1.1em solid #808080;
    border-bottom: 1.1em solid rgba(238, 243, 220, 0.2);
    border-left: 1.1em solid #4E9F9E;
    border-right: 1.1em solid #808080;
    border-right: 1.1em solid rgba(238, 243, 220, 0.2);
    border-top: 1.1em solid #808080;
    border-top: 1.1em solid rgba(238, 243, 220, 0.2);
    margin: 40vh auto;
    position: relative;
    text-indent: -9999em;
    transform: translateZ(0);
}

/* Animations */
@keyframes pop-in {
    0% {
        opacity: 0;
        transform: scale(0.25);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes pop-out {
    0% {
        opacity: 1;
        transform: scale(1);
    }

    100% {
        opacity: 0;
        transform: scale(0.25);
        visibility: hidden;
    }
}

@keyframes mainLoader {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes bellshake {
    0% {
        transform: rotate(0);
    }

    15% {
        transform: rotate(5deg);
    }

    30% {
        transform: rotate(-5deg);
    }

    45% {
        transform: rotate(4deg);
    }

    60% {
        transform: rotate(-4deg);
    }

    75% {
        transform: rotate(2deg);
    }

    85% {
        transform: rotate(-2deg);
    }

    92% {
        transform: rotate(1deg);
    }

    100% {
        transform: rotate(0);
    }
}

@keyframes updateFade {
    from {
        bottom: -20%;
        opacity: 0;
    }

    to {
        bottom: 0;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeout {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 0;
    }
}

/*Media Queries*/
/*X-Small*/
@media screen and (max-width: 600px) {
    .portfolio-title-select p {
        font-size: 0.875rem;
    }

    .portfolio-title-select h1 {
        font-size: 1.5625rem;
    }

    #portfolioDashboard h3 {
        font-size: 1.625rem;
    }

    .chart-icon-bms, .chart-icon-bms-sm {
        filter: invert(56%) sepia(16%) saturate(1081%) hue-rotate(130deg) brightness(96%) contrast(89%);
    }

    /* .btn-success, .label-success {
        background-color: unset;
        border-color: unset;
    }*/

    .broadMktViz {
        color: #212529;
        margin-bottom: 2rem;
    }

    .visible-xs {
        display: block;
    }

    .dropdown-menu {
        font-size: 0.875rem;
    }
}

/*Small*/

@media screen and (min-width: 600px) {
    .portfolioFilters .dropdown-toggle::after {
        float: right;
        margin-top: 8px;
        text-align: right;
    }

    .portfolioFilters .dropdown-toggle {
        text-align: left;
    }

    .chart-icon-bms, .chart-icon-bms-sm {
        filter: invert(56%) sepia(16%) saturate(1081%) hue-rotate(130deg) brightness(96%) contrast(89%);
    }

    /*.btn-success, .label-success {
        background-color: unset;
        border-color: unset;
    }*/

    .broadMktViz {
        color: #212529;
        margin-bottom: 2rem;
    }
}

/*Medium*/

@media screen and (min-width: 768px) {
    .dropdown-menu {
        font-size: 0.8125rem;
    }
}

@media screen and (max-width: 768px) {
    .content {
        min-height: calc(100vh - 12.75rem);
    }
}
/*Large*/

@media screen and (min-width: 992px) {
    .chart-icon-bms, .chart-icon-bms-sm {
        filter: invert(89%) sepia(27%) saturate(110%) hue-rotate(33deg) brightness(104%) contrast(92%);
    }

    .btn-success, .label-success {
        background-color: #4E9F9E;
        border-color: #4E9F9E;
    }

    .broadMktViz {
        color: white;
        margin-bottom: unset;
    }

    .dropdown-menu {
        font-size: 0.8125rem;
    }
}

/*X-Large*/

@media screen and (min-width: 1200px) {
    .dropdown-menu {
        font-size: 1rem;
    }
}

@media screen and (min-width: 1400px) {
}


/* The Modal (background) */
.modalm {
  display: block; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  max-width: 600px;
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-contentm {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

  .close:hover,
  .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  }