body {
    font-size: 16px;
}
.maxwidth {
	box-sizing: content-box;
}

img.class-thumb {
    box-sizing: content-box;
}

.class-item.complete .thumb::before,
.class-item.locked .thumb::before {
    box-sizing: content-box;
}

.class-column.thumb {
    box-sizing: content-box;
}

/* fix size of generateCertificate control */
.tab-box {
    box-sizing: content-box;
}

.ta-toolbar .btn[disabled] {
    color: #888;
}

nav.navbar {
    background-color: #f0f1f1;
}
.nav-tabs a.text-menu {
    color: #337ab7;
}
.aopa .nav .open > a.user-menu,
.aopa .nav .open > a.user-menu:focus,
.aopa .nav .open > a.user-menu:hover {
    background-color: #00a3e0;
}

.aopa .nav-tabs > li > a:hover,
.aopa .nav-tabs > li > a:focus {
    background-color: #00a3e0;
}

.aopa .dropdown:hover > .dropdown-hover {
    background-color: #002a3a;
}

.aopa .dropdown-hover > li > a:hover,
.aopa .dropdown-hover > li > a:focus {
    background-color: #00a3e0;
}

.aopa .nav-pills > li.active > a,
.aopa .nav-pills > li.active > a:hover,
.aopa .nav-pills > li.active > a:focus {
    background-color: #002a3a;
}

.aopa .vhs-green {
    background-color: #002a3a;
}
.aopa .vhs-green:hover,.aopa .vhs-green:focus {
    color: #f5a13f;
    background-color: #fff;
    border: solid 1px #002a3a;
}

.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
    background-color: #00a3e0;
}
.open > .dropdown-menu {
    background-color: #fff;
}
.dropdown:hover > .dropdown-hover {
    background-color: #fff;
}

.dropdown-hover > li > a:hover,
.dropdown-hover > li > a:focus {
    background-color: #fff;
}
/* toast messages in aopa style */
.toast-success {
    background-color: #f0f1f1;
}
.toast-success .toast-message {
    color: #337ab7;
}

@media (max-width: 767px) {
    .navbar-collapse.collapse.in li a {
        background: #f0f1f1;
    }
    .navbar-header {
        background: #f0f1f1;
    }
}

.aopa .interface {
    font-size: 18px;
    font-family: Lato,Arial,Helvetica,sans-serif;
    color: #333;
    line-height: 1.5;
    margin: 0 auto;
    text-align: left;
}

.aopa .interface a {
    /*color: #004159;*/
    text-decoration: underline;
}
.aopa .interface a:hover {
    color: #f6a03a;
}
.aopa .progress span {
    height: 1em;
}
.aopa .course-banner {
    background-color: #00a3e0;
}
/* aopa breadcrumbs color */
.aopa .breadcrumb a {
    color: #383838;
}
.aopa .breadcrumb li>span {
    color: #878a8b;
}
.aopa.breadcrumb > li + li::before {
    color: #383838;
}

/* aopa main page background */
.top-menu-image-border {
    background-color: #002a3a;
}

/* aopa course fixes*/
#menu .fade {
    opacity: 1;
    -webkit-transition: none;
    transition: none;
}
a.menu-main {
    opacity: 1 !important;
}
.btn.direction {
    white-space: normal;
}

/* aopa quiz fixes */
.aopa .quiz-container {
    padding: 0;
    border: none;
}

/* aopa quiz progress styling */
div.quiz-progress-bar ol.quiz-prgress {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: auto;
}

div.quiz-progress-bar ol.quiz-prgress > li {
    float: left;
    margin-right: 5px;
    padding:.25em;
    text-align:center;
    background-color:#ccc;
}

div.quiz-progress-bar  ol.quiz-prgress > li {
    height: 34px;
    position: relative;
    width: 34px;
}

div.quiz-progress-bar ol.quiz-prgress > li.current {

}

div.quiz-progress-bar ol.quiz-prgress > li.answered {

}

div.quiz-progress-bar ol.quiz-prgress > li.answered.answered-correct {
	background-color: green;
}

div.quiz-progress-bar ol.quiz-prgress > li.answered.answered-incorrect {
	background-color: red;
}

div.quiz-progress-bar ol.quiz-prgress > li.answered.answered-incorrect::before {
    content: "\e007";
    font-family: 'icomoon';
    font-size: 1.125em;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 0 .25em 0 0;
    margin: 0;
    float: left;
    text-decoration: none
}
div.quiz-progress-bar ol.quiz-prgress > li.answered.answered-correct::before {
    content: "\e014";
    font-family: 'icomoon';
    font-size: 1.125em;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    padding: 0 .25em 0 0;
    margin: 0;
    float: left;
    text-decoration: none
}

.quiz-container .btn.next {
    z-index: 400;
}

.quiz-container div.quiz-answers {
    border-color: #0299d2;
    -o-border-image: none;
    border-image: none;
    border-style: none none solid;
    border-width: medium medium 1px;
    margin: 0;
}
/* border for aopa course logo */
.course-logo {
    border: 3px solid #0299d2;
    border-radius: 8px;
}
/* animation for slides */
.vhs-slide-removing .mobile-space {
    opacity: 0;
    -webkit-transition: opacity linear 0.5s;
    transition: opacity linear 0.5s;
}

