body {
	text-align: center;
	margin: 0;
	padding: 0;
	background: url('../_images/bg.jpg') 0 0;
}

#top {
	position: relative;
	float: left;
	width: 1px;
	height: 1px;
	margin:-30px 0 0 0;
	padding:0;
}

#wrapper {
	margin: 30px auto 0 auto;
	text-align:left;
	width: 958px;	
	background: #ffffff;	
}


/********
GET SOCIAL
*********/

#getsocial {
	position: relative;
	float: left;
	width: 958px;	
	background: #ffffff;
	z-index: 999;	
}


#getsocial_slideout {	
	position: relative;
	float: left;
	width: 958px;
	background-color: #6c6c6c;
	background: url('../_images/getsocial_bg.jpg') repeat-x 0 bottom #747474;
	height: 100px;
	display: none;
}

#getsocial_slideout .contents {	
	position: relative;
	float: left;
	width: 900px;	
	margin: 15px 0 0 15px;	
}

#getsocial a.youtube {
	position: relative;
	float: left;
	width: 75px;
	height: 75px;
	margin-left: 15px;
	text-indent: -9999px;
	background: url('../_images/getsocial_youtube.jpg') no-repeat 0 0;
}

#getsocial a.facebook {
	position: relative;
	float: left;
	width: 75px;
	height: 75px;
	margin-left: 20px;
	text-indent: -9999px;
	background: url('../_images/getsocial_facebook.jpg') no-repeat 0 0;
}

#twitter {
	position: relative;
	float: left;
	width: 480px;
	height: 75px;
	margin-left: 20px;
	background: url('../_images/getsocial_twitter_bg.jpg') no-repeat 0 0;
}

#twitter a.logolink {
	position: relative;
	float: left;
	width: 70px;
	height: 70px;
	margin: 2px 0 0 2px;
	text-indent: -9999px;
}

#twitter a.twitterlink {
	color: #31b2da;
	text-decoration: none;
}

#twitter a.twitterlink:hover {
	text-decoration: underline;
}

#twitter .tweet {
	overflow: hidden;
}

#getsocial_additional {
	position: relative;
	float: left;
	width: 160px;
	padding-left: 25px;
	margin: 7px 0 0 25px;
	border-left: 1px solid #aaaaaa;
}

#getsocial_additional .phone {
	position: relative;
	float: left;	
	font: 23px/30px georgia;
	color: #dbff6b;
}

#getsocial_additional a.email {
	position: relative;
	float: left;	
	font: 15px/24px georgia;
	color: #dddddd;
	text-decoration: none;
}

#getsocial_additional a.email:hover {	
	text-decoration: underline;
}

.slide_div {
	position: relative;
	width: 958px;
	height: 7px;
	margin: 0;	
	float: left;
	z-index: 99999;
	border-top: 7px solid #6c6c6c;
}
.slide_button {
	position: relative;
	float: right;
	margin: 0 4px 0 0;
	background: url('../_images/getsocial_button.jpg') no-repeat 0 0;
	width: 86px;
	height: 20px;	
	display: block;	
	text-decoration: none;
}

.slide_button:hover {
	background-position: right -20px;
}
.slide_div .up_arrow {
	background-position: right -40px;
}

.slide_div .up_arrow:hover {
	background-position: right -40px;
}

/**********
HEADER
**********/

#header {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;	
	width: 958px;
	height: 138px;
	background: #ffffff;
}

#header .logo_ds {
	position: absolute;
	top: 32px;
	left: 48px;	
	width: 70px;
	height: 70px;
	background: url('../_images/logo_ds.jpg') 0 0;
}

#header .logo_text {
	position: absolute;
	top: 32px;
	left: 124px;	
	width: 212px;
	height: 70px;
	background: url('../_images/logo_text.jpg') 0 0;
	text-indent: -9999px;
}

/**********
MENU
**********/

