/*Viewport notes for bootstrap 5*/
/*
    xs: less than 576px (but don't use col-xs-6, it's now just col-6)
    sm: 576+
    md: 768+
    lg: 992+
    xl: 1200+
    xxl: 1400+
*/

html {
    font-size: 16px;
}

body {
    padding-top: 0px;
    padding-bottom: 20px;
    font-size: 16px;
    color: #333333;
    background-color: #000;
}

    body.loggedIn {
        /*padding-top: 145px;*/
    }

/*input:-moz-read-only {*/ /* For Firefox */
/*background-color: lightgrey;
}

input:read-only {
    background-color: lightgrey;
}

input[type='checkbox']:read-only:not(:checked), input[type='radio']:read-only:not(:checked) {
    background-color: white;
}*/

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

#layoutFooterContainer {
    padding-top: 15px;
    color: #fff;
}

#layoutPageContainer {
    min-height: 600px;
    padding-top: 30px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 50px;
    /*background-color: #eff0f1;*/
    background-color: #fff;
}

@media (max-width: 575px) {
    #layoutPageContainer {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}


.no-bullets ul {
    list-style-type: none; /* Remove bullets */
}

.no-line {
    border-bottom-width: 0px !important;
}

.no-margin {
    margin: 0px !important;
}

.container-rounded {
    border-radius: 1rem;
    border: 1px solid #d6d6d6;
    padding: 15px;
}

.container-border {
    border: 1px solid #d6d6d6;
    padding: 15px;
}

.container-white {
    background-color: #fff;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #d6d6d6;
    margin: 1em 0;
    padding: 0;
}

.page-logo {
    max-width: 500px;
}

@media (max-width: 991px) {
    .page-logo {
        max-width: 400px;
    }
}

@media (max-width: 575px) {
    .page-logo {
        max-width: 300px;
    }
}

.aff .page-header {
    border-bottom: 1px solid #ccc;
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 20px;
    margin-bottom: 15px;
}

.text-label, .aff label {
    font-weight: bold;
}

.aff .form-check label {
    font-weight: normal;
}

.text-blue {
    color: #102d4d;
}

.icon-steps-text {
    font-size: 20px;
}

.icon-steps {
    color: #1A2740;
}

.hover-hand:hover {
    cursor: pointer;
}

/*Nav*/
.navbar-custom {
    font-size: 1.1rem;
    height: 79px;
    border-bottom: 1px solid #eee;
    background-color: #ffffff;
}

    .navbar-custom.navbar-dark {
        background-color: #2d5593;
        color: white;
    }

        .navbar-custom.navbar-dark .navbar-text {
            color: white;
        }

    .navbar-custom.navbar-light .nav-link {
        color: #102d4d;
        text-decoration: none;
        font-weight: bold;
        border-bottom: 3px solid #fff;
    }

    .navbar-custom.navbar-dark .nav-link {
        color: #fff;
        text-decoration: none;
    }

    .navbar-custom a {
        color: #000;
        text-decoration: none;
    }

    .navbar-custom.navbar-dark a {
        color: #fff;
        text-decoration: none;
    }

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: #102d4d;
    border-bottom: 3px solid #102d4d;
}

.nav-logo {
    max-width: 160px;
    padding: 0 0 5px;
}

.navbar-light .navbar-toggler {
    color: rgba(0, 0, 0, .55);
    /* border-color: rgba(0, 0, 0, .1); */
}

@media (min-width: 768px) {
    .nav-logo {
        max-width: 300px;
    }
}


.navbar-toggler:focus {
    box-shadow: 0 0 0 0;
}

/*prevent outline borders*/
a:focus {
    outline: none;
}



.link-color {
    color: #102d4d;
}

a, a:active, a:visited, .link, .link:active, .link:visited, a.dropdown-item {
    font-weight: 400;
    cursor: pointer;
    /*color: #102d4d;*/
    letter-spacing: .02rem;
    text-decoration: underline;
}

    a.navbar-brand, a.navbar-brand:active, a.navbar-brand:visited {
        text-decoration: none;
    }

    a.dropdown-item {
        text-decoration: none;
    }

    a:hover, a:focus, .link:focus, .link:hover {
        color: #102d4d;
    }

    a.strong, .link.strong {
        font-weight: 700;
    }

.dropdown-item.active, .dropdown-item:active {
    color: #102d4d;
    text-decoration: underline;
    background-color: #fff;
}

/*Buttons*/
.aff .btn {
    border-radius: 12px;
    min-width: 140px;
}

.aff .btn-primary, .aff .btn-check:checked + .aff .btn-primary, .aff .btn-check:active + .aff .btn-primary, .aff .btn-primary:active, .aff .btn-primary.active, .show > .aff .btn-primary.dropdown-toggle, .aff .btn-primary:visited {
    color: #fff;
    background-color: #1A2740;
    border-color: #1A2740;
    text-decoration: none;
}

    .aff .btn-primary:hover, .aff .btn-primary:focus, .aff .btn-primary.focus {
        color: #1A2740;
        background-color: #DDAE07;
        border-color: #DDAE07;
        text-decoration: none;
    }

