@import url('https://fonts.googleapis.com/css?family=Montserrat:500,600,700');
@import url('https://fonts.googleapis.com/css?family=Gloria+Hallelujah:500,600,700');
@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,500,600,700');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,500,600,700');

hr {
    margin: 15px 0px;
    border: 0;
}
hr.white {
    border-top: 1px solid #ffffff;
}
hr.calc {
    border-top: 2px solid #000;
    margin: 20px 0px;
}
hr.gray {
    border-top: 1px solid #dddddd;
}
hr.green {
    border-top: 1px solid #009143;    
}
hr.greenbar {
    border-top: 10px solid #009143;
}
hr.dashed {
    border-style: dashed;
}
hr.blog-black {
    margin: 0;
    border-top: 1px solid #000;
}
hr.scholar {
    border-top: 1px solid #000;
    margin: 20px 0px;
}
p.greenbar {
    padding-left: 15px;
    border-left: 10px solid #009143;
    color: #009143;
    font-size: 18px;
    font-weight: normal;
    font-style: italic;
}
.h1blog {
	font-size: 28px;
	font-weight: normal;
	color: #000000;
	padding: 0;
	margin: 0;
}
.h2blog {
	font-size: 22px;
	font-weight: normal;
	padding: 0;
	margin: 0;
}

h1.commercial {
    color: #009143;
    text-transform: uppercase;
}
h2.commercial {
    color: #009143;
    font-weight: normal;
    font-size: 20px;
}
h1.product-details {
	font-size: 26px;
    margin-top: 5px;
}
h2.product-details {
    margin-bottom: 5px;
    font-weight: normal;
    font-size: 20px;
}
h2.index {
    font-size: 15px;
    font-weight: 600;
    color: #000000;
    text-align: center;
    margin: 18px 0px;
    letter-spacing: 2px;
}
h2.products {
    font-size: 16px;
    font-weight: bold;
    color: #005327;
    margin: 15px 0px 5px 0px;
}
h2.box {
    font-size: 18px;
    color: #000;
}
h2.nomargin {
    margin: 0;
}
a {
    text-decoration: none;
    color: #000000;
}
a:hover {
    text-decoration: underline;
    color: #000;
}
.mid-title, .mid-title h2 {
    display: block;
    font-size: 18px;
    font-weight: bold;
    color: #000;
    margin: 0px 0px 10px 0px;
}
a.mid-title:hover, .mid-title h2:hover {
    text-decoration: none;
    color: #009143;
}

.simplebox {   
    background-color: #ffffff;
    border: 1px solid #dddddd;
    margin: 0 auto;
    padding: 10px;
    margin-bottom: 10px;
    box-sizing: border-box;
}
.simplepadding {
    padding: 0px 50px;
}

/* General Magic Inline */
.padleft {
    padding-left: 40px;
}
.padright {
    padding-right: 40px;
}
.padleft10 {
    padding-left: 10px;
}
.padright10 {
    padding-right: 10px;
}
.padleft20 {
    padding-left: 20px;
}
.padright20 {
    padding-right: 20px;
}
.simpleinline {
    display: inline-block;
    box-sizing: border-box;
    text-align: left;
    font-size: 15px;
}
.inline-container {
    font-size: 0;
}
.inline-container .simpleinline:last-child {
    margin-right: 0px;
}
.inline-2-10 {
    width: calc(2*(100% - 90px)/10 + 10px - 0.01%);
    margin-right: 10px;
    vertical-align: top;
}
.vcenter .simpleinline {
    vertical-align: middle;
}
.lright .simpleinline:last-child {
    text-align: right;
}

/* GENERAL */
#bdy-container {
    width: 100%;
}
#bdy {
    width: 1200px;
    margin: 0 auto;
    background: #fdfdfd;
    padding: 10px 0px;
    box-sizing: border-box;
    min-height: 850px;
}
#bdy-clear {
    width: 1200px;
    margin: 0 auto;
    padding: 10px 0px;
    box-sizing: border-box;
}
#bdy-container-w {
    background: #fff;
}
.feed-container {
    background: #fff;
    box-sizing: border-box;
}
.feed {
    width: 100%;
    margin: 0 auto;
    padding: 10px;
    min-width: 1360px;
    box-sizing: border-box;
}

/* General Details */
.videoWrapper, .iframeWrapper {
    position: relative;
    padding-bottom: 54%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.iframeWrapper-s {
    position: relative;
    padding-bottom: 50%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.videoWrapper iframe, .iframeWrapper iframe, .iframeWrapper-s iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.box-title {
    background-color: #fff;
    color: #000;
    padding: 12px 10px 5px 10px;
    font-size: 18px;
    font-weight: bold;
    border: 1px solid #dddddd;
    border-bottom: 0;
}
.box-title a {
    color: #000;
}
.box-title a:hover {
    color: #009143;
    text-decoration: none;
}
.box-bdy {
    background-color: #ffffff;
    margin-bottom: 10px;
    padding: 10px;
    font-size: 15px;
    border: 1px solid #dddddd;
    border-top: 0;
}
.box-bdy img {
    display: block;
    margin-bottom: 10px;
}
a[name='buy'] {
    display: inline-block;
    background: #d20b1d;
    font-size: 17px;
    margin: 10px;
    padding: 10px 0px;
    width: 180px;
    border-radius: 3px;
    color: #fff;
    text-decoration: none;
    text-align: center;
}
a[name='buy']:hover {
    -webkit-filter: brightness(0.90);
    filter: brightness(0.90); 
    text-decoration: none;  
    color: #fff;
}
.header.divider {
    position: relative;
    text-align: center;
}
.header {
    min-height: inherit;
    margin: 35px 0px 15px 0px;
}
.header.divider:after {
    position: absolute;
    top: 7px;
    display: block;
    content: ' ';
    width: 100%;
    border-top: 2px solid #ddd;
}
.header.divider h5 {
    position: relative;
    z-index: 10;
    display: inline-block;
    margin: 0;
    margin-top: -5px;
    padding: 0 10px;
    background: #fff;
}
h5, .h5 {
    color: #000;
    letter-spacing: 2px;
    text-transform: uppercase;
    text-rendering: optimizelegibility;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.4em;
}
.pdf-box {
    display: inline-block;
    border: 1px solid #e2e2e2;
    background: #fff;   
    padding: 8px;
    text-decoration: none;
}
.pdf-box:hover {
    -webkit-filter: brightness(0.95);
    filter: brightness(0.95);
    text-decoration: none;
}
.pdf-box img {
    width: 30px;
}

/* forms */
.formrow {margin: 5px 0px;}
.formlabel {
    display: inline-block;
    vertical-align: top;
    font-size: 15px;
    text-align: right;
    width: 34%;
    margin-right: 1%;
    font-weight: bold;
    line-height: 25px;
}
.formbox {
    display: inline-block;
    vertical-align: top;
    font-size: 14px;
    text-align: left;
    width: 65%;
    line-height: 25px;
}
.formbox input[type='text'], .formbox input[type='password'] {
    box-sizing: border-box;
    width: 100%;
    padding: 5px 1.7%;
    border-radius: 3px;
    border: 1px solid #ccc;
    -webkit-appearance: none;
}
.formbox input[type='submit'] {
    box-sizing: border-box;
    background-color: #009143;
    border: 0;
    -webkit-appearance: none;
    color: #fff;
    border-radius: 3px;
    padding: 6px 12px;
    cursor: pointer;
}
.formbox input[type='submit']:hover {opacity: 0.90;}
.formbox select {
    box-sizing: border-box;
    width: 100%;
    padding: 4px 0px;
    border-radius: 3px;
    border: 1px solid #ccc;
}
.formbox textarea, .full-textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 5px 1.7%;
    border-radius: 3px;
    border: 1px solid #ccc;
    -webkit-appearance: none;
}

.good-form .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 15px;
    font-weight: normal;
}
.good-form .formbox {
    width: 100%;
    margin: 0;
}


.form-mahdi-landing1 {
    border: 0;
    background: #effbff;
    width: 100%;
    text-align: center;
    border-radius: 5px;
    color: #000;
    padding: 15px;
    box-sizing: border-box;
}
.form-mahdi-landing1 .formrow {
    font-size: 0;
}
.form-mahdi-landing1 .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-weight: normal;
}
.form-mahdi-landing1 .formbox {
    width: 100%;
    margin: 0;
}
.form-mahdi-landing1 input[type=submit] {
    border: 0;
    background: #fb9238;
    color: #fff;
    font-family: 'Montserrat';
    padding: 10px 0px;
    width: 100%;
    text-align: center;
    cursor: pointer;
    border-radius: 5px;
    font-weight: 600;
    font-size: 17px;
    font-family: 'Montserrat';
}


/* commercial */
.combox {
    padding: 15px;
    border: 1px solid #ddd;
    background: #fdfdfd;
    margin-bottom: 10px;
}
.combox ul {
    padding-left: 20px;
    font-size: 14px;
}
.inline-casestudy {
    display: inline-block;
    vertical-align: top;
    width: 31.333%;
    margin: 10px 1%;
    font-size: 14px;
}
.inline-casestudy img {
    width: 100%;
}

/* index.php */
#index-img {
    position: relative;
    background-size: 100%;
    background-repeat: no-repeat;
    height: 650px;
    min-width: 1200px;
}
#index-img-mob {
    display: none;
    width: calc(100%);
}
#index-overlay {
    position: absolute;
    top: 100px;
    left: calc(((100% - 1200px)/2) + 5px);
    color: #009143;
    padding: 4px;
    font-size: 30px;
    text-align: center;
}
#index-overlay h1 {
    display: inline-block;
    width: 650px;
    margin: 0 auto;
    font-size: 62px;
    margin-bottom: 10px;
    font-weight: 700;
    text-align: center;
    color: #333333;
}
#index-overlay h2 {
    font-size: 36px;
    color: #333333;
    font-weight: bold;
    margin: 0;
}
#index-overlay h4 {
    display: inline-block;
    font-size: 80px;
    width: 635px;
    margin: 0 auto;
    text-align: center;
    line-height: 90px;
	text-shadow: 0px 2px 4px #fff;
}

