/* --------------------------------------------------------------------
	structure.css gives layout and styling for the overall page
	container and navigation.
   ------------------------------------------------------------------*/


 html {
	margin: 0;
	padding: 0;
	}
	
body, html { height:100%; }	
	
	
body {
	margin: 0px;
	padding: 0px;
	font-size: 11px; 
	font-family: lucida grande, tahoma, verdana, arial, helvetica, sans-serif;
	color: #666666;	
	background-image: url(images/tile-background.png);	
	text-align: center;	
	}

#wrapper {
	margin-right: auto;
	margin-left: auto;
	margin-top: 0px;
	margin-bottom: 0px;	
	padding: 30px;
	text-align: left;
	width: 902px;
	}		
	
html>body #wrapper { 
	width: 902px;
	}
	
#header {
	background: url(images/edgeTop.gif) no-repeat center top;
	width: 902px;
	height: 36px;
	margin-bottom: 0px;
	padding-bottom: -10px;
	overflow: hidden;
	vertical-align: middle;
	}
	
#footer {
	clear: both;
	text-align: center;	
	margin: 0;
	padding: 0;
	width: 902px;
	height: 26px;
	background: url(images/edgeBottom.gif) no-repeat bottom;
	}		
	
#footer p {
	color: #555;
	margin: 0px;
	padding-top: 5px;
	}	
	
	
	
/* ------------------------------ 
            navigation            
   ------------------------------*/	
	
#mainnav {
	width: 902px;
	height: 28px;
	background: #555555 url(images/navBg.gif) no-repeat;
	border-bottom: 1px solid #000000;
	margin: 0;
	padding: 0;
	overflow: hidden;		
	}		
	
#mainnav ul {
	margin: 0 0;
	padding-top: 0px;
	list-style-type: none;	
	font-size: 13px;
	padding: 0px 0px;
	}

#mainnav li {
	float:left;
	line-height: 0px;
	margin-top: 0;
	padding-top: 0;
	position: relative;
	z-index: 10;
	background-color: transparent;	
	text-align:center;	
	}	
	
	
#mainnav a:hover {
	background: url(images/navBgHover.gif) no-repeat top right;
	color: #FFFFFF;
	}

#mainnav a {
	/* border: 1px solid red; */	
	display: block;
	float: left;
	height: 4px;		/* height for IE 5 mac */
	color: #999999;
	text-decoration: none;
	white-space: nowrap;
	background: url(images/navBgEndBorder.gif) no-repeat top right;
	padding: 15px 10px 10px 10px;
	margin: 0;
	font-weight: normal;
	}
	
/* Commented Backslash Hack
     hides rule from IE5-Mac \*/
#mainnav a {
	height: 24px;		/* height for IE 5 win */
	padding: 15px 10 5px 10px;	
	height: 4px;			/* height for everyone else */
	}
/* End IE5-Mac hack */	


html>body #mainnav a { 
	height: 4px;			/* height for opera */
	}	
	
#current a, #current a:hover {	
	text-decoration: none;
	color: #FFFFFF;
	background: url(images/navBgEndBorder.gif) no-repeat top right;
	border-bottom: none;
	}
	
#current {
	height: 28px;
	background: url(images/navSelectedArrow2.gif) no-repeat top center;
	}  
	
.navHome {
	width: 48px;
	width: 43px;	
	}
	
html>body .navHome { 
	width: 43px;	/* width for opera */
	}	
	
/*  TEST NEW NAV CATEGORY ON OPERA + SAFARI   */
.navAbout {
	width: 65px;	
	width: 60px;		
	}
	
html>body .navAbout { 
	width: 60px;	/* width for opera */
	}
	

.navServices {
	width: 160px;	
	width: 155px;		
	}
	
html>body .navServices { 
	width: 155px;	/* width for opera */
	}		
	
.navMyWork {
	width: 65px;	
	width: 60px;		
	}
	
html>body .navMyWork { 
	width: 60px;	/* width for opera */
	}	
	
.navYourProject {
	width: 120px;
	width: 115px;	
	}
	
html>body .navYourProject { 
	width: 115px;	/* width for opera */
	}
	
.navContact {
	width: 60px;	
	width: 55px;	
	}	
	
html>body .navContact { 
	width: 55px;	/* width for opera */
	}
	
.navStore {
	width: 45px;	
	width: 40px;	
	}	
	
html>body .navStore { 
	width: 40px;	/* width for opera */
	}	

	
	
/* ------------------------------ 
          column structure        
   ------------------------------*/

#contentArea-3col {
	background: #ffffff url(images/tile-3columnbg.png) repeat-y top;
	border-left: 1px solid #666666;
	border-right: 1px solid #666666;
	margin: 0px 0 0 0;
	padding:0px;
	width: 900px;
	float: left;
	}
	
#contentArea-2col {
	background: #ffffff url(images/tile-2columnbg.png) repeat-y top;
	border-left: 1px solid #666666;
	border-right: 1px solid #666666;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	width: 900px;
	float: left;
	}
	
#contentAreaHeader {
	height: 22px;
	border-left: 1px solid #666666;
	border-right: 1px solid #666666;	
	background: #8f8f75 url(images/tile-headerTopEdge.gif) repeat-x top left;			
	}		

#leftColumn {
	float:left;
	width:225px;
	}
	
#centerColumn {
	border: 0px solid RED;
	background: url(images/content_bg_top.gif) no-repeat top left;
	float:left;
	padding: 40px 20px 40px 20px;
	width:410px;	
	}
	
#centerColumnWide {
	background: url(images/content_bg_top.gif) no-repeat top left;
/*	border: 1px solid RED;*/
	float:left;
	width:615px;
	padding: 40px 30px 40px 30px;	
	}	
	
#rightColumn {
	float:right;
	clear: right;
	width:225px;
	} 
	
				   








