/**
* Customer web site CSS
*
* Copyright (c)2008 44 Interactive. All Rights Reserved.
*
* SVN File: $Id: styles.css 217 2008-07-28 19:06:27Z Mike Neugebauer $
* @author $Author: Mike Neugebauer $
* @version $Revision: 217 $
* @lastrevision $Date: 2008-07-28 14:06:27 -0500 (Mon, 28 Jul 2008) $
* @modifiedby $LastChangedBy: Mike Neugebauer $
* @lastmodified $LastChangedDate: 2008-07-28 14:06:27 -0500 (Mon, 28 Jul 2008) $
* @filesource $URL: svn+ssh://miken@svnhost.44i-dev.com/svnhome/base/branches/counterelements/cust_skeleton/css/styles.css $
*/

 /* MASTER COLORS
	MAIN HEADLINES:
	#0c3d61;

	BODY COPY:
	#707070;

	ORANGE:
	#bc593e;

	LIGHT ORANGE:
	#bc593e;

	LIGHTEST GREY:
	#eaebeb;

	DARK BLUE:
	#0c3d61;

	MEDIUM BLUE:
	#5d7a90;

	LIGHT BLUE:
	#859eb0;

	LIGHTEST BLUE:
	#b7c4cd;


*/


* { margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}

html {
	font-size: 62.5%;
	height:100.1%;
}

body {
	font-family: Helvetica, Arial, sans-serif;
	background:url(/_cust/images/bgtile.jpg) repeat 180px 0;
	font-size: 1.25em;
	color: #717070;
}

h1, h2, h3, h4, h5 {
	color:#0c3d61;
	font-weight:normal;
}

h1 {
    font-size: 2.3em;
	margin-bottom:25px;
}

h2 {
    font-size: 2.3em;
    color: #002f42;
   	margin-bottom:8px;
}

h3 {
    font-size: 1.7em;
}

h4 {
	font-size: 1.5em;
}

h5 {
	font-size: 1.3em;
}

a:link {
	color:#0c3d61;
	text-decoration: underline;
}

a:visited {
	color:#859eb0;
	text-decoration: underline;
}

a:hover {
	color:#5d7a90;
	text-decoration: none;
}

a:active {
	color:#000000;
	text-decoration: underline;
}

p {
	line-height:1.6em;
	margin-bottom:10px;
}


/*---------------------------------- HEADER STYLES ------------------------------------ */

#headerwrap {
	width:100%;
	height:72px;
	margin-bottom: 30px;
	background:url(/_cust/images/htile.jpg) repeat-x;
}

#header {
	height:72px;
	width:1000px;
	margin:0 auto;
}

#header img.logo {
	float:left;
}

/*---------------------------------- MAIN BODY STYLES ------------------------------------ */

#container {
	width:100%;
}

#contentwrap {
	width:940px;
	margin:0 auto 30px;
	background:url(/_cust/images/content_middle_repeat.jpg) repeat-y;
}

#content {
	width:895px;
	background:url(/_cust/images/content_middle_top.jpg) no-repeat;
	padding: 0 20px 20px 25px;
	float: left;
}

#pagecontent {
	width: 668px;
	float: right;
	text-align:justify;
}

#pagecontent img {
	border: 1px solid #193441;
}

.rightimg{
	float: right;
	margin-left:20px;
	margin-right: 4px;
}


/* ---------------------------------- MAIN NAVIGATION STYLES ------------------------------------ */

ul#nav {
	height:34px;
	float: right;
	margin-top: 13px;
}

ul#nav li {
	list-style:none;
	float:left;
}

ul#nav li a {
	display:block;
	overflow:hidden;
	text-indent:-9000px;
	height:38px;
}

ul#nav a.SurfaceBtn, ul#nav a.SurfaceBtn:visited {
	width:99px;
	background:url(/_cust/images/surfacesBtn.jpg) top no-repeat;
}

ul#nav a.ServiceBtn, ul#nav a.ServiceBtn:visited {
	width:98px;
	background:url(/_cust/images/servicesBtn.jpg) top no-repeat;
}

