:root {
    --primary: #007fe4;
    --secondary: #36a3b7;
    --tertiary: #1497d5;
    --quaternary: #558df3;
    --primary-rgb: 30,168,231;
    --secondary-rgb: 108,219,239;
    --tertiary-rgb: 93,227,200;
    --quaternary-rgb: 85,141,243;
    --primary-darker: #1b9ad4;
    --secondary-darker: #0e2a76;
    --tertiary-darker: #54ccb4;
    --quaternary-darker: #4c7dd6;
    --body: #182b3f;
    --alternate: #7c7c7c;
    --muted: #afafaf;
    --separator: #e6e6e6;
    --separator-light: #f1f1f1;
    --body-rgb: 59,59,59;
    --alternate-rgb: 124,124,124;
    --muted-rgb: 176,176,176;
    --separator-rgb: 221,221,221;
    --separator-light-rgb: 241,241,241;
    --background: #f9f9f9;
    --foreground: #ffffff;
    --background-rgb: 249,249,249;
    --foreground-rgb: 255,255,255;
    --background-theme: #eaf0f1;
    --background-light: #f8f8f8;
    --gradient-1: #1ea8e7;
    --gradient-2: #21aff0;
    --gradient-3: #23b3f4;
    --gradient-1-lighter: #2abdff;
    --gradient-1-darker: #1fa5e2;
    --light-text: #fff;
    --dark-text: #343a40;
    --light-text-darker: #eeeeee;
    --dark-text-darker: #23272b;
    --light-text-rgb: 255,255,255;
    --dark-text-rgb: 52,58,64;
    --danger: #cf2637;
    --info: #279aac;
    --warning: #ebb71a;
    --success: #439b38;
    --light: #dadada;
    --dark: #4e4e4e;
    --danger-darker: #771a23;
    --info-darker: #19545d;
    --warning-darker: #aa830f;
    --success-darker: #285422;
    --light-darker: #c9c9c9;
    --dark-darker: #282828;
    --body-darker: #333333;
    --alternate-darker: #616161;
    --muted-darker: #888888;
    --separator-darker: #c0c0c0;
    --danger-rgb: 182,40,54;
    --info-rgb: 41,138,153;
    --warning-rgb: 235,183,26;
    --success-rgb: 65,139,56;
    --light-rgb: 218,218,218;
    --dark-rgb: 78,78,78;
    --menu-shadow: 0px 3px 10px rgba(0, 0, 0, 0.12);
    --menu-shadow-navcolor: 0px 2px 6px rgba(0, 0, 0, 0.05);
    --background-navcolor-light: #fff;
    --background-navcolor-dark: #242424;
    --theme-image-filter: hue-rotate(0deg);
    --transition-time: 400ms;
    --transition-time-long: 1000ms;
    --transition-time-short: 200ms;
    --nav-size-slim: 4.5rem;
    --nav-size: 18rem;
    --footer-size: 4.5rem;
    --input-height: 42px;
    --small-title-height: 2rem;
    --font: "Nunito Sans", sans-serif;
    --font-heading: "Montserrat", sans-serif;
    --border-radius-lg: 16px;
    --border-radius-md: 10px;
    --border-radius-sm: 6px;
    --border-radius-xl: 50px;
}
:root {
    --card-spacing: 2rem;
    --card-spacing-sm: 1.25rem;
    --card-spacing-xs: 0.75rem;
    --card-spacing-sm-horizontal: 1.75rem 1.25rem;
    --card-spacing-sm-vertical: 1.25rem 1.75rem;
    --main-spacing-horizontal: 2.5rem;
    --main-spacing-vertical: 2rem;
    --title-spacing: 1.25rem;
}

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    transition: color var(--transition-time-short);
    text-decoration: initial;
    color: var(--primary);
    outline: initial !important;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}


.close {
    float: right;
    font-size: 1.40625rem;
    font-weight: 600;
    line-height: 1;
    color: #95AAC9;
    text-shadow: none;
    opacity: .5;
}

    .close:hover {
        color: #95AAC9;
    }

.btn-select {
    box-shadow: initial !important;
    background-color: var(--foreground);
    border: 1px solid var(--separator) !important;
    border-radius: var(--border-radius-md) !important;
    min-height: var(--input-height) !important;
    font-size: 1em;
    line-height: 2.5;
    color: var(--body) !important;
}

