@import url("/static/css/Montserrat.css");

body {
    font-family: "Open Sans", sans-serif;
    /* zoom: 90%; */
}

/*
p{
  color:#8e8e8e;
  letter-spacing: 1px;
  font-weight: 200;
  line-height: 20px;
}
*/



body.brand_bg {
    background: url("/static/img/clouds.png") no-repeat center center fixed;
}

.label-one {
    background-color: #e8a422;
}

.label-two {
    background-color: #25c114;
}

.label-three {
    background-color: #27cec7;
}

.label-four {
    background-color: #da7cc5;
}

i.feature-flag-tag > span {
    font-family: 'Open Sans', sans-serif;
    font-weight: normal;
}

.navbar-inverse {
    background-color: #78a3ca !important;
    border-color: #6285a5 !important;
}

.navbar-inverse .navbar-brand {
    color: #edf3f9 !important;
    letter-spacing: 8px !important;
    margin-left: 10px !important;
    margin-top: 2px !important;
}

.navbar-inverse .navbar-nav > li > a {
    color: #edf3f9 !important;
}

.navbar-header p {
    color: #c4dbf1 !important;
}


#logout_container {
    -webkit-box-shadow: 0px 1px 10px #888;
    background: rgba(230, 230, 230, .7);
    border-radius: 10px;
    box-shadow: 0px 1px 10px #888;
}


#login_form_container {
    -webkit-box-shadow: 0px 1px 10px #888;
    background: rgba(230, 230, 230, .7);
    border-radius: 10px;
    box-shadow: 0px 1px 10px #888;
    z-index: 1031; /* just above the bootstrap navbar-fixed footer if any */
}

/* Remove .btn and .btn-primary borders */
.btn, .btn.disabled, .btn[disabled], .btn:hover,
.btn-primary, .btn-primary.disabled, .btn-primary[disabled] {
  border-color: transparent;
}

/* Set .btn class to have a shadow on hover */
.btn:hover {
  box-shadow: 1px 4px 9px 1px rgba(109, 109, 109, 0.75);
}

/* Remove box-shadow from .btn-link */
.btn-link:hover {
  box-shadow: none;
}

/* Add the bootstrap default border color to .btn-default since it was removed above */
.btn-default, .btn-default:hover {
    border-color: #455555;
}

