* {
    margin: 0;
    padding: 0;
}

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

#content {
    height: 90vh;
}

.list-group-item-subitem-title {
    padding: 1vh 1vw;
    color: rgb(204, 73, 73);
    font-size: 0.8rem;
}

.list-group-item-subitem {
    padding-left: 1.5vw;
}

a:link {
    text-decoration: none;
}

.recycle-bin {
    color: black;
    padding-top: .2rem;
}

    .recycle-bin:hover {
        color: #be2121;
    }

.col {
    padding: 0.5vh 0.5vw;
}

table tr {
    line-height: 10px;
}

.table {
    margin-top: -5px;
}

.quad {
    height: 44vh;
    overflow: hidden;
    visibility: visible;
    opacity: 1;
    transition: all 0.5s ease-in-out;
}

.card {
    border-radius: 0;
}

.card-body {
    overflow: hidden;
}


.quad-expanded {
    height: 89vh;
    transition: all .5s;
    transition-timing-function: ease-in-out;
}

    .quad-expanded .card-body {
        overflow-y: scroll;
    }


.row {
    margin: 0px;
}

.quad .divider,
.quad-expanded .divider {
    border-bottom: .06rem solid #c9a093;
}

.quad .divider-color-red,
.quad-expanded .divider-color-red {
    border-bottom: .06rem solid #ff8a66;
}

.quad .divider-ver,
.quad-expanded .divider-ver {
    border-right: .06rem solid #c9a093;
}

.quad .list-group {
    max-height: 27vh;
    overflow-y: scroll;
}

.quad .card-footer {
    padding: .09rem 0;
    font-weight: 500;
}

.company-research .comparison .doughnut {
    max-width: 9rem;
    max-height: 9rem;
}

.quad .card-body {
    padding: 0rem;
}

    .quad .card-body .card-title {
        font-weight: thin;
        border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    }

    .quad .card-body .table {
        text-justify: right;
    }

    .quad .card-body .header {
        background-image: url('/res/img/red-pattern.jpg');
        background-size: cover;
        padding: 1.3rem;
        z-index: 1;
        color: #fff;
    }

.quad-expanded .card-body .header {
    background-image: url('/res/img/red-pattern.jpg');
    background-size: cover;
    z-index: 1;
    color: #fff;
}

.company-research .company-details .header {
    margin-top: -1.2rem;
}

.company-research .company-details .stock-name {
    font-size: 2vh;
}

.company-research .company-details .stock-specs {
    font-size: 0.8rem;
    font-weight: 500;
}

.stock-expand-icon a {
    color: white;
    padding-top: 1.2rem;
}

.company-research .company-details .quad .stock-expand-icon a {
    margin-top: -1.5rem;
    margin-right: -1.7rem;
    ;
}


.company-research .company-details .stock-price {
    font-size: 2vh;
    font-weight: bolder;
    font-style: italic;
}

.company-research .company-details .stock-logo img {
    max-width: 4rem;
    max-height: 4rem;
    margin-top: 1rem;
}

.company-research .company-details .stock-label {
    margin-top: 1rem;
}