/* slide target position during content loading */
.vhs-slide-loading .mobile-space {
    left: 0;
    -webkit-transition: none;
    transition: none;
}
/* hide slide content during loading */
.vhs-slide-loading .mobile-space .jqp-viewport {
    opacity: 0 !important;
}

.vhs-slide-loading-remove .mobile-space {
    opacity: 1;
}
.vhs-slide-loading-remove .mobile-space {
    left: 100%;
    -webkit-transition: none;
    transition: none;
}
.vhs-slide-loading-remove.vhs-slide-back .mobile-space {
    left: -100%;
    -webkit-transition: none;
    transition: none
}
.mobile-space {
    left: 0;
    -webkit-transition: left linear 0.5s;
    transition: left linear 0.5s;
}
.interface {
  overflow:hidden;
}

/*spinner*/
.vhs-slide-loading {

}
.vhs-slide-loading:before {

}
.vhs-slide-loading:not(:required):before {
    margin: 40% auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    position: relative;

    -webkit-animation: load5 1.1s infinite ease;
    animation: load5 1.1s infinite ease;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}
@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -1.3em 0em 0em #bfbfbf, 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.5), -0.9em -0.9em 0 0em rgba(191,191,191, 0.7);
  }
  12.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.7), 0.9em -0.9em 0 0em #bfbfbf, 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.5);
  }
  25% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.5), 0.9em -0.9em 0 0em rgba(191,191,191, 0.7), 1.25em 0em 0 0em #bfbfbf, 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  37.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.5), 1.25em 0em 0 0em rgba(191,191,191, 0.7), 0.87em 0.87em 0 0em #bfbfbf, 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  50% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.5), 0.87em 0.87em 0 0em rgba(191,191,191, 0.7), 0em 1.25em 0 0em #bfbfbf, -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  62.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.5), 0em 1.25em 0 0em rgba(191,191,191, 0.7), -0.9em 0.9em 0 0em #bfbfbf, -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  75% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.5), -0.9em 0.9em 0 0em rgba(191,191,191, 0.7), -1.3em 0em 0 0em #bfbfbf, -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  87.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.5), -1.3em 0em 0 0em rgba(191,191,191, 0.7), -0.9em -0.9em 0 0em #bfbfbf;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -1.3em 0em 0em #bfbfbf, 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.5), -0.9em -0.9em 0 0em rgba(191,191,191, 0.7);
  }
  12.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.7), 0.9em -0.9em 0 0em #bfbfbf, 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.5);
  }
  25% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.5), 0.9em -0.9em 0 0em rgba(191,191,191, 0.7), 1.25em 0em 0 0em #bfbfbf, 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  37.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.5), 1.25em 0em 0 0em rgba(191,191,191, 0.7), 0.87em 0.87em 0 0em #bfbfbf, 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  50% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.5), 0.87em 0.87em 0 0em rgba(191,191,191, 0.7), 0em 1.25em 0 0em #bfbfbf, -0.9em 0.9em 0 0em rgba(191,191,191, 0.2), -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  62.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.5), 0em 1.25em 0 0em rgba(191,191,191, 0.7), -0.9em 0.9em 0 0em #bfbfbf, -1.3em 0em 0 0em rgba(191,191,191, 0.2), -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  75% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.5), -0.9em 0.9em 0 0em rgba(191,191,191, 0.7), -1.3em 0em 0 0em #bfbfbf, -0.9em -0.9em 0 0em rgba(191,191,191, 0.2);
  }
  87.5% {
    box-shadow: 0em -1.3em 0em 0em rgba(191,191,191, 0.2), 0.9em -0.9em 0 0em rgba(191,191,191, 0.2), 1.25em 0em 0 0em rgba(191,191,191, 0.2), 0.87em 0.87em 0 0em rgba(191,191,191, 0.2), 0em 1.25em 0 0em rgba(191,191,191, 0.2), -0.9em 0.9em 0 0em rgba(191,191,191, 0.5), -1.3em 0em 0 0em rgba(191,191,191, 0.7), -0.9em -0.9em 0 0em #bfbfbf;
  }
}


/* fix slide width conflict with bootstrap */
@media (min-width: 768px) {
    .container {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 992px) {
    .container {
        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }
}
@media (min-width: 1090px) {
    .container {
        width: 1090px;
        padding-right: 0;
        padding-left: 0;
    }
}
@media (min-width: 1140px) {
    .container {
        width: 1100px;
        box-sizing: content-box;
        padding-right: 10px;
        padding-left: 10px;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1100px;
    }
}
@media (min-width: 1220px) {
    .container {
        width: 1170px;
        padding-right: 15px;
        padding-left: 15px;
    }
}

/* fix breadcrumbs font size */
ol.breadcrumb  {
    font-size: 14px;
    margin-bottom: 3px;
}
.breadcrumb li {
    max-width: 320px;
    max-height: 1.5em;
    overflow: hidden;
    margin: 0;
    vertical-align: top;
}
/* fix margin for course top menu */
ul#topMenu {
    margin-top: 0;
}

