/*
html5doctor.com Reset Stylesheet
v1.4.1
2010-03-01
Author: Richard Clark - http://richclarkdesign.com
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary {
	display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted #000;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}
.clear {
    clear:both
}
/* --- MAC styles --- */
html {
    font-family:Calibri, Geneva, Helvetica, Arial, sans-serif;
    font-size:14px
}
#mac-logo-circle {
    width:278px;
    height:282px;
    position:absolute;
    top:-170px;
    left:-36px;
    z-index:100;
    background:url("../elements/images/mac-logo-circle.png") center no-repeat;
}
header#header-main {
    height:125px;
    padding-top:5px;
    width:100%;
    background-color:#fff;
    position:relative;
    z-index:90
}
/*header#header-main #social {
    position:absolute;
    right:20px;
    bottom:8px
}
header#header-main #social ul {
    margin:0;
    padding:0
}
header#header-main #social ul li {
    float:left;
    clear:none;
    display:inline;
    margin:0 6px;
}*/
/*header#header-main #social ul li a#twitter {
    width:40px;
    height:39px;
    background:#fff url("../elements/images/twitter.png") center no-repeat;
    display:block
}
header#header-main #social ul li a#facebook {
    width:40px;
    height:39px;
    background:#fff url("../elements/images/facebook.png") center no-repeat;
    display:block
}*/
/*#header-twitter {
    clear:both;
    float:right;
    width:400px;
    height:116px;
    margin:4px 410px 0 auto;
    background:#fff url("../elements/images/twitter-head-back.png") center no-repeat;
}
#header-twitter p {
    font-size:20px;
    font-family:Calibri, Geneva, Helvetica, Arial, sans-serif;
    font-style:italic;
    margin:30px 20px 20px 40px
}*/
nav, section#bottom {
    height:40px;
    width:100%;
    background-color:#b51223;
    border-top:7px solid #0e0e0e;
    border-bottom:7px solid #0e0e0e;
    color:#fff
}
nav ul {
    /*width:900px;*/
    float:right;
    margin:0 10px 0 0
}
nav ul li {
    list-style-type:none;
    clear:none;
    float:left;
    margin:9px 0 0 16px
}
nav ul li a {
    text-transform:uppercase;
    font-size:19px;
    color:#fff;
    font-family:Helvetica, Arial, sans-serif;
    font-weight:600;
    text-decoration:none;
    padding:0 6px
}
nav ul li a:hover {
    color:#fdefd5
}
.dropdown {
    height:auto;
    padding-bottom:8px;
    position:absolute;
    z-index:102;
    background-color:#b51223;
    border-left:7px solid #0e0e0e;
    border-bottom:7px solid #0e0e0e;
    display:none;
    -moz-box-shadow: 3px 3px 4px #868686;
    -webkit-box-shadow: 3px 3px 4px #868686;
    box-shadow: 3px 3px 4px #868686;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#989898')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#868686');
}
.dropdown ul {
    display:block;
    height:100%;
    margin:8px 8px 8px 18px;
    list-style-type:none
}
.dropdown ul li {
    clear:both;
    float:left;
    margin:3px 0;
    color:#fff;
    font-size:14px
}
.dropdown ul li a {
    text-decoration:none;
    color:#fff
}
.dropdown ul li a:hover {
    color:#fdefd5;
}
#historylist {
    width:155px;
    right:0;
    bottom:-210px;
    z-index:200;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=135, Color='#989898')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=0, Direction=135, Color='#868686');
}
#programlist {
    width:194px;
    right:373px;
    bottom:-310px;
    border-right:7px solid #0e0e0e;
}
#scenariolist {
    width:180px;
    right:153px;
    bottom:-130px;
    border-right:7px solid #0e0e0e;
    -moz-box-shadow: 3px 3px 4px #7d0916;
    -webkit-box-shadow: 3px 3px 4px #7d0916;
    box-shadow: 3px 3px 4px #7d0916;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#7d0916')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#7d0916');
}
#instructorlist {
    width:155px;
    right:246px;
    bottom:-130px;
    border-right:7px solid #0e0e0e;
}
#aboutlist {
    width:155px;
    right:507px;
    bottom:-190px;
    border-right:7px solid #0e0e0e;
}
#frame {
    width:100%;
    padding:0;
    margin:0;
    height:auto;
    background-color: #af1b27; /* fallback color */
    /*background-image: url(images/linear_bg_2.png); /* fallback image */
    background-image: -moz-linear-gradient(100% 100% 90deg, #af1b27, #7d0916);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7d0916), to(#af1b27));
    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7d0916', endColorstr='#af1b27'); /* IE6 & IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7d0916', endColorstr='#af1b27')"; /* IE8 */
}
section#content {
    background-color:#fff;
    color:#3e3c54;
    background-image: -moz-linear-gradient(100% 1% 90deg, #fff, #b0b0b0);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 1%, from(#b0b0b0), to(#fff));
    width:900px;
    height:auto;
    padding:10px 0;
    margin:0 auto;
    position:relative;
    border-left:5px solid #2b2b2b;
    border-right:5px solid #2b2b2b
}
section#content a {
    color:#890d1a;
    font-weight:800;
    text-decoration:none
}


