WelcomeSubTitle:root {
    --shaolin-dark-saffron-color: #754c00;
    --shaolin-saffron-disabled-button-color: #bf7b00;
    --shaolin-saffron-disabled-font-color: #4f3300;

    --shaolin-very-light-orange: #ffedd1;
    --shaolin-light-orange: #ffce80;
    --shaolin-light-medium-orange: #ffb640;
    --shaolin-medium-orange: #ff9d00;
    --shaolin-dark-orange: #c77a00;
    --shaolin-saffron-color: #ffcc00;
    --shaolin-light-saffron-color: #ffeeab;
    --shaolin-very-light-blue-color: #e6f8ff;
    --shaolin-light-blue-color: #00aae8;
    --shaolin-blue-color: #0090c5;
    --shaolin-slightly-darker-blue-color: #007fad;
    --shaolin-dark-blue-color: #003045;
    --shaolin-kung-fu-color: #003454;
    --shaolin-gentle-kung-fu-lighter-color: #72d698;
    --shaolin-gentle-kung-fu-color: #006125;
    --shaolin-qi-gong-lighter-color: #ff9191;
    --shaolin-qi-gong-color: #700013;
    --shaolin-meditation-color: #3d3d3d;
    --shaolin-meditation-lighter-color: #AAAAAA;

}

body {
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
}

h1 {
        background-color: #003454;
        color:white;
        font-size:1.5em;
        font-weight:bold;
        padding:5px 10px 7px 10px;
        margin: 20px 0px 20px 0px;
        text-transform:uppercase;
}

h2 {
        background-color: #ff9d00;
        color:white;
        font-size:1.2em;
        font-weight:bold;
        padding:5px 10px 7px 10px;
        text-transform:uppercase;
}


h3 {
        background-color: transparent;
        color:#003454;
        font-size:1.1em;
        font-weight:bold;
        padding:5px 10px 7px 10px;
        text-transform:uppercase;
        border-top:1px solid #ff9d00;
        border-bottom:1px solid #ff9d00;
}

/* @group Blink */
.blink {
    -webkit-animation: blink .75s linear infinite;
    -moz-animation: blink .75s linear infinite;
    -ms-animation: blink .75s linear infinite;
    -o-animation: blink .75s linear infinite;
     animation: blink .75s linear infinite;
}
@-webkit-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}
@-moz-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}
@-ms-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}
@-o-keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}
@keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 1; }
    50.01% { opacity: 0; }
    100% { opacity: 0; }
}
/* @end */

.SiteTable {
    border:0px;
    padding: 0px;
    margins: 0px;
}

.WelcomeBackgroundContainer {
    position: relative;
}

.WelcomeTitle {
    font-size:1.4em;
        line-height: 110%;
    font-weight: bold;
    letter-spacing: 1px;
    color: white;
    text-decoration: none;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
}

.WelcomeSubTitle {
    font-size: .9em;
    font-weight: normal;
        line-height: 110%;
    color: #FFCC00;
    text-decoration: none;
}

.WelcomeDaoPic {
    width: 100%;
    height: auto;
    border: 3px solid #0090c5;
    border-radius: 20px;
}



.WelcomeMessageText {
    font-size: 1.3em;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 110%;
    color: #0090c5;
    text-decoration: none;
    position:absolute;
    vertical-align:bottom;
    padding: 0px 0px 0px 0px;
    bottom:5px;
    left:25px;
}


.WelcomeMoreText {
    width: 100%;
    font-size: 100%;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 100%;
    color: #0090c5;
    text-decoration: none;
    position:absolute;
    vertical-align:middle;
    text-align:center;
    padding: 0px 0px 10px 0px;

}

.WelcomeMenuContainer {
    display: inline-block;
    text-align: left;
    padding: 0px 0px 0px 0px;
    background-color: transparent;
    margin: 1px 8px 1px 8px;
}

.WelcomeMenuParent {
    text-align: center;
    vertical-align: middle;
    text-shadow: 1px 1px #007fad;
        padding: 0px 0px 1px 0px;
    font-size: 1.2em;
    font-weight: bold;
    color: #FFCC00;
    text-transform: uppercase;
    background-color: transparent;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
    cursor: pointer;
}

.WelcomeMenuParent:hover {
    color: white;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
}

.HomeTestimonial {
        color: white;
        position:absolute;
        right: 10px;
        margin:35px 20px 0px 0px;
        padding: 0px 20px 0px 20px;
        font-size:100%;
        max-width: 50%;
    text-shadow: 1px 1px black;
    background: rgba(0, 0, 0, .85) ;
        background-blend-mode: darken;
        border-radius:12px;
        border:1px solid #ffcc00;
}


