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

body {
	background:#000;
}

#div404 {
		background:#FFF;
		color: #333;
		font-family: arial;
		font-size: 12px;
		padding:300px;
}

#topbar-container {
	float:left;
	width:100%;
	background:#fff url(../images/layout/menu_shadow.png) no-repeat top center;
	height: 46px;
	border-top:4px solid #000;
}

#topbar {
	width:960px;
	height:41px;
	margin-left:auto;
	margin-right:auto;
}

#logo {
	float:left;
	width:160px;
	height:33px;
	padding-top:7px;
}

#main-menu {
	float:left;
	width:340px;
	height:25px;
	background:#ffffff url(../images/layout/menu.png) no-repeat 5px 0px;
	margin:10px 0px 0px 290px;
}

#main-menu ul{
	float:left;
	width:320px;
	height:25px;
}
#main-menu li{
	float:left;
	width:80px;
	height:25px;
}

.menu-item-about, .menu-item-services, .menu-item-portfolio, .menu-item-contact, .menu-item-about-selected, .menu-item-services-selected, .menu-item-portfolio-selected, .menu-item-contact-selected {
	float:left;
	display:block;
	width:80px;
	height:25px;
}
#main-menu a span {
	display:none;
}

.menu-item-about:hover 		{background:#ffffff url(../images/layout/menu.png) no-repeat 5px -25px;}
.menu-item-services:hover 	{background:#ffffff url(../images/layout/menu.png) no-repeat -75px -25px;}
.menu-item-portfolio:hover 	{background:#ffffff url(../images/layout/menu.png) no-repeat -155px -25px;}
.menu-item-contact:hover 	{background:#ffffff url(../images/layout/menu.png) no-repeat -235px -25px;}

.menu-item-about-selected 	{background:#ffffff url(../images/layout/menu.png) no-repeat 5px -50px;}
.menu-item-services-selected 	{background:#ffffff url(../images/layout/menu.png) no-repeat -75px -50px;}
.menu-item-portfolio-selected {background:#ffffff url(../images/layout/menu.png) no-repeat -155px -50px;}
.menu-item-contact-selected 	{background:#ffffff url(../images/layout/menu.png) no-repeat -235px -50px;}

#phone-number{
	float:left;
	width:167px;
	padding:15px 0px 0px 0px;
}
#intro-container {
	float:left;
	width:100%;
	height:384px;
	background:#0b191f url(../images/layout/intro-bg.jpg) repeat-x top center;
}

#intro {
	width:960px;
	height:384px;
	margin-left:auto;
	margin-right:auto;
}

#left-part {
	float: left;
	width: 430px;
	height: 254px;
	padding: 130px 0px 0px 0px;
}

#intro-links {
	padding-left: 160px;
	padding-top: 20px;
}

#right-part {
	float: right;
	width: 490px;
	height: 317px;
	padding: 67px 0px 0px 40px;
	background:url(../images/layout/photo-rack.png) no-repeat top left;
}



#services-intro-container {
	float:left;
	width:100%;
	height:150px;
	background:url(../images/layout/services-bg.jpg) repeat-x top center;
}

#about-intro-container {
	float:left;
	width:100%;
	height:150px;
	background:url(../images/layout/about-bg.jpg) repeat-x top center;
}

#portfolio-intro-container {
	float:left;
	width:100%;
	height:150px;
	background:url(../images/layout/portfolio-bg.jpg) repeat-x top center;
}

#contact-intro-container {
	float:left;
	width:100%;
	height:150px;
	background:url(../images/layout/contact-bg.jpg) repeat-x top center;
}

#services-intro, #about-intro, #portfolio-intro, #contact-intro {
	width:960px;
	height:100px;
	margin-left:auto;
	margin-right:auto;
}

#services-container, #about-container, #contact-container {
	float:left;
	width:100%;
	background:#FFF;
	padding-top:30px;
	padding-bottom:30px;
}

#services, #about, #contact {
	width:960px;
	margin-left:auto;
	margin-right:auto;
	background:#FFF;
}

#services-left, #about-left, #contact-left {
	float:left;
	background:#FFF;
	width: 580px;
	margin-right:20px;
}

#services-right, #about-right, #contact-right{
	float:left;
	background:#FFF;
	width:360px;
}

#services-right img {
	border: none;
}

.team-member {
	float:left;
	width:352px;
	padding:3px 3px 3px 15px;
	margin: 5px 0px 5px 0px;
}

.team-member-thumbnail {
	float:left;
	width:94px;
	height:95px;
	border:1px solid #CCC;
	padding:3px;
	margin: 5px 0px 5px 0px;
}

.team-member-info {
	float:left;
	padding:65px 3px 3px 8px;
	margin: 5px 0px 5px 0px;
}

#portfolio-container {
	float:left;
	width:100%;
	background:#FFF;
	padding-top:30px;
	padding-bottom:30px;
}

#portfolio-items-container{
	width:960px;
	margin-left:auto;
	margin-right:auto;
	background: #FFF;
}

.portfolio-item {
	float:left;
	width:960px;
	background: #FFF;
	padding-bottom:20px;
}

.portfolio-item-screenshot{
	display:block;
	float:left;
	background:#000;
	width: 580px;
	height:150px;
	margin-right:20px;
	border: 2px solid #CCC;
	padding:2px;
}

.portfolio-item-screenshot img{
	background:#000;
	filter:alpha(opacity=50);
	-moz-opacity:.50;
	opacity:.50;
}

.portfolio-item-screenshot img:hover{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}

.portfolio-item-info {
	float:left;
	background:#FFF;
	width:352px;
	height:156px;
}
	



#divider {
	width:100%;
	float:left;
	height:4px;
	background:#0b191f;
}

#home-content-container {
	float:left;
	width:100%;
	background:#FFF;
	padding-top:30px;
	padding-bottom:30px;
}

#home-content {
	width:960px;
	margin-left:auto;
	margin-right:auto;
	background:#FFF;

}

#home-content-left {
	float:left;
	background:#FFF;
	width: 580px;
	margin-right:20px;
}

#recent-works {
	float:left;
	width:572px;
	padding: 4px;
}

.work-box {
	float:left;
	width: 180px;
	padding:4px;
	text-align:center;
}

#home-content-right {
	float:left;
	background:#FFF;
	width:360px;
}

#grass-pattern {
	float:left;
	width:100%;
	background: #FFF url(../images/layout/grass_pattern.gif) repeat-x top left;
	height: 82px;
}
	



#footer-bar {
	float:left;
	width:100%;
	background:url(../images/layout/footer-divider-bg.gif) repeat-x top left;
	height:36px;
	padding-top:4px;
}

#copyright {
	width:960px;
	margin-left:auto;
	margin-right: auto;
}

#footer-container {
	float:left;
	width:100%;
	background:#090909;
}

#footer {
	padding:10px;
	width:960px;
	margin-left:auto;
	margin-right: auto;
	background:#090909;
}

#sitemap-container {
	float:left;
	width:100%;
	border-bottom: 1px solid #333;
	padding-top:20px;
	padding-right:10px;
	padding-bottom:20px;
	line-height:20px;
}

#sitemap-left {
	float:left;
	width:580px;
}

#sitemap-right {
	text-align:right;
	float:right;
	width:370px;
}

#twitter-container {
	float:left;
	width:100%;
}

#twitter-container img {
	float:left;
}

#tweet {
	float:left;
	padding-top:50px;
}

#bluehost {
	float: right;
	}