*, html {margin: 0; padding: 0;}
body, html {height: 100%;}
#outer {min-height: 100%;}
/* ============== */
/* = Typography = */
/* ============== */
body {font-size: 76%; font-family: 'Trebuchet MS', Verdana, Arial, Helvetica, Sans-Serif; line-height: 1.6em;}
h1 {}
/* Add margins to the text */
h2, h3, h4, p, ul, ol, dd, table, legend, caption {margin-bottom: 1em;}
h2, h3, h4 {color: #ba0000;}
h2 {font-size: 1.8em; height: 1em;}
h3 {font-size: 1.5em; font-weight: bold;}
h4, caption, legend, dt {font-size: 1em; font-weight: bold; color: #ba0000;}
p, li, dt, dd, td, th {font-size: 1em;}
li p, dd p {font-size: 1em; margin-bottom: 0;}
ul, dd, dd p, dt {margin-bottom: 1em;}
h2 {font-size: 1.8em; height: 1.2em;}
h3 {font-size: 1.5em;}
h4, caption, legend, dt {font-size: 1em; font-weight: bold; color: #ba0000;}
p, li, dt, dd, td, th {font-size: 1em;}
li p, dd p {font-size: 1em; margin-bottom: 0;}
ul, dd, dd p, dt {margin-bottom: 1em;}
a:link {color: #ba0000; text-decoration: none;}
a:visited {color: #ba0000; text-decoration: none;}
a:hover {color: #f97e14;}
a:active {color: #ba0000;}
table {width: 100%;}
caption {text-align: center;}
strong, th {font-weight: bold;}
th {text-align: center; border-bottom: 1px solid #BFAD83;}
em {font-style: oblique;}
strong, th {font-weight: bold;}
em {font-style: oblique;}
.imgLeft {float: left; margin: 0 1em 1em 0;}
.imgRight {float: right; margin: 0 0 1em 1em;}

#content ul {list-style: disc;}
#content ol {list-style: lower-roman;}
	#content li {margin-left: 20px; padding-left: 0px;}
#content img.single-column-image {float: right; margin: 0 0 1em 1em;}
#content ul.instructions, #content ul.information {list-style: none;}
	#content ul.instructions li {list-style: none; margin-bottom: 1em; margin-left: 0; padding-left: 0;}
	#content ul.information li {margin-left: 0; padding-left: 0;}
#content ul.instructions, #content ul.information {list-style: none;}
	#content ul.instructions li {list-style: none; margin-bottom: 1em; margin-left: 0; padding-left: 0;}
	#content ul.information li {margin-left: 0; padding-left: 0;}
/* ================== */
/* = Fancy FAQ list = */
/* ================== */
dl.faq {}
	dl.faq dt {display: block; width: 240px; margin-right: 20px; float: left; clear: left;}
	dl.faq dd {display: block; float: left; width: 490px;}
#footer p {text-align: right; color: #FCBF8A; margin-bottom: 0; vertical-align: center;}

/* ===================== */
/* = Class Descriptiom = */
/* ===================== */
dl.class-list {margin-bottom: 1em; overflow: hidden; font-size: 1.2em;}
dl.class-list * {margin: 0;}
	dl.class-list dt {width: 100px; float: left; clear: left;}
	dl.class-list dd {width: 130px; float: left;}
/* ========= */
/* = Forms = */
/* ========= */
form label {display: block; float: left; clear:left; width: 10em}

/* ========== */
/* = Layout = */
/* ========== */
/*body {background: url(../img/background.png) top left repeat #ba0000;}*/
#outer {background: url(../img/background.png) top left repeat #ba0000; width: 100%; position: relative; padding: 20px 0;}
#wrapper {width: 800px; margin: 0px auto; border: 2px solid #fff; background: #e9dec3;}
#head {background: url(../img/header.png) top left no-repeat #f97e14; float: left; border-bottom: 2px solid #fff; width: 100%;}
	h1#logo {display: inline; text-indent: -9999px;}
		h1#logo a {display: block; height: 140px; width: 145px; margin-left: 10px; float: left;}
#banner {border-bottom: 2px solid #fff; padding: 0; height: 165px; clear: left;	}
#content {margin: 20px 20px 10px 20px; overflow: hidden;}

#footer {background: url(../img/footer.gif) top left no-repeat #F97E14; height: 55px; text-align: right; padding: 0.5em 1em;border-top: 2px solid #fff;}
	#footer a {color:  #fff; text-decoration:  none;}
		/*One Column */
		body#one #content .column {}

		/* The columns */
		body#two #content .column {width: 490px; float: left;}
		body#two #content .column-sub {width: 240px; float: left; margin-right: 10px;}
		
			/* The columns - for a clas */
			body#two-class .column {width: 490px; float: left; margin-right: 10px;}
			body#two-class .column-sub {width: 240px; float: left; }

		/* Three columns */
		body#three #content .column {width: 240px; float: left; margin-right: 20px;}
		body#three #content .column {width: 240px; float: left; margin-right: 20px;}
		body#three #content div.last {margin-right: 0px;}
/* ============== */
/* = Navigation = */
/* ============== */
.nav, .nav * {margin:0;padding:0;list-style:none;}
.nav {line-height:1.0; margin-left: 250px; margin-top: 100px; }
.nav ul {position:absolute;top:-999em;width:9.45em;}
.nav ul li, .nav a {width: 100%;}
.nav li {float:left;position:relative;z-index:99;}
.nav li:hover ul, ul.nav li.sfHover ul {left:-1px;top:20px;}
.nav li:hover li ul, .nav li.sfHover li ul {top:-999em;}
.nav li li:hover ul, ul.nav li li.sfHover ul {left:9.45em;top:-1px;}
.superfish li:hover ul, .superfish li li:hover ul {top: -999em;}
.nav {margin-bottom:1.5em;}
.nav li {font-size: 1em; margin-right: 10px;}
.nav a {color: #fff;padding: 5px;text-decoration:none; text-transform: uppercase; padding-top: 30px;}
.nav a:visited {color: #fff;}
.nav a:hover{color: #000; background: url(../img/smalllogo.png) center top no-repeat;}

.nav ul {width: 147px;  background: url(../img/menu-back.png) top left repeat transparent;}

.nav li ul li {font-size: 0.9em;}
.nav ul {width: 147px;  background: url(../img/menu-back.png) top left repeat transparent;} 
.nav li ul li {font-size: 0.9em;}
.nav li li li {}
.nav li ul li a {background: none; padding: 5px; line-height: 2em; text-transform: none; z-index: 1;}
.nav li ul li a {background: none; padding: 5px; line-height: 2em; text-transform: none; z-index: 1;}
	.nav li ul li a:hover {background: none;}

/*Timetable*/
table#timetable {border: 1px solid #333; border-bottom: none;}
	table#timetable th {border-bottom: 1px solid #000; background: #9C0000; color: #fff;}
	table#timetable td {padding: 0.2em 1em; border-bottom: 1px solid #333; border-left: 1px solid #333; text-align: center; background: #FFCF9C;}
		table#timetable td.first {border-left: none;A}
	table#timetable tr {border-left: 1px solid #333;}
	.class-is-cancelled {background: #FC7254;}
	.class-name-timetable {color: #9c0000;}

/* Booking Form */
form#BookingForm {}
form#BookingForm li {list-style: none; margin-left: 0; padding-left: 0; margin-bottom: 1em; overflow: hidden;}
	form#BookingForm label {width: 7em; font-weight: bold; margin-right: 1em;}
form#BookingForm input, form#BookingForm select {width: 28em; padding: 2px 5px; font-weight: bold;}
form#BookingForm select {width: 29em; padding-right: 0;}
form#BookingForm option {}
span.required {color: #f00;}

form#SmallBookingForm {}
#content form li, #content form ul {list-style: none; margin-left: 0; padding-left: 0; margin-bottom: 1em; overflow: hidden;}
	form#SmallBookingForm label {font-weight: bold; margin-right: 1em; display: block; float: none; width: auto;}
form#SmallBookingForm input, form#BookingForm select {padding: 2px 5px; font-weight: bold;}
form#SmallBookingForm select {padding-right: 0;}
form#SmallBookingForm option {}

input#classDetails {width: 100%;}

#content form ol {list-style: none; margin: 0; padding: 0}
	#content form ol li {list-style: none; margin: 0; padding: 0; margin-bottom: 1em; overflow: hidden}
		#content form ul li label {display: block; float:left; width: 10em;}
	#content form ol li.submit {padding-left: 10em;}
	#content form ol li.textarea textarea  {height: 100px}

div.book-now {overflow: hidden; line-height: 1;}
div.book-now form {float: left; margin: 0; margin-right: 5px;}

/*Gallery*/
#content ul.thumbs {list-style: none; overflow: hidden;}
	#content ul.thumbs li {margin: 0; margin-left: 0; padding-left: 0; margin-right: 16px;float: left; display: inline; margin-bottom: 1em;}
		#content ul.thumbs li a {display: table-cell; width: 110px; height: 110px; background: #CFBC8E; vertical-align: middle; overflow: hidden;}
			#content ul.thumbs li a:hover {background: #AF9862;}
			#content ul.thumbs li a img{display: block; margin: auto;}