@media (min-width:400px) {



}

.SiteMenuTable {
    align-items: bottom;
    justify-content: center;
    font-size: 100%;
    padding: 0px 20px 0px 5px;
    margin: 0px;
    border: none;
    text-align: center;
    width: 100%;

}

.TablePlain {
    border:0px;
    padding: 0px 0px 0px 0px;
    margin: 0px;
    text-align: center;
}


.ImagePlain {
    border: none;
    box-shadow: none;
    margin:0px;
    padding: 0px;
    vertical-align: middle;
}

.SiteTitle {
    font-size: 140%;
    font-weight: bold;
    letter-spacing: 1px;
    color: white;
    text-decoration: none;
}

.SiteTitle:hover {
    color: #FFCC00;
    border-top: 2px solid #FFCC00;
    border-bottom: 2px solid #FFCC00;

}

.SiteSubTitle {
    font-size: 100%;
    font-weight: bold;
    font-style: italic;
    color: white;
}

.SiteDescription {
    font-size: 100%;
    color: white;
}

.SiteLink {
    color: #FFCC00;
    text-decoration: none;
}

.SiteLink:hover {
    color: white;
    text-decoration: none;
    border-radius: 5px;
}



.SiteLoginField {
    font-size: 90%;
    color: #176b96;
    padding: 0px 5px 0px 2px;
}

.RegistrationNotice {
    font-size: 100%;
    font-weight: bold;
    color: #176b96;
}

.RegistrationNotice a {
    color: orange;
    font-weight: bold;
}



.SiteMenuContainer {
    display: inline-block;
    text-align: left;
    padding: 0px 0px 0px 0px;
    background-color: transparent;
}