button.close {
    padding: 0;
    background-color: transparent;
    border: 0;
}
.table > :not(:last-child) > :last-child > * {
    border-bottom-color: transparent;
}
.table {
    color: #4e4e53;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

@media (max-width: 768px) {

    .p-md-5 {
        padding: 3rem !important;
    }
}
.active-list {
    color: rgba(0, 0, 0, .85) !important;
    background-color: #eeeeee !important;
}
.border-top {
    border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}

body {
    width: 100%;
    margin: 0;
    font-family: var(--font);
    font-weight: 400;
    color: var(--body);
    background-color: var(--background);
    /*font-size: 92.5%;*/
}

.styleunderline {
    text-decoration: underline;
    text-decoration-color: #9494ce5e;
    text-decoration-style: dashed;
    text-decoration-thickness: 2px;
    text-underline-offset: 1px;
}

.sticky::-webkit-scrollbar, .modal-primarycontent-right::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.sticky::-webkit-scrollbar-track, .modal-primarycontent-right::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0.05);
    border-radius: 10px;
}

.sticky::-webkit-scrollbar-thumb, .modal-primarycontent-right::-webkit-scrollbar-thumb {
    background-color: #c6c6c6;
    border-radius: 10px;
}


.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px; /* Vertically center the text there */
}

html[data-dimension=mobile] .side-menu-container {
    display: none
}

.side-menu {
    list-style: none;
    padding-left: initial;
    margin-top: -.5rem;
    width:200px;
}

    .side-menu ul {
        list-style: none;
        padding-left: initial;
        margin-bottom: 1rem
    }

    .side-menu a {
        color: var(--body);
        padding-top: .5rem;
        padding-bottom: .5rem;
        display: block
    }

        .side-menu a.active,
        .side-menu a:hover {
            color: var(--primary)
        }

            .side-menu a.active .label,
            .side-menu a:hover .label {
                color: var(--primary)
            }

        .side-menu a .icon {
            width: 17px;
            height: 17px;
            display: inline-block !important
        }

        .side-menu a[data-bs-target] {
            color: var(--muted);
            font-size: .75rem !important;
            line-height: 1.1rem !important;
            font-weight: initial !important;
            text-transform: uppercase;
            padding-bottom: .5rem;
            cursor: initial !important;
            pointer-events: none
        }

            .side-menu a[data-bs-target] .icon {
                display: none !important
            }

    .side-menu .icon {
        width: 20px;
        vertical-align: middle;
        margin-right: 10px;
        color: var(--alternate)
    }

    .side-menu .label {
        vertical-align: middle;
        color: var(--body)
    }

    .side-menu.primary a {
        color: var(--alternate)
    }

        .side-menu.primary a.active,
        .side-menu.primary a:hover {
            color: var(--primary)
        }

            .side-menu.primary a.active .icon,
            .side-menu.primary a.active .label,
            .side-menu.primary a:hover .icon,
            .side-menu.primary a:hover .label {
                color: var(--primary)
            }

        .side-menu.primary a[data-bs-target] {
            color: var(--muted)
        }

            .side-menu.primary a[data-bs-target] .label {
                color: var(--muted)
            }

.page-title-container h1 {
    line-height: 1;
}
.display-4 {
    font-family: var(--font-heading);
    font-size: 1.85em;
    line-height: 1.2;
    font-weight: 300;
}

.text-small {
    font-size: .7em !important;
    font-weight: initial !important;
}

.font-heading {
    font-family: var(--font-heading);
}

.text-muted {
    color: var(--muted) !important;
}

.btn {
    font-family: var(--font);
    padding: 10px 20px;
    font-size: 1em;
    line-height: 1rem;
    border: initial;
    box-shadow: initial;
    transition: all var(--transition-time-short);
    transition-property: color, background-color, background-image, background;
    border-radius: var(--border-radius-md);
    color: var(--light-text);
    white-space: nowrap;
}
.btn-outline-primary {
    box-shadow: inset 0 0 0 1px var(--primary) !important;
    color: var(--primary) !important;
}
    .btn-outline-primary:hover {
        color: var(--light-text) !important;
        background-color: var(--primary);
        box-shadow: initial !important;
    }