#index-overlay a {
    display: inline-block;
    background: #533281;
    font-size: 20px;
    margin: 15px 40px 30px 40px;
    padding: 10px 0px;
    width: 350px;
    border-radius: 3px;
    font-weight: 700;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(53, 60, 60, 0.6);
    text-decoration: none;
}
#index-overlay a:hover {
    -webkit-filter: brightness(0.90);
    filter: brightness(0.90);
}

#index2-overlay {
    position: absolute;
    top: 100px;
    left: calc(((100% - 1200px)/2) + 5px);
    color: #009143;
    padding: 4px;
    font-size: 30px;
    text-align: center;
}
#index2-overlay h1 {
    display: inline-block;
    width: 650px;
    margin: 0 auto;
    font-size: 62px;
    margin-bottom: 10px;
    font-weight: 700;
    text-align: center;
    color: #d75130;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 2);
}
#index2-overlay h2 {
    font-size: 36px;
    color: #000;
    font-weight: bold;
    margin: 0;
}
#index2-overlay h4 {
    display: inline-block;
    font-size: 80px;
    width: 635px;
    margin: 0 auto;
    text-align: center;
    line-height: 90px;
        text-shadow: 0px 2px 4px #fff;
}

#index2-overlay a {
    display: inline-block;
    background: #d75130;
    font-size: 20px;
    margin: 15px 40px 30px 40px;
    padding: 10px 0px;
    width: 350px;
    border-radius: 3px;
    font-weight: 700;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(53, 60, 60, 0.6);
    text-decoration: none;
}
#index2-overlay a:hover {
    -webkit-filter: brightness(1.10);
    filter: brightness(1.10);    
}


/* free-installation */
h1.solvewaterproblems {
    font-size: 33px;
    font-weight: bold;
    margin: 0;
    line-height: 50px;
    color: #186410;
}
h1.free-installation {
    font-size: 40px;
    font-weight: normal;
    margin: 0;
    line-height: 50px;
    color: #186410;
}
h1.decsale {
    font-size: 40px;
    font-weight: bold;
    margin: 0;
    line-height: 50px;
    color: #ba1d38;
}



form.free-installation {
    padding: 18px 8px;
    background: #e8f8ff;
}
.free-installation .formlabel, .free-installation .formbox {
    width: 100%;
    font-weight: normal;
    text-align: left;
}
.free-installation .formbox input[type='submit'] {
    width: 100%;
    padding: 10px 0px;
    border-radius: 3px;
    background: #009143;
    color: #fff;
    cursor: pointer;
    margin-top: 10px;
}
.formtitle {
    font-size: 16px;
    text-align: center;
    margin-bottom: 10px;
}
.comparison-chart {
    width: 100%;
    margin: 0 auto;
    border-spacing: 5px;
    font-size: 17px;
}
.comparison-chart tr {
    height: 50px;
    font-weight: bold;
}
.comparison-chart tr:hover {
    opacity: 0.6;
}
.comparison-chart td {
    padding: 8px 10px;
    border: 0px solid #000;
    background: #eaeaea;
}
.compare-next .simpleinline {
    font-size: 20px;
    font-weight: bold;
    vertical-align: middle;
    text-decoration: underline;
}
.mahdi-links {
    display: block;
    border-bottom: 1px solid #ddd;
    padding: 10px;
}
.mahdi-links:hover {
    opacity: 0.88;
    background: #ddd;
    text-decoration: none;
}
.mahdi-links:last-child {
    border: 0;
}
.mob-pic {
    -moz-box-shadow: 0 4px 4px -4px gray;
    -webkit-box-shadow: 0 4px 4px -4px gray;
    box-shadow: 0 4px 4px -4px gray;
    text-align: center;
    margin-bottom: 15px;
}

/* products.php */
.inline-product {
    vertical-align: top;
    width: 31%;
    margin: 1%;
    text-align: center;
}
.product-border {
    text-align: center;
    border-left: 1px solid #ddd;
    padding-left: 20px;
}
/* well.php */

.redbttn {
    display: inline-block;
    padding: 10px 30px;
    background: #cc0000;
    color: #fff;
    border-radius: 3px;
    text-decoration: none;
    margin: 0 auto;
}
.redbttn:hover {
    text-decoration: none;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    color: #fff;
}


.green-btn {
    display: inline-block;
    padding: 10px 30px;
    background: #009143;
    color: #fff;
    border-radius: 3px;
    text-decoration: none;
    margin: 0 auto;
}
.green-btn:hover {
    text-decoration: none;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    color: #fff;
}


.green-btn-s {
    display: inline-block;
    padding: 5px 25px;
    background: #009143;
    color: #fff;
    border-radius: 3px;
    text-decoration: none;
    margin: 0 auto;
}
.green-btn-s:hover {
    text-decoration: none;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
    color: #fff;
}

/* product details */
.tab-contents {
    display: none;
}
.tab-contents h2 {
    margin-top: 10px;
}

.tab-container .tabs {
    border: 1px solid #ccc;
    border-bottom: 0px;
    padding: 10px;
    box-sizing: border-box;
    text-decoration: none;
    text-align: center;
    color: #000;
}
.tab-container .tabs:hover {
    background: #eee;
}
.tab-container .tabs:last-child {
    border-bottom: 1px solid #ccc;
}
.contents-container {
    border: 1px solid #ccc;
    padding: 10px;
}
#tab1 {
    background: #eee;
}
#tab5 {
    margin-right: 0;
}
#mahdi-tab1 {
    display: block;
}
.mob-tabs {
    display: none;
    font-size: 14px;
    padding: 15px;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
.product-float {
    float: right;
    padding-left: 15px;
}
.details-form {
    text-align: left;
    margin: 10px;
    background: #e8f8ff;
    padding: 10px;
}
.details-form .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: normal;
}
.details-form .formbox {
    width: 100%;
    margin: 0;
}
.details-form textarea {
    height: 80px;
}
.details-form .formbox input[type='submit'] {
    width: 100%;
    padding: 10px 0px;
    background: #009143;
    margin-top: 5px;
}
.details-links {
    display: block;
    border-bottom: 1px solid #ddd;
    padding: 13px 11px;
    font-size: 15px;
}
.details-links:hover {
    background: #e5f4ec;
    text-decoration: none;
}
.height-container .simplebox {
    min-height: 330px;
}
.certified-seal {
    float: right;
    margin: 20px 0px 20px 20px;
}
.certified-seal img {
    width: 150px;
}
#mahdi-tab3 .simpleinline {
    vertical-align: middle;
}
/* compares */
.compare-form {
    text-align: left;
    margin: 0;
}
.compare-form .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: normal;
}
.compare-form .formbox {
    width: 100%;
    margin: 0;
}
.compare-form textarea {
    height: 80px;
}
.compare-form .formbox input[type='submit'] {
    width: 100%;
    padding: 10px 0px;
    background: #009143;
    margin-top: 5px;
}

/* howtobuy.php */
.check-s {
    display: inline-block;
    border-radius: 50%;
    background: #009143;
    color: #fff;
    height: 25px;
    line-height: 25px;
    padding: 0px 8px 0px 6px;
    font-size: 14px;
    margin-left: 5px;
}
.exclaim-s {
    display: inline-block;
    border-radius: 50%;
    background: #ff0000;
    color: #fff;
    height: 17px;
    line-height: 25px;
    padding: 0px 9px 8px 9px;
    font-size: 14px;
    margin-left: 5px;
}
.form-hdr {
    background: #147b44;
    color: #fff;
    font-weight: bold;
    padding: 10px;
}
div.clayer_shown
{
    display: block;
    position: relative;
    left: 0;
    top: 0;
}

div.clayer_hidden
{
    display: none;
    position: relative;
    left: 0;
    top: 0;
}
.howtobuy-call {
    background: #efefef;
    border: 1px solid #ebebeb;
    margin-top: 15px;
    padding: 6px;
    border-radius: 3px;
    display: inline-block;
    font-size: 16px;
}
.form-howtobuy {
    background: #eee;
    padding: 10px;
    margin: 0;
}
.form-howtobuy .formtitle {
    margin-bottom: 20px;
    font-size: 20px;
}
.form-howtobuy .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 15px;
    font-weight: normal;
}
.form-howtobuy .formbox {
    width: 100%;
    margin: 0;
}
.form-howtobuy .formbox input[type='text'] {
    padding: 7px 6px;
}
.form-howtobuy .formbox select {
    padding: 7px 0px;
}
.form-howtobuy .formbox input[type='radio'] {
    margin: 3px 3px 5px 3px;
    vertical-align: middle;
}
.form-howtobuy textarea {
    height: 80px;
}
.form-howtobuy .formbox input[type='submit'] {
    width: 100%;
    padding: 10px 0px;
    background: #009143;
    margin-top: 5px;
}
.form-howtobuy2 {
    padding: 10px;
    margin: 0;
}
.form-howtobuy2 .formtitle {
    margin-bottom: 20px;
    font-size: 20px;
}
.form-howtobuy2 .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 15px;
    font-weight: normal;
}
.form-howtobuy2 .formbox {
    width: 100%;
    margin: 0;
}

.form-howtobuy2 .formbox input[type='text'] {
    padding: 9px 6px;
}
.form-howtobuy2 .formbox select {
    padding: 8px 0px;
}
.form-howtobuy2 .formbox input[type='radio'] {
    margin: 3px 3px 5px 3px;
    vertical-align: middle;
}
.form-howtobuy2 textarea {
    height: 258px;
}
.form-howtobuy2 .formbox input[type='submit'] {
    width: 100%;
    padding: 10px 0px;
    background: #009143;
    margin-top: 5px;
}