/* SECONDARY THEME STYLES */
/* BTNS */
.btn-secondary {
    background-color: #6fa75a;
    border-color: #5d9549;
    color: #fff;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary.focus,
.btn-secondary:active,
.btn-secondary.active,
.open > .dropdown-toggle.btn-secondary {
    background-color: #50853c;
    border-color: #487d35;
    color: #fff;
}
.btn-secondary.disabled,
.btn-secondary[disabled],
fieldset[disabled] .btn-secondary,
.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
fieldset[disabled] .btn-secondary:hover,
.btn-secondary.disabled:focus,
.btn-secondary[disabled]:focus,
fieldset[disabled] .btn-secondary:focus,
.btn-secondary.disabled.focus,
.btn-secondary[disabled].focus {
    background-color: #96b58b;
    border-color: #6f9373;
}
fieldset[disabled] .btn-secondary.focus,
.btn-secondary.disabled:active,
.btn-secondary[disabled]:active,
fieldset[disabled]  .btn-secondary:active,
.btn-secondary.disabled.active,
.btn-secondary[disabled].active,
fieldset[disabled] .btn-secondary.active {
    background-color: #96b58b;
    border-color: #6f9373;
}

/* OUTLINE BUTTONS */
/** primary **/
.btn-outline-primary {
    color: #6293bf;
    border-color: #6293bf;
    background-color: #fff;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary.focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.open>.dropdown-toggle.btn-outline-primary {
    color: #6293bf;
    border-color: #6293bf;
    background-color: #fff;
}
.btn-outline-primary.disabled,
.btn-outline-primary[disabled] {
    border-color: #6293bf;
}

/** secondary **/
.btn-outline-secondary {
    color: #6fa75a;
    border-color: #6fa75a;
    background-color: #fff;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary.focus,
.btn-outline-secondary:active,
.btn-outline-secondary.active,
.open>.dropdown-toggle.btn-outline-secondary {
    color: #fff;
    background-color: #6fa75a;
    border-color: #6fa75a;
}
.btn-outline-secondary.disabled,
.btn-outline-secondary[disabled] {
    border-color: #6fa75a;
}

/** success **/
.btn-outline-success {
    color: #64B64C;
    border-color: #64B64C;
    background-color: #fff;
}
.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success.focus,
.btn-outline-success:active,
.btn-outline-success.active,
.open>.dropdown-toggle.btn-outline-success {
    color: #64B64C;
    border-color: #64B64C;
    background-color: #fff;
}
.btn-outline-success.disabled,
.btn-outline-success[disabled] {
    border-color: #64B64C;
}

/** info **/
.btn-outline-info {
    color: #3aaef7;
    border-color: #3aaef7;
    background-color: #fff;
}
.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info.focus,
.btn-outline-info:active,
.btn-outline-info.active,
.open>.dropdown-toggle.btn-outline-info {
    color: #3aaef7;
    border-color: #3aaef7;
    background-color: #fff;
}
.btn-outline-info.disabled,
.btn-outline-info[disabled] {
    border-color: #3aaef7;
}

/** warning **/
.btn-outline-warning {
    color: #f0ad4e;
    border-color: #f0ad4e;
    background-color: #fff;
}
.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning.focus,
.btn-outline-warning:active,
.btn-outline-warning.active,
.open>.dropdown-toggle.btn-outline-warning {
    color: #f0ad4e;
    border-color: #f0ad4e;
    background-color: #fff;
}
.btn-outline-warning.disabled,
.btn-outline-warning[disabled] {
    border-color: #f0ad4e;
}

/** danger **/
.btn-outline-danger {
    color: #d9534f;
    border-color: #d9534f;
    background-color: #fff;
}
.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger.focus,
.btn-outline-danger:active,
.btn-outline-danger.active,
.open>.dropdown-toggle.btn-outline-danger {
    color: #d9534f;
    border-color: #d9534f;
    background-color: #fff;
}
.btn-outline-danger.disabled,
.btn-outline-danger[disabled] {
    border-color: #d9534f;
}

/* BACKGROUNDS */
.bg-secondary {
    background-color: #6fa75a;
    color: #fff;
}
a.bg-secondary:hover {
    background-color: #50853c;
}
/* Text */
.text-secondary {
    color: #6fa75a;
}
a.text-secondary:hover {
    color: #50853c;
}
/* Labels */
.label-secondary {
    background-color: #6fa75a;
}
.label-secondary[href]:hover,
.label-secondary[href]:focus {
    background-color: #50853c;
}
/* Panels */
.panel-secondary {
    border-color: #6fa75a;
}
.panel-secondary .panel-heading {
    background-color: #6fa75a;
    border-color: #6fa75a;
}


.nav-side-menu {
    background-color: #78a3ca;
    color: #97dade;
}

.nav-side-menu ul .active,
.nav-side-menu li .active {
    -webkit-box-shadow: -2px 0 15px 0px #888;
    background-color: #fff;
    border-left: 3px solid #fafafa;
    box-shadow: -2px 0 15px 0px #888;
    color: #000;
}

.nav-side-menu ul .active a,
.nav-side-menu li .active a {
    color: #000;
}

.nav-side-menu ul .sub-menu li {
    border-left: 3px solid #2e353d;
}

.nav-side-menu ul .sub-menu li.active,
.nav-side-menu li .sub-menu li.active {
    color: #000;
}
.nav-side-menu ul .sub-menu li.active a,
.nav-side-menu li .sub-menu li.active a {
    color: #000;
}

.nav-side-menu ul .sub-menu li:hover,
.nav-side-menu li .sub-menu li:hover {
    background-color: #2e868b;
}


.quiz.list-group-item {
    background-color: rgba(55, 160, 166, .1);
    padding: 0px;
    padding-left: 30px;
}

#footer_wrapper {
    background-color: #ddd;
}

.nav-side-menu li {
    border-bottom: 1px solid #e1ffff;
}
.nav-side-menu a li {
    color: #e1ffff;
}
.nav-side-menu li:hover {
    background-color: #6291ba;
}
.nav-side-menu ul li.active:hover {
    background-color: #fafafa;
}


@media (max-width: 767px) {
    .nav-side-menu .toggle-btn {
        background-color: #fff;
    }
}

.auction-panel .panel-body div.auction-row div span.title {
    color: #848484;
}

.auction-panel .panel-body div.auction-row {
    border-bottom: 1px solid #ced2d3;
}

/*Styles for education*/

header {
    color: #8e8e8e;
    margin-bottom: 10px;
}

.headline {
    color: #8e8e8e;
}

.module_thumb {
    position: relative;
}

.course-outline ul a.list-group-item-success li {
    color: white;
}

.nav.list-group-item-success {
    background-color: rgb(55, 160, 166);
}

a.nav.list-group-item-success:hover,
a.nav.list-group-item-success:focus {
    background-color: rgb(46, 134, 139);
}

.edu-module-card:hover {
    text-decoration: none;
}

.edu-module-card {
    height: 300px;
    padding-right: 10px;
}

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

.edu-desc {
    background-color: #e64747;
    border-color: #c7c7c7;
    border-style: solid;
    border-width: 1px;
    color: #fff;
    margin-top: -2px;
    min-height: 120px;
    padding: 15px;
    width: 275px;
}

.desc-text {
    color: #8e8e91;
    font-size: 16px;
}


.course-outline ul {
    list-style: none;
    padding-left: 0px;
}

.course-outline ul li {
    border-radius: 5px;
    color: #8e8e91;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    line-height: 30px;
    max-width: 300px;
    padding: 5px;
    padding-left: 10px;
}

.course-outline ul li:hover {
}


.button {
    background-color: white;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #8e8e91;
    padding: 10px;
}

.button:hover {
    background-color: #59b1fd;
    border-color: white;
    color: white;
    text-decoration: none;
}

.note-type-label {
    background-color: #6293bf;
}


#feature-flag-table,
div.note-modal #feature-flag-table {
    border-collapse: separate;
    border-spacing: 2px;
    margin-bottom: 10px !important;
}