.btn-icon {
    padding: 11px 11px;
    height: 40px;
}
.btn-foreground-alternate {
    color: #4f4f4f !important;
}
.btn-white, .btn-white:not(:disabled):not(.disabled).focus, .btn-white:not(:disabled):not(.disabled):focus {
    background-color: var(--light-text);
    color: var(--primary) !important;
    border:1px solid #eee;
}
.btn-group-lg > .btn, .btn-lg {
    padding: 11px 35px;
    line-height: 1;
    font-size: 1em;
    border-radius: var(--border-radius-md);
}
.btn-white:hover, .btn-white:not(:disabled):not(.disabled).focus:hover, .btn-white:not(:disabled):not(.disabled):focus:hover {
    background-color: var(--light-text-darker);
}
.rounded {
    border-radius: 25px !important;
}

.usecase-icon {
    color: #4a4a4a;
}

.btn-trash, .btn-trash:not(:disabled):not(.disabled).focus, .btn-trash:not(:disabled):not(.disabled):focus {
    background-color: var(--light-text);
    color: var(--primary) !important;
    border: 1px solid #eee;
}
.btn-trash:hover, .btn-trash:not(:disabled):not(.disabled).focus:hover, .btn-trash:not(:disabled):not(.disabled):focus:hover {
    background-color: #e63757;
    color:white !important;
}
.list-py-1 > li:not(:last-child) {
    padding-bottom: .25rem;
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 0px;
    border-radius: 1.15rem;
    outline: 0;
    padding: 10px;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 1.25rem;
}
.card-header:first-child {
    border-radius: calc(1.25rem - 1px) calc(1.25rem - 1px) 0 0;
}
.card-footer:last-child {
    border-radius: 0 0 calc(1.25rem - 1px) calc(1.25rem - 1px);
}


.search-input-container {
    position: relative;
    border-radius: var(--border-radius-md);
}

.bg-foreground {
    background-color: var(--foreground) !important;
    color: var(--primary) !important;
}

.shadow {
    box-shadow: 0 4px 10px rgba(0, 0, 0, .03) !important;
}
.search-input-container .search-delete-icon, .search-input-container .search-magnifier-icon {
    color: var(--muted);
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 100%;
    text-align: center;
    cursor: pointer;
}







.select2-container--bootstrap4.select2-container--focus .select2-selection {
    box-shadow: initial
}

.select2-container--bootstrap4 .select2-selection {
    color: var(--body) !important;
    box-shadow: initial !important;
    background-color: var(--foreground) !important;
    border: 1px solid var(--separator) !important;
    border-radius: var(--border-radius-md) !important;
    min-height: var(--input-height) !important;
    font-size: 1em !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding: .25rem .75rem .375rem .75rem !important;
    min-height: 42px !important;
}

.select2-container .select2-search--inline .select2-search__field {
    margin-left: 0;
    margin-top: 6px;
    line-height: 1.4;
    background: initial;
    color: var(--body)
}