.form-howtobuy4 {
    background: #efefef;
    padding: 20px;
}
.form-howtobuy4 .formtitle {
    margin-bottom: 20px;
    font-size: 20px;
}
.form-howtobuy4 .formlabel {
    width: 30%;
    margin: 0;
    margin-right: 5px;
    font-size: 14px;
    font-weight: bold;
}
.form-howtobuy4 .formbox {
    width: calc(70% - 5px);
    margin: 0;
}
.form-howtobuy4 .formbox input[type='text'] {
    padding: 8px 5px;
    border: 1px solid #ccc;
    font-size: 14px;
    width: calc(80% - 100px);
    border-radius: 3px;
}
.form-howtobuy4 .formbox select {
    padding: 7px 0px;
    border: 1px solid #ccc;
    font-size: 14px;
    width: calc(80% - 100px);
    border-radius: 3px;
}
.form-howtobuy4 .formbox input[type='radio'] {
    margin: 3px 3px 5px 3px;
    vertical-align: middle;
}
.form-howtobuy4 textarea {
    height: 140px;
    padding: 8px 5px;
    border: 1px solid #ccc;
    font-size: 14px;
    width: calc(80% - 100px);
    border-radius: 3px;
}
.form-howtobuy4 .formbox input[type='submit'] {
    padding: 12px 20px;
    background: #009143;
    margin-top: 5px;
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: bold;
}
.form-howtobuy4 .formbox div {
    display: inline-block;
}
.form-howtobuy4 .formbox div#submit_layer {
    display: block;
}
.formheader {
    background: #147B44;
    padding: 10px;
    color: #fff;
    font-weight: bold;
    font-size: 15px;
}


.form-howtobuy3 {
    background: #fff;
    padding: 10px;
    margin: 0;
}
.form-howtobuy3 .formtitle {
    margin-bottom: 20px;
    font-size: 20px;
}
.form-howtobuy3 .formlabel {
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 15px;
    font-weight: normal;
}
.form-howtobuy3 .formbox {
    width: 100%;
    margin: 0;
}
.form-howtobuy3 .formbox input[type='text'] {
    padding: 8px 5px;
    background: #f0f1f3 none repeat scroll 0 0;
    border: 0;
    font-size: 14px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.09);
    width: 80%;
    border-radius: 3px;
}
.form-howtobuy3 .formbox select {
    padding: 7px 0px;
    background: #f0f1f3 none repeat scroll 0 0;
    border: 0;
    font-size: 14px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.09);
    width: 80%;
    border-radius: 3px;
}
.form-howtobuy3 .formbox input[type='radio'] {
    margin: 3px 3px 5px 3px;
    vertical-align: middle;
}
.form-howtobuy3 textarea {
    height: 80px;
    padding: 8px 5px;
    background: #f0f1f3 none repeat scroll 0 0;
    border: 0;
    font-size: 14px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.09);
    width: 100%;
    border-radius: 3px;
}
.form-howtobuy3 .formbox input[type='submit'] {
    width: 100%;
    padding: 12px 0px;
    background: #009143;
    margin-top: 5px;
    font-family: 'Open Sans';
    font-size: 15px;
    font-weight: bold;
}
.form-howtobuy3 .formbox div {
    display: inline-block;
}
.form-howtobuy3 .formbox div#submit_layer {
    display: block;
}

/* howtobuy.php */
.form-contact {
    background: #eee;
    padding: 10px;
    margin: 0;
}
.form-contact .formtitle {
    margin-bottom: 20px;
    font-size: 20px;
}
.form-contact .formbox input[type='text'] {
    padding: 7px 6px;
}
.form-contact .formbox select {
    padding: 7px 0px;
}
.form-contact .formbox input[type='radio'] {
    margin: 3px 3px 5px 3px;
    vertical-align: middle;
}
.form-contact textarea {
    height: 80px;
}
.form-contact .formbox input[type='submit'] {
    width: 100%;
    padding: 12px 0px;
    background: #009143;
    margin-top: 5px;
    font-family: 'Open Sans';
    font-size: 14px;
	font-weight: bold;
}
.locations {
    display: inline-block;
    margin: 10px 0px;
    /*padding: 0 10px 5px 0;
    border-bottom: 2px solid transparent;*/
}
.locations:hover{
    /*padding: 0 10px 5px 0;*/
    /*border-bottom: 2px solid #147b44;*/
}
.locations a:hover{
    text-decoration: none;
}
.locations img {
    vertical-align: middle;
    width: 6px;
    margin-right: 5px;
}
.legal-container {
        font-size: 12px;
        text-align: left;
}
.privacy-container {
    margin: 10px 0px;
    font-size: 0;
}
.privacy-container .simpleinline:first-child {
    vertical-align: middle;
    width: 25px;
    margin: 0px 10px;
}
.privacy-container .simpleinline:last-child {
    vertical-align: middle;
    width: calc(100% - 45px);
}
#expandprivacy {
    display: none;
    padding: 0px 15px;
}

/* customer-testimonials.php */
#reviews img {
    display: inline-block;
    vertical-align: middle;
    margin-right: 1px;
    width: 25px;
}
#reviews {
    display: inline-block;
    font-size: 12px;
    width: 145px;
    text-align: left;
    color: #e4e4e4;
}
#reviews span {
    font-size: 12px;
    color: #929394;
}
#reviews span[itemprop="ratingValue"] {
    color: #f15d50;
}
#reviews a {
    color: #6379bb;
    font-size: 11px;
}
.reviews-search {
    margin: 0;
}
.reviews-search input[type='text'] {
    border-radius: 3px;
    margin: 0px 1px;
    border: 1px solid #ccc;
    padding: 5px;
}
.reviews-search input[type='submit'] {
    margin-bottom: 5px;
    padding: 6px 10px;
    border-radius: 3px;
    border: 0px solid #ccc;
    background: #009143;
    color: #fff;
    cursor: pointer;
}
.review-container img {
    border-radius: 3px;
}
.page-num {
    display: inline-block;
    background: #eee;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    border-radius: 3px;
    margin-right: 5px;
    text-decoration: none;
}
.page-num:hover {
    background: #ccc;
    text-decoration: none;
}
.page-selected {
    display: inline-block;
    background: #016330;
    color: #fff;
    width: 26px;
    height: 26px;
    line-height: 26px;
    text-align: center;
    border-radius: 3px;
    margin-right: 5px;
}


.readmore {
    padding: 10px;
    margin-left: 10px;
    margin-right: 20px;
    background: #016330;
    border: 1px solid #eaeaea;
    color: #fff;
    cursor: pointer;
}
.readmore:hover {
	opacity: 0.50;
	cursor: pointer;
}

/* famous customers */
.famous-inline {
	vertical-align: top;
	display: inline-block;
	width: calc(16.6667% - 20px);
	margin: 10px;
	font-size: 16px;
	font-weight: bold;
}
.famous-inline img {
	width: 100%;
	margin-bottom: 5px;
}

/* water-softener */
.green-title {
    display: block;
    padding: 13px 11px;
    background: #009143;
    color: #fff;
    text-align: left;
    font-weight: bold;
    border: 1px solid #ddd;
    border-bottom: 0;
    font-size: 15px;
}
.green-title:hover {
    color: #fff;
    text-decoration: none;
}


/* news */
.posttitle a {
    color: #005327;
    font-size: 20px;
    font-weight: bold;
}
.posted {
    color: #999999;
    font-size: 13px;
}

/* manuals-literature.php */
.manuals-inline {
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 10px);
    margin: 5px;
    font-size: 14px;
    border: 1px solid #ddd;
    padding: 10px;
    box-sizing: border-box;
}

/* water-softener */
.wideImg-container {
    position: relative;
    font-size: 0;
    z-index: 100;
}
.wideImg {
    width: 100%;
    min-width: 1200px;
}
.wideImg-container span {
    display: block;
    width: 850px;
    margin: auto;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    text-align: center;
    font-size: 80px;
    color: #01592a;
}
.wideImg-container span.white {
    color: #fff;
}
.dropContainer {
    width: 350px;
    margin: 10px auto;
    position: relative;
}
.dropColor {
    background: #fdfdfd;
}
.dropTitle {
    font-size: 0;
    color: #211d1e;
    cursor: pointer;
    margin-bottom: 10px;
}
.dropTitle img {
    height: 10px;
}
.dropInline-1 {
    display: inline-block;
    vertical-align: middle;
    width: 90%;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
}
.dropInline-2 {
    display: inline-block;
    vertical-align: middle;
    width: 10%;
}
.newDropDown {
    display: none;
    z-index: 10001;
    position: absolute;
    width: 100%;
    background: #fdfdfd;
}
.newDropDown ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.newDropDown ul li {
    width: 100%;
    padding: 15px 10px;
    box-sizing: border-box;
    text-align: center;
    cursor: pointer;
}
.newDropDown ul li:hover {
    background: #fff;
}
#bdy-clear .imgFix {
    font-size: 0;
	vertical-align: bottom;
}
#bdy-clear .simpleinline {
    font-size: 15px;
}
#featuredVideo {
    position: relative;
    z-index: 1000;
}
#play-btn, #pause-btn {
    display: none;
    z-index: 1001;
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 80px;
}
#video1 {
    width: 100%;
    height: 360px;
}

/* water-softener-alternative-test.php */
.alter1-container {
    position: relative;
    height: 600px;
    margin-top: 40px;
}
.alter1-container span {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    padding: 12px 18px;
    background: #009143;
    color: #fff;
    cursor: pointer;
}
.alter1-container span:hover {
    opacity: 0.85;
}
.alter1-pic {
    position: absolute;
    left: 0;
    top: 0;
    width: 650px;
}
.alter1-txt {
    position: absolute;
    left: 480px;
    top: 200px;
    background: #fff;
    padding: 20px;
    width: 600px;
    font-size: 17px;
}
.alter1-txt h2 {
    margin-top: 0;
    font-size: 30px;
}
.alter2-container {
    position: relative;
    height: 660px;
}
.alter2-pic {
    position: absolute;
    left: 0;
    top: 0;
    width: 600px;
}
.alter3-pic {
    position: absolute;
    right: 0;
    top: 0;
    width: 590px;
    margin-top: 20px;
}
.alter2-txt {
    position: absolute;
    left: 150px;
    top: 270px;
    background: #fff;
    padding: 20px;
    width: 600px;
    margin: auto;
    font-size: 17px;
}
.alter2-txt h2 {
    margin-top: 0;
    font-size: 30px;
}
.alter4-container {
    position: relative;
    height: 800px;
}
.alter4-pic {
    position: absolute;
    right: 0;
    top: 0;
    width: 690px;
}
.alter4-txt {
    position: absolute;
    left: 80px;
    top: 220px;
    background: #fff;
    padding: 20px;
    width: 600px;
    margin: auto;
    font-size: 17px;
}
.alter4-txt h2 {
    margin-top: 0;
    font-size: 30px;
}
.green-b {
    display: inline-block;
    padding: 12px 18px;
    background: #009143;
    color: #fff;
    cursor: pointer;
}
.green-b:hover {
    opacity: 0.85;
}