#feature-flag-table th,
div.note-modal #feature-flag-table th {
    border-radius: 15px;
    font-size: 12px;
    font-weight: bold !important;
    padding: 8px 8px 5px 8px;
    padding-bottom: 5px;
    text-align: center !important;
}

.table > tbody > tr.feature1 > th {
    background-color: #f3d397 !important;
}

.table > tbody > tr.feature2 > th {
    background-color: #b7e4fb !important;
}

.table > tbody > tr.feature3 > th {
    background-color: #c1eab0 !important;
}
.table > tbody > tr.feature4 > th {
    background-color: #bacbfd !important;
}
.table > tbody > tr.feature5 > th {
    background-color: #eab0c2 !important;
}
.table > tbody > tr.feature6 > th {
    background-color: #e7d93a !important;
}

.spinner-graph {
    font-size: 40px;
}

.halo-card {
    background: linear-gradient(to top, rgba(99, 172, 177, .15), rgba(247, 243, 243, .6));
    border-radius: 3px;
    min-height: 250px;
    padding-top: 10px;
}

.note-info {
    bottom: 10;
    color: #8e8e8e;
    padding-right: 30px;
    position: absolute;
    width: 100%;
}

/* Note Type Labels */
.note-type-label.income {
    background-color: #6291ba;
}
.note-type-label.growth {
    background-color: #3aaef7;
}
.note-type-label.digital {
    background: #49598c;  /* #73a350; */
}
.note-type-label.absolute {
    background: #8193db;
}
.note-type-label.snowball {
    background-color: #517fdb;
}
.note-type-label.green{
    background-color: #c7ece2;
}
.note-type-label.ppn {
    background-color: #1694e6;
}
.note-type-label.unknown {
    background-color: #eab757;
}

/* Note PBreach Color */
.income-breach {
    color: #6291ba;
}
.growth-breach {
    color: #3aaef7;
}
.digital-breach {
    color: #49598c;
}
.absolute-breach {
    color: #8193db;
}
.snowball-breach {
    color: #517fdb;
}
.ppn-breach {
    color: #1694e6;
}
.unknown-breach {
    color: #eab757;
}



.full-width-container {
    background-color: #fff;
    border-bottom: 1px #888;
    box-shadow: 0px 1px 1px #888;
}

.note-prop-label {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: 0px 1px 1px #888;
    font-weight: 500;
}

.note-prop-label.has_cap {
    background-color: #fffacd;
}

.note-prop-label.uncapped {
    background-color: #f0fff0;
}

.note-prop-label.non_call {
    background-color: #afeeee;
}

.note-prop-label.autocall {
    background-color: #f5deb3;
}

.note-prop-label.contingent {
    background-color: #faf0e6;
}

.note-prop-label.coupon_period {
    background-color: #e6e6fa;
}



.powered_by_halo {
    display: none;
}

.note-panel-labels {
    color: #888;
}

/* Riz's great note rank with Jay's great color scheme: */
.note-panel-purple-shadow:hover {
    box-shadow: 0px 13px 39px -10px rgba(206,133,241,.95) !important;
}
.note-panel-blue-shadow:hover {
    box-shadow: 0px 13px 39px -10px rgba(72,182,228,.95) !important;
}
.note-panel-green-shadow:hover {
    box-shadow: 0px 13px 39px -10px rgba(82,234,164,.95) !important;
}