#phone-halesowen, #phone-dudley {
    color:#b51223;
    font-size:22px;
    text-transform:uppercase;
    float:right;
    font-weight:800
}
#phone-halesowen a, #phone-dudley a {
    color:#b51223;
    text-decoration:none
}
#phone-halesowen a:hover, #phone-dudley a:hover {
    color:#3e3c54;
}
#phone-halesowen {
    position:absolute;
    top:12px;
    right:20px;
    z-index:101
}
#phone-dudley {
    position:absolute;
    top:34px;
    right:20px;
    z-index:101
}
#facebook-like {
    position:absolute;
    bottom:20px;
    right:20px;
    z-index:101
}
#top-facebook {
    position:absolute;
    bottom:20px;
    right:337px;
    z-index:101;
    width:27px;
    height:28px
}
#top-twitter {
    position:absolute;
    bottom:20px;
    right:377px;
    z-index:101;
    width:27px;
    height:28px
}
h1 {
    clear:both;
    float:left;
    font-family:Helvetica, Arial, sans-serif;
    font-size:30px;
    text-transform:uppercase;
}
h2 {
    clear:both;
    float:left;
    font-family:Helvetica, Arial, sans-serif;
    font-size:20px;
    text-transform:uppercase;
}
h3, h4 {
    clear:both;
    float:left;
    margin:8px 0 8px 27px;
    font-family:Helvetica, Arial, sans-serif;
    font-size:18px;
    text-transform:uppercase;
}
h4 {
    color:#bf161f;
    margin-left:0
}
.homeright {
    float:right;
    margin-right:20px
}
section#content article#main {
    clear:both;
    height:auto;
}
section#content article#main h1 {
    /*position:absolute;
    top:24px;
    left:27px;*/
    clear:both;
    float:left;
    margin:12px 0 0 27px
}
section#content article#attractions h1 {
    /*position:absolute;
    top:24px;
    left:27px;*/
    clear:both;
    float:left;
    margin:0 0 0 27px
}
section#content .text-main {
    width:365px;
    min-height:288px;
    height:auto;
    position:absolute;
    top:150px;
    left:30px;
    display:inline;
    font-size:16px;
}
section#content #pagecontentmain {
    width:365px;
    min-height:288px;
    height:auto;
    position:absolute;
    top:150px;
    left:30px;
    display:inline;
    font-size:16px;
}
section#content .text-main.home {
    width:340px;
    text-align:justify
}
section#content .text-secondary-wide {
    width:830px;
    /*min-height:288px;*/
    height:auto;
    clear:both;
    float:left;
    margin:9px 0 0 30px;
    font-size:16px;
    /*position:absolute;
    top:63px;
    left:30px;
    display:inline*/
}
section#content p {
    font-size:16px;
    line-height:18px
}
section#content h2.heading {
    position:absolute;
    top:120px;
    left:27px;
}
/*--- featured box ---*/
section#content figure#featured {
    width:460px;
    height:350px;
    /*padding:7px;*/
    float:right;
    margin:10px 13px 10px 0;
    position:relative;
    /*border:1px solid #a9a9a9;*/
    overflow:hidden;
    border-bottom:1px solid #a9a9a9;
}
#featured ul {
    list-style-type:none
}
#featured ul.ui-tabs-nav {
    position:absolute;
    bottom:0;
    left:0;
    list-style:none;
    padding:0;
    margin:0;
    width:500px;
    display:none
}
#featured ul.ui-tabs-nav li {
    width:125px;
    padding:1px 0;
    font-size:12px;
    background-color:#b51223;
    color:#fff;
    clear:none;
    float:left;
    display:inline
}
#featured ul.ui-tabs-nav li span {
    font-size:12px;
    line-height:18px;
}
#featured .ui-tabs-panel {
	width:460px;
    height:350px;
	position:relative;
    overflow:hidden;
    z-index:50
}
#featured .ui-tabs-hide {
	display:none;
}
#featured li.ui-tabs-nav-item a {/*On Hover Style*/
	display:block;
	height:60px;
	color:#fff;
    background:#b51223;
    /*opacity:0.5;
    -moz-opacity:0.5;
    filter: alpha(opacity=50);*/
	line-height:20px;
	outline:none;
    text-decoration:none;
}
#featured li.ui-tabs-nav-item a:hover {
    background:#0e0e0e;
	color:#fdefd5;
}
#featured li.ui-tabs-selected{ /*Selected tab style*/
	background:url('images/selected-item.gif') top left no-repeat;
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a {
	background:#000;
}
#featured ul.ui-tabs-nav li img {
	float:left; margin:2px 5px;
	background:#fff;
	padding:2px;
	border:1px solid #eee;
}
#featured .ui-tabs-panel .info {
	position:absolute;
	bottom:0;
    left:0;
	height:100px;
    width: 460px;
	background-color:#0e0e0e;
    opacity:0.9;
    -moz-opacity:0.9;
    filter: alpha(opacity=90);
    z-index:100
}
#featured .info h2 {
	/*font-size:18px; font-family:Georgia, serif;
	color:#fff; padding:5px; margin:0;
	overflow:hidden;*/
    color:#ffffff;
    margin:8px 0 3px 7px
}
#featured .info p {
    clear:both;
    float:left;
	margin:0px 10px 10px 10px;
	font-size:12px;
	line-height:15px;
    color:#ffffff;
}
#featured .info a {
	text-decoration:none;
	color:#ffffff;
}
#featured .info a:hover {
	color:#fdefd5
}
.ui-tabs .ui-tabs-hide {
     display: none;
}
/*--- end featured box ---*/
section#content article#attractions {
    position:relative;
    clear:both;
    float:left;
    width:857px;
    /*min-height:306px;*/
    height:auto;
    margin-top:16px
}
footer {
    width:100%;
    min-height:260px;
    height:100%;
    padding-bottom:40px;
    background-color: #af1b27; /* fallback color */
    /*background-image: url(images/linear_bg_2.png); /* fallback image */
    background-image: -moz-linear-gradient(100% 100% 90deg, #af1b27, #7d0916);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7d0916), to(#af1b27));
    filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7d0916', endColorstr='#af1b27'); /* IE6 & IE7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#7d0916', endColorstr='#af1b27')"; /* IE8 */
}
section#bottom {
    background-color:#efefef;
    color:#3e3c54;
    background-image: -moz-linear-gradient(100% 20% 90deg, #efefef, #606060);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 20%, from(#606060), to(#efefef));
    /*filter:  progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#606060', endColorstr='#dbd9da'); IE6 & IE7 
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#606060', endColorstr='#dbd9da')"; IE8 */
}
#bottom-copyright {
    color:#b51223;
    font-size:18px;
    text-transform:uppercase;
    float:left;
    margin:0 0 0 20px;
    font-weight:800;
    display:inline;
    width:auto;
    height:28px;
    text-align:center;
    line-height:28px
}
#bottom-copyright p {
    clear:left;
    margin:12px 0 0 0;
    clear:left;
    display:inline;
    text-align:center;
    position:relative;
    top:6px
}
a.bottom-social {
    clear:none;
    float:left;
    display:inline;
    margin:9px 6px 0 6px
}
#bottom-copyright:hover {
    color:#0e0e0e;
    cursor:pointer
}
#bottom-pagetag {
    /*color:#b51223;
    font-size:18px;
    text-transform:uppercase;*/
    float:right;
    margin:14px 20px 0 0;
    /*font-weight:800*/
}
#bottom-sitelinks {
    width:900px;
    height:auto;;
    display:block;
    padding:10px 0;
    margin:0 auto;
    position:relative
}
#bottom-sitelinks ul {
    color:#daafaf;
    list-style-type:none
}
#bottom-sitelinks ul li {
    font-size:14px;
    clear:both;
    float:left;
    margin:2px 0
}
#bottom-sitelinks ul li a {
    color:#daafaf;
    text-decoration:none
}
#bottom-sitelinks ul li a:hover {
    color:#fff
}
#bottom-sitelinks h2 {
    font-size:24px
}
#bottom-address-halesowen, #bottom-sitemap {
    position:absolute;
    top:26px;
    left:12px
}
#bottom-address-dudley, #bottom-arts {
    position:absolute;
    top:26px;
    left:370px
}
#bottom-address-friends, #bottom-history {
    position:absolute;
    top:26px;
    right:12px
}
#bottom-sitemap, #bottom-arts, #bottom-history {
    display:none
}
/*--- homepage ---*/
/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
    width:830px;
    height:169px;
}
/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}
.items div {
	float:left;
	width:830px;
}