/* what-is-a-water-softener */
.wide-container {
    position: relative;
}
.wide-title {
    position: absolute;
    width: 1200px;
    left: 0;
    right: 0;
    margin: auto;
    color: #fff;
    font-weight: normal;
    top: 150px;
    font-size: 50px;
    text-align: center;
}
.bdy-trans {
    width: 1200px;
    margin: 0 auto;
    background: transparent;
}


/* blog */
.blogtable .simplecell {
    vertical-align: top;
}
.blogtable .simplecell:first-child {
    width: 70px;
}
.blog-cont {
    margin: 0px 21px;
}
.blog-cont .simpleinline p:last-child {
    margin-bottom: 0;
}



/* blog_mahdi.php */
#tile-container {
    position: relative;
    width: 100%;
    height: 600px;
}
#tile-container a.inner {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    cursor: pointer;
    display: block;
    background-color: #CFCFCF;
}
#tile-container a.inner:hover span.background {
    -webkit-transition: -webkit-transform 600ms ease-out, box-shadow 150ms ease-out;
    -webkit-transition: box-shadow 150ms ease-out, -webkit-transform 600ms ease-out;
    transition: box-shadow 150ms ease-out, -webkit-transform 600ms ease-out;
    transition: transform 600ms ease-out, box-shadow 150ms ease-out;
    transition: transform 600ms ease-out, box-shadow 150ms ease-out, -webkit-transform 600ms ease-out;
    -webkit-transform: scale(1.04);
    transform: scale(1.04)
}
#tile-container span.background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-position: 75% 15%;
    background-repeat: no-repeat;
    background-size: cover;
    transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out;
    -webkit-transform: translateZ(0);
}
#tile-container span.caption {
    -webkit-animation: footerSlide 400ms 0 ease-out normal;
    animation: footerSlide 400ms 0 ease-out normal;
    -webkit-transform: translateZ(0);
    position: absolute;
    width: 100%;
    background: #111;
    background: rgba(0,145,67, 0.78);
    bottom: -2px;
    color: #fff;
    padding: 10px;
    box-sizing: border-box;
}
#tile-container span.caption h2 {
    margin: 0px;
	padding: 0px;
    font-size: 16px;
}
#tile-container span.caption p {
    margin: 5px 0px;
    font-size: 13px;
}
#tile-container div.tile-col {
    position: absolute;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
#tile-container div.tile-col {
    position: absolute;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}
#tile-container div.tile-col.one {
    width: 50%;
}
#tile-container div.tile-col.two {
    width: 25%;
    left: 50%;
}
#tile-container div.tile-col.three {
    width: 25%;
    left: 75%;
}
#tile-container div.tile-col.one figure.tile1 {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 0;
    right: 5px;
    margin: 0;
}
#tile-container div.tile-col.one figure.tile1 span.background {
    background-image: url('images/octhomepage.jpg');
}
#tile-container div.tile-col.one figure.tile1 span.caption {
    background: rgba(0,145,67, 0.78);
}
#tile-container div.tile-col.one figure.tile1 span.caption h1 {
    margin-top: 10px;
    color: #fff;
}
#tile-container div.tile-col.one figure.tile1 span.caption p {
    font-size: 15px;
    color: #fff;
	margin: 0;
	padding: 0;
}
#tile-container div.tile-col.two figure.tile2 {
    position: absolute;
    top: 10px;
    bottom: 45%;
    left: 5px;
    right: 5px;
    margin: 0;
}
#tile-container div.tile-col.two figure.tile2 a.inner {
    bottom: 5px;
}
#tile-container div.tile-col.two figure.tile2 span.background {
    background-image: url('images/installation.jpg');
}
#tile-container div.tile-col.two figure.tile3 {
    position: absolute;
    top: 55%;
    bottom: 10px;
    left: 5px;
    right: 5px;
    margin: 0;
}
#tile-container div.tile-col.two figure.tile3 a.inner {
    top: 5px;
}
#tile-container div.tile-col.two figure.tile3 span.background {
    background-image: url('images/our-technology.jpg');
    background-position: 60% 15%;
}
#tile-container div.tile-col.three figure.tile4 {
    position: absolute;
    top: 10px;
    bottom: 60%;
    left: 5px;
    right: 5px;
    margin: 0;
}
#tile-container div.tile-col.three figure.tile4 a.inner {
    bottom: 5px;
}
#tile-container div.tile-col.three figure.tile4 span.background {
    background-image: url('images/in-your-home.jpg');
    background-position: 50% 15%;
}
#tile-container div.tile-col.three figure.tile5 {
    position: absolute;
    top: 40%;
    bottom: 10px;
    left: 5px;
    right: 5px;
    margin: 0;
}
#tile-container div.tile-col.three figure.tile5 a.inner {
    top: 5px;
}
#tile-container div.tile-col.three figure.tile5 span.background {
    background-image: url('images/mahdi-LWS-Pasadena-Building-2009.jpg');
    background-position: 50% 15%;
}
h2.blog-details {
    font-size: 25px; padding: 0px; line-height: 20px; margin:0px;
}
ul.blogfeed {
    list-style: none;
    margin: 12px 20px 0px 20px;
    padding: 0;
    padding-bottom: 50px;
    font-size: 0;
}
ul.blogfeed li {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    width: calc(100%/3);
    height: 370px;
    margin: 0;
    padding: 0;
    transition: all 200ms ease-out;
    -webkit-transition: all 200ms ease-out;
    -webkit-transform: translateZ(0);
    cursor: pointer;
    overflow: hidden;
}
ul.blogfeed li:hover {
    background: #f1f1f1;
}
ul.blogfeed li:active {
    box-shadow:inset 0 0 20px #C5C5C5;
}
ul.blogfeed li.lr {
    border-right: 1px solid #d0d0d0;
}
ul.blogfeed li.lt {
    border-top: 1px solid #d0d0d0;
}
ul.blogfeed li a {
    display:block;
    color:#333;
    position:absolute;
    padding:40px 40px;
    height:100%;
    left:0;
    right:0;
    box-sizing: border-box;
    text-decoration: none;
    position: relative;
}
ul.blogfeed li a span.background {
    display: block;
    background-image: url('images/installation.jpg');
    height: 200px;
    position: relative;
    background-repeat: no-repeat;
    background-position: 50% 30%;
    background-size: cover;
    -ms-high-contrast-adjust: none;
}
ul.blogfeed li a span.background h4 {
    font-size: 14px;
    position: absolute;
    padding: 10px 20px;
    color: #fff;
    bottom: 0;
    left: -12px;
    background: #009143;
    font-weight: normal;
}
ul.blogfeed li a span.caption h2 {
    font-size: 17px;
}
ul.blogfeed li a span.caption {
    display: block;
    position: relative;
    text-align: left;
    font-size: 14px;
}

.blog-readmore {
    position: absolute;
    right: 20px;
    bottom: 20px;
    margin: 0;
    font-size: 13px;
}



/* feed_mahdi.php */
.comment-box {
    background: #fdfdfd;
}
form.blog-comment .formlabel {
    font-size: 12px;
    margin: 5px;
    text-align: left;
    line-height: normal;
}
form.blog-comment .formlabel, form.blog-comment .formbox {
    width: 100%;
    margin: 0;
}
.comment-container {
    font-size: 13px;
}
#topbar_blog {
    width: 100%;
    min-width: 1200px;
    background-color: rgba(0, 145, 67, 0.85);
    position: fixed;
    top: 0;
    z-index: 10001;
    color: #fff;
}
.slash {
    display: inline-block;
    vertical-align: middle;
    margin: 4px 15px 0px 15px;
    font-size: 17px;
}
.block1 {
    display: inline-block;
    vertical-align: middle;
    font-size: 17px;
}
.block1 img {
    height: 45px;
}
.block2 {
    display: inline-block;
    vertical-align: middle;
    margin-top: 4px;
    font-size: 17px;
}
.block2 a {
    color: #fff;
}
.block2 a:hover {
    text-decoration: none;
    color: #ccc;
}
.block3 {
    display: inline-block;
    vertical-align: middle;
    margin-top: 4px;
    font-size: 17px;
}
#topnav_blog {
    width: 100%;
    text-align: right;
}
#topnav_blog a {
    display: inline-block;
    vertical-align: middle;
    margin: 20px 20px 23px 20px;
    font-size: 16px;
    color: #fff;
}
#topnav_blog a:hover {
    color: #ccc;
    text-decoration: none;
}
.h2overlap {
	font-size: 34px;
    display: inline-block;
    background: #fff;
    color: #009143;
    padding: 6px 20px;
    position: absolute;
    top: -90px;
}
.h3overlap {
    display: inline-block;
    background: rgba(22, 152, 69, 0.5);
    color: #fff;
    padding: 10px 20px;
    position: absolute;
    left: -20px;
    top: -119px;
    height: 78px;
}
.h1silo {
    font-size: 32px;
    display: inline-block;
    background: #fdfdfd;
    color: #009143;
    padding: 15px 20px;
    position: absolute;
    top: -80px;
}
.h2silo {
    font-size: 32px;
    display: inline-block;
    background: #fdfdfd;
    color: #009143;
    padding: 15px 20px;
    position: absolute;
    top: -90px;
}
.h3silo {
    display: inline-block;
    background: rgba(22, 152, 69, 0.5);
    color: #fff;
    padding: 10px 20px;
    position: absolute;
    left: -20px;
    top: -116px;
    height: 80px;
}
.author {
    display: inline-block;
    position: absolute;
    top: 25px;
    left: -120px;
    text-align: center;
    font-weight: normal;
	color: #444;
}
.author img {
	display: block;
	width: 100px;
	margin-bottom: 5px;
	border-radius: 100%;
}
.blog-cat {
    display: inline-block;
    background: #1d1d1d;
    color: #868375;
    padding: 10px 20px;
    font-weight: bold;
    font-size: 16px;
}
.blog-title {
    display: inline-block;
    vertical-align: middle;
    width: 40%;
    font-size: 32px;
    font-weight: normal;
    color: #009143;
    padding: 10px 0px;
}
.blog-author {
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
}
.blog-author img {
    display: block;
    width: 70px;
    margin-bottom: 5px;
	border-radius: 100%;
}
#quote-container {
    border-top: 0px solid #ddd;
    border-bottom: 0px solid #ddd;
    margin: 0px 0px;
    text-align: center;
}
#quote-in {
    border-top: 0px solid #ddd;
    border-bottom: 0px solid #ddd;
    margin: 5px 0;
    padding: 10px 0;
}
#quote {
    width: 1158px;
    margin: 0 auto;
    color: #009143;
    font-size: 0;
}
#afterquote-container {
    width: 100%;
    background: #fff;
}
#afterquote {
    width: 1158px;
    margin: 0 auto;
    box-sizing: border-box;
}
#quote div {
    display: inline-block;
    max-width: calc(100% - 120px);
    font-size: 41px;
    text-align: left;
}
.quotes-up {
    display: inline-block;
    vertical-align: top;
    width: 40px;
    margin-top: -20px;
    margin-right: 20px;
}
.quotes-down {
    display: inline-block;
    vertical-align: bottom;
    width: 40px;
    margin-bottom: -20px;
    margin-left: 20px;
}