/* fix participation form buttons */
.aopa .btn-next {
    background-color: #004159 !important;
    padding: 0.2em 0.7em;
    font-size: 2.4em !important;
}

.aopa .btn-cancel {
    background-color: #002a3a;
    padding: 0.2em 0.7em;
    font-size: 1.4em;
    border: 2px #fff solid;
    margin-top: 0.6em;
}

/* fix splash menu buttons */
.aopa .splash .btn.menu-button{
    background-color: #fff;
    border-color: #d77a4b;
    color: #004159
}
.aopa .splash .btn.menu-button:hover{
    color: #fff;
    background-color: #004159;
    border-color: #004159;
 }
.aopa .splash .btn.menu-button.greyed-out{
    border-color: #e3a383;
    color: #e3a383;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(1,#bbb));
    background-image: -ms-linear-gradient(top,  #fff 0%, #bbb 100%);
  }
.aopa .splash .btn.menu-button.greyed-out:hover {
    color: #edc2ac;
    background-color: #004159;
    border-color: #004159;
    background-image: none;
}

/* fix splash links color */
.aopa #splash-completion a {
    color: #004159;
}
.aopa #splash-completion a:hover {
    color: #0079A5;
}

/* fix share text decorations */
.aopa .share a {
    text-decoration: none !important;
}

/* hide vertical-timeline images during menu opened */
.aopa .vhs-menu-visible .vertical-timeline-b-picture-frame {
    display: none !important;
}

/* fix menu buttons for ipads */
.touch a.btn.menu-button:hover {
    color: #fff;
}

/* logon button font size */
.btn.btn-login-link {
    font-size: 1em;
}

/* fix certificates types vertical align */
.certificate-types > input {
    vertical-align: bottom;
}

/* padding on slide for bottom menu */
#section_summary_rich_text {
    padding-bottom: 1.5em;
}
/* padding on slide(quiz) for bottom menu */
#section_quiz_container {
    padding-bottom: 1.5em;
}
/* padding on slide (participation form) for bottom menu */
.vhs-participation-form-container {
    padding-bottom: 1.7em;
}
#logonLogo {
    margin-top: 5px;
    margin-bottom: 5px;
}

#vhs-participation-form {
    font-size: 0.85em;
    white-space: nowrap;
}

#vhs-participation-form  .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-6, .col-xs-9  {
    padding-right: 0;
}

#vhs-participation-form label {
    padding-left: 5px;
}

#vhs-participation-form .vhs-agreements-container {
    font-size: 0.8em;
    white-space: normal;
}

#vhs-participation-form .error {
    white-space: normal;
}

#vhs-participation-form input {
    height: 1.7em;
}

.aopa-interface {
    max-width: 70%;
    margin: 0 25%;
    min-width: 250px;
    padding: 10px 10px 20px 10px;
    background: rgba(0, 0, 0, 0) url(../../aopa/images/splash-bg.jpg) repeat scroll 0 0;
}

.aopa-interface label {
    color: white;
}

.btn-save {
    background-color: #004159 !important;
}

.vhs-copyright {
    text-align: right;
    font-size: 0.8em;
    white-space: normal;
}

.splash-interface {
    background: rgba(0, 0, 0, 0) url(../../aopa/images/splash-bg.jpg) repeat scroll 0 0 !important;
}

.aopa-copyright {
    text-align: right;
    font-size: 0.65em;
    color: grey;
    margin-bottom: 40px;
}

.tcMed .full-screen-view .tcMedTopBar.full-screen-hidden {
    display: none;
}
.tcMed a.btn {
    color: #fff;
}
.form-signin input {
    border-radius: 0;
}
/* fix gliphon fonts (in quiz) */
.tcMed .glyphicon {
    font-family: 'Glyphicons Halflings';
}
/* fix top header margin to prevent logo up-down effect */
.tcMed .tcMedTopBar .logo {
    margin-top: 10px;
}
/* fix top header margin to prevent logo up-down effect */
.tcMed .l-wrapper {
    margin-left: auto;
    margin-right: auto;
}
/* overwrite main.crush.css */
.tcMed .tcMedTopBar .logo {
    text-align: center;
    border: none;
    background-color: transparent;
    margin: initial;
    padding: 0;
}
/* width together with crush.css */
.tcMed .content-not-shown.maxwidth {
  max-width: 100%;
}

.tcMed .common-form .formControl button.button {
    margin-top: 1.625rem;
}
/* fix hotspots 2-5 after tcMed.css apply */
.vhs-course-content-container .overlay {
    opacity: 100;
    visibility: visible;
}

#participation_form[validation] > * .ng-invalid {
    outline: 1px solid red !important;
}

/* fix menu panel border for splash in started course */
.visible-menu-inner.splash {
    border-right-color: #fff;
    border-bottom-color: #fff;
    border-left-color: #fff;
}

/*fix reset password link on logon page*/
.tcMed .tcMedHero .alert-danger a {
    display: inline;
}

.ifStyle {
    font-weight: bold;
    font-style: italic;
    background: yellow;
    text-transform: uppercase;
}