.slider-handle {
    background-color: #333;
}

.slider-selection.tick-slider-selection {
    background-color: #676767;
}

.slider-selection {
    background-color: #676767;
}

.slider-track-high {
    background-color: #bbb;
}


.gauge {
    background: #efefef;
    border-radius: 300px 300px 0 0;
    box-shadow: 0 1px 5px #999;
    height: 100px;
    margin: 15px auto;
    overflow: hidden;
    position: relative;
    width: 200px;
}
.gauge:before {
    background: #efefef;
    border-radius: 160px 160px 0 0;
    bottom: 0;
    box-shadow: 0 0 3px #999;
    content: "";
    display: block;
    height: 80%;
    left: 50%;
    margin-left: -40%;
    position: absolute;
    width: 80%;
}
.gauge:after {
    background: #efefef;
    border-radius: 100px 100px 0 0;
    bottom: 0;
    box-shadow: 0 3px 3px -2px #999 inset;
    content: "";
    display: block;
    height: 50%;
    left: 50%;
    margin-left: -25%;
    position: absolute;
    width: 50%;
    z-index: 1;
}
.gauge .needle {
    animation: needle 4s infinite;
    border-bottom: 150px solid #000;
    border-left: 8px solid transparent;
    border-radius: 0 0 10px 10px;
    border-right: 8px solid transparent;
    bottom: -80px;
    left: 50%;
    margin-left: -8px;
    position: absolute;
    transform: rotate(-22.5deg);
    transform-origin: center bottom;
    z-index: 2;
}
.gauge .category {
    background: #ddd;
    border-radius: 0 200px 0 0;
    bottom: 0px;
    height: 160px;
    left: 50%;
    position: absolute;
    transform-origin: bottom left;
    width: 160px;
}
.gauge .category .char {
    bottom: 0;
    color: #555;
    font-size: 12px;
    font-weight: bold;
    height: 185px;
    left: 0;
    position: absolute;
    text-transform: uppercase;
    transform-origin: bottom center;
    width: 11px;
}
.gauge .category.poor {
    background: #fcc;
    transform: rotate(-90deg);
}
.gauge .category.poor .char:nth-child(1) {
    transform: rotate(14deg);
}
.gauge .category.poor .char:nth-child(2) {
    transform: rotate(18deg);
}
.gauge .category.poor .char:nth-child(3) {
    transform: rotate(22deg);
}
.gauge .category.poor .char:nth-child(4) {
    transform: rotate(26deg);
}
.gauge .category.fair {
    background: #ffe5cc;
    transform: rotate(-45deg);
}
.gauge .category.fair .char:nth-child(1) {
    transform: rotate(14deg);
}
.gauge .category.fair .char:nth-child(2) {
    transform: rotate(18deg);
}
.gauge .category.fair .char:nth-child(3) {
    transform: rotate(22deg);
}
.gauge .category.fair .char:nth-child(4) {
    transform: rotate(26deg);
}
.gauge .category.good {
    background: #ffc;
    transform: rotate(0deg);
}
.gauge .category.good .char:nth-child(1) {
    transform: rotate(14deg);
}
.gauge .category.good .char:nth-child(2) {
    transform: rotate(18deg);
}
.gauge .category.good .char:nth-child(3) {
    transform: rotate(22deg);
}
.gauge .category.good .char:nth-child(4) {
    transform: rotate(26deg);
}
.gauge .category.excellent {
    background: #cfc;
    transform: rotate(45deg);
}
.gauge .category.excellent .char:nth-child(1) {
    transform: rotate(6deg);
}
.gauge .category.excellent .char:nth-child(2) {
    transform: rotate(10deg);
}
.gauge .category.excellent .char:nth-child(3) {
    transform: rotate(14deg);
}
.gauge .category.excellent .char:nth-child(4) {
    transform: rotate(18deg);
}
.gauge .category.excellent .char:nth-child(5) {
    transform: rotate(22deg);
}
.gauge .category.excellent .char:nth-child(6) {
    transform: rotate(26deg);
}
.gauge .category.excellent .char:nth-child(7) {
    transform: rotate(30deg);
}
.gauge .category.excellent .char:nth-child(8) {
    transform: rotate(34deg);
}
.gauge .category.excellent .char:nth-child(9) {
    transform: rotate(38deg);
}