ul#nav a.GalleryBtn, ul#nav a.GalleryBtn:visited {
	width:98px;
	background:url(/_cust/images/galleryBtn.jpg) top no-repeat;
}

ul#nav a.SinksBtn, ul#nav a.SinksBtn:visited {
	width:98px;
	background:url(/_cust/images/sinksBtn.jpg) top no-repeat;
}

ul#nav a.AboutBtn, ul#nav a.AboutBtn:visited {
	width:98px;
	background:url(/_cust/images/aboutBtn.jpg) top no-repeat;
}

ul#nav a.FaqBtn, ul#nav a.FaqBtn:visited {
	width:98px;
	background:url(/_cust/images/faqsBtn.jpg) top no-repeat;
}

ul#nav a.ContactBtn, ul#nav a.ContactBtn:visited {
	width:101px;
	background:url(/_cust/images/contactBtn.jpg) top no-repeat;
}

ul#nav a.SurfaceBtn:hover,
ul#nav a.ServiceBtn:hover,
ul#nav a.GalleryBtn:hover,
ul#nav a.SinksBtn:hover,
ul#nav a.AboutBtn:hover,
ul#nav a.FaqBtn:hover,
ul#nav a.ContactBtn:hover {
	background-position:center;
}


body#SurfacePage ul#nav a.SurfaceBtn,
body#GalleryPage ul#nav a.GalleryBtn,
body#SinksPage ul#nav a.SinksBtn,
body#AboutPage ul#nav a.AboutBtn,
body#FaqPage ul#nav a.FaqBtn,
body#ServicePage ul#nav a.ServiceBtn,
body#ContactPage ul#nav a.ContactBtn {
	background-position:bottom;
	cursor:default;
}

/* ---------------------------------- SIDEBAR STYLES ------------------------------------ */

#sidebar {
	float: left;
	width: 210px;
	margin-bottom: 30px;
}

body#ContactPage #sidebar {
	width: 330px;
}

body#ContactPage #pagecontent {
	width: 548px; 
}


#promotionsPanel {
	width:208px;
	margin-left: 1px;
	margin-bottom: 15px;
	background:url(/_cust/images/promo_tile.jpg) repeat-y;
}

#promotionsPanel h3 {
	font-size: 21px;
	padding: 0 15px 5px;
	text-align:center;
}

#promotionsPanel p {
	color:#748f9b;
	padding: 5px 15px 0 15px;
	font-size: 11px;
	text-align: justify;
}

#sidebar a.panel {
	display: block;
	width: 212px;
	height: 99px;
	margin-bottom: 10px;
}


a.learnMoreBtn {
	display:block;
	overflow:hidden;
	text-indent:-9000px;	
	height:34px;
	width: 106px;
	background:url(/_cust/images/learnMoreBtn.jpg) top no-repeat;
	float: right;
	margin-right:5px;
	margin-bottom: 10px;
}

a.learnMoreBtn:hover {
	background-position: bottom;
}

.promoThumb {
	margin-left: 18px;
	margin-top: 3px;
	margin-bottom: 3px;
}


/* ---------------------------------- HOME PAGE STYLES ------------------------------------ */


#hometop {
	position: relative;
	width:882px;
	height: 350px;
	padding: 0 18px 0 40px;
	background:url(/_cust/images/content_middle_top.jpg) no-repeat;
}

#slideshow {
	background:url(/_cust/images/slideshowframe.jpg) no-repeat;
	position: relative;
	display: block;
	width: 441px;
	height: 306px;
	float: right;
}

#slideshow img.picture {
	position: absolute;
	top: 18px;
	left: 17px; 
}	

.hiBtn {
	position: absolute;
	top: 328px;
	left: 102px; 
}

#hiVideo {
	margin-left: 100px;
}


#topleft {
	position: relative;
	float:left;
	width: 430px;
}

#topleft h1 {
	margin-bottom: 12px;
}

#topleft p{
	color:#748f9b;
	padding: 0px 50px 0 20px;
	line-height:22px;
}