/* single scrollable item */
.scrollable img {
	float:left;
	/*margin:20px 5px 20px 21px;
	background-color:#fff;
	padding:2px;
	border:1px solid #ccc;
	width:100px;
	height:75px;*/

	/*-moz-border-radius:4px;
	-webkit-border-radius:4px;*/
}

/* active item */
.scrollable .active {
	/*border:2px solid #000;
	position:relative;
	cursor:default;*/
}
#home-arts-scrollable {
    clear:both;
    float:left;
    width:810px;
    height:169px;
    /*background-color:yellow;*/
    margin:12px 0 36px 36px;
    padding:0 0 0 20px;
	display: block;
	clear: both;
	position: relative;
}
.left-arrow {
	background: url('../elements/images/left-arrow.png') 50% 0% no-repeat;
	width: 61px;
	height: 74px;
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
    z-index:100;
	top: 56px;
	left: -50px;
	outline: none;
}
.right-arrow {
	background: url('../elements/images/right-arrow.png') 50% 0% no-repeat;
	width: 47px;
	height: 60px;
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
    z-index:100;
	top: 56px;
	right: -36px;
	outline: none;
}
#home-arts-scrollable .scroller-block {
	/*background: url('../images/service-bg.png') 50% 0% no-repeat;*/
	width:249px;
    height:169px;
	margin: 0 6px 0 2px;
	/*padding: 23px 0 0 0;*/
	display: block;
	float: left;
}
#home-arts-scrollable .scroller-block .art-image {
	width: 249px;
	height: 169px;
	margin: 0 auto 0 10px;
	padding: 0;
	display: block;
	clear: both;
	overflow: hidden;
}
#home-arts-scrollable .scroller-block .art-name {
	width: 163px;
	height: 28px;
	margin: 0 auto 0 11px;
	padding: 4px 0 0 6px;
	display: block;
	clear: both;
	overflow: hidden;
	/*font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;*/
	color:#fff;
    text-align:center
}
#home-arts-scrollable .scroller-block .art-name a {
    color:#fff;
    padding:3px;
    height:12px;
    overflow:hidden;
    clear:both;
    float:left;
    margin-top:3px;
    text-decoration:none
}
#home-arts-scrollable .scroller-block .service-name a:hover {
    background-color:#b51223
}
/* --- art detail and info pages ---*/
#mac-footer-deep {
    clear:both;
    float:left;
    margin:18px 0 18px 20px
}
section#content .text-main.detail {
    width:516px;
    text-align:justify;
    font-family:Calibri,Geneva,Helvetica,Arial,sans-serif
}
section#content .text-info {
    width:516px;
    text-align:justify;
    /*min-height:500px;*/
    height:auto;
    clear:both;
    float:left;
    margin:100px 0 0 30px;
    display:inline
}
.text-info h3, .text-info p, .text-secondary-wide h3, .text-secondary-wide p {
    clear:both;
    float:left;
}
.text-info h3 {
    margin-left:0
}
.text-info ul, .text-info ol, .text-secondary-wide ul, #pagemaincontent ul, #pagemaincontent p ul, #pagefirstfold ul, body.mceContentBody ul {
    clear:both;
    float:left;
    margin:6px 10px;
    padding:6px 10px;
    font-size:16px;
    color:#b51223;
    list-style-type:square
}
.testimonial-block {
    clear:both;
    float:left;
    margin:6px 0;
    /*background: url('../elements/images/quote-open-grey.png') top left no-repeat;*/
}
.testimonial-block p {
    clear:both;
    float:left;
    margin: 0 6px;
    font-size:14px;
    line-height:20px;
    font-style:italic;
    text-align:left;
}
.testimonial-name {
    clear:both;
    float:left;
    display:block;
    width:80%;height:auto;
    color:#b51223;
    font-weight:bold;
    font-size:18px;
    margin:6px 3px
}
img.box-open {
    float:left;
    margin:-3px 6px 6px 0
}
img.box-right {
    clear:both;
    float:right;
    margin:-6px 0 0 0
}
#navigate {
	/*background: url('../images/navigate.jpg') 50% 0% no-repeat;*/
	width: 476px;
	height: 28px;
	margin: 0 auto;
	margin-top: 16px;
	padding: 9px 0 0 14px;
	display: block;
	clear: both;
	color: #b51223;
	font-size: 18px;
	text-decoration: none;
	position: relative;
}
#navigate a {
	margin: 0;
	padding: 2px;
	display: inline-block;
	color: #b51223;
    font-size: 20px;
	text-decoration: none;
	font-weight: bold;
}
#navigate a:hover, #navigate a.selected {
	background-color: #b51223;
    color:#fff;
}
#navigate .older {
	margin: 0;
	padding: 0;
	display: block;
	position: absolute;
	top: 9px;
	right: 14px;
	color: #b51223;
	font-size: 16px;
	text-decoration: none;
	font-weight: bold;
}
.imagestrip-block {
    clear:both;
    float:left;
    dispaly:block;
    width:100%;
    margin:6px 0;
    padding-bottom:6px;
    border-bottom:1px solid #a9a9a9
}
.detail-tabbed-menu {
    /*clear:both;
    float:left;*/
    /*margin:50px 0 16px 0;
    display:block*/
    position:absolute;
    top:88px;
    right:348px;
    padding-bottom:3px;
    border-bottom:2px solid #ac5136
    z-index:101
}
.detail-tabbed-menu ul li {
    clear:none;
    float:left;
    margin:0 2px;
    font-size:18px;
    list-style-type:none
}
.detail-tabbed-menu ul li a {
    background-color:#faeee0;
    padding:2px 2px 4px 2px;
    text-decoration:none;
    text-transform:uppercase;
    color:#b51223
}
.detail-tabbed-menu ul li a:hover {
    background-color:#b51223;
    color:#fff;
}
#detail-tabbed.extended {
    padding-top:90px
}
#detail-tabbed.extended .text-info h2.heading, #detail-tabbed.extended .detail-tabbed-menu {
    margin-top:40px
}
#detailbox, #detailstrip {
    width:300px;
    /*height:317px;*/
    min-height:225px;
    height:auto;
    padding:7px 0 9px 0;
    clear:both;
    float:right;
    margin:20px 22px 20px 10px;
    border-bottom:1px solid #a9a9a9;
}
#detailbox.inline {
    clear:none;
}
#detailstrip {
    clear:right;
    display:inline
}
/* --- contact page elements --- */
.map {
    clear:both;
    display:block;
    width:auto;
    height:auto;
    margin:4px 0
}
.form-inline {
    margin-left:20px
}
/* TipTip CSS - Version 1.2 */

