/* CSS Document */


/* ////////////////////////////////////// RESET /////////////////////////////////////// */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, 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,
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-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
html, body {
	height:100%;
}

body {
	line-height: 1;
	color: #333333;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/* /////////////////////////////////////////////////////////////////////////////////////// */



/* /////////////////////////////////////// GLOBAL //////////////////////////////////////// */
 
.clear         { clear:both; }
div.clear	   { clear:both; line-height:0; height:0; border:none; margin:0 !important; padding:0 !important; }
div.clear img  { margin:0 !important; padding:0 !important; border:none !important; }
 
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left; }
.text-right    { text-align:right; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
.caps		   { text-transform:uppercase; }
.light		   { color:#999999; }
 
.img-left      { float:left; margin:4px 18px 6px 0; }
.img-right     { float:right; margin:4px 0 6px 18px; }
 
.nopadding     { padding:0; }
.nomargin	   { margin:0; 	}
.nospace	   { margin:0; padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }
.nounderline   { text-decoration:none !important; }

.width100 	   { width: 100%; }
.width75 	   { width: 75%; }
.width50 	   { width: 50%; }

/* /////////////////////////////////////////////////////////////////////////////////////// */



/* ///////////////////////////////////// Typography ////////////////////////////////////// */

body, p, td, li, div, input, textbox {
	font:12px/16px "Tahoma", Tahoma, Arial, Helvetica, sans-serif;
	color:#FFFFFF;
}

p, li {
	margin:0 0 6px 0; padding: 0;
}

a, a:link, a:visited, a:active {
	color: #1fb7ca;
}

a:hover {
	color: #5de1f1;
}

h1, h2, h3, h4, h5 {
	
}

h1 {  }

h2 {  } 

h3, h4 {  }

h5 { }

strong { font-weight:  bold; }
em, i { font-style: italic; }

/* ///////////////////////////////////////////////////////////////////////////////////////// */



/* /////////////////////////////////// Primary Structure /////////////////////////////////// */

body {
	background: #6a006e url(../images/background_main.gif) repeat-x top left;
}

#wrapper_top {
	position: relative; overflow: hidden; width:100%; height:625px; min-width: 980px; margin: 0; padding: 0; 
	background: transparent url(../images/background_feature_bottom.gif) no-repeat bottom center;
}

#wrapper_bottom {
	position: relative; width:100%; min-height:475px; min-width: 980px; margin: 0; padding: 0;
	background: transparent url(../images/background_content.jpg) no-repeat top center;
}

#feature_wrapper {
	position: relative; width: 980px; height: 615px; margin: 0 auto; padding: 0;
}

#feature {
	position: relative; width: 1280px; height: 615px; margin: 0 -150px; padding: 0;	
}

#content {
	position: relative; width: 940px; margin: 0 auto; padding: 0; clear: both;
}

#footer_outer {
	position: relative; width:100%; height:125px; min-width: 980px; margin: 0 0 0 0; padding: 0; overflow: hidden;
	background: transparent url(../images/background_footer.gif) repeat-x bottom left;
}

#footer_inner {
	position: relative; width:100%; height: 60px; margin: 65px 0 0 0; padding: 0;
	-moz-box-shadow: 0 -3px 7px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 -3px 7px rgba(0, 0, 0, 0.2);
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
	/* For IE 8 */
	/* -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=-90, Color='#000000')"; */
	/* For IE 5.5 - 7 */
	/* filter: progid:DXImageTransform.Microsoft.Shadow(Strength=5, Direction=-90, Color='#000000'); */
}

/* /////////////////////////////////////////////////////////////////////////////////////// */



/* /////////////////////////////////////// Feature / Head //////////////////////////////////////// */

#spacer_left {
	width: 170px; margin: 0; padding: 0;
	background: transparent url(../images/background_feature_left.gif) no-repeat bottom right;
}

#spacer_right {
	width: 170px; margin: 0; padding: 0;
	background: transparent url(../images/background_feature_right.gif) no-repeat bottom left;
}

#logo {
	width:586px; height:155px; margin: 0; padding:0;
	background: transparent url(../images/background_feature_logo.jpg) no-repeat;
}

#logo h1, #logo h2 {
	margin: 0; padding: 0; width:586px; height:155px;
}

#logo a:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

#quote_left {
	float:left; width:190px; height: 155px; margin: 0; padding: 0;
	background: transparent url(../images/background_feature_quote-left.gif) no-repeat;
}

#quote_left li {
	margin: 0; padding: 0; width:190px; height: 155px;
}

