html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, img, ins, q, b, dl, dt, dd, ol, ul, li, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0 none;
	outline: 0;
	font-size: 100%;
	font-family: Arial, Verdana, Sans-serif;
	background: transparent;}
dl,ul,ol,li {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
pre {white-space: pre;}
:focus {outline: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
hr {display:none;}
option {padding-right:6px;} /* Firefox Fix */
html:first-child select{padding-right:6px; height:20px;} /* Opera 9 & Below Fix */ 
/* /e/ reset */

/*----- common -----*/
a:link, a:visited, a:active {text-decoration: none;}
img {border: 0 none;}

body {background: #000;}
#wrapper_out {background: #000 url(images/bg_main.jpg) no-repeat 50% 0;}
#wrapper_in {margin: 0 auto; position: relative; width: 1024px; height: 1100px; padding-bottom: 50px;}
h1#logo {background: transparent; display: block; text-indent: -9999px;}
#joinNow a {background: transparent; display: block; left: 256px; height: 186px; position: absolute; text-indent: -9999px; top: 128px; width: 184px;}
#joinNow_bottom a {background: transparent; display: block; left: 32px; height: 150px; position: absolute; text-indent: -9999px; top: 840px; width: 152px;}
h2#slogan {display: block; text-indent: -9999px;}

#topDiv {position: relative;}
#topDiv ul#features {left: 218px; position: absolute; top: 289px; width: 289px;}
#topDiv ul#features li {background: url(images/bullet.gif) no-repeat 0 4px; color: #eebc00; font-family: verdana; font-size: 12px; line-height: 14px; margin-top: 10px; padding-left: 15px;}
#topDiv #moviePlay {border: 1px solid #fff; display: block; height: 229px; left: 510px; position: absolute; top: 228px; width: 345px;}

#bottomDiv {background: url(images/box_bottom.gif) no-repeat left bottom; left: 188px; top: 532px; position: absolute; width: 696px;}
#bottomWrapper {background: url(images/box_top.gif) no-repeat left top;}
#bottomNav {height: 61px; left: 28px; overflow: hidden; position: relative; top: 31px; width: 649px;}
#bottomNav li {float: left; margin-right: 7px;}
#bottomNav li a {background: url(images/bottomNav.jpg) no-repeat 0 0; display: block; height: 61px; width: 209px; text-indent: -9999px;}
#bottomNav li a#story {background-position: 0 0;}
#bottomNav li a#characters {background-position: -216px 0;}
#bottomNav li a#screenshots {background-position: -433px 0;}
#bottomNav li a#story_on {background-position: 0 -61px;}
#bottomNav li a#characters_on {background-position: -216px -61px;}
#bottomNav li a#screenshots_on {background-position: -433px -61px;}

#bottomDiv .characters, #bottomDiv .screenshots {display: none;}
#bottomDiv #tabbedWrapper {margin: 40px 20px 22px;}
#bottomDiv .tabbed {color: #fff;}

#bottomDiv .story {background: url(images/bg_story.jpg) no-repeat right bottom; padding-top: 10px; height: 1%;}
#bottomDiv .story p {font-family: verdana; font-size: 12px; line-height: 16px; padding: 0 12px 22px;}
#bottomDiv .story p.last {padding-bottom: 35px}

#bottomDiv .characters #select {height: 109px; margin: 0 auto; overflow: hidden; position: relative; width: 600px;}
#bottomDiv .characters #select li {float: left; margin-right: 5px;}
#bottomDiv .characters #select li a {display: block; height: 109px; width: 95px; text-indent: -9999px;}
#bottomDiv .characters #select li.warrior a {background: url(images/sel_characters.jpg) no-repeat 0 0; left: 0; position: absolute; top: 0;}
#bottomDiv .characters #select li.blader a {background: url(images/sel_characters.jpg) no-repeat -100px 0; left: 100px; position: absolute; top: 0;}
#bottomDiv .characters #select li.wizard a {background: url(images/sel_characters.jpg) no-repeat -200px 0; left: 200px; position: absolute; top: 0;}
#bottomDiv .characters #select li.force_archer a {background: url(images/sel_characters.jpg) no-repeat -300px 0; left: 300px; position: absolute; top: 0;}
#bottomDiv .characters #select li.force_shielder a {background: url(images/sel_characters.jpg) no-repeat -400px 0; left: 400px; position: absolute; top: 0;}
#bottomDiv .characters #select li.force_blader a {background: url(images/sel_characters.jpg) no-repeat -500px 0; left: 500px; position: absolute; top: 0;}

#bottomDiv .characters #select li.warrior a.active {background-position: 0 -109px;}
#bottomDiv .characters #select li.blader a.active {background-position: -100px -109px;}
#bottomDiv .characters #select li.wizard a.active {background-position: -200px -109px;}
#bottomDiv .characters #select li.force_archer a.active {background-position: -300px -109px;}
#bottomDiv .characters #select li.force_shielder a.active {background-position: -400px -109px;}
#bottomDiv .characters #select li.force_blader a.active {background-position: -500px -109px;}

#bottomDiv .characters #desc {display: block; height: 327px; margin: 23px 0 0 30px; overflow: hidden; position: relative; width: 625px;}
#bottomDiv .characters #desc #warrior {background: url(images/bg_characters.jpg) no-repeat 0 0;}
#bottomDiv .characters #desc #blader {background: url(images/bg_characters.jpg) no-repeat 0 -327px; display: none;}
#bottomDiv .characters #desc #wizard {background: url(images/bg_characters.jpg) no-repeat 0 -654px; display: none;}
#bottomDiv .characters #desc #force_archer {background: url(images/bg_characters.jpg) no-repeat 0 -981px; display: none;}
#bottomDiv .characters #desc #force_shielder {background: url(images/bg_characters.jpg) no-repeat 0 -1308px; display: none;}
#bottomDiv .characters #desc #force_blader {background: url(images/bg_characters.jpg) no-repeat 0 -1635px; display: none;}

#bottomDiv .characters #desc div {color: #fff; height: 327px; position: relative;}
#bottomDiv .characters #desc div p {left: 0; font-family: verdana; font-size: 12px; line-height: 16px; position: absolute; top: 110px;}

#bottomDiv .screenshots {overflow: hidden; margin: 0 0 0 9px; padding-top: 5px; position: relative; width: 648px;}
#bottomDiv .screenshots .thumbs {display: block; float: left; height: 167px; margin: 0 8px 0 0; width: 208px;}
#bottomDiv .screenshots .thumbs img {height: 154px; width: 208px;}



/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
#TB_window {font: 12px verdana, Helvetica, sans-serif;color: #333333;}
#TB_secondLine {color:#fff; font: 10px verdana, Helvetica, sans-serif;}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {position: fixed;z-index:100;top: 0px;left: 0px;height:100%;width:100%;}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {background-color:#000;filter:alpha(opacity=75);-moz-opacity: 0.75;opacity: 0.75;}
* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {position: fixed;background: #000;z-index: 102;color:#000000;display:none;border: 4px solid #000;text-align:left;top:50%;left:50%;}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {display:block;margin: 15px 0 0 15px;}
#TB_caption{padding:11px 0 0 17px;float:left;}
#TB_closeWindow{height:25px;padding:11px 15px 10px 0;float:right;}

#TB_title{background-color:#e8e8e8;height:27px;}

#TB_load{position: fixed;display:none;height:13px;width:208px;z-index:103;top: 50%;left: 50%;margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{z-index:99;position:fixed;top: 0;left: 0;background-color:#fff;border:none;filter:alpha(opacity=0);-moz-opacity: 0;opacity: 0;height:100%;width:100%;}
* html #TB_HideSelect { /* ie6 hack */position: absolute;height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');}
#TB_iframeContent{clear:both;border:none;margin-bottom:-1px;margin-top:1px;_margin-bottom:1px;}

/* bryan */
#TB_closeWindowButton {background: url(images/close.gif) no-repeat; display: block; height: 18px; text-indent: -9999px; width: 63px;}
span#TB_ImageOff {position: relative;}
#TB_prev {background: url(images/prev.png) no-repeat; cursor: pointer; display: block; position: absolute; text-indent: -9999px; top: 200px; left: 35px; width: 64px; height: 64px;}
#TB_next {background: url(images/next.png) no-repeat; cursor: pointer; display: block; position: absolute; text-indent: -9999px; top: 200px; right: 35px; width: 64px; height: 64px;}