#menu {
	position: absolute;
	bottom: 60px;
	right: 0px;
	margin: 0;
	padding: 0;
	width: 360px;
	height: 25px;
	border-bottom: 1px solid #e6e6e6;
	list-style: none;
}

#menu li {
	position: relative;
	float: left;
	padding: 0;
	margin: 0;
	list-style: none;
}

#menu a {
	position: relative;
	float: left;
	height: 25px;
	font: 13px/25px trebuchet ms;
	color: #565656;
	font-weight: bold;
	text-decoration: none;
	margin: 0 30px 0 0;
	border-bottom: 1px solid #e6e6e6;
	text-indent: -99999px;
}

#menu a.about {	
	width: 37px;
	background: url('../_images/nav_about.jpg') no-repeat 0 0;
}

#menu a.services {	
	width: 53px;
	background: url('../_images/nav_services.jpg') no-repeat 0 0;
}

#menu a.work {	
	width: 32px;
	background: url('../_images/nav_work.jpg') no-repeat 0 0;
}

#menu a.contact {	
	width: 50px;
	background: url('../_images/nav_contact.jpg') no-repeat 0 0;
}

#menu a:hover {
	text-decoration: none;	
	border-bottom: 1px solid #9fc037;
	background-position: 0 -25px;
}

/**********
BANNER
**********/

#banner {
	position: relative;
	float: left;
	margin: 0 0 0 4px;
	padding: 0;
	width: 950px;
	height: 375px;	
}

/*--Window/Masking Styles--*/
#banner .window {
	height:375px;
	width: 950px;
	overflow: hidden;
	position: relative;
	background: #000000;
}
#banner .image_reel {
	position: absolute;
	top: 0; left: 0;
}
#banner .image_reel img {
	float: left;
}

/*--Paging Styles--*/
#banner .paging {
	position: absolute;
	bottom: 40px; right: -11px;
	width: 178px; height:47px;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	text-align: center;
	line-height: 35px;
	background: url('../_images/paging_bg.png') no-repeat;
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
}

#banner .paging a {
	padding: 5px;
	text-decoration: none;
	color: #8ea90e;
	font: 14px/14px arial;
	font-weight: bold;
}
#banner .paging a.active {
	font-weight: bold;
	background: #def37c;
	color: #758b0b;
	border: 1px solid #adce0e;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}
#banner .paging a:hover {
	color: #758b0b;
}

/**********
UNDER BANNER
**********/

#underbanner{
	position: relative;	
	float: left;
	margin: 5px 0 0px 4px;
	padding: 0;
	width: 950px;
	height: 137px;
	background: url('../_images/underbanner_bg.jpg') no-repeat 0 0 #353535;
	text-indent: -9999px;
}

/**********
MAIN
**********/

#main {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	width: 958px;	
	background-color: #ffffff;	
}

/*** Text Column ***/

#text {
	position: relative;
	float: left;
	width: 950px;
	padding-bottom: 50px;
	margin: 5px 0 0 4px;
	background: white;
}

#text .sectionheader {
	position: relative;
	float: left;
	width: 950px;
	height: 75px;
	margin: 0;
	padding: 0;
	border-top: 5px solid #c0c1be;
	border-bottom: 1px solid #c0c1be;
}

#text .sectionheader h1 {
	position: relative;
	float: left;
	font: 25px/25px arial;
	color: #000000;
	margin: 15px 0 0 33px;
	padding: 0px;
}

#text .sectionheader h1 img {
	position: absolute;
	left: 0px;
	top: 2px;	
}

#text .sectionheader .description {
	position: relative;
	float: left;
	clear: left;
	font: 12px/17px georgia;
	color: #999999;
	margin: 2px 0 0 35px;
	padding: 0px;
}

#text a.backtotop {
	position: absolute;
	right: 15px;
	top: 20px;
	width: 30px;
	height: 30px;
	background: url('../_images/backtotop.jpg') no-repeat 0 0;
}

#text a.backtotop:hover {	
	background-position: 0 -30px;
}