/* Blog Pop Up */
#popUpDim {
    background: rgba(0,0,0,0.75);
    width: 100%;
    height: 100%;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
}
.popUpBox {
    display: none;
    background: #fff;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 1200px;
    height: 40%;
    padding: 0px 15px;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
    box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
}
.termsBox {
    display: none;
    background: #fff;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 1180px;
    height: 450px;
    padding: 0px 15px;
    box-sizing: border-box;
    -webkit-box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
    box-shadow: 0px 7px 29px -5px rgba(0,0,0,0.75);
}
.termsBox .popIn {
    height: 100%;
    overflow-y: scroll;
}
.popUpClose {
    position: absolute;
    top: 0px;
    right: 0px;
    text-align: right;
    border: 0px solid #ccc;
    padding: 0px;
    margin: 0px 0px;
    width: 30px;
    cursor: pointer;
    z-index: 10005;
}
.termsBoxClose {
    position: absolute;
    top: -15px;
    right: -15px;
    text-align: right;
    border: 0px solid #ccc;
    padding: 0px;
    margin: 0px 0px;
    width: 30px;
    cursor: pointer;
    z-index: 10005;
}
#blogPop {
    width: 100%;
    height: calc(100% - 70px);
    margin-top: 70px;
    box-sizing: border-box;
    transition: visibility 0s, opacity 0.5s linear;
    min-width: 1200px;
}
#blogPop ul.blogfeed li {
    height: 350px;
}
#topnav_blog a#more-link {
    font-size: 0;
}
#more-link img {
    width: 22px;
}


/* hard-vs-soft-water.php */
.hard-table {
    width: 100%;
}
.hard-table td {
    padding: 10px;
    background: #ddd;
}
.soft-table {
    width: 100%;
}
.soft-table td {
    padding: 10px;
    background: #ddd;
}


/* calculator1.php */
h1.calc {
    color: #009143;
    text-align: center;
    font-size: 22px;
    font-weight: bold;
}
p.calc {
    text-align: center;
}
p.calc input[type="button"] {
    background-color: #147b44;
    color: #fff;
    padding: 5px 15px;
    border-radius: 2px;
    border: 0;
    cursor: pointer;
    -webkit-appearance: none;
}
p.calc input[type="button"]:last-child {
    background-color: #ccc;
}
p.calc input[type="button"]:hover {
    opacity: 0.8;
}
.calc-title {
    background-color: #147b44;
    color: #fff;
    padding: 10px 0px;
    font-weight: bold;
    font-size: 15px;
    text-align: center;
}
.calc-form.gray {
    background-color: #eee;
}

.calc-form.white {
    background-color: #fff;
}
.calc-form {
    padding: 10px;
    font-size: 0;
}
.calc-label {
    display: inline-block;
    vertical-align: middle;
    width: 250px;
    margin-right: 10px;
    font-size: 12px;
    text-align: right;
}
.calc-box {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 260px);
}
.calc-box input[type='text'] {
    padding: 5px;
    border-radius: 2px;
    border: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
    -webkit-appearance: none;
    font-size: 16px;
}
.calc-tables {
    width: 100%; 
    font-size: 12px;
    background-color: #fff;
    padding: 10px;
    box-sizing: border-box;
}
.calc-tables input[type='text']{
    font-size: 14px;
    -webkit-appearance: none;
    border-radius: 2px;
    border: 1px solid #ddd;
    width: 60px;
}
.calc-tables textarea{
    font-size: 14px;
    -webkit-appearance: none;
    border-radius: 2px;
    border: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
}


/* referrals.php */
#ref-container {
    width: 100%;
    position: relative;
    font-size: 0;
}
#ref-container img {
    width: 100%;
}
#ref-container span {
    display: block;
    position: absolute;
    width: 100%;
    height: 220px;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: #fff;
    text-align: center;
}
#ref-container p {
    font-size: 24px;
    text-transform: uppercase;
}
#ref-bannertext {
    color: #009143;
    text-align: center;
    font-size: 34px;
    line-height: normal;
}
#ref-bannertext img {
    width: 100%;
}
#ref-bannertext span {
    display: block;
    position: absolute;
    width: 100%;
    height: 220px;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}
#ref-bannertext h1 {
    font-size: 35px;
    margin: 20px 0px;
    color: #000;
    font-weight: bold;
    text-transform: uppercase;
    line-height: normal;
}
#ref-bannertext p {
    font-size: 32px;
    margin: 20px 0px;
    font-weight: bold;
    line-height: normal;
}
h2.ref {
    text-align: center;
    letter-spacing: 4px;
    font-size: 30px;
    color: #000;
    margin-top: 0px;
    font-weight: bold;
}
.ref-cells {
    text-transform: uppercase;
}
.ref-cells .inline-4-12 {
    width: calc(4*(100% - 550px)/12 + 150px);
    margin-right: 50px;
}
.ref-cells .inline-2-12 {
    font-size: 40px;
    color: #009143;
    width: 30px;
    margin-right: 10px;
}
.ref-cells .inline-10-12 {
    width: calc(100% - 40px);
    margin: 0;
    font-size: 20px;
}
hr.ref {
    border: 0;
    border-top: 1px solid #000000;
    margin: 30px 0px;
}
h3.ref {
    text-align: center;
    font-size: 30px;
    color: #000;
}
.check-ref {
    height: 10px;
    width: 12px;
    line-height: 10px;
    padding: 2px 0px 2px 0px;
    text-align: center;
    font-size: 10px;
    margin-bottom: 1px;
}
form.ref {
    text-align: center;
}
.refer-container {
    margin: 0 auto;
    width: 800px;
    font-size: 0;
}
.refer-box {
    display: inline-block;
    vertical-align: top;
    position: relative;
    width: calc(50% - 30px);
    margin: 15px;
    border: 1px solid #ccc;
    padding: 30px;
    box-sizing: border-box;
}
.refer-box-l {
    width: calc(100% - 30px);
    font-size: 16px;
}
.refer-box span {
    position: absolute;
    top: -26px;
    left: 20px;
    display: inline-block;
    background: #fdfdfd;
    padding: 10px;
    font-size: 24px;
}
form.ref .refer-box label {
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    font-size: 16px;
    text-align: right;
    margin-right: 10px;
}
form.ref .refer-box input[type="text"] {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 90px);
    padding: 8px;
    box-sizing: border-box;
    margin: 5px 0px;
    font-size: 16px;
}
form.ref input[type='submit'] {
    background: #05301b;
    padding: 10px 0;
    border: 0;
    width: 180px;
    text-align: center;
    margin: 0 15px;
    color: #fff;
    font-family: 'Open Sans';
    font-size: 13px;
    cursor: pointer;
}
form.ref input[type='submit']:hover {
    background: #000;
}
.ref-share a {
    font-size: 0;
    margin: 10px 0px;
}
.ref-share img {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
}
.ref-share span {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 40px);
    padding: 5px;
    box-sizing: border-box;
    font-size: 14px;
}
.ref-share input[type='text'] {
    display: inline-block;
    width: calc(100% - 65px);
    margin-right: 5px;
    padding: 5px;
    box-sizing: border-box;
    border: 1px solid #cdcdcd;
    background: #f7f7f7;
}
.ref-share input[type='button'] {
    width: 60px;
    display: inline-block;
    background: #05301b;
    padding: 5px 0;
    border: 0;
    text-align: center;
    margin: 0 auto;
    color: #fff;
    font-family: 'Open Sans';
    font-size: 12px;
    cursor: pointer;
}
.ref-share input[type='button']:hover {
    background: #000;
}
.ref-l {
    border: 1px solid #009143;
    display: block;
}
.ref-f {
    border: 1px solid #3a589b;
    display: block;
    cursor: pointer;
}
.ref-f:hover {
    opacity: 0.7;
}
.ref-t {
    border: 1px solid #598dca;
    display: block;
    cursor: pointer;
}
.ref-t:hover {
    opacity: 0.7;
}
.bg-lifesource {
    background: #fdfdfd;
    padding: 40px 0px;
}
.bg-black {
    background: #05301b;
    color: #fff;
    padding: 40px 0px;
    text-align: center;
}
.bdy-size {
    width: 1200px;
    margin: 0 auto;
}
.ref-progcontainer {
    margin: 60px 0px;
    text-align: center;
}
.ref-prog {
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    border: 2px solid #fff;
    width: 70px;
    height: 70px;
    line-height: 70px;
    font-size: 24px;
    color: #7f7f7f;
}
.ref-filled {
    background: #fff;
    color: #000;
    font-weight: bold;
}
.ref-bar {
    display: inline-block;
    vertical-align: middle;
    border-top: 2px solid #fff;
    width: 50px;
}
.bg-black h2 {
    text-align: center;
    font-size: 36px;
    font-weight: normal;
    margin-top: 0;
    color: #fff;
}
.bg-black h3 {
    text-transform: uppercase;
}
.bg-black a {
    color: #fff;
}
.bg-black a:hover {
    color: #eee;
}
#ref-faqs {
    display: none;
    padding: 5px 0px;
}
.ref-closeup {
    display: block;
    border: 1px solid #05301b;
    background: transparent;
    padding: 10px 0;
    width: 100px;
    text-align: center;
    margin: 0 auto;
    color: #05301b;
    font-family: 'Open Sans';
    font-size: 13px;
    margin-top: 25px;
    cursor: pointer;
}



