@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i");

/*****************************************************************************/
/*****************************************************************************/
/************** start legacy app.css *****************************************/
/* -- Primary action colour -- */

a {
    color: #00b7bd;
    text-decoration: none;
    cursor: pointer;
}
a:hover,
a:focus {
    color: #00807a;
    text-decoration: none;
}

.btn-primary {
    color: #fff !important;
    background-color: #a4d233;
    border-color: #a4d233;
    font-weight: bold;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    color: #fff !important;
    background-color: #92c84e;
    border-color: #92c84e;
}
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-image: none;
}
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    background-color: #a4d233;
    border-color: #a4d233;
}

.bg-primary {
    background-color: #a4d233;
    color: #ffffff;
}
.bg-primary a {
    color: #ffffff;
}
.bg-primary a:hover {
    color: #fff;
}

.bg-white a {
    color: #00b7bd;
}
.bg-white a:hover {
    color: #00807a;
}

.bg-dark {
    background-color: #a4d233;
}

a.bg-light:hover {
    color: #00b7bd;
}
a.bg-primary:hover {
    background-color: #00807a;
}
a.text-primary:hover {
    color: #00807a;
}
.text-primary {
    color: #00b7bd;
}

.bg-primary.dker,
.bg-primary .dker {
    background-color: #82a725; /* plus 10% */
}
.bg-primary.lter,
.bg-primary .lter {
    background-color: #bfdf6d; /* minus 15% */
}
.stroke-primary {
    stroke: #a4d233;
}
.stroke-primary.lter,
.stroke-primary .lter {
    stroke: #bfdf6d; /* minus 15% */
}
.stroke-primary.dker,
.stroke-primary .dker {
    stroke: #82a725; /* plus 10% */
}
.fill-primary {
    fill: #a4d233;
}
.fill-primary.lter,
.fill-primary .lter {
    fill: #bfdf6d; /* minus 15% */
}
.fill-primary.dker,
.fill-primary .dker {
    fill: #82a725; /* plus 10% */
}

/* -- Header bar colour -- */

.navbar-right > li:hover {
}

.navbar .nav > li:hover > a,
.navbar .nav > li:focus > a,
.navbar .nav > li.active > a {
}
.navbar .nav > li > a {
    color: #3b4c58;
}
.navbar .nav > li > a:hover,
.navbar .nav > li > a:focus {
    color: #00b7bd;
    background-color: #ebebed;
}
.navbar .nav .open > a {
    background-color: #ebebed;
    color: #00b7bd;
}

/* -- Dropdown menu link colour -- */

.dropdown-menu {
    background-color: #ffffff;
}

.dropdown-menu > li > a {
    color: #00b7bd;
}

.dropdown-menu .wrapper {
    background-color: #ebebed;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    color: #00807a;
}

.btn-white {
    background-color: transparent;
    background-position: 100% 50%;
    background-repeat: no-repeat;
    color: white;
    border: 1px solid white;
    font-size: 16px;
    margin-top: 10px;
    padding-right: 30px;
}

.btn-white:hover {
    color: #00b7bd;
    background-color: white;
}

/* dashboard */

.dashpan {
    background-color: transparent !important;
    border-radius: 0px !important;
    border: 0px none transparent !important;
    box-shadow: none !important;
    cursor: pointer;
}

.dashpan .h3 {
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 30px;
    color: #00b7bd !important;
}

.dashpan:hover .h3 {
    color: #00807a !important;
}

.dashtxt {
    margin-top: 20px;
    margin-bottom: 0px;
    font-size: 12px;
}

.panel-image {
    background-size: cover;
    background-repeat: no-repeat;
    height: 160px;
    width: 100%;
}

@media (min-width: 768px) and (max-width: 991px) {
    .panel-image {
        height: 114px;
    }
}

@media (max-width: 767px) {
    .panel-image {
        width: 100%;
        margin: 0px;
    }
    .navbar-right {
        height: auto !important;
    }
    .navbar-right li .navbar-link {
        height: 50px !important;
    }
    .dropdown-toggle .img-circle {
        margin-top: 5px;
    }
}

@media (max-width: 365px) {
    .panel-image {
        height: 43.84vw;
    }
}
/**************** end legacy app.css *****************************************/
/*****************************************************************************/
/*****************************************************************************/
/* Page overides */
html {
    background-color: #ffffff;
}

