/* GENERAL STYLES */
* {padding: 0; margin: 0;}
body {text-align: center; background: #2D4487 url(../images/body_bg.gif) 0 0 repeat-x; font-family: helvetica, Arial, verdana, sans-serif; font-size: 13px; color: #333;}
p {line-height: 21px; margin: 10px;}
button {cursor:pointer; border:0; background: none; text-align: left;}
button img {border: none!important;}
.hide {display: none;}
.clear {clear: both;}
a img {border: none;}
a:link, a:visited {text-decoration: underline; color: #333;}
a:hover, a:active {text-decoration: none; color: #681201;}
.left {float: left;}
.right {float: right;}
li {list-style: none;}

/* LAYOUT */

#container {width: 960px; margin: 0 auto; text-align: left;}
#header {width: 960px; height: 168px; background: transparent url(../images/header_bg.jpg) -4px 0 no-repeat; position: relative;}
#logo {position: absolute; top: 30px; left: 80px; text-indent: -99999px;}
#teaser {width: 960px; min-height: 293px; background: transparent url(../images/teaser_bg.jpg) 0 100% no-repeat; position: relative; z-index: 0;}
#teaser div {width: 350px; margin-top: 20px;}
#teaser div.left {margin-left: 120px; padding-top: 20px;}
#cred {text-align: center;}
#photodiv {position: absolute; top: -16px; right: 80px; z-index: 1;}
#wrapper {width: 800px; margin: 0 auto; min-height: 300px; background: #fff url(../images/wrapper_bottom.gif) 0 100% no-repeat; clear: both;}
#right_content, #left_content {float: left; width: 350px;}
#left_content {padding-left: 40px;}
#right_content {padding-right: 40px; margin-left: 80px; width: 280px;}
#footer {clear: both; text-align: center; padding: 30px 0;}
.col_1 {float: left; width: 240px; text-align: center;}
.col_2 {float: left; width: 200px; margin: 10px 0 0 20px;}
.col_3 {float: left; width: 270px; margin: 5px 0;}
#portfolio_page .col_2 {width: 440px;}
.port_item {margin-left: 30px;}

/* TEXT */
#logo h1 a {display: block; height: 65px; width: 300px; background: transparent url(../images/logo.png) 0 0 no-repeat;}
#teaser h2 {font-size: 28px; color: #000; font-weight: normal}
#teaser p {font-size: 17px; line-height: 28px;}
#quote {min-height: 100px; background: #fff url(../images/quote.gif) 0 0 no-repeat; padding-top: 20px; color: #999; text-align: right; font-size: 15px; font-family: Georgia, "Times New Roman", Times, Helvetica, Serif; font-style: italic;}
.caption {line-height: 16px; color: #666;}
#left_content li {padding-left: 20px; line-height: 20px; background: #fff url(../images/star.gif) 0 0 no-repeat; margin: 8px 20px;}
#left_content h2, #left_content h3 {font-size: 20px; font-weight: normal; margin: 20px 10px 10px 10px;}
#left_content h3 {font-size: 16px;}
#left_content img {border: 10px solid #503d8e; margin: 5px 0 5px 15px;}

/* NAV */
#nav {background: url(../images/nav.jpg) 0 0 no-repeat; height: 66px; overflow: hidden; position: absolute;  top: 108px; left: 80px; z-index: 2;}
#nav ul {position: relative; width: 800px; height: 66px; position: relative; margin: 0;}
#nav li a {position: absolute; top: 0;}
#nav li, #nav a { height: 66px; display: block; text-indent: -999999px; margin: 0; padding: 0;}	

#nav_1 {left: 23px; width: 63px;}
#nav_2 {left: 112px; width: 91px;}
#nav_3 {left: 230px; width: 123px;}
#nav_4 {left: 381px; width: 90px;}
#nav_5 {left: 499px; width: 108px;}
#nav_6 {left: 635px; width: 72px;}
#nav_7 {left: 735px; width: 45px;}

a:hover#nav_1, #home_page #nav_1 {background: transparent url(../images/nav.jpg) -23px -66px no-repeat;}
a:hover#nav_2, #about_page #nav_2 {background: transparent url(../images/nav.jpg) -112px -66px no-repeat;}
a:hover#nav_3, #services_page #nav_3 {background: transparent url(../images/nav.jpg) -230px -66px no-repeat;}
a:hover#nav_4, #portfolio_page #nav_4 {background: transparent url(../images/nav.jpg) -381px -66px no-repeat;}
a:hover#nav_5, #contact_page #nav_5 {background: transparent url(../images/nav.jpg) -499px -66px no-repeat;}
a:hover#nav_6, #gallery_page #nav_6 {background: transparent url(../images/nav.jpg) -635px -66px no-repeat;}
a:hover#nav_7, #faq_page #nav_7 {background: transparent url(../images/nav.jpg) -735px -66px no-repeat;}

#footer ul li {display: inline; margin: 10px;}
#footer a, #cred a {color: #999!important; text-decoration: none; text-transform: lowercase;}
#cred a {font-size: 11px; color: #222!important;}

ul.icons {margin: 10px;}
ul.icons li {line-height: 42px; margin: 10px 0; background: #fff url(../images/icon_contact.jpg) 0 0 no-repeat; padding-left: 40px;}
li#icon_contact {background: #fff url(../images/icon_contact.jpg) 0 0 no-repeat;}
li#icon_gallery {background: #fff url(../images/icon_gallery.jpg) 0 0 no-repeat;}
li#icon_faq {background: #fff url(../images/icon_faq.jpg) 0 0 no-repeat;}
ul.icons li a {text-decoration: none; font-size: 15px; font-family: Georgia, "Times New Roman", Times, Helvetica, Serif; font-style: italic;}


/* CONTACT FORM */

fieldset {margin: 10px; border: none; padding : 0px 10px 22px 10px;}
label { float: left; width: 130px; padding: 0 10px; text-align: right;}
fieldset div {margin: 15px 0;padding: 0;display: block;}
fieldset div input, fieldset div textarea {width: 150px; border: 1px solid #ccc; padding: 1px; color: #333;}
fieldset div select {padding: 1px;}
textarea {height: 100px;}
#submit {clear: both;text-align: center;}
#submit input {border: 1px solid #333; padding: 2px 10px; background: #555; color: #fff;font-size: 100%;}
input:focus, textarea:focus { background: #efefef; color: #000; font-weight:bold;}
