/*------------------------------------*\
    RESET
\*------------------------------------*/

html {
	width: 100%;
	height: 100%;
	overflow-x: hidden;
}
body {
	line-height: 1.4;
	font-weight: normal;
	font-size: 13px;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	background-color: #006ea0;
	margin: 0px;
	padding: 0px;
	height: 100%;
	width: 100%;
	-webkit-font-smoothing: subpixel-antialiased;
	-moz-osx-font-smoothing: grayscale;
}

div {
	display: inline-block;
}
div.divblock {
	display: block;
}
div img {
	max-width: 100%;
}
a {
	text-decoration: none;
	-webkit-transition: all .4s; /* For Safari 3.1 to 6.0 */
	transition: all .4s;
	color: #FFCE02;
}
a.bluebutton {
	display: inline-block;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	background-color: #4EC1EA;
	padding: 5px 15px;
	color: rgba(255,255,255,1.00);
	text-align: center;
	font-size: 18px;
	line-height: 18px;
	vertical-align: middle;
	margin: 10px;
	height: 18px;
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
}
a.darkbutton   , .darkbutton, input.darkbutton{
	display: inline-block;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	background-color: #092E6E;
	padding: 8px 15px;
	color: rgba(255,255,255,1.00);
	text-align: center;
	font-size: 20px;
	line-height: 20px;
	vertical-align: middle;
	height: 20px;
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	font-weight: 300;
}
a.bluebutton:hover    , a.bluebutton:focus, a.darkbutton:hover, a.darkbutton:focus, .darkbutton:hover{
	color: #092E6E;
	background-color: #FFCE00;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	opacity: 1;
}
a img:hover {
	opacity: 0.8;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0px;
	padding-right: 15px;
	padding-left: 15px;
}
h1, h2, h3, h4, h5, h6  {
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	font-weight: 400;
	font-variant: normal;
	letter-spacing: 1px;
}
h1  {
	color: #006ea0;
	font-size: 46px;
	line-height: 54px;
	text-align: left;
}

.main-head{
font-size: 550%;
	padding-top: 30px;
	letter-spacing: 2px;
	text-align: center;
line-height: 70px;}

.second-head{
	font-size: 50px;
letter-spacing: 2px;
line-height: 70px;}


h2 {
	font-size: 36px;
	line-height: 42px;
	margin-bottom: 8px;
	color: #4EC1EA;
}
h3 {
	font-size: 36px;
	line-height: 42px;
	margin-bottom: 8px;
	color: #FFFFFF;
}

h4 {
	margin-bottom: 10px;
	color: #006EA0;
	font-size: 34px;
	text-align: left;
}

h5 {
	margin-bottom: 10px;
	color: #FFFFFF;
	font-size: 22px;
	text-align: left;
}

h6 {
	margin-bottom: 8px;
	color: #FFFFFF;
	font-size: 18px;
	text-align: left;
}

p {
	margin-left: auto;
	margin-right: auto;
	color: #DEDEDE;
}

ul {
	padding: 0;
}

ul, ol {
	list-style:none;
}

p, ul, ol {
	font-family: 'Open Sans', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 25px;
}

.two {
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
}

.bloglist {margin-left: 35px;}


.bloglist li:before{content:"•";
margin-left: -20px;
padding-right: 10px;
}

.bloglist li{margin-bottom: 7px;}


.icon-bar{
  background-image: -moz-linear-gradient( 90deg, rgb(12,30,55) 15%, rgb(10,49,103) 39%, rgb(12,30,55) 60%);
  background-image: -webkit-linear-gradient( 90deg, rgb(12,30,55) 15%, rgb(10,49,103) 39%, rgb(12,30,55) 60%);
  background-image: -ms-linear-gradient( 90deg, rgb(12,30,55) 15%, rgb(10,49,103) 39%, rgb(12,30,55) 60%);
  width: 1220px;
  height: auto;
padding-left: 3%;
	padding-right: 3%;
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: center;
	float: none;
}

.icons{
	
	width:auto;
	height: 58px;
text-align:center;
margin: 1%;}

	
.zero-fi{
	width: 28%;
	}



/*---------
*,
*:after,
*:before {
  	margin:0;    
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
------*/

/*------------------------------------*\
    STRUCTURE
\*------------------------------------*/

.hmvid{
 width: 100%;
	height: auto; 

}

.covid {
	text-align: center;
	color: #FFCE00!important; 
	font-weight: bold;
	font-size: 20px;
width: 75%;}