.loader,
.loader:before,
.loader:after {
    -webkit-animation: load1 1s infinite ease-in-out;
    animation: load1 1s infinite ease-in-out;
    background: #5d5c5d;
    height: 4em;
    width: 1em;
}
.loader {
    -ms-transform: translateZ(0);
    -webkit-animation-delay: -.16s;
    -webkit-transform: translateZ(0);
    animation-delay: -.16s;
    color: #5d5c5d;
    font-size: 11px;
    margin: 88px auto;
    position: relative;
    text-indent: -9999em;
    transform: translateZ(0);
}
.loader:before,
.loader:after {
    content: "";
    position: absolute;
    top: 0;
}
.loader:before {
    -webkit-animation-delay: -.32s;
    animation-delay: -.32s;
    left: -1.5em;
}
.loader:after {
    left: 1.5em;
}
@-webkit-keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 4em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}
@keyframes load1 {
    0%,
    80%,
    100% {
        box-shadow: 0 0;
        height: 4em;
    }
    40% {
        box-shadow: 0 -2em;
        height: 5em;
    }
}


.onboarding h2 {
    color: #90c1c7;
}

.onboarding .lead {
    color: #7fa4a9;
}
.onboarding {
    background-color: #e5f3f5;
    font-family: "Montserrat", sans-serif;
    height: 100%;
    padding-top: 100px;
}
.onboarding small {
    color: #7fa4a9;
}
#answer-input {
    background: none;
    border: none;
    border-bottom: #7fa4a9 1px solid;
    box-shadow: none;
    color: #7fa4a9;
    font-size: 20px;
}

.risk-meter-1 {
    background-color: #ce85f1;
}

.risk-meter-2 {
    background-color: #48b6e4;
}

.risk-meter-3 {
    background-color: #65ece7;
}

.edu-card-1 {
    background-color: #e64747;
    color: #fff;
}
.edu-card-2 {
    background-color: #a185dd;
    color: #fff;
}
.edu-card-3 {
    background-color: #a4e545;
    color: #000;
}
.edu-card-4 {
    background-color: #d13f82;
    color: #fff;
}
.edu-card-5 {
    background-color: #f9e14b;
    color: #000;
}
.edu-card-6 {
    background-color: #7ee39d;
    color: #000;
}
.edu-card-7 {
    background-color: #ef9905;
    color: #fff;
}


.badge {
    background-color: #ca5050;
}

.switch-selection {
    background: rgba(101, 189, 99, .65);
}

.nav-item a {
    color: #545454;
}
.side-nav-right .navbar-nav .nav-item .nav-link {
    color: #65788a;
}

.user-activation-widget div.active { display: block }
.user-activation-widget div.inactive { display: none }
.user-activation-widget.state-inactive div.active { display: none }
.user-activation-widget.state-inactive div.inactive { display: block }


@media (min-width: 992px) {
    .side-nav-right {
        background: #f3f3f3;
        border-left: solid 1px #dadada;
        box-shadow: 6px 15px 17px #ababab;
        display: flex;
        flex-direction: column;
        height: 100vh;
        position: fixed;
        right: 0;
        text-align: center;
        top: 0;
        width: 17rem;
    }
    .side-nav-right .navbar-brand {
        display: flex;
        margin: auto auto 0;
        padding: .5rem;
    }
    .side-nav-right .navbar-brand .img-profile {
        border: .5rem solid rgba(255, 255, 255, .2);
        max-height: 10rem;
        max-width: 10rem;
    }
    .side-nav-right .navbar-collapse {
        display: flex;
        margin-bottom: auto;
        width: 100%;

        align-items: flex-start;
        flex-grow: 0;
    }
    .side-nav-right .navbar-collapse .navbar-nav {
        flex-direction: column;
        width: 100%;
    }
    .side-nav-right .navbar-collapse .navbar-nav .nav-item {
        display: block;
    }
    .side-nav-right .navbar-collapse .navbar-nav .nav-item .nav-link {
        display: block;
    }
    .side-nav-right .navbar-nav {
        margin-top: 40px;
    }
}


/* MARK: leverage bootstrap "has-success" to style slider-selection and slider-handle */
.solve-for.has-success .slider-selection, .solve-for.has-success .slider-handle {
    background: rgb(99, 171, 107);
}

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

.gap-1 {
    gap: 0.25rem !important;
}

.gap-2 {
    gap: 0.5rem !important;
}

.gap-3 {
    gap: 1rem !important;
}

.gap-4 {
    gap: 1.5rem !important;
}

.gap-5 {
    gap: 3rem !important;
}