.select2-container--focus .select2-selection,
.select2-container--open .select2-selection {
    border: 1px solid rgba(var(--primary-rgb), 1) !important
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__rendered {
    line-height: 2.5;
    color: var(--body)
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
    line-height: 1.8;
    color: var(--muted)
}

.select2-container--bootstrap4 .select2-dropdown.select2-dropdown--below {
    margin-top: 3px
}

.select2-container--bootstrap4 .select2-dropdown.select2-dropdown--above {
    margin-top: -3px
}

.select2-container--bootstrap4 .select2-dropdown {
    border: 1px solid rgba(var(--primary-rgb), 1) !important;
    padding: .75rem;
    border-radius: var(--border-radius-md) !important;
    background: var(--foreground)
}

.select2-search--dropdown .select2-search__field {
    border-radius: var(--border-radius-sm);
    height: 28px;
    font-size: .9em;
    padding: .25rem .75rem;
    background-color: var(--foreground);
    border-color: var(--separator);
    border-radius: var(--border-radius-sm);
    color: var(--body)
}

.select2-search--dropdown {
    padding: 0;
    margin-bottom: 5px
}

.select2-results__option {
    padding: .5rem .75rem !important;
    line-height: 1.3
}

.select2-container--bootstrap4 .select2-results__option--highlighted,
.select2-container--bootstrap4 .select2-results__option--highlighted.select2-results__option[aria-selected=true] {
    cursor: pointer;
    color: var(--primary);
    background: var(--separator-light) !important;
    border-radius: var(--border-radius-sm)
}

.select2-results__option.select2-results__option--selectable.select2-results__option--selected {
    color: var(--primary) !important
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
    border: initial;
    border-top: 1px solid var(--alternate);
    border-right: 1px solid var(--alternate);
    transform: rotate(135deg);
    width: 5px;
    height: 5px;
    margin-top: -4px
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered {
    padding: .1rem .75rem 0 .75rem
}

    .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered .select2-search__field {
        padding-left: .25rem
    }

.select2-selection__choice__remove {
    border: initial;
    background: initial;
    color: var(--alternate)
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
    border-radius: var(--border-radius-sm);
    color: var(--body);
    border-color: var(--separator);
    margin-top: 5px;
    margin-right: 5px;
    line-height: 1.3
}

.select2-container .select2-search--inline {
    float: left
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
    display: inline-block
}

.select2-container--bootstrap4 .select2-dropdown .select2-results__option[aria-selected=true] {
    background: var(--separator-light) !important;
    border-radius: var(--border-radius-sm)
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: var(--primary) !important
}

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

.top-label .select2-selection {
    min-height: 52px !important
}

.top-label .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 1.5rem .75rem .25rem .75rem !important
}

.top-label .select2-container .select2-selection--multiple .select2-selection__rendered {
    padding: 1.5rem .75rem 0 .75rem !important
}

    .top-label .select2-container .select2-selection--multiple .select2-selection__rendered .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__rendered .select2-search__field {
        padding-left: initial
    }

.filled .select2-selection {
    min-height: 44px !important;
    border: 1px solid transparent !important;
    background: var(--background-light) !important
}

.filled .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 45px;
    padding-top: 9px
}

.filled .select2-container--open .select2-selection {
    border: 1px solid rgba(var(--primary-rgb), 1) !important;
    background: initial !important
}

.filled .select2-container .select2-selection--multiple .select2-selection__rendered {
    padding-left: 45px;
    padding-top: 5px
}

.filled .select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
    color: var(--alternate)
}

.select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
    color: var(--muted)
}

.hide-search-searching .select2-search {
    display: none
}

.select2-container--bootstrap4.select2-container--disabled .select2-selection {
    background: rgba(var(--separator-rgb), .5) !important;
    color: var(--muted);
    border-color: var(--separator)
}

.form-floating .select2-selection {
    height: auto;
    min-height: 52px !important;
    padding: 1rem 0
}

.form-floating .select-floating ~ label {
    -webkit-transform: initial;
    transform: initial;
    color: var(--alternate);
    transition: initial
}

.form-floating .select2.full ~ label,
.form-floating .select2.show ~ label {
    -webkit-transform: scale(.85) translateY(-.5rem) translateX(.15rem);
    transform: scale(.85) translateY(-.5rem) translateX(.15rem);
    color: var(--muted);
    transition: opacity .1s ease-in-out, transform .1s ease-in-out, -webkit-transform .1s ease-in-out
}

.form-floating .select2.full ~ .select2 .select2-selection,
.form-floating .select2.show ~ .select2 .select2-selection {
    padding-top: 1.25rem;
    padding-bottom: 0
}

.option-circle {
    width: 15px;
    height: 15px;
    border: 1px solid var(--primary)
}

.select2-dropdown {
    z-index: 1061
}

.text-muted {
    color: #95AAC9 !important;
}
.custom-select, .form-control, .form-select {
    font-size: 1em;
    height: auto;
    min-height: var(--input-height);
    color: var(--body);
    box-shadow: initial !important;
    background-color: var(--foreground);
    border-color: var(--separator);
    border-radius: var(--border-radius-md);
    filter: none;
    width: 100%;
    transition: border-color .15s ease-in-out;
}
    .form-control:focus {
        border: 1px solid rgba(var(--primary-rgb), 1) !important;
    }

.custom-select.thin, .form-control.thin, .form-select.thin {
    min-height:2.25rem !important;
}
.btn.thin {
    padding: 5px 15px 5px 5px;
}
.table-lg > :not(caption) > * > * {
    padding: 1rem 1.25rem;
    vertical-align: middle;
}


.circle-dot {
    background-color: green;
    height: 14px;
    width: 14px;
    vertical-align: middle;
    margin-right: 12px;
    border-radius: 50%;
    display: inline-block;
}

