@charset "utf-8";

h3, .b16, .carambydiv { font-size: 16px }
h4, .b14, .b14yellow { font-size: 14px }
h5, .b12, .r12, .button { font-size: 12px }
.b11, .ddfmwrap, .r11 { font-size: 11px }
.b10 { font-size: 10px }
.b14yellow { color: #ff9 }
.button { background-color: #ff9 }
.b16, .b14, .b14yellow, .b12, .b11, .b10, .button, .carambydiv/*, .ddfmwrap*/ { font-weight: bold }
h1, h2, h3, h4, h5, .b16, .b14, .b14yellow, .b12, .b11, .b10, .r12, .r11, .button, .ddfmwrap, .carambydiv { font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular }

/* CONTACT FORM STYLES */

/* JAS says include this somewhere */
.clearer { clear: both; height: 1px; }

/* Hide asterisks by making them bg colour */
.required { color: black }

/* Set the base style for the whole form */
.ddfmwrap { text-align: left; position: relative; width: 90%; margin: 10px auto; font: bold 12px Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular; }

/* Push the image right */
div.ddfmwrap img { float: left; margin: 2px 0 0 12px; }

/* Make blocktitles larger unless italic */
.fmblocktitle { font-size: 12px; padding-top: 12px; margin-bottom: 24px; clear: left; }
form.ddfm div.fmblocktitle i { font-size: 10px; }

/* Force a break after the fmtext fields and set a smaller line height for the checkboxes */
form.ddfm label.fmcheck { float: left; margin-top: 4px; margin-bottom: 4px; }
form.ddfm div.fmcheck p { clear: left; line-height: 16px; margin-top: 0; margin-bottom: 0; }

/* Get those labels onto their own lines */
label.fmtextwide { float: left; clear: left; width: 100%; margin-top: 12px; margin-bottom: 4px; }
label.fmtext, label.fmverify { float: left; clear: left; width: 100%; margin-top: 4px; margin-bottom: 2px; }

/* Make space after text boxes */
textarea.fmtextwide { margin-bottom: 18px; width: 300px; }
input.fmtext, input.fmverify { margin-bottom: 18px; float: left; clear: left; }

/* Stick the 'Send Email' button underneath */
div.submit { clear: left; text-align: right; margin: 24px; }

/* PAGE LAYOUT STYLES */

body { color: #030; background-color: #030; }
/* Hides from IE5-mac and all browsers except IE6 & below \*/
* html a:hover { visibility: visible }

/* CARAMBY SCRIPT */

div.carambydiv { background-color: #060; padding: 12px; margin: 12px; text-align: center; }
div.carambydiv.span { width: 90%; }
form.formleft { float: left; }
form.formright { float: right; }
div.bigpicdiv { padding: 12px; margin: 12px auto; text-align: center; width: 99%; }

/* INDEX PAGE */

/* Frame the entire content in a relative position */
#framediv { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #030; }

/* Content */
#contentdiv { width: 750px; height: 456px; position: absolute; top: 50%; left: 50%; margin-top: -228px; margin-left: -375px; text-align: center; }
/* Hides from IE5-mac and all browsers except IE6 & below \*/
* html #contentdiv { width: 780px !important; }
/* End hide from not-IE6 */

/* bg060 is the green backdrop */
#bg060 { position: absolute; z-index: 2; top: 8px; left: 8px; width: 714px; height: 420px; visibility: visible; background-color: #060; padding: 0px; margin: 0px; }
/* basso contains the explanatory text and links */
#basso { position: absolute; z-index: 2; top: 440px; left: 8px; width: 698px; height: 72px; visibility: visible; color: #070; padding: 8px; margin: 0; text-align: left; }
div#basso h1, div#basso h2 { font-size: 10px; }
div#basso a, div#basso a:visited { color: #080; text-decoration: none; }
div#basso a:hover { color: #ff9; }
/* sndgiflayer contains the animated pretty pattern */
#sndgiflayer { position: absolute; z-index: 3; top: 8px; left: 8px; width: 438px; height: 437px; visibility: visible; padding: 0px; margin: 0px; }
/* txtgiflayer contains the main rollover button links */
#txtgiflayer { position: absolute; z-index: 4; top: 24px; left: 16px; width: 742px; height: 418px; visibility: visible; padding: 0px; margin: 0px; }

#welcomediv { position: absolute; top: 0px; left: 0px; width: 203px; height: 102px; padding: 0px; margin: 0px; }
#wilmadiv { position: absolute; top: 144px; left: 16px; width: 170px; height: 188px; padding: 0px; margin: 0px; }
#wilmadiv span, #welcomediv span { position: absolute; left: 0px; top: 0px; visibility: hidden; }
#indbutwrap { position: absolute; top: 0px; left: 219px; width: 508px; height: 374px; padding: 0px; margin: 0px; }

/* INDEX ROLLOVERS */

#inspendbut, #insitesbut, #intanbut, #ingrabut, #inspacerbut, #inphobut { position: relative; white-space: nowrap; display: block; margin: 0; padding: 0; }
#inspendbut { width: 250px; height: 122px; background: url(a_gifs/spendb.gif) no-repeat; float: left; }
#insitesbut { width: 258px; height: 122px; background: url(a_gifs/sitesb.gif) no-repeat; float: left; }
#intanbut { width: 250px; height: 130px; background: url(a_gifs/tanb.gif) no-repeat; clear: left; float: left; }
#ingrabut { width: 258px; height: 130px; background: url(a_gifs/graphicsb.gif) no-repeat; float: left; }
#inspacerbut { width: 250px; height: 122px; clear: left; float: left; }
#inphobut { width: 258px; height: 122px; background: url(a_gifs/resourceb.gif) no-repeat; float: left; }

#inspendbut a { width: 250px; height: 122px; }
#inspendbut img { width: 250px; height: 122px; }
#insitesbut a, #inphobut a { width: 258px; height: 122px; }
#insitesbut img, #inphobut img { width: 258px; height: 122px; }
#intanbut a { width: 250px; height: 130px; }
#intanbut img { width: 250px; height: 130px; }
#ingrabut a { width: 258px; height: 130px; }
#ingrabut img { width: 258px; height: 130px; }

.indbut a { display: block; font-size: 8px; float: left; color: lime; }
.indbut img { border: 0 }
.indbut a:hover img { visibility: hidden }
.indbut span { position: absolute; left: 0px; top: 0px; visibility: hidden; }


/* SPEND PAGE */

#spendiv { color: #ff9; text-align: center; margin: 0 auto; width: 596px; }
#leftspendiv { color: #ff9; background-color: #030; width: 196px; float: left; padding: 0px; margin: 0px; }
#containdiv { color: #ff9; background-color: #030; width: 400px; float: left; padding: 0px; margin: 0px; text-align: left; }
.greendiv { color: #ff9; background-color: #060; width: 162px; float: left; clear: left; padding: 12px; margin: 6px; }
.darkdiv { background-color: #030; width: 90%; float: left; clear: left; padding: 6px; margin: 0px; }
.greenmiddiv { color: #ff9; background-color: #060; width: 92%; float: left; clear: left; padding: 12px; margin: 6px; }
.greenmiddiv a { text-decoration: none; }
.greenmiddiv a:hover { color: black; }
.yellwrapdiv { background-color: #ff9; width: 153px; padding: 4px; margin: auto; }

#spesitesbut, #spegrabut, #spephobut, #spetanbut { position: relative; white-space: nowrap; display: block; width: 153px; height: 72px; margin: 0; padding: 0; }
#spesitesbut { background: url(a_gifs/sitesb72.gif) no-repeat; }
#spegrabut { background: url(a_gifs/graphicsb72.gif) no-repeat; margin-top: 4px; }
#spephobut { background: url(a_gifs/resourceb72.gif) no-repeat; margin-top: 4px; }
#spetanbut { background: url(a_gifs/tanb72.gif) no-repeat; margin-top: 4px; }

.spenavbut a { display: block; font-size: 8px; width: 153px; height: 72px; float: left; color: lime; }
.spenavbut img { width: 153px; height: 72px; border: 0 }
.spenavbut a:hover img { visibility: hidden }
.spenavbut span { position: absolute; left: 0px; top: 0px; visibility: hidden; }

/* SITES PAGE */

div.sitenavdiv { color: #ff9; background-color: #060; padding: 12px; margin: 0; width: 148px; position: fixed; top: 0; left: 0; border: 6px solid black; }
li.anchorlist { border: 2px solid #030; margin: 0 0 2px; padding: 0 0 0 6px; background-color: #ff9; list-style-type: none; font: bold 10px/20px Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular }
li.anchorlist a { text-decoration: none; }
li.anchorlist a:hover { color: #060; text-decoration: underline; }
ul.anchorul { margin: 0; padding: 0; }
div.sitebrowsediv { color: #ff9; background-color: #030; padding: 6px; margin: 0px 0px 0px 176px; width: 600px; }
div.siteimgdiv { background-color: #000; width: 220px; height: 128px; float: left; clear: left; padding: 6px; margin: 6px; text-align: center; }
div.sitetextdiv { color: #ff9; background-color: #060; width: 300px; height: 128px; float: left; padding: 6px; margin: 6px; }

/* STUDIO TAN */

#fullpagediv { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url(a_gifs/greenbgani.gif); text-align: center; overflow: auto; }
#wrappittydiv { background-color: #060; padding: 0; margin: 24px auto; border: 6px solid #030; width: 632px; }
div.topimagesdiv { margin: 8px 8px 160px; padding: 8px; width: 600px; }
div.cerebosdiv { float: left; margin: 0; padding: 0; border: 6px solid #030; }
div.bannersdiv { float: left; margin: 0; padding: 0; }
div.tanbannerdiv { margin: 8px; padding: 8px; }
div.tantextdiv { background-color: #ff9; clear: left; margin: 16px; padding: 16px; width: 568px; text-align: left; }
div.exeterdiv { float: left; margin: 0; padding: 0; }
div.callusdiv { float: right; margin: 8px; padding: 8px; }
div.phpwrapdiv { clear: left; margin: 8px; padding: 4px; background-color: #ff9; width: 548px; text-align: center; display: block; }
div.phpdiv { margin: auto; padding: 4px; color: #ff9; background-color: #060; width: 360px; display: block; text-align: left; }

#tanbut { position: relative; display: block; width: 153px; height: 72px; margin: 8px auto auto; padding: 0; background: url(a_gifs/spendb72.gif) no-repeat; text-align: center; clear: left; }
#tanbut a { display: block; font-size: 8px; width: 153px; height: 72px; float: left; color: lime; }
#tanbut img { width: 153px; height: 72px; border: 0 }
#tanbut a:hover img { visibility: hidden }
#tanbut span { position: absolute; left: 0px; top: 0px; visibility: hidden; }

/* GRAPHICS */

div.grawrapdiv { background-color: #30f; padding: 16px 0 0; border: 6px solid #000; width: 376px; margin: 24px 0 52px 152px; }
div.grawrap2div { background-color: #30f; padding: 16px; margin: 24px 0 52px 152px; border: 6px solid #000; width: 472px; float: left; }
div.gracelldiv { background-color: #30f; padding: 0; margin: 0 auto 16px; text-align: center; }
div.graybgdiv { background-color: #ff0; padding: 8px; margin: 0 auto 16px; }
div.graybgdiv h1 { font-size: 14px; }
div.graybgdiv a { text-decoration: none; }
div.graybgdiv a:hover { color: #30f; }
div.grarbgdiv { background-color: #f00; padding: 0; margin: 0 auto 16px; text-align: center; }
img.graimg { padding: 0; margin: 0; border: 6px solid #000; }
div.graleftcoldiv { padding: 8px; margin: auto; float: left; width: 256px; }
div.grarightcoldiv { padding: 0; margin: 8px; float: left; width: 182px; }
div.graphpdiv { clear: left; margin: 16px auto auto; padding: 8px; background-color: #ff0; width: 340px; display: block; text-align: left; }
div.grabotdiv { margin: 24px 0 52px 152px; width: 389px; padding: 0; }

/* GRAPHICS ROLLOVERS */

#homebut, #projectsbut, #cavernbut, #eventbut, #screensbut, #photosbut, #sitesbut { position: relative; white-space: nowrap; display: block; width: 92px; height: 84px; margin: 0; padding: 0; }
#homebut { background: url(a_gifs/homeb.gif) no-repeat;  }
#projectsbut { background: url(a_gifs/projectsb.gif) no-repeat; }
#cavernbut { background: url(a_gifs/cavernb.gif) no-repeat; }
#eventbut { background: url(a_gifs/eventb.gif) no-repeat; }
#screensbut { background: url(a_gifs/screensb.gif) no-repeat; }
#photosbut { background: url(a_gifs/photosb.gif) no-repeat; }
#sitesbut { background: url(a_gifs/psitesb.gif) no-repeat; }

.navbut a { display: block; font-size: 8px; width: 92px; height: 84px; float: left; color: lime; }
.navbut img { width: 92px; height: 84px; border: 0 }
.navbut a:hover img { visibility: hidden }
.navbut span { position: absolute; left: 0px; top: 0px; visibility: hidden; }

.navwrap { width: 92px; margin: 24px; padding: 0; position: fixed; top: 0; left: 0; border: 6px solid black; background-color: #f00; }