.company-research .company-details .stock-changes {
    font-size: 0.8rem;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .stock-changes {
    font-size: 2.2vh;
    font-weight: 450;
    text-align: center;
}

.company-research .company-details .stock-changes i {
    color: #be2121;
    font-size: 2.5vh;
}

.company-research .company-details .chart-container {
    max-width: 14rem;
    max-height: 7rem;
    margin-bottom: 2.5vh;
}


.company-research .company-details .sentiment p {
    margin-left: 20%;
    padding-top: .7rem;
    font-size: 2vh;
}

.company-research .company-details .quad-expanded .sentiment p {
    text-align: center;
    padding: 2rem;
    font-size: 3vh;
}

.company-research .company-details .sentiment i {
    color: #c9a093;
    font-size: 4rem
}

.company-research .company-details .quad-expanded .sentiment i {
    color: #c9a093;
    font-size: 8rem
}

.company-research .company-details .sentiment .active i {
    color: #be2121;
}

.company-research .company-details .quad-expanded .sentiment {
    padding-bottom: 15vh;
}


.company-research .company-details .stock-details .name {
    text-align: center;
    font-size: .8rem;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .stock-details .name {
    text-align: center;
    font-size: 2.2vh;
    padding: .5vh;
    font-weight: 500;
}


.company-research .company-details .stock-details .value {
    text-align: center;
    font-size: 0.8rem;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .stock-details .value {
    text-align: center;
    font-size: 2.7vh;
    font-weight: 500;
}

.company-research .company-details .stock-details .name-sub {
    text-align: center;
    font-size: 0.6rem;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .stock-details .name-sub {
    text-align: center;
    font-size: 2.4vh;
    font-weight: 400;
}

.company-research .company-details .analyst-estimate {
    text-align: center;
    font-size: 0.8rem;
    padding: .2rem;
    margin-top: .5vh;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .analyst-estimate {
    text-align: center;
    font-size: 2.2vh;
    padding: 1vh;
    margin-top: .5vh;
    font-weight: 500;
}

.company-research .company-details .stock-action {
    text-align: center;
    font-size: 1vh;
    font-weight: 500;
}

.company-research .company-details .quad-expanded .stock-action {
    text-align: center;
    font-size: 1.6vh;
    font-weight: 500;
}

.company-research .news table tbody tr td {
    font-size: 1.6vh;
}

.stock-note {
    width: 9rem;
    height: 7.4rem;
    border: 0rem;
    margin-left: .2rem;
    margin-bottom: .3rem;
    margin-top: .5rem;
    border-radius: .3rem;
}

.stock-note-down {
    background-color: #e7a195;
}

.stock-note-up {
    background-color: #c9f5ef;
}

.stock-notes {
    overflow: hidden;
}

    .stock-notes .card-body .row {
        margin: 0px;
    }

        .stock-notes .card-body .row .col {
            padding: 0rem;
        }

.stock-note .stock-note-body {
    padding: 0.1rem;
}

    .stock-note .stock-note-body .row {
        margin: 0px;
        padding: 0px;
    }

    .stock-note .stock-note-body .divider {
        border-bottom: 0.01rem solid #54585a;
    }

    .stock-note .stock-note-body .col-50 {
        max-width: 50%;
        padding: 0;
    }

    .stock-note .stock-note-body .col-25 {
        max-width: 25%;
        padding: 0;
    }

    .stock-note .stock-note-body .col-75 {
        max-width: 75%;
        padding: 0;
    }

.stock-note-text {
    font-size: 0.6rem;
}

.stock-note-header {
    font-weight: bold;
    font-size: 0.55rem;
    padding-bottom: 0.1rem;
}

/* Global research classes */
.card-title {
    margin-bottom: 6px;
    font-size: medium;
    font-weight: 500;
    margin-left: 0.2rem;
}

.mts-container {
    max-width: 8vw;
    max-height: 20vh;
    margin-left: .3rem;
    margin-bottom: .9rem;
}

.mts-card {
    height: 7.6rem;
    width: 9rem;
    border: none;
}

.mts-card-bg-img1 {
    background-image: url('../img/financials.jpg');
    background-size: cover;
}

.mts-card-bg-img2 {
    background-image: url('../img/consumer-staples.jpg');
    background-size: cover;
}

.mts-card-bg-img3 {
    background-image: url('../img/information-technology.jpg');
    background-size: cover;
}

.mts-bg-overlay1 {
    background-color: rgba(251, 192, 45, 0.7);
    /* opacity: 0.8; */
}

.mts-bg-overlay2 {
    background-color: rgba(81, 45, 168, 0.7);
    /* opacity: 0.8; */
}

.mts-bg-overlay3 {
    background-color: rgba(0, 150, 136, 0.7);
    /* opacity: 0.8; */
}

.mts-card .card-body {
    font-size: large;
    color: white;
    text-align: center;
    padding: 1.5rem;
    overflow: hidden;
    font-weight: normal;
}

.ats .doughnut {
    max-width: 9rem;
    max-height: 9rem;
}


#news-cloud {
    margin-top: 5vh;
    height: 27vh;
}

#news-list {
    display: none;
}

    #news-list > table > tbody > tr > td {
        font-size: 1.8vh;
    }

.world-map-default {
    height: 38vh;
}

.world-map-expanded {
    height: 80vh;
    width: 70vw;
}

.row.notes > .col > .quad {
    height: 38vh;
    overflow: auto;
}

.row.notes > .col > .quad-expanded {
    height: 74vh;
}

/*Structured Notes*/
.structured-note .quad {
    height: 38vh;
}

.structured-note .quad-expanded {
    height: 76vh;
}

.structured-note .header1 {
    margin-top: -.3vh;
}

    .structured-note .header1 table {
        margin: 0;
        padding: 0;
    }

        .structured-note .header1 table tbody tr td {
            font-size: 1.6vh;
            font-weight: 500;
        }

.structured-note .header2 {
    margin-top: -1vh;
}

    .structured-note .header2 .header2-1 {
        margin-top: 1vh;
    }


    .structured-note .header2 .note-name {
        font-size: 1.8vh;
        font-weight: 500;
        padding: 0.2rem 0.5rem;
    }

    .structured-note .header2 .badge {
        text-transform: uppercase;
        font-weight: 500;
        font-size: 1.2vh;
        padding: .4rem;
        margin: .2vw;
    }

    .structured-note .header2 .search-inputs {
        padding: 0.4rem 0;
    }

        .structured-note .header2 .search-inputs .col {
            margin: .2rem;
        }


        .structured-note .header2 .search-inputs label {
            font-size: medium;
            font-weight: 600;
            margin-right: 1.5vw;
            margin-top: 0.55vh;
        }

    /* .structured-note .header2 .search-inputs input {
  height: 2.5vh;
} */

    .structured-note .header2 .data-points {
        margin-top: .7vh;
    }

.structured-note .header2-2 .data-points .item {
    padding: 0.75rem 0.5rem;
}

.structured-note .header2-2 .data-points .data-point {
    font-size: 2.2vh;
    font-weight: 600;
}

    .structured-note .header2-2 .data-points .data-point.up {
        color: rgb(16, 180, 16);
    }

    .structured-note .header2-2 .data-points .data-point.down {
        color: rgb(177, 29, 29);
    }

.structured-note .header2-2 .data-points .data-point-desc {
    font-size: 1.45vh;
}

.btn-header {
    height: 2.9vh;
    padding: 0 0.3rem;
    font-size: 1.6vh;
    margin: .3rem;
}

/* .note-details.row>.col {
  padding: 0;
} */

.structured-note .note-details .details > .row {
    padding: 0;
    margin: 0;
}

    .structured-note .note-details .details > .row > .col {
        padding: 0;
        margin: 0;
    }

.structured-note .note-details .details .heading {
    font-size: 1.4vh;
    font-weight: 700;
    padding: 0.5vh 0.3vw;
    background-color: rgb(230, 132, 132);
    color: white;
    width: 8.6vw;
}

.structured-note .note-details p {
    font-size: 1.4vh;
    font-weight: 400;
    line-height: 1.2;
    margin-bottom: 0.3rem;
    width: 8.6vw;
    margin-right: 0.5vw;
}

/*Expanded Structured Note Q1*/
.structured-note .note-details .quad-expanded p {
    font-size: 2vh;
    font-weight: 400;
    line-height: 1;
    margin-bottom: 0.7rem;
    width: 17.8vw;
}

.structured-note .note-details .quad-expanded .heading {
    font-size: 2vh;
    font-weight: 600;
    line-height: 1;
    margin-bottom: 0.7rem;
    width: 17.8vw;
}

.structured-note .note-details .chart-container {
    top: 4vh;
    width: 100%;
    height: 100%;
    left: -1vw;
}

.structured-note .projected-payments .chart-container {
    width: 24vw;
    margin-left: 21%;
}

.structured-note .projected-payments .quad-expanded .chart-container {
    width: 45vw;
    margin-left: 18vw;
}

.structured-note .sn_q4 .chart-container {
    width: 23.5vw;
    margin-left: 21%;
}

.structured-note .sn_q4 .quad-expanded .chart-container {
    width: 45vw;
    margin-left: 18vw;
}

.row.note-underlying {
    height: 17vh;
}

    .row.note-underlying > .col {
        padding: 0;
    }

        .row.note-underlying > .col > .row {
            border-bottom: .06rem solid #c9a093;
        }

            .row.note-underlying > .col > .row.heading {
                font-weight: 600;
            }

            .row.note-underlying > .col > .row.alternate {
                background-color: rgb(245, 204, 204);
            }

            .row.note-underlying > .col > .row > .row > .col {
                padding: 0;
            }

            .row.note-underlying > .col > .row > .col.first {
                padding: 0;
                margin-left: 0;
            }

            .row.note-underlying > .col > .row > .col {
                font-size: 1vh;
                padding: 0;
                margin-left: 2.5vw;
            }

.table.compare-notes > tbody > .company-logo > td > img {
    max-width: 5vw;
    padding: 0;
}

.table > tbody > tr > td {
    font-size: 1.2vh;
    font-weight: 400;
    line-height: normal;
}

.table > tbody > tr {
    line-height: 0.5vh;
}


    .table > tbody > tr > th {
        font-size: 1.25vh;
    }

    .table > tbody > tr.brdr {
        border-bottom: .06rem solid #999999;
        line-height: 1vh;
    }

    .table > tbody > tr.alternate {
        background-color: rgb(221, 224, 231);
    }

.structured-note #quad3 .quad .table .first-col {
    min-width: 12rem;
}

.structured-note #quad3 .quad-expanded .table .first-col {
    width: 17vw;
}