body {
    color: #3b4c58;
    font-size: 14px;
    font-family: "Roboto", "Arial", sans-serif;
    font-weight: 300;
    margin-bottom: 70px;
}

h1,
.h1,
h2,
.h2 {
    font-weight: 900 !important;
    color: #3b4c58;
}

h3,
.h3 {
    font-weight: 900 !important;
    color: #3b4c58 !important;
}

.navbar {
    top: 0;
    background-color: #ffffff;
}

.navbar-right {
    height: 50px;
}

.navbar-collapse .navbar-right {
    visibility: visible;
}

.navbar-nav {
    visibility: hidden;
}

.navbar-header {
    width: inherit;
}

.navbar-collapse {
    padding-left: 0px;
}

/* Page specific overides */

/* dashboard */

.section-header {
    text-align: center;
    color: #4b4e4f;
    max-width: 800px;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 40px;
}

.section-header h2 {
    margin-top: 0px;
    margin-bottom: 20px;
}

.section-header h2,
.section-header p {
    margin-left: 10px;
    margin-right: 10px;
}

.header-img {
    display: inline-block;
    width: 350px;
    height: auto;
    margin-right: 20px;
}

.app-private-dashboard .row {
    overflow: hidden;
    padding-bottom: 20px;
    margin-bottom: 25px;
}

.app-private-dashboard .container {
    max-width: none !important;
}

.whiteback {
    background-color: #ffffff;
}

.whiteback .row {
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

.app-private-dashboard {
    background-color: #ebebed;
}

.carousel-indicators li {
    background-color: #00b7bd;
    border-color: #00b7bd;
}

.carousel-indicators li:hover {
    background-color: #00807a;
    border-color: #00807a;
}

.carousel-indicators li.active,
.carousel-indicators li.active:hover {
    background-color: #ffffff;
    border-color: #ffffff;
}

.tile-head .bg-primary,
#landing-page .bg-primary,
.app-private-instructors-dashboard #header .bg-primary {
    background-color: #3b4c58 !important;
}

.app-private-instructors-session h2 {
    color: #fff !important;
}

/* sign-in */

.app-public-access-signin,
.app-public-access-forgot,
.app-public-access-signup,
.app-public-access-recover,
.app-public-access-thanks {
    background-color: #4b4e4f;
    background-image: url(/content/assets/login-bg.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.app-public-access-signin .signin-panel,
.app-public-access-forgot .forgot-panel,
.app-public-access-signup .signup-panel,
.app-public-access-recover .recover-panel,
.app-public-access-thanks .thanks-panel {
    background-color: #ffffff;
}

.app-public-access-signin .signin-panel .brand img,
.app-public-access-forgot .forgot-panel .brand img,
.app-public-access-signup .signup-panel .brand img,
.app-public-access-recover .recover-panel .brand img,
.app-public-access-thanks .thanks-panel .brand img {
    width: 100%;
}

.app-public-access-signin .signin-panel a,
.app-public-access-forgot .forgot-panel a,
.app-public-access-signup .signup-panel a,
.app-public-access-recover .recover-panel a,
.app-public-access-thanks .thanks-panel a {
    color: #00b7bd !important;
}

.app-public-access-signin .signin-panel a:hover,
.app-public-access-signin .signin-panel a:focus,
.app-public-access-forgot .forgot-panel a:hover,
.app-public-access-forgot .forgot-panel a:focus,
.app-public-access-signup .signup-panel a:hover,
.app-public-access-signup .signup-panel a:focus,
.app-public-access-recover .recover-panel a:hover,
.app-public-access-recover .recover-panel a:focus,
.app-public-access-thanks .thanks-panel a:hover,
.app-public-access-thanks .thanks-panel a:focus {
    color: #00807a !important;
}

#site-footer {
    border-top: 0px transparent none;
    color: #ffffff;
    background-color: #3b4c58;
    padding-bottom: 15px;
}

#site-footer .row {
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

#site-footer .col-xs-12 {
    padding-left: 0px;
    padding-right: 0px;
}

#site-footer a {
    font-weight: bold;
    color: #ffffff;
}

#site-footer a:hover {
    color: #00b7bd;
}

#landing-page #title,
#landing-page #desc {
    color: #ffffff !important;
}

