html, body {
	margin:0; padding:0;
	background-color:#000;
	background-image:url("https://ballroomdancers.com/images/curtain_bluer.png");
	background-attachment:fixed;
}
html, body, div, span, p, li, td, th, blockquote {
	color: #fff;
	font-size:13pt;
	font-family: 'Raleway', sans-serif;
}
.subtext {font-size:9pt;color:#ccc;}
.header, h1, h2, h3, h4, h5, h6 {
	color: #ffff99;
}
.header {
	font-size:16pt;
	margin:30px auto;
}
#startup {
	display:block;
	position:absolute;
	width:100%; height:100%;
	text-align:center;
	vertical-align:middle;
	padding:60px;
}
#startup:after{
    content: "";
    display: inline-block;
    width: 0px;
    height: 100%;
    vertical-align: middle;
}
.behind {
	position:absolute;
	right:-200px;
	height:100%;
}
#startup .logo {float:left;}
#navbar-pad {
	display:block;
	width:100%; height:50px;
}
.navbar {
	box-shadow:0 0 30px rgba(0,0,0,1);
	-webkit-box-shadow:0 0 30px rgba(0,0,0,1);
	-moz-box-shadow:0 0 30px rgba(0,0,0,0.75);
	-o-box-shadow:0 0 30px rgba(0,0,0,0.75);
	
	background: rgb(40,40,40);
	background: -moz-linear-gradient(top, rgba(68,68,68,1) 0%, rgba(17,17,17,1) 100%);
	background: -webkit-linear-gradient(top, rgba(68,68,68,1) 0%,rgba(17,17,17,1) 100%);
	background: linear-gradient(to bottom, rgba(68,68,68,1) 0%,rgba(17,17,17,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#111111',GradientType=0 );			
	border-bottom:1px solid rgba(0,0,0,0.4);
}
.navbar-brand {
	margin-left:10px;
}
.navbar-brand img {
	position:relative;
	top:-7px;
	height:34px;
}
#myNavbar ul.navbar-right li {margin-right:10px;}
#myNavbar ul.navbar-right li span.fa {padding-right:10px;}

#home {
	margin-top:45px;
}

#main {

}
.flexmargin {
	display:block;
	width:100%;
	padding:0 15px 30px 15px;
}
.spacer {height:30px;}
.error {color:#ea4f17;}

#splash-logo, #startup .logo {
	width:100%;
	max-width:450px;
	margin-bottom:30px;
}
#splash-logo-small {
	width:100%;
	max-width:450px;
	margin-bottom:15px;
}
.btn {
	border-left:none; border-right:none;
	border-top:1px solid #999;
	border-bottom:1px solid #000;
	color:#ddd;
	font-family:arial, helvetica,  sans-serif;
	font-size:13pt;
	padding:10px 15px 12px 15px;
	text-shadow:-1px -1px rgba(0,0,0,0.1);
}
.btn-sm {
	padding:3px 10px 5px 10px;
	font-size:12pt;
}
.btn-xs {
	padding:2px 6px 4px 6px;
	font-size:11pt;
}
.btn:hover {
	color:#fff;
	border-top:1px solid #999;
	border-bottom:1px solid #000;
}
.btn:focus {
	color:#ddd;
}
.btn-default, ul.nav-pills li a, #media-info:hover {
	background: rgb(85,85,85);
	background: -moz-linear-gradient(top, rgba(85,85,85,1) 0%, rgba(56,56,56,1) 100%);
	background: -webkit-linear-gradient(top, rgba(85,85,85,1) 0%,rgba(56,56,56,1) 100%);
	background: linear-gradient(to bottom, rgba(85,85,85,1) 0%,rgba(56,56,56,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#555555', endColorstr='#383838',GradientType=0 );			
}
.btn-default:hover, ul.nav-pills li a:hover {
	background: rgb(107,107,107);
	background: -moz-linear-gradient(top, rgba(107,107,107,1) 0%, rgba(56,56,56,1) 100%);
	background: -webkit-linear-gradient(top, rgba(107,107,107,1) 0%,rgba(56,56,56,1) 100%);
	background: linear-gradient(to bottom, rgba(107,107,107,1) 0%,rgba(56,56,56,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b6b6b', endColorstr='#383838',GradientType=0 );
}
.btn-primary, .modal-header, ul.nav-pills li.active a {
	background: rgb(92,152,194);
	background: -moz-linear-gradient(top, rgba(92,152,194,1) 0%, rgba(58,108,159,1) 100%);
	background: -webkit-linear-gradient(top, rgba(92,152,194,1) 0%,rgba(58,108,159,1) 100%);
	background: linear-gradient(to bottom, rgba(92,152,194,1) 0%,rgba(58,108,159,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5c98c2', endColorstr='#3a6c9f',GradientType=0 );	#3a6c9f
}
.btn-primary:hover {
	background: rgb(117,167,203);
	background: -moz-linear-gradient(top, rgba(117,167,203,1) 0%,rgba(73,131,189,1) 100%);
	background: linear-gradient(to bottom, rgba(117,167,203,1) 0%,rgba(73,131,189,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75a7cb', endColorstr='#4983bd',GradientType=0 );
}
.btn-disabled {
	color:rgba(255,255,255,0.5) !important;
}

ul.nav-pills {
	display:flex;
	margin:15px auto 30px auto;
} /* 25,15 for vertical */
ul.nav-pills li {flex:1;}
ul.nav-pills li a {
	display:inline-block;
	width:100%;
	border-left:none; border-right:none;
	border-top:1px solid #999;
	border-bottom:1px solid #000;
	font-family:arial, helvetica,  sans-serif;
	text-shadow:-1px -1px rgba(0,0,0,0.1);
	border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0;
	color:#ddd;
	white-space:nowrap;
}
ul.nav-pills li:first-child a {border-radius:5px 0 0 5px; -webkit-border-radius:5px 0 0 5px; -moz-border-radius:5px 0 0 5px; -o-border-radius:5px 0 0 5px;}
ul.nav-pills li:last-child a {border-radius:0 5px 5px 0; -webkit-border-radius:0 5px 5px 0; -moz-border-radius:0 5px 5px 0; -o-border-radius:0 5px 5px 0;}

.close {opacity:0.5;}
.close:hover {opacity:1;}

.full-size {
	width:100%;
}
.button-menu button {text-align:left;}
.button-menu button:after {
	content:">";
	float:right;
	background-color:#000;
	padding:0 7px;
	border-radius:100%; -webkit-border-radius:100%;
	border-right:1px solid #999;
	border-bottom:1px solid #999;
}
.button-menu button:hover:after {
	background-color:#ccc;
	color:#000;
}
#home-menu {
	margin-top:20px;
}
#loading {
	position:absolute; left:0; top:0;
	display: flex; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex;
	flex-flow:column;
	align-items: center;
	justify-content: center;
	width:100%; height:100%;
}
#loading img {
	width:150px;
}
#loading-msg {
	padding:30px;
}
.choice {
	padding:30px;
	max-width:650px;
	margin:0 auto;
}
.choice button {margin-top:10px;}

.form-group {}
.form-group label {
	float:left;
	min-width:150px;
	text-align:right;
	margin-right:20px;
	position:relative; top:7px;
	white-space:nowrap;
	overflow-x:hidden;
	text-overflow:ellipsis;
}
.form-group input[type="text"], .form-group input[type="password"] {
	font-size:13pt;
	padding:20px 12px;
}
.form-group input[type="text"], .form-group input[type="password"], .form-group button {
	display:block;
	width:calc(100% - 170px);
}
.form-group .form-control {
	border-radius:0;
	-webkit-border-radius:0;
	position:relative;
	border-top:none;
	border-left:none;
	border-right:none;
	border-bottom:1px solid rgba(0,0,0,0.2);
}
.form-group .form-control::placeholder {
	display:none;
	color:#fff;
}
.form-group .input-top {
	border-radius:5px 5px 0 0 !important;
	-webkit-border-radius:5px 5px 0 0 !important;
}
.form-group .input-bottom {
	border-radius:0 0 5px 5px !important;
	-webkit-border-radius:0 0 5px 5px !important;
}
textarea, textarea.form-control {height:150px;}
.form-group input.error {
	box-shadow:inset 0 1px 1px 0 rgba(255,0,0,0.5), inset 0 0 25px 0 rgba(255,0,0,0.2);
	-webkit-box-shadow:inset 0 1px 1px 0 rgba(255,0,0,0.5), inset 0 0 25px 0 rgba(255,0,0,0.2);
	-moz-box-shadow:inset 0 1px 1px 0 rgba(255,0,0,0.5), inset 0 0 25px 0 rgba(255,0,0,0.2);
	-o-box-shadow:inset 0 1px 1px 0 rgba(255,0,0,0.5), inset 0 0 25px 0 rgba(255,0,0,0.2);
}

#login-form {
	width:800px;
	padding:30px 0 0 0;
}
#login-form-message {
	margin:15px auto 45px auto;
}
#login-form-noaccount {
	margin:30px auto 15px auto;
}