.wrapper {
	width: 100%;
	margin: 0 auto;
	display: block;
	overflow-y: auto;
}
.darkbg {
	background-color: #092E6E;
}
.darkbg p {
	color: #fff;
	line-height: 26px;
}
.darkbg h4 {
	color: #FFFFFF;
	font-size: 28px;
	text-align: center;
	line-height: 32px;
	margin: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.whitebg h4 {
	color: #4FC1EA;
	font-size: 28px;
	text-align: center;
	line-height: 32px;
	margin: 0px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.whitebg p {
	color: #0A2E6E;
}
.whitebg .bluebg p {
	color: #FFFFFF;
}
.whitebg p a {
	color: #4EC0EA;
}
.darkbg h4 .golink {
	padding: 5px 10px;
	display: inline-block;
	background-color: #FFFFFF;
	color: #092E6E;
}
.darkbg h4 .golink:hover  {
	background-color: #4EC1EA;
	color: #FFF;
	text-decoration: none;
}
.darkbg h2 {
	color: #4EC1EA;
	text-align: center;
}
.whitebg  {
	color: #4EC1EA;
	background-color: #fff;
}
.whitebg h5 {
	color: #026EA0;
}
.whitebg h6 {
	color: #026EA0;
	margin-bottom: 0px;
}
.bluebg {
	background-color: #006ea0;
}

.bluebg {
	background-color: #006ea0;
}

.yellowbg {
	background-color: #FFCE00;}


.litebg {
	background-color: #4EC1EA;
}
.litebg h2 {
	color: #092E6E;
	text-align: center;
}
.litebg h4 {
	color: #092E6E;
	font-size: 28px;
	text-align: center;
}
.litebg p {
	color: #fff;
}
.litebg p a {
	color: #0A2E6E;
}
.litebg .darkbg p a {
	color: #FFCE02;
}
.bg-hilite-left {
	background-image: url(../img/placeholders/BG-HIGHLIGHT-LEFT.jpg);
}
.bg-hilite-right {
	background-image: url(../img/placeholders/BG-HIGHLIGHT-RIGHT.jpg);
}

.main {
	width: 100%;
	margin: 0;
	padding: 30px 0px;
	display: block;
}
.mainNav {
	width: 100%;
	margin-top: 75px;
	margin-right: 0;
	margin-left: 0;
	text-align: right;
	clear: both;
}
.content {
	margin: 0 auto;
	width: 100%;
	max-width: 1300px;
	display: block;
	padding: 20px 0px;
	position: relative;
	top: 0px;
	left: 0px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.content-text {
	margin:0 0 15px;
}
.header {
	padding: 0 0 20px;
	background-color: #fff;
	/* [disabled]overflow: hidden; */
	width: 100%;
}
.header .content {
	padding-top: 0px;
}
#topbar {
	width: 100%;
	height: 22px;
}
.toplinks {
	background-color: #092E6E;
	width: 650px;
	height: 40px;
	padding: 12px 16px;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 24px;
	text-align: center;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	margin-right: 20px;
	margin-left: auto;
	float: right;
}
#topbar a  {
	color: #FFFFFF;
	display: inline-block;
	padding: 3px 3px 3px 40px;
	background-repeat: no-repeat;
	background-size: 35px auto;
	margin-left: 5px;
	margin-right: 5px;
}
#topbar a.phone {
	background-image: url(../img/phone-button.png);
}
#topbar a.mobile {
	background-image: url(../img/mobile-button.png);
}
#topbar a.appt {
	background-image: url(../img/appointment-button.png);
}
.header .logo {
	margin-left: auto;
	margin-right: auto;
	display: block;
	text-align: center;
	padding-left: auto;
	padding-right: auto;
	max-width: 520px;
}
.header .logo-img {
	width: 91%;
	height: auto;
	display: block;
	margin: 0 0 0 8%;
}
.logo a {
	text-align: center;
}