.table > tbody > .heading {
    font-size: 1.2vh;
    font-weight: 600;
    padding: 1vh;
    margin-bottom: 1vh;
    background-color: rgb(240, 128, 128);
    color: white;
}

.my-account .quad-expanded .card-title {
    font-size: 2vh;
}

.quad-expanded > .card-body > .compare-notes.table > tbody > tr > td {
    font-size: 1.8vh;
}

.quad-expanded > .card-body > .compare-notes.table > tbody > tr {
    line-height: 1.7vh;
}

    .quad-expanded > .card-body > .compare-notes.table > tbody > tr > th {
        font-size: 1.8vh;
    }

.structured-note #quad3 .quad .card-body {
    overflow-x: hidden;
}

.my-account .card-title {
    font-size: medium;
}

.my-account > .row {
    padding: 0;
    margin-bottom: 0;
}

.my-account .header {
    margin-top: 1vh;
}

    .my-account .header .dropdown {
        margin: 0 1rem;
    }

    .my-account .header .dropdown-menu {
        max-height: 25vh;
        overflow-y: auto;
    }

    .my-account .header .dropdown button {
        font-size: 1.5vh;
    }

    .my-account .header .date-selector {
        margin: .2rem 1rem;
        margin-left: 1vw;
    }

        .my-account .header .date-selector input::placeholder {
            font-size: .9rem;
        }

        .my-account .header .date-selector input {
            width: 11vw;
        }

        .my-account .header .date-selector label {
            font-size: medium;
            font-weight: 600;
            margin-right: 1.75vw;
            margin-top: 0.55vh;
        }

    .my-account .header .product-selector {
        border-left: rgba(0, 0, 0, 0.125) 0.1rem solid;
    }

        .my-account .header .product-selector .col {
            top: 0.25vh;
        }

            .my-account .header .product-selector .col label {
                font-size: medium;
                font-weight: 600;
            }

    .my-account .header .data-points {
        margin-left: -3vw;
    }

        .my-account .header .data-points .list-group-item {
            padding: 0.75rem 0.5rem;
        }

        .my-account .header .data-points .data-point {
            font-size: 2.2vh;
            font-weight: 600;
        }

            .my-account .header .data-points .data-point.up {
                color: rgb(16, 180, 16);
            }

            .my-account .header .data-points .data-point.down {
                color: rgb(177, 29, 29);
            }

        .my-account .header .data-points .data-point-desc {
            font-size: 1.45vh;
        }