.SiteMenuParent {
    text-align: center;
    vertical-align: middle;
    padding: 3px 10px 3px 10px;
    font-size: 120%;
    font-weight: bold;
    color: #FFCC00;
    text-transform: uppercase;
    background-color: transparent;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.SiteMenuParent:hover {
    color: orange;
    border-top: 3px solid orange;
    border-bottom: 3px solid orange;
}

.SiteMenuItem {
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    padding: 3px 5px 3px 5px;
    min-width:25px; max-width: 250px;
    font-size: 110%;
    font-weight: bold;
    color: #FFCC00;
    background-color: transparent;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
}

.SiteMenuItem:hover {
    color: white;
    border-top: 3px solid orange;
    border-bottom: 3px solid orange;
}

.SiteMenuItemsContainer {
    position: absolute;
    padding: 3px 10px 3px 10px;
    margin: 3px 0px 0px 0px;
    background-color: white;
    border: 1px solid darkorange;
    border-radius: 8px;
    text-align: left;
}


.HomeContentTitle {
    text-align:center;
    color: #0090c5;
    font-size: 200%;
}

.HomePics {
    border: 2px solid #0090c5;
    border-radius: 20px;
        width:90%;

}

.HomePicCaption {
        font-size:80%;
                margin:5px 0px 10px 0px;
        color: #0090c5;
        font-weight: bold;
}

.ExploreCourseHeader {
    display: block;
    padding: 15px 10px 20px 10px;
    background-color: #0090c5;
    border-radius: 10px;
}

.ExploreCoursePicture {
    max-width: 300px;
    height: auto;
    border: 2px solid #FFCC00;
    border-radius: 20px;
}

.ExploreHeader {
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
}

.ExploreContentText {
    display:inline-block;
    vertical-align:top;
    font-size:120%;
    color:#474747;
}


.ExploreCourseHeaderQigong {
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
    background-color: #700013;
    cursor:pointer;

}

.ExploreCourseHeaderQigong:hover {
    background-color: #ff9191;

}

.ExploreCoursePictureQigong {
    max-width: 300px;
    height: auto;
    border: 2px solid #700013;
    border-radius: 20px;
}



.ExploreCourseHeaderMeditation {
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
    background-color: #3d3d3d;
    cursor:pointer;

}

.ExploreCourseHeaderMeditation:hover {
    background-color: #aaaaaa;

}

.ExploreCoursePictureMeditation {
    max-width: 300px;
    height: auto;
    border: 2px solid #3d3d3d;
    border-radius: 20px;
}

.ExploreCourseHeaderKungFu {
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
    background-color: #003454;
    cursor:pointer;
}

.ExploreCourseHeaderKungFu:hover {
    background-color: #0090c5;
}



.ExploreCoursePictureKungFu {
    max-width: 300px;
    height: auto;
    border: 2px solid #003454;
    border-radius: 20px;
}

.ExploreCourseHeaderGentleKungFu {
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
    background-color: #006125;
    cursor:pointer;

}

.ExploreCourseHeaderGentleKungFu:hover {
    background-color: #72d698;


}

.ExploreCoursePictureGentleKungFu {
    max-width: 300px;
    height: auto;
    border: 2px solid #006125;
    border-radius: 20px;
}

.ExploreCourseTitle {
    font-size: 200%;
    font-weight:bold;
    letter-spacing: 3px;
    padding: 0px 0px 10px 0px;
    line-height: 110%;
    color: white;
}


.ExploreCourseSubTitle {
    font-size: 150%;
    line-height: 120%;
    padding: 0px 20px 0px 20px;
    color: white;
}

.ExploreCourseContent {
    display:block;
    text-align:left;
    padding:10px 0px 20px 0px;
}

.ExploreCourseContentImage {
    display:inline-block;
    vertical-align:top;
    padding:5px;
}

.ExploreCourseContentText {
    display:inline-block;
    vertical-align:top;
    max-width:680px;
    font-size:120%;
    color:#474747;
}



/* ********************************FEATURES PAGE ****************************************** */


.ExploreFeaturesHeader
{
    display: block;
    border-radius: 10px;
    padding: 15px 10px 20px 10px;
    background-color: #ffbf00;
}

.ExploreFeaturesTitle
{
    font-size: 200%;
    font-weight: bold;
    letter-spacing: 3px;
    padding: 0px 0px 10px 0px;
    line-height: 110%;
    text-shadow: 1px 1px #754c00;
    color: white;
}

.ExploreFeaturesContentText {
    display:inline-block;
    vertical-align:top;
    font-size:120%;
    color:#474747;
}



.HomeStandardLink {
    font-weight: bold;
    color: darkorange;
    text-decoration: none;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

.HomeStandardLink:hover {
    color: #0090c5;
    text-decoration: none;
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
}

.ExploreSignUpTable {
    width: 100%;
    border: 0px solid transparent;
    border-collapse: separate;
    border-spacing: 5px 5px;
}

.ExploreSignUpTable th {
    color: white;
    background-color: #003045;
    font-weight: normal;
    padding: 25px 15px 35px 15px;
    border-radius: 10px;
    vertical-align:bottom;
}

.ExploreSignUpTable td {
    text-align: center;
    vertical-align: top;
    font-size: 120%;
    padding: 15px 5px 15px 5px;
    background-color: #ffeeab;
    border-radius: 10px;
}

.ExploreSignUpTableCaption {
    font-size: 100%;
    font-weight: bold;
    color: #FFCC00;
    text-transform: uppercase;
    padding: 0px;
}

.ExploreSignUpTableTitle {
    font-size: 1.5em;
    text-shadow: 1px 1px black;
    letter-spacing:2px;
    padding: 0px 3px 5px 3px;
}

.ExploreSignUpTablePrice {
    font-size: 1.3em;
    padding: 5px 3px 0px 3px;
}

.ExploreSignUpTablePriceNote {
    font-size: 100%;
    padding: 0px 3px 15px 3px;
}

.ExploreSignUpTableFeatures {
    font-size: .8em;
    line-height: 110%;
    vertical-align: top;
}

.ExploreSignUpGetStartedButton {
    font-size: 1.2em;
    font-weight: bold;
    width: 100%;
    padding: 5px 5px 5px 5px;
    vertical-align: middle;
    border-radius: 6px;

    color: white;
    background-color: darkorange;
}

.ExploreSignUpGetStartedButton:hover {
    color: darkorange;
    background-color: white;
}

a.ExploreTip {
    color: black;
    border-bottom: 1px dashed;
    text-decoration: none;
}

a.ExploreTip:hover {
    cursor: help;
    position: relative;
}

a.ExploreTip span {
    display: none;
}

a.ExploreTip:hover span {
        width: 250px;
        display: block;
        background-color: white;
        border: #c0c0c0 1px dotted;
        border-radius: 8px;
        padding: 20px 10px 20px 20px;
        z-index: 100;
        margin: 10px;
        top: 20px;
        left: 0px;
        position: absolute;
        font-size: 100%;
        line-height: 130%;
        text-decoration: none;
        text-align: left;
}

.FooterBackgroundContainer {
        margin: 50px 0px 0px 0px;
        padding: 20px 20px 20px 20px;
        background-color:#0090c5;
}

.FooterCopyright {
    font-size: 80%;
    color: white;
    padding: 20px 0px 0px 0px;
}

.FooterTable {
    width: 100%;
}

.FooterTable th { font-size: 1.1em; font-weight: bold; color: #ffeeab; padding:
10px 10px 3px 10px; vertical-align:bottom; }

.FooterTable td {
    font-size: 1em;
    color: white;
    padding: 10px;
    vertical-align:top;
}

.FooterHeader { font-size: 1.1em; font-weight: bold; color: #ffeeab; padding:
10px 0px 3px 0px; vertical-align:bottom; }

.HomeFooterLink {
    font-weight: bold;
    color: #FFCC00;
    text-decoration: none;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}

.HomeFooterLink:hover {
    color: white;
    text-decoration: none;
    border-top: 2px solid #FFCC00;
    border-bottom: 2px solid #FFCC00;
}

.StoreImageLink {
    border: 2px solid #FFCC00;
    border-radius:20px;
}

.StoreImageLink:hover {
    border: 2px solid #0090c5;
}

.HomeSignUpHighlight {
    font-weight: bold;
    color: #FFCC00;
}

.LoginButton {
    padding:15px 25px 15px 25px;
    background-color:#ffcc00;
    color:#00aae8;
    text-shadow: 1px 1px white;
    border-radius:10px;
    font-size:150%;
    font-weight:bold;
}

.LoginButton:hover {
    background-color: #0090c5;
    color: #ffcc00;
}







.StudentHomeTable {
    width: 100%;
    border: 0px solid transparent;
    border-collapse: separate;
    border-spacing: 5px 5px;

}

.StudentHomeTable th {
    font-weight: normal;
    padding: 5px;
    vertical-align:bottom;
}

.StudentHomeTable td {
    text-align: center;
    vertical-align: top;
    font-size: 120%;
    padding: 5px;
}


.StudentMenuContainer {
    display: inline-block;
    text-align: left;
    padding: 0px 0px 0px 0px;
    background-color: transparent;
}

.StudentMenuParent {
    text-align: center;
    vertical-align: middle;
    text-shadow: 1px 1px #007fad;
    padding: 3px 10px 3px 10px;
    font-size: 125%;
    font-weight: normal;
    color: #FFCC00;
    text-transform: uppercase;
    background-color: transparent;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    cursor: pointer;
}

.StudentMenuParent:hover {
    color: white;
    border-top: 3px solid white;
    border-bottom: 3px solid white;
}

.SelectableClassImage {
    border-radius:10px;
    border: 3px outset  #ffcc00;
    opacity: .9;
}


.SelectableClassImageDisabled {
    border-radius:10px;
    border: 3px outset #0090c5;
    opacity:.4;

}

.StudentHomeBeginTrainingButton {
    width:100%;
    padding:3px 3px 3px 3px;
        margin:5px 0px 5px 0px;
    color:black;
    background-color: #ffcc00;
    letter-spacing: 1px;
    border-radius:10px;
    font-size:1.3em;
    font-weight:bold;
    cursor: pointer;
}

.StudentHomeBeginTrainingButtonDisabled {
    width:100%;
    padding:5px 5px 5px 5px;
    color:#4f3300;
    background-color: #bf7b00;
    letter-spacing: 3px;
    border-radius:10px;
    font-size:1.5em;
    font-weight:bold;
    cursor: pointer;
}

.StudentHomeBeginTrainingButton:hover {
    color: white;
    background-color: #0090c5;
    text-shadow: 1px 1px #754c00;
}

.StudentHomeClassStatsContainer {
    color:white;
    border-radius:10px;
    padding: 15px 5px 15px 5px;
    min-height: 300px;
}

.StudentHomeClassStatsTitle {
    text-transform: uppercase;
    font-weight:bold;
    letter-spacing:1px;
    padding: 0px 0px 3px 0px;
        margin: 0px 0px 10px 0px;
}


.CoursePageTitle {
    font-size: 120%;
    letter-spacing: 3px;
    font-weight: bold;
    color:#176b96;
}

.CoursePageStepTitle {
    font-size: 150%;
    text-align: center;
    width: 100%;
    letter-spacing: 3px;
    font-weight: bold;
    color:#176b96;
    border: 0px;
    padding: 5px 0px 5px 0px;
    margin: 10px 0px 5px 0px;
}

.StepPage {

    padding: 0px;

    background-color: white;
}

.StepContent {
    position: relative;
    text-align:middle;
    font-size: 1em;
    line-height: 110%;
    padding: 0px 0px 0px 0px;
}


.StepContent img {
    border-radius: 0px;
}

.StepContent a {
    font-weight: bold;
    color: darkorange;
    text-decoration: none;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
}

.StepContent a:hover {
    color: #0090c5;
    text-decoration: none;
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
}

.MainClassTable
{
    width: 100%;
    border: 0px solid transparent;
    border-collapse: separate;
    border-spacing: 5px 5px;
    margin: 30px 10px 20px 10px;
}

.StudentHomeTable td {
    text-align: center;
    vertical-align: top;
    font-size: 120%;
    padding: 5px;
}

.StudentHomeTable a {
    font-weight: bold;
    color: darkorange;
    text-decoration: none;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
    line-height: 200%;
}


.StudentHomeTable a:hover {
    color: #0090c5;
    text-decoration: none;
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
}


.ClassPageSideContentBox {

    background-color:#e6f8ff;
    color:#0090c5;
    border:1px solid orange;
    border-radius:10px;
    padding:0px;
    width:100%;
    margin: 0px 0px 20px 0px;
}

.ClassPageSideContentBoxEmphasized {

    background-color:darkorange;
    color:white;
    border:1px solid orange;
    border-radius:10px;
    padding:0px;
    width:100%;
    margin: 0px 0px 20px 0px;
}

.ClassPageSideContentBoxNotes {

    background-color:lightyellow;
    color:#0090c5;
    border:1px solid orange;
    border-radius:10px;
    padding:0px;
    width:100%;
    margin: 0px 0px 20px 0px;
}


.PageItemClickable {
    cursor:pointer;
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;
}

.PageItemClickable:hover {
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
}

.StepConfirmButton {
    font-size: 150%;
    color: white;
    background-color: #ffcc00;
    text-shadow: 1px 1px #3d3d3d;
    border-radius: 10px;
    padding: 3px 10px 3px 10px;
}

.StepConfirmButton:hover {
    background-color: #0090c5;
}

.PageStandardTable {
    width: 100%;
    border: 0px solid transparent;
    border-collapse: separate;
    border-spacing: 5px 5px;

}

.PageStandardTable th {
    text-align: left;
    font-weight: normal;
    padding: 5px;
    vertical-align:bottom;
}

.PageStandardTable td {
    vertical-align: top;
    font-size: 120%;
    padding: 5px;
}

.FormQuestion {
    font-size: 120%;
    font-weight:bold;
    color: darkorange;
    margin: 20px 0px 10px 0px;
}

.FormSelect {
    font-size:100%;
    padding: 5px 10px 5px 10px;
    border: 1px solid #007fad;
    color: darkorange;
}

.FormSelectMultipleRow {
    display:block;
    font-size:100%;
    color: darkorange;
}

.FormTextArea {
    color: #0090c5;
    width:100%;
    font-size:100%;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    padding: 5px 10px 5px 10px;
    border: 1px solid #007fad;
    overflow: auto;
    resize:vertical;
}

.FormTextArea:hover {
    border: 1px solid darkorange;
}

.FormTextArea:focus {
    border: 1px solid darkorange;
}

.FormInput {
    color: #0090c5;
    font-size:100%;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    padding: 5px 10px 5px 10px;
    border: 1px solid #007fad;
}

.FormInput:hover {
    border: 1px solid darkorange;
}

.FormInput:focus {
    border: 1px solid darkorange;
}

.FormSubmitButton {
    font-size: 150%;
    color: white;
    background-color: darkorange;
    text-shadow: 1px 1px #3d3d3d;
    border-radius: 10px;
    padding: 13px 20px 13px 20px;
}

.FormRequiredLabel {
    font-weight:bold;
    color: #007fad;
    font-size:70%;
}

.FormValidation {
    color: white;
    background-color: darkorange;
    border-radius:10px;
    padding: 3px 15px 10px 15px;
    font-size: 130%;
}

.FormQuestionValidationHelp {
    color: darkorange;
    font-size: 100%;
    font-weight: bold;
    padding: 0px 0px 10px 0px;
}

.CompletionContinueButton {
    font-size: 150%;
    color: white;
    background-color: darkorange;
    text-shadow: 1px 1px #3d3d3d;
    border-radius: 10px;
    padding: 13px 20px 13px 20px;
    margin: 30px 0px 20px 0px;
}

.CompletionContinueButton:hover {
    background-color: #00aae8;
}

.StepMessageItemContainer {
    display: table;
    width:100%;
    min-height: 600px;
    background-color: darkorange;
    margin: 0px 0px 0px 0px;
    border-radius: 10px;
}

.StepMessageItemText {
    display: block;
    text-align:middle;
    vertical-align:middle;
    width: 100%;
    color: white;
    line-height: 120%;
    font-weight: bold;
}


.StepTimerText {
    display: none;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    text-shadow: 3px 3px 3px grey;
    vertical-align:center;
    color: white;
    font-weight: bold;
    font-size: 5em;
}

.splayButton {

    display: none;
    position: absolute;
    bottom:10px;
    text-align:center;
    transform: translate(-50%, -50%);
    font-size:400%;
    padding:15px 25px 15px 25px;
    color:white;
    background-color: #0090c5;
    letter-spacing: 3px;
    border-radius:10px;
    font-weight:bold;
    cursor: pointer;
}

.splayButton:hover {
    color: white;
    background-color: #ffcc00;
    text-shadow: 1px 1px #754c00;
}

.StepMessageOverlay {
    display: none;
    top:50%;
    left:50%;
    position: absolute;
    transform: translate(-50%,-50%);
    color: #0090c5;
    text-shadow: 3px 3px 3px grey;
    line-height: 120%;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: white;
}

.StepControls {
    display:block;
        position: absolute;
    bottom:10px;
    right:40px;
    padding: 10px;
}

.StepAdminControls {
    display:block;
        position: absolute;
    top:10px;
    left:60px;
    padding: 10px;
}

.splayControlButton {
    font-size:100%;
    padding:5px 10px 5px 10px;
    margin: 0px 0px 0px 5px;
    color:white;
    background-color: #0090c5;
    letter-spacing: 3px;
    border-radius:10px;
    font-weight:normal;
    cursor: pointer;
}

.splayControlButton:hover {
    color: white;
    background-color: #ffcc00;
    text-shadow: 1px 1px #754c00;
}

.FamilyMemberSelectContainer {
    display:inline-block;
    margin:5px 5px 5px 0px;
    border-radius:6px;
    box-shadow:3px 3px 3px #E0E0E0;
    padding:4px;
    border:2px solid orange;
    background-color: transparent;
    cursor: pointer;
}

.FamilyMemberSelectContainer:hover {
    border: 2px solid orange;
    background-color: orange;
    color: white;
}

.FamilyMemberSelectedContainer {
    display:inline-block;
    margin:5px 5px 5px 0px;
    border-radius:6px;
    box-shadow:3px 3px 3px #E0E0E0;
    padding:4px;
    border:2px solid orange;
    background-color: orange;
    color: white;
    cursor: pointer;
}

.FamilyMemberDisallowedContainer {
    display:inline-block;
    margin:5px 5px 5px 0px;
    border-radius:8px;
    box-shadow:3px 3px 3px #E0E0E0;
    padding:4px;
    border:2px solid #D0D0D0;
    background-color: #E0E0E0;
    color:#AAAAAA;
    cursor: pointer;
}


.StudentProfileUploadButton {
    position: absolute;
    bottom:10px;
    right:10px;
    font-size:80%;
    background-color:orange;
    color:white;
    padding:3px 10px 3px 10px;
    border-radius: 6px;
}

.StudentProfileUploadButton:hover {
    background-color:#007fad;
}

.StudentProfileSaveCropButton {
    font-size:80%;
    background-color:orange;
    color:white;
    padding:3px 10px 3px 10px;
    border-radius: 6px;
}

.StudentProfileSaveCropButton:hover {
    background-color:#007fad;
}

.rectangle {
        border: 1px solid #FF0000;
        position: absolute;
}

.CourseAdminToolButton {
    font-size:80%;
    background-color:#003045;
    color:white;
    padding:3px 10px 3px 10px;
    border-radius: 6px;
}

.CourseAdminToolButton:hover {
    background-color:orange;
}


.CourseAdminToolButtonOff {
    font-size:80%;
    background-color:#003045;
    color:#0090c5;
    padding:3px 10px 3px 10px;
    border-radius: 6px;
    border: 2px outset white;
}

.CourseAdminToolButtonOff:hover {
}

.CourseAdminToolButtonOn {
    font-size:80%;
    background-color:#0090c5;
    color:white;
    padding:3px 10px 3px 10px;
    border: 2px inset white;
    border-radius: 6px;
}

.CourseAdminToolButtonOn:hover {
}

.DebugLabelField {
    width: 100%;
    font-size:90%;
    padding:2px 3px 2px 3px;
}
.DebugInputField {
    width: 100%;
    font-size:90%;
    padding:2px 3px 2px 3px;
}

.TreasurePhotoSmall {
    box-shadow: 3px 3px 3px #d0d0d0;
    padding: 10px 10px 10px 10px;
    border: 1px solid #ffcc00;
}

.TreasurePhotoUnbound {
    box-shadow: 3px 3px 3px #d0d0d0;
    padding: 20px;
    border: 1px solid #ffcc00;
}

.TreasurePhotoSelectable {
    box-shadow: 3px 3px 3px #d0d0d0;
    padding: 10px 10px 10px 10px;
    border: 3px solid transparent;
    cursor: pointer;
}

.TreasurePhotoSelectable:hover {
    border: 3px solid darkorange;
}

.ProfileButton {
    margin:0px 5px 5px 0px;
    background-color: white;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border: 3px outset darkorange;
    border-radius: 6px;
}

.ProfileButton:hover {
    border-top: 3px solid darkorange;
    border-bottom: 3px solid darkorange;
    background-color: orange;
    border: 3px inset darkorange;
}

.GeneralStudentButton {
    padding: 3px 10px 3px 10px;
    color:white;
    font-size:120%;
    text-decoration:none;
    background-color: darkorange;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border: 3px outset darkorange;
    border-radius: 6px;
}

.GeneralStudentButton:hover {
    background-color: #0090c5;
    border: 3px inset darkorange;
}




.ForumButton {
    display:table-cell;
    font-size:150%;
    text-align:middle;
    vertical-align:middle;
    width:240px;height:240px;
    background:darkorange;
    color:white;
    border:3px outset darkorange;
    border-radius:6px;
    padding: 0px 5px 0px 5px;
    margin:20px;
        cursor:pointer;
}

.ForumButton:hover {

    background-color: #0090c5;
}

.ForumActionButton {
    margin:2px 2px 0px 0px;
    background-color: white;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border: 2px outset darkorange;
    border-radius: 6px;
    vertical-align: middle;
    height:24px;
    width:24px;
}

.ForumActionButton:hover {
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
    background-color: orange;
    border: 2px inset darkorange;
}


.ForumPostButton {
    margin:0px 0px 2px 0px;
    background-color: white;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border: 2px outset darkorange;
    border-radius: 6px;
    height:24px;
    width:24px;
}

.ForumPostButton:hover {
    border-top: 2px solid darkorange;
    border-bottom: 2px solid darkorange;
    background-color: darkorange;
    border: 2px inset darkorange;
}

.ForumPostButtonDisabled {
    margin:0px 0px 5px 0px;
    background-color: darkorange;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border: 2px outset darkorange;
    border-radius: 6px;
    height:24px;
    width:24px;
}

.ForumPostContentContainer {
    display:table;
    text-align:left;
    font-size:100%;
    font-color: #0090c5;
    border: 1px outset #baecff;
    background-color: #f5fcff;
    width:100%;
}

.ForumPostContent {
    display:table-cell;
    text-align:left;
    font-size:100%;
    padding:10px;
    font-color: #0090c5;
    width:100%;
}

.FormTextAreaContent {
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    min-height:300px;
    max-height:800px;
    height:auto;
    width:100%;
    font-size:100%;
    font-color:#003454;
    background-color:#f5fcff;
    border:1px solid darkorange;

}

.ForumPostSearch {
    vertical-align:bottom;
    border: 1px solid darkorange;
    font-size:90%;
    border-radius: 6px;
    padding:1px 3px 1px 3px;
    color: darkorange;
}

.ForumPostSearch:focus {
    border: 1px solid #0090c5;
}

.PostCommentInput {
    vertical-align:middle;
    border: 1px solid darkorange;
    font-size:100%;
    border-radius: 2px;
    padding:1px 0px 1px 3px;
    color: darkorange;
}

.PostCommentInput:focus {
    border: 1px solid #0090c5;
}


.StandardUserSection {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 150%;
    font-weight: bolder;
    background-color: #176b96;
    color: white;
    width: 100%;
    height: 40px;
}

.StandardUserTable {
    width: 100%;
    min-width: 400px;
    padding: 10px 0px 10px 0px;
    color: #176b96;
    margin: 0px;
    border: none;
    vertical-align:middle;
    text-align: center;
}

.StandardUserTable td {
    padding: 10px 10px 10px 10px;
    min-width: 200px;
    color: #176b96;
    font-size: 100%;
    line-height: 100%;
    margin: 0px;
    border: none;
    vertical-align:middle;
    text-align: center;
}

.InputTextField {
    outline: none;
    border: none;
    border-bottom: 1px dotted #60CBFF;
    font-size: 125%;
    text-align: left;
    padding: 5px 15px 5px 15px;
    width: 100%;
    background-color: #ffedd1;

}

.InputTextField:focus {
    border-bottom: 2px solid #60CBFF;
    background-color: #dbf7ff;
}

.InputDateField {
    text-align:left;
    font-size:160%;
    font-weight:normal;
    padding: 0px 0px 0px 5px;
    height:32px;
    border:0px;
    border-bottom: 1px dotted #60CBFF;
    background-color: #ffedd1;
}

.InputDateField:focus {
    border-bottom: 2px solid #60CBFF;
    background-color: #dbf7ff;
}

.InputFormLabel {
    outline: none;
    border: none;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size: 125%;
    text-align: left;
    padding: 10px 0px 10px 0px;
    width:100%;
    color: #176b96;
}

.DescriptionFormLabel {
    outline: none;
    border: none;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size: 90%;
    text-align: left;
    padding: 10px 0px 10px 0px;
    width:100%;
    color: #176b96;
}

.divAddConfirmation {

    position: fixed;

    display: block;

    width: 300px;
    line-height: 1.5;

        top: 50%;
        left: 50%;

        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);

    border: 2px solid #176b96;
    color: white;
    background-color: darkorange;

    text-align: center;
    vertical-align: middle;

    padding: 26px;

}

.divAddConfirmationMessage {
    display: block;

    font-size: 150%;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    background-color: darkorange;

    width: 100%;
}

.StudentVideoUploadButton {
    font-size:150%;
    background-color:orange;
    color:white;
    padding:3px 10px 3px 10px;
    border-radius: 6px;
}

.StudentVideoUploadButton:hover {
    background-color:#007fad;
}

.divCourseNoteContainer {

        position: fixed;

    display: block;

    width: 300px;
        height: 600px;
    line-height: 1.5;


    border: 2px solid #176b96;
    color: white;
    background-color: darkorange;

    text-align: center;
    vertical-align: middle;

    padding: 26px;

}

.divCourseNote {
    display: block;

    font-size: 150%;
    font-weight: bold;
    text-align: center;
    vertical-align: middle;
    background-color: darkorange;

    width: 100%;
}

.flag
{
        width:30px;
        height:auto;
        margin:1px;
        padding:0px;
        border:2px solid white;
}


/* Set your aspect ratio */
.video-container {
        position: relative;
        overflow: hidden;
        height: 0;
        padding-bottom: 56.25%; /* creates a 16:9 aspect ratio */
}

.video-container iframe,
.video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        max-width: 100%;
}

