html {
background-color: #000;
}
body {
background-image: url("../img/zombie/za-body-background-z.jpg");
background-position: top left;
background-repeat: repeat-x;
background-color: #000;
min-height: 512px;
}

h1 {
color: #caff66;
font-size: 160%;
}
h2 {
color: #caff66;
font-size: 170%;
}

a {
color: #caff66;
font-size: 90%;
}

p {
color: #caff66;
font-size: 90%;
padding: 5px 0px 5px 0px;
}

#header {
padding: 0;
}

#footer {
color: #aacb7c;
}

#tln_admissions {
float: left;
width: 104px;
height: 48px;
margin: 0px 40px 0px 0px;
background: url("../img/za-tln-admissions-z.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_admissions:hover { 
background: url("../img/za-tln-admissions-z-active.jpg") no-repeat 0 0;
}
#tln_admissions span {
display: none;
}
#tln_admissions_active {
float: left;
width: 104px;
height: 48px;
margin: 0px 40px 0px 0px;
background: url("../img/za-tln-admissions-z-active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_explore {
float: left;
width: 104px;
height: 48px;
margin: 0px 20px 0px 0px;
background: url("../img/za-tln-explore-z.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_explore:hover { 
background: url("../img/za-tln-explore-z-active.jpg") no-repeat 0 0;
}
#tln_explore span {
display: none;
}
#tln_explore_active {
float: left;
width: 104px;
height: 48px;
margin: 0px 20px 0px 0px;
background: url("../img/za-tln-explore-z-active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_blog {
float: left;
width: 104px;
height: 48px;
margin: 0px 20px 0px 0px;
background: url("../img/za-tln-blog-z.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_blog:hover { 
background: url("../img/za-tln-blog-z-active.jpg") no-repeat 0 0;
}
#tln_blog span {
display: none;
}
#tln_blog_active {
float: left;
width: 104px;
height: 48px;
margin: 0px 20px 0px 0px;
background: url("../img/za-tln-blog-z-active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_alumni {
float: left;
width: 104px;
height: 48px;
margin: 0px 30px 0px 0px;
background: url("../img/za-tln-alumni-z.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#tln_alumni:hover { 
background: url("../img/za-tln-alumni-z-active.jpg") no-repeat 0 0;
}
#tln_alumni span {
display: none;
}
#tln_alumni_active {
float: left;
width: 104px;
height: 48px;
margin: 0px 30px 0px 0px;
background: url("../img/za-tln-alumni-z-active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}

#explore_menu_sample {
float: left;
width: 131px;
height: 64px;
margin: 0px 0px 0px 230px;
background: url("../img/zombie/explore_menu_sample.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#explore_menu_sample:hover { 
background: url("../img/zombie/explore_menu_sample_active.jpg") no-repeat 0 0;
}
#explore_menu_sample span {
display: none;
}
#explore_menu_sample_active {
float: left;
width: 131px;
height: 64px;
margin: 0px 0px 0px 230px;
background: url("../img/zombie/explore_menu_sample_active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}

#explore_menu_concept {
float: left;
width: 131px;
height: 64px;
margin: 0px 20px 0px 30px;
background: url("../img/zombie/explore_menu_concept.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#explore_menu_concept:hover { 
background: url("../img/zombie/explore_menu_concept_active.jpg") no-repeat 0 0;
}
#explore_menu_concept span {
display: none;
}
#explore_menu_concept_active {
float: left;
width: 131px;
height: 64px;
margin: 0px 20px 0px 30px;
background: url("../img/zombie/explore_menu_concept_active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}

#explore_menu_fan {
float: left;
width: 131px;
height: 64px;
margin: 0px 0px 0px 0px;
background: url("../img/zombie/explore_menu_fan.jpg") no-repeat 0 0;
border: 0px solid #fff;
}
#explore_menu_fan:hover { 
background: url("../img/zombie/explore_menu_fan_active.jpg") no-repeat 0 0;
}
#explore_menu_fan span {
display: none;
}
#explore_menu_fan_active {
float: left;
width: 131px;
height: 64px;
margin: 0px 0px 0px 0px;
background: url("../img/zombie/explore_menu_fan_active.jpg") no-repeat 0 0;
border: 0px solid #fff;
}