.my-account .filters {
    margin-left: 1vw;
}

    .my-account .filters .search {
        margin-top: 0;
    }

.my-account #quad1,
.my-account #quad2,
.my-account #quad3,
.my-account #quad4 {
    margin-top: -1.6vh;
}

.my-account > .notes > #quad1 > .quad > .card-body > .row > .row {
    padding-top: 1vh;
}

.my-account > .notes > #quad1 > .quad-expanded > .card-body > .row > .row {
    padding-top: 1vh;
}

.my-account #quad1 .title-doughnut p {
    padding-bottom: 1vh;
    font-size: 1.8vh;
    font-weight: 400;
}

.my-account #quad1 .quad-expanded .title-doughnut p {
    padding-bottom: 1.5vh;
    font-size: 2.4vh;
    font-weight: 400;
}

.my-account > .notes > #quad1 > .quad > .card-body > .row > .row > .col > .labels {
    margin-top: 5vh;
}

.my-account > .notes > #quad1 > .quad-expanded > .card-body > .row > .row > .col > .labels {
    margin-top: 5vh;
    margin-left: 3vw;
}

.my-account > .notes > #quad1 > .quad > .card-body > .row > .row > .col > .labels > .label {
    margin-top: 1vh;
    margin-left: .5vw;
}

.my-account #quad1 .labels .label-1 {
    border-left: solid 0.1rem var(--blue);
}

.my-account #quad1 .labels .label-2 {
    border-left: solid 0.1rem var(--teal);
}

.my-account #quad1 .labels .label-3 {
    border-left: solid 0.1rem var(--orange);
}

.my-account #quad1 .labels .label-4 {
    border-left: solid 0.1rem var(--yellow);
}

.my-account #quad1 .labels .label-5 {
    border-left: solid 0.1rem var(--cyan);
}

.my-account #quad1 .labels .label-6 {
    border-left: solid 0.1rem var(--indigo);
}

.my-account #quad1 .labels .label-7 {
    border-left: solid 0.1rem var(--purple);
}

.my-account > .notes > #quad1 > .quad-expanded > .card-body > .row > .row > .col > .labels > .label {
    margin-top: 1vh;
    margin-left: .5vw;
}

.my-account > .notes > #quad1 > .quad > .card-body > .row > .row > .col > .labels > .label > p {
    margin-left: 0.7vw;
    margin-bottom: 0;
    font-size: 1.5vh;
    font-weight: 600;
}

.my-account > .notes > #quad1 > .quad-expanded > .card-body > .row > .row > .col > .labels > .label > p {
    margin-left: 0.7vw;
    margin-bottom: 0;
    font-size: 1.8vh;
    font-weight: 600;
}


.my-account > .notes > #quad1 > .quad > .card-body > .row > .row > .col > .labels > .label > .subtext {
    margin-left: 0.7vw;
    margin-bottom: 0;
    font-size: 1.2vh;
    font-weight: 400;
}

.title-doughnut {
    text-align: center;
    max-width: 7.5vw;
    max-height: 8vh;
}

    .title-doughnut > p {
        margin-bottom: 0;
        font-size: 1.4vh;
        font-weight: 600;
    }

.title-doughnut-expanded {
    text-align: center;
    width: 15vw;
    height: 15vh;
}

    .title-doughnut-expanded > p {
        margin-bottom: 0;
        font-size: 2vh;
        font-weight: 600;
    }

.my-account .ticket {
    border-radius: .5rem;
    padding: 0;
    margin-left: .2vw;
    margin-top: .5vh;
    margin-bottom: 2.7vh;
}

.company-research .my-account .ticket {
    border-radius: .5rem;
    padding: 0;
    margin-left: .2vw;
    margin-top: 2.5vh;
    margin-bottom: 2vh;
}

.my-account .ticket .card-body {
    overflow-y: hidden;
}

.my-account .underlyings .ticket {
    width: 48%;
    margin-left: .5vw;
}