#tiptip_holder {
	display: none;
	position: absolute;
	top: 0;
	left: -20px;
	z-index: 99999;
}

#tiptip_holder.tip_top {
	padding-bottom: 5px;
}

#tiptip_holder.tip_bottom {
	padding-top: 5px;
}

#tiptip_holder.tip_right {
	padding-left: 5px;
}

#tiptip_holder.tip_left {
	padding-right: 5px;
}

#tiptip_content {
	font-size: 12px;
	color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    text-transform:uppercase;
	text-shadow: 0 0 2px #000;
	padding: 4px 8px;
	border: 1px solid rgba(255,255,255,0.25);
	background-color: rgb(25,25,25);
	background-color: rgba(25,25,25,0.92);
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#000));
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	box-shadow: 0 0 3px #555;
	-webkit-box-shadow: 0 0 3px #555;
	-moz-box-shadow: 0 0 3px #555;
}

#tiptip_arrow, #tiptip_arrow_inner {
	position: absolute;
	border-color: transparent;
	border-style: solid;
	border-width: 6px;
	height: 0;
	width: 0;
}

#tiptip_holder.tip_top #tiptip_arrow {
	border-top-color: #fff;
	border-top-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_bottom #tiptip_arrow {
	border-bottom-color: #fff;
	border-bottom-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_right #tiptip_arrow {
	border-right-color: #fff;
	border-right-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_left #tiptip_arrow {
	border-left-color: #fff;
	border-left-color: rgba(255,255,255,0.35);
}