#topleft .quoteBtn{
	float:right;
	margin: 25px 35px 30px 0;
}


ul#homenav {
	position: absolute;
	bottom: 0px;
	right: 80px;
	height:27px;
	float: right;
	//margin: 13px 40px 0 0;
}

ul#homenav li {
	list-style:none;
	float:left;
}

ul#homenav li a {
	display:block;
	overflow:hidden;
	text-indent:-9000px;	
	height:27px;
}

ul#homenav li a.introBtn, ul#homenav li a.introBtn:visited {
	width:101px;
	background:url(/_cust/images/introBtn.jpg) top no-repeat;
}

ul#homenav li a.homeideasBtn, ul#homenav li a.homeideasBtn:visited {
	width:137px;
	background:url(/_cust/images/homeideasBtn.jpg) top no-repeat;
}

ul#homenav li a.featuredBtn, ul#homenav li a.featuredBtn:visited {
	width:101px;
	background:url(/_cust/images/featuredBtn.jpg) top no-repeat;
}

ul#homenav li a.introBtn:hover,
ul#homenav li a.homeideasBtn:hover,
ul#homenav li a.featuredBtn:hover {
	background-position:bottom;
}

#HomePage #content {
	padding-top: 25px;
}

ul#subnav {
	margin-bottom: 35px;
	height: 99px;
}

ul#subnav img {
	border: none;
}

ul#subnav li {
	list-style:none;
	float:left;
	margin-right: 15px;
}

ul#subnav li.last {
	margin-right: 0px;
}

ul#subnav li a {
	display:block;
	width: 212px;
	height:99px;
}

a.quoteBtn {
	display:block;
	overflow:hidden;
	text-indent:-9000px;	
	height:34px;
	width: 163px;
	background:url(/_cust/images/requestQuoteBtn.jpg) top no-repeat;
}

a.quoteBtn:hover {
	background-position: bottom;
}



/* ---------------------------------- SURFACES PAGE STYLES ------------------------------------ */
ul.mflist {
	list-style: none;
	height: 19px;
	margin-top: 8px;
	margin-bottom: 12px;
	margin-left: 20px;
}

ul.mflist li {
	margin-left: 8px;
	margin-bottom: 8px;
	float: left;

}

ul.mflist li a {
	text-decoration: none;
	color: #ebebeb;
	display: block;
	text-align: center;
	height: 19px;
	line-height: 19px;
	width: 146px;	
	background: url(/_cust/images/subtabBtnWider.jpg) no-repeat top;
}

ul.mflist li a:hover, ul.mflist li a.selected {
	color: #00405f;
	background-position: bottom;
}
	
.mf_disp {
	 display: none;
	 width: 620px; 
}

#tb-solid p {
	color: #898989;
}

.imgholder {
	float: left;
	width: 102px;
	height: 140px;
	padding: 0 22px 15px;
	background-color: #fff;
}

.imglabel {
	text-align: center;
	width: 100px;
	margin-top: 6px;
	color: #898989;
	font-size: 0.9em;
}


/* ---------------------------------- SERVICES PAGE STYLES ------------------------------------ */

ul#services {
	margin-top: 25px;
}

ul#services li {
	list-style:none;
	margin-top: 10px;
	margin-left: 15px;
	font-size: 13px;
	font-weight: bold;
}

/*----------------------------------------------------------- GALLERY STYLES --------------------------------*/

.gallery .loaderhold {
	float: right;
	margin-right: 20px;
	width: 370px;
}

ul.thumbnails {
	float: left;
	width: 290px;
}

ul.thumbnails li {
	margin-bottom: 4px;
	margin-right: 4px;
	position: relative;
	list-style:none;
	float: left;
}

.loader {
	float: right;
	margin-right: 20px;
	height: 240px;
}

.loader img {
    height: 240px;
    width: 320px;
    margin-bottom: 7px;
}

.loader p {
	position: absolute;
	top: 15px;
	left: 15px;
	display: none;
}

.loader.loading p {
	display: static;
}


