@charset "utf-8";
/* CSS Document */

body{
	background:#ffffff url(images/bg-main.png) repeat-x top;
    background-repeat:repeat-x;
    background-position:top center;
    overflow-x:hidden; 
	font: 12px Arial,"Helvetica",Tahoma,Verdana,Sans-Serif;
	color: #64767a;
	margin:0;	
	}
	

#mainframe{
	background:url(images/bg-shapes.png) top center no-repeat;	
	margin:0 auto;
	}

#headerframe{
	width:900px;
	margin:0 auto;
	}

#bodyframe{
	width:900px;
	margin:0 auto;
	background:#FFFFFF;
	}
	
	
/* --------- Universal Classes ---------- */	

.pad10{
	padding:10px;
	}
	
/* ------------- Modules -------------- */		

#header{
	float:left;
	width:900px;
	height:190px;
	margin:0 auto;
	margin-top:20px;
	}

#logo{
	width:680px;
	height:170px;
	background:url(images/logo.png) top left no-repeat;
	position:absolute;
	margin:20px 0px 0px -68px;
	}
	
#logo p{
	font-size:16px;
	font-weight:bold;
	color:#3999bc;
	margin:118px 0px 0px 155px;	
	}	
	
#stretch.head-top{
	float:left;
	height:73px;
	width:900px;
	background:url(images/bg-stretch1.png) repeat-x;
	}
	
#stretch.makesmall-1{
	height:50px;
	}	

#stretch.head-top img{
	float:right;
	margin:12px 5px 0px 0px;
	}		
	
	
/* ------------- Modules -------------- */	

#mod-1{
	float:left;
	background:url(images/bg-stretch2.png) bottom repeat-x;
	width:500px;
	height:150px;
	}
	
#mod-1 p{
	margin:10px 0px 0px 0px;
	}
	
#mod-2{
	float:left;
	background:url(images/bg-stretch2.png) bottom repeat-x;
	width:360px;
	height:150px;
	}	
	
#mod-2 img{
	border:0px;
	margin:15px 0px 0px 20px;
	}

/* ------------- Menu -------------- */

#menu{
	float:left;
	height:35px;
	width:900px;
	}

.menu{
	float:right;
	font-size:16px;
	font-family:Verdana,Helvetica,Arial,sans-serif;	
	color:#f8f8f8;
	text-decoration:none;
	font-weight:bold;
	}
                   
ul.menu {
list-style-type:none;
width:auto;
position:relative;
display:block;
height:33px;
border:0px solid #000;
margin:0;
padding:0;
}

ul.menu li {
display: inline; 
text-align: center;
float:left;
margin:0 6px 0 6px;
padding:0px 8px 0px 8px;
background:#64767a;
border-bottom:2px solid #4d5c5f;
}

ul.menu li:hover {
border-bottom:2px solid #8DCE00;
background:#4d5c5f;
}

ul.menu li a {
float:left;
height:24px;
padding:5px 0px 0px 0px;
color:#cccccc;
text-decoration:none;

}

ul.menu li a:hover,.current {
color:#ffffff;
text-decoration:none;
}

ul.menu .current a {
color:#000;
font-weight:700;
}
                 	
	

/* ------------- Insets -------------- */

#inset{
	float:left;
	width:880px;
	}
	
#projects{
	float:left;
	width:340px;
	margin-right:20px;
	padding-bottom:20px;
	}	

#column-1{
	float:left;
	width:600px;
	}

#column-2{
	float:left;
	width:500px;
	}		
		
#column-2.wide600{
	width:600px;
	}	
	
#column-2.wide260{
	width:260px;
	height:580px;
	float:right;
	margin-right:-10px;
	padding:50px 10px 0px 10px;
	background:#ffffff;
	color:#FFFFFF;
	}	

.sideBox1{
	width:260px;
	height:80px;
	background:#f0f4f7;	
	margin-top:10px;
	}
	
#projects.front{
	margin-top:-35px;
	margin-left:-10px;
	}

#projectitem{
	float:left;
	width:340px;
	margin-top:10px;
	background:#FFF;
	}
	