#quote_right {
	float:left; width:164px; height: 155px; margin: 0; padding: 0;
	background: transparent url(../images/background_feature_quote-right.gif) no-repeat;
}

#quote_right li {
	margin: 0; padding: 0; width:164px; height: 155px;
}

#quote_right ul, #quote_left uli {
	margin: 0; padding: 0; list-style-type: none;
}

#quote_right li, #quote_left li {
	display: none;
}

#quote_right li:first-child, #quote_left li:first-child {
	display: block;
}

/* /////////////////////////////////////////////////////////////////////////////////////// */



/* /////////////////////////////////////// Feature / Main //////////////////////////////////////// */

#main {
	position:relative;	width: 940px; height: 460px; margin: 0; padding: 0;
	background: transparent url(../images/background_feature_main.jpg) no-repeat;
}

#appstore {
	position:relative; z-index: 50; width:220px; height:100px; left:535px; top:50px; margin: 0; padding: 0;
	background: transparent url(../images/button_appstore_background.gif) no-repeat;
}

#appstore a {
	display: block; width: 220px; height: 100px; margin: 0; padding: 0;
	border: none; text-decoration: none; text-indent: -9999em;
}

#appstore a.b1 {
	background-image: url(../images/button_appstore-1.png);
}

#appstore a.b2 {
	background-image: url(../images/button_appstore-2.png);
	display: none;
}


#appstore a:hover {
	background-image: url(../images/button_appstore_over.png);
}


#main #price {
	position:relative; z-index: 75; width:70px; height:70px; left:679px; top:53px; margin: 0; padding: 0;
}

#main #price a, #main #price a img {
	border: none; text-decoration: none;
}

#main #price a:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

#main #video {
	position:relative; z-index: 100; width:360px; height:240px; left:291px; top:34px; margin:0; padding:0;
}



/* /////////////////////////////////////////////////////////////////////////////////////// */




/* //////////////////////////////////////// Social /////////////////////////////////////// */

#social {
	width: 940px; height: 40px; margin: 30px auto 40px; padding: 0;
}

#socil ul {
	width: 940px; height: 40px; margin: 0; padding: 0; list-style-type: none;
}

#social li {
	float:left; height: 32px; margin: 3px 46px 3px 0; padding: 0;
}

#social li.rate {
	float:left; height: 40px; margin: 0 0 0 3px !important; padding: 0;
}

#social a, #social img {
	border: none; text-decoration: none;
}

#social a:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

/* /////////////////////////////////////////////////////////////////////////////////////// */


/* ////////////////////////////////////// Game Editions ///////////////////////////////// */

#editions {
	width: 940px; height: 48px; margin: 50px auto 80px; padding: 0;
}

#editions ul {
	width: 940px; height: 48px; margin: 0; padding: 0; list-style-type: none;
}

#editions li {
	float:left; height: auto; margin: 0; padding: 0;
}

#editions a, #editions img {
	border: none; text-decoration: none;
}

#editions a:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}


#editions li.nowavailable { margin: 0 45px 0 -8px; padding: 0; }
#editions li.barstar { margin: -5px 50px 0 0; padding: 0; }
#editions li.barstarHD { margin: -15px 50px 0 0; padding: 0; }
#editions li.barstarVIP { margin: -5px 50px 0 0; padding: 0; }
#editions li.getthegame { margin: 10px 0 0 0; padding: 0; }

#editions li.getthegame a {
	display: block; width: 220px; height: 48px; margin: 0; padding: 0;
	background: transparent url(../images/button_getnow2.png) no-repeat;
	text-indent: -9999em; text-decoration: none;
}


#editions li.getthegame a:hover {
	background: transparent url(../images/button_getnow2_over.png) no-repeat;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	-moz-opacity:1;
	-khtml-opacity: 15;
	opacity: 1;
}

/* /////////////////////////////////////////////////////////////////////////////////////// */




/* /////////////////////////////////////// Columns  ////////////////////////////////////// */

div.col {
	float: left; width: 286px; min-height: 500px; margin: 0 41px 10px 0; padding: 0;
}

div.textbox {
	position: relative; width: 286px; margin: 0 0 25px 0; padding: 10px 0 0 0;
	background: transparent url(../images/text-box_background-top.jpg) no-repeat top left;
}

div.textbox div.mid {
	width: 286px; height: auto; margin: 0; padding: 0;
	background: transparent url(../images/text-box_background-mid.jpg) repeat-y top left;
}

div.textbox div.bottom {
	width: 286px; height: 10px; margin: 0; padding: 0;
	background: transparent url(../images/text-box_background-bottom.jpg) no-repeat top left;
}

