/* Good afternoon, this is my stylesheet it is beautiful and validates ever so nicely.*/

/******************generic site styles************************/
body{ font: 10px/14px Andale Mono, Lucida Console, monospaced; background-color:#000; color:#000; margin:0px; width:840px;}
a:link, a:visited{ background-color:#FFFFCC; color:#000; text-decoration:none; padding:0px 1px 2px 2px;}
a:hover, a:active { background-color:#00c; color: #fff; text-decoration:none; padding:0px 1px 2px 2px;}
img{ border:none;}
/*************************************************************/


.warning{width:800px;height:17px;padding:3px 20px 0px 20px; background-color:#ffc;color:#FF0000;border:none;float:left;}
.section{ position:relative; float:left; width:800px; padding:20px; margin-bottom:20px; background-color:#FFF;}
.header{ width:800px; height:280px; background-repeat:no-repeat;font-family:"Times New Roman", Times, serif;font-weight:bold; font-size:100px;letter-spacing:-4px;line-height:85px;color:#00c;width:800px;overflow:visible;}

.rule_horizontal{ height:2px; border-bottom:1px solid #000; border-top:10px solid #000;margin-bottom:10px;font-size:1px;line-height:1px;overflow:hidden;}
.rule{ width:15px; height:252px; background-image:url(images/rule.gif); float:left;}
.rule_right{ width:1px; height:252px; float:right; border-right: 1px solid #000;}
.rule_left{ width:9px; height:252px;float:left; border-left: 1px solid #000;}

.info_column{ position:relative; height:252px; float:left; background-image:url(images/background_tile_text.gif);}
.title{ height:42px; font-family:"Times New Roman", Times, serif; font-style:italic; font-size:28px; line-height:35px;font-weight:bold; color:#00F; width:390px;float:none;margin-bottom:3px; }
.type{ height:28px; width:250px; color:#00F;float:none;}
.description{ height:210px;}

#info .info_column{ width:250px;}
#info .header{ background-image:url(images/bomb_top.gif);}
#info .title{ width:250px;}

#work .info_column{ width:390px;height:400px;}
#work .header{ background-image:url(images/bomb_middle.gif);}
#work .rule_left{height:393px;}

#extra .info_column{ width:250px;}
#extra .header{ background-image:url(images/bomb_bottom.gif);}
#extra .title{ width:250px;}

.project{ position:relative; float:left; width:800px; height:400px;}
.project_buttons{ clear:both; width:800px;padding-bottom:7px;padding-top:7px;margin-bottom:10px; border-bottom:5px solid #000;overflow: hidden; }

.detail_node { position:relative; float:left; width:800px;margin-bottom:1000px;}
.detail{ position:relative; float:left; padding:20px; background-color:#fff;}
.detail_info_column{float:left; width:200px;height:100px;padding-top:3px; background-image:url(images/background_tile_text.gif);overflow:hidden;}
.detail_buttons{ float:left;width:150px;padding-top:3px;}
.detail_image{ border-bottom:5px solid #00c;margin-bottom:10px; float:none;}
.detail_rule{ width:15px; height:110px; background-image:url(images/rule.gif); float:left;}

.work_thumbs{ position:relative;width:390px;float:right;padding-top:3px;}
.work_thumbs div{ position:relative; margin-bottom:10px; float:left; padding-left:10px;padding-top:10px; width:180px; height:180px;background-color:#ffc;overflow:hidden;}
.work_thumbs div a{ padding:0px; margin:0px;background-color:#ffc;}
.work_thumbs div img:link, .work_thumbs div img:visited{ border-bottom:5px solid #ffc;}
.work_thumbs div img:hover{ border-bottom:5px solid #00c; visibility:visible}

#measurements .detail_node{ margin-bottom:20px;}
#the_end .detail_node{ margin-bottom:0px;}


/*********************type styles*****************************/
.active{ background-color:#00c; color: #fff; text-decoration:none; padding:0px 1px 2px 2px;}
.non_active{ text-decoration:none; padding:0px 1px 2px 2px;}
.blue{ color:#00c;}

/***********************section positions*******************************/

#main_holder   { position:absolute; top:0px; float:none; }
#measurements  { position:absolute; top:832300px; float:none; }
#detail_holder { position:absolute; top:1832300px; float:none; }
#great_white   { position:absolute; top:22756700px; float:none; }
#giant_squid   { position:absolute; top:27756700px; float:none; }
#feejee		   { position:absolute; top:29756700px; float:none; }
#oasis     	   { position:absolute; top:30619200px; float:none; }
#the_end       { position:absolute; top:45619200px; float:none; }