/* And set the max-width of the parent element */
.video-wrap {
        width: 100%;
        max-width: 600px;
}

.DarkBackground {

        position: fixed;

        display: block;

        width: 100%;
        height: 100%;

        top: 0%;

        color: black;
        background-color: black;
        opacity: .3;

        text-align: center;
        vertical-align: middle;


}


.StandardButton {

        color: white;
        background-color: darkorange;
        border: solid 1px darkorange;
        border-radius: .5em;
        margin:2px;
        text-align: center;
        padding: 3px 3px 3px 3px;
        cursor:pointer;

}

.StandardButton:disabled {

        color:orange;
}

.StandardButton:hover {
        color: darkorange;
        background-color: white;
}

.TabButtonNotSelected {

        color: darkorange;
        font-weight:bold;
        background-color: white;
        border-top: solid 2px darkorange;
        border-left: solid 2px darkorange;
        border-right: solid 2px darkorange;
        border-bottom: none;
        border-radius: 6px 6px 0px 0px;
        margin:0px 2px 0px 2px;
        text-align: center;
        padding: 3px 3px 3px 3px;
        cursor:pointer;
        text-transform:uppercase;
        width: 120px;

}

.TabButtonNotSelected:disabled {

        color:orange;
}

.TabButtonNotSelected:hover {
        color: white;
        background-color: darkorange;
}


.TabButtonSelected {

        color: white;
        font-weight:bold;
        background-color: darkorange;
        border-top: solid 2px darkorange;
        border-left: solid 2px darkorange;
        border-right: solid 2px darkorange;
        border-bottom: none;
        border-radius: 6px 6px 0px 0px;
        margin:0px 2px 0px 2px;
        text-align: center;
        padding: 3px 3px 3px 3px;
        cursor:pointer;
        text-transform:uppercase;
        width: 120px;
}

.TabButtonSelected:disabled {

        color:orange;
}


.smlink {
        text-decoration:none;
        color:#ffcc00;
        font-weight:bold;
}


.SelectableChapterListItem {

        color:darkorange;
        background-color:white;
}
.SelectableChapterListItem:hover {
        background-color:darkorange;
        color:white;
}

.PageLinkUnselected {
        color:darkorange;
        font-weight:bold;
        margin:3px;
}