#tiptip_holder.tip_top #tiptip_arrow_inner {
	margin-top: -7px;
	margin-left: -6px;
	border-top-color: rgb(25,25,25);
	border-top-color: rgba(25,25,25,0.92);
}

#tiptip_holder.tip_bottom #tiptip_arrow_inner {
	margin-top: -5px;
	margin-left: -6px;
	border-bottom-color: rgb(25,25,25);
	border-bottom-color: rgba(25,25,25,0.92);
}

#tiptip_holder.tip_right #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -5px;
	border-right-color: rgb(25,25,25);
	border-right-color: rgba(25,25,25,0.92);
}

#tiptip_holder.tip_left #tiptip_arrow_inner {
	margin-top: -6px;
	margin-left: -7px;
	border-left-color: rgb(25,25,25);
	border-left-color: rgba(25,25,25,0.92);
}

/* Webkit Hacks  */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#tiptip_content {
		padding: 4px 8px 5px 8px;
		background-color: rgba(45,45,45,0.88);
	}
	#tiptip_holder.tip_bottom #tiptip_arrow_inner {
		border-bottom-color: rgba(45,45,45,0.88);
	}
	#tiptip_holder.tip_top #tiptip_arrow_inner {
		border-top-color: rgba(20,20,20,0.92);
	}
}
/* --- jscrollpane styles ---*/
.jScrollPaneContainer {
    clear:both;
    float:left;
    margin:0;
    height:600px;
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.jScrollPaneContainer .text-info {
    margin:0
}
.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #b51223;
}
.jScrollPaneDrag {
	position: absolute;
	background: #e9e9e9;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

/* --- 09-12-2010 --- */
a#getyourblackbeltfloater {
    width:200px;
    height:175px;
    background-image: url('../elements/images/get-your-blackbelt-small.png') center no-repeat;
    display:block;
    position:absolute;
    /*border:1px solid gray;*/
    top:67px;
    right:-89px;
    z-index:90
}
a#getyourblackbeltsmall:hover {
    background-image: url('../elements/images/get-your-blackbelt-small-active.png') center no-repeat;
}
.information-strip {
    width:100%;
    height:64px;
    position:relative;
    clear:both;
    float:left;
}
a#enquirenow {
    width:216px;
    height:64px;
    clear:both;
    float:left;
    display:block;
    background-image: url('../elements/images/enquire-now.png') center no-repeat;
}
a#enquirenow:hover {
    width:216px;
    height:64px;
    background-image: url('../elements/images/enquire-now-active.png') center no-repeat;
}
#header-main a#enquirenow {
    display:block;
    position:absolute;
    bottom:4px;
    right:20px;
    z-index:110
}
/*#content a#enquirenow {
    display:block;
    clear:both;
    float:left;
    display:inline;
    margin:16px 0
}*/
.information-strip a#enquirenow {
    position:absolute;
    left:0;
}
.information-strip a#informationlink {
    position:absolute;
    right:8px;
    top:5px
}
#artslist {
    clear:both;
    float:left;
    margin:16px 0 16px 0;
}
ul#arts-list {
    display:block;
    clear:both;
    float:left;
    margin:0 0 16px 26px;
    padding:0 0 16px 26px;
    list-style-type:none;
    font-size:15px;
    text-transform:uppercase
}
ul#arts-list li a {
    margin:1px;
    padding:1px;
    clear:both;
    float:left
}
ul#arts-list li a:hover {
    color:#2b2b2b;
    background-color:#f4f4ce
}
.heading.alert {
    color:#a11622;
    margin-top:8px
}
#detailbox a#enquirenow {
    clear:both;
    float:left;
    margin:16px 0 16px 40px
}
/* --- 16-12-2010 --- */
#pagemaincontent {
    height:auto;
    position:relative
    }
