@charset "UTF-8";
/* CSS Document */

@media screen and (max-width: 1279px) {

nav {
  width: 924px;
  height: 50px;
}	
nav ul li a, nav ul li span {
  padding: 31px 20px 0px;
}	
#contentpage {
  width: 100%;
  min-width: 1024px;
  padding-top: 110px;
}
#vidintro {
  margin: 25px auto;
  height: 480px;
  width: 974px;
}	
#introholder {
  width: 460px;
  padding: 80px 0px;
}
#introholder h1 {
  display: block;
  width: 250px;
  height: 105px;
  text-indent: -32000px;
  background: top left no-repeat url("../images/majestic-intro-logo.png");
  background-size: cover;
}
#introholder h2 {
  font-size: 20px;
}
#introholder h2:before {
  width: 460px;
  height: 50px;
  background-size: 350px auto;
}
#scrolldown {
  height: 70px;
  background-size: 460px auto;
}
#classesholder {
  margin: 25px auto 0px;
  width: 924px;
}
#classesholder h3 {
  font-size: 32px;
}
#classesholder h3:after {
  width: 924px;
  margin: 0px auto 20px;
  height: 50px;
  background-size: 924px auto;
}
#classescolumns {
  width: 964px;
}
.classcolumn {
  width: 201px;
  padding-bottom: 65px;
}
.classcolumn h4 {
  font-size: 26px;
  margin-top: 220px;
}
.classcolumn h4:after {
  width: 201px;
  margin: 0px auto;
  height: 30px;
  background-size: 140px auto;
}
.classcolumn p, a p {
  font-size: 14px;
}
#footlinks, #signoff {
  width: 924px;
}	
#footlinks h2:after {
  width: 924px;
  height: 120px;
  background: center left no-repeat url("../images/fullwidth-gold-underline.png");
  background-size: 924px auto;
}
.sectioncontent {
	width: 880px;
	margin: 0px auto;
	position: relative;
}
#sectionimage {
width: 450px;
	top: 110px;
}
#sectioncolumn h2 {
  font-size: 36px;
}
#teachersholder {
	width: 600px;
}
#teachersholder h3:after {
  width: 600px;
  height: 50px;
  background-size: 600px auto;
}
#teacherscolumns {
  width: 640px;
}
.teachercolumn {
  width: 290px;
}
.teachercolumn h4 {
  font-size: 21px;
}
.teachercolumn h4:after {
  width: 290px;
  height: 35px;
  background-size: 130px auto;
}
.teachercolumn p, a p {
  font-size: 16px;
}
}

@media screen and (max-width: 1023px) {
header {
  padding: 30px 25px;
}
nav {
  width: 686px;
}	
nav ul li a, nav ul li span, .scrolled nav ul li a, .scrolled nav ul li span  {
  padding: 31px 8px 0px;
  font-size: 13px;
}	
#contentpage {
  min-width: 736px;
  padding-top: 80px;
}	
.scrolled {
  padding: 10px 25px;
}
#vidintro {
  height: 480px;
  width: 736px;
}	
#introholder {
  width: 360px;
  padding: 50px 0px;
}
#scrolldown {
  height: 55px;
  background-size: 360px auto;
}	
#classesholder {
  width: 686px;
}
#classesholder h3:after {
  width: 686px;
  background-size: 686px auto;
  margin: 0px auto 5px;
  height: 40px;
}
#classescolumns {
  width: 706px;
	margin-left: -10px;
}
.classcolumn {
  width: 214px;
  margin: 0px 10px 60px 10px;
}	
.nexteventholder h3, .nextcourseholder h3 {
  width: 440px;
  padding-top: 45px;
}
.nexteventholder h3:after, .nextcourseholder h3:after {
  width: 440px;
  height: 35px;
  background-size: 440px auto;
}
.nextevent {
  width: 440px;
}
.nexteventleft, .nexteventright {
  width: 440px;
  margin-bottom: 45px;
}
.nexteventleft, .nexteventright {
  float: none;
}
.nexteventimage {
	margin-bottom: 40px;
}
.rightbutton {
  left: 0px;
	right: auto;
}	
#signupholder {
  background-size: 300px auto;
}
#signup {
  width: 440px;
}
.px300 {
  width: 440px;
}
.px340 {
  width: 280px;
	margin-left: -10px;
}
.px180 {
  width: 140px;
	margin-right: -10px;
}
.signupcolumn h4:after {
  width: 440px;
}
.signupcolumn .linkbutton {
  width: 140px;
}
#emailfield {
  position: static;
}
label {
  margin-top: 15px;
}
input {
  width: 280px;
}
#footlinks h2 {
  width: 50px;
  height: 50px;
  background-size: 50px 50px;
}
#footlinks h2:after {
  width: 686px;
  background-size: 686px auto;
}
#footlinks {
	width: 686px;
  padding-top: 30px;
}
.footcolumn {
  margin-right: 30px;
  font-size: 12px;
}
#signoff {
  width: 686px;
	font-size: 10px;
}
.sectioncontent {
	width: 560px;
}
#sectionimage {
width: 315px;
	top: 100px;
}
#sectioncolumn {
	width: 320px;
}
#sectioncolumn h2 {
  font-size: 32px;
}
#sectioncolumn h2:after {
  width: 315px;
  height: 60px;
  background-size: 315px auto;
}
#sectioncolumn h3 {
  font-size: 21px;
}
#sectioncolumn p, #sectioncolumn ul {
  font-size: 14px;
}
.pxtop40 {
	margin-top: 40px;
}
}