/*
*****************************************************************************
*************************** NEW WEBSITE *************************************
*****************************************************************************
*/
/* GENERAL */

.new-contain {
    font-family: 'Montserrat';
    text-align: center;
    padding: 10px 0px;
}
.new-contain.green {
    background: #f4f8f1;
}
.new-contain.redpad {
    text-align: left;
    padding-top: 4px;
}
.new-con {
    font-family: 'Montserrat';
    text-align: center;
    padding: 70px 0px;
}
.new-con3 {
    font-family: 'Montserrat';
    text-align: center;
    padding: 0px 0px;
}
.new-con.redpad {
    text-align: left;
    padding-top: 4px;
}
.new-con.green {
    background: #f4f8f1;
}
.new-con.green2 {
    background: #407a52;
}
.new-con.white {
    background: #ffffff;
}
.new-con.darkgreen {
    background: #c2daa6;
}
.new-con.darkestgreen {
    background: #009143;
    color: #fff;
}
.new-con.darkestgreen h3, .new-con.darkestgreen h1 {
    color: #fff;
}
.new-con p {
    line-height: 25px;
}
.new-bdy {
    width: 1300px;
    margin: 0 auto;
}
.new-con.green h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}
.new-con.white h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}
.new-con.darkgreen h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}




.new-con2 {
    font-family: 'Montserrat';
    text-align: center;
    padding: 20px 0px;
}
.new-con2.green {
    background: #f4f8f1;
}
.new-con2.green2 {
    background: #407a52;
}
.new-con2.white {
    background: #ffffff;
}
.new-con2.darkgreen {
    background: #c2daa6;
}
.new-con2.darkestgreen {
    background: #009143;
    color: #fff;
}
.new-con2 p {
    line-height: 25px;
}
.new-con2.green h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}
.new-con2.white h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}
.new-con2.darkgreen h2 {
    font-size: 30px;
    margin: 0 0 25px 0;
}





.gbtn {
    display: inline-block;
    padding: 7px 20px;
    border-radius: 3px;
    text-decoration: none;
    border: 2px solid #fff;
    color: #fff;
}
.gbtn:hover {
    background: rgba(0,0,0,0.3);
    text-decoration: none;
    color: #fff;
}
.gbtn span {
	display: inline-block;
	vertical-align: top;
	line-height: 27px;
	font-weight: bold;
	font-size: 22px;
}
.gbtn b {
	display: inline-block;
	vertical-align: top;
	line-height: 27px;
	font-weight: bold;
	font-size: 22px;
	margin-left: 13px;
}
.gpar {
	font-size: 27px;
}



.btn {
    display: inline-block;
    padding: 7px 20px;
    border-radius: 3px;
    text-decoration: none;
    border: 1px solid #000;
    color: #000;
}
.btn:hover {
    background: rgba(0,0,0,0.05);
    text-decoration: none;
}
.btn span {
    display: inline-block;
    vertical-align: top;
    line-height: 27px;
}
.btn b {
    display: inline-block;
    vertical-align: top;
    font-size: 20px;
    margin-left: 13px;
}
.btn.white {
    background: #fff;
}
.btn.white:hover {
    background: #f1f1f1;
}



.rightpad {
	margin-top: 22px;
	margin-right: 62px;
}

/* index.php */
.index-three .inline-4-12 {
    width: calc(4*(100% - 440px)/12 + 120px);
    margin-right: 40px; 
}
.index-three a h3 {
    font-size: 18px;
    font-weight: bold;
    margin: 10px 0px;
}
.index-three a img {
    width: 100%;
}
.index-three a:hover {
    color: #009143;
    text-decoration: none;
}
.index-three p {
    margin: 10px 0px;
}
.index-six {
    margin: 20px 0px 30px 0px;
}
.index-six .inline-2-12 {
    width: calc(2*(100% - 275px)/12 + 25px);
    margin-right: 25px;
}
.new-con-white .inline-4-12 {
    width: calc(4*(100% - 330px)/12 + 90px);
    margin-right: 30px;
}
.new-con-white .box-bdy {
    margin: 0;
}
.index-counters {
    min-width: 1200px;
    box-sizing: border-box;
    padding: 40px 0px 70px 0;
    background: #000;
    color: #fff;
    font-weight: bold;
}
.index-counters .simpleinline {
    text-align: center;
    font-size: 20px;
}
.index-counters img {
    width: 25px;
}
.index-counters span {
    display: block;
    color: #444;
    font-size: 12px;
}


/* water-softener */
.watersoftener-top {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 35%;
    padding: 0;
    font-size: 0;
    min-width: 1200px;
}
.watersoftener-top .new-bdy {
    text-align: right;
}
.watersoftener-top .new-bdy img {
    margin-top: 10px;
    margin-right: 100px;
}


/* water-filter.php */
.waterfilter-top {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 35%;
    padding: 0;
    font-size: 0;
    min-width: 1200px;
}
.waterfilter-top .new-bdy {
    text-align: right;
}
.waterfilter-top .new-bdy img {
    margin-top: 10px;
    margin-right: 100px;
}







.new-topright {
    text-align: right;
    margin-bottom: 40px;
}
.new-topright a {
    display: inline-block;
    text-transform: uppercase;
    border-bottom: 2px solid #009143;
    padding-bottom: 10px;
    margin-left: 30px;
    font-size: 22px;
    color: #000;
    text-decoration: none;
}
.new-topright a:hover {
    color: #444;
}
.watersoftener-title {
    font-size: 50px;
    text-transform: uppercase;
    color: #fff;
    font-weight: bold;
}
.darkestgreen .btn {
    color: #fff;
    border-color: #fff;
}
.questions {
    position: relative;
    cursor: pointer;
    padding: 10px 40px 10px 10px;
    font-weight: bold;
    background: #c2daa6;
    margin-top: 10px;
}
.questions img {
    position: absolute;
    width: 20px;
    right: 10px;
    top: 10px;
}
.answers {
    display: none;
    padding: 10px;
} 


/* dropdown.inc */
#dropDown3 .inline-3-12 {
    position: relative;
    width: calc(3*(100% - 220px)/12 + 40px - 0.01%);
    margin-right: 20px;
    box-sizing: border-box;
}
#dropDown3 .inline-3-12:last-child {
    margin-right: 0;
}
#dropDown3 div.overlay {
    display: block;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    margin-top: 5px;
    font-weight: bold;
    font-size: 14px;
    color: #444;
}
#dropDown3 img {
    display: block;
}

/* subnav.inc */
#subnav-container {
    width: 100%;
    background: #009143;
}
#subnav {
    width: 1200px;
    margin: 0 auto;
    background: #009143;
    text-align: center;
    font-size: 21px;
    font-weight: normal;
    color: #fff;
    position: relative;
}
#subnav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#subnav ul li {
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    text-decoration: none;
    margin: 0;
    padding: 10px 33px;
    position: relative;
}
#subnav ul li:last-child {
    padding: 10px 36px;
}
#subnav ul li a {
    color: #fff;
}
#subnav ul li a:hover {
    text-decoration: none;
}
#subnav .drops {
    display: none;
    background: #fff;
    color: #000;
    padding: 10px 0px;
    position: absolute;
    z-index: 10003;
    left: -1px;
    top: 48px;
    text-align: left;
    font-size: 15px;
    min-width: 100%;
    border: 1px solid #ddd;
    border-top: 0;
    font-size: 14px;
}
#subnav ul.drops b {
    font-size: 13px;
}
#subnav ul.drops li {
    display: block;
    margin: 7px 0px;
    padding: 5px 33px;
    font-weight: normal;
    border: 0;
}
#subnav .drops a {
    display: block;
    color: #009143;
}
#subnav .drops a:hover {
    color: #000000;
}

#subnav .drops#drop-1 {
    width: 320px;
    margin: 0 auto;
}
#subnav .drops#drop-2 {
    width: 826px;
    margin: 0 auto;
    padding: 15px 33px;
}
#subnav .drops#drop-2 .cll1 {
    display: inline-block;
    vertical-align: top;
    width: 200px;
    margin-right: 10px;
}
#subnav .drops#drop-2 .cll1 a {
    display: block;
    margin: 7px 0px;
    padding: 5px 0px;
}
#subnav .drops#drop-2 .cll2 {
    display: inline-block;
    vertical-align: top;
    width: 146px;
    text-align: center;
    margin-right: 10px;
}
#subnav .drops#drop-2 .cll2 img {
    width: 100px;
}
#subnav .drops#drop-2 .cll2:hover a {
    color: #000;
}
#subnav .drops#drop-2 .cll2:hover img {
    opacity: 0.8;
}
#subnav .drops#drop-2 .cll2:last-child {
    margin: 0;
}
#subnav .drops#drop-2 .cll2 a {
    display: block;
    font-size: 13px;
}
#subnav .drops#drop-3 {
    width: 647px;
    padding: 22px 33px;
}
#subnav .drops#drop-3 span {
    display: block;
    font-weight: bold;
    margin-bottom: 5px;
}


