html, body{
    --corporate-green: #88BD29;
    --corporate-purple: #6E378C;
    --success-green: #86b558;
}

/* skin#code */
/* first, extra, non present at skin colors */
.skin-code{
    --sidebar-background-color: #222A2D;
    --sidebar-background-secondary-color: #141A1B;
}

.login-layout .widget-box {
  background-color: #3e5639;
}

.skin-code .login-box .toolbar {
  background: #7da949;
  border-top: 2px solid #3d582b;
}

.skin-code .btn-primary {
  /*2283c5 => 8db84e*/
  background-color: #8db84e !important;
  border-color: #8db84e;
}
.skin-code .btn-primary:hover {
  background-color: #708D3D !important;
}

.skin-code .btn-app.btn-app-small{
    padding: 6px 0 4px;
    font-size: 15px;
}

.skin-code a{
  color: green;
}

.notification-ball{
    position: absolute;
    width: 10px;
    height: 10px;
    right: 0;
    top: 0;
    background-color: red;
    border-radius: 50%;
}

.notification-ball.has-number{
    width: 15px;
    height: 15px;
    color: white;
    text-shadow: none;
    font-size: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
}

.skin-code .navbar .navbar-inner {
 background:var(--sidebar-background-color);
 z-index: 999;
}

.skin-code .ace-nav > li{
  background: transparent;
}

.skin-code .ace-nav > li.red{
  background: #b74635;
}

.skin-code .ace-nav > li.light-green {
  background-color: #8ebb10;
}

.skin-code .ace-nav > li.grey {
  background: #555555;
}

.skin-code .page-content .page-header:first-child h1, .skin-code .page-content .course-list  {
  color: #4fb225;
}

.skin-code  .sidebar , .skin-code  .sidebar:before {
 background-color:var(--sidebar-background-color);
 border-right:none;
}

.sidebar #help-menu{
    position: fixed;
    left: 54px;
    bottom: 10px;
    z-index: 100;
}
.sidebar.menu-min #help-menu{
    left: 10px;
}

.skin-code .widget-box .widget-header {
  color: #49b243;
}


.skin-code  .nav-list > li {
 border-color:#3F4E54;
 border-top-width:0;
}
.skin-code .nav-list > li > a  , .skin-code .menu-min .nav-list > li.open > a{
 background-color:var(--sidebar-background-color);
 color:#B1BAC1;
}
.skin-code .nav-list > li:hover > a {
 background-color:#414B51;
 color:#E1EAF1;
}
.skin-code .nav-list > li > a > .arrow  {
  color:#B1BAC1;
}
.skin-code .nav-list > li.open > a > .arrow {
  color:#E1EAF1;
}


.skin-code .nav-list > li .submenu > li > a {
    border-top: 0.5px solid #70818E;
}
.skin-code .nav-list > li.active .submenu > li > a {
	border-top-color:#70818E;
}

.skin-code .nav-list  li.active > a:after {
 border-right-color:#FFF;
 border-width:16px 10px;
 top:2px;
}


.skin-code  .nav-list > li.active.open > ul.submenu > li.active > a:after {
 top:1px;
}
.skin-code .nav-list > li.active:after {
 display:none;
}
.skin-code .menu-min .nav-list > li.active > a:after {
 border-width:10px 6px;
 top:8px;
}
.skin-code .menu-min .nav-list > li.active:hover > a:after {
 border-right-color:#242A2B;
}


.skin-code .nav-list > li.open > a , .skin-code .nav-list > li.open > a:hover
{
 color:#E1EAF1;
 background-color:var(--sidebar-background-color);
}
.skin-code .nav-list > li.active > a , .skin-code .nav-list > li.active > a:hover,
.skin-code .menu-min .nav-list > li.active > a , .skin-code .menu-min .nav-list > li.active > a:hover
 {
 background-color:var(--sidebar-background-secondary-color);
 color:#55db5e;
}

.skin-code .wizard-steps li .title {
  color: #93a595
}


.skin-code .nav-list > li > ul.submenu {
 background-color:#3A4344;
 border-top-color:#5A6364;
}
.skin-code .nav-list > li.active > ul.submenu {
 background-color:var(--sidebar-background-secondary-color);
 border-top-color:#2F3E44;
}