.my-account .quad-expanded .underlyings .ticket {
    width: 24%;
    margin-left: .5vw;
}

.my-account .quad-expanded .ticket {
    width: 48%;
    margin-left: .5vw;
}

.my-account .ticket .card-body {
    padding: 0.55rem;
}

.my-account .ticket table {
    margin-bottom: 0;
}

.my-account .ticket .index-container {
    display: flex;
    overflow: hidden;
    flex-wrap: nowrap;
}

.my-account .ticket .indexes .index {
    flex: 0 0 auto;
    font-size: 1.2vh;
    padding: .55rem 1rem;
}


    .my-account .ticket .indexes .index .active {
        color: #be2121;
        font-weight: 500;
    }

.my-account .ticket .indexes .arrow {
    background-color: #FFF;
    margin-top: .2rem;
}

.my-account .ticket .indexes .arrow-left {
    position: absolute;
    left: 0;
    margin-left: .5vw;
}

.my-account .ticket .indexes .arrow-right {
    position: absolute;
    right: 0;
    margin-right: .5vw;
}


.my-account .ticket .bottom-border {
    border-bottom: .1rem solid rgba(0, 0, 0, 0.125);
}

.my-account .ticket .autocallable {
    font-size: 2vh;
    font-weight: 450;
    padding-bottom: .2rem;
}

.my-account .ticket .tags {
    padding-bottom: .45rem;
}

    .my-account .ticket .tags .badge {
        text-transform: uppercase;
        font-weight: 400;
        font-size: 1.3vh;
        padding: .25rem .5rem;
        margin: .2rem;
    }

.my-account .ticket .details .name td {
    padding-bottom: 0;
    font-size: 1.2vh;
}

.my-account .ticket .details .value td {
    padding-top: 0;
    font-size: 1.8vh;
    font-weight: 450;
}

.my-account .ticket .more-details {
    margin-left: -1vh;
    ;
}

    .my-account .ticket .more-details .name {
        font-size: 1vh;
        font-weight: 500;
    }

    .my-account .ticket .more-details .value {
        font-size: 1.4vh;
        font-weight: 450;
    }

.my-account .projected-payments .chart-container {
    width: 30vw;
    height: 25vh;
    margin-left: 15%;
}

.my-account .projected-payments .quad-expanded .chart-container {
    height: 38vh;
    margin-left: 25%;
}

.my-account .list-view .table {
    margin-top: 2vh;
}

    .my-account .list-view .table th {
        line-height: 1.5vh;
    }

/* Auto Complete CSS */
.autocomplete-suggestions {
    border: 1px solid #999;
    background: #FFF;
    overflow: auto;
}

.autocomplete-suggestion {
    padding: 2px 5px;
    white-space: nowrap;
    overflow: hidden;
}

.autocomplete-selected {
    background: #F0F0F0;
}

.autocomplete-suggestions strong {
    font-weight: normal;
    color: #3399FF;
}

.autocomplete-group {
    padding: 2px 5px;
}

    .autocomplete-group strong {
        display: block;
        border-bottom: 1px solid #000;
    }

/* Education & Academy*/

.education .quiz-btn {
    margin-top: 12.3rem;
    margin-left: 8rem;
}

.education .header .card {
    border-radius: .5rem;
    margin: 0.5rem;
}

.education .header .btn {
    border-radius: .5rem;
    margin: 0.5rem;
    font-size: 2vh;
    font-weight: 500;
}

.education .header .card-body {
    padding: 0;
}

.education .header .course-status .card-body {
    padding: 0.75rem 0.5rem;
    min-width: 23vw;
    font-weight: 500;
    font-size: 2vh;
}

.education .header .course-status .status {
    position: absolute;
    right: 0;
    padding-right: .75rem;
}

.education .header .connect {
    padding: .75rem .5rem;
    min-width: 20vw;
    align-content: center;
    font-size: 2vh;
    font-weight: 500;
}

    .education .header .connect .item {
        padding: .1rem;
    }

        .education .header .connect .item:hover {
            color: #be2121;
        }

    .education .header .connect i {
        padding: .1rem;
    }

    .education .header .connect .connect-type {
        padding: .1rem;
        margin-top: -.3rem;
    }

.education .header .social-media {
    padding: .35rem;
    min-width: 8vw;
    align-content: center;
    text-align: center;
    font-size: 3vh;
    font-weight: 500;
}

.fb {
    color: #3B5998;
}

.twitter {
    color: #00ACEE;
}

.insta {
    color: #515BD4;
}

.education .header .assistance {
    padding: .75rem .5rem;
    align-content: center;
    text-align: center;
    font-size: 2.2vh;
    font-weight: 500;
}

    .education .header .assistance .item {
        padding: .1rem;
    }

        .education .header .assistance .item:hover {
            color: #be2121;
        }

    .education .header .assistance i {
        padding: .3rem;
    }

    .education .header .assistance .assist {
        padding: .1rem;
        margin-top: -.3rem;
    }


.education .video-container {
    text-align: center;
}

.education video {
    max-width: 43vw;
    max-height: 35vh;
}