#privacy-form .nav-pills {margin-top:0;}
#privacy-form p {text-align:left !important;}
.privacy-tab {margin-bottom:45px;}

.pseudo-modal {
	max-width:800px;
}
.pseudo-modal h3, .pseudo-modal h4 {
	margin:30px 0;
}

footer {
	margin:90px auto 30px auto;
	line-height:30px;
}
footer ul {list-style-type:none;margin:0;padding:0;}
footer ul li {display:inline;}
footer li::after {content:"|";}
footer li:last-child::after {content:"";}
footer ul li a {padding:15px;}

.modal-backdrop {
	background-color:rgba(0,0,0,1) !important;
}
.modal-header, .modal-footer, .modal-body {
	color:#000;
	border:0;
	padding:10px;
	margin:0;
}
.modal-header {
	color:#fff !important;
}
.modal-footer {
	text-align:center;
}

#start {margin-top:30px;}

#contact img.icon {
	float:left;
	width:100px;
	margin-right:30px;
}
.panel, .list-group-item {
	background: rgb(40,40,40);
	background: -moz-linear-gradient(top, rgba(68,68,68,1) 0%, rgba(17,17,17,1) 100%);
	background: -webkit-linear-gradient(top, rgba(68,68,68,1) 0%,rgba(17,17,17,1) 100%);
	background: linear-gradient(to bottom, rgba(68,68,68,1) 0%,rgba(17,17,17,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444', endColorstr='#111111',GradientType=0 );
	border-top:1px solid rgba(255,255,255,0.3);
	border-left:1px solid rgba(255,255,255,0.25);
	border-right:1px solid rgba(255,255,255,0.25);
	border-bottom:1px solid rgba(255,255,255,0.1);
}
.list-group .list-group-item .left, .list-group .list-group-item .right {
	display:inline-block;
	vertical-align:top;
}
.list-group-item {
	padding-top:9px; padding-bottom:12px;
}
.panel {
	padding-top:5px; padding-bottom:7px;
}
.list-group .list-group-item .left {
	text-align:right;
	margin-right:30px;
	color:#ccc;
}
.list-group .list-group-item .right {
	text-align:left;
}
.list-group .list-group-item .pad-right {padding-right:10px;}
.list-group .list-group-item .pad-bottom {padding-bottom:5px;}

.list-group .list-group-item .right .btn {
	vertical-align:top;
	margin-right:10px;
}
.list-group .list-group-item .right .btn:last-child {
	margin-right:0 !important;
}
.list-label {
	display:block;
	white-space:nowrap;
	text-overflow:ellipsis;
	overflow-x:hidden;
}

#account .list-group {text-align:left; min-width:330px;}
#account .list-group .list-group-item .left {width:100px;}
#account .list-group .list-group-item .right {width:calc(100% - 140px);}
#contact .list-group .list-group-item .left {width:150px;}
#contact textarea.form-control {
	height:310px;
}

#account .password {font-size:24pt;position:relative;top:12px;line-height:10px;}
#account .subtext {margin-bottom:10px;}


#preupgrade {
	padding:15px;
	background-color:#ccc;
}
#preupgrade, #preupgrade h1, #preupgrade .price, #preupgrade p {
	font-family: Arial, Helvetica, sans-serif;
	color:#000;
}
#preupgrade table td {vertical-align:top;}
#preupgrade img {width:43vw; max-width:330px; margin:20px 30px 15px 15px;}
#preupgrade h1 {color:maroon;font-weight:bold;font-size:32px;}
#preupgrade .price {
	margin-top:0; margin-bottom:30px;
	font-size: 54pt;
	font-weight:bold;
}
#preupgrade .price sup {font-size:18pt;position:relative;top:-33px;display:inline-block; display:none;}
#preupgrade .price sub {display:block;font-size:18pt;color:#666;text-transform:uppercase;margin-top:7px;}
#preupgrade .divider {width:auto;height:0;margin:15px;border-top:1px solid #999;border-bottom:1px solid #fff;}
#preupgrade button {width:100%; margin:15px 0;}
#preupgrade .btn-default {color:#aaa; background:#fff; border:none;}

