@import "reset.css";

/* 
----------------------------------------------------------------
----------------------------------------------------------------
----------------------------------------------------------------
COOGANSLANDSCAPE.COM CSS
author: Ben Visser of Nice Outfit
----------------------------------------------------------------
----------------------------------------------------------------
---------------------------------------------------------------- 
*/

body { padding: 0; margin: 0; font-family: Georgia, sans-serif; font-size: 62.5%; background: #787450 url('../_images/bg.jpg'); }

.divider { float: left; width: 100%; height: 1px; background: url('../_images/divider.gif') repeat-x; }
.divider-footer { float: left; width: 1px; height: 150px; background: url('../_images/divider-footer.gif') repeat-y; }

.col-1 { float: left; width: 260px; }
.col-2 { float: left; width: 540px;}
.col-1-thin { float: left; width: 200px; }

.padding-top-0 { padding-top: 0px; }
.padding-top-10 { padding-top: 10px; }
.padding-top-20 { padding-top: 20px; }
.padding-top-30 { padding-top: 30px; }
.padding-top-40 { padding-top: 40px; }
.padding-top-50 { padding-top: 50px; }
.padding-top-60 { padding-top: 60px; }
.padding-top-70 { padding-top: 70px; }
.padding-top-80 { padding-top: 80px; }
.padding-top-90 { padding-top: 90px; }
.padding-top-100 { padding-top: 100px; }

.padding-right-0 { padding-right: 0px; }
.padding-right-10 { padding-right: 10px; }
.padding-right-20 { padding-right: 20px; }
.padding-right-30 { padding-right: 30px; }
.padding-right-40 { padding-right: 40px; }
.padding-right-50 { padding-right: 50px; }
.padding-right-60 { padding-right: 60px; }
.padding-right-70 { padding-right: 70px; }
.padding-right-80 { padding-right: 80px; }
.padding-right-90 { padding-right: 90px; }
.padding-right-100 { padding-right: 100px; }

.padding-bottom-0 { padding-bottom: 0px; }
.padding-bottom-10 { padding-bottom: 10px; }
.padding-bottom-20 { padding-bottom: 20px; }
.padding-bottom-30 { padding-bottom: 30px; }
.padding-bottom-40 { padding-bottom: 40px; }
.padding-bottom-50 { padding-bottom: 50px; }
.padding-bottom-60 { padding-bottom: 60px; }
.padding-bottom-70 { padding-bottom: 70px; }
.padding-bottom-80 { padding-bottom: 80px; }
.padding-bottom-90 { padding-bottom: 90px; }
.padding-bottom-100 { padding-bottom: 100px; }

.padding-left-0 { padding-left: 0px; }
.padding-left-10 { padding-left: 10px; }
.padding-left-20 { padding-left: 20px; }
.padding-left-30 { padding-left: 30px; }
.padding-left-40 { padding-left: 40px; }
.padding-left-50 { padding-left: 50px; }
.padding-left-60 { padding-left: 60px; }
.padding-left-70 { padding-left: 70px; }
.padding-left-80 { padding-left: 80px; }
.padding-left-90 { padding-left: 90px; }
.padding-left-100 { padding-left: 100px; }

.margin-top-0 { margin-top: 0px; }
.margin-top-10 { margin-top: 10px; }
.margin-top-20 { margin-top: 20px; }
.margin-top-30 { margin-top: 30px; }
.margin-top-40 { margin-top: 40px; }
.margin-top-50 { margin-top: 50px; }
.margin-top-60 { margin-top: 60px; }
.margin-top-70 { margin-top: 70px; }
.margin-top-80 { margin-top: 80px; }
.margin-top-90 { margin-top: 90px; }
.margin-top-100 { margin-top: 100px; }

.margin-right-0 { margin-right: 0px; }
.margin-right-10 { margin-right: 10px; }
.margin-right-20 { margin-right: 20px; }
.margin-right-30 { margin-right: 30px; }
.margin-right-40 { margin-right: 40px; }
.margin-right-50 { margin-right: 50px; }
.margin-right-60 { margin-right: 60px; }
.margin-right-70 { margin-right: 70px; }
.margin-right-80 { margin-right: 80px; }
.margin-right-90 { margin-right: 90px; }
.margin-right-100 { margin-right: 100px; }

.margin-bottom-0 { margin-bottom: 0px; }
.margin-bottom-10 { margin-bottom: 10px; }
.margin-bottom-20 { margin-bottom: 20px; }
.margin-bottom-30 { margin-bottom: 30px; }
.margin-bottom-40 { margin-bottom: 40px; }
.margin-bottom-50 { margin-bottom: 50px; }
.margin-bottom-60 { margin-bottom: 60px; }
.margin-bottom-70 { margin-bottom: 70px; }
.margin-bottom-80 { margin-bottom: 80px; }
.margin-bottom-90 { margin-bottom: 90px; }
.margin-bottom-100 { margin-bottom: 100px; }

.margin-left-0 { margin-left: 0px; }
.margin-left-10 { margin-left: 10px; }
.margin-left-20 { margin-left: 20px; }
.margin-left-30 { margin-left: 30px; }
.margin-left-40 { margin-left: 40px; }
.margin-left-50 { margin-left: 50px; }
.margin-left-60 { margin-left: 60px; }
.margin-left-70 { margin-left: 70px; }
.margin-left-80 { margin-left: 80px; }
.margin-left-90 { margin-left: 90px; }
.margin-left-100 { margin-left: 100px; }

.float-left { float: left; }
.float-right { float: right; }

.clear-left { clear: left; }
.clear-right { clear: right; }
.clear-both { clear: both; }

.text-center { text-align: center; }

.no-border { border-bottom: none; }

#home .container-header { width: 100%; height: 560px; }
.container-header { width: 100%; height: 360px; }
	
	#home .container-header-bg-loader { width: 1100; z-index: -2; height: 560px; background: url('../_images/loader.gif') top center no-repeat; opacity: 1; }
	#home .container-header-bg { position: relative; z-index: -1; width: 1100; height: 560px; opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; // first! filter: alpha(opacity=0); }
	
	.container-header-bg-loader { width: 1100; z-index: -2; height: 360px; background: url('') top center no-repeat; opacity: 1; }
	.container-header-bg { position: relative; z-index: -1; width: 1100; height: 360px; opacity: 0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; // first! filter: alpha(opacity=0); }
		
	#home .container-nav { width: 100%; height: 128px; background: url('../_images/bg-nav.gif') top center no-repeat; margin-top: -560px; z-index: 999; }
	.container-nav { width: 100%; height: 128px; background: url('../_images/bg-nav.gif') top center no-repeat; margin-top: -360px; z-index: 999; }
	
		.content-nav { width: 960px; margin: 0 auto; }
			.content-nav-logo { float: left; width: 108px; margin: 0 10px 0 10px; }
			.content-nav-text { float: left; width: 822px; text-align: right; }
				.content-nav-text ul { float: left; width: 822px; color: #999; }
				.content-nav-text ul li {  display: inline; font-size: 1.6em; }
					.content-nav-text ul li a { float: right; color: #999; text-decoration: none; height: 37px; padding: 8px 10px 0 10px; margin: 16px 5px 0 5px; }
					.content-nav-text ul li a:hover { color: #fff; }
					.content-nav-text .active { background: url('../_images/nav-active-b.gif'); -moz-border-radius: 2px; -webkit-border-radius: 2px; }
	
	.content-header { width: 960px; margin: 0 auto; }
		.content-header-interior h1 { text-align: right; font-size: 3.8em; font-style: italic; font-weight: normal; color: #fff; margin-bottom: 20px; margin-right: 10px; margin-top: 20px; }
		.content-header-home { width: 940px; padding: 0 10px; height: 490px; }
			.thumbs-home { float: right; width: 940px; padding-top: 285px; }
			.thumbs-home li { float: right; padding-left: 20px; }
				
				.thumbs-home li a img { border: 5px solid #000; }
				.thumbs-home li a.selected img { border: 5px solid #fff; }				
				
				.button-trans { display: block; text-align: center; width: 140px; height: 40px; margin-top: -4px; background: url('../_images/button-trans.png') center no-repeat; color: #fff; font-style: italic; font-size: 1.2em; text-decoration: none; }
				.button-trans:hover { color: #999; }
					.button-trans span { display: block; padding-top: 12px; }

.container { width: 100%; margin-top: -90px; }
	.content { width: 960px; margin: 0 auto; }
		.content-border { float: left; width: 960px; padding: 10px 0; background: url('../_images/bg-trans-black.png'); }
			
			.content-viewer { float: left; width: 880px; height: 360px; margin: 0 10px; padding: 30px; background: #333 url('../_images/bg-viewer.gif') repeat-x; color: #666; }
			
			.content-holder { float: left; width: 820px; margin: 0 10px; padding: 30px 60px 60px 60px; background-color: #fff; border }
				.content-holder h1 { font-size: 3.8em; font-style: italic; font-weight: normal; color: #333; margin-bottom: 20px; }
				.content-holder h2{ font-size: 1.9em; font-weight: normal; font-style: italic; color: #333; line-height: 1; }
				.content-holder h3 { font-size: 1.2em; font-weight: normal; font-variant:small-caps; color: #333; line-height: 1.1; margin-bottom: 20px; }
				.content-holder h4 { font-size: 1.45em; font-weight: normal; color: #333; line-height: 1.7; margin-bottom: 20px; }
				.content-holder p { font-size: 1.3em; font-weight: normal; font-family: Arial, sans-serif; color: #333; line-height: 1.6; margin-bottom: 20px; }
				.content-holder a { color: #006699; }
				.content-holder a:hover { text-decoration: none; }
				.content-holder p a:visited { color: #6c427a; }
				.content-holder ul.list-gallery a:visited { color: #6c427a; }
				.content-holder ul.list-lines { width: 100%; border-top: 1px dotted #ccc; }
					.content-holder ul.list-lines li { width: 100%; padding: 10px 0; border-bottom: 1px dotted #ccc; font-size: 1.3em; font-weight: normal; font-family: Arial, sans-serif; color: #333; }
					li.active { background-color: #efefef; }
					li.active a { text-decoration: none; color: #333;}
				.content-holder .testimonial { font-style: italic; font-size: 1.6em; background-color: #ededed; padding: 20px; margin-bottom: 0; font-family: Georgia, serif; }
				.content-holder .testimonial-name { background: url('../_images/testimonial-talk.gif') no-repeat; padding-top: 20px; }
				.content-holder iframe { border: 1px solid #ccc; }
				.content-holder .project-title { font-size: 1.3em; line-height: 1.2em; }
				.content-holder .subtitle { font-size: .9em; color: #999; font-style: italic; }
				.content-holder ul.list-gallery { float: left; width: 100%; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 20px 0; }
					.content-holder ul.list-gallery li { line-height: 1.2; vertical-align: middle; float: left; width: 100%; padding: 10px 0; font-size: 1.3em; font-weight: normal; font-family: Arial, sans-serif; color: #333; }
					.content-holder ul.list-gallery li img { float: left; margin-right: 20px; width: 50px; }
				.content-holder ul.gallery-thumbs { float: left; width: 100%; }
					.content-holder ul.gallery-thumbs li { float: left; width: 44px; margin-bottom: 10px; }
					.content-holder ul.gallery-thumbs li a { display: block; border: 5px solid #ededed; }
					.content-holder ul.gallery-thumbs li a.selected { border: 5px solid #000; }
				.content-holder .quote { float: right; text-align: right; margin-top: -50px; }
					.content-holder .quote a { color: #fff; }
					.content-holder .quote a:hover { color: #999; }
				.content-holder .services { text-align: center; background: url('../_images/services-bg.gif') ; }
				.content-holder #gallery-holder { display: block; text-align: center; vertical-align: middle; background: #000 url('../_images/ourwork-preloader.gif') no-repeat; height: 360px; width: 540px; }
				

.container-footer { width: 100%; }
	.content-footer { width: 940px; margin: 0 auto; padding: 0 10px; }
		.content-footer p { font-size: 1.3em; font-family: Arial, sans-serif; line-height: 1.6; margin-bottom: 15px; color: #212016; }
		.content-footer p a { color: #212016; }
		.content-footer p a:hover { text-decoration: none; }
		.content-footer h2 { font-weight: normal; font-style: italic; font-size: 3em; color: #212016; }
		
/*table forms*/

.form-section { width: 480px; background-color: #ededed; padding: 20px 30px; clear: left; }

table { }
table tr {  }
table td { font-family: Arial, sans-serif; font-size: 1.3em; color: #333; line-height: 1.4; vertical-align: top; border-bottom: 1px solid #ccc; padding: 10px 0; }
table td input { font-size: 1em; color: #808084; margin-bottom: 2px; }
table td textarea { width: 90%; }
table td.error { color: #80000d; font-size: 1em; }

label.error { background: url('../_images/exclamation-small-red.png') no-repeat; padding-left: 15px; float: left; width: 100%; color: #80000d; font-size: 1em; display: none; }

.req { color: #80000d; }
input.error { background-color: #ffe8ea; }
textarea.error { background-color: #ffe8ea; }

#formError { float: left; width: 480px; padding: 20px 30px; background-color: #80000d;; color: #fff; font-family: Arial, sans-serif; font-size: 1.3em; }
p.success, h2.success { color: green; }