body {
	background-color: #214152;
	margin: 0px 0px 0px 0px;
	text-align: center; /* for IE */
	height: 100%;
	}

/* ------------------------------------- Style Selector -----------------------------------------*/

#topbar {
	background-color: #000000;
	width: 100%;
	height: 60px;
	}
#topbarholder {
	width: 270px;
	margin: 0 auto;
	padding-top: 10px;
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	}
#clienttab {
	position: absolute;
	right: 5px;
	top: 0;
	width: 110px;
	height: 34px;
	background: url(/images_blue/selector_button.jpg) no-repeat top left;
	text-align: center;
	padding-top: 2px;
	cursor: pointer;
	}
#stylemenu { 
	width: 270px;
 	height: 24px;
 	background: url(/images/b_selector.gif);
 	margin: 0px auto; 
	padding: 0;
 	position: relative;
 	}
#stylemenu li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}
#stylemenu li, #stylemenu a {height: 24px; display: block;}
#style1 {left: 0; width: 90px;}
#style2 {left: 90px; width: 90px;}
#style3 {left: 180px; width: 90px;}

#style1 a:hover {background: transparent url(/images/b_selector.gif) 0 -24px no-repeat;}
#style2 a:hover {background: transparent url(/images/b_selector.gif) -90px -24px no-repeat;}
#style3 a:hover {background: transparent url(/images/b_selector.gif) -180px -24px no-repeat;}


/* ------------------------------------- Header -----------------------------------------*/

#headercontainer { 
	width: 100%; 
	height: 138px;
	margin: 0 auto;   
	background: #162e3b url(/images_blue/bg_header.jpg) repeat-x left top; 
	position:relative;
	}
#headergraphic { 
	width: 850px; 
	height: 138px; 
	text-align: left; 
	margin: 0 auto;  
	background: #162e3b url(/images_blue/header.jpg) no-repeat center top;
	}

/* ----------------------------------- Navigation ---------------------------------------*/

#navcontainer { 
	width: 100%; 
	height: 120px; 
	margin: 0 auto;  
	background: #008db7 url(/images_blue/bg_nav.jpg) repeat-x left top; 
	}
#navcentered { 
	width: 500px; 
	height: 120px;
	text-align: center;
	margin: 0 auto;  
	}
#navmenu { 
	width: 500px;
 	height: 120px;
 	background: url(/images_blue/nav_menu.jpg);
 	margin: 0px auto; 
	padding: 0;
 	position: relative;
 	}
#navmenu li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}
#navmenu li, #navmenu a {height: 120px; display: block;}
#nav1 {left: 0; width: 100px;}
#nav2 {left: 100px; width: 100px;}
#nav3 {left: 200px; width: 100px;}
#nav4 {left: 300px; width: 100px;}
#nav5 {left: 400px; width: 100px;}

#nav1 a:hover {background: transparent url(/images_blue/nav_menu.jpg) 0 -120px no-repeat;}
#nav2 a:hover {background: transparent url(/images_blue/nav_menu.jpg) -100px -120px no-repeat;}
#nav3 a:hover {background: transparent url(/images_blue/nav_menu.jpg) -200px -120px no-repeat;}
#nav4 a:hover {background: transparent url(/images_blue/nav_menu.jpg) -300px -120px no-repeat;}
#nav5 a:hover {background: transparent url(/images_blue/nav_menu.jpg) -400px -120px no-repeat;}

/* ------------------------------------ Content -----------------------------------------*/

#contentcontainer { 
	width: 100%;
	padding: 20px 0px 40px 0px;
	margin: 0 auto;   /* align for IE */
	background: #214152 url(/images_blue/bg_content.jpg) repeat-x left top; 
	}
#content { 
	width: 870px;
	text-align: left; 
	margin: 0 auto; 
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	color: #a8d3ed;
	}
#content a { color: #FFFFFF; }
#content a:hover { color: #d75b06; }
h1 {
	width: 270px;
	height: 50px;
	font: normal 24px verdana, "trebuchet MS", helvetica, sans-serif;
	color: #FFFFFF;
	margin: 0 auto;
	text-align:center;
	padding-top: 10px;
	padding-bottom: 20px;
	background: url(/images_blue/bg_h1.gif) no-repeat left top; 
	}
