/********************** Layout **********************/

body.theme {
      background-color: #F5F7FA;
    background-image: url('/public/theme/bg.jpg?theme=${theme}');
  }

.theme .main-header {
    border-bottom-color: #35adfc;
    background: #ffffff;
    color: #606d7b;
}

.theme .toggle-nav--button span {
    background: #606d7b !important;
}

.theme .searchOverlay_Wrapper {
    color: #606d7b;
}

.theme .app-title,
.theme .app-subtitle {
    color: #606d7b;
}

.theme .lead-bg-color,
.theme .lead-border-color,
.theme .lead-font-color {
    background-color: #3399CC;
}

.theme .hoverTitle:hover,
.theme a.chapter-box__link:hover {
    box-shadow: inset 4px 0 #3399CC;
}

.theme .breadcrumb,
.theme .breadcrumb--item {
    color: #1f2933;
    opacity: 0.8;
            text-shadow: .5px .5px rgba(51, 51, 51, .4);
    }

.theme .breadcrumb--item:not(:disabled):not(.disabled):hover,
.theme .breadcrumb--item:not(:disabled):not(.disabled):focus,
.theme .breadcrumb--item:not(:disabled):not(.disabled):active {
    color: #1f2933;
    opacity: 0.9;
}

.theme .breadcrumb--item:last-child {
    color: #1f2933;
}

.theme .dashboard_Intro h2 {
    color: #1f2933;
            text-shadow: .5px .5px rgba(51, 51, 51, .4);
    }

.theme footer.footer a:not(._noLink):not(.btn),
.theme footer.footer a:not(._noLink):not(.btn):visited,
.theme footer.footer {
    color: #1f2933;
}

.theme footer.footer a:not(:disabled):not(._disabled):hover,
.theme footer.footer a:not(:disabled):not(._disabled):focus,
.theme footer.footer a:not(:disabled):not(._disabled):active {
    color: #1f2933;
    opacity: 0.9;
}

.theme footer.footer {
      text-shadow: .5px .5px rgba(51, 51, 51, .4);
  }

/********************** Content Links **********************/

.theme .mainContent a:not(.no-link):not(.btn):hover,
.theme .mainContent a:not(.no-link):not(.btn):focus,
.theme .mainContent a:not(.no-link):not(.btn):active {
    color: #3399CC;
}


/********************** SVG **********************/

.theme svg.loader {
  stroke: #3399CC;
}



/********************** Buttons **********************/

.theme .btn:not(.no-link).lead-color i,
.theme .btn:not(.no-link).lead-color,
.theme .btn:not(.no-link).primary, i
.theme .btn:not(.no-link).primary {
    background-color: #3399CC;
    color: #ffffff;
}

.theme .btn:not(.no-link).lead-color:hover,
.theme .btn:not(.no-link).primary:hover {
    background-color: #5cadd6;
}

.theme .btn:not(.no-link):focus,
.theme .btn:not(.no-link):focus {
    box-shadow:
        0 0 0 1px hsl(0, 0%, 100%),
        0 0 0 2px #5cadd6,
        0 3px 6px hsla(0, 0%, 0%, .15),
        0 2px 4px hsla(0, 0%, 0%, .12);
}

// Download Fields
.theme .btn-download .download-hover-overlay {
    background-color: #d6ebf5;
}

.theme .btn-download .download-hover-overlay i {
    color: #3399CC;
}

.theme .learning-mobile {
    color: #ffffff;
}


/********************** Input controls **********************/

.theme .control--partial div.control__indicator,
.theme .control--partial input:checked~div.control__indicator {
    box-shadow: inset 0 0 0 2px #3399CC;
}

.theme .control--partial div.control__indicator::after,
.theme .control--partial input:checked~div.control__indicator::after {
    background: #3399CC;
}


/********************** Zoom icon **********************/

@media (min-width: 992px ) {
    .theme .img-zoom i {
        background-color: #3399CC;
    }
}



/********************** Toolbar **********************/

@media (min-width: 992px ) {
    .theme #toolbar .action-buttons .primary,
    .theme #toolbar .action-buttons .lead-color {
        background-color: #3399CC;
        border-top-color: #0f2e3d;
    }

    .theme #toolbar .action-buttons .lead-color:not(:disabled):not(.disabled):hover,
    .theme #toolbar .action-buttons .lead-color:not(:disabled):not(.disabled):focus,
    .theme #toolbar .action-buttons .lead-color:not(:disabled):not(.disabled):active,
    .theme #toolbar .action-buttons .primary:not(:disabled):not(.disabled):hover,
    .theme #toolbar .action-buttons .primary:not(:disabled):not(.disabled):focus,
    .theme #toolbar .action-buttons .primary:not(:disabled):not(.disabled):active{
        background-color: #5cadd6;
    }
}

.theme #toolbar .action-buttons .primary i {
    color: #ffffff;
}


/********************** Highscore **********************/

.theme .highscore li.highscore--active {
    border-bottom-color: #3399CC;
}

.theme .highscore li.highscore--active:hover {
    background-color: #d6ebf5;
}

.theme .highscore li.highscore--active .highscore__position {
    background-color: #d6ebf5;
}



/********************** Forms **********************/

.theme #pictureDiv input:focus,
.theme #pictureDiv input:active,
.theme input:focus,
.theme input:active,
.theme textarea:active,
.theme textarea:focus {
    border-color: #3399CC;
}

/********************** Radial Progress **********************/
.theme .radialProgress .circle .mask .fill {
    background-color: #3399CC;
}


.theme .chapterItem .moreButton {
  color: #3399CC;
}


/********************** Comments **********************/

.theme .showAllComments {
  color: #3399CC;
}

/********************** AI Chat Bot **********************/

.theme .primaryColorBackgroundColor {
    background-color: #3399CC !important;
}

.theme .chatMessage.sent .primaryColorForegroundColor.bubble:last-child:after {
    color: #3399CC !important;
}

.theme .primaryColorBorderColorBoxShadow:focus {
    box-shadow: 0 0 0 2px #3399CC !important;
}