/************************
*  Host Eagle Web Shop CSS
*  Created by: Brent Leavitt
*  Created on: 3 June 2009
*************************/

/************************
*  GENERAL
*************************/

html, body{ margin:0; padding: 0; min-width: 950px; font-family: georgia, serif;}
#bg_left_wrap{background:transparent url(../img/side_bg_left.jpg) no-repeat top left; }
#bg_right_wrap{background:transparent url(../img/side_bg_right.jpg) no-repeat top right;}
#lower_bg_left_wrap{background:transparent url(../img/lower_side_bg_left.jpg) no-repeat top left; }
#lower_bg_right_wrap{background:transparent url(../img/lower_side_bg_right.jpg) no-repeat top right;}
.margin_spacer{margin: 0 90px; }
.clear{clear: both; height: 0; overflow: hidden;}
img{border: none;}

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

#header{ height: 146px; overflow: hidden;}
#title {padding: 15px 0 0 35px; float: left;}
#title h1{margin:0;}
#title h1 a{background: url(../img/host_eagle_web_shop.jpg) no-repeat top left; width: 438px; height: 0; padding-top: 104px; display: block; overflow:hidden;}
#main_menu{float: right; text-align: right; width: 300px; margin: 0 40px 0 0 !important;  margin: 0 20px 0 0; }
#main_menu span.contact{display: block; height: 20px; margin: 20px 0; font-family: verdana, arial, sans; font-size: 14px; color: #576558; letter-spacing: .2em; clear: both; float: right; width: 100%;}
#main_menu p{ font-size: 32px; margin: 43px 0 0 0;  display:block; width: 250px; text-align: right; float: right; }
#main_menu p span{display: block; float: right; padding-left: 10px; line-height: 30px; margin-bottom: 1px; overflow: visible;}
#main_menu p span a{text-decoration: none; color: #A6A492; }
#main_menu p span a:hover{border-bottom: 1px dotted #426348; line-height: 30px; color: #426348;}


/************************
*  UPPER_MAIN
*************************/

#upper_main{background: url(../img/upper_main_bg.jpg) repeat top left; height: 100%; overflow: hidden; padding: 25px 0;  }
.home_port_image{ width: 49%; text-align: right; float: left;}
.home_port_image img{border: 20px solid #343434; }
.home_port_texts{ width: 45%; float: left; padding-left: 20px; margin-top: 20px; height:213px; position: relative;}
#upper_main h2{display:inline; color: #730202; font-size: 32px; line-height: 20px !important; line-height: 28px; font-weight: bold;}
#upper_main p {display:inline; line-height: 20px; font-size: 20px; color: #fff; font-family: verdana, arial, sans;}
.home_port_texts a{color:#fff;}
.home_port_texts span.call_action{position:absolute; bottom:0;  display:block; right: 20px; font-size: 20px; font-weight: bold;}
.home_port_texts span.call_action a{text-decoration: none; color: #730202; }
.home_port_texts span.call_action a:hover{text-decoration: underline; }


/************************
*  LOWER_MAIN
*************************/
#lower_main{padding: 35px 35px 0 35px; }
#lower_main  a{color: #444; text-decoration: none;  border-bottom: 1px dotted #444;}
#lower_main  a:hover{color: #730202; text-decoration: none;  border-bottom: 1px dotted #730202;}


/**** right column *******/
.right_column {float: right; border-left: 1px solid #455A48; width: 30%; padding: 0 0 20px 30px; margin-left: 45px;  }
.right_column h4{color: #426348; font-size: 18px; line-height: 20px; font-weight: normal; margin: 30px 0 10px;}
.right_column p{ line-height: 14px; font-size: 12px; color: #444444; font-family: verdana, arial, sans;}
.right_column ul{list-style: square inside; margin: 0; padding: 0; font-family: verdana, arial, sans; color:#7B796D;font-size: 12px;}


/**** left column *******/
.left_column{margin-top: 35px; width: 60%;}
.section_wrap{margin: 0 0 40px 0; clear: left;}
.section_wrap h3{display:block; color: #426348; font-size: 24px; line-height: 20px; font-weight: normal; margin:0 0 20px 0; }
.section_wrap p {line-height: 16px; font-size: 13px; color: #444444; font-family: verdana, arial, sans; margin: 0 0 20px 0; padding: 0;}
.section_wrap img.right {float:right; margin: 0 0 20px 30px;}
.section_wrap img.left{margin: 0 10px 20px 0; float: left; }
.left_column .last{margin-bottom:20px; }

/************************
* FOOTER
*************************/
#foot_bg_left{background: url(../img/footer_bg_left.jpg) no-repeat bottom left; }
#foot_bg_right{background: url(../img/footer_bg_right.jpg) no-repeat bottom right;padding-top: 45px;}
#foot_wrap{padding: 0 91px; padding: 0 !important;}
#footer{background: #A6A492; height: 27px; margin: 0 90px; overflow:hidden; font-size: 10px; color: #E3E1D1; padding: 10px 35px;}
#footer a{color: #E3E1D1; text-decoration: none;}
#footer a:hover{color: #EBE9D9; text-decoration:underline;}
#footer ul{display: block; list-style: none; margin: 0; padding: 0; }
#footer li{display: inline;}
#foot_copy{float: right; text-align: right;}
#foot_menu li{padding-right: 5px;}
#foot_copy li{padding-left: 5px;}

/************************
*  PORTFOLIO 
*************************/


/************************
*  CONTACT FORM
*************************/
#upper_main #address_phone{  width: 40% !important; width: 35%;text-align: right; float: left; margin: 25px 2% 0 7% !important; }
#upper_main #address_phone h2{ color: #730202; font-size: 32px; line-height: 20px; font-weight: bold;}
#upper_main #address_phone p.address{display: block;}
#upper_main #address_phone p.address span{font-size: 1.5em; line-height: 1.2em;}

#upper_main #contact_form{background: #fff; float: left; width:38% !important; width: 32%; margin: 0 25px; padding: 40px 3% 30px 3% !important;}
#upper_main #contact_form label{text-align:right;  display: block; padding: 0 4% 20px 0; width: 25% !important; width: 23%; float: left; clear: both; color:#426348; font-size: 1.1em; font-family: verdana, arial, sans;}
#upper_main #contact_form input, #upper_main #contact_form textarea{display: block; width:70% !important; width: 65%; float: right; margin: 0 0 20px 0; font-size: 1em; border: 1px solid #999; color: #666; }
#upper_main #contact_form textarea{height: 120px; margin: 0; }
#upper_main #contact_form input.submit{text-align: right; border: none; font-size: 1.7em; color:#426348; background: none; font-family: georgia, serif;  width: 100px; float: right; margin: 10px 0 0 0; clear: both;}
#upper_main #contact_form input.submit:hover{text-decoration: underline;}

#upper_main #contact_form h3{font-family: verdana, arial, sans; font-weight: normal; color:#576558; }
#upper_main #contact_form #response{font-family: verdana, arial sans; color: #f00; clear: left; float: left; width: 50%; padding-top: 20px;}