/* ======================== Common style =============================== */

* {
	margin:0;
	padding:0
}
img {
	border:none
}
fieldset {
	border:none
}
a {
	color:#fff;
	text-decoration:none
}
a:hover {
	text-decoration:underline
}
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	background: #010101 url(../images/bg.jpg) no-repeat top center
}
/* ======================== wrapper style =============================== */



#wrapper {
	width:848px;
	margin:0 auto
}
#header {
	width:848px;
	float:left
}

#header .logo {
	float:left;
	z-index:2;
	position:relative
}
	
	
#header #menu {
	width:848px;
	float:left;
	height:31px;
	margin:-13px 0 10px 0;
	position:relative;
	z-index:1;
	padding:15px 0 0 0
}
#header #menu ul {
	width:600px;
	float:right;
	list-style:none
}
#header #menu ul li {
	float:left
}
#header #menu ul li a.home {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat 0 0;
	width:90px;
	height:24px;
}

#header #menu ul li a div.homeFade {
	float:left;
	background:transparent;
	background:url(../images/menu_sprite.png) no-repeat 0 -29px;
	width:90px;
	height:24px;
	opacity: 0;	
}

#header #menu ul li a.portfolio {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -100px 0;
	width:140px;
	height:26px;
}
#header #menu ul li a div.portfolioFade {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -100px -29px;
	width:140px;
	height:26px;
	opacity: 0;
}
#header #menu ul li a.services {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -250px 0;
	width:100px;
	height:24px;
}
#header #menu ul li a div.servicesFade {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -250px -29px;
	width:100px;
	height:24px;
	opacity: 0;
}
#header #menu ul li a.about {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -360px 0;
	width:140px;
	height:24px;
}
#header #menu ul li a div.aboutFade {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -360px -29px;
	width:140px;
	height:24px;
	opacity: 0;
}
#header #menu ul li a.contact {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -500px 0;
	width:100px;
	height:24px;
}
#header #menu ul li a div.contactFade {
	float:left;
	background:url(../images/menu_sprite.png) no-repeat -500px -29px;
	width:100px;
	height:24px;
	opacity: 0;
}
#banner_container {
	width:848px;
	float:left;
	background:url(../images/banner_bg.png) repeat-x 0 0;
	height:318px;
	margin:0 0 10px 0
}

#banner_container_portfolio {
	width:848px;
	float:left;
	background:url(../images/portfolio_bg.jpg) repeat-x 0 0;
	height:600px;
	margin:0 0 10px 0
}

#body_container {
	width:848px;
	float:left
}
#bottom_container {
	width:848px;
	float:left;
	background:url(../images/bottom_bg.jpg) no-repeat 0 0;
	height:290px;
	padding:15px 0;
	color:#fff
}
#bottom_container ul {
	list-style:none;
}
#bottom_container h3 {
	margin:0 0 10px 0
}
#bottom_container .box1 {
	float:left;
	width:205px;
	padding:0 10px 0 50px
}
#bottom_container .box1 h3 {
	float:left;
	width:205px
}
#bottom_container .box1 ul {
	float:left;
	width:205px;
	list-style:none
}
#bottom_container .box1 ul li {
	float:left;
	width:205px;
	padding:0 0 8px 0
}
#bottom_container .box2 {
	float:left;
	width:260px;
	padding:0 30px
}
#bottom_container .box3 {
	float:left;
	width:202px;
	padding:0 30px 0 30px
}
#bottom_container .box3 ul {
	float:left;
	width:202px;
}
#bottom_container .box3 ul li {
	padding:0 0 15px 0;
	line-height:20px
}
#bottom_container .box3 ul li a.quote {
	float:left;
	background:url(../images/button_sprite.gif) no-repeat 0 0;
	width:201px;
	height:50px;
}
#bottom_container .box3 ul li a.quote:hover {
	float:left;
	background:url(../images/button_sprite.gif) no-repeat -215px 0;
	width:201px;
	height:50px;
}
#bottom_container .box3 ul li a.customer {
	float:left;
	background:url(../images/button_sprite.gif) no-repeat 0 -55px;
	width:201px;
	height:50px;
}
#bottom_container .box3 ul li a.customer:hover {
	float:left;
	background:url(../images/button_sprite.gif) no-repeat -215px -55px;
	width:201px;
	height:50px;
}

#about_body_container {
	width:848px;
	float:left
}

#about_container {
	width:848px;
	float:left;
	background:url(../images/about_01.jpg) repeat-x 0 0;
	height:232px;
	margin:0 0 10px 0;
	text-align:justify;
	color:#fff;
	line-height:20px;
	list-style:none;
}

#about_bottom_container {
	width:848px;
	float:left;
	background:url(../images/about_bottom.jpg) no-repeat 0 0;
	height:353px;
	padding:15px 0 0 15px;
	text-align:justify;
	color:#fff
}
#about_bottom_container ul {
	list-style:none;
}

#about_container .box1 {
	float:left;
	width:342px;
	padding:30px 10px 0 30px;
}

#about_container .box1 ul {
	float:left;
	list-style:none;
}
#about_container .box1 ul li {
	padding:0 0 15px 0;
	line-height:20px;
	list-style:none;
}

#about_container .box2 {
	float:right;
	width:406px;
	padding:30px 30px 0 10px
}

#about_container .box2 ul {
	float:left;
	list-style:none;
}
#about_container .box2 ul li {
	padding:0 0 15px 0;
	line-height:20px;
	list-style:none;
}