.education .carousel {
    height: 37vh;
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
}

.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='black' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.education .mcq {
    padding: 6rem;
    padding-top: 4rem;
}

    .education .mcq .question {
        text-align: center;
        color: #000;
        font-size: 2vh;
    }

    .education .mcq .options {
        padding: 1rem;
        text-align: left;
        color: #000;
        font-weight: 500;
    }

        .education .mcq .options .option {
            border-radius: .3rem;
            border: .01rem solid #54585a;
            padding: .5rem
        }

            .education .mcq .options .option:hover {
                color: white;
                background-color: black;
            }

.education .quad {
    height: 40vh;
}

.education .quad-expanded {
    height: 79vh;
}

.education .start-quiz table {
    width: 25rem;
    padding: 1.5rem;
    margin-top: 1rem;
}

    .education .start-quiz table td {
        font-size: small;
        line-height: .5vh;
    }

.education .quiz-instructions .instructions {
    padding: 3rem 5rem;
}

.education .submit-quiz {
    padding: 3rem 5rem;
}

.education .quiz-results {
    padding: 3rem 5rem;
}

    .education .quiz-results .results .row {
        padding: .5rem;
    }

.education .quiz-instructions .instruction-list {
    padding-left: 2.5rem;
}

.academy .education .quad {
    height: 44vh;
}

.academy .education video {
    max-width: 55vw;
    max-height: 39vh;
}

.academy .quad-expanded {
    height: 89vh;
}


.academy .quiz-btn {
    margin-top: 1.5rem;
    margin-left: 33.5rem;
}

/*Pricing*/
.pricing .quad {
    height: 46vh;
}

.pricing .note-parameters .nav-link {
    font-size: 1.5vh;
    font-weight: 500;
    color: darkslategrey;
}

.pricing .note-parameters .active {
    color: #be2121
}

.pricing .note-parameters form label {
    font-size: 1.2vh;
    font-weight: 500;
    margin-bottom: 0;
}

.pricing .note-parameters form .form-group {
    margin-bottom: 0;
}

.pricing .note-parameters .row {
    border-bottom: .01rem solid rgba(0, 0, 0, 0.125);
}

.btn-xs {
    padding: 0.2rem, 0.1rem;
    font-size: smaller;
    line-height: .9rem;
    margin: .2rem;
    margin-right: 1rem;
}

.pricing .note-profile {
    align-items: center;
}

    .pricing .note-profile .ticket {
        border-radius: .5rem;
        max-width: 25vw;
        height: 35vh;
        margin: 5% 25%;
    }

.pricing .ticket .row-1 {
    font-size: 2vh;
    margin-left: 2vw;
}

.pricing .ticket .row-2 .title {
    font-size: 2vh;
    margin-left: 27%;
    padding: 1.5rem
}

.pricing .ticket .row-3 {
    margin: 1rem;
    margin-bottom: 5rem;
}

    .pricing .ticket .row-3 .annualized-yeild {
        font-size: 3rem;
        font-weight: 500;
        color: indianred;
        text-align: center;
    }

    .pricing .ticket .row-3 .details p {
        border-bottom: .01rem solid #54585a;
        margin-bottom: 0;
        font-size: 1.5vh;
        font-weight: 400;
        text-align: center;
    }

.pricing .ticket .row-4 {
    font-size: 2vh;
}

.pricing .ticket .left {
    text-align: left;
}

.pricing .ticket .right {
    text-align: right;
}

/* Quiz Quad  */
.button-text:hover {
    color: white;
}

/* Sign In & Sign Up*/

.signin .logo {
    width: 75%;
    margin-top: 1rem;
}

.signin .form-selector {
    color: #9e9e9e;
    font-weight: 300;
    font-size: x-large;
    padding-bottom: .5rem;
}

    .signin .form-selector a {
        text-decoration: none;
    }

    .signin .form-selector .active-form {
        color: black;
        border-bottom: .1rem solid #9F4C4C;
    }

.signin .apps .app {
   /* padding: .75rem;*/
    margin-right: 3vw;
}

    .signin .apps .app .icon {
        max-height: 2.5rem;
        width: 6rem;
    }


    .signin .apps .app .title {
        font-size: medium;
        font-weight: 450;
        padding-top: .25rem;
        width: 6rem;
        font-family:Arial;
    }

.signin .form .tagline {
    color: #978C8C;
}

.signin .form {
    padding: .5rem;
}

    .signin .form .row .col {
        padding: .5rem;
    }

    .signin .form .form-control {
        margin-top: .75rem;
        padding-right: 2.5rem;
        color: black;
    }

    .signin .form .btn {
        background-color: #D45959;
        color: white;
        font-size: large;
        padding: .25rem 1.75rem;
        margin-top: 1rem;
    }

        .signin .form .btn:hover {
            background-color: #bb4c4c;
            color: white;
        }


.signup-form p {
    padding-top: .25rem;
    margin-top: 1rem;
    font-size: .85rem;
    font-weight: 450;
    color: #978C8C;
}

    .signup-form p a {
        font-weight: 500;
    }

        .signup-form p a:hover {
            font-weight: 500;
            color: #726868;
        }