#projectitem.widefull{
	width:598px;}
	
#projectitem.bordered{
	border:solid 1px #dce2e3;
	}	
	
#projectitem:hover{
	background:#eff2f3;
	}	

#projectitem img{
	border:1px solid #000000;
	}

.imgholder{
	float:left;
	background:#dce2e3;
	padding:5px;
	margin-right:10px;
	}
		
#projectitem h2{
	margin:3px 0 0 0;
	padding:0px;
	font-size:12px;
	font-weight:bold;
	color:#8DCE00;
	}
	
#projectitem h2 a{
	margin:0px;
	padding:0px;
	text-decoration:none;
	color:#8DCE00;
	}			

#projectitem h2 a:hover{
	color:#000000;}

#projectitem h3{
	margin:0px;
	padding:0px;
	font-size:11px;
	}

#projectitem p{
	margin:5px 0 0 0;
	padding:0px;
	font-size:10px;
	}	
	
#projectitem h3 a, #projectitem p a{
	text-decoration:none;
	color:#64767a;
	}			
	

	
		
/* ------------- General Texts -------------- */
		
#generalitem{
	margin:10px 0 0 0;
	}
	
#generalitem img{
	float:right;
	}	
	
#generalitem p{
	padding:0px;
	margin:0px 0 0 0;
	}		
	
#generalitem h2{
	text-decoration:none;
	font-size:14px;
	color:#08AFD2;
	padding:0px;
	}	
	

/* ------------- News -------------- */
		
#newsitem{
	padding:0px 0px 0px 10px;
	}

#newsitem h2 a{
	text-decoration:none;
	font-size:14px;
	color:#08AFD2;
	padding:0px;
	}

#newsitem p{
	padding:0px;
	margin:-15px 0 0 0;
	}

#newsitem.side-blue{
	border-left:4px solid #53DDFA;
}

	
#newsitem.side-green{
	border-left:4px solid #8DCE00;
}

#newsitem.side-grey{
	border-left:4px solid #64767A;
}		
	

#newsitem.side-blue:hover,
#newsitem.side-green:hover,
#newsitem.side-grey:hover{
background:#F4FAFB;
}	
	
	
/* ------------- Text Images -------------- */

#text{
	width:200px;
	height:30px;
	}
	
.welcome{
	background:url(images/text-welcome.png) no-repeat;
	}
	
.thelatestnews{
	background:url(images/text-latestnews.png) no-repeat;
	margin-top:10px;
	}	
	
.thenews{
	background:url(images/text-news.png) no-repeat;
	margin-bottom:40px;
	}		

.latestprojects{
	background:url(images/text-latestprojects.png) no-repeat;
	}
	
.about{
	background:url(images/text-aboutus.png) no-repeat;
	}	

.services{
	background:url(images/text-services.png) no-repeat;
	}	

.products{
	background:url(images/text-products.png) no-repeat;
	}	
	
.portfolio{
	background:url(images/text-portfolio.png) no-repeat;
	margin-top:-10px;
	margin-bottom:20px;
	}		

.contact{
	background:url(images/text-contact.png) no-repeat;
	}


/* ------------- Backgrounds -------------- */

.grey{
	background:#F8F8FA;
	}
	

/* ------------- Footer -------------- */

#footerframe{
	background:#d7eea6 url(images/bg-footer.png) repeat-x;
	height:120px;
	}

#footer{
	width:900px;
	height:115px;
	margin:0 auto;		
	border-top:1px solid #006600;
	background:#d7eea6;
	}	
	
#footer p{
	color:#339900;
	float:right;
	margin:10px 10px 0px 0px;
	}	
	
	
	
	
	
	
	
/* 
--------------- COLOR PALLETS ----------------

	#64767A - Dark Grey
	#F8F8FA - Light Grey
	#53DDFA - Bright Blue
	#08AFD2 - Logo Blue
	#006600 - Dark Green
	#8DCE00 - Lime Green
	#D7EEA6 - Light Green
	
	
---------------------------------------------- */