#upgrade {margin-top:60px;}
#upgrade h4 {margin-top: 40px; position:relative; top:-60px;}

#benefits {
	text-align:left;
	background-color:rgba(0,0,0,0.5);
	border:2px solid #ccc;
	padding:30px 15px 15px 45px;
	margin-top:-25px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
}
#benefits li {color:#fff;margin-bottom:20px;}

#upgrade .list-group {display:table; width:100%;}
#upgrade .list-group-item {display:table-row;}
#upgrade .list-group-item div {display:table-cell; padding:15px 10px;width:30%;text-align:center;}
#upgrade .list-group-item div:first-child {width:40%;text-align:right;}
#upgrade .list-group-item div:nth-child(3) {color:#ffff99;}

#upgrade .list-group-item:first-child div {padding-top:60px;}
#upgrade em {
	font-weight:bold;
	font-style:normal;
	font-size:24px;
	color:#ffff99;
}


#dances li.simple-title {
	display:block;
	width:100%;
	text-align:center;
	color:#fff;
	margin:60px auto 30px auto;
}
#dances .title {
	display:none;
	position:relative;
	left:0;
	width:100%; height:150px;
	text-align:left; vertical-align:bottom;
	margin-top:30px;
	margin-bottom:15px;
	overflow:hidden;
}
#dances ul li.top-title {margin-top:0 !important;}
#dances .title img {
	position:absolute;
	left:0; top:0;
	width:100%; height:auto;
}
#dances .title h1 {
	position:absolute;
	bottom:15px; left:30px;
	font-size:18pt;
	font-family:Arial, Helvetica, sans-serif;
	color:#fff;
	text-shadow:2px 2px 5px rgba(0,0,0,0.5);
}
#dances ul {position;relative;list-style-type:none;margin:0;padding:0;}
#dances ul li {display:inline-block;text-align:center;margin:16px;}
#dances ul li, #dances ul li a img {width:150px;}
#dances ul li a img {margin-bottom:10px;box-shadow:3px 3px 10px rgba(0,0,0,0.5);}
#dances ul li a .dance-name {white-space:nowrap;}
#dances ul li a:hover {text-decoration:none;}


	#danceinfo .dance-img {width:100%;margin-bottom:30px;}
	#danceinfo .dance-title {margin:0 auto 30px auto;}
	
	#danceinfo .list-group {white-space:nowrap;}
	#danceinfo .list-group .list-group-item .left {width:120px;float:left;}
	#danceinfo .list-group .list-group-item .right {display:block;padding-left:150px;white-space:normal;}

	.step-list h3 {
		margin:30px auto;
	}
	.step-list .list-group {
		list-style-type:none;
		text-align:left;
	}
	.step-list .list-group li {
		padding:0 20px 0 0;
		height:50px;
		cursor:pointer;
		overflow-x:hidden; overflow-y:hidden;
		text-overflow:ellipsis;
	}
	.step-list .list-group li div.thumb-container {
		width:67px; height:100%;
		display:inline-blcok;
		float:left;
		margin-right:20px;
		background-image:url("https://ballroomdancers.com/images/empty-room.jpg");
		background-size:100% auto;
	}
	.step-list .list-group li img {
		width:67px; height:auto;
	}
	.step-list .list-group .name {
		line-height:45px;
	}




