/*----------------------------------------------------------------------------*/
/*  main.css
/*  Author: Shawn Yeung, PushStart Studios Inc.
/*  Purpose: 4D Cityscape main css file
/*----------------------------------------------------------------------------*/

/******************************************************************************/
/*  Shared Formatting Elements
/******************************************************************************/
*, html, body { padding: 0; margin: 0; border: 0; }

body 
{
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #131313;
  background-image: url('/images/backgrounds/4d-bg.png');
  background-repeat: repeat-y;
  background-position: top center;
	color: #FFFFFF;
	text-align: center;
}

a { color: #FFFFFF; text-decoration: none; outline: none; }
a:hover { text-decoration: underline; }

img { border: 0; outline: none; }

#page
{
  display: block;
  width: 1000px;
  overflow: hidden;
  margin: 0 auto;
}

.block { width: 100%; overflow: hidden; }
.lefty { float: left; display: inline; }
.righty { float: right; display: inline; }
.blue { color: #00A1FF; }
.grey { color: #7F7F7F; }
.error { color: red; }
.clear 
{
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0; height: 0;
}

/******************************************************************************/
/*  Header
/******************************************************************************/
#header
{
  display: block;
  width: 1000px;
  height: 139px;
  margin: 0 auto;
  background-color: #FFFFFF;
  background-image: url('/images/headernav/header-bg.jpg');
  background-repeat: no-repeat;
  position: relative;  
}

#view-cart-fixed
{
  width: 100%;
  height: 33px;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}

#view-cart-container
{
  width: 1000px;
  height: 33px;
  margin: 0 auto;
}

#view-cart
{
  float: right;
  display: inline;
  width: 154px;
  height: 33px;
  background-image: url('/images/headernav/viewcart.png');
  background-repeat: no-repeat;
  background-position: 0 0;
  margin-right: 46px;
}
#view-cart:hover { background-position: 0 -33px; }

#header-logo
{
  display: block;
  width: 273px;
  height: 175px;
  background-image: url('/images/logos/logo.png');
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 27px;
  z-index: 10;
}

#header-assemble
{
  display: block;
  width: 295px;
  height: 43px;
  background-image: url('/images/headernav/assemble.png');
  background-repeat: no-repeat;
  position: absolute;
  bottom: 4px;
  right: 48px;
  z-index: 10;
}

#header-winner
{
  display: block;
  width: 192px;
  height: 142px;
  background-image: url('/images/headernav/winner.png');
  background-repeat: no-repeat;
  position: absolute;
  top: 12px;
  right: 0;
  z-index: 5;
}

/******************************************************************************/
/*  Navigation
/******************************************************************************/
#navibar
{
  display: block;
  width: 1000px;
  height: 36px;
  margin: 0 auto;
  background-image: url('/images/headernav/navi-bg.png');
  background-repeat: repeat-x;
  text-align: left;
}

#menu 
{
  float: left;
  display: inline;
  width: 550px;
  height: 24px;
	list-style:none;
	padding: 6px 0px;
  margin-left: 308px;
  margin-right: 8px;
	overflow: hidden;
}

#menu li
{
	float: left;
	display: inline;
  margin: 0px 11px;
	padding: 5px 8px 4px;
}

#menu li.backLava 
{
  display: block;
	position: absolute;
	background-color: #00A1FF;
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;  
	border-radius: 10px;
}
#menu li.selectedLava a { background-position: 0 -13px; }

#menu li a 
{
  display: block;
  height: 13px;
  position: relative;
	z-index: 5;
}

#menu li a:hover, #menu li a:active, #menu li a:visited { border: none; }

#navibar a.social
{
  float: left;
  display: inline;
  width: 23px;
  height: 23px;
  margin: 6px 3px 7px;
}
#navibar a.social:hover { margin: 4px 3px 9px; }

#navi-facebook { background-image: url('/images/headernav/fb.png'); background-repeat: no-repeat; }
#navi-twitter { background-image: url('/images/headernav/tt.png'); background-repeat: no-repeat; }
#navi-youtube { background-image: url('/images/headernav/youtube.png'); background-repeat: no-repeat; }

#nav-home 
{ 
  width: 58px;
  background-image: url('/images/headernav/nav-home.png'); 
  background-repeat: no-repeat; 
}
#nav-home:hover { background-position: 0 -13px; }
#nav-home:active { background-position: 0 -26px; }

#nav-what 
{ 
  width: 103px;
  background-image: url('/images/headernav/nav-what.png'); 
  background-repeat: no-repeat; 
}
#nav-what:hover { background-position: 0 -13px; }
#nav-what:active { background-position: 0 -26px; }

#nav-where 
{ 
  width: 124px;
  background-image: url('/images/headernav/nav-where.png'); 
  background-repeat: no-repeat; 
}
#nav-where:hover { background-position: 0 -13px; }
#nav-where:active { background-position: 0 -26px; }

#nav-contact 
{ 
  width: 105px;
  background-image: url('/images/headernav/nav-contact.png'); 
  background-repeat: no-repeat; 
}
#nav-contact:hover { background-position: 0 -13px; }
#nav-contact:active { background-position: 0 -26px; }

/******************************************************************************/
/*  Content Container
/******************************************************************************/
#container
{
  width: 1000px;
  margin: 0 auto;
  overflow: hidden;
  border-top: 1px solid #FFFFFF;
  border-bottom: 1px solid #FFFFFF;
  background-color: #001757; 
  background-image: url('/images/backgrounds/content-bg.png'); 
  background-repeat: repeat-y;
}

#content
{
  float: left;
  display: inline;
  width: 640px;
  padding: 17px 0;
}

/******************************************************************************/
/*  Sidebar
/******************************************************************************/
#sidebar
{
  float: right;
  display: inline;
  width: 256px;
  overflow: hidden;
  margin-right: 50px;
  padding: 17px;
  color: #000000;
  text-align: left;
}

#sidebar .side-header
{
  display: block;
  width: 194px;
  height: 43px;
  overflow: hidden;
  padding-left: 62px;
  padding-top: 7px;
  margin-bottom: 10px;
}

div.sidebar-contain { width: 100%; overflow: hidden; margin-bottom: 25px; }

#sidebar-youtube { background-image: url('/images/sidebar/youtube-sidebar.jpg'); background-repeat: no-repeat; }
#sidebar-facebook { background-image: url('/images/sidebar/facebook-sidebar.jpg'); background-repeat: no-repeat; }
#sidebar-testhead { background-image: url('/images/sidebar/testimonial-sidebar.png'); background-repeat: no-repeat; }
img.sidebar-testimonial { width: 256px; margin-bottom: 10px; }

#sidebar h1
{
  font-size: 18px;
  font-weight: normal;
	font-family: Lucida Sans Unicode, Lucida Grande, sans-serif;
  text-transform: uppercase;
	color: #FFFFFF;
	text-align: left;
	line-height: 1em;
}

/******************************************************************************/
/*  Footer
/******************************************************************************/
#footer
{
  width: 1000px;
  height: 93px;
  margin: 0 auto;
  background-image: url('/images/footer/footer-bg.jpg'); 
  background-repeat: no-repeat;
}

#backtotop
{
  float: right;
  display: inline;
  width: 92px;
  height: 18px;
  padding: 8px 0;
  margin-right: 50px;
  background-image: url('/images/footer/footer-arrow.png'); 
  background-repeat: no-repeat; 
  background-position: right center;
  font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color: #959494;
	text-align: left;
	text-decoration: none;
}
#backtotop:hover { color: #FFFFFF; }

#footer-copy
{
  width: 900px;
  overflow: hidden;
  margin: 5px auto;
  color: #959494;
}

#footer-copy a { color: #959494; text-decoration: underline; }
#footer-copy a:hover { color: #FFFFFF; text-decoration: none; }

/******************************************************************************/
/*  Query Loader
/******************************************************************************/
.QOverlay 
{
	background-color: #000000;
	z-index: 9999;
}

.QLoader 
{
	background-color: #FFFFFF;
	height: 2px;
}

.QAmt 
{
	color: #404040;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 60px;
	font-weight: normal;
	line-height: 70px;
	height: 70px;
	width: 100px;
	position: absolute;
	top: 205px;
	left: 18px;
}

.QTagline
{
  color: #009FFF;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
	font-weight: normal;
	line-height: 20px;
	height: 20px;
	text-align: left;
	position: absolute;
	top: 270px;
	left: 18px;
}

/*
.QTimeline
{
  color: #FFFFFF;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
	font-weight: normal;
	line-height: 12px;
	height: 12px;
  text-align: left;
	position: absolute;
	top: 315px;
	left: 19px;
}
*/