/*** Two Column Container ***/

#text .twocolumn_container {
	position: relative;
	float: left;
	width: 375px;
	margin: 15px 0 0 68px;
}

#text .twocolumn_container img {
	position: absolute;
	left: 0px;
	top: 7px;	
}

#text .twocolumn_container h1 {
	position: relative;
	float: left;
	width: 375px;
	height: 30px;
	margin: 15px 0 15px 0;
	font: 18px/30px tahoma;
	color: #888888;
	border-bottom: 1px solid #e0e0e0;
}

#text .twocolumn_container h2 {
	position: relative;
	float: left;
	width: 375px;
	height: 30px;
	margin: 15px 0 15px 0;
	font: 18px/30px tahoma;
	color: #888888;
	border-bottom: 1px solid #e0e0e0;
}

#text .twocolumn_container p {
	position: relative;
	float: left;
	width: 375px;
	font: 13px/22px georgia;
	color: #595959;
	margin: 0px;	
}

/**********
WORK
**********/

ul.work_filter {
	position: relative;
	float: left;
	width: 920px;
	margin: 25px 0 5px 30px; 
	padding: 0;	
	list-style: none;
}

ul.work_filter li {
	position: relative;
	float: left;	
	margin: 0px 25px 0px 0px; 
	padding: 0;	
	list-style: none;
	font: 18px/18px georgia;
	color: #dddddd;
}

ul.work_filter li a {
	font: 18px/18px georgia;
	color: #777777;
	text-decoration: none;
}

ul.work_filter li.selected-1 a {	
	color: #96b724;
	text-decoration: none;
}

ul.work {	
	float: left;
	width: 920px;
	margin: 25px 0 5px 66px; 
	padding: 0;
	list-style: none;
}

ul.work li {

	float: left;
	width: 188px;
	height: 200px;
	padding: 0;
	margin: 0 22px 0 0;	
	list-style: none;	
	font: 11px/25px georgia;
	color: #666666;	
}

ul.work li a {

	float: left;
	width: 178px;
	height: 125px;
	padding: 0;		
	border: 5px solid #e4e4e4;
	font: 11px/25px georgia;
	color: #666666;
	overflow: hidden;	
}

ul.work li a:hover {
	opacity: .5;
	-moz-opacity: .5;
	filter:alpha(opacity=50);
}


ul.work li .name {

	float: left;	
	width: 178px;	
	padding: 0;
	margin: 5px 0 0 7px;
	font: 14px/16px georgia;	
	font-weight: bold;
	color: #666666;
}

ul.work li .description {

	float: left;	
	width: 178px;	
	padding: 0;
	margin: 0 0px 0 7px;
	list-style: none;	
	font: 10px/18px arial;
	color: #aaaaaa;
}

/**********
SERVICES
**********/

#text .services_container {
	position: relative;
	float: left;
	margin: 0 0 0 18px;
}

#text ul.services {
	position: relative;
	float: left;
	width: 240px;
	margin: 10px 0px 0 49px;
	padding: 0;
}

#text ul.services li {
	position: relative;
	float: left;
	width: 240px;
	margin: 0px 0 0 0px;
	padding: 10px 0 0px 14px;
	list-style: none;
	background: url('../_images/services_dot.jpg') no-repeat 0px 17px;
	font: 11px/18px georgia;
	color: #888888;	
}

#text ul.services li.service_header {
	position: relative;
	float: left;		
	background: #ffffff;
	padding: 0;
}

#text ul.services h2 {
	position: relative;
	float: left;	
	width: 240px;
	height: 55px;
	padding: 0;
	margin: 0;
	font: 17px/70px tahoma;	
	color: #96B724;	
	border-bottom: 1px solid #E0E0E0;
}

#text ul.services img {
	position: absolute;
	left: -1px;
	bottom: 7px;	
}

#text ul.services p {
	position: relative;
	float: left;
	width: 375px;
	font: 13px/22px georgia;
	color: #595959;
	margin: 0px;	
}