/* warranty-register.php */
.ownwar-con {
    border: 2px solid #147b44;
    border-radius: 3px;
    padding: 8px;
    background: #fff;
    font-size: 0;
    margin-bottom: 10px;
    position: relative;
}
.ownwar-con .ownwar-inline1 {
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    margin-right: 15px;
    text-align: center;
}
.ownwar-con .ownwar-inline1 img {
    width: 100%;
}
.ownwar-con .ownwar-inline2 {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 95px);
}
.ownwar-con .ownwar-inline2 p {
    margin: 10px 0px;
    font-size: 13px;
}
.ownwar-con .ownwar-inline2 p b {
    font-size: 15px;
}
.ownwar-btn {
    display: inline-block;
    padding: 7px 15px;
    border-radius: 3px;
    background: #009143;
    color: #fff;
    font-size: 15px;
    cursor: pointer;
    width: 100px;
    text-align: center;
}
.ownwar-btn:hover {
    opacity: 0.9;
    text-decoration: none;
    color: #fff;
}

.war-con {
    border: 2px solid #147b44;
    border-radius: 3px;
    padding: 8px;
    background: #fdfdfd;
    font-size: 0;
    margin-bottom: 10px;
    position: relative;
}
.war-con .war-inline1 {
    display: inline-block;
    vertical-align: middle;
    width: 80px;
    margin-right: 15px;
    text-align: center;
}
.war-con .war-inline1 img {
    width: 100%;
}
.war-con .war-inline2 {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 95px);
}
.war-con .war-inline2 p {
    margin: 10px 0px;
    font-size: 13px;
}
.war-con .war-inline2 p b {
    font-size: 15px;
}
.war-btn {
    display: inline-block;
    padding: 7px 15px;
    border-radius: 3px;
    background: #009143;
    color: #fff;
    font-size: 15px;
    cursor: pointer;
    width: 100px;
    text-align: center;
}
.war-btn:hover {
    opacity: 0.9;
    text-decoration: none;
    color: #fff;
}


/* ref */
.ref1,
.ref2 {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: calc(50% - 50px);
    margin: 25px;
    box-sizing: border-box;
    padding: 30px 80px 30px 30px;
    border: 1px solid #4b8f56;
    min-height: 180px;
}
.ref2 {
    border: 1px solid #adadad;
}
.ref1 .b,
.ref2 .b, .simpleinline .b {
    display: inline-block;
    background: #4b8f56;
    color: #fff;
    padding: 5px 15px;
    border-radius: 7px;
    text-decoration: none;
    font-size: 14px;
}
.ref2 .b {
    background: #adadad;
}
.ref1 img,
.ref2 img {
    position: absolute;
    top: -30px;
    right: -30px;
    width: 60px;
    padding: 15px;
    background: #fff;
}



#topline {
    position: relative;
}
#topline span {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}
#topline span a {
    font-size: 14px;
    color: #fff;
}
#topline span img {
    height: 35px;
    margin-right: 10px;
}