.aff .btn-secondary, .aff .btn-check:checked + .aff .btn-secondary, .aff .btn-check:active + .aff .btn-secondary, .aff .btn-secondary:active, .aff .btn-secondary.active, .show > .aff .btn-secondary.dropdown-toggle, .aff .btn-secondary:visited {
    color: #fff;
    background-color: #6a6a6a;
    border-color: #6a6a6a;
    text-decoration: none;
}

    .aff .btn-secondary:hover, .aff .btn-secondary:focus, .aff .btn-secondary.focus {
        color: #fff;
        background-color: #b3b3b3;
        border-color: #b3b3b3;
        text-decoration: none;
    }

.aff .btn-sm {
    min-width: 80px;
}

.aff .btn-lg {
    font-size: 1.15rem;
    min-width: 180px;
}

    .aff .btn-lg.btn-main-menu {
        min-width: 250px;
        width: 100%;
        /*line-height: 88px;
        text-align: left;*/
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 90px;
    }

@media (max-width: 575px) {
    .aff .btn-lg.form-btns {
        min-width: 140px;
        margin: 10px;
    }
}

.include-arrow:after {
    border-style: solid;
    border-width: 0.15em 0.15em 0 0;
    content: "";
    display: inline-block;
    height: 0.55em;
    /*right: 0.85em;*/
    position: relative;
    transform: rotate(45deg);
    transition: all 0.35s;
    /*vertical-align: top;*/
    font-size: 30px;
    width: 0.55em;
    border-radius: 1px;
    top: 0px;
    border-radius: 4px;
    color: #fff;
}

.include-arrow:hover:after {
    color: #1A2740 !important;
}

.btn-main-menu.include-arrow:after {
    position: absolute;
    top: 40px;
    right: .85em;
}

.btn-main-menu.include-arrow:hover:after {
    position: absolute;
    top: 40px;
    right: .85em;
}

/*Inputs*/
input.form-control-plaintext:focus-visible {
    outline-width: 0px;
}

/*Grid*/
.aff-grid .grid-header {
    vertical-align: top;
    border-bottom: 1px solid #ccc;
    font-weight: bold;
}

    .aff-grid .grid-header .grid-col {
        padding-top: 10px;
        padding-bottom: 10px;
    }

.aff-grid .grid-content {
    border-bottom: 1px solid #ddd;
    /*border-left: 1px solid #ccc;*/
    padding-top: 5px;
    padding-bottom: 5px;
}

    .aff-grid .grid-content:hover {
        background-color: #f3f3f3;
    }

    .aff-grid .grid-content .grid-col {
        /*border-right: 1px solid #ccc;*/
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .aff-grid .grid-content.no-line {
        border-bottom: 0px;
    }

/*Modal*/
.modal-backdrop {
    background-color: #000;
}

    .modal-backdrop.in, .modal-backdrop.show {
        opacity: .3;
    }

.modal .container-fluid.modal-body-content {
    padding-left: 0;
    padding-right: 0px;
}

.modal .modal-content {
    padding: 0px 10px;
}

.modal .modal-footer {
    justify-content: center;
    border-top: 0px;
    padding-top: 25px;
}

.modal .modal-dialog.no-title .modal-header {
    border-bottom: 0px;
    padding-bottom: 0px;
}

/*Loader*/
.ajax-backdrop {
    background-color: #000;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: .3;
    position: fixed;
    z-index: 9998;
}

.ajax-overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 9998;
}

.ajax-loader {
    position: absolute;
    left: 50.85%;
    top: 45%;
    z-index: 9999;
    width: 120px;
    height: 120px;
    margin: -75px 0 0 -75px;
    border: 1px solid #f3f3f3;
    border-radius: 50%;
    border-top-color: #2477ca;
    border-bottom-color: #2477ca;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

.ajax-loader-text {
    /*position: absolute;
    left: 25%;
    top: 43%;*/
    z-index: 9999;
    /*width: 50%;*/
    font-weight: bold;
    /*text-align: center;
    -webkit-animation: none;
    animation: none;*/
    color: white;
    background-color: black;
    font-size: 28px;
}

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

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

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

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

@media (max-width: 767px) {
    .ajax-loader {
        left: 51.5%;
    }
}

@media (max-width: 575px) {
    .ajax-loader {
        left: 52.5%;
    }
}

/*Forms*/
.form-control::placeholder {
    color: #999;
}

.form-control:-ms-input-placeholder {
    color: #999;
}

.form-control::-ms-input-placeholder {
    color: #999;
}

/* Chrome, Safari, Edge, Opera */
input.no-arrows[type=number]::-webkit-outer-spin-button,
input.no-arrows[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input.no-arrows[type=number] {
    -moz-appearance: textfield;
}

/*Menu and Typeahead*/
.twitter-typeahead {
    display: block !important;
}

.tt-menu {
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
}


.tt-suggestion, .tt-empty-message {
    display: block;
    width: 100%;
    padding: 0.25rem 1rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    text-decoration: none;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.tt-selectable {
    cursor: pointer;
}

.tt-suggestion:hover, .tt-suggestion:focus {
    color: #1e2125;
    background-color: #e9ecef;
}

/*Mongo File Uploader*/
.qq-uploader-selector.qq-uploader-selector .buttons {
    padding: 10px;
}

#step1-fileupload, #step2-fileupload {
    width: 32px !important;
    height: 32px !important;
}