#feedback {
    position: fixed;
    background-color: #007fe4;
    height: 100px;
    width: 35px;
    right: 0px;
    top: calc(50vh - 50px);
    z-index: 999;
    text-align: center;
    border-radius: 6px 0px 0px 6px;
}

    #feedback:hover {
        background-color: #0371c8;
        width: 40px;
        padding-right: 4px;
        cursor: pointer;
        transition: all 0.3s;
    }
    #feedback .label {
        width: 100%;
        text-align: center;
        font-size: 14px;
        font-weight: 100;
        font-family: 'Nunito Sans';
        color: white;
        padding-left: 6px;
        transform: scale(-1);
        writing-mode: vertical-lr;
        -webkit-writing-mode: vertical-lr;
        padding-top: 4px;
        padding-bottom: 10px;
    }


label.radio {
    cursor: pointer;
    width: 100% !important;
    margin-top: 9px
}

    label.radio input {
        position: absolute;
        top: 0;
        left: 0;
        visibility: hidden;
        pointer-events: none;
        width: 100%;
        align-items: center;
    }

    label.radio i {
        padding: 0px 8px;
        padding-top: 3px;
        display: inline-block;
        border-radius: 13px;
        width: 100%;
        align-items: center;
        border: 1px solid white;
    }

    label.radio input:checked + i {
        border: 1px solid #cdcdcd;
    }


.text-sad {
    color: #ffa900;
}
.text-happy {
    color:#00ba34;
}
.text-neutral {
    color: #8db400;
}
#feedbackModel {
    position: fixed;
    width: 400px;
    max-width: 100%;
    top: 10vh;
    padding: 20px;
    box-shadow: 0px 0px 37px -0px #aeaeae;
    z-index: 999;
    background-color: white;
    border-radius: 13px;
    transition: all 0.3s;
}
.player {
    border-radius: 1rem !important;
}
@media (max-width: 992px)
{
    #feedbackModel {
        padding-left:20px;
        right:0px !important;
        width:100% !important;
    }
}

.introjs-skipbutton {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    color: #1553ec;
    float: right;
    font-size: 18px;
    cursor: pointer;
    font-weight: 500;
    line-height: 1;
    text-align: center;
    padding: 3px 9px;
    margin-top: -1px;
    margin-right: -10px;
}

@media (min-width: 993px) {
    #feedbackModel {
        right: -400px;
        -webkit-animation: slide 0.5s forwards;
        -webkit-animation-delay: 0s;
        animation: slide 0.5s forwards;
        animation-delay: 0s;
    }
    @-webkit-keyframes slide {
        100% {
            right: 35px;
        }
    }

    @keyframes slide {
        100% {
            right: 35px;
        }
    }

}
.btn-xxl {
    padding: 20px 40px;
}
.bg-position-center {
    background-position: center !important;
}

.bg-size-cover {
    background-size: cover !important;
}
.modal-right {
    padding-right: 0 !important
}

    .modal-right .modal-dialog {
        margin: 0 auto;
        margin-right: 0;
        margin-top: 0;
        margin-bottom: 0;
        height: 100%;
        width: 500px;
        max-width: 500px
    }

    .modal-right .modal-body {
        height: 100% !important
    }

    .modal-right .modal-content {
        min-height: 100%;
        border: initial;
        border-radius: initial;
        border-top-left-radius: var(--border-radius-lg);
        border-bottom-left-radius: var(--border-radius-lg)
    }

    .modal-right .modal-header {
        flex: 0 0 var(--nav-size-slim);
        padding-top: 1rem;
        padding-bottom: 1rem;
        border-top-left-radius: var(--border-radius-lg)
    }

    .modal-right .modal-footer {
        justify-content: center;
        flex-grow: 0;
        flex-shrink: 0;
        border-bottom-left-radius: var(--border-radius-lg)
    }

    .modal-right.modal.fade .modal-dialog {
        transform: translate(25%, 0)
    }

    .modal-right.modal.show .modal-dialog {
        transform: translate(0, 0)
    }

    .modal-right.large .modal-dialog {
        max-width: 530px
    }