#site-footer .terms-link::after,
#site-footer .web-link::after,
#site-footer .contact-link::after,
#site-footer .powered-by::before {
    white-space: pre;
    content: "  |  " !important;
}

@media (min-width: 768px) {
    .navbar-nav > .ng-binding {
        display: none;
    }
}

@media (max-width: 767px) {
    .navbar-brand {
        margin-top: 2px;
    }

    .app-private-dashboard .row {
        margin-bottom: 0px;
        padding-bottom: 0px;
    }

    .dashpan {
        margin-bottom: 20px !important;
    }

    .banner-text,
    .banner-intro-text {
        width: 100%;
    }

    .navbar-collapse {
        padding-left: 15px;
    }

    .navbar-nav {
        visibility: visible;
    }

    .navbar-toggle {
        margin-left: 10px;
    }

    .whiteback h2,
    .whiteback p {
        margin-left: 40px !important;
        margin-right: 40px !important;
    }
}

@media (max-width: 564px) {
    #site-footer .contact-link::after {
        white-space: pre;
        content: "\A" !important;
    }

    body {
        margin-bottom: 90px !important;
    }
}
@media (max-width: 408px) {
    .navbar-brand,
    .navbar-brand img {
        width: 74.35vw;
    }

    body {
        margin-bottom: 150px !important;
    }

    #site-footer .terms-link::after,
    #site-footer .web-link::after,
    #site-footer .powered-by::before {
        white-space: pre;
        content: "\A" !important;
    }
}

@media (max-width: 397px) {
    .app-private-dashboard body {
        margin-bottom: 90px;
    }
}

/* dashboard migration */

.app-private-dashboard .carousel-inner {
    width: 100%;
    height: 66vh;
    background: #a4d233;
    background: -moz-linear-gradient(left, #00b7bd 0%, #a4d233 100%);
    background: -webkit-linear-gradient(left, #00b7bd 0%, #a4d233 100%);
    background: linear-gradient(to right, #00b7bd 0%, #a4d233 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7bd', endColorstr='#a4d233',GradientType=1 );
}

.app-private-dashboard .banner-item-wrapper:nth-child(1) {
    background-image:
        url(/content/assets/banner_overlay-left.png),
        url(/content/assets/banner_1.jpg) !important;
    background-position:
        0% 50%,
        50% 40%;
}

.app-private-dashboard .banner-item-wrapper:nth-child(2) {
    background-image:
        url(/content/assets/banner_overlay-left.png),
        url(/content/assets/banner_2.jpg) !important;
    background-position:
        0% 50%,
        40% 50%;
}

.app-private-dashboard .banner-item-wrapper:nth-child(3) {
    background-image:
        url(/content/assets/banner_overlay-left.png),
        url(/content/assets/banner_3.jpg) !important;
    background-position:
        0% 50%,
        75% 30%;
}

.app-private-dashboard .banner-item-wrapper:nth-child(4) {
    background-image:
        url(/content/assets/banner_overlay-left.png),
        url(/content/assets/banner_4.jpg) !important;
    background-position:
        0% 50%,
        0% 40%;
}

.app-private-dashboard .banner-item-wrapper {
    background-size: contain, cover;
    background-repeat: no-repeat, no-repeat;
    height: 63vh;
    width: 100%;
}

.app-private-dashboard .banner-text {
    max-width: 600px !important;
}

.app-private-dashboard .banner-text h2 {
    white-space: pre-line;
}

.app-private-dashboard .banner-text p {
    white-space: pre-line;
}

.app-private-dashboard .container-widgets section {
    text-align: center;
}

.app-private-dashboard .container-widgets section > h2,
.app-private-dashboard .container-widgets section > p {
    max-width: 800px !important;
    margin-left: auto;
    margin-right: auto;
}

.app-private-dashboard .default-tile .img-container-top,
.app-private-dashboard .default-tile .img-container-top > div {
    height: 160px !important;
}

.app-private-dashboard .default-tile {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.app-private-dashboard .default-tile .tile-text {
    height: 100%;
}

.app-private-dashboard .default-tile .tile-text h2 {
    margin-bottom: 30px;
    color: #00b7bd !important;
}

.app-private-dashboard a:hover .default-tile .tile-text h2 {
    color: #00807a !important;
}

@media (min-width: 1200px) {
    .app-private-dashboard .container {
        width: 1170px !important;
    }
}