h1 {font-size: 1.3em;text-align: center;margin-bottom: 0;}
h2{font-size: 1.2em; color: #3a7db2;}
h3 {font-size: 1.1em; color: #245678; text-align: center;}
p {font-size: 1em;}

h1, h2, h3, h4, p {margin: 6px 10px; padding: 4px; line-height: 1.4em;}

ul  {list-style-type: square; margin: 10px 10px 10px 12px;}
ul li {margin: 3px; padding: 2px;}

a:link, a:visited { color: #c5150e;}
a:hover, a:active {color: #cb0000;}

a img {border: none;}
img {width: auto; height: auto; max-width: 100%;}

.clear {clear: both;}
.clearfix:after {content: ""; display: table; clear: both;}

.large {font-size: 1.5em;}
.small {font-weight: normal; color: #000; font-size: .9em;}

/* layout */

/* menu */

.navbar {background: #2c4660; text-align:center;padding: 3px 0;
    overflow: hidden; z-index: 1000;
    background-color: #333;
    position: fixed; /* Set the navbar to fixed position */
    top: 0; /* Position the navbar at the top of the page */
    width: 100%; max-width: 900px;
}
body .slimmenu {background: #2c4660; padding: 3px 0; margin:0 auto;text-align:center; width: 100%; border: none;}
body .slimmenu > li {margin: 0; padding: 0;  float: none; display:inline; border-left: none;}
body .slimmenu > li a { padding: 10px;display: inline-block; font-size: .9em;}
.slimmenu a:link, .slimmenu a:visited {color: #fff !important; background: #355574;}
.slimmenu a:hover, .slimmenu a:active {color: #fff !important; background: #222 !important;}


/* end menu */

body {font-family: verdana, helvetica, sans-serif; background: #eeeff1; font-size: 14px; margin: 0; padding: 0; }

#main {background: #fff; margin: 10px auto; max-width: 900px;}
#header { padding-top: 32px; width: 100%; background: #93bad4; border-top: 6px solid #9fbcd5;border-bottom: 3px solid #222; margin-bottom: 10px;}
#header h4 {font-size: 1.1em;}
#headerLeft {float: left; width: 55%; text-align: center;}
#headerRight {float: right;width: 45%; padding: 7px 0 0;text-align: center; color: #000;}

#content {clear: both; padding: 20px 0;}
#intro2 {margin: 50px 100px 80px;}
.introWrap {border-top: 1px dotted #000;border-bottom: 1px dotted #000;background: #355574; color: #fff;}
.introWrap p, .introWrap a, introWrap ul li, .introWrap strong {color: #fff;}
.introWrap a:hover, .introWrap a:active {color: #9fbcd5 !important;}
.introWrap h3 {font-size: 1.1em; font-weight: normal;}

#footer {border-top: 5px solid #c5150e; margin-top: 0; clear: both;}

img#logo { margin: 0 0 0 25px;}

.highlight {color: #c5150e; font-weight: bold;}
.highlight2 {color: #880000; font-weight: bold;}
.highlight3 {color: #fff;}
.highlight4 {color: #00408D; font-weight: bold;}

h1.unique {text-align: left;}
h1#strategy {margin: 0 auto 6px; text-align: center;}
h2.scroll {background: #eeeff1; margin: 10px 20px; font-size: 1.1em;}
h3.special {font-size: 1.2em; color: #a22533; text-align: center;}
h3.bright {color: #2c4660; font-size: 1.2em; padding:6px; margin: 15px 0 0; 
background: #9fbcd5;}

h3.choose {background: url(../new-images/arrow.png) 0 8px no-repeat; padding: 10px 0; margin: 0;}
h3.choose a {display: inline-block; margin-left: 10px;}
h3.choose a:hover, h3.choose a:active {color: #000;}
ul li {padding: 0; margin: 10px 8px; list-style-type: square;}

ul.check {padding: 10px 30px 15px 10px;font-size: 14px;}
ul.check li {list-style-type: none; }

ul.check li
{
background-image: url(../new-images/checkmark.png);
background-repeat: no-repeat;
background-position: top left;
padding-left: 24px;
}




.leftIntro {float: left; width: 65%;}
.rightIntro {float: right; width: 34%;}
.leftIntro2 {float: left; width: 42%;}
.rightIntro2 {float: right; width: 56%;}
.leftIntro3 {float: left; width: 49%; text-align: right;}
.rightIntro3 {float: right; width: 49%; text-align: left;}
.rightIntro p {padding: 6px 0;}
.leftIntro4 {float: left; width: 48%;}
.rightIntro4 {float: left; width: 45%;}
.leftIntro4 h3, .leftIntro4 p,
 .rightIntro4 h3, .rightIntro4 p {text-align: left; margin: 6px 10px; padding: 6px;}

.leftAlign {text-align: left;}
.centerAlign {text-align: center;}
p.rightAlign {text-align: right;}
.alignRight {float: right; margin: 0 0 10px 20px;}

table {border-collapse: collapse;}
table td {padding: 0; vertical-align: top;}

.company, .installation {border-bottom: 6px solid #edeef0; margin-bottom: 10px;}

.installation h2, .installation h3 {text-align: left;}

#logos {margin: 10px auto; text-align: center;}
#logos img {margin: 5px;}

div.dry {background: #aeb2b1;}

@media (max-width: 768px) {
#main {margin: 10px auto; width: 100%;}
 #headerLeft {width: 50%;}
#headerRight {width: 45%;}
.leftIntro, .rightIntro, .leftIntro2, .rightIntro2, .leftIntro3, .rightIntro3 {float:none; width: 100%;}
.rightIntro {max-width: 300px; margin: auto;}
 .leftIntro2, .rightIntro2, .leftIntro3, .rightIntro3 {text-align: center; margin: auto;}
 h1.unique {text-align: center;  margin: auto;}
 p.description {text-align: justify; margin: 6px 20px;}
 .navbar-header {background: #323663;}
.navbar {border-bottom: none; background: none;}
.nav-toggle {color: #fff;}
.icon-bar {margin: auto; text-align: center;}
.navbar-toggle {border: 1px solid #595781 !important; background: #2c4660; text-align: center !important;}
.navbar-collapse { background: #2c4660; padding-bottom: 10px;}
.navbar-nav {margin: 0 auto;}
}


@media (max-width: 600px) {
#headerLeft, #headerRight {float: none; width: 100%;}
#headerLeft {text-align: center;}
img.logo {margin: 0;}
#headerRight {background: #285677; border-top: 1px solid #285677;
 border-bottom: 1px solid #285677; padding: 0; margin: 0;}
 #intro2 {margin: 10px;}
 h1.unique { max-width: 280px; }
#content {width: 100%;}
img.alignRight {float: none; margin: 10px auto; display: block;}
}


@media (max-width: 481px) {
	#main {margin: 10px auto; width: 96%;}
	
}


@media (max-width: 320px) {
img#logo { margin: 0;}
}

@media (max-width: 240px) {
p.description {text-align: left; margin: 6px 4px;}
}