@media screen and (max-width: 735px) {
header {
  padding: 10px 10px;
}
nav {
  width: 250px;
  height: 40px;
}
nav ul, .scrolled nav ul {
	position: absolute;
	top: 60px;
	right: 0px;
	left: 0px;
  width: 100%;
  text-align: right;
  background: rgb(222, 201, 150);
  background: linear-gradient(135deg, rgba(222, 201, 150, 1) 50%, rgba(195, 157, 69, 1) 100%);
  display: none;
}
nav ul li, .scrolled nav ul li {
	width: 250px;
	margin: 0px 35px 0px auto;
  display: block;
  font-size: 12px;
}
nav ul li a, nav ul li span, .scrolled nav ul li a, .scrolled nav ul li span {
  display: block;
  padding: 10px 0px;
  color: #FFFFFF;
}
nav ul li a:hover, nav ul li span, .scrolled nav ul li a:hover, .scrolled nav ul li span {
  color: #581866;
}
#mobilemenubutton {
  display: inline-block;
  position: absolute;
  right: 35px;
  top: 10px;
  width: 40px;
  height: 40px;
  cursor: pointer;
  text-indent: -32000px;
  background: center center no-repeat url("../images/menu-button.png");
	background-size: 20px 20px;
	}
	
/* SCROLLED NAVIGATION */

.scrolled {
  padding: 10px 10px;
}
.scrolled nav {
  height: 40px;
}
	