.nav-link {
    display: block;
    padding: .5rem 1rem;
    color: #8d8d8d;
    text-decoration: none;
    transition: none;
}
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color: #fff #fff #dee2e6 #fff;
    isolation: isolate;
}
.nav-link:focus {
    color: #8d8d8d;
}
.nav-link:hover {
    color: #495057;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: #dee2e6 #dee2e6 #fff;
    border: 0px;
    border-bottom: 2px solid var(--primary);
    color: var(--primary);
}

.btn-sm {
    padding: 6px 11px;
}
.alert-beta {
    background-color: #e0f1ff;
    border: 1px solid #cae2ff;
}
.btn-attention2 {
    background-color: #0c61c8;
    color: white;
}
    .btn-attention2:hover {
        background-color: #215ab9;
        color: white;
    }
.btn-attention {
    background-color: #990435;
    color: white;
}

    .btn-attention:hover {
        background-color: #710629;
        color: white;
    }
.bg-dark {
    background-color: #182b3f !important; /*#323335 !important;*/
}
.btn-dark {
    color: #fff;
    background-color: #000000;
}

.navbar-nav:first-child {
    padding-left: 40px !important;
}
.btn-xl {
    padding: 17px 35px;
}
.pt-10 {
    padding-top: 5.5rem;
}






.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #182b3f;
}
.search {
    position: relative;
    box-shadow: 0 0 40px rgba(51, 51, 51, .1)
}

    .search input {
        height: 60px;
        text-indent: 25px;
        border: 0
    }

        .search input:focus {
            box-shadow: none;
            border: 0
        }

    .search .bi-search {
        position: absolute;
        top: 20px;
        left: 16px;
        color: #6a6a6a;
    }

    .search button {
        position: absolute;
        top: 5px;
        right: 5px;
        height: 50px;
        width: 110px;
        background: #182b3f;
    }

.stacked {
    margin-bottom: 25px;
}
    .stacked .list-group-item {
        border:0px;
    }

    .header-item {
        padding: 15px 15px 15px 15px;
        color: #1587c1 !important;
        border-radius: 20px;
    }
    .header-item:hover {
        background-color: #ececec !important;
    }
.header-item-dark {
    padding: 15px 15px 15px 15px;
    color: #f4f4f4 !important;
    border-radius: 20px;
}

    .header-item-dark:hover {
        background-color: #14375b !important;
    }

.section-title {
    text-align: center;
    padding-bottom: 30px;
}
    .section-title h2 {
        font-size: 16px;
        letter-spacing: 1px;
        font-weight: 700;
        margin: 0;
        color: #9d9d9d;
        text-transform: uppercase;
    }
    .section-title h3 {
        margin: 0px 0 0 0;
        font-size: 32px;
        font-weight: 700;
        color: #2c2c2c;
    }
.h-80 {
    height:80vh !important;
}

.dropdown-item-lg {
    padding: 0.75rem 5rem 0.75em 2.5rem !important;
}


.badge-green {
    color: #fff;
    background-color: #28a745;
}

.sticky {
    position: sticky;
    top: 0;
    height: calc(100vh - 0px);
    overflow-y: scroll;
}
.nav-vertical-2 .nav-item.active {
    padding-bottom: 15px;
}

.nav-vertical-2 .nav-item {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    transition: all 0.2s;
    transition-delay: 0s;
    -webkit-transition-delay: 0s;
    -moz-transition-delay: 0s;
    transition-delay: 0s;
}
.nav-vertical-2 .nav-link[aria-expanded] {
    position: relative;
}