#about_bottom_container .box3 {
	float:right;
	width:546px;
	padding:0 40px 0 30px
}
#about_bottom_container .box3 ul {
	float:left;
}
#about_bottom_container .box3 ul li {
	padding:0 0 15px 0;
	line-height:23px
}




#services_container {
	width:848px;
	float:left;
	height:696px;
	margin:0 0 0 0;
	text-align:justify;
	color:#fff;
	list-style:none;
}

#services_container .box1 {
	background:url(../images/services_webdesign.jpg) repeat-x 0 0;
	float:left;
	width:401px;
	height:232px;
	padding:0px 0px 0 0px;
}

#services_container .box1 ul {
	float:left;
	list-style:none;
}
#services_container .box1 ul li {
	padding:0 0 0 0;
	line-height:0px;
	list-style:none;
}

#services_container .box2 {
	background:url(../images/services_webdesign_bg.jpg) repeat-x 0 0;
	float:left;
	width:417px;
	height:232px;
	padding:0px 10px 0px 20px;
}

#services_container .box2 ul {
	float:left;
	list-style:none;
}
#services_container .box2 ul li {
	padding:0 0 0px 0;
	line-height:20px;
	list-style:none;
}



#services_container .box3 {
	background:url(../images/service_marketing.jpg) repeat-x 0 0;
	float:left;
	width:401px;
	height:232px;
	padding:0px 0px 0px 0px;
}

#services_container .box3 ul {
	float:left;
	list-style:none;
}
#services_container .box3 ul li {
	padding:0 0 0 0;
	line-height:0px;
	list-style:none;
}

#services_container .box4 {
	background:url(../images/service_marketing_bg.jpg) repeat-x 0 0;
	float:left;
	width:417px;
	height:232px;
	padding:0px 10px 0px 20px;
}

#services_container .box4 ul {
	float:left;
	list-style:none;
}
#services_container .box4 ul li {
	padding:0 0 0px 0;
	line-height:20px;
	list-style:none;
}




#services_container .box5 {
	background:url(../images/service_flash_bg.jpg) repeat-x 0 0;
	float:left;
	width:401px;
	height:232px;
	padding:0px 0px 0 0px;
}

#services_container .box5 ul {
	float:left;
	list-style:none;
}
#services_container .box5 ul li {
	padding:0 0 0 0;
	line-height:0px;
	list-style:none;
}

#services_container .box6 {
	background:url(../images/service_flash_bg.jpg) repeat-x 0 0;
	float:left;
	width:417px;
	height:232px;
	padding:0px 10px 0px 20px;
}

#services_container .box6 ul {
	float:left;
	list-style:none;
}
#services_container .box6 ul li {
	padding:0px 0 0px 0;
	line-height:20px;
	list-style:none;
}







#contact_container {
	width:848px;
	float:left;
	background:url(../images/about_01b.jpg) repeat-x 0 0;
	height:232px;
	margin:0 0 10px 0;
	text-align:justify;
	color:#fff;
	list-style:none;
}

#contact_bottom_container {
	width:848px;
	float:left;
	background:url(../images/contact_bg.jpg) no-repeat 0 0;
	height:401px;
	padding:15px 0 0 15px;
	text-align:justify;
	color:#fff
}

#contact_bottom_container ul {
	list-style:none;
}
#contact_bottom_container h3 {
	margin:0 0 10px 0
}
#contact_bottom_container .box1 {
	float:left;
	width:532px;
	padding:0 10px 0 20px;
}
#contact_bottom_container .box1 h3 {
	float:left;
	width:532px
}
#contact_bottom_container .box1 ul {
	float:left;
	width:532px;
	list-style:none
}
#contact_bottom_container .box1 ul li {
	float:left;
	width:532px;
	padding:0 0 8px 0
}

#contact_bottom_container .box3 {
	float:left;
	width:180px;
	padding:0 30px 0 30px;
}
#contact_bottom_container .box3 ul {
	float:left;
	width:180px;
}
#contact_bottom_container .box3 ul li {
	padding:0 0 15px 0;
	line-height:20px
}








#footer {
	width:848px;
	float:left;
	text-align:center;
	font-size:11px;
	color:#414040;
}
#footer ul {
	width:848px;
	float:left;
	list-style:none;
	padding:10px 0
}
#footer ul li {
	display:inline;
	padding:0 5px;
}
#footer ul li a {
	color:#414040;
	text-decoration:none
}
#footer ul li a:hover {
	text-decoration:underline
}
#footer .copyright {
	width:848px;
	float:left;
	padding-bottom:10px
}



.text_box, .text_area, .text_select {
    width:200px;
}
input, textarea, select { background: #5a4941; border: solid #000 1px; font: 11px Verdana, Arial, Helvetica, sans-serif; color:#fff; padding: 3px 3px 3px 3px;}
input.submit { font-weight: bold; width: 20px; background: #748721;}

.form_error_title{
    font-weight: bold;
    color: #f37830;
}

.form_error{
    background-color: #F4F6E5;
    border: 1px dashed #ff0000;
    padding: 10px;
    margin-bottom: 10px;
}

.form_error_highlight{
    background-color: #F4F6E5;
    border-bottom: 1px dashed #ff0000;
}

div.instruction_error{
    color: red;
    font-weight:bold;
}

hr.sectionbreak{
    height:1px;
    color: #ccc;
}

a.yellow:link {color: #ccb445;}
a.yellow:active {color: #ccb445;}
a.yellow:visited {color: #ccb445;}
a.yellow:hover {color: #f4d130;}
