html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
background-color:#000;  /* change this */
width:100%;
height:100%;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

a:hover{
text-decoration:none;
}

.title{
text-indent:-9999px;
display:none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}
.home{display:none}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* img, div, a, span, h2, blockquote { behavior: url(iepngfix.htc) } IE6 PNG FIX */


/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}

#wrapper{
width:960px;
height:737px;
margin:0 auto;
position:relative;
}

#home #wrapper{
background:url(images/background.jpg) no-repeat top left #000;
}

#firstlook #wrapper, #thestory #wrapper, #settings #wrapper, #characters #wrapper, #creatures #wrapper,#notes #wrapper,#trailer #wrapper{
background:url(images/background-main.jpg) no-repeat top left #000;
}


blockquote{
border-left:solid 2px  #DE4053;
margin-left:5px;
margin-right:5px;
margin-bottom:0px;
padding:2px;
padding-top:2px;
padding-left:5px;

}

#tiles{
height:200px;
width:245px;
margin:0 auto;
}

.dragme{
width:225px;
border: none;
height:20px;
background: none;
padding:5px;
margin:5px;


}

.dragme .move{
text-indent:-9999px;
outline:none;
height:15px;
width:15px;
background:none;
float:right;
margin-top:3px;
cursor:move;

}
.dragme:hover .move{
display:none;
}

.dragme:hover{
cursor:move;
background-color:#F6f6f6;
}

.imgright{
padding:5px;
background-color:#fff;
width:150px;
float:right;
margin-right:10px;
}

.imgleft{
padding:5px;
background-color:#fff;
width:150px;
float:left;
margin-right:10px;
}

a:link, a:visited{
color:#b51817;
}

.yellow, .green, .blue, .pink{
width:20px;
height:20px;
float:left;
display:block;
text-indent:-9999px;
outline:none;
margin:0 10px 0 10px;
border:#333333 solid 1px;
}

a.yellow:hover, a.green:hover, a.blue:hover, a.pink:hover{
border:#000000 dotted 1px;
}

.yellow{
background-color:#FFFF00;
}
.green{
background-color:#00FF00;
}
.blue{
background-color:#00FFFF;
}
.pink{
background-color:#FF66FF;
}

span:hover{
cursor: crosshair
}

#htool{
width:170px;
margin:0 auto;
padding:0px 10px 10px 10px;
background-color:#fff;
border:#ccc solid 1px;
overflow:hidden;

}

#questions{
display:none;
}

.refresh{
text-align:center;
text-transform:uppercase;
font-size:0.6em;
padding:0px;
margin:0px;
position:relative;
bottom:-5px;
}
.refresh a{
text-decoration:none;
}

.ref{
font-size:0.8em;
margin-top:0px;
margin-bottom:10px;
margin-left:13px;
}
.ref a{
text-decoration:none;
}

.ref a:hover{
text-decoration:none;
border-bottom: dotted 1px
}

a.next{
display:none;
}
a.next2{
display:none;
}

#main{
width:760px;
margin:30px auto;
}


#leftpage{
width:360px;
float:left;
}
#rightpage{
width:360px;
float:right;
}

#home #topnav{
background:none;
}

#topnav{
margin:0px auto;
padding-top:50px;
width: 830px;
position:relative;
background:url(images/title.png) no-repeat 0px 20px;
overflow:hidden;
}

.notes, .notesabs{
width:179px;
height:37px;
background:url(images/notes.png) no-repeat 0 0;
display:block;
text-indent:-9999px;
outline:none;
float:left;
margin-top:18px;
}
.notes:hover, .notesabs:hover{
background-position:0 -38px;
}
.notes:active, .notesabs:active{
background-position:0 -76px;
}

.notesabs{
display:none:
}




#topnav ul{
width:592px;
height:72px;
float:right;
list-style:none;
background:url(images/nav-bg.png) no-repeat top left;
margin:0;
padding:0px 0 0 17px;
position:relative;
}

#topnav ul li{
display:inline;
outline:none;
padding:0 0 0 0;margin:0;
position:relative;
}

#topnav ul li a{
outline:none;
text-indent:-9999px;
padding:0;
margin-top:25px;
}
.firstlook, .thestory, .settings, .characters, .creatures{
display:block;
height:21px;
float:left;
background:url(images/navtxt.png) no-repeat;

}

a.firstlook{
width:111px;
}
a.thestory{
width:107px;
background-position:-111px 0;
}
a.settings{
width:100px;
background-position:-218px 0;
}
a.characters{
width:132px;
background-position:-318px 0;
}
a.creatures{
width:107px;
background-position:-450px 0;
}


a.firstlook:hover, #firstlook a.firstlook{
background-position:0 -21px;
}
a.thestory:hover, #thestory a.thestory{
background-position:-111px -21px;
}
a.settings:hover, #settings a.settings{
background-position:-218px -21px;
}
a.characters:hover, #characters a.characters{
background-position:-318px -21px;
}
a.creatures:hover, #creatures a.creatures{
background-position:-450px -21px;
}


img {
border:medium none;
}

.galleryimg {
background:#FFFFFF none repeat scroll 0 0;
padding:4px;
border:1px solid #ccc ;
}

.videoimg {
background:#FFFFFF none repeat scroll 0 0;
padding:4px;
border:1px solid #ccc ;
}

.imgwrap{

margin:0 auto;
text-align:center;
width:308px;
}

.print{
display:none;
}

textarea{
background-color:#FFFFFF;
border:#CCCCCC 1px solid;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:13px;
padding:5px;
}
.textbox{
background-color:#FFFFFF;
border:#000 1px solid;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:10px;
padding:3px;
width:190px;
float:left;

}