.nav-vertical-2 .nav-link {
    color: #000;
    display: block;
    border-right: 2px solid transparent;
    padding: 15px 30px;
}
    .nav-vertical-2 .nav-link[aria-expanded="true"]::after {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .nav-vertical-2 .nav-link[aria-expanded]::after {
        position: absolute;
        content: "\ebfa";
        width: 1em;
        line-height: 1em;
        right: 30px;
        top: 50%;
        font-family: 'icomoon' !important;
        font-size: 1.2rem;
        margin-top: -0.5em;
        color: #999999;
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
        transition-delay: 0s;
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        transition-delay: 0s;
    }
.doc-sidebar {
    padding: 30px;
    border-right: 1px solid #e5e5e5;
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0;
    margin-bottom: 0px;
    list-style: none;
}
.doc-content-body > article {
    padding: 3.125rem;
}

.b-example-divider {
    flex-shrink: 0;
    width: 1.5rem;
    height: 100vh;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.bi {
    vertical-align: -.125em;
    pointer-events: none;
    fill: currentColor;
}

.dropdown-toggle {
    outline: 0;
}

.nav-flush .nav-link {
    border-radius: 0;
}
.btn-toggle-noarrow,
.btn-toggle {
    display: inline-flex;
    align-items: center;
    padding: .75rem 2.5rem;
    color: rgba(0, 0, 0, .65);
    background-color: transparent;
    border: 0;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
}

    .btn-toggle-noarrow.active,
    .btn-toggle-noarrow:hover,
    .btn-toggle:hover,
    .btn-toggle:focus {
        color: rgba(0, 0, 0, .85);
        background-color: #eeeeee;
    }

    .btn-toggle::after {
        width: 1.25em;
        line-height: 0;
        content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
        transition: transform .35s ease;
        transform-origin: .5em 50%;
        position: absolute;
        right: 35px;
        transform: rotate(90deg);
    }

    .btn-toggle[aria-expanded="true"] {
        color: rgba(0, 0, 0, .85);
    }

        .btn-toggle[aria-expanded="true"]::after {
            transform: rotate(270deg);
        }

.btn-toggle-nav a {
    display: inline-flex;
    padding: .1875rem .5rem;
    margin-top: .125rem;
    padding-left: 1.25rem;
    padding: .5rem 0rem .5rem 3.7rem;
    text-decoration: none;
    width: 100%;
    font-size: 16px;
}

    .btn-toggle-nav a:hover,
    .btn-toggle-nav a:focus {
        background-color: #eeeeee;
    }

.scrollarea {
    overflow-y: auto;
}

.fw-semibold {
    font-weight: 600;
}

.lh-tight {
    line-height: 1.25;
}

article > section:not(:first-child) {
    margin-top: 3.125rem;
}

.bordered {
    border-radius: 0.25rem;
    border: 1px solid #e5e5e5;
}
.color .color-example {
    width: 80px;
    height: 80px;
    margin-right: 20px;
    border-radius: 50%;
}
.bg-blue {
    background-color: #064CDB !important;
}
.bg-green {
    background-color: #28a745 !important;
}
.bg-red {
    background-color: #dc3545 !important;
}
.boxed {
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    border-radius: 0.25rem;
    border: 1px solid #e5e5e5;
    background: white;
}
.color {
    display: flex;
    align-items: center;
    padding: 10px;
    border-radius: 10rem;
}
.section-title-2 {
    position:relative;
}
    .section-title-2 .anchor {
        -webkit-transition: all 0.2s;
        -moz-transition: all 0.2s;
        transition: all 0.2s;
        transition-delay: 0s;
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        transition-delay: 0s;
        opacity: 0;
        color: #adb5bd;
        outline: none;
        font-size: 18px;
        position: absolute;
        right: 0px;
    }
.section-title-2:hover .anchor {
    opacity: 1;
}

.section-title-2 .anchor:hover {
    color: #064CDB;
}
.doc-block {
    border: 1px solid #eee;
    /* margin: 10px; */
    padding: 20px;
    border-radius: 10px;
}
.p-rel {
    position:relative;
}
.btn-variablemenu {
    border: 0px;
    position: absolute;
    top: 6px;
    right: 7px;
    padding: 10px;
    background-color: #ffffff;
    color: #1b6ec2;
}

@media (max-width: 992px) {
    #navbar .header-item-dark {
        color: black !important;
    }

        #navbar .header-item-dark:hover {
            color: white !important;
        }

    #navbar .dropdown-menu {
        border: 0 !important;
    }

    .bg-sm-dark {
        background-color: #182b3f !important;
    }
}
    @media (max-width: 992px) {
        .navbar-collapse {
            display: block;
            position: absolute;
            top: 58px;
            right: 0px;
            width: 70%;
            max-width: 350px;
            background-color: #ffffff;
            height: calc(100vh - 58px);
            z-index: 99999;
            box-shadow: -2px 3px 14px #ccc;
        }

        .navbar-nav:first-child {
            padding-top: 20px !important;
            padding-left: 0px !important;
        }

        .nav-item {
            margin-top: 15px;
            margin-bottom: 15px;
            font-size: 15px;
        }

        .navbar-nav {
            text-align: center;
        }

        .dropdown-menu {
            background-color: white;
        }

        .btn-toggle {
            color: white !important;
        }

        .btn-toggle-nav .link-dark {
            color: white !important;
        }

        .btn-toggle-nav a:hover,
        .btn-toggle-nav a:focus {
            background-color: #4b4b4b;
        }

        .btn-toggle:hover,
        .btn-toggle:focus {
            color: rgba(0, 0, 0, .85);
            background-color: #4b4b4b;
        }
    }

    .subtitle {
        font-weight: 400;
    }


















