#pagemaincontent h3, #pagemaincontent p {
    clear:both;
    float:left;
    margin:6px 0
    }
#page-base {
    clear:both;
    float:left;
    height:auto;width:100%;
    margin:8px 0;
    padding:4px 0
}
/* --- 20-12-2010 --- media work --- */
.datastore {
    display:none
}
article#media {
    clear:both;
    float:left;
    /*min-height:388px;
    min-width:882px;*/
    height:auto;
    width:auto;
    padding:8px 0;
    display:block;
    border-top:5px solid #dddddd
}
article#media h3:hover {
    cursor:pointer
}
article#media #mediabox {
    clear:both;
    float:left;
    background-color:#dddddd;
    margin:8px;
    padding:0 8px;
    height:100%;
    width:850px;
    display:none
}
/*video*/
#video-box {
    min-width:480px;
    width:auto;
    min-height:270px;
    height:auto;
    border:1px solid #cdcdcd;
    padding:16px;
    background-color:#e7e7e7;
    display: block;
    float: left;
    margin:8px 0;
    z-index:90
}
#relatedbox {
    width:260px;
    height:110px;
    background-color:#fff;
    border:1px solid #cdcdcd;
    clear:none;
    float:right;
    display:inline
}
#relatedbox h3 {

}
#relatedbox ul {
    clear:both;
    float:left;
    margin:4px 0 0 15px;
    padding:4px 0 0 15px
}
#relatedbox ul li {
    list-style-type:square;
    font-weight:700;
    text-transform:uppercase
}
#relatedbox ul li a:hover {
    color:#2b2b2b;
    background-color:#f4f4ce
}
#gallerybox {
    width:260px;
    height:170px;
    background-color:#fff;
    border:1px solid #cdcdcd;
    clear:right;
    float:right;
    display:none;
    margin-top:8px
}
.flashContainer{

	/*	Setting the container to relative positioning
		so we can center the control div */

	position:relative;
	overflow:hidden;
    z-index:50
}

