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;
}
