
/* Reset browser defaults */
@import url('reset.css');

/* Apply basic typography styles */
@import url('typography.css');

/* Apply default theme styles and colors */
@import url('default.css');

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700&v2);


.green { color:#3fa500;}
.light-blue { color:#00bbe7;}

body { background:url(../images/background/header-bg.png) repeat-x #f0f0f0;}

body, input, textarea { color:#666; font-family: 'Open Sans', sans-serif; font-size:13px; line-height:18px; font-weight:normal; }
#header { position:relative;  background:url(../images/background/header-splash.jpg) no-repeat center top;}
#header .container { position:relative; height:143px;}

#branding { margin:0 auto;  padding:0;}
h3#util { position:absolute; right:0; top: 10px; font-size:16px; color:#3fa500; font-weight:700;}

#content {background:#fff; padding:0 40px; width:940px; margin:0 auto; padding:40px 30px; overflow:auto;}

#branding h1 a, .logo h2 a { background:url(/images/logo.png) no-repeat; height: 101px; width: 199px; text-indent:-9999px; display:block;}
.logo h2 a { background:url(/images/logo-gray.png) no-repeat; text-align:center;}
.portals { padding:25px 0 40px 30px; overflow:auto; clear:both; margin:0 auto; width:965px; background:url(../images/background/portal-bg.jpg) repeat-x top;}
.portals p{ padding-right:10px; }

h1, h2, h3, h4, h5 { font-weight:700; font-family: 'Open Sans', sans-serif; }
h1 { padding-top:25px;}
h2 { font-size:28px; line-height:30px; color:#005dab; padding-bottom:20px;}
h3 { font-weight:normal; font-size:20px; line-height:26px; color:#666; padding-bottom:15px;}
h4 { font-size:18px; line-height:24px; color:#005dab;padding-bottom:10px;}

.home .main { margin-bottom:30px;}

.main li { 
    background-image: url("/images/background/bullet.png");
    background-position: 0 0.5em;
    background-repeat: no-repeat;
    margin-bottom: 0;
    padding-left: 10px;
	padding-bottom:5px;
}

.main ul.checkmark li { 
    background-image: url("/images/background/checkmark.png");
    padding-left: 15px;
}

.internal #content h2 { background:url(/images/background/diag-pattern.png) bottom repeat-x; margin-bottom:20px}

.home .main p, .home .main h3 { padding-right:30px; }
.home .half { width:460px;}
.half, .col-container .half { width:48%;}
.col { width:300px; margin-right:20px; float:left;}
.col img {float:left;}
#content .last { margin-right:0;}
.missing #aside { background-color:#fff;}
#aside { width:205px; padding:10px; margin-right:30px; float:left; background-color:#F0F0F0;}

.sidenav li a{ padding:5px 10px 5px 20px; background: url("/images/background/arrow.png") no-repeat scroll 0 50% transparent;  display:block; text-decoration:none; color:#666; border-bottom:1px dotted #999; margin-bottom:1px;}

.sidenav li a:hover { background-color:#dfdfdf; color:#005dab;}
p.error { color:#005dab; }
.internal .main { width:685px; float:left; overflow:auto;}
.fullwidth .main { width:100%}
.internal .contact-left { width:640px; float:left; overflow:auto;}
.internal .contact-right { width:260px; float:left; overflow:auto; padding:10px; margin-right:20px;}
.internal .contact-right .address {font-weight:bold;}
.internal .one-col {float:left; overflow:auto; background: url("/images/background/culliganman-bg.jpg") no-repeat scroll center bottom transparent; background-color:#ebebeb; min-height: 400px; padding: 30px 386px 20px 30px; width: 524px; margin-bottom:40px;}
.internal .one-col h2 { border-bottom:1px solid #ccc; }
.internal .one-col h4 {color: #666666; font-size: 14px;line-height: 22px; padding-bottom:20px;}
.internal .three-col {width:310px; float:left;}
.internal .three-col img {float: left; padding-right: 13px;}
.three-col a { text-decoration:none;}
.three-col p strong { font-size:14px; line-height:28px;}
.internal .three-col h4 {font-size: 14px; line-height: 18px; margin-bottom: 5px;}
.main h4{ font-size:16px; padding-bottom:10px; padding-top:10px;}
.three-col h4 a { text-decoration:none;}
.internal .three-col p {float: left; width:164px;}
.internal .three-col a.learn-more {margin-left: 110px;}

.internal .two-thirds { width:60%}
.internal .one-third { width:33%;}

.form-container { padding:30px; width:880px; background-color:#dedede; margin-bottom:30px;}
.gray-grad { background: #eef4f6; /* Old browsers */

background: -moz-radial-gradient(center, ellipse cover,  #eef4f6 86%, #d8e3ec 99%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(86%,#eef4f6), color-stop(99%,#d8e3ec)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover,  #eef4f6 86%,#d8e3ec 99%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover,  #eef4f6 86%,#d8e3ec 99%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover,  #eef4f6 86%,#d8e3ec 99%); /* IE10+ */
background: radial-gradient(center, ellipse cover,  #eef4f6 86%,#d8e3ec 99%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eef4f6', endColorstr='#d8e3ec',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.form-container h3 { padding-bottom:30px;}
.form-container .content { width:420px; float:left;}
.form-container label, .form-container input { display:block; }
.form-container label {/* width:90px*/; font-weight:bold; /*margin-top:8px;*/}
.form-container input, .form-container textarea { background-color: #fff; border:1px solid #ccc; padding: 2px; margin-bottom:5px;}
.form-container input { width:180px;}
.form-container textarea { width:400px;}
.form-container form { width:420px; float:right;}
.form-container input[type="submit"] { margin:10px 0 0 0!important;}
.form-container p.small { margin-bottom:8px;}


a.learn-more { background: url("../images/background/btn-sprites.png") no-repeat scroll 0 0 transparent; display: block; height: 26px; text-decoration: none; width: 98px; }
a.learn-more:hover { background-position:0 -26px;}

a.free-consultation { background:url(../images/background/btn-free-consultation.png) no-repeat; display:block; height:61px; width:164px; text-indent:-999em;}
a.free-consultation:hover { background-position: 0 -61px;}

#form input.contact-us[type="submit"] { background:url(/images/background/btn-contact-us.png) no-repeat; display:block; height:41px; width:154px; tex-indent:-999em; border:none;}
#form input.contact-us[type="submit"]:hover, #form input.request-quote:hover { background-position:0 -41px;}

#form input.request-quote[type="submit"] { background:url(/images/background/btn-request-quote.png) no-repeat; display:block; height:41px; width:154px; tex-indent:-999em; border:none;}


input[type="button"], input[type="submit"] { cursor: pointer; }

.hr { background:url(/images/background/diag-pattern.png) repeat-x; height:10px; width:100%; clear:both; margin:0 0 30px; display:block;}
.timers li { background:none; padding-left:0;}
.timers li li { background:url(/images/background/bullet.png) 0 0.5em no-repeat; padding-left:10px;}

/* =Menu
-------------------------------------------------------------- */
#access { background-color:#00427a; height:48px; z-index:2; border-top:1px solid #fff; border-bottom:1px solid #3fa500;}

.menu { width:1000px; margin:0 auto;}

#navigation { }

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
	z-index:99;
}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			180px; /* left offset of submenus need to match (see below) */
	z-index:99;
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			180px; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			180px; /* match ul width */
	top:			0;
}

/*** THEMATIC SKIN ***/
.sf-menu {
    border-right:none;
	float:left;
}
.ie6 .sf-menu {
	margin-bottom: -1px;
}
.sf-menu .blank a { background-image:none;}
.sf-menu a {
	border-top:none; padding:0 15px; text-decoration:none; font-family:'Open Sans', sans-serif; text-transform:uppercase; font-size:14px; line-height:48px; background:url(/images/background/triangle-over.png) no-repeat 50% 45px;}

.menu .sf-menu .children {  background-color:#005dab; padding:10px 0;}
.menu .children a { border-left:none; border-right:none; padding:5px; line-height:18px; margin:0 10px; border-bottom:1px dotted #3688cc !important; background-image:none!important; font-size:12px;}

.windows .sf-menu a {
	font-size: 14px;
	padding:10px 27px;
}

.sf-menu .current_page_item a,
.sf-menu .current_page_ancestor a,
.sf-menu .current_page_parent a {
	background-color:#333;
}

.sf-menu a, .sf-menu a:visited, .sf-menu a:link { /* visited pseudo selector so IE6 applies text colour*/
	color:#ffffff;
}
.sf-menu li {
	background: none;
}
.sf-menu li li {
	background:	none;
}
.sf-menu li li li {
	background:		#005dab;
}



.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	color:#fff;
    background:     url(/images/background/triangle.png) no-repeat 50% 45px #005dab;
	outline:		0;
}

.blank li:hover, .blank li.sfHover,
.blank a:focus, .blank a:hover, .blank a:active {
  background-image:none;
}
.sf-menu ul {
    border-right:none;
    border-bottom:none;
}

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	top:48px; /* overriding essential styles */
}
.sf-menu ul ul {
    margin-top:0;
}
.sf-menu ul a {
	text-transform:none;
    background:#005dab;
}
.sf-menu ul a:hover {
    color: #fff;
	background-color:#00437b;
}

/* End Menu */


.main .testimonials li { background:url(/images/background/quotes.png) no-repeat top left; padding-left:25px; padding-top:15px; padding-right:20px;}

/* Forms */
#form label {width:60px; margin:10px 10px 10px 10px;}
#form input {width:150px; margin:10px 10px 10px 10px;}
#form textarea {width:153px; margin:10px 10px 10px 10px;}
#form textarea.instructions {width:173px; margin:10px 10px 10px 10px;}
#form input.account {margin:10px 10px 10px 30px; width:15px;}
#form input.quantity {margin:10px 10px 10px 10px; width:20px;}
#form .email {width:60px; margin:10px 43px 10px 10px;}
#form .company {width:60px; margin:10px 18px 10px 10px;}
#form .phone {width:60px; margin:10px 36px 10px 10px;}
#form .address {width:60px; margin:10px 31px 10px 10px;}
#form .zip {width:60px; margin:10px 22px 10px 10px;}
#form .comments {width:60px; margin:10px 24px 10px 10px; vertical-align:top; float:left;}
#form .saltsmall {margin:10px 47px 10px 10px;}
#form .saltbig {margin:10px 41px 10px 10px;}
#form .rowater {margin:10px 38px 10px 10px;}
#form .springwater {margin:10px 20px 10px 10px;}
#form .fluoridewater {margin:10px 10px 10px 10px;}
#form input[type="submit"], .form-container input[type="submit"] {background: url("../images/background/btn-submit.png") no-repeat scroll 0 0 transparent; border: 0 none; height: 41px; margin-left: 100px; margin-top: 30px; padding: 0; text-indent: -9999px; width: 154px; vertical-align:top; clear:both; float:left;}
#form input[type="submit"]:hover { background-position: 0 -41px;}
#form input[type="submit"].orderonline {background: url("../images/buttons/order-now.png") no-repeat scroll 0 0 transparent; border: 0 none; height: 62px; margin-left: 100px; margin-top: 30px; padding: 0; text-indent: -9999px; width: 184px; vertical-align:top;}

.one-col input {display: inline; width: 120px; margin:10px 10px 10px 10px;}
.one-col label {width:60px; margin:10px 10px 10px 10px;}
.one-col .email {width:60px; margin:10px 41px 10px 10px;}
.one-col .phone {width:60px; margin:10px 41px 10px 10px;}
.one-col .zip {width:60px; margin:10px 22px 10px 10px;}
.one-col .comments {width:60px; margin:10px 17px 10px 10px;}
.one-col input.commentinput {width:355px;}
.one-col input[type="submit"] {background: url("../images/background/btn-free-consultation.png") no-repeat scroll 0 0 transparent; border: 0 none; height: 61px; margin-left: 100px; margin-top: 10px; padding: 0; text-indent: -9999px; width: 184px;}

.one-col input[type="submit"]:hover { background-position:0 -61px;}

/* End Forms */


.container { width:960px; margin:0 auto;}

#footer { border-top:3px solid #3fa500; min-height:300px; margin-top:0; padding-top:40px; background:#3f474f;}
#footer .container { padding-left:30px; width:970px;}
#footer p { color:#ccc; font-size:12px;}
#footer .half { width:50%;}
.underline { border-bottom:1px solid #434343;}
.footer-links { text-transform:uppercase; font-size:11px; font-weight:700;}
.footer-links li { margin-bottom:10px;}
.footer-links a:link, .footer-links a:visited { color:#e6e6e6; text-decoration:none;}
.footer-links a:hover {  color:#00bbe7;}


a.arrow, .panel-wrapper a { background:url(/images/background/arrow.png) 0 50% no-repeat; padding-left:20px;}
a:link, a:visited { color:#005dab; }
a:active, a:hover { color: #3fa500; }

.border { border: 1px solid #ccc;}
.small { font-size:11px; line-height:14px;}
.left { float:left;}
.right { float:right;}
.center {text-align:center;}
.faq {font-weight:bold;}
.clear { clear:both;}
