@charset "utf-8";

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

/* PAGE LAYOUT STYLES */

body { color: #030; background-color: #030; }

/* 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; }

/* 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 */

#spendwrapdiv { background-color: #060; padding: 0; margin: 24px auto; border: 6px solid #030; width: 612px; }
.darkdiv { background-color: #030; width: 94%; float: left; clear: left; padding: 6px; margin: 0px; }
div.anigifdiv { margin: 8px 8px 122px; padding: 8px; width: 600px; }
div.spentextdiv { background-color: #ff9; clear: left; margin: 16px; padding: 16px; width: 548px; text-align: left; }
div.spentextdiv p a { color: #080; text-decoration: none; }

/* 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; color: black; }
li.anchorlist a:hover { color: #060; }
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.siteimgdiv.img { height: 128px; border: 0; }
div.siteimg2div { background-color: #030; width: 544px; height: 32px; float: left; clear: left; padding: 6px; margin: 6px; text-align: left; }
div.sitetextdiv { color: #ff9; background-color: #060; width: 300px; height: 128px; float: left; padding: 6px; margin: 6px; }
div.sitetextdiv a { text-decoration: none; color: white; font-weight: bold; }
div.sitetextdiv a:hover { color: black; }

/* 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.phpwrapdiv p a, div.phpwrapdiv p a:visited, div.fullpagediv p a, div.fullpagediv p a:visited, div.wrappittydiv p a, div.wrappitydiv p a:visited { color: #080; text-decoration: none; }

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; }

#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 */

/* These two lines allow two columns to sit side-by-side */

div.grawrapdiv { background-color: #30f; padding: 16px 0 0; border: 6px solid #000; width: 236px; margin: 24px 0 52px 152px; display: inline-block; vertical-align: top; }
div.grawrap3div { background-color: #30f; padding: 16px 0 0; border: 6px solid #000; width: 236px; margin: 24px 0 52px 32px; display: inline-block; vertical-align: top; }

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.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; }