.skin-code .nav-list > li > .submenu > li > a {
 color:#D1DAE1;
 border-bottom-color:#5A6364;
}
.skin-code .nav-list > li > .submenu > li:first-child > a {
 border-top-color:transparent;
}
.skin-code .nav-list > li > .submenu > li > a:hover {
    background-color: #536068;
    color:#E1EAF1;
}
.skin-code .nav-list > li > .submenu > li.active > a {
 color:#55db5e;
 border-bottom-color:#2F3E44;
}



.skin-code .nav-list > li > .submenu > li > a > [class*="icon-"]:first-child {
 display:none;
}

.skin-code .menu-min .nav-list > li:hover > a{
 color:#E1EAF1;
}
.skin-code .menu-min .nav-list > li > a > .menu-text{
 background-color:#414B51;
}
.skin-code .menu-min .nav-list > li.active > a > .menu-text{
 background-color:#242A2B;
}

.skin-code .menu-min .nav-list > li.active:hover > a,
.skin-code .menu-min .nav-list > li.active > a > .menu-text{
 color:#55A0DC;
}
.skin-code .menu-min .nav-list > li > a.active ,
.skin-code .menu-min .nav-list > li.open.active > a
{
 background-color:var(--sidebar-background-secondary-color);
}

.skin-code .menu-min .nav-list > li > a > .menu-text,
.skin-code .menu-min .nav-list > li > ul.submenu {
 border-color:#3F4E54;
 margin-top:1px;
 border-left-color:#242A2B;
}

.skin-code .nav-list > li > .submenu > li:before, .skin-code .nav-list > li > .submenu:before {
 border-color:#929BA3;
}
.skin-code .nav-list > li.active > .submenu > li:before, .skin-code .nav-list > li.active > .submenu:before {
 border-color:#3F4E54;
}
.skin-code .menu-min .nav-list > li > a.dropdown-toggle > .menu-text {
 border-bottom-color:#5A606A;
}


.skin-code .sidebar-collapse {
 background-color:var(--sidebar-background-secondary-color);
 border-color:#3F4E54;
 border-top-width:1px;
}
.skin-code .sidebar-collapse:before {
 border-color:#3F4E54;
}
.skin-code .sidebar-collapse > [class*="icon-"] {
 background-color:var(--sidebar-background-color);
}


.skin-code .sidebar-shortcuts , .skin-code .sidebar-shortcuts-mini {
 background-color:var(--sidebar-background-secondary-color);
 border-color:#3F4E54;
}
.skin-code .sidebar > .nav-search {
 background-color:var(--sidebar-background-secondary-color);
 border-color:#3F4E54;
}

#coc-collect-points-sidebar {
 vertical-align: bottom;
 padding-left: 10px;
 color: #fdce18;
 position: relative;
 animation-name: grow-font-size;
 animation-duration: 3s;
 animation-iteration-count: 5;
}

.skin-code  .menu-min .sidebar-shortcuts-large {
 background-color:var(--sidebar-background-secondary-color);
 box-shadow:none;
 border:none;
 top:0;
}

.skin-code .breadcrumbs {
 border:none;
 background-color:#F0F0F0;
}

.skin-code .search-box {
    background-color: #f5f5f5;
    height:35px;
    border-radius: 5px;
    margin-right: 20px;
    box-sizing: border-box;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    padding-left: 7px;
    padding-right: 3px;
    margin-bottom: 0;
}

.skin-code .search-box .icon-search {
    padding-right: 7px;
}

.skin-code .search-box .search-query {
    height: 16px;
    line-height: 15px;
    padding: 4px;
    margin-right: 10px;
}

.skin-code .menu-toggler{
    width:0px;
    background-color: #b0d87700;
    display:inline-block;
    position:relative;
    height:25px;
}


.sidebar{
    margin-top:0 !important;
}


.skin-code .menu-toggler:before{
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    top: 15px;
    height:3px;
}

.skin-code .menu-toggler:after {
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #ffffff;
    top:22px;
    height:3px;
}

.skin-code .menu-toggler.display:before{
    top: 13px;
    height:5px;
}

.skin-code .menu-toggler.display:after {
    top:25px;
    height:5px;
}

