* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html, body {
	min-height: 100%;
	position: relative;
}

body {
 font-family: 'Raleway', sans-serif;
	font-size: 14px;
	line-height: 1.4;
}

img { border:0; }

.container {
	min-height: 100%;
	padding-bottom: 582px;
	padding-top: 25px;
}

h1, h2, h3, h4, h5, h6, b, strong { font-weight:600; }

table { border-spacing:1px; }
th { background-color:#d3ceaa; }

blockquote { padding:20px; background-color:#fbf7e4; }
blockquote > *:first-child { margin-top:0; }
blockquote > *:last-child { margin-bottom:0; }

.highlight { background-color:#ff6; padding:2px 5px; }
div.highlight { padding:2px 10px; margin:1em 0; }
.highlight_red { background-color:#fcc; color:#300 !important; padding:5px; font-weight:bold; }
li span.highlight { margin-left: -20px; }
.success, .warning, .error { font-weight:bold; }
.success { color:#0c0 !important; }
.warning { color:#FF8000 !important; }
.error { color:#c00 !important; }

/*                                    Header                                   */

.header {
	max-width: 1000px;
	margin: 0 auto 16px;
 padding:0 20px;
	position: relative;
 box-sizing:border-box;
}
.header img { display: block; }

 /* Home, Testimonials, Contact Us at top of page */
.quick-links {
	float: right;
 clear:both;
}
.quick-links > div {
 margin-left: 20px;
 display:inline-block;
 vertical-align:top;
 text-align:right;
}

h1 {
	font-size: 18px;
	text-align: right;
	line-height: 1.2;
 float:right;
 margin:0 0 8px -20px;
}

.header ~ .nav {
	background: #59000f;
	line-height: 40px;
	/* set up z-index positioning of menu items... */
	position: relative;
	z-index: 2;
	height: 40px;
}

	.header ~ .nav ul {
		width: 984px;
		margin: 0 auto;
		list-style-type: none;
	}

	.header ~ .nav > ul > li {
		display: inline-block;
		*zoom: 1;
		*display: inline;
		padding: 0 12px;
  font-size:16px;
	}
	.header ~ .nav > ul > li:hover { background-color:#691927; }

	.header ~ .nav li a:hover { color: #ffb2bf; }

	/* This .preload class is on by default, and then removed after 1s by JS, 
	 * preventing the menu from animating when the page first loads */
	.preload .nav { animation-duration: 0s !important; }


.nav a:link, .nav a:visited {
	color: #fff;
	text-decoration: none;
}

.current { color: #ffb2bf; }

.registrations {
 position: absolute;
 left: 50%;
 margin-left:-180px;
 top: 82px;
 width: 680px;
 text-align: right;
 box-sizing:border-box;
 padding-right:20px;
}
.registrations img {
 width:16px;
 height:16px;
 margin-right:5px;
 vertical-align:middle;
 background-color:#59000f;
}
.registrations a:hover img {
 background-color:#d35065;
}
.registrations > span > span { margin-right:5px; }
a.login_button {
 font-weight: bold;
	background-color: #800015;
	color: #fff !important;
	text-decoration: none;
	padding: 4px 20px 3px;
	border-radius: 14px;
	box-shadow: 1px 2px 5px rgba(255,255,255,0.5) inset, -1px -2px 5px rgba(0,0,0,0.5) inset;
	display: inline-block;
	vertical-align: top;
	text-shadow: 1px 1px 1px #000;
}
a.login_button:hover { background-color:#BF3048 !important; }

#declined_band, #warning_band {
 text-align:center;
 padding:5px 10px;
 background-color:#c00;
 color:#fff;
 font-weight:bold;
 width:100%;
 margin-top:-10px;
 margin-bottom:10px;
}
#declined_band a { color:#fdd;}
#declined_band a:hover { color:#faa;}

#warning_band {
 background-color:#F80;
}
#warning_band a { color:#FEC; }
#warning_band a:hover { color:#FDB;}

#admin_panel {
 position:fixed;
 width:100%;
 left:0;
 right:0;
 bottom:0;
 z-index:10;
 background-color:#000;
 color:#fff;
 padding:10px;
 font-size:12px;
 font-family:verdana,san-serif;
}
#admin_panel > div {
 float:right;
}
#admin_panel a { color:#9cf; text-decoration:none; }
#admin_panel a:hover { color:#cef; }
/* Dropdown menus */

li.menu:hover > .menu-items {
 display: block;
}

.menu-items { display: none; }

.header ~ .nav li .menu-items {
	position: absolute;
	z-index: -1;
	/*background-color:rgba(89, 0, 15, 0.9);*/
 background-color:#691927;
	width: auto;
	min-width: 250px;
 font-size:14px;
	line-height: 1.2;
	left: 0;
	padding: 12px calc((100% - 960px) / 2);
}

	.menu.last .menu-items {
		right: 0;
		left: auto;
	}

.menu-items li {
	display: block;
	text-align: left;
	text-transform: none;
	margin: 5px 0;
	width: 230px;
}

.menu-items ul {
	display: table-cell;
	vertical-align: top;
	width: 200px;
}

/* Spacing between groups of items in menu: */
.header ~ .nav li + li.start-of-group { margin-top: 1em; }

/* Show/hide extra menu items on smaller screens */

.more-toggle { display: none; }
.more-button {
	display: none;
	position: absolute;
	top: 0;
	right: 20px;
	color: #fff;
	font-weight: 400;
	cursor: pointer;
}
	.more-button:after { content: 'MORE'; }
	.more-toggle:checked + .nav .more-button:after { content: 'LESS'; }
	.more-button:hover { color: #ffb2bf; }

/*                                Main Content                                */

.main {
	max-width: 960px;
	margin: 0 auto;
 padding:20px 0;
 display:flex;
 flex-wrap:wrap;
}
.frontpage .main {
 display:block;
}

a:link, a:visited { color: #59000f; }
a:hover { color: #d35065; }

.column {
	display: inline-block;
	vertical-align: top;
}
.main .column {
	width: 318px;
	padding-right: 20px;
}

h2 {
	font-size: 20px;
	margin-bottom: 1em;
	line-height: 1.2;
}
h3 { margin: 1em 0; }
h4 { margin-bottom: 1em; }
h5 {
	font-size: 1em; 
	font-style: italic;
}
p + h3 { margin-top: 0; }

p {
	margin-bottom: 1em;
}

.date_and_times {
	margin-bottom:40px;
}
.date_and_times:last-child {
	margin-bottom:0;
}

img {
	margin-right: 10px;
}

img + img:last-of-type {
	margin-right: 0;
}

/* responsive embeds */
.scale {
	display: inline-block;
	*display: inline;
	zoom: 1;
	position: relative;
	width: 100%;
	margin-bottom: 1em;
}
	.scale iframe, .scale object, .scale embed, .scale video {
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		position: absolute;
	}
	.scale object embed {
		width: 100%;
		height: 100%;
	}

.side-by-side .scale {
	width: 49%;
	margin-right: 1%;
}

.side-by-side .scale + .scale {
	margin-right: 0;
	margin-left: 1%;
}

/* schedule page */
.schedule .column {
	width: 50%;
}

.primary-content .schedule ul {
	list-style-type: none;
	margin-left: 0;
}

.schedule li {
	margin-bottom: 1em;
}

.title { font-weight: 600; font-size:16px; }
.subtitle { margin-top:10px; }
.teacher_instruments {
 float:right;
 max-width:calc(100% - 100px);
 text-align:right;
}
/*
.teacher_instruments:before {
 content:"Teaches ";
}
*/
.bio {
 clear: both;
 margin-top:5px;
}
.bio:after {
	content:"";
	display:block;
	clear:both;
}
.bio img {
	float:left;
	width:160px;
	margin:3px 10px 0 0;
	max-width:40%;
}

h4 a:link { text-decoration: none; }

/* testimonials */
.testimonials {
	width: 100%;
}
.testimonials td:first-of-type {
	width: 140px;
}
.testimonials td {
	padding-bottom: 20px;
	vertical-align: top;
}

/* tables */

.primary-content table {
	margin: 0 auto 1em;
	min-width: 50%;
}

.primary-content td {
	vertical-align: top;
}
.primary-content form td {
 vertical-align: middle;
}

.padded td {
	padding: 10px 10px 0;
}

.padded td:first-of-type { padding-left: 0; }
.padded td:last-of-type { padding-right: 0; }

/*                            Front Page Content                              */

.announcement {
 margin-top:-20px;
 margin-bottom:20px;
 height:30px;
 color:#000;
 text-align:center;
}
.announcement > a { text-decoration:none; }
.announcement > a:link, .announcement > a:visited { color:#000; }
.announcement > a:hover > div { background-color:#F2CA00; }
.announcement div {
 background-color:#3DB8EB;
 padding:6px 20px 4px;
 position:absolute;
 left:0;
 width:100%;
 min-height:30px;
}

.featured-image {
	width: 100%;
	height: 55vw;
	position: absolute;
	left: 0;
	z-index: -1;
	max-height: 540px;
}
.featured-image-container {
 height:55vw;
	max-height: 540px;
 overflow:hidden;
 margin:-20px -20px 20px;
 padding:0px 20px 0;
}

	/* The rest of this is inline in home.inc.php */
	.featured-image ul { margin: 0; }
	.featured-image li, #preview-image {
		list-style-type: none;
		position: absolute;
		left: 50%;
  margin-left:-640px;
		width: 1280px;
		height: 100%; 
		background-size: cover;
		background-position: center top;
		background-repeat: no-repeat;
  filter: alpha(opacity=0);
  opacity:0;
  transition:all 2s;
	}
	.featured-image img {
		width: 100%;
		height: auto;
	}
 .featured-image li.is-vis {
  filter: alpha(opacity=100);
  opacity:1;
 }

.find-a-class {
	background: rgba(251, 247, 228, 0.9); /* #fbf7e4 */
 margin-top:20px;
	width: 320px;
}
	.frontpage .find-a-class h2 {
		text-transform: uppercase;
  margin:0;
  padding:15px 10px;
	}

	/* CSS magic to make tabs work */
	.find-a-class .tab-hack { display: none; }
	.find-a-class .tab-container { display: none; }
	.find-a-class input:nth-of-type(1):checked ~ .tab-container:nth-of-type(1) { display: block; }
	.find-a-class input:nth-of-type(2):checked ~ .tab-container:nth-of-type(2) { display: block; }
	/* end magic */

	.find-a-class label.tab-title {
		display: inline-block;
		*zoom: 1;
		*display: inline;
		/* unchecked: */
			background: #c7c1a1;
			padding: 5px 8px 5px;
			margin: 0 2px;
			cursor: pointer;
	}

		.find-a-class label.tab-title:first-of-type { margin-left: 12px; }

		.find-a-class input:nth-of-type(1):checked + label.tab-title {
			margin-left: 10px;
			cursor: auto;
		}

	.find-a-class .tab-hack:checked + label {
		background: rgba(211, 206, 170, 0.5); /* #d3ceaa */
		padding: 10px 10px 5px;
		margin: 0 0;
	}

	.find-a-class .tab-container {
		background: rgba(211, 206, 170, 0.5); /* #d3ceaa */
		padding: 20px;
		height: 100%;
	}

 .find-a-class label, .find-class label, .find-class p, .find-a-class p {
  display:block;
  margin:5px 0;
 }
 .find-a-class p > label, .find-class p > label { display:inline; }

	/* form layout */

	label { font-weight: 600; }

	select { margin-bottom: 10px; }
	select.wide { width: 100%; }

	select.row,
	input.row {
		margin-right: 10px;
		margin-left: 5px;
	}

	input[type='submit'], a.button, span.button {
		background: #59000f;
		padding: 10px 10px 9px;
		color: #fff;
		border: none;
		margin-left: auto;
		margin-right: auto;
		margin-top: 10px;
		display: inline-block;
		font-size: 14px;
  cursor:pointer;
  text-decoration:none;
	}
	input[type='submit']:hover, a.button:hover {
		background-color: #d35065;
  color:#fff;
	}
 input[type='submit'].inline { padding:4px 5px; }
 span.button {
  cursor:default;
 }
 span.button.cap3 {
  cursor:not-allowed;
  background-color:#666;
 }
 span.button.cap2 {
  cursor:not-allowed;
  background-color:#E6A117;
 }
 .waiting_list_link {
  float:right;
  clear:right;
  font-size:12px;
  width:82px;
  text-align:center;
 }

.frontpage .supporting-content h2 {
	font-weight: 600;
}

.primary-content {
	display: inline-block;
	vertical-align: top;
 /*overflow:hidden;*/
}

.primary-content ul {
	margin-left: 15px;
	margin-bottom: 1em;
}
.primary-content ol {
	margin-left: 20px;
	margin-bottom: 1em;
}

.primary-content p, .primary-content ul, .primary-content ol {
	font-family: Arial, "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; 
	color: #333;
}

.supporting-content {
	text-align: center;
	display: inline-block;
	*zoom: 1;
	*display: inline;
}
 .supporting-content > div:focus { outline:none; cursor:default; }
 .supporting-content > div:focus-within { outline:none; cursor:default; }

.matching_list {
 margin:20px 0;
 padding:20px;
 position: sticky;
 top: 20px;
 background: #fbf7e4;
}
.matching_list .header {
 margin:-20px -20px 20px !important;
 background: #d3ceaa;
 padding: 10px 20px;
}
.matching_list h3 { margin:0; }
.matching_list input[type=text], .matching_list select { width:100%; }
.matching_list .half {
 width:50%;
 display:inline-block;
 vertical-align:top;
}
.matching_list .half:nth-child(even) { padding-left:10px; }
.matching_list .half:nth-child(odd) { padding-right: 10px; }

.frontpage .checklist {
	width: 50%;
	display: inline-block;
	*zoom: 1;
	*display: inline;
	padding: 0 10px;
	margin-bottom: 40px;
}
	.frontpage .checklist img {
		display: block;
		margin: 0 auto;
	}

table.checklist th:nth-of-type(2),
table.checklist td:nth-of-type(2),
table.checklist th:nth-of-type(3),
table.checklist td:nth-of-type(3) {
	text-align: center;
	width: 100px;
}
table.checklist td {
	padding: 10px 0;
}

#testimonials_bar {
 background-color:#fbf7e4;
	padding: 20px calc((100% - 960px) / 2);
}
#testimonials_bar .columns {
 margin-left:-20px;
}
#testimonials_bar .column {
 width:calc(50% - 20px);
 margin-left:20px;
}
#testimonials_bar img {
 width:120px;
 height:120px;
 float:left;
 margin-right:10px;
}
#testimonials_bar p {
 overflow:hidden;
}

/*                              Subpage Specific                              */

.subpage .announcement {
 margin-top:0;
}
.subpage .announcement > div {
 position:static;
 background-color:#FFE359;
}
.subpage .announcement.announcement-Dashboard > div { background-color:#FCC; }


.header-image {
 width:100%;
 height:55vw;
 max-height:540px;
}
.header-image img {
 width:1280px;
 height:55vw;
 object-fit:cover;
 object-position:top;
 display:block;
 max-height:540px;
 position:absolute;
 left:50%;
 margin-left:-640px;
 margin-top:-20px;
}
.subpage .primary-content h2 {
	font-size: 28px;
	margin-top: 5px;
}

.subpage .primary-content {
	width: 960px;
}

.subpage .supporting-content + .primary-content {
	width: 640px;
	margin-left: 20px;
}

/* Sidebar menu */

.subpage .supporting-content {
	width: 300px;
	text-align: left;
}
.subpage .supporting-content > div {
	background: #fbf7e4;
}

.news, .class {
	background: #fbf7e4;
}

	.news {
		margin-left: -4px;
		padding: 20px;
	}

	.subpage .supporting-content h2, .subpage .news h2, .subpage .class h2 {
		font-size: 20px;
		margin: 0;
	}

	.subpage .supporting-content .header,
	.news .header,
	.class .header {
		background: #d3ceaa;
		padding: 10px 20px;
		margin-top: 0;
	}
	.news .header,
	.class .header {
		margin: -20px -20px 10px;
	}

	.subpage .supporting-content h2 { margin-bottom: 0; overflow: hidden; height: 24px; }

	.subpage .supporting-content ul,
	.news ul, .class ul {
		line-height: 1.7;
		list-style-type: none;
	}

	.news ul {
		margin: 0;
	}

	.supporting-content .menu a:link {
		text-decoration: none;
		width: 100%;
		display: inline-block;
		*zoom: 1;
		*display: inline;
	}

	.supporting-content .menu a:hover {
		color: #000;
	}

	.class, .news {
		display: inline-block;
		*zoom: 1;
		*display: inline;
		vertical-align: top;
		width: 50%;
	}

	.class { border-right: 10px solid #fff; }
	.news { border-left: 10px solid #fff; }

	.class li, .news li { padding-right: 10px; }

	.supporting-content .menu, .class, .news {
		padding-bottom: 20px;
	}

	.news ul li {
		line-height: 1.2;
		padding-bottom: 10px;
	}

	.class li {
		margin-bottom: 10px;
	}

.supporting-content .column {
	display: block;
	padding-right: 0;
}

.supporting-content li {
	padding: 0 20px;
}

.supporting-content .current {
	color: #000;
	background: #e7e8d1;
	padding: 0 20px;
}

.supporting-content .menu li:hover {
	background: #e7e8d1;
}

.supporting-content .start-of-group {
	margin-top: 0.5em;
}

/* News Page */

.news-headline { margin-bottom: 0; }
.news-info { font-style: italic; }

.message {
	background: #fbeee4;
	padding: 10px 20px;
}
.message:before {
	content: '!';
	border: 2.5px solid #d35065;
	color: #d35065;
	border-radius: 20px;
	width: 20px;
	height: 20px;
	display: block;
	text-align: center;
	font-weight: 600;
	display: inline-block;
	margin-right: 10px;
}

.pagination {
	text-align: center;
}

.pagination a,
.pagination span {
	background: #fbf7e4;
	width: 40px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	display: inline-block;
	text-decoration: none;
	margin: 10px;
	vertical-align: top;
}

.pagination .current {
	color: #ba8992;
	font-weight: 600;
}

.pagination-next, .pagination-prev { font-size: 0.6em; }

/* Schedule Page */

.subpage .find-class {
 background: #d3ceaa;
	padding: 20px;
 margin-bottom:20px;
}

.subpage .supporting-content .find-class .header {
 margin:-20px -20px 15px;
}

.cta {
	float:right;
	margin-top:17px;
 font-weight:bold;
}
.fees + .cta { margin-top:17px; }
.tab .cta {
 float:none;
 margin:0;
 padding: 20px 20px 0;
 font-weight: normal;
 font-style: italic;
}

#timezone {
 float:right;
 white-space:nowrap;
 margin-top:19px;
 font-size:12px;
}

.single-class {
	margin-bottom: 20px; /* todo this could break .class elsewhere */
	width: 100%;
	border-right: 0;
	background: #fbf7e4;
	padding: 20px;
}

.single-class h3 {
 font-size:20px;
	float: left;
 margin:0;
}

.single-class .info {
	text-align: right;
}

.single-class .button {
 float:right;
 margin-top:-1px;
}
.single-class .button.timeslot {
 float:none;
 margin:5px 5px 0 0;
 padding:5px 5px 4px;
 vertical-align:middle;
 text-align:center;
}
.single-class .button.timeslot > div {
 background-color: #fbf7e4;
 margin: 0 -5px -4px;
 color: #000;
 font-size: 10px;
 margin-top: 4px;
 text-align: center;
}
.single-class .description {
 background-color:#e7e8d1;
 padding:10px;
 font-size:12px;
 margin-bottom:2em;
}
.single-class .description p { margin:0; }
.single-class .description * + p { margin-top:1em; }

.lesson_dates {
 float:right;
 white-space:nowrap;
 font-size:12px;
 margin-top:2px;
}

/*
.fees {
	margin-top: 20px;
	background: #fbeee4;
}
*/

.fees .header {
	background: #ba8992;
	margin-bottom: 0;
}

	.fees .header label {
		cursor: pointer;
		height: 50px;
		display: block;
		padding: 20px;
		line-height: 1.2;
	}

	.fees .header label:after {
		content: '+';
		float: right;
		font-size: 28px;
		font-weight: 400;
		margin-top: -2px;
	}

	.fees input:checked ~ .header label:after {
		content: '\02212';
	}

	.fees input {
		display: none;
	}

	.fees .header h2 {
		float: left;
		margin: -10px 0 0 0;
		font-size: 21px;
		width: 100%;
	}

	.fees .content {
  box-shadow: 0 -10px 15px white inset;
		max-height: 53px;
		overflow: hidden;
		transition: 0.5s max-height;
		border-bottom: 20px solid #fff;
	}

 
	.fees table {
		margin: 20px;
	}
 

	.fees p {
		margin: 0 20px 20px;
	}

	.fees table td {
		width: 50%;
	}
	.fees table td + td {
		text-align: right;
	}

	.fees td.heading,
	.fees table {
		border-bottom: 1px solid #000;
	}

	.fees table table {
		margin-left: auto;
		margin-right: auto;
		border-bottom: none;
	}

	.fees input:checked ~ .content {
		max-height: 3000px;
  box-shadow:none;
	}

 .featured {
  color:#00c;
 }


/*                                 Locations                                  */

.locations-wrapper {
	background: #d3ceaa;
}

.locations {
	padding: 20px 0;
	max-width: 960px;
	margin: 0 auto;
}

.locations h2 {
	text-transform: uppercase;
	text-align: center;
}

.locations h3 {
	text-transform: uppercase;
	margin-bottom: 0;
}

.locations .column {
	width: 33%;
	padding-right: 20px;
}

.locations a:link, .locations a:visited {
	font-weight: 600;
	text-decoration: none;
}

.locations img {
	border: 2px solid #000;
	max-width: 100%;
	height: auto;
	margin-right: 0;
}

/* Classes Page */

.class {
	margin-top: 20px;
}

.class .header {
	margin-bottom: 0;
	margin-left: 0;
	margin-right: 0;
}

.class label {
	display: inline-block;
	background: #e7e8d1;
	margin-left: 8px;
	margin-top: 15px;
	padding-left: 12px;
	padding-right: 12px;
	height: 40px;
	line-height: 40px;
	cursor: pointer;
}
.class label:first-of-type {
	margin-left: 15px;
}

.class input { display: none; }
.class input:checked + label { background: #d3ceaa; }

.class .single-class {
	margin-bottom: 0;
 border-top: 10px solid #fff;
}

.class .no-classes {
	padding: 15px 15px 0;
}

.class.wide, .news.wide {
	width: 100%;
	border: 0;
}

.tab { display:none; border-top:5px solid #d3ceaa; }
#guildford-classes:checked ~ .guildford { display: block; }
#langley-classes:checked ~ .langley { display: block; }
#whiterock-classes:checked ~ .whiterock { display: block; }

/*                                   Footer                                    */

.footer {
	background: #424242;
	margin-top: -582px;
}

.footer .column { width: 20%; }

.footer .nav {
	text-align: left;
	padding: 20px 0 25px;
	max-width: 960px;
	margin: 0 auto;
	background-image: url('img/logo.png');
	background-position: right 45px bottom 40px;
	background-repeat: no-repeat;
	background-size: 300px 77px;
}

.footer li { display: block; }

li.head {
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 1em;
}

/*
li.head + li.head {
	margin-top: 0;
}
*/

.copyright {
	background: #262626;
	margin: 0;
	padding: 20px 0;
	color: #808080;
	text-align: center;
	line-height: 1.2;
	font-size: 11px;
}

.copyright a:link, .copyright a:visited {
	text-decoration: none;
	color: #808080;
}

.footer .column {
	width: auto;
	float: left;
}

.footer ul {
	margin-bottom: 1em;
	float: left;
	padding-right: 40px;
	max-width: 320px;
}
.footer .column:last-child ul:last-child { padding-right:0; }

.footer a:hover { text-decoration: underline; }

.clearfix:after {
	content: " "; /* Older browser do not support empty content */
	visibility: hidden;
	display: block;
	height: 0;
	clear: both;
}

/* Registration */
#login, #register {
	display:inline-block;
	min-width:280px;
	width:59%;
	vertical-align:top;
	margin:auto;
}
#login { width:39%; margin-right:2%; }
.s { font-size:12px; font-weight:normal; }
.xs { font-size:11px; font-weight:normal; }
th, td { padding:2px 4px; }
#login table, #register table, #cc_form table { margin:0 -4px; }
td h4 { margin-bottom:0; }
label { font-weight:normal; }
input[type=submit] { display:inline-block; margin-left:0; }
input[type=submit]:disabled { background-color: #ccc; cursor: not-allowed; }
input[type=text], input[type=select], input[type=number], input[type=email], input[type=password], select, textarea { padding:3px; border:1px solid #aaa; margin:0; }
.is-error { border-color:#c00 !important; }
td.is-error { border:1px solid #c00; }
tr.is-error td:last-child { border-left:1px solid #c00; border-right:1px solid #c00; }
tr.req_start.is-error td:last-child { border-top:1px solid #c00; }
tr.req_end.is-error td:last-child { border-bottom:1px solid #c00; margin-bottom:0; }

.pre_cart_row {
 margin-bottom:1em;
 background-color:#FBF7E4;
 padding:2px 4px;
}
.pre_cart_row:after {
 content:"";
 clear:both;
 display:block;
 height:0;
}
.pre_cart_row h4, .pre_cart_row p { margin:0; }
.pre_cart_teacher {
 width:80px;
 display:block;
 vertical-align:top;
 float:left;
 margin:4px 10px 4px 4px;
}
.pre_cart_teacher_bio {
 display:none;
 transition:all 0.5s;
 margin:5px 0;
 font-size:13px;
}


.cartTable { width:100%; }
.cartTable tr.cartItem:nth-child(even), .altrows tr:nth-child(even) { background-color:#FBF7E4; }
.cartItem td { vertical-align:top; }
#checkout, #pad_form { display:none; }
#checkout table { min-width:0; }
.actions_col > div + div { margin-top:4px; }

#recommendations { margin-bottom:1em; }
#recommendations blockquote {
 padding: 0px 20px;
 background-color: #fff;
 margin: -0.5em 0 1em;
}
#recommendations blockquote p:not(:last-child) { margin-bottom:0.5em; }

@media (max-width:1280px) {
	.featured-image li, #preview-image, .header-image img {
  width:100%;
  margin-left:0;
  left:0;
 }
}

.not-desktop { display:none; }

@media (max-width: 1000px) {
 .desktop-only { display:none; }
 .not-desktop { display:block; }
 span.not-desktop { display:inline; }
	/* Drop down to tablet layout */
	.main, .footer .nav, .locations {
		padding-left: 20px;
		padding-right: 20px;
	}

 .header ~ .nav > ul > li:hover {
		background: none;
	}

	.header ~ .nav ul {
		text-align: left;
	}

	li.menu:hover > .menu-items { display: none; }

	.announcement {
		margin:-20px -20px 20px;
		height:auto;
	}
	.announcement div {
  position:static;
 }

 .featured-image-container {
  height:auto;
  max-height:none;
 }

	.featured-image {
		width: 100%;
		float: none;
	}

	.find-a-class {
		width: auto;
  height:auto;
  max-height:none;
  margin-top:calc(55vw + 20px);
	}

	.primary-content,
	.supporting-content,
	.subpage .supporting-content + .primary-content {
		width: 100%;
		margin: 0;
  overflow:hidden;
	}

	.main .column { width: 49%; }

 #testimonials_bar { padding:20px; }

	.supporting-content .column {
		display: inline-block;
		*zoom: 1;
		*display: inline;
	}

	.footer .nav {
		background-position: right 20% bottom 40px;
	}

	.footer .column { width: 50%; }

	.footer ul + ul { clear: left; }

		.header ~ .nav ul {
			width: 100%;
			margin: 0 20px;
			padding-right: 80px;
		}

	/* Swap from displaying all of the menu items to displaying the "more" button */
	.header ~ .nav {
		overflow: hidden;
	}

	.more-button { display: block; }

	.header ~ .nav li { padding-left: 0; }

	.menu-items ul { max-height: 30px; }

	.subpage .supporting-content {
		width: 100%;
		margin-bottom: 20px;
	}

	.subpage .primary-content {
		margin-left: 0;
		width: 100%;
	}

	.subpage .supporting-content ul {
		display: inline-block;
		*zoom: 1;
		*display: inline;
		vertical-align: top;
		width: 100%;
	}

	@keyframes minimize-menu {
		0% { height:  80px; }
		100% { height: 40px; }
	}
	@keyframes maximizemenu {
		0% { height: 40px; }
		100% { height: 80px; }
	}
	.header ~ .nav { animation: 1s minimize-menu forwards; }
	.more-toggle:checked + .nav { animation: 1s maximizemenu forwards; }

 .cta { float:none; }
 .supporting-content .header { cursor:pointer; }
 .supporting-content > div {
  max-height:44px;
  min-height:44px;
  transition:all 1s;
  overflow:hidden;
 }
 .supporting-content > div:focus { max-height:700px; }
 .supporting-content > div:focus-within { max-height:700px; }

	.registrations {
		left:0;
		margin-left:0;
  padding-left:320px;
		width:100%;
	}

}

@media screen and (max-width: 820px) {
	/* Drop .header to mobile layout */
	.container { padding-top: 0; }

	.header {
		text-align: center;
  padding:0 10px;
  margin:10px 0 38px;
	}
	.quick-links { float: none; margin-top:8px; }
 .quick-links > div { text-align:center; margin:0 4px; }
	.header img { margin: 20px auto 62px; }
	h1 {
		float: none;
		text-align: center;
		position: relative;
	}
 .header h1 { margin:auto; }
 .registrations {
		width: 100%;
		text-align: center;
		top: 134px;
		left: 0;
		max-width: none;
  padding:0 10px;
 }
	.side-by-side .scale {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1em;
	}
	.side-by-side .scale + .scale {
		margin-left: 0;
		margin-bottom: 0;
	}
}

@media (max-width: 640px) {
	/* Drop to mobile layout */

 .header { margin-bottom:62px; }
 .header h1 { max-width:440px; text-align:center; height:42px; }
 .registrations {
  top:145px;
  height:38px;
		display:flex;
		align-items:center;
		justify-content:center;
		flex-wrap:wrap;
 }

 .main { padding:10px; }
	.announcement { margin:-10px -10px 20px; }
	.main .column { width: 100%; }

	.checklist { width: 100%; }

 #testimonials_bar .column {
  width:auto;
  display:block;
  margin-top:20px;
  clear:both;
 }
 #testimonials_bar .column:after {
  content:"";
  width:0;
  height:0;
  display:block;
  clear:both;
 }

	.locations .column,
	.footer .column {
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 300px;
		float: none;
	}

	.subpage .supporting-content ul { width: 100%; }

	.header ~ .nav li {
		padding-right: 15px;
	}

	.nav .optional { display: none; }

	.more-toggle:checked + .nav .optional { display: inline; }

	.more-toggle:checked + .nav li {
		display: block;
	}

	.class, .news {
		width: 100%;
		border: none;
	}
	.class { margin-bottom: 20px; }
 .single-class { padding:20px 10px; }
 .teacher_instruments span,
 .teacher_instruments:before { display:none; }

	select.row, input.row { margin-left: 0; margin-right: 0; }

	.class label {
		margin-left: 0;
		margin-top: 5px;
	}

	.footer .nav {
		background-image: none;
	}

	@keyframes minimize-menu {
		0% { height: 240px; }
		100% { height: 40px; }
	}
	@keyframes maximizemenu {
		0% { height: 40px; }
		100% { height: 240px; }
	}
	.header ~ .nav { animation: 1s minimize-menu forwards; }
	.more-toggle:checked + .nav { animation: 1s maximizemenu forwards; }
}

@media (max-width: 640px) {

}

@media print {
 .nav, .registrations, .footer, .no_print
 {
  display:none;
 }
 .container { padding-bottom:0; }
}