#stepinfo #navpill-menu ul {
	margin:30px auto 0 auto;
}

#step-name {
	margin:15px auto 30px auto;
}
#video-container .col:first-child {padding:0 30px 0 0;}
#video-container .col:last-child {padding:0 0 30px 0;}
#video-window {
	position:relative;
	width:100%;
	background-color:#000;
	background-size:auto 100%;
	background-repeat:no-repeat;
	border:1px solid #444;
	overflow:hidden;
}
#video-scaffold {
	width:100%; height:auto;
}
#media-info {
	cursor:default;
	border-bottom:none;
	border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important;
	-webkit-border-bottom-left-radius:0 !important; -webkit-border-bottom-right-radius:0 !important;
	-moz-border-bottom-left-radius:0 !important; -moz-border-bottom-right-radius:0 !important;
	-o-border-bottom-left-radius:0 !important; -o-border-bottom-right-radius:0 !important;
}
.you-are-watching, .video-variation {font-size:11pt;color:#ccc;}
.video-name {font-size:14pt;font-weight:600;}
#more-videos {
	position:relative;
	top:-5px;
	text-align:left;
	z-index:4;
	border-top:1px solid rgba(255,255,255,0.3); border-bottom:none;
	border-top-left-radius:0 !important; border-top-right-radius:0 !important;
	-webkit-border-top-left-radius:0 !important; -webkit-border-top-right-radius:0 !important;
	-moz-border-top-left-radius:0 !important; -moz-border-top-right-radius:0 !important;
	-o-border-top-left-radius:0 !important; -o-border-top-right-radius:0 !important;
}
#media-info {min-height:90px;}
#media-info:focus, #media-info .focus, #more-videos:focus, #more-videos .focus {outline:none;border-bottom:none;}
#more-videos .click-overlay {
	position:absolute;
	width:100%; height:100%;
	display:none;
}
#more-videos img {
	display:none;
	position:absolute;
	left:10px; top:8px;
}
.more-videos-text {
	display:none;
	margin-left:40px;
}
#video-menu {
	position:relative;
	margin:0 10px;
	padding:0 20px;
	background-color:#222;
	border-left:1px solid rgba(255,255,255,0.25);
	border-right:1px solid rgba(255,255,255,0.25);
	height:380px;
	overflow-y:scroll;
}
#video-menu ul {
	list-style-type:none;
	margin:0; padding:5px 10px 15px 0;
	text-align:left;
}
#video-menu ul li {
	padding:15px 0;
	clear:both;
	position:relative;
}
#video-menu ul li div.video_preview {
	display:block;
	float:left;
	width:90px; height:67px;
	margin-right:15px;
	background-size:auto 100%;
}
#video-menu ul li div.video_info div {
	font-size:11pt;
	line-height:auto;
	white-space:nowrap;
	overflow-x:hidden;
	text-overflow:ellipsis;
}
.video_info {cursor:pointer !important;}
.video_overlay {
	position:absolute;
	left:0px; top:15px;
	width:90px; height:67px;
	font-size:9pt;
	background-color:rgba(0,0,0,0.25);
	border:1px solid rgba(255,255,255,0.2);
}
.ribbon_basic:after, .ribbon_premium:after {
	content:"";
	display:block;
	position:absolute;
	left:-4px; top:-4px;
	width:90px; height:67px;
	background-size:60px auto;
	background-repeat:no-repeat;
	cursor:pointer;
}
.ribbon_basic:after {background-image:url("https://ballroomdancers.com/images/ribbon_basic.png");}
.ribbon_premium:after {background-image:url("https://ballroomdancers.com/images/ribbon_premium.png");}
.video-popup {
	position:absolute;
	left:0; top:0;
	width:100%; height:100%;
	background-color:rgba(0,0,0,0.65);
	z-index:3;
	display:none;
}
.video-popup table {
	height:100%;
	margin:0 15px;
}
.video-popup table td {vertical-align:middle;}
.video-popup p, .video-popup p span {
	font-size:16pt;
	font-weight:600;
	color:#ffff99;
	text-shadow:1px 1px #000;
}
.video-popup button {margin:15px;}
.video-popup em {text-transform:uppercase;font-size:24pt;font-style:normal;}

