/* Common Colors:
backgrounds: #9999FF, #6666CC, #333399, #7F7FE5, #8C8CF2
text color: #F6FCFF
borders: #111166
*/

/* Body setup */
body {height:100%; padding:0px; margin:0px; overflow:auto; background-color:#9999FF; color:#F6FCFF;}
body, table {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:15px; line-height:135%;}
#pageFader, #outerDiv {position:absolute; left:0px; top:0px; width:100%; height:100%; border-width:0px; padding:0px; margin:0px; z-index:1;}
#pageFader {display:none; float:left; z-index:-1; opacity:0;}

/* General goodness */
p {margin-top:0em; margin-bottom:1.25em;}
h1 {margin-top:0em; line-height:normal;}
.u {text-decoration:underline;}
a {text-decoration:none; color:#F6FCFF;}
a:hover {text-decoration:underline;}
h1 {font-size:30px;}
h2 {font-size:22px;}
.subH {font-size:32%;}
sup {font-size:70%;}

/* Outside borders */
#topBG, #leftBG {position:absolute; left:0px; top:0px; border-width:0px; background-color:#6666CC; padding:0px; margin:0px; z-index:2;}
#topBG {width:100%; height:20px; text-align:right;}
#leftBG {width:35px; height:100%;}

/* Navigation borders */
#oTopBorder, #iTopBorder, #oLeftBorder, #iLeftBorder {position:absolute; padding:0px; margin:0px;}
#oTopBorder, #oLeftBorder {left:35px;}
#oTopBorder {top:20px; right:0px; height:109px; z-index:3;}
#oLeftBorder {top:127px; bottom:0px; width:109px; z-index:4;}
#iTopBorder, #iLeftBorder {left:0px; top:0px; background-color:#333399; border:solid #111166;}
#iTopBorder {right:0px; height:105px; border-width:2px 0px 2px 2px;}
#iLeftBorder {bottom:0px; width:105px; border-width:0px 2px 0px 2px;}

/* Navigation elements */
.tTab, .atTab, .lTab, .alTab,
.mTab, .amTab, .hmTab {background-color:#6666CC; border:2px solid #111166; position:absolute; line-height:normal;}

.tTab, .atTab {width:50px; height:18px; top:75px; padding:5px;}
.atTab {background-color:#9999FF; height:22px; top:73px; border-bottom-width:0px; z-index:5; cursor:default;}
a .tTab, a .atTab {text-decoration:none; color:#F6FCFF; cursor:pointer;}

.lTab, .alTab, .mTab, .amTab, .hmTab {left:32px; height:19px; width:67px; padding:7px 2px 2px 2px; font-size:10px; cursor:default;}
.alTab, .amTab, .hmTab, .mTab:hover {background-color:#9999FF; width:69px; border-right-width:0px; z-index:5;}
.hmTab, .mTab:hover, .amTab:hover {background-color:#7F7FE5;}
a .lTab, a .alTab {cursor:pointer;}
/* IE glitches with this, had to use JavaScript, save for when IE isn't as stupid!
a:hover .lTab {background-color:#8C8CF2;}
*/

.jsfMenu {display:none; position:absolute; left:107px;}
.jsfMenu td {background-color:#7F7FE5; font-size:12px;}
.jsfmItem, .ajsfmItem {padding:2px 10px; cursor:default;}
.ajsfmItem {background-color:#8C8CF2;}
a .jsfmItem, a .ajsfmItem {cursor:pointer;}
/*a:hover .jsfmItem {background-color:#8C8CF2;}*/
.thm {vertical-align:middle; border:0px; margin:5px;}
.lTab1, #jsfMenu1Tab {top:50px;}
#jsfMenu1 {top:52px;}
.lTab2, #jsfMenu2Tab {top:80px;}
#jsfMenu2 {top:82px;}
.lTab3, #jsfMenu3Tab {top:110px;}
#jsfMenu3 {top:112px;}
.lTab4, #jsfMenu4Tab {top:140px;}
#jsfMenu4 {top:142px;}
.lTab5, #jsfMenu5Tab {top:170px;}
#jsfMenu5 {top:172px;}
.lTab6, #jsfMenu6Tab {top:200px;}
#jsfMenu6 {top:202px;}

.tl, .tr {width:9px; height:9px; position:absolute; top:-2px; z-index:4; border-width:0px;}
.tl {left:-2px;}
.tr {right:-2px;}
#siteTitle {width:194px; height:71px; border:0px; position:absolute; left:5px; top:20px;}
.pgTitle {position:absolute; left:330px; top:9px; padding:0px; display:none; opacity:0;}
.pgTitle, .pgTitleImg {width:203px; height:41px; border:0px;}
#devArtTab {border-width:0px; width:50px; height:24px; position:absolute; left:210px; top:79px;}
#artTab {left:260px;}
#poetryTab {left:322px;}
#photosTab {left:384px; padding-right:3px; width:52px;}
#oddsTab {left:446px;}
#infoTab {left:508px;}
#linksTab {left:570px;}
#kpdtTab {border-width:0px; width:121px; height:121px; position:absolute; left:650px; top:1px;}
/* Will work in both Firefox and IE6, however, it makes it so that the image is selected when clicked... I don't like that
#devArtTab {border-width:0px; padding:0px; width:50px; height:24px; position:absolute; left:210px; top:79px;}
#devArtTab a {float:left; opacity:.7; filter:alpha(opacity=70);}
#devArtTab a:hover {opacity:1; filter:alpha(opacity=100);}
#devArtImg {border-width:0px; width:50px; height:24px;}
*/
/* Save this for when all common browsers properly support opacity, use with "daLogo_On.gif"
#devArtTab {border-width:0px; width:50px; height:24px; position:absolute; left:210px; top:79px; opacity:0.75;}
#devArtTab:hover {opacity:1;}
*/

/* Content area */
#oContentDiv, #iContentDiv {position:absolute; border-width:0px; overflow:auto;}
#oContentDiv {left:144px; top:129px; right:0px; bottom:0px; padding:0px; margin:0px; z-index:1;}
#iContentDiv {left:0px; top:0px; right:1px; bottom:1px; padding:25px 5px 2px 25px ;}

/* Fader goodness */
.fader {display:none; margin-bottom:1.5em;}
.fader td {background-color:#9999FF;}

/* Home page */
#driftingPoem {font-weight:bold; border-width:0px; margin-left:120px;}

/* Poetry page */
/* .poem h1 {text-align:center;} */
#Light table {color:#FFFF99;}
#Light h1 {color:#FFFF00;}
#Shadows, #Shadows table {color:#666666;}

/* Art and Photos pages */
#imgDiv1, #imgDiv2 {width:100%; position:absolute; top:0px;}
#imgHeader1, #imgHeader2 {font-size:18px;}

/* Odds page */
#WaiSoCrazyTab {top:50px;}
#ImpromptuTab {top:80px;}
.fader .ImpFun {font-size:13px; color:black; background-color:white; width:50%;}
.s {color:blue; font-weight:bold;}
.K {color:red; font-weight:bold;}

/* Info page */