.social-signin {
    margin-top: 2.5rem;
}

    .social-signin .text {
        font-size: medium;
        font-weight: 500;
        /* color: #fff; */
        margin-right: 1rem;
    }

    .social-signin .icons .fa {
        font-size: larger;
        font-weight: 600;
        margin-right: 1rem;
    }

    .social-signin .icons .fa-google {
        color: #D45959;
    }

        .social-signin .icons .fa-google:hover {
            color: #bb4c4c;
        }


    .social-signin .icons .fa-facebook {
        color: #3b5998;
    }

        .social-signin .icons .fa-facebook:hover {
            color: #344f88;
        }

    .social-signin .icons .fa-linkedin-square {
        color: #0e76A8;
    }

        .social-signin .icons .fa-linkedin-square:hover {
            color: #0d6b97;
        }

    .social-signin .icons .fa-twitter {
        color: #00ACEE;
    }

        .social-signin .icons .fa-twitter:hover {
            color: #009ddb;
        }

.signin .background img {
    position: absolute;
    top: 31%;
    left: 0;
    width: 100%;
    height: 110%;
    z-index: -1;
}


/* Intelligent Document Processing (idp) */

.idp-company-logo {
    width: 6.5rem;
    padding-top: .25rem;
    margin-right: 1.5rem;
}

.idp-navbar {
    background: #fff;
}

.idp-menu {
    margin-right: 2rem;
}


.idp-TopUp {
    font-size: medium;
    margin-right: .40rem;
    padding-top: .25rem;
    color: #D45959;
}

.idp-balance {
    font-size: medium;
    padding-top: .25rem;
    margin-right: 2rem;
}

    .idp-balance .amount {
        color: var(--green)
    }

.idp {
    margin: 2rem 0rem;
}

    .idp .steps {
        padding: .5rem;
    }

        .idp .steps .step {
            padding: .385rem;
            height: 2.75rem;
        }

        .idp .steps .title {
            padding: .385rem;
            margin-right: .25rem;
            font-size: 1.25rem;
            font-weight: 500;
        }

        .idp .steps .fa-info-circle {
            padding: .8rem 0;
            font-size: .8rem;
            color: #726868;
        }

    .idp .step-content {
        margin-left: 3rem;
    }

    .idp .step-1 .doc-type {
        font-weight: 500;
        border-radius: .3rem;
        text-align: center;
        width: 25.5rem;
        box-shadow: 0px 2px 12px 2px rgba(0, 0, 0, 0.21);
        padding: 1rem 1.5rem;
        margin: .375rem;
        background-color: white;
        color: black;
    }

        .idp .step-1 .doc-type:hover {
            background-color: #bb4c4c;
            color: #fff;
            box-shadow: 0px;
            cursor: pointer;
            transition: ease-in-out 0.2s;
        }

    .idp .step-1 .doc-type-selected {
        background-color: #bb4c4c;
        color: #fff;
        box-shadow: 0px;
    }

    .idp .step-2 {
        width: 40rem;
    }

    .idp .step-3 .file-dropzone {
        background: #F4F4F4;
        border: 1px dashed #828282;
        box-shadow: inset 0px 0px 12px 2px rgba(192, 192, 192, 0.5);
        border-radius: .3rem;
        width: 15rem;
        height: 5rem;
        text-align: center;
        font-size: small;
        font-weight: 500;
        color: var(--gray);
        padding: 1rem;
    }

    .idp .step-3 .uploaded-docs {
        margin-left: 3rem;
        width: 27.5rem;
        max-height: 8rem;
        overflow-x: scroll;
        overflow-y: hidden;
    }

    .idp ::-webkit-scrollbar {
        width: 1px;
        height: 5px;
    }

    /* Track */
    .idp ::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }

    /* Handle */
    .idp ::-webkit-scrollbar-thumb {
        -webkit-border-radius: 10px;
        border-radius: 10px;
        background: #D45959;
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
    }

    .idp .step-3 .uploaded-doc {
        padding: 0.75rem;
        padding-top: 0;
    }

        .idp .step-3 .uploaded-doc img {
            max-height: 5rem;
            max-width: 4rem;
        }

        .idp .step-3 .uploaded-doc .doc-name {
            max-width: 3rem;
            font-size: small;
        }

    .idp .btn {
        background-color: #D45959;
        color: white;
        font-size: large;
        padding: .25rem 1.75rem;
    }

        .idp .btn:hover {
            background-color: #bb4c4c;
            color: white;
        }

    .idp .download-docBox {
        margin-left: 2rem;
        max-height: 13.5rem;
        max-width: 25rem;
        overflow-x: scroll;
        overflow-y: auto;
    }

    .idp .download-doc {
        padding: .25rem;
        width: 5rem;
    }

        .idp .download-doc .doc-name {
            text-align: center;
            max-width: 3rem;
            line-height: 1rem;
            font-size: smaller;
        }

        .idp .download-doc img {
            width: 4.5rem;
        }

    .idp .doc-type-pie-container {
        /* margin-left: 1.4rem;*/
        margin-left: -2.6rem;
        margin-top: -0.8rem;
        /* width: 25rem;*/
        width: 40rem;
        height: 15rem;
    }

    .idp .btn-sm {
        font-size: .7rem;
        margin: .2rem;
        padding: .1rem;
    }

    .idp .btn-blue {
        color: #fff;
        background: #0e76A8;
    }

        .idp .btn-blue:hover {
            color: #fff;
            background: #0b658f;
        }

    .idp .btn-green {
        color: #fff;
        background: rgb(2, 165, 2);
    }

        .idp .btn-green:hover {
            color: #fff;
            background: green;
        }

    .idp .download-allbtn {
        margin-left: 2.5rem;
        margin-top: .4rem;
    }

    .idp .download-all-title {
        margin-top: 1rem;
        margin-right: 1rem;
        font-size: 1.2rem;
    }

    .idp .download-title {
        margin-left: 11rem;
    }

    .idp .download-allbtn .btn {
        height: 2rem;
        padding: 0rem 2rem;
        margin-top: 1rem;
        margin-left: 1rem;
    }

    .idp .stats {
        margin-top: .5rem;
        margin-left: 2rem;
    }

    .idp .idp-stats {
       /* max-width: 11.8rem;*/
         max-width: 17.8rem;
        padding: .5rem;
        margin-right: 1.5rem;
    }

        .idp .idp-stats p {
            font-size: small;
            text-align: center;
            font-weight: 500;
        }