div.textbox p, #leftcol #text3 p {
	margin: 0;	padding:0 20px 4px;
	color: #FFFFFF; font-size: 12px; line-height: 22px;
	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}

div.textbox ul {
	margin: 0;	padding:0 20px;
}

div.textbox li {
	margin: 0 0 0 -4px; padding: 2px 0 6px 25px;
	color: #FFFFFF; font-size: 12px; line-height: 16px;
	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
	background: transparent url(../images/bullet-lime.png) no-repeat 0 6px;
}

div.textbox p strong {
	font-weight: bold; color: #1fb7ca;
}

div.textbox li strong {
	font-weight: bold;
}


div.textbox h3 {
	color:#1FB7CA;
	font-size:14px;
	font-weight:bold;
	margin:0 0 8px 18px;
	padding:4px 0 0;
}


h2.title {
	margin: 0 0 15px 0; padding: 0;
}


/* left column */

#leftcol {
	
}

#leftcol #text1 p {
	font-size: 14px;
	padding-right: 45px;
}

#leftcol #text1 div.bling {
	position: absolute; top:-30px; right: -25px;
}

#leftcol #text2 p {
	text-align: right;
	padding-left: 75px;
}

#leftcol #text2 div.bling {
	position:absolute; left:-15px; top:-10px;
}

#leftcol #text3 {
	width: 340px; height: 230px; margin: -5px 0 0 0; padding: 0;
	background: transparent url(../images/text-box-chase_background.jpg) no-repeat;
}

#leftcol #text3 p {
	padding: 20px 135px 0 20px;
}


/* mid column */

#midcol {
	
}

#midcol #list1 div.bling {
	position: absolute; bottom:-15px; right: -30px;
}



/* right column */

#rightcol {
	margin: -50px 0 10px 0 !important;
}


#screenshots a.screenshot {
	display: block; width: 282px; height: 188px; margin: 0 0 39px; padding: 0;
	border: 2px solid #FFFFFF; text-decoration: none;
	-moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
	/* For IE 8 */
	/* -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color='#000000')"; */
	/* For IE 5.5 - 7 */
	/* filter: progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color='#000000'); */
}

#screenshots a.screenshot.hidden {
	display: none;
}



/* Quotes */

#quotes {
	width: 600px; height: 150px; margin: -20px auto 0; padding: 0;
	position: relative;
}

#quotes ul {
	width: 600px; height: 150px; margin: 0; padding: 0; list-style-type: none;
}

#quotes li {
	display:none; width: 600px; height: 150px; margin: 0; padding: 0; text-align: center; vertical-align: middle;
	color: #FFFFFF; font-size: 14px; line-height:22px;
	text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3), 0 0 12px rgba(239, 204, 250, 0.8);
}

#quotes li:first-child {
	display: block
}


/* /////////////////////////////////////////////////////////////////////////////////////// */




/* ////////////////////////////////////// Footer ///////////////////////////////////////// */


#footer_items {
	position: relative; width:938px; height: 60px; margin: 0 auto; padding: 0 20px;
	border-left: 1px solid #5a6b8c; border-right: 1px solid #5a6b8c; 
}

#footer_items div {
	float: left;
}

#footer_items, #footer_items p, #footer_items a {
	color: #003e44; font-size: 12px;
}

#footer_items a:hover {
	color: #2b7178;
}

#footer_items #glitchsoft a, #footer_items #glitchsoft img {
	text-decoration: none; border: none;
}

#footer_items #glitchsoft a:hover {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

/*
#footer_items #footer_nav {
	width: 688px; height: 60px; margin: 0 0 0 20px; padding: 0 0 0 20px;
}
*/

#footer_items #footer_nav {
	height:60px; width:940px; margin:0; padding:0;
}

#footer_items #leftbling {
	position: absolute; float: none; left: 180px; top:-65px;
}

#footer_items #rightbling {
	position: absolute; float: none; right:70px; top:-60px;
}

/*
#footer_items #copyright p {
	width: 660px; margin: 25px 0 0 0; text-align: center;
}
*/

#footer_items #copyright p {
	width:940px; margin:25px 0 0; text-align:center;
}

/* /////////////////////////////////////////////////////////////////////////////////////// */





/* ///////////////////////////////// jQuery ColorBox ///////////////////////////////////// */

/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(../images/colorbox/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(../images/colorbox/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(../images/colorbox/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(../images/colorbox/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(../images/colorbox/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(../images/colorbox/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(../images/colorbox/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#1fb7ca;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(../images/colorbox/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../images/colorbox/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(../images/colorbox/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(../images/colorbox/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(../images/colorbox/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    The following fixes png-transparency for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/colorbox/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}

