/* =================================================== */
/* This css file specifies the site structure style    */
/* settings for the Datasphere-Systems.com website     */
/* =================================================== */

/*---------------------------------------------------*/
/* Design Company      = DsS:VisionTECH              */
/* Design Consultant   = Rhys Faler                  */
/* Contact Information = designer@dss-visiontech.com */
/*---------------------------------------------------*/

	 
/* ---------------------- */
/* General Site Framework */
/* -----------------------*/   /*------------------------------------------------------------------------------------ */


html {
   background-image: url('media/background.jpg');
	 background-color: #000000;
	 background-position: center center;
	 background-repeat: no-repeat;
	 height: 101%
   }

body {
	 width: 100%;
	 margin: 0 auto;
   height: 100%;
	 background-image: url('media/gui.png');
	 background-position: center center;
	 background-repeat: no-repeat;	
   }	 

#width_960 {
   width: 960px;
	 margin: 0 auto;
	 height: 0px;
   }	 
	 
/*  creates a container in conjuction with #gui to vertically center the page */
#horizon {
   position: absolute;
	 top: 50%;
	 width: 100%;
   }

/*  horizontally centers the page and also defines a container in conjuction with #horizon to vertically center the page */	 
#gui {
	 margin: 0 auto;
	 width: 940px;
	 height: 401px;
	 margin-top: -197px;
   }

/* defines the center sub-section of the gui */	 
#gui_center {
   float: right;
   width: 670px;
	 height: 401px;
   }

/* defines 2 of the 3 sub-sections of the gui */
#gui_sidebar {	 
	 width: 125px;
	 height: 401px;
   }
	 
/* defines the right sub-section of the gui */	 
.gui_sidebar_right {
	 float: right;
	 padding-top: 10px;
	 padding-left: 8px;
   }
	 
/* defines the left sub-section of the gui */	 
.gui_sidebar_left {
	 float: left;
	 padding-top: 10px;
	 padding-left: 9px;
   }

/* defines the area within the gui_center that displays the site content */	 
#content {
	 width: 520px;
	 height: 368px;
	 margin: 0 auto;
	 color: #FFFB2B;
	 overflow: hidden;
   }
	
 
/* ---------------------------- */
/* Sidebar Navigation Framework */
/* -----------------------------*/   /*------------------------------------------------------------------------------------ */


#placeholder_1 {
   width: 117px;
	 height: 89px;
   }
	 
#placeholder_2 {
   width: 82px;
	 height: 89px;
	 margin-top: 10px;
   }
	 
#placeholder_3 {
   width: 82px;
	 height: 89px;
	 margin-top: 10px;
   }
	 
#placeholder_4 {
   width: 117px;
	 height: 89px;
	 margin-top: 10px;
   }
	 
#placeholder_5 {
   width: 117px;
	 height: 89px;
   }

#placeholder_6 {
   width: 82px;
	 height: 89px;
	 margin-top: 10px;
	 margin-left: 35px;
   }
	 
#placeholder_7 {
   width: 82px;
	 height: 89px;
	 margin-top: 10px;
	 margin-left: 35px;
   }
	 
#placeholder_8 {
   width: 117px;
	 height: 89px;
	 margin-top: 10px;
   }

#button_1 {
   background: url('media/button1.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 117px;
	 height: 89px;
	 text-decoration: none;
	 }
	 
#button_2 {
   background: url('media/button2.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 82px;
	 height: 89px;
	 text-decoration: none;
	 }
	 
#button_3 {
   background: url('media/button3.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 82px;
	 height: 89px;
	 text-decoration: none;
	 }

#button_4 {
   background: url('media/button4.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 117px;
	 height: 89px;
	 text-decoration: none;
	 }

#button_5 {
   background: url('media/button5.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 117px;
	 height: 89px;
	 text-decoration: none;
	 }

#button_6 {
   background: url('media/button6.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 82px;
	 height: 89px;
	 text-decoration: none;
	 }
	 
#button_7 {
   background: url('media/button7.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 82px;
	 height: 89px;
	 text-decoration: none;
	 }

#button_8 {
   background: url('media/button8.png');
	 background-repeat: no-repeat;
	 background-position: 0px 0px;
   border-style: none;
   width: 117px;
	 height: 89px;
	 text-decoration: none;
	 }


/* ----------- */   /*------------------------------------------------------------------------------------ */
/* End of File */
/* ----------- */