.introjs-tooltip {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    position: absolute;
    visibility: visible;
    background-color: #fff;
    min-width: 414px;
    max-width: 414px;
    border-radius: 20px;
    -webkit-box-shadow: 0 3px 30px rgb(33 33 33 / 30%);
    box-shadow: 0 3px 30px rgb(33 33 33 / 30%);
    -webkit-transition: opacity .1s ease-out;
    -o-transition: opacity .1s ease-out;
    transition: opacity .1s ease-out;
}


.customTooltip * {
    color: #4f4f4f;
}

.customTooltip .introjs-tooltip-title {
    color: #4f4f4f;
}
.introjs-tooltiptext {
    padding: 20px;
    padding-bottom: 45px;
}


.introjs-prevbutton, .introjs-nextbutton, .introjs-nextbutton:focus {
    background-color: var(--light-text);
    color: var(--primary) !important;
    border: 1px solid #eee;
}

.introjs-button {
    font-family: var(--font);
    font-size: 1em;
    line-height: 1rem;
    box-shadow: initial;
    transition-duration:;
    transition-timing-function:;
    transition-delay:;
    transition-property: color, background-color, background-image, background;
    color: var(--light-text);
    white-space: nowrap;
    padding: 10px 20px;
    border: initial;
    border-radius: var(--border-radius-md);
}
.introjs-nextbutton {
    border: 1px solid #eee !important;
}
.introjs-disabled {
    background-color: #ffffff !important;
    color: #949494 !important;
    text-shadow: none;
}

.introjs-helperLayer {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    position: absolute;
    z-index: 9999998;
    border-radius: 4px;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    box-shadow: rgb(85 140 228 / 80%) 0px 0px 1px 2px, rgb(33 33 33 / 50%) 0px 0px 0px 5000px !important;
}
.introjs-arrow.top {
    top: -10px;
    left: 18px;
    border-bottom-color: #fff;
}
.btn-primary:hover {
    color: #fff;
    background-color: #003f72;
    border-color: #003f72;
}
.text-dark {
    color: #212529 !important;
}
.border-primary {
    border: 1px solid #007fe4;
}
.text-left {
    text-align: left;
}
.min-h-50 {
    min-height: 50vh;
}
.doclist {
    margin-left:30px;
}
.doclist > li {
    margin-top:16px;
}
    .doclist > li:before {
        font-weight: 900;
    }
.notsupported {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #b4b4b4;
    z-index: 999999;
    align-items: center;
    text-align: center;
    font-size: 21px;
    padding: 48px;
}


.video-player-btn {
    z-index: 3;
    color: #1e2022;
    transition: -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out,-webkit-transform .3s ease-in-out;
}

.video-player {
    position: relative;
    display: inline-block;
}

.video-player-icon {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    vertical-align: middle;
    text-align: center;
    width: 4.25rem;
    height: 4.25rem;
    font-size: 1.25rem;
    border-radius: 50%;
    color: #1e2022;
    background-color: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    transition: .3s;
}

.responsive-tabs {
    padding: 1rem;
}

    .responsive-tabs .nav-tabs {
        display: none;
    }

@media (min-width: 768px) {
    .responsive-tabs .nav-tabs {
        display: flex;
    }

    .responsive-tabs .card {
        border: none;
    }

        .responsive-tabs .card .card-header {
            display: none;
        }

        .responsive-tabs .card .collapse {
            display: block;
        }
}

@media (max-width: 767px) {
    .responsive-tabs .tab-pane {
        display: block !important;
        opacity: 1;
    }
}

@media (max-width: 767px) {
    .nav-tabs {
        overflow-x: auto;
        overflow-y: hidden;
        display: -webkit-box;
        display: -moz-box;
    }
    .nav-item {
        flex: 1 1 auto;
        text-align: center;
        display: table-cell;
        font-size: 12px;
    }
}