body {font-size: 13pt;}

.container {background: none;}

.tutorial{
		margin: 20px 20px;

		padding: 0px 0px 0px 0px;
		position:relative;
		min-height:50px;
		color: #666;
		text-align: left;
}

.caption{
		margin-bottom: 0px;
		color:#FFFFFF;
}

.aspect-ratio {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 67%;

	margin-top: 15px;
}

.aspect-ratio .video {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}

.videoHTML5 {
		padding: 0px 0px 0px 0px;
		margin-top: 15px;
		visibility: hidden;

}



h2{font-size: 13pt; line-height: 1.1em; margin: 0; padding: 0;}

p {font-size: 1.0em; margin-right: 10px; margin-left: 10px;}



a.sectionHeader {color: white; display: block; background: #5C5C5C; padding: 20px 30px; color: white; text-align: left; margin: 20px 0px 0px 0px; background-image: url("img/expand.png"); background-repeat: no-repeat; background-position: right 20px center; background-size: 30px 30px;}
a.sectionHeader:hover {text-decoration: none; color: white;}
a.sectionHeader:visited {text-decoration: none; color: white;}

a.sectionHeader.expanded {background-image: url("img/contract.png");}

a.subSectionHeader {color: black; background-color: #D0D0D0; margin: 10px 0px 0px 0px; background-image: url("img/expand-black.png");}
a.subSectionHeader:hover {text-decoration: none; color: black;}
a.subSectionHeader:visited {text-decoration: none; color: black;}

a.subSectionHeader.expanded {background-image: url("img/contract-black.png");}

a.menuLink {color: white; display: block; background-color: #282828; padding: 20px 30px; color: #797979; text-align: left; margin: 20px 0px 0px 0px;}
a.menuLink:hover {text-decoration: none;}

.contentSection {padding-bottom: 50px; }
.contentSection p {text-align: left;}


.callout {margin: 20px; padding: 5px; position: relative; margin-bottom: 50px;}
.callout p {color: #F36541; text-align: right; margin: 0px; padding: 0px; position: absolute; line-height: 1.0em;}
.callout h2 {font-size: 1.2em; margin: 0; padding: 0;}

.buttonLabel {margin: 10px 10px; clear: both; padding-left: 20px;}
.buttonLabel img {float: left; height: 26px;}
.buttonLabel p {float: left; color: #F36541; text-align: left; line-height: 26px; padding-left: 20px; margin-left: 0px;}

.buttonInsetLabel {margin: 10px 10px; clear: both; padding-left: 30px;}
.buttonInsetLabel img {float: left; height: 24px;}
.buttonInsetLabel p {float: left; color: #FFFFFF; text-align: left; line-height: 24px; padding-left: 20px; margin-left: 0px;}

@media (max-width: 400px) {

	p {font-size: 0.8em;}
	.callout h2 {font-size: 1.0em;}



}