.skin-code .gritter-close {
    left: auto;
    right: 0;
    display: block;
}

.skin-code .gritter-item {
    margin-right: 22px;
}

nocopy{
    overflow-wrap: break-word;
}

.accordion-group, .accordion-group div, .accordion-inner{
    border:none !important;
}

.accordion-heading .accordion-toggle,
.accordion-heading .accordion-toggle:after,
.accordion-heading .accordion-toggle.collapsed,
.accordion-heading .accordion-toggle.collapsed:after,
.accordion-heading .accordion-toggle.collapsed:hover:after,
.accordion-heading .accordion-toggle:hover,
.accordion-heading .accordion-toggle:hover:after{
    color: #49b243;

}

.accordion-heading .accordion-toggle,
.accordion-heading .accordion-toggle.collapsed,
.accordion-heading .accordion-toggle:hover{
    background-color: #f8fff1;
}

/* Christmas decorations */

.skin-code .snowflakes {
    position: absolute;
    height: 100%;
    width: 100%;
    overflow: hidden;
}
.skin-code .snowflake {
    color: #fff;
    font-size: 1em;
    font-family: Arial, sans-serif;
    text-shadow: 0 0 5px #000;
}

#iframe-placeholder{
    position: absolute;
    height:100%; width:100%;
    top:0;left:0;
    background-color:#87b87f;
    font-size:16px;
    color:white;
    align-items: center;justify-content:center;
    display:flex;flex-direction: column;
}

.iframe-placeholder{
    position: absolute;
    height:100%; width:100%;
    top:0;left:0;
    background-color:#87b87f;
    font-size:16px;
    color:white;
    align-items: center;justify-content:center;
    display:flex;flex-direction: column;
}

#iframe-placeholder .spinner{
    font-size:25px; margin:30px;
}

.iframe-placeholder {
    position: absolute;
    height:100%; width:100%;
    top:0;left:0;
    background-color:#87b87f;
    font-size:16px;
    color:white;
    align-items: center;justify-content:center;
    display:flex;flex-direction: column;
}

.iframe-placeholder .spinner{
    font-size:25px; margin:30px;
}

.boomer-tag{
    font-family: 'Acme', Impact, Arial;
    font-size: 13px;
    color: white;
    background-color: grey;
    border-radius: 20px;
    padding: 0 3px;
}

@-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}
@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}
.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}
.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}
.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}
.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}
.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}
.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}
.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}
.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}
.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}
.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}
.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}
.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}
.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}


@media only screen and (max-width: 979px){

    .hide-if-small{
        display:none;
    }

    .sidebar{
        padding-bottom: 100px;
    }
}

@media only screen and (max-width: 422px){
    .hide-if-small{
        display:none;
    }
    .skin-code .menu-toggler{
        float: right;
    }
    .navbar .brand {
        display:inline-block;
    }
}

@keyframes money-roll-animation {

    0% {
        transform: translateY(0px);
        opacity: 0;
    }

    20%, 80% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translateY(-50px);
    }

}

@keyframes grow-font-size {
    0% { font-size: 16.9px }
    50% { font-size: 24px }
    100% { font-size: 16.9px }
}

.intermitent-filter-shadow{
    --shadow-color: yellow;
    animation: intermittent-filter-shadow 1.5s ease-in infinite;
}

@keyframes intermittent-filter-shadow {
    0% {
        filter: none;
    }

    50% {
        filter: drop-shadow(0 0 10px var(--shadow-color)) drop-shadow(0 0 5px var(--shadow-color));
    }
}

@keyframes intermittently-grow {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.08);
    }
}

.shake{
    animation: shake 0.5s ease-in infinite;
}

@keyframes shake {
    0% {
        transform:translateX(0) rotate(0deg);
    }
    25% {
        transform:translateX(-2px) rotate(-1deg);
    }
    75% {
        transform:translateX(2px) rotate(1deg);
    }
}

@keyframes intermittent-shake{
    0% {transform: rotate(-10deg);}
    5% {transform: rotate(-10deg);}
    15% {transform: rotate(10deg);}
    25% {transform: rotate(-10deg);}
    30% {transform: rotate(0deg);}
}