.demo-nav {
	float:right;
	margin:12px 0;
	list-style:none;
}
.demo-nav-link {
	
}
.demo-nav-link a {
	color:#2BA6CB;
	text-decoration:none;
}
.aboutbox {
    padding-bottom: 30px;
    z-index: 50;
    position: relative;
    top: 0px;
    left: 0px;
    text-align: center;
}
.aboutbox h2 {
	padding-top: 35px;
	color: #4EC1EA;
	font-size: 35px;
	line-height: 40px;
	text-align: left;
	padding-left: 45px;
	padding-bottom: 20px;
}
.aboutbox h3 {
	padding-top: 35px;
	color: #4EC1EA;
	font-size: 35px;
	line-height: 40px;
	text-align: left;
	padding-left: 45px;
	padding-bottom: 20px;
}
.aboutbox p {
	text-align: left;
	padding: 0px 45px 15px;
	font-size: 16px;
	margin: 0px;
	line-height: 20px;
	color: #DDF5FF;
}
.aboutbox ul {
	text-align: left;
	padding: 0px 20px 20px 45px;
	margin: 0px;
}
.aboutbox ul li {
	font-size: 18px;
	line-height: 22px;
	margin-bottom: 10px;
}
.aboutbox a.bluebutton  {
	margin-top: 25px;
}
.solutions a {
	width: 75%;
	display: block;
	margin: 20px auto;
	height: auto;
}
.cases a {
	width: 90%;
	display: block;
	margin: 20px auto;
	height: auto;
}
.nopadding {
	padding: 0px;
}
.padding25 {
	padding: 25px 0px;
}
.padding15 {
	padding: 15px 0px;
}
.solutions a img {
	width: 100%;
	height: auto;
}
.cases a img {
	width: 100%;
	height: auto;
}
.bluebar h2 {
	font-size: 38px;
	padding-top: 35px;
	text-align: left;
	padding-left: 40px;
	padding-bottom: 20px;
}
.bluebar h1 {
	font-size: 38px;
	padding-top: 35px;
	text-align: left;
	padding-left: 40px;
	padding-bottom: 20px;
	color: #092E6E;
	line-height: 42px;
	margin-bottom: 8px;
}

.blueslice {
	width: 98%;
	background-color: #006EA0;
	z-index: 1000;
	border-top: 5px solid #FFFFFF;
	border-bottom: 5px solid #FFFFFF;
	padding: 18px 1%;
	/* [disabled]text-align: right; */
	display: block;
}
.blueslice .content {
	margin: 0 auto;
	width: 100%;
	padding: 0;
	max-width: 1300px;
	display: block;
	text-align: right;
}
.blueslice .col30.col-left {
	position: relative;
	top: 0px;
	left: 0px;
}
.blueslice .footerlogo {
	position: relative;
	top: 0px;
	left: 0px;
	z-index: 1100;
	width: 100%;
	max-width: 390px;
}
.blueslice .footerlogo a {
	display: block;
	width: 150%;
	max-width:490px;
	height: auto;
	position: absolute;
	top: -70px;
	left: 20px;
}
.blueslice .logo-img {
	width: 100%;
	height: auto;
	margin: 0;
	display: block;
}
.blueslice p {
	display: block;
	margin: 0px;
	font-size: 21px;
	color: rgba(255,255,255,1.00);
	font-weight: bold;
	line-height: 23px;
	padding: 0px;
	text-align: right;
	font-family: 'Oswald', "Helvetica Neue", Helvetica, Arial, sans-serif;
	white-space: nowrap;
}
.blueslice .slicebullet {
	color: #092E6E;
	margin-left: 6px;
	margin-right: 6px;
}


/*------------------------------------*\
    TWOUPS
\*------------------------------------*/

.twoUp {
	width: 46%;
	margin-right: 2%;
	margin-left: 2%;
	float: left;
	min-height: 1px;
}
.TwoUpRow {
	max-width: 1222px;
	margin-left: auto;
	margin-right: auto;
	width: 94%;
}
.twoUp p {
	color: #FFFFFF;
	text-align: left;
}
.twoUp h2 {
	color: #FFFFFF;
	font-size: 36px;
	line-height: 40px;
	text-align: left;
}
.twoUp h3 {
	color: #FFFFFF;
	font-size: 32px;
	line-height: 45px;
	text-align: left;
}
.twoUp ul li {
	list-style-type: square;
	margin-left: 20px;
	color: #FFFFFF;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px;
	text-align: left;
}
.twoUp img {
	width: auto !important;
	max-width: 100%;
	height: auto;
}

/*------------------------------------*\
    THREEUPS
\*------------------------------------*/

.threeup {
	width: 26%;
	float: left;
	margin-top: 10px;
	margin-bottom: 15px;
	text-align: center;
}
.threeup.flank {
	margin-left: 5%;
	margin-right: 5%;
}
.threeup.middle {
	margin-left: 1%;
	margin-right: 1%;
}
.threeup h5 {
	font-size: 28px;
	margin-bottom: 0px;
	padding-bottom: 0px;
	color: #4EC1EA;
	padding-top: 5px;
	line-height: 34px;
}
.threeup p {
	padding: 5px 5px 5px 20px;
	color: #D9D9D9;
	margin-bottom: 0px;
	line-height: 24px;
}
.threeup ul  {
	padding-left: 40px;
	margin-top: 0px;
}
.threeup ul li{
	color: #FFFFFF;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px;
	list-style-type: square;
	text-align: left;
}
.threeup img {
	width: 100%;
	height: auto;
}
.serviceselect a  {
	margin-top: 10px;
	display: block;
}
/*------------------------------------*\
    FOURUPS
\*------------------------------------*/