.mapping {
    position: relative;
    margin: 50px auto;
}
.mapping ul {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
.mapping li {
    position: absolute;
    list-style: none;
    top: 950px;
    left: 422px;
    text-align: center;
}
.mapping li i {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    cursor: pointer;
    background: #087945;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 25px;
    box-sizing: border-box;
    color: #fff;
}
.mapping span {
    display: block;
}
.mapping span b {
    display: block;
    margin-bottom: 4px;
}
.mapping li i+span {
    display: none;
    position: absolute;
    bottom: 60px;
    right: 0;
    left: -60px;
    margin: auto;
    background: #087945;
    color: #fff;
    padding: 15px;
    border-radius: 5px;
    text-align: center;
    font-size: 10px;
    width: 160px;
    box-sizing: border-box;
}
.mapping li i+span::after {
    position: absolute;
    z-index: 12;
    bottom: -20px;
    width: 0;
    height: 0;
    content: "";
    border-top: 20px solid #087945;
    border-right: 20px solid transparent!important;
    border-left: 20px solid transparent!important;
    left: 50%;
    transform: translateX(-50%);
}

.mapping li.c1 i {
    background: #6b984b;
}
.mapping li.c1 i+span {
    background: #6b984b;
}
.mapping li.c1 i+span::after {
    border-top: 20px solid #6b984b;
}


.mapping li.c2 i {
    background: #8bd8d0;
}
.mapping li.c2 i+span {
    background: #8bd8d0;
}
.mapping li.c2 i+span::after {
    border-top: 20px solid #8bd8d0;
}


.mapping li.c3 i {
    background: #c147f2;
}
.mapping li.c3 i+span {
    background: #c147f2;
}
.mapping li.c3 i+span::after {
    border-top: 20px solid #c147f2;
}


.mapping li.c4 i {
    background: #484bf0;
}
.mapping li.c4 i+span {
    background: #484bf0;
}
.mapping li.c4 i+span::after {
    border-top: 20px solid #484bf0;
}


.mapping li.c5 i {
    background: #d73f8b;
}
.mapping li.c5 i+span {
    background: #d73f8b;
}
.mapping li.c5 i+span::after {
    border-top: 20px solid #d73f8b;
}


.mapping li.c6 i {
    background: #e2aa40;
}
.mapping li.c6 i+span {
    background: #e2aa40;
}
.mapping li.c6 i+span::after {
    border-top: 20px solid #e2aa40;
}


.mapping li.c7 i {
    background: #f1d895;
}
.mapping li.c7 i+span {
    background: #f1d895;
}
.mapping li.c7 i+span::after {
    border-top: 20px solid #f1d895;
}


.mapping li.c8 i {
    background: #da71d6;
}
.mapping li.c8 i+span {
    background: #da71d6;
}
.mapping li.c8 i+span::after {
    border-top: 20px solid #da71d6;
}


.justmobinline {display: none;}
.justmobile {display: none;}
@media (max-width: 420px) {
	.new-contain {
	    padding: 20px;
	}
    .rightpad {
        margin-top: 22px;
        margin-right: 12px;
    }
    
    .padleft, .padright, .padleft10, .padright10, .padright20, .padleft20 {
        padding: 0;
    }
    .inline-1-12, .inline-2-12, .inline-3-12, .inline-4-12, .inline-5-12, .inline-6-12, .inline-7-12, .inline-8-12, .inline-9-12, .inline-10-12, .inline-11-12 {
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .mobinline-1-12 {
        width: calc(1*(100% - 110px)/12);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-2-12 {
        width: calc(2*(100% - 110px)/12 + 10px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-3-12 {
        width: calc(3*(100% - 110px)/12 + 20px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-4-12 {
        width: calc(4*(100% - 110px)/12 + 30px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-5-12 {
        width: calc(5*(100% - 110px)/12 + 40px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-6-12 {
        width: calc(6*(100% - 110px)/12 + 50px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-7-12 {
        width: calc(7*(100% - 110px)/12 + 60px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-8-12 {
        width: calc(8*(100% - 110px)/12 + 70px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-9-12 {
        width: calc(9*(100% - 110px)/12 + 80px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-10-12 {
        width: calc(10*(100% - 110px)/12 + 90px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-11-12 {
        width: calc(11*(100% - 110px)/12 + 100px);
        margin-right: 10px;
        vertical-align: top;
    }
    .mobinline-12-12 {
        width: calc(12*(100% - 110px)/12 + 110px);
        margin: 0;
    }
    .mobinline-2 {
        display: inline-block;
        width: 48%;
        margin: 1%;
        box-sizing: border-box;
    }

    #hdr, #topnav-container, #ftr, #breadcrumbs, #topbar_blog, #subnav-container {display: none;}
    #hdr-mob, #ftr-mob, #index-img-mob {display: block;}
    #bdy, #bdy-clear, .bdy-trans, #quote, .bdy-size {
        width: calc(100% - 20px);
        margin: 10px;
        min-height: 0;
        padding: 0;
    }
    .feed-container {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        min-width: 0;
    }
    .feed {
        width: 100%;
        min-width: 0;
        padding: 0;
    }
    h2.blog-details {
        line-height: normal;
    }
    ul.blogfeed {
        padding: 0;
        margin: 0;
        border-bottom: 1px solid #d0d0d0;
    }
    ul.blogfeed li a {
        padding: 10px;
        position: relative;
    }
    .simplepadding {
        padding: 0;
    }

    .simplebox li {
        margin: 8px 0px;
    }

    .videoWrapper, .iframeWrapper, .iframeWrapper-s {
        position: relative;
        padding-bottom: 50%; /* 16:9 */
        padding-top: 25px;
        height: 0;
    }

    /* forms */
    .form-howtobuy4 .formlabel,.formlabel, .form-howtobuy4 .formbox, .formbox {
        width: 100%;
        text-align: left;
        padding: 0;
        margin: 0;
    }

    .form-howtobuy3 .formbox input[type='text'] {
        width: calc(100% - 30px);
    }
    .form-howtobuy3 .formbox textarea {
        width: 100%;
    }
    .form-howtobuy4 .formbox input[type='text'] {
        width: calc(100% - 30px);
    }
    .form-howtobuy4 .formbox textarea {
        width: 100%;
    }


    /* index.php */
    #index-img {
        position: static;
        background: transparent;
        height: auto;
        min-width: 0;
    }
    #index-overlay {
        display: block;
        position: static;
        top: auto;
        left: auto;
        width: 100%;
        box-sizing: border-box;
        background: #fff;
        font-size: 0;
		padding: 12px;
		border: 1px solid #ddd;
		height: auto;
    }
    #index-overlay h1 {
	margin: 0;
	padding: 0;
	line-height: 20px;
        width: 100%;
        font-size: 27px;
        margin-bottom: 10px;
    }
    #index-overlay h2 {
        font-size: 15px;
        margin-bottom: 10px;
    }
    #index-overlay h4 {
        font-size: 40px;
        width: 100%;
        line-height: normal;
    }
    #index-overlay a {
        width: 100%;
        font-size: 14px;
        margin: 0;
    }
    #index-overlay a:hover {
        -webkit-filter: brightness(0.70);
        filter: brightness(0.70);    
    }

    #index2-img {
        position: static;
        background: transparent;
        height: auto;
        min-width: 0;
    }
    #index2-overlay {
        display: block;
        position: static;
        top: auto;
        left: auto;
        width: 100%;
        box-sizing: border-box;
        background: #fff;
        font-size: 0;
		padding: 12px;
		border: 1px solid #ddd;
		height: auto;
    }
    #index2-overlay h1 {
	margin: 0;
	padding: 0;
	line-height: 20px;
        width: 100%;
        font-size: 27px;
        margin-bottom: 10px;
    }
    #index2-overlay h2 {
        font-size: 15px;
        margin-bottom: 10px;
    }
    #index2-overlay h4 {
        font-size: 40px;
        width: 100%;
        line-height: normal;
    }
    #index2-overlay a {
        width: 100%;
        font-size: 14px;
        margin: 0;
    }
    #index2-overlay a:hover {
        -webkit-filter: brightness(0.70);
        filter: brightness(0.70);    
    }




    hr.white { display: none; }




    /* free-installation.php */
    h1.free-installation {
        font-size: 30px;
    }
    .comparison-chart {
        font-size: 11px;
        padding: 0px;
    }
    .comparison-chart tr {
        font-weight: normal;
    }
    .comparison-chart td {
        padding: 4px;
        font-size: 14px;
    }
    .comparison-chart.small-chart td {
        padding: 3px;
        font-size: 12px;
    }

    .compare-next .simpleinline {
        font-size: 15px;
        width: 50%;
        margin: 0;
        padding: 0;
    }
    table.comparison-chart tr:first-child td:first-child {
        font-size: 14px;
    }
    table.comparison-chart tr td:first-child {
        font-weight: bold;
        font-size: 11px;
    }

    /* products.php */
    .inline-product {
        width: 46%;
        margin: 2%;
        vertical-align: top;
        font-size: 12px;
    }
    .inline-product img {
        max-width: 100%;
    }
    .product-border {
        border: 0;
    }

    /* product details */
    #tab1 {
        background: transparent;
    }
    #mahdi-tab1 {
        display: none;
    }
    .tab-container .tabs {
        font-weight: bold;
        text-align: left;
    }

    .tab-container {
        border-bottom: 1px solid #ccc;
    }
    .arrow-down {
        float: right;
        margin: 7px 6px 0 0;
    }
    .tab-container a:hover {
        background: transparent;
    }
    .mob-tabs h2 {
        display: none;
        margin-top: 0;
        font-size: 17px;
        font-weight: bold;
    }
    .product-float {
        float: none;
        padding: 0;
        margin-bottom: 10px;
        width: 100%;
    }
    .product-float img {
        width: 100%;
    }
    .details-form {
        margin: 0;
        margin-top: 20px;
    }
    .contents-container {
        border: 0;
        padding: 0;
    }


    .dropContainer {
        width: 100%;
    }

    /* modern pages */
    .alter2-container, .alter1-container, .alter3-container, .alter4-container {
        height: auto;
        position: static;
    }
    .alter1-pic, .alter2-pic, .alter3-pic, .alter4-pic {
        position: static;
        width: 100%;
        box-sizing: border-box;
    }
    .alter1-txt, .alter2-txt, .alter3-txt, .alter4-txt {
        position: static;
        width: 100%;
        box-sizing: border-box;
        height: auto;
    }
    #video1 {
        height: auto;
    }

    /* blog_mahdi.php */
    #tile-container {
        height: auto;
    }
    #tile-container div.tile-col.one, #tile-container div.tile-col.two, #tile-container div.tile-col.three {
        position: relative;
        width: 100%;
        left: 0;
        right: 0;
        height: 400px;
    }
    #tile-container div.tile-col.one figure.tile1 {
        left: 0;
        right: 0;
        top: 0;
        bottom: 5px;
    }
    #tile-container div.tile-col.two figure.tile2 {
        left: 0;
        right: 0;
        top: 5px;
        bottom: 50%;
    }
    #tile-container div.tile-col.two figure.tile3 {
        left: 0;
        right: 0;
        bottom: 5px;
        top: 50%;
    }
    #tile-container div.tile-col.three figure.tile4 {
        left: 0;
        right: 0;
        top: 5px;
        bottom: 50%;
    }
    #tile-container div.tile-col.three figure.tile5 {
        left: 0;
        right: 0;
        bottom: 5px;
        top: 50%;
    }
    ul.blogfeed li.lr {
        border-right: 0;
    }
    ul.blogfeed li.lt {
        border-top: 0;
    }
    ul.blogfeed li {
        width: 100%;
        height: auto;
        border-top: 0;
        border-right: 0;
        border-bottom: 1px solid #d0d0d0;
    }
    ul.blogfeed li:last-child {
        border-bottom: 0;
    }
    .blog-cont { 
        margin: 0px 10px;
    }

    /* feed_mahdi4.php */
    .h2overlap {
        font-size: 13px;
        padding: 10px;
        top: -50px;
    }
    .h3overlap {
        font-size: 13px;
        top: -90px;
        height: 39px;
    }
    .h1silo {
        font-size: 20px;
    }
    .h2silo {
        font-size: 15px;
        padding: 10px;
        top: -50px;
    }
    .h3silo {
        font-size: 13px;
        top: -90px;
        height: 39px;
    }
    #quote-container {
    	margin: 20px 0px;
    }
    #quote-in {
    	padding: 30px 0px;
    }
    #quote div {
    	font-size: 18px;
        max-width: calc(100% - 80px);
    }
    .quotes-down, .quotes-up {
    	width: 20px;
    }

    .termsBox {
        width: 90%;
        height: 70%;
    }


    /* famous-customer */
    .famous-inline {
        width: calc(50% - 20px);
        font-size: 14px;
    }


    /* customer-referral.php */
    .ref-cells .inline-4-12 {
        width: 100%;
        margin: 0;
    }
    .ref-cells .inline-10-12 {
        font-size: 14px;
    }
    form.ref .refrow {
        margin: 0;
    }
    form.ref .cll1, form.ref .cll2 {
        width: 100%;
        margin: 5px 0px;
    }
    hr.ref {
        margin: 15px 0px;
    }
    h3.ref {
        margin-top: 0;
        font-size: 22px;
    }
    .bg-black h2 {
        font-size: 20px;
    }
    .ref-prog {
        width: 35px;
        height: 35px;
        line-height: 35px;
        font-size: 12px;
    }
    .ref-bar {
        width: 35px;
    }
    #ref-bannertext {
        margin: 0;
    }
    #ref-bannertext h1 {
        font-size: 22px;
    }
    #ref-bannertext p {
        font-size: 14px;
    }
    h2.ref {
        font-size: 22px;
    }
    .bg-lifesource {
        padding: 0px;
    }


    .refer-container {
        margin: 0 auto;
        width: 100%;
        font-size: 0;
    }
    .refer-box {
        display: inline-block;
        vertical-align: top;
        position: relative;
        width: 100%;
        margin: 15px 0;
        border: 1px solid #ccc;
        padding: 20px;
        box-sizing: border-box;
    }
    .refer-box-l {
        width: 100%;
        font-size: 16px;
    }

    /************************ NEW WEBSITE **********************************/
    /* index.php */
    .new-bdy {
        width: 100%;
        margin: 0;
    }
    .new-con {
        padding: 30px 10px;
    }
    .new-con.redpad {
        padding: 15px 10px;
    }
    .new-con.darkgreen h2, .new-con.white h2, .new-con.green h2, .new-con.darkestgreen h2 {
        font-size: 25px;
        margin-bottom: 15px;
    }
    .index-three .inline-4-12 {
        width: 100%;
        margin: 0;
    }
    .index-six .inline-2-12 {
        width: calc(100%/3 - 20px);
        margin: 10px;
    }
    .indexIframe {
        position: relative;
        padding-bottom: 50%; /* 16:9 */
        padding-top: 25px;
        height: 0;
    }
    .indexIframe iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    .mobile-center {
        text-align: center;
    }
    /* water-softener */
    .new-topright {display: none;}
    h1.ws {
        font-size: 24px;
    }
    .watersoftener-top {
        min-width: 0;
        padding: 0;
    }
    .watersoftener-top .new-bdy img {
        width: 200px;
    }
    .watersoftener-title {
        font-size: 24px;
    }

    .waterfilter-top {
        min-width: 0;
        padding: 0;
    }
    .waterfilter-top .new-bdy img {
        width: 200px;
    }
    .waterfilter-title {
        font-size: 24px;
    }

    .btn {
        margin: 5px;
    }
    .gbtn {
        padding: 7px 12px;
    }
    .gbtn span {
        font-size: 15px;
    }
    .gpar {
        font-size: 18px;
    }


    
    #topline span {
        position: static;
        display: block;
        top: initial;
        transform: none;
        padding: 10px 0px;
        text-align: center;
    }
    #topline span img {
        height: 20px;
    }

    /* referrals.php */

    /* ref */
    .ref1,
    .ref2 {
        width: calc(100% - 40px);
        margin: 25px 20px;
        height: auto;
        padding: 20px;
    }

    .justmobinline {display: inline-block;}
    .justmobile {display: block;}
    .nomobile {display: none;}
}


@media (max-width: 1500px) {
    #topnav_blog a {
        display: none;
    }
    #topnav_blog a:last-child {
        display: inline-block;
    }
    .author {
        display: none;
        position: static;
        float: left;
        margin-right: 20px;
    }
    .author img {
        margin-top: 20px;
    }
}



/* mobnav link */
@media (max-width: 357px) {
    #hdr-mob .inline-4-w {
        font-size: 11px;
    }
}


@supports (-ms-accelerator:true) {
  /* IE Edge 12+ CSS styles go here */ 
    .simpleinline {
        margin-right: 9px;
    }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     /* IE10+ CSS styles go here */
    .simpleinline {
        margin-right: 9px;
    }
}