.progressBar{
	display:none;
	position:absolute;
	width:auto;
	height:8px;
	left:20px;
	right:105px;
	bottom:20px;
	background-color:#141414;
	overflow:hidden;
	cursor:pointer;

	/* A light CSS3 bottom highlight */

	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, 0.3);
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, 0.3);
	box-shadow:0 1px 0 rgba(255, 255, 255, 0.3);
}

.progressBar .elapsed{
	position:absolute;
	width:0;
	height:100%;
	background-color:#1fa2f6;
	border-right:1px solid #49AFF0;
}

.controlDiv{
	/* Centering the control div */
	position:absolute;
	width:120px;
	height:120px;
	cursor:pointer;
	top:50%;
	left:50%;
	margin:-60px 0 0 -60px;
    background:url('img/play.png') no-repeat center center
}

.controlDiv.play{
	background:url('img/play.png') no-repeat center center
}

.controlDiv.replay{
	background:url('img/replay.png') no-repeat center center;
}

.controlDiv.pause{
	background:url('img/pause.png') no-repeat -99999px;
}

.flashContainer:hover .controlDiv.pause{
	background-position:center center;
}

/* Only show the progress bar when the video is playing */

.flashContainer.playing:hover .progressBar{
	display:block;
}
/* --- 23-12-2010 --- */
a#medialink {
    /*background-image:url(../elements/images/media.png");*/
    height:44px;
    width:201px;
    /*position:absolute;
    right:0;
    top:0;*/
    display:inline;
    float:right;
    padding-left:8px
}
#art-gallery-top {
    width:300px;
    height:200px;
    overflow:hidden;
}
#art-gallery-top a img {
    width:300px;
}
/*#detailbox a#getyourblackbelt, #detailbox a#enquirenow {
    clear:both;
    float:left;
    display:block;
}*/
#arts-enquire-links {
    clear:both;
    float:left;
    width:auto;
    height:auto;
    display:block;
}
#mac-tweets {
    width:423px;
    height:105px;
    background-image:url('../elements/images/mac-tweets.png');
    /*background-position:center;
    background-repeat:no-repeat;*/
    /*display: block;
	float: left;
    margin:40px 0 0 20px;*/
    position:absolute;
    right:405px;
    top:20px;
    /*z-index:99*/
}
#mactweets {
    width: 250px;
    height:auto;
	/*font-family: Verdana, Arial, Helvetica, sans-serif;*/
	font-size: 14px;
    color:#3e3c54;
    clear:both;
    float:left;
    margin:9px 0 0 127px;
    font-weight:600;
    font-style:italic;
    display:none
}
#mactweets div {
    width:250px;
    height:67px;
    /*overflow:hidden*/
}
#mactweets a {
    text-decoration:none;
    color:#b51223
}
#mactweets a:hover {
    color:#3e3c54
}


/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/*
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(images/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:3px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:3px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:3px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(images/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    The following fixes png-transparency for IE6.
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition

    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.

    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}

/* --- 08-01-2011 --- */

#pagefirstfold {
    /*width:365px;*/
    /*min-height:800px;*/
    height:auto;
    display:inline;
    clear:left;
    float:left;
    margin:100px 0 8px 32px;
    font-size:16px;
    width:516px;
    text-align:justify;
    font-family:Calibri,Geneva,Helvetica,Arial,sans-serif
}
#pagefirstfold ul {
    margin:16px 0
}
#pagefirstfold #video-box {
    /*min-width:480px;
    width:auto;
    min-height:270px;
    height:auto;
    border:1px solid #cdcdcd;
    padding:16px;
    background-color:#e7e7e7;
    display: block;
    float: left;*/
    margin:8px 0 16px 0
}
#detailbox {
    clear:none;
}
/* TinyMCE specific rules */
body.mceContentBody {
   font-family:Calibri,Geneva,Helvetica,Arial,sans-serif;
   font-size:16px;
   padding:8px 8px 8px 16px
}

/*.mceContentBody a {
   color: red !important; // FF requires a important here
}*/