#video-player {
	position:absolute;
	top:0; left:0;
	width:100%; height:100%;
	display:none;
}
#video-player video {
	
	position:absolute;
	top:0; left:0;
	width:100%; height:100%;
	background-color:#000;
	/*
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	*/
}
.vjs-selected {
	background-color:rgba(255,255,255,0.4) !important;
	text-shadow:1px 1px 2px #000;
	color:#ffff66;
}
.video-js .vjs-big-play-button {
	left: 30% !important;
	top: 30% !important;
	width: 40% !important;
	height: 40% !important;
	/* border:3px solid rgba(255,255,255,0.5); */
	border:none; background:none !important;
	opacity: 0.7	5;
	filter: alpha(opacity=75);
}
.video-js .vjs-big-play-button:hover {
	background:none !important;
	opacity: 1;
	filter: alpha(opacity=100);
}
.vjs-control-bar button:focus, .vjs-big-play-button:focus {
	outline: none !important;
}
.video-js .vjs-play-control:before {
	/* content: '\f152'; */
}
.video-js .vjs-big-play-button .vjs-icon-placeholder:before {
	/* font-size: 64pt; */
	/* top:20% !important; */
	content: "";
	background-image: url('https://ballroomdancers.com/images/play.png') !important;
	background-size: auto 100%;
	background-repeat:no-repeat;
	background-position: center center;
}