#explore {
overflow: hidden;
background-color: #000;
}
#explore_menu {
text-align: center;
background-color: #000;
height: 64px;
}

#zombie_files {
overflow: hidden;
/*
background-color: #000;
border: 1px solid #caff66;
*/
width: 880px;
padding: 20px 20px 20px 80px;
}

div.appendages {
border: 0px solid #caff66;
}
div.appendages_list {
margin: 0px 0px 20px 0px;
}
div.appendages_list a {
font-size: 170%;
}
div.appendages_list p {
font-size: 150%;
}

div.characters {
overflow: hidden;
}
div.character_info_holder {
float: left;
margin: 0px 0px 20px 0px;
}
div.character_image {
float: left;
width: 240px;
border: 1px solid #caff66;
}
div.character_info {
float: left;
width: 686px;
padding: 0px 0px 0px 10px;
}
div.character_info p {
color: #caff66;
font-size: 140%;
padding: 5px 0px 5px 0px;
}
input[type="text"], input[type="textarea"], textarea {
font-weight: normal;
font-size: 130%;
}

div#contact {
margin: 0px 0px 0px 60px;
}
div#contact h2 {
padding: 10px 0px 10px 5px;
}
div#mail_sent {
text-align: center;
font-size: 200%;
}

/* SCROLLABLE STUFF */
/* 
   root element for the scrollable. 
   when scrolling occurs this element stays still. 
*/ 
div.scrollableartworkssample { 
/* required settings */ 
position:relative; 
overflow:hidden; 
width: 300px; 
height:600px; 
} 

div.scrollable { 
/* required settings */ 
position:relative; 
overflow:hidden; 
width: 700px; 
height:350px; 
} 

/* 
   root element for scrollable items. Must be absolutely positioned 
   and it should have a extremely large width to accomodate scrollable items. 
   it's enough that you set width and height for the root element and 
   not for this element. 
 */ 
div.scrollableartworkssample div.items { 
/* this cannot be too large */ 
width:20000em; 
position:absolute; 
} 
div.scrollable div.items { 
/* this cannot be too large */ 
width:20000em; 
position:absolute; 
} 

/* 
   a single item. must be floated in horizontal scrolling. 
   typically, this element is the one that *you* will style 
   the most. 
*/ 
div.scrollableartworkssample div.items div { 
float:left; 
} 
div.scrollable div.items div { 
float:left; 
} 

/* you may want to setup some decorations to active the item */ 
div.items div.active { 
border:1px inset #ccc; 
background-color:#fff; 
}

/* this makes it possible to add next button beside scrollable */
.scrollableartworkssample {
float:left; 
}
.scrollable {
float:left; 
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
background:url(../img/zombie/slidernav.png) no-repeat;
display:block;
width:55px;
height:151px;
float:left;
margin:80px 10px;
cursor:pointer;
font-size:1px;
}

/* right */
a.right { 
background-position: -171px 0px; 
clear:right; 
margin-right: 0px;
}
a.right:hover   { background-position: -58px 0px; }
a.right:active  { background-position: -56px 0px; } 


/* left */
a.left        { 
margin-left: 0px;
background-position:-113px 0; 
} 
a.left:hover  { background-position: 0px 0; }
a.left:active { background-position: -2px 0; }
/* sampleleft */
a.sampleleft        { 
margin-left: 250px;
background-position:-113px 0; 
} 
a.sampleleft:hover  { background-position: 0px 0; }
a.sampleleft:active { background-position: -2px 0; }

/* up and down */
/*
a.up, a.down    { 
background:url(../img/scrollable/arrow/vert_large.png) no-repeat; 
float: none;
margin: 10px 50px;
}
*/

/* up */
/*
a.up:hover      { background-position:-30px 0; }
a.up:active     { background-position:-60px 0; }
*/

/* down */
/*
a.down        { background-position: 0 -30px; }
a.down:hover  { background-position:-30px -30px; }
a.down:active { background-position:-60px -30px; } 
*/

/* disabled navigational button */
a.disabled {
visibility:hidden !important;   
}