/**********
FOOTER
**********/

#footer {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
	width: 958px;	
	background: url('../_images/footer_bg.jpg') no-repeat 0 0 #efefef;
}

/*** Contact Column ***/

#contact {
	position: relative;
	float: left;
	width: 950px;
	padding-bottom: 50px;
	margin: 3px 0 0 4px;	
}

#contact .sectionheader {
	position: relative;
	float: left;
	width: 950px;
	height: 75px;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #d9d9d9;
}

#contact .sectionheader h1 {
	position: relative;
	float: left;
	font: 25px/25px arial;
	color: #000000;
	margin: 15px 0 0 33px;
	padding: 0px;
}

#contact .sectionheader h1 img {
	position: absolute;
	left: 0px;
	top: 2px;	
}

#contact .sectionheader .description {
	position: relative;
	float: left;
	clear: left;
	font: 12px/17px georgia;
	color: #999999;
	margin: 2px 0 0 35px;
	padding: 0px;
}

#contact .contactinfo {
	position: absolute;
	width: 370px;
	right: 275px;
	top: 15px;
	border-left: 1px solid #cccccc;
	padding: 0 0 5px 15px;
}

#contact .contactinfo .phone {
	position: relative;
	float: left;
	font: 16px/20px georgia;
	color: #9dc71d;
}

#contact .contactinfo .email {
	position: relative;
	float: left;
	margin:	0 0 0 14px;
}

#contact .contactinfo .email a {
	position: relative;
	float: left;
	font: 16px/20px georgia;
	color: #9dc71d;
	text-decoration: none;
}

#contact .contactinfo .email a:hover {	
	text-decoration: underline;
}

#contact .contactinfo .address {
	position: relative;
	float: left;	
	font: 12px/20px georgia;
	color: #676767;
	margin: 2px 0 0 0;
}

#contact .icon_phone {
	position: relative;
	float: left;
	width: 16px;
	height: 15px;
	margin: 4px 5px 0 0;
	background: url('../_images/contact_icons.jpg') no-repeat 0 0;
}

#contact .icon_email {
	position: relative;
	float: left;
	width: 16px;
	height: 16px;
	margin: 4px 5px 0 0;
	background: url('../_images/contact_icons.jpg') no-repeat 0 0;
	background-position: -16px 0;
}

#contact .icon_address {
	position: relative;
	float: left;
	width: 16px;
	height: 16px;
	margin: 4px 5px 0 0;
	background: url('../_images/contact_icons.jpg') no-repeat 0 -15px;
}

#contact a.backtotop {
	position: absolute;
	right: 15px;
	top: 20px;
	width: 30px;
	height: 30px;
	background: url('../_images/contact_backtotop.jpg') no-repeat 0 0;
}

#contact a.backtotop:hover {	
	background-position: 0 -30px;
}

#contact .iframe {
	text-align: left;
	position: relative;
	float: left;
	width: 381px;
	height: 375px;
	overflow: hidden;
	border: 0px;
	padding: 0px;
	margin: 18px 0 0 36px;
	list-style: none;
	background: url('../_images/contact_bg.jpg') no-repeat 0 bottom;
}

#contact_map {
	position: relative;
	float: left;
	width: 477px;
	height: 328px;
	margin: 48px 0 0 19px;	
	background: #717171;
	border: 1px solid #bfbfbf;
}

#contact_map .image {
	position: relative;
	float: left;
	width: 465px;
	height: 316px;
	overflow: hidden;
	border: 6px solid #ffffff;
}

#contact_map img {
	position: absolute;
	top: 0;
	left: 0;
	width: 465px;
	height: 316px;	
}

#contact_map .image a {
	padding: 7px 0 25px 25px;
	font: 13px/14px arial;
	font-weight: bold;
	color: #ffffff;
	text-decoration: none;
	display: block;
}

#contact_map .image .green {
	color: #c7ee3e;
}