#doc_type_2 {
    margin-top: 2.2rem;
}

#doc_type_4 {
    margin-top: 2rem;
}

.apps-container {
    position: fixed;
    top: 5rem;
    right: 2rem;
    width: 24rem;
    z-index: 99;
    border-radius: .75rem;
    background-color: #fff;
    -webkit-box-shadow: 4px 4px 8px 2px rgba(176, 153, 153, 1);
    -moz-box-shadow: 4px 4px 8px 2px rgba(176, 153, 153, 1);
    box-shadow: 4px 4px 8px 2px rgba(176, 153, 153, 1);
}

    .apps-container .apps .app {
        padding: .825rem;
    }

    .apps-container .apps .ultra {
        margin-left: 1rem;
    }

    .apps-container .apps .pro {
        margin-left: 1rem;
    }

    .apps-container .apps .app img {
        width: 5rem;
        height: 3rem;
    }

    .apps-container .apps .disable {
        opacity: .5;
    }

.nine-dots {
    height: 1rem;
    margin-top: .6rem;
    margin-right: 1rem;
}

/*  Analytical Game */

.analytical-game-nav-icon {
    width: .8rem;
    height: .8rem;
    margin-right: .5rem;
}

.analytical-game .analytical-game .chart-container {
    height: 14.5vh;
    width: 17.5vw;
    margin-bottom: 2.5vh;
}

.analytical-game .analytical-game .quad-expanded .chart-container {
    max-height: 32vh;
    max-width: 41vw;
}

.analytical-game .modalbtn {
    margin-right: .2rem;
    background-color: transparent;
    border: none;
}

.analytical-game .doughnut {
    max-width: 9rem;
    max-height: 9rem;
}

.analytical-game #gameexpand {
    display: none;
}

.analytical-game .item-box {
    margin: 12px;
    border: 1px solid black;
    height: 15rem;
}

.boxmargin {
    margin-left: 2rem;
}

.analytical-game .game-container {
    max-width: 30rem;
}

.analytical-game .quad .model-chart-container {
    width: 40vw;
    height: 20vh;
}

.analytical-game .models-expanded .strategies .card {
    margin: .75rem 1rem;
    border-radius: .3rem;
    min-height: 15rem;
    overflow: hidden;
}


.analytical-game .models-expanded table tr td {
    padding: .2rem;
    font-weight: 500;
    font-size: .6rem;
}

.analytical-game .strategies-details > .charcteristics > .row {
    margin-top: 2rem;
}

.analytical-game .models-expanded .frontier .chart {
    height: 35vh;
    padding: 1rem 0;
}

.analytical-game .models-expanded .dendogram .chart {
    height: 40vh;
    padding: 1rem 0;
}

.analytical-game .models-expanded .dendogram table .cluster-no {
    width: 10rem;
}

.modal {
    border-radius: 5px;
    margin-left: .5rem;
}

.modal-dialog {
    width: 100%;
}

.modal-title {
    font-size: medium;
}

.modal-body {
    font-weight: 500;
    font-size: small;
}

    .modal-body table tr td {
        font-weight: 500;
        font-size: .7rem;
        padding: .2rem .5rem;
    }

.container {
    position: relative;
}

.image {
    opacity: 1;
    display: block;
    transition: .5s ease;
    backface-visibility: hidden;
}

.middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translate(-50%,-50%);
    text-align: center;
}

.container:hover .image {
    opacity: 0.3;
}

.container:hover .middle {
    opacity: 1;
}

.text {
    color: black;
    font-size: 12px;
}