body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body img { position: absolute; bottom: -30px; }

/* HIDE & RESET */

p { margin:0; padding:0; color: #fff; font-size: 1.125rem; }

h3 {font-size: 2.25rem;}

p a:hover {color: #b6c1cb;}

.fake-main { display: none; }

#wrapper { background-color: transparent; max-width: 768px; margin: 0 auto; }

#wrapper .main { padding: 0!important; }

#wrapper img { position:relative; bottom:auto; }

#stickyHeader {	top:-1000px; display: none; }

#main {	width: 100%;	max-width: 100%;	padding-top: 0 !important; }

footer { display: none; }

.breadcrumb { display: none; }

.full-width .primary-content {padding: 0 !important; }


/* HOME PAGE */
.stagesWrapper, .modeWrapper, .content-wrapper {max-width: 768px; width: 100%; margin: 0 auto;}

.stagesWrapper div { display: block; }

.stagesWrapper img { margin: 0 auto; display: block; border-top:solid 3px #fff; }

.stagesWrapper .title img {border:0;}

/*.title { background: #6e7678; }*/
.title {text-align: center; padding: 2em 1em 1em;}
.title .header-logo {max-width: 137px; margin-bottom: 1em;}
.title > h2 {color: #fff; font-size: 2.5em; letter-spacing: -.02em; font-weight: 800; margin-bottom: 0.125em;}
.title > h4 {font-size: 2em; color: #fff; font-weight: 400;}

.stage1 { background: #5797b8; }

.stage2 { background: #386c8d; }

.stage3 { background: #983947; }

.stage4 { background: #e07e3f; }

.footer { background: #4d5556; }

@media only screen and (min-width:580px) {
    .title > h2 {font-size: 3.5em;}
    .title > h4 {font-size: 2.5em;}
}

/* INTERIOR PAGES */

section {padding-top: 1em; padding-bottom: 1em;}

section .install-instructions {padding: 2em 1em 0;}

section .install-instructions img {margin-bottom: 0.5em;}

section p.intro { font: 600 19px/27px 'open sans', sans-serif; color: rgba(255,255,255,0.8); text-align: center; margin-bottom: 1em;}

section h2 { color: #fff;	font-weight:600; margin:20px 0 5px 0; font-size:33px; text-align:center; }

section h2:nth-of-type(2) { margin-top: 40px; }

.underDots { text-align: center; color: rgba(255,255,255,0.6); font-size: 18px; letter-spacing: .2rem; font-weight: 600; }

em { font:normal 400 14px/22px 'open sans', sans-serif; color:#fff; display: block; text-align: center;  }

em a { font:normal 400 14px/22px 'open sans', sans-serif; color:#fff; text-decoration: none; }

ul { padding:0!important;	margin:0!important; letter-spacing:0!important; }

ol {padding: 0; list-style: none;}

li { /*padding:0; display: block; */margin:35px 0 0 0;	color: #fff; font-size: 20px; line-height: 1.3; font-weight: 600; letter-spacing:0 !important; }

li a { color: #fff; font-size: 16px; line-height: 1.3; font-weight: 600; letter-spacing:0 !important; border-bottom: solid 1px #fff;}

li a:hover {color: #b6c1cb; border-color: #b6c1cb;}

/*ul li:nth-of-type(1) { margin:20px 0 0 0; }*/

li span {	margin: 0 5px 0 0; font-weight: 700; font-size: 30px; color: rgba(255,255,255,0.5); }

li img { display: block; width: 100%; max-width: 768px;	margin: 20px auto; }

li img + img { margin:0; }

.fitkitNoMargin { margin-bottom:-30px; }

.checkWork a { color: #fff; font-size: 20px; line-height: 1.3; font-weight: 600; color: rgba(255,255,255,0.7); }

/* Content-wrapper */
.content-wrapper {background-color: #fff; text-align: center; padding:0;}
.content-wrapper .inner-content {padding: 2em;}
.content-wrapper p {color: #67696d;}
.content-wrapper .greenguard-content {background-color: #94a865;}
.content-wrapper .greenguard-content p, .content-wrapper .greenguard-content h3 {color: #fff; margin-bottom: .25em;}

.content-wrapper .slick-slide .title {padding-top: 0.75em;}
.content-wrapper .slick-slide .title strong {display: block;}
.content-wrapper .qr-features-slider {background-color: #f2f2f2; padding: 2em;}
.content-wrapper .slick-slide img {display: inline-block;}
.content-wrapper .slick-dots {position: relative;}
.content-wrapper .slick-dots li {width: 1rem; height:1rem; margin: 0 .5rem;}
.content-wrapper .slick-dots li button {padding: 0; width: 100%; height: 100%;}
.content-wrapper .slick-dots li button:before {background-color: #b6daec; width: 100%; height: 100%; top:0; left:0; opacity: 1;}
.content-wrapper .slick-dots li.slick-active button:before {background-color: #5998b8; opacity: 1;}
.content-wrapper .slick-prev, .content-wrapper .slick-next {display: none!important;}
.content-wrapper .slick-prev:before, .content-wrapper .slick-next:before {width: 1.5rem; height: 1.5rem;}

@media only screen and (min-width : 550px) {
    .content-wrapper .slick-slide .title {max-width: 70%; margin: 0 auto;}
}

@media only screen and (min-width : 768px) {
    .content-wrapper .slick-slide {width: 46%!important; margin-left: 2%; margin-right: 2%; margin-bottom: 1.5em;}
    .content-wrapper .slick-slide:nth-child(odd) {clear: both;}
}

@media only screen and (min-width : 1025px) {
    .content-wrapper .mobile-only {display: block;}
    .content-wrapper .slick-slide .title {max-width: 90%;}
}

/* FOOTER */

.manualWrapper a { text-align: center; padding: 25px 30px 20px; display: block; text-decoration: none; color: #fff; font-size: 16px; font-weight: 600; background:#6a849b; }


.stagesNav { display:flex; justify-content: center; flex-flow: row nowrap; margin-bottom: 25px; margin-top: 30px; }

.stagesNav div { position: relative; display: inline-block; border-radius: 50%; width: 50px; height: 50px; text-align: center; margin: 0 7px; background-color: rgba(255,255,255,0.15); }

.stagesNav div a { font: 500 25px/26px montserrat; color: #fff; padding: 11px 20px 13px 18px; display: inline-block; }

.stagesNav .active { background-color: #fff; color: #6a849b; /*border: solid 1px rgba(255,255,255,0.25);*/ }

.stagesNav .active a { color: #6a849b; }

.stagesNav .home {  }

.stagesNav .home a { position: relative; height: 100%; }

.stagesNav .home a img { position: absolute!important; left: 7px!important; }


.csWrapper { display: block; background: #6a849b; text-align: center; padding: 20px 0 80px; margin: 0; }

.csWrapper.home { padding-top: 5px; }

.csWrapper p { display: block; font-size: 15px; }

.csWrapper a { display:inline-block; color:#fff; text-decoration:none; font-size: 16px; }

.csWrapper h3 { font: 400 22px/27px 'open sans', sans-serif; color:#fff; padding: 0; margin: 15px 30px 5px; }


.contactWrapper { background: #6a849b; text-align: center; /*padding:10px 0 0;*/ }

.contactWrapper p { margin:0; display: block; padding:0; border-bottom:solid 1px #fff;}

.contactWrapper p:nth-of-type(1){ /*border-top:solid 1px #fff;*/ }

.contactWrapper a { display: block; color:#fff; text-decoration:none; padding:10px 30px; font-size: 16px; }