html, body { background-color: #fff; font-family: Verdana, sans-serif; }

table { background-color: #222; color: #fff; font-size: 0.7em; margin: 10px 0; }
table tr { height: 20px; }

/* wraps & shadows */

#shadowtop { margin: 25px auto 0; width: 920px; height: 40px; background-image: url(/images/menu.jpg); }
#wrap { margin: 0px auto; width: 920px; min-height: 600px; background-image: url(/images/wrap-bg.jpg); background-repeat: repeat-y; }
#bgwrap { width: 920px; min-height: 600px; background-image: url(/images/background.jpg); background-repeat: no-repeat; }

/* menu */

/* logo */

#logo { float: right; width: 500px; height: 150px; text-align: right; padding-top: 15px; }
#logo img { float: right; margin-right: 60px; }
#logo p { float: right; color: #fff; font-size: 0.8em; padding: 0; margin: 0px 60px 0; line-height: 1.5em; }

/* content */

#exhibit-tab { float: left; margin: 30px 0 30px 60px; width: 350px; height: 100px; }

#nav { float: left; width: 920px; min-height: 100px; padding: 20px 0 0; }
#navbox { margin: 0px auto; width: 800px; height: 250px; background-image: url(/images/navbox.png); }
#navbuttonlist { float: left; width: 200px; height: 250px; }

.xfade { position: relative; }
.xfade img { position: absolute; top: 0px; left: 0px; visibility: hidden; }

#navimage { float: left; width: 580px; height: 230px; background-image: url(/images/navimage.png); margin: 10px; }
#navimage #cp-state { position: absolute; background-image: url(../images/navstatus.png); bottom: 20px; right: 20px; display: block; width: 25px; height: 25px; z-index: 10000;}
#navimage #cp-state.pause { background-position: 0px 0px; }
#navimage #cp-state.play { background-position: 25px 0px; }

.navbutton { float: left; width: 190px; height: 50px; margin: 10px 0 0 10px; text-align: right; }
.navbutton a { float: left; width: 180px; height: 45px; background-image: url(/images/navbutton.png); font-family: Century Gothic; font-size: 1.2em; text-decoration: none; color: #fff; padding: 5px 10px 0 0; }
.navbutton a:hover, .navbutton.selected a { background-image: url(/images/navbutton_hover.png); }

#navtext { float: right; width: 140px; height: 190px; margin: -230px 20px 0 0; background-image: url(/images/shadebox.png); padding: 10px; text-align: left; }
#navtext h1 { float: left; color: #fff; font-size: 0.8em; font-weight: bold; width: 100%; padding-bottom: 0.3em; border-bottom: 1px solid white; }
#navtext p { float: left; color: #fff; font-size: 0.55em; margin-bottom: 0.5em; }

#sponsorcontent { float: left; width: 210px; min-height: 225px; margin-left: 60px; text-align: left; }
#sponsorcontent img { float: left; margin: 10px auto; }
#sponsorcontent h1 { color: #fff; font-size: 1.1em; margin: 1em 0; }

#textcontent { float: left; width: 590px; min-height: 225px; display: inline; margin-right: 60px; text-align: left; border-top: 1px solid #5d0f5b; padding-bottom: 25px; }
#textcontent h1 { font-size: 1.1em; color: #ec4499; margin: 1em 0; }
#textcontent h2 { font-size: 0.8em; color: #ec4499; margin: 0.5em 0; }
#textcontent h3 { font-size: 0.7em; color: #ec4499; margin: 1em 0 0; }
#textcontent p { font-size: 0.7em; color: #fff; }
#textcontent a { color: #ec4499; text-decoration: none; }
#textcontent a:hover { text-decoration: underline; }
#textcontent ul { margin-bottom: 0.5em; }
#textcontent ul li { color: #fff; list-style-type: disc; font-size: 0.6em; margin-left: 2.5em; }

.two-col { float: left; width: 580px; background-color: #222; margin: 0.5em 0; padding-left: 10px; }
.col-left { float: left; width: 200px; }
.col-right { float: right; width: 380px; }

table#list-beauty, table#list-fashion, table#list-athome, table#list-wellbeing { width: 290px; color: #fff; margin: 5px 0; font-size: 0.7em; border-collapse: collapse; background-color: #444; }
table#list-beauty th, table#list-beauty td { padding: 3px; }
table#list-fashion th, table#list-fashion td { padding: 3px; }
table#list-athome th, table#list-athome td { padding: 3px; }
table#list-wellbeing th, table#list-wellbeing td { padding: 3px; }

.crombie { color: #fff; }
.crombie span { float: left; width: 15px; height: 15px; margin: 0 5px; background-color: #fff; }
.boyd-orr { color: #ec4499 !important; }
.boyd-orr span { float: left; width: 15px; height: 15px; margin: 0 5px; background-color: #ec4499; }

ul#address li { list-style-type: none; margin: 0; }
ul#address li.listtitle { width: 100px; border-bottom: 1px solid white; padding-bottom: 0.5em; margin-bottom: 0.5em; }

ul#ticketdates { margin-top: 0.5em; }
ul#ticketdates li { font-size: 0.7em; }

ul#quickfacts { margin-top: 0.5em; }
ul#quickfacts li { font-size: 0.7em; }

ul#whyexhibit { margin-top: 0.5em; }
ul#whyexhibit li { font-size: 0.7em; }

#container { margin: 25px auto; width: 320px; height: 240px; border: 1px solid #5D0F5B; }
#container.wls-advert { margin: 25px auto; width: 400px; height: 300px; border: 1px solid #5D0F5B; }
#container.exhibition { margin: 25px auto; width: 590px; height: 330px; border: 1px solid #5D0F5B; }
.exhibit-logo { float: left; margin: 10px; width: 122px; height: 75px; overflow: hidden; }
.exhibit-logo div { width: 122px; height: 75px; display: table-cell; vertical-align: middle; text-align: center; background-color: #111; border: 1px solid #333; }

#squareimage { float: left; width: 590px; height: 250px; }
#squareimage img { float: left; width: 125px; height: 125px; border: 5px solid white; margin: 25px 12px 0 0; }

.showcontainer { float: left; width: 100%; min-height: 100px; border-top: 1px solid #5D0F5B; padding-bottom: 25px; }
.showpic { float: right; width: 100px; height: 130px; background-color: #ccc; border: 5px solid white; margin: -25px 0 15px 25px; }
.dancepic { margin: 25px 0 0 85px; width: 400px; height: 267px; border: 5px solid white;}

.ad-box { float: left; width: 175px; margin: 5px 0; padding: 10px; background-color: #333; color: #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; }
.ad-box a { color: #ec4499; }
.ad-box img { float: left; width: 30px; height: 30px; display: block; padding: 0 10px 0; }

/* logos */

.info { margin: 0 auto; width: 850px; height: 25px; border-top: 1px solid #5d0f5b; padding-top: 0.3em; text-align: center; }
.imageboxleft { float: left; width: 200px; height: 125px; margin-right: 15px; border: 5px solid white; }
.imageboxright { float: right; width: 200px; height: 300px; min-height: 100px; margin-left: 15px; border: 5px solid white; }
.imageboxmiddle { margin: 25px auto; width: 300px; height: 200px; border: 5px solid white; }
.imageboxbio { float: left; width: 570px; height: 230px; border: 5px solid white; margin: 1em 0; }
.videoboxbio { float: left; width: 570px; height: 230px; border: 5px solid white; margin: 1em 0; }
.greylink { color: #333 !important; }
.clanlogo { margin: 25px auto; }

/* js */

.opener { display: none; width: 180px; cursor: pointer; font-weight: bold; }
#makeover, #weightloss, #tiredness, #relationship, #person, #rosiebio { background-color: #222; width: 435px; padding: 5px 10px; margin-top: 10px; }

/* footer */

#footer { margin: 0px auto; width: 920px; height: 40px; background-image: url(/images/shadow-bottom.jpg); }

.copyright { float: left; margin-left: 40%; color: #fff; font-size: 0.6em; }
.bluesquare { float: right; border-left: 2px solid #00aeef; padding-left: 0.5em; line-height: 8px; color: #fff; font-size: 0.6em; }
a.blue2 { color: #00aeef; }