h2 {
	font: normal 18px verdana, "trebuchet MS", helvetica, sans-serif;
	color: #d8e7f0;
	padding: 15px 0px 3px 0px;
	}
.clear { clear: both; }

/* -------------------------------- Gallery Portfolio -----------------------------------*/

.portfoliocontainer { margin: 0 auto; width: 600px; padding: 30px 0 40px 0; }
.portfolio { width: 600px; }
.portfolio_image { width: 600px; padding: 12px 12px 12px 12px; background: #071923; }
.portfolio_image img { background: #071923 url(/images/loading.gif) no-repeat center center; }
.portfolio_info { float: left; width: 400px; padding: 7px 0 0 12px; font: 10px Verdana, Arial, Helvetica, sans-serif; color: #588098; }
.portfolio_title { font: 12px Verdana, Arial, Helvetica, sans-serif; color: #a8d3ed; line-height: 1em; margin: 0px 0px 13px 0px; }
.portfolio_views { float: right; width: 150px; padding: 5px 0 0 0; text-align: right; }
.portfolio_views a { font: 12px Verdana, Arial, Helvetica, sans-serif; color: #a8d3ed; text-decoration: none; }
.portfolio_views a:hover { color: #d75b06; }
img.nowrap { display: block; padding: 0; margin: 0; }

/* --------------------------------- FORM FIELDS ----------------------------------------*/

form#contact {background:none; width:800px; padding:10px; margin:5px auto; font: 1em verdana, arial, helvetica, sans-serif;}
form#contact p {font-size:.9em; color:#a8d3ed; text-align:left; padding:15px 5px 5px 0; margin:0;}
form#contact fieldset#current p {padding:4px; margin:0;}

form#contact fieldset {width:750px; display:block; background:#214152; border:1px solid #000000; padding:15px 5px 5px 10px; font: 1em verdana, sans-serif; margin-bottom:0.5em; line-height:1.5em; }

form#contact legend {font: normal 18px verdana, "trebuchet MS", helvetica, sans-serif; margin-bottom:10px; border:1px solid #000000; padding:6px; background:#214152; color:#d8e7f0;}
* html form#contact legend {padding:0 0 30px 0; margin:5px 0 0 0; border:0px solid #666;}

form#contact label {clear:left; display:block; float:left; width:180px; text-align:left; padding-right:10px; color:#a8d3ed; margin-bottom:0.5em;}

form#contact input {border:1px solid #000000; padding-left:0.5em; margin-bottom:0.6em; width:200px; background:#214152; color:#fff;}
form#contact input:hover {border:1px solid #d75b06;}
form#contact fieldset#details input, form#contact fieldset#current input {width:45px;}

form#contact select {margin:0 0 1em 0.5em;}
form#contact textarea {width:700px; height:15em; border:1px solid #000000; padding:0.5em; overflow:auto; background:#214152; color:#fff;}
form#contact textarea:hover {border:1px solid #d75b06;}

form#contact option {background:#fff; color:#214152;}
form#contact optgroup {background:#fff; color:#000; font-style:normal;}
form#contact optgroup option {background:#fff; color:#588098;}

form#contact #button1, form#contact #button2 {color:#fff; padding-right:0.5em; cursor:pointer; width:205px; margin-left:8px; background:#588098; border:1px solid; border-color:#000000;}
form#contact #button1:hover, form#contact #button2:hover {color:#fff; background:#d75b06; border:1px solid; border-color:#071923; }

/* ------------------------------------ Sitemap ------------------------------------------*/

#sitemap {
	font: 14px Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	}
#sitemap li {
	list-style-type: none;
	}
ul#sitemap > li {
	margin-bottom: 10px;
	}
#sitemap ul li {
	list-style-image:  url(/images/sitemap1_normal.gif);
	}
#sitemap ul li.firstfollow {
	list-style-image:  url(/images/sitemap1_first_follow.gif);
	}
#sitemap ul li.last {
	list-style-image:  url(/images/sitemap1_last_item.gif);
	}

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

#footer { 
	width: 100%; 
	padding: 30px 0px 0px 0px;
	height: 79px;
	margin: 0 auto;  
	background: #071923 url(/images_blue/bg_footer.jpg) repeat-x left top; 
	text-align: center;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #588098;
	}
#footer a { color: #588098;	text-decoration: none; }
#footer a:hover { color: #d8e7f0; text-decoration: underline; }