* { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
:focus { outline: 0; }
body { line-height: 125%; color: black; background: white url(../images/bg_tile.jpg) top left repeat-x; font-family: "Century Gothic", Verdana; font-size: 12px; }
ul { list-style: none; }
a img,:link img,:visited img { border:none; }
.clearer {float: none; clear: both; line-height: 0; display: block; }
.btn { text-indent: -9999px; }
strong { font-weight: bold; }

/* main page container */
#container { width: 965px; margin: auto; position: relative; }

/* header styling */
#header { width: 965px; height: 172px; position: relative; }
#header #logo { position: absolute; top: 18px; left: 33px; width: 160px; height: 140px; display: block; background: url(../images/content/header/logo.png) top left no-repeat; z-index: 2; }
#header .text { position: absolute; top: 35px; right: 45px; width: 394px; height: 109px; background: url(../images/content/header/text.png) top left no-repeat; z-index: 2; }
#header #slideshow { width: 965px; height: 191px; z-index: 1; overflow: hidden; }

/* navigation styling */
#nav { position: absolute; top: 172px; left: 0px; width: 965px; height: 38px; background: url(../images/nav/nav.jpg) 0px 1px repeat-x; z-index: 2; }
#nav li a { height: 38px; display: block; float: left; line-height: 38px; text-align: middle; text-decoration: none; text-align: center; color: white; font-weight: bold; margin-left: 2px; padding: 0 21px; }
#nav li a:hover { color: black; }
#nav li a.selected { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; color: black; }
#nav li a.home { width: 60px; margin-left: 0; padding-left: 24px; }
#nav li a.home:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }
/*#nav li a.home.selected { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; color: black; }*/
#nav li a.about { width: 90px; }
#nav li a.about:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }
#nav li a.our_capacity { width: 90px; }
#nav li a.our_capacity:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }
#nav li a.products_services { width: 152px; }
#nav li a.products_services:hover { background: url(../images/nav/nav.jpg) -0px -38px repeat-x; }
#nav li a.awards { width: 75px; }
#nav li a.awards:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }
#nav li a.contact_us { width: 103px; }
#nav li a.contact_us:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }
#nav li a.client_login { width: 82px; padding-right: 25px; }
#nav li a.client_login:hover { background: url(../images/nav/nav.jpg) 0px -38px repeat-x; }

/* content styling */
#content { margin: 100px 50px 100px 25px; position: relative; }

/* content left area */
#content div.left { width: 550px; margin: 0 23px; color: #808285; float: left; padding-bottom: 30px; }
#content div.left.our_team { width: 800px; }
#content .left h1 { color: #558b32; font-size: 26px; margin-bottom: 20px; line-height: 1; }
#content .left h2, #content .left a.toggle { color: #558b32; font-size: 18px; margin-bottom: 10px; line-height: 1; display: block; }
#content .left h3 { font-weight: bold; margin-top: 10px; }
#content .left a { color: #558b32; }
#content .left a.toggle { font-size: 14px; }
#content .left span, #content .right span  { color: #558b32; }
#content .left p { padding: 5px 0; }
#content .left ul, #content .left ol { margin: 5px 5px 5px 15px; }
#content .left ul li, #content .left ol li { list-style: square; margin-left: 10px; margin-bottom: 5px; }
#content .left ol li { list-style: inherit; }
#content .left dl { margin-top: 20px; margin-bottom: 20px; }
#content .left dl dd { float: right; width: 70%; margin-bottom: 10px; }
#content .left dl dt { float: left; clear: both; width: 30%; font-style: italic; }
#content .left table.our_capacity { margin: 20px 0; }
#content .left table.our_capacity td.left { width: 30%; padding: 5px 0; color: #558b32; font-weight: bold; }
#content .left table.our_capacity td.right { width: 70%; padding: 5px 0; }
#content .left p.projects { margin-bottom: 15px; }
#content .left div.container { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #aaa; line-height: 125%; }
#content .left div.cv { width: 110px; float: left; margin-right: 10px; margin-bottom: 20px; margin-top: 10px; }
#content .left div.cv p { text-align: center; }
#content .left div.cv a { color: #558b32; }
#content .left .photos { position: absolute; top: 45px; right: -15px; background-color: #e8f3de; padding: 0px 15px 15px 15px; width: 150px; height: auto; }
#content .left .photos img { margin-top: 15px; }
#content .left p.projects_link { margin-bottom: 15px;}
#content .left #map { position: absolute; top: 0; right: 0; border: 5px solid #e8f3de; }

/* content right area */
#content div.right { width: 240px; height: 100%; color: #808285; float: right; }
#content .right h2 { color: #558b32; font-size: 18px; margin-bottom: 10px; margin-left: 20px; line-height: 1; }
#content .right .news { background-color: #e8f3de; width: 200px; padding: 10px 20px; margin-bottom: 15px; }
#content .right .news.about_us { width: 240px; }
#content .right .news p, #content .right .news a.toggle, #content .right .news ul li a { padding: 5px 0; font-size: 11px; color: #58595b; }
#content .right .news p a, #content .right .news ul li a { color: #558b32; }
#content .right .news a.toggle { font-weight: bold; color: #558b32; }
#content .right .news ul { padding-left: 15px; }
#content .right .news ul li { list-style: square; }


/* content bottom area */
#content .bottom { width: 844px; height: 80px; margin-top: 40px; padding: 15px 23px; background-color: #e8f3de; color: #808285; }
#content .bottom .image { float: right; color: #808285; width: 125px; text-align: right; margin-left: 27px; }
#content .bottom .image.left { margin: 0; float: right; }
#content .bottom .image a { text-decoration: none; color: #5d923f; font-size: 11px; }
#content .bottom .text { float: left; color: #558b32; }
#content .bottom h2 { font-size: 18px; margin: 20px 0 5px 0; font-weight: bold; }
#content .bottom h3 { font-size: 16px; font-weight: normal; margin-right: 0; margin-left: 0; }

/* footer */
#footer p { text-align: center; color: #999; font-size: 11px; padding: 10px 0; }

/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
#content div.scrollable { 
 
    /* required settings */ 
    position:relative; 
    overflow:hidden; 
    width: 429px; 
    height:70px;
    float: right; 
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a extremely large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
#content div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
} 
 