.fourup {
	width: 21%;
	float: left;
	margin-top: 10px;
	margin-bottom: 15px;
	text-align: center;
}
.fourup.left {
	margin-left: 2%;
	margin-right: 1%;
}
.fourup.right {
	margin-left: 2%;
	margin-right: 2%;
}
.fourup.int {
	margin-left: 2%;
	margin-right: 2%;
}
.fourup h5 {
	font-size: 26px;
	margin-bottom: 0px;
	padding-bottom: 0px;
	color: #092E6E;
	padding-top: 5px;
	line-height: 32px;
}
.fourup p {
	padding: 5px 5px 5px 20px;
	color: #D9D9D9;
	margin-bottom: 0px;
	line-height: 24px;
}
.fourup ul  {
	padding-left: 40px;
	margin-top: 0px;
}
.fourup ul li{
	color: #FFFFFF;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 18px;
	list-style-type: square;
	text-align: left;
}
.fourup img {
	width: 100%;
	height: auto;
}

.four-up{
width: 24%;
margin-left: .5%;
margin-right: .5%;
float: left;}


/*------------------------------------*/

.wrapper.lefthalf {
	background-position: center center;
	background-size: cover;
}
.bg1 {
	background-image: url(../img/waterBG.jpg);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.bg2 {
	background-image: url(../img/pure-water-BG.jpg);
	background-position: center center;
	background-size: cover;
}
.bg3 {
	background-image: url(../img/bg3.jpg);
}
.bg4 {
	background-image: url(../img/keep-your-water-clean.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}
.bg5 {
	background-image: url(../img/oldecolonycleanwater-financing.jpg);
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.bg6 {
	background-image: url(../img/oldecolonycleanwater-waterback.jpg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.bg7 {
	background-image: url(../img/oldecolonycleanwater-waterback.jpg);
	background-size: contain;
	background-position: top center;
	background-repeat: no-repeat;
}


.wrapper.righthalf {
	background-position: center center;
	background-size: cover;
}




/*------------------------------------*\
    FOOTER ELEMENTS
\*------------------------------------*/


footer {
	background-color: rgba(255,255,255,1.00);
}
.footerlogo {
	margin-left: auto;
	margin-right: auto;
	display: block;
	text-align: center;
	padding-left: auto;
	padding-right: auto;
	max-width: 390px;
	position: absolute;
	left: 10px;
	top: 0px;
}

footer a.socials  {
	width: 18%;
	height: auto;
	padding: 3px;
	display: inline-block;
	margin: 3px;
}
footer a.socials img {
	width: 100%;
	height: auto;
}
footer a {
	color: #626564;
}
.content.baseline {
	clear: both;
}
.content.baseline p {
	color: #A3A3A3;
	font-size: 13px;
	text-align: center;
}


footer .fourup {
	float: left;
	margin-top: 10px;
	margin-bottom: 15px;
	text-align: left;
}

footer .fourup h6, footer .fourup p, footer .fourup ul li {
		font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

footer .fourup h6 {
	font-size: 34px;
	margin-bottom: 12px;
	padding-bottom: 0px;
	color: #092E6E;
	padding-top: 5px;
	line-height: 40px;
	font-weight: bold;
}
footer .fourup p {
	padding: 5px 5px 5px 20px;
	color: #D9D9D9;
	margin-bottom: 0px;
	line-height: 24px;
}
footer .fourup ul  {
	padding-left: 16px;
	margin-top: 0px;
	color: #4EC1EA;
}
footer .fourup ul li{
	color: #626564;
	font-size: 17px;
	text-align: left;
	list-style-type: none;
	padding-left: 18px;
	line-height: 24px;
	padding-bottom: 10px;
	background-image: url(../img/bullet.png);
	background-repeat: no-repeat;
	background-position: left 4px;
}

footer .fourup img {
    width: 60%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 15px;
}

.join {
	padding: 50px 0px 100px;
}
.join #optin {
	width: 100%;
}
.join #optin table {
	display: block;
	width: 50%;
	width: 70%;
}
.join #optin input {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 40px;
	margin: 0px;
	border: 3px solid #092E6E;
}
.join #optin input[type=email] {
	background-color: rgba(255,255,255,0.72);
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
}
.join #optin input[type=submit] {
	background-color: rgba(9,46,110,1.00);
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 300;
	color: rgba(255,255,255,1.00);
	text-transform: uppercase;
	font-size: 20px;
	width: 112px;
}
.socialm {
	display: inline-block;
	width: 60px;
	height: 60px;
	float: none;
	}

.socialm img {
	width: 100%;
	height: auto;
	float: right;
}


/*------------------------------------*/

.fortyhigh {
	height: 40px;
}
.blue {
	color: #006EA0;
}
.white {
	color: #FFFFFF;
}
.liteblue {
	color: #4EC1EA;
}
.darkblue {
	color: #092e6e;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the overflow:hidden on the .container is removed */
	clear: both;
	height: 0;
	font-size: 1px;
	line-height: 0px;
	margin: 0px;
	display: block;
}

/* Navigation styling */
.nav {
	position: relative;
	display: inline-block;
	text-align: right;
	width: 100%;
}
.nav-list {
	margin: 0px 0px 0px auto;
	padding: 0px;
	display: block;
	width: 100%;
	text-align: right;
}
.nav-item {
	/* [disabled]float: left; */
	zoom: 1;
	margin-left: 10px;
	margin-right: 10px;
	display: inline-block;
}
.nav-item a {
	display: block;
	padding: 8px 0px 5px;
	color: #092E6E;
	white-space: nowrap;
	border-bottom: 4px solid #fff;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
	font-size: 18px;
	height: 20px;
	min-width: 25px;
}
.nav-item a.homebutton {
	background-image: url(../img/home-button.png);
	background-repeat: no-repeat;
	background-position: center center;
	/* [disabled]width: 25px; */
	background-size: 30px auto;
}
.nav-item a:hover , .nav-item a:focus{
	text-decoration: none;
	border-bottom-color: #4EC1EA;
}


/* Mobile Navigation */
.nav-mobile {
	display:none; /* Hide from browsers that don't support media queries */
	cursor:pointer;
	position:absolute;
	top:0;
	right:0;
	background:#092E6E url(../img/nav.svg) no-repeat center center;
	height:40px;
	width:40px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

/*------------------------------------*\
    FRACTIONAL COLUMNS
\*------------------------------------*/

.col20 {
	width: 20%;
}

.col25 {
	width: 25%;
}

.col30 {
	width: 30%;
}

.col35 {
	width: 35%;
}

.col40 {
	width: 40%;
}

.col45 {
	width: 45%;
}

.col50 {
	width: 50%;
}

.col55 {
	width: 55%;
}

.col60 {
	width: 60%;
}

.col65 {
	width: 65%;
}

.col70 {
	width: 70%;
}

.col75 {
	width: 75%;
}

.col80 {
	width: 80%;
}



.col-left {
	float: left;
}

.col-right {
	float: right;
}
.transblue50 {
	background-color: rgba(0,110,160,0.50);
}
.transwhite50 {
	background-color: rgba(255,255,255,0.50);
}
.transwhite75 {
	background-color: rgba(255,255,255,0.75);
}
.wrapper.feature {
	background-color: #FFFFFF;
}
.kid .content {
	background-image: url(../img/kids-need-clean-water.jpg);
	background-repeat: no-repeat;
	background-position: 20% top;
	background-size: 35% auto;
}
.kid2 .content {
	background-image: url(../img/kids-need-clean-water2.jpg);
	background-repeat: no-repeat;
	background-position: 170% top;
	background-size: 90% auto;
}

.kid3 .content {
	background-image: url(../img/bg-kid-2.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
}

.alert .content {
	background-image: none;
	padding-top: 0px;
	padding-bottom: 0px;
}

.hands .content {
	background-image: url(../img/clean-water-hands.jpg);
	background-repeat: no-repeat;
	background-size: contain;
}
.twoUp.feature-right {
	padding-top: 80px;
	padding-bottom: 50px;
}
.twoUp.feature-right h1 {
	font-family: 'Open Sans', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	color: #4EC1EA;
	text-align: center;
	letter-spacing: 4px;
	font-size: 57px;
	margin: 0;
	padding: 0;
	line-height: 57px;
}
.twoUp.feature-right p  {
	text-align: center;
	margin: 0;
	padding: 0;
	color: #092E6E;
	line-height: normal;
}
.twoUp.feature-right p.ForYourHealth {
	color: #006EA0;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 49px;
	line-height: 72px;
}
.twoUp.feature-right p.ForYourHealth span {
	color: #092E6E;
	font-size: 75px;
	font-weight: bold;
}
.kid2 .twoUp.feature-right p.getyoursys a, .kid3 .twoUp.feature-right p.getyoursys a {
	color: #006EA0;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 30px;
	line-height: 46px;
}
.kid2 .twoUp.feature-right .zeropct, .kid3 .twoUp.feature-right .zeropct {
	font-weight: bold;
	color: #092E6E;
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	margin: 70px 0px 10px;
	padding: 0px;
	font-size: 34px;
	line-height: 44px;
}
.kid2 .twoUp.feature-right .zeropct span, .kid3 .twoUp.feature-right .zeropct span {
	font-size: 180px;
}
.kid2 .twoUp.feature-right h1, .kid3 .twoUp.feature-right h1 {
	font-style: italic;
	font-weight: bold;
	letter-spacing: normal;
	text-shadow: 0px 0px 11px #FFFFFF;
}
.twoUp.feature-right a  {
	display: block;
	text-align: center;
}
.wrapper.feature.shower {
	background-image: url(../img/clean-shower-water.jpg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 50% auto;
	background-color: #FFFFFF;
}
.testimonial {
	padding-top: 4px;
	background-color: rgba(255,255,255,0.75);
}

.cstudy .col60.col-left.testimonial {
	margin-left: 5%;
	margin-top: 20px;
}
.cstudy .content {
	overflow-y: hidden;
	overflow-x: hidden;
}
.cstudy .col30.col-left.darkbg.aboutbox {
	padding-bottom: 999px;
	margin-bottom: -999px;
}
.cstudy .testimonial .rating img {
	width: 40%;
}
.beginquote {
	background-image: url(../img/begin-quote.png);
	background-repeat: no-repeat;
	background-position: left top;
	margin: 10px;
	padding-left: 35px;
}
.threeup.testimonial .beginquote {
    min-height: 230px;
}
.testimonial p {
	color: #454545;
	text-align: justify;
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	padding-top: 5px;
	padding-left: 0px;
	padding-right: 35px;
	background-image: url(../img/close-quote.png);
	background-repeat: no-repeat;
	background-position: right top;
	font-weight: 300;
}
.testimonial a.rating  {
	width: 100%;
	text-align: center;
	background-color: #FFCE00;
	padding: 5px 0;
	display: block;
	color: #FFFFFF;
	font-size: 16px;
	font-style: italic;
}
.testimonial div.rating  {
	width: 100%;
	text-align: center;
	background-color: #FFCE00;
	padding: 5px 0;
	display: block;
	color: #FFFFFF;
	font-size: 16px;
	font-style: italic;
}
.testimonial .rating img {
	background-color: #FFCE00;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	max-width: 200px;
}
.testimonial .quotee {
	font-family: 'Oswald', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #092E6E;
	text-align: right;
	font-weight: bold;
	font-size: 20px;
	padding-right: 35px;
	line-height: 20px;
	margin-left: auto;
	display: block;
}
.testimonial .quotee span {
	font-style: italic;
	font-weight: 300;
	font-size: 17px;
}
.fullw .fadebox {
	background-color: rgba(255,255,255,0.60);
	text-align: center;
	width: 50%;
	display: block;
	margin: 9vh auto;
	padding: 15px 40px;
	position: relative;
}
.fadebox h5 {
	text-align: center;
	color: #092E6E;
	font-size: 40px;
	line-height: 50px;
	margin-bottom: 0px;
}
.fadebox p {
	color: #626564;
	font-size: 30px;
	line-height: 35px;
	margin-bottom: 0px;
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	font-weight: 300;
}
.fadebox .positioner {
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 100%;
}
.fadebox .positioner a.darkbutton {
	position: relative;
	left: 0px;
	top: 50px;
}
.content.svcbg {
	background-image: url(../img/waterBG.jpg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: 70% auto;
	background-size: cover;
}
.content.tankbg {
	background-image: url(../img/products/extrol/tank-installed.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70% auto;
	background-size: cover;
}
.content.treatbg {
	background-image: url(../img/clean-tap-water.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70% auto;
	background-size: cover;
}
.content.drinkbg {
	background-image: url(../img/cleaner-drinking-water.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70% auto;
	background-size: cover;
}
.content.filtrbg {
	background-image: url(../img/filtered-water.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70% auto;
	background-size: cover;
}
.content.vegbg {
	background-image: url(../img/washing-vegetables.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	background-size: 70% auto;
	background-size: auto auto;
}
.content.mapbg {
	/* [disabled]background-image: url(../img/map.jpg); */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 70% auto;
	background-size: cover;
	overflow-y: hidden;
}
.mapbg .col30.col-left.darkbg.aboutbox {
	margin-bottom: -999px;
	padding-bottom: 999px;
}
.mappy {
}
.mappy img {
}
.cover {
	background-size: cover;
}


/*------------------------------------*\
    Contact Form
\*------------------------------------*/

.formbox {
	border-top: 10px solid #FFCE00;
	padding: 50px 0px;
	border-bottom: 30px solid #FFCE00;
	width: 100%;
}
.formbox h3  {
	color: #092E6E;
}
#contactform {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 25px;
	text-align: center;
}
#contactform input {
	margin: 10px 0px;
	height: 40px;
	-webkit-box-shadow: 0 3px 20px #9CB4CD;
	box-shadow: 0 3px 20px #9CB4CD;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-top-width: 0px;
	border-top-style: none;
	display: inline-block;
	padding: 5px 8px;
	text-transform: uppercase;
	font-size: 15px;
}
#contactform textarea {
	margin: 10px 0px;
	height: 100px;
	-webkit-box-shadow: 0 3px 20px #9CB4CD;
	box-shadow: 0 3px 20px #9CB4CD;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-top-width: 0px;
	border-top-style: none;
	display: inline-block;
	padding: 5px 8px;
	text-transform: uppercase;
	font-size: 15px;
}
#contactform .left {
	width: 47%;
	margin-right: 6%;
	float: left;
}
#contactform .right {
	width: 47%;
	float: left;
	margin-right: 0px;
}
#contactform .full {
	width: 100%;
}
#contactform input.darkbutton {
	padding: 8px 20px;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
.prodhead {
	background-image: url(../img/bg-prodhead.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.prodhead img {
	margin-top: 10vh;
	height: auto;
}
.productlist .content {
	overflow-y: auto;
	border-bottom: 2px solid #4EC1EA;
}
.productlist img {
	max-width: 85%;
}
.productlist h5 {
	color: #006EA0;
	font-size: 30px;
	line-height: 36px;
}
.productlist p {
	color: rgba(77,77,77,1.00);
	text-align: left;
}
.productlist ul {
	color: rgba(77,77,77,1.00);
	text-align: left;
	list-style-image: url(../img/bullet.png);
	margin-left: 50px;
	margin-top: 1px;
}
.productlist ul li {
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 5px;
}
.head {
	background-image: url(../img/bg-prodhead.jpg);
	background-color: #FDFDFD;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	padding: 75px 0 25px;
}
.head h1 {
	font-size: 40px;
	text-align: right;
}
.mapbg p {
	color: #fff;
	font-size: 15px;
	font-family: 'Oswald', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
	font-weight: 300;
}
.mapbg p a {
	color: #4ec1ea;
	font-size: 20px;
	font-weight: normal;
}
.faq p {
	font-size: 16px;
	line-height: 20px;
}
.faq .whitebg p {
	color: #494949;
}
.max700 {
	max-width: 700px;
}
.max800 {
	max-width: 800px;
}
.aligncenter {
	text-align: center;
}
.reviews .form {
	background-image: url(../img/bg-prodhead.jpg);
	background-size: cover;
	background-position: center center;
	width: 90%;
}
.reviews .form h4 {
	color: #FFFFFF;
}
.servicesummary .wrapper {
	border-bottom: 1px solid #4EC0EA;
}




/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media only screen and (max-width: 1100px) {

.icon-bar{
  width: 100%;
  height: auto;
}

.icons{
	width:auto;
	height: 58px;
text-align:center;
margin: 1%;}	
	
	
.main-head{
		font-size: 450%;}
	
.col60 .col50 {
	width: 100%;
	margin: 0 auto;
}
.serviceselect .col60 .col50 a {
	width: 70%;
}
	
	.col70{100%;}
	.col30{100%;}
}

@media only screen and (max-width: 950px) {

	.zero-fi{
	width: 80%!important;
	margin-left: 30px!important;
	}

#topbar {
	width: 100%;
	height: 64px;
}

.toplinks {
	width: 100%;
	height: auto;
	font-size: 20px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 0;
	margin-left: 0;
	padding: 12px 0px;
	float: none;
}
#topbar a  {
	color: #FFFFFF;
	display: inline-block;
	padding: 3px 3px 3px 40px;
	background-repeat: no-repeat;
	background-size: 35px auto;
	margin-left: 10px;
	margin-right: 10px;
}
.mainNav {
	margin-top: 20px;
}
.twoUp.feature-right {
	padding-top: 30px;
	padding-bottom: 50px;
}
.twoUp.feature-right h1 {
	font-size: 50px;
	line-height: 50px;
	letter-spacing: 3px;
}
.twoUp.feature-right p  {

}
.twoUp.feature-right p.ForYourHealth {
	font-size: 42px;
	line-height: 65px;
}
.twoUp.feature-right p.ForYourHealth span {
	font-size: 70px;
}
.twoUp.feature-right a  {
	display: block;
	text-align: center;
}
	
.col35.solutions {
	width: 60%;
}
.solutions a {
	width: 60%;
}
	
.testimonial p {
	font-size: 16px;
}
}
	
@media only screen and (min-width: 769px) and (max-width: 950px) {

	.main-head{
		font-size: 350%;}
	.main {
	width: 80%;
	margin: 0;
	padding: 30px 30px;
	display: block;
}
	
	
	.kid2 .content, .kid3 .content {
	background-size: 95% auto;
}
	
	.kid2 .twoUp.feature-right, .kid3 .twoUp.feature-right {
	margin-left: -40px;
	padding-top: 50px;
}
	.kid2 .twoUp.feature-right p.getyoursys a, .kid3 .twoUp.feature-right p.getyoursys a {

		color: white;
}


	
}


@media only screen and (min-width: 320px) and (max-width: 768px) {

	.main-head{
font-size: 350%;
	line-height: 50px;}
	
	.second-head{font-size: 300%;
	line-height: 40px}

	
	
	
	
	#topbar {
	height: auto;
	margin-bottom: 10px;
}

	.logo {
	/* [disabled]width: 320px; */
	margin-left: auto;
	margin-right: auto;
	display: block;
	text-align: center;
	padding-left: none;
	padding-right: none;
	/* [disabled]max-width: 320px; */
	}
	
	.header .logo-img {
	width: 91%;
	height: auto;
	display: block;
	margin: 0 auto;
}
	.Hnav {
		height: 0px;
	}
	
	.mainNav {
	width: 95%;
	margin-top: 0px;
	text-align: right;
	clear: both;
}
	.nav-item a.homebutton {
	display: none;
}
	.nav-mobile {
		display:block;
	}
	.nav {
	width: 100%;
	/* [disabled]padding-top: 40px; */
	padding-right: 0;
	padding-left: 0;
	padding-bottom: 0;
	}
	.nav-list {
	display: none;
	padding-top: 10px;
	padding-left: 0px;
	}
	.nav-item {
		width:100%;
		float:none;
	}
	.nav-item a {
	font-size: 28px;
	height: auto;
	}
	.nav-item:first-child a {
		border-radius:5px 0 0;
	}
	.nav-item:last-child a {
		border-radius:0 0 5px 5px;
	}
	.nav-active {
		display:block;
	}
	.nav-mobile-open {
		border-radius:5px 5px 0 0;
		-webkit-border-radius:5px 5px 0 0;
		-moz-border-radius:5px 5px 0 0;
	}
	
	.kid .content, .kid2 .content, .kid3 .content {
	background-image: none;
}
.twoUp.feature-right {
	padding-top: 30px;
	padding-bottom: 30px;
}
	.twoUp.feature-right p.ForYourHealth span span {
	display: none;
}
.col35.solutions {
	width: 100%;
}
.solutions a {
	width: 70%;
}
.cstudy .col60.col-left.testimonial {
	width: 90%;
	margin-top: 20px;
}
	.blueslice {
		text-align: center;
	}
	
.blueslice .footerlogo a {
	width: 90%;
	max-width: 90%;
	position: relative;
	top: 0px;
	left: 0px;
	margin: 20px auto;
}
.blueslice .logo-img {
	width: 100%;
}
.blueslice p {
	display: block;
	margin: 0px;
	font-size: 23px;
	font-weight: bold;
	line-height: 23px;
	padding: 0px;
	text-align: center;
	white-space: nowrap;
}
	.testimonial p {
	font-size: 20px;
}
.right .bigdrop  {
	display: none;
}
	.cstudy .col30.col-left.darkbg.aboutbox {
	padding-bottom: 10px;
	margin-bottom: 0px
		;
}


/*------------------------------------*\
    TWOUPS
\*------------------------------------*/

	.TwoUpRow {
	display: block;
	max-width: none;
	margin-left: auto;
	margin-right: auto;
	width: 94%;
}	
	.twoUp {
	display: block;
	width: 94%;
	margin-right: auto;
	margin-left: auto;
	float: none;
}
	.twoUp div{
	display: block;
	margin-right: auto;
	margin-left: auto;
	}

	
/*------------------------------------*\
    FOURUPS
\*------------------------------------*/

.fourup {
	width: 94%;
	float: none;
}
.fourup.left {
	margin-left: auto;
	margin-right: auto;
}
.fourup.right {
	margin-left: auto;
	margin-right: auto;
}
.fourup.int {
	margin-left: auto;
	margin-right: auto;
}

/*------------------------------------*/
	
/*------------------------------------*\
    THREEUPS
\*------------------------------------*/
	
	.threeup {
	width: 94%;
	float: none;
}
	.threeup.flank, .threeup.middle {

	margin-left: 3%;
	margin-right: 3%;
}
	footer .threeup {
	width: 94%;
	float: none;
}
	

.bg1 {
	background-image: url(../img/waterBG.jpg);
}
.bg2 {
	background-image: url(../img/pure-water-BG.jpg);
}


.col20, .col25, .col30, .col35, .col40, .col45, .col50, .col55, .col60, .col65, .col70, .col75, .col80 {
	width: 100%;
	margin: 0 auto;
}


.col-left {
	float: none;
}

.col-right {
	float: none;
}


	
	}