#contentpage {
  min-width: 320px;
  padding-top: 40px;
}
#vidintro {
  margin: 10px auto;
  height: auto;
  width: 100%;
	min-width: 320px;
  background: center center no-repeat #240330;
}
video {
  display: none;
}
#introholder {
  position: static;
  width: 250px;
  margin: 30px auto;
  padding: 10px 0px;
}
#introholder h1 {
  width: 200px;
  height: 83px;
}
#introholder h2 {
  font-size: 16px;
}
#introholder h2:before {
  width: 250px;
  height: 50px;
  background-size: 250px auto;
}
#scrolldown {
  display: none;
}
#classesholder {
  margin: 20px auto 0px;
  width: 250px;
}
#classesholder h3 {
  font-size: 28px;
}
#classesholder h3:after {
  width: 250px;
  height: 40px;
  background-size: 250px auto;
}
#classescolumns {
  width: 250px;
  margin-left: 0px;
}
.classcolumn {
  width: 250px;
}
.classcolumn h4 {
  font-size: 24px;
  margin-top: 270px;
}
.classcolumn h4:after {
  width: 250px;
  height: 30px;
  background-size: 100px auto;
}
.classcolumn p, a p {
  font-size: 14px;
}	
.nexteventholder h3, .nextcourseholder h3 {
  width: 250px;
  font-size: 28px;
  padding-top: 70px;
}
.nexteventholder h3:after, .nextcourseholder h3:after {
  width: 250px;
  margin: 0px auto;
  height: 50px;
  background-size: 250px auto;
}
.nextevent {
  width: 250px;
}
.nexteventleft, .nexteventright {
  width: 250px;
  margin-bottom: 30px;
}
.nexteventleft, .nexteventright {
  float: none;
}
.nexteventimage {
	width: 250px;
	height: 250px;
	background-size: 250px auto!important;
}
.nextevent h4 {
  font-size: 18px;
  margin-bottom: 5px;
}
.nextevent h5 {
  font-size: 24px;
  margin-bottom: 5px;
}
.nextevent h6 {
  font-size: 21px;
  margin-bottom: 5px;
}
.nextevent p {
  font-size: 18px;
  margin-bottom: 5px;
}
.nextevent p.smalltext {
  font-size: 14px;
}
footer {
  padding-bottom: 100px;
	background-size: 40px auto, contain;
}
#signupholder {
  background-size: 250px auto;
}
#signup {
  display: block;
  flex-flow: none;
  justify-content: none;
  width: 250px;
  padding: 25px 0px;
}
.signupcolumn, .px300, .px340, .px180 {
  width: 250px;
  position: static;
  display: block;
  float: none;
}
.px340 {
  margin-left: 0px;
}
.signupcolumn h4 {
  font-size: 26px;
}
.signupcolumn h4:after {
  width: 250px;
  background-size: 250px auto;
}
.signupcolumn p {
  font-size: 16px;
}
.signupcolumn .linkbutton {
  position: static;
	width: 250px;
}
#emailfield {
	display: block;
  position: static;
	margin-bottom: 15px;
}
label {
  font-size: 14px;
}
input {
  width: 250px;
  font-size: 14px;
}	
#footlinks h2:after {
  width: 250px;
  height: 80px;
  background-size: 250px auto;
}
#footlinks {
  width: 250px;
}
.footcolumn {
  float: none;
  margin-right: 0px;
  font-size: 12px;
	width: 250px;
}
.footcolumn:last-of-type {
  float: none;
  text-align: left;
  margin-top: 20px;
}
.footcolumn p strong {
  font-weight: 300;
}
#signoff {
  width: 250px;
  padding: 20px 0px;
	font-size: 11px;
}
.signoffright {
	float: right;
}
#signoff a {
	color: #DEC996;
	font-weight: 300;
}
#signoff a:hover {
	color: #FFFFFF;
}
.sectioncontent {
	width: 280px;
	margin: 0px auto;
	position: relative;
}
.topsection, .nexteventholder, .goldsection {
	background-size: 44px auto, contain;
}
#sectionimage {
display: none;
}
#sectioncolumn, .sectioncentred, .sectioncentred p {
	width: 280px!important;
}
#sectioncolumn.initial {
	margin-left: -150px;
}
#sectioncolumn h2 {
  font-size: 26px;
}
#sectioncolumn h2:after {
  width: 280px;
  height: 50px;
  background-size: 280px auto;
}
#sectioncolumn h3 {
  font-size: 24px;
  font-weight: 300;
	margin-bottom: 10px;
}
#sectioncolumn p {
  font-size: 16px;
  font-weight: 300;
	margin-bottom: 10px;
}
.pxtop40 {
	margin-top: 40px;
}
.slider-button {
  display: none;
}
.question, .answer {
	width: 280px;
	margin: 0px;
}
.question:before {
  width: 280px;
  height: 30px;
  background-size: 140px auto;
}
.initialquestion {
	margin-left: -100px;
}
.initialanswer {
	margin-left: 100px;
}	
#contactform {
	width: 280px;
}
.error {
	font-size: 14px;
}
#contactform fieldset:hover {
	border: 1px solid #FFFFFF;
}
#contactform label {
	font-size: 14px;
}
#contactform input, textarea {
	font-size: 14px;
	width: 248px;
}
#contactform textarea {
	width: 248px;
	min-width: 248px;
	max-width: 248px;
}
#contactform select {
	font-size: 14px;
}
#contactform #captcha-image {
	float: left;
	width: 180px;
	height: auto;
}
#teachersholder, #locationsholder {
	width: 250px;
}
#teacherscolumns, #mapwrap {
  width: 250px;
  margin-left: 0px;
}
.teachercolumn {
  width: 250px;
}
.teachercolumn img {
	width: 250px;
	height: auto;
}
.teachercolumn h4 {
  font-size: 24px;
}
.teachercolumn h4:after {
  width: 250px;
  height: 30px;
  background-size: 100px auto;
}
.teachercolumn p, a p {
  font-size: 14px;
}
#locationsholder h3, #teachersholder h3 {
  width: 250px;
  font-size: 28px;
	padding-top: 40px;
}
#locationsholder h3:after, #teachersholder h3:after {
  width: 250px;
  background-size: 250px auto;
}	
	iframe {
		width: 250px;
		height: 320px;
	}


#locationsholder h4:after {
  content: "";
  display: block;
  width: 250px;
  margin: 0px auto;
  height: 40px;
  background: center left no-repeat url("../images/small-purple-underline.png");
  background-size: 160px auto;
}
#locationsholder p {
  font-size: 16px;
  font-weight: 300;
  margin: 10px 0px 20px 0px;
  color: #000000;
}	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
}