/* 
    a single item. must be floated in horizontal scrolling. 
    typically, this element is the one that *you* will style 
    the most. 
*/ 
#content div.scrollable div.items a { 
    float:left;
    margin-left: 27px; 
} 

#content div.scrollable div.items a.left_image { margin-left: 0; }
 
/* you may want to setup some decorations to active the item */ 
#content div.items div.active { 
    border:1px inset #ccc; 
    background-color:#fff; 
}

/* this makes it possible to add next button beside scrollable */
#content .scrollable {
	float: right;	
}

/* prev, next, prevPage and nextPage buttons */
#content a.browse {
	background:url(../images/content/hori_large.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	float:right;
	margin:25px 10px;
	cursor:pointer;
	font-size:1px;
}

/* right */
#content a.right 				{ background-position: 0 -30px; margin-right: 0px;}
#content a.right:hover 		{ background-position:-30px -30px; }
#content a.right:active 	{ background-position:-60px -30px; } 

/* left */
#content a.left				{ margin-left: 0px; } 
#content a.left:hover  		{ background-position:-30px 0; }
#content a.left:active  	{ background-position:-60px 0; }

/* disabled navigational button */
#content a.disabled {
	visibility:hidden !important;		
}

/* the overlayed element */ 
.simple_overlay { 
     
    /* must be initially hidden */ 
    display:none; 
     
    /* place overlay on top of other elements */ 
    z-index:10000; 
     
    /* styling */ 
    background-color:#333; 
     
    width:500px;     
    min-height:150px; 
    border:1px solid #666;
     
    /* CSS3 styling for latest browsers */ 
    -moz-box-shadow:0 0 90px 5px #000; 
    -webkit-box-shadow: 0 0 90px #000; 
	
	padding: 20px;
	color: #fff;
	line-height: 150%;
} 
 
/* close button positioned on upper right corner */ 
.simple_overlay .close { 
    background-image:url(/images/content/close.png); 
    position:absolute; 
    right:-15px; 
    top:-15px; 
    cursor:pointer; 
    height:35px; 
    width:35px; 
}

.simple_overlay p {
	margin: 10px 0;	
}