#tab_container {
	margin:30px 0 0 0;
	border-bottom:none;
}
.nav-tabs li {
	margin:0 5px;
}
.nav-tabs li a {
	z-index:0;
	background-color:#222 !important;
	color:#999;
}
.nav-tabs li.active a {
	z-index:2;
}
.nav-tabs li a, .nav-tabs li.active a, .nav-tabs li.active a:focus, .nav-tabs li.active a:hover {
	border-top:1px solid rgba(255,255,255,0.3) !important;
	border-left:1px solid rgba(255,255,255,0.3) !important;
	border-right:1px solid rgba(255,255,255,0.3) !important;
	border-bottom:none;
}
.nav-tabs li.active a, .nav-tabs li.active a:focus, .nav-tabs li.active a:hover {
	color:#fff;
	background-color:rgba(68,68,68,1) !important;
	background: -moz-linear-gradient(top, rgba(102,102,102,1) 0%, rgba(68,68,68,1) 100%);
	background: -webkit-linear-gradient(top, rgba(102,102,102,1) 0%,rgba(68,68,68,1) 100%);
	background: linear-gradient(to bottom, rgba(102,102,102,1) 0%,rgba(68,68,68,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#444444',GradientType=0 );
}
.step-navigator .step-navigator-up {
	flex:5
}
.step-navigator .prev-button, .step-navigator .next-button {
	min-width:90px;
	flex:1;
}


#tab_box {
	text-align:left;
	padding:15px 20px 30px 20px;
	position:relative;
	top:-2px;
	z-index:1;
}
#tab_box a {
	color:#ffffbb;
}
.info-description {
	margin:0 10px 15px 10px; */
}
.info-description h3 {
	margin-top:25px;
	margin-bottom:15px;
}
.info-description h3:first-child {
	margin-top:10px;
}

.parts-table {}
.parts-table h3 {
	margin-top:30px; margin-bottom:10px; margin-left:10px;
}
.parts-table h3:first-child {margin-top:10px;}
.parts-container {
	width:100%;
	overflow-x:scroll;
	-webkit-overflow-scrolling: touch;
}
.parts-container table {
	min-width:100%;
}
.parts-table tr:nth-child(odd) td {background-color:rgba(255,255,255,0.1);}
.parts-table tr.empty-first {display:none;}
.parts-table td, .parts-table th {
	padding:5px 10px;
	text-align:left;
	vertical-align:top;
}
.parts-table th {
	border-bottom:1px solid #fff;
}