.captholder {
	font-size: 1.2em; 
	background-color: none;
	width: 450px;  
	margin-left: 198px;
	text-align: right;
	padding-top: 250px;
}


/*----------------------------------------------------------- FAQ STYLES -----------------------------------------------------------*/

.faq_holder {
	margin-top: 12px;
	margin-right: 8px;
	background-color: #cfcfcf;
	padding: 12px 8px;
}

.faq_question {
	font-weight: 900;
	font-size: 1.2em;
}

.faq_answer {
	color: #0c3d61;
}

.faq_answer p {
	margin-bottom: 0;
}

/* ---------------------------------- CONTACT PAGE STYLES ------------------------------------ */

#contactPanel {
	text-align: center;
	margin: 5px 0 25px;
	line-height: 24px;
}

input.ffi {
	border: 1px solid #193441;
	border-bottom: 1px solid #aeaeae;
	border-right: 1px solid #aeaeae;
	height: 18px;
	padding: 4px 2px 2px 2px;
	background-color: #fafafa;
	color: #0C3D61;
}

textarea.ffi {
	border: 1px solid #193441;
	border-bottom: 1px solid #aeaeae;
	border-right: 1px solid #aeaeae;
	background-color: #fafafa;
	color: #0C3D61;
	padding: 4px 2px 2px 2px;
}

.word_verification {
	font-size: 1.5em;
	height: 24px;
	border: 1px solid #193441;
	border-bottom: 1px solid #aeaeae;
	border-right: 1px solid #aeaeae;
	background-color: #fafafa;
	color: #0C3D61;
}

a.submitBtn {
	display:block;
	overflow:hidden;
	text-indent:-9000px;	
	height:34px;
	width: 85px;
	background:url(/_cust/images/submitBtn.jpg) top no-repeat;
	float: right;
}

a.submitBtn:hover {
	background-position: bottom;
}


/*----------------------------------------------------------- FOOTER -----------------------------------------------------------*/

#footerwrap {
	width:100%;
	background:url(/_cust/images/ftile.jpg) repeat;
	height:268px;
}

#footer {
	width:895px;
	margin:0 auto;
	color:#8a7b70;
	text-decoration:none;
	padding-top:18px;
}

#footer .footermenu {
	float: left;
	width: 175px;
	margin: 0 60px 0 0;	
}

#footer .last {
	margin: 0 0 0 0;
}

#footer .last a {
	border-bottom: 1px solid #392820;
}

#footer a.labelheader {
	margin-top: 10px;
	display: block;
	height: 16px;
	width: 174px;
}

#footer h5 {
	color: #ea9e27;
	font-size: 11px;
	font-weight: bold;
	margin: 13px 10px 7px 20px;
}

#footer address {
	font-size: 10px;
	font-style: normal;
	color:#8a7b70;
	line-height: 14px;
	margin: 0 0 17px 30px;
}

#footer ul {
	list-style:none;
}

#footer ul li {
	margin: 7px 0 0 20px;
}

#footer a, #footer a:visited {
	font-size: 10px;
	color:#8a7b70;
	text-decoration:none;
}

#footer a:hover {
	color: #FFFFFF;
}


/*----------------------------------------------------------- SITEMAP PAGE STYLES -----------------------------------------------------------*/



.sitemap {
	margin-left: 24px;
	margin-top: 196px;
	margin-right: 80px;
	font-size: 1.1em;
}

.sitemap ul {

	list-style: none;
}

.sitemap ul li
{
	margin-left: 64px;
	float: right;
}


#maincopy{
	padding: 8px;
}

.error_msg
{
	border: 1px solid #ff0000;
	color: #ff0000;
	background-color: #ffffff;
	font-weight: 900;
	padding: 4px;
	text-align: center;
}

.success_msg
{
	border: 1px solid #00ff00;
	color: #009900;
	background-color: #ffffff;
	font-weight: 900;
	padding: 4px;
	text-align: center;
}

.form_msg_width
{
	width: 400px;
}


/*----------------------------------------------------------- CLEARFIX -----------------------------------------------------------*/

.hideit {
	display: none;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}