.parts-table td.stepno			{white-space:nowrap;}
.parts-table td.timing			{}
.parts-table td.description	{min-width:220px;}
.parts-table td.notes			{min-width:220px;}


/* USER ACCOUNT PAGE */

#account {
	
}
#account h1 {margin:30px 0;}
#profile-image {
	width:100%;
	background-color:#000;
	position:relative;
	margin-bottom:30px;
}
#profile-image img {
	width:100%;
}
#profile-image .premium-ribbon {
	width:150px;
	position:absolute;
	left:-8px; top:-7px;
}

@media only screen and (max-width: 1200px) {
	
	#video-menu {
		height:293px;
	}

}
@media only screen and (max-width: 991px) {
	#main {} /* 15px @ 992, 30px above */

	#login-form {
		width:calc(100% - 100px);
	}

	#dances li.simple-title {display:none;}
	#dances .title {display:block;}
	
	#video-container .col:first-child, #video-container .col:last-child {padding:0 0 0 0 !important;}
	#media-info {margin-top:30px;}
	#more-videos img, .more-videos-text {display:inline-block;}
	#more-videos .click-overlay {display:block;}
	#video-menu {
		height:auto;
		overflow-y:visible;
		display:none;
	}
	#tab_container {
		/*
		display:flex;
		justify-content:center;
		*/
	}
		
}
@media only screen and (max-width: 768px) {
	#main {}
	.choice {padding:20px 15px;}
	#splash-logo-small {max-width:250px;}
	#startup .logo {float:none;}
	.behind {display:none;}
	.navbar-brand {margin-left:0;}
	.form-group label {
		display:none;
	}
	.form-group .form-control, .form-group button {
		width:100% !important;
		margin:0 auto;
	}
	.form-group .form-control::placeholder {
		color:#aaa;	
	}
	#login-form {
		width:100%;
		padding:30px;
	}

}
@media only screen and (max-width: 500px) {
	
	#dances .title {height:120px;}
	#dances .title h1 {bottom:25px; left:25px;}
	#dances ul li {display:inline-block;text-align:center;margin:10px;}
	
	#preupgrade img {width:40vw; margin:5px 25px 0 0;}
	#preupgrade h1 {margin-top:5px;font-size:26px;}
	#preupgrade .price {margin-top:-5px;}
	#preupgrade .price sub {font-size:20px;}
	
}

@media only screen and (max-width: 400px) {
	#preupgrade img {width:35vw; min-width:90px; margin:5px 15px 0 0;}
	#preupgrade h1 {font-size:22px;}
	#preupgrade .price {font-size:60px;}
	#preupgrade .price sup {font-size:16px;top:-32px;}
	#preupgrade .price sub {font-size:18px;}
}


#pentaboxes{position:absolute;width:calc(100% - 30px);top:-80px;}
#pentaboxes svg {width:200px;}
#variable-spacer {padding-top:50px;padding-bottom:50px;}

@media only screen and (max-width: 768px) {#pentaboxes svg {width:100%;}}
@media only screen and (max-width: 685px) {#pentaboxes {top:-70px;} }
@media only screen and (max-width: 600px) {#pentaboxes {top:-60px;} #upgrade .list-group-item:first-child div {padding-top:50px;} #variable-spacer {padding-bottom:40px;} }
@media only screen and (max-width: 515px) {#pentaboxes {top:-50px;} #upgrade .list-group-item:first-child div {padding-top:45px;} #variable-spacer {padding-bottom:30px;} }
@media only screen and (max-width: 430px) {#pentaboxes {top:-40px;} #upgrade .list-group-item:first-child div {padding-top:35px;} #variable-spacer {padding-bottom:20px;} }
@media only screen and (max-width: 345px) {#pentaboxes {top:-30px;} #upgrade .list-group-item:first-child div {padding-top:30px;} #variable-spacer {padding-bottom:10px;} }
@media only screen and (max-width: 260px) {#pentaboxes {top:-20px;} #upgrade .list-group-item:first-child div {padding-top:25px;} #variable-spacer {padding-bottom:0;} }
@media only screen and (max-width: 236px) {#pentaboxes {width:206px;}}


