.pageHeader {display: none}

/* HEADER --------------------*/
body:not(#tinymce) {padding-top: 88px;}
body>header{text-align: left;position: fixed;width:100%;background:#001121; padding:0}
#brand{display: block; position: relative; line-height: 3rem; padding: 0.5em; display: block; margin:0; width:10em;}
#brand img {max-width: 100%; width: auto; max-height: 100%; width: auto}
#ancillary {top:0; right:0.5rem; font-size:0.85em; position: absolute; margin:0; height: 3rem}
#ancillary ul,
#ancillary .search {display: none}
#ancillary form > .phone {line-height: 54px; opacity: 1; padding: 0 1em; font-size: 1.25em; color: #fff}
#ancillary form > .phone:before {display: none}

body>header #mainnav>.menu, body>header #mainnav .search {display: block}

/* TYPOGRAPHY */
hr{border-top:1px solid rgba(0,0,0,.15);margin:1em 0}
p{font-size:1em}
h1{font-size:1.6em;margin-bottom:1em}
h1+h2{margin-top:-.7em}
h2{font-size:1.45em}
h3{font-size:1.3em}
h4, th{font-size:1.2em}
h5, h6, h7, h8, h9{font-size:1.1em}
sup, sub { font-size:.6em; line-height:.6em;vertical-align:baseline;position:relative}
sup {bottom:1ex}
sub {top:.5ex}
table{border-collapse:collapse}
.req{color:#c00}
#content>section{margin:2em 0}

/* TOPNAV */
body>header .primary{background-color:#E24031;display: table; width: 100%}
.primary>*{color:#fff;line-height:2.5rem; font-size: 0.85em; padding:0;white-space: nowrap; display: table-cell; width:1%; padding:0; text-align:center}
.primary>*+*{border-left: 1px solid rgba(255,255,255,.2)}
    header .primary .menu:after{content:""; width: 1rem; height: 2.5rem; background: url(/images/icons/misc/menu.svg) no-repeat center; display:inline-block; vertical-align:top}
.secondary{position: absolute;right: 0;top:0;line-height: 3rem;text-align: center;padding:0 .5rem}
.secondary .navIcon{padding:0 .5rem;height: 3rem;float: left;display: inline-block;font-size: 1.25em}
.navIcon{text-align: center}
.navIcon:after{font-family: FontAwesome;display: inline-block;}
header .menu{cursor: pointer}
.primary .menu:after{padding-left:.5em}
header>.menu{position: fixed;right: 0;top: 0;width: 2.5em;height: 2.5em;line-height: 2.5em;z-index:-1;opacity: 0;background-color: rgba(255,255,255,.5)}
.scroll header>.menu{opacity: 1;z-index: 2}

/* HAMBURGER */
body>header:before{content: "";opacity: 0; z-index: 3;background-color: #000;display: block;position: fixed;left:100vw;top:0;width:100vw;height:100vh;transition:left 0ms ease 200ms, opacity 200ms ease}
body.slideNav>header:before{left:0;opacity: .85;transition:left 0ms ease 0ms, opacity 200ms ease}
#mainnav,header>.menu{transition:all 200ms ease 0s}
.slideNav header>.menu{right:80%}
.slideNav #mainnav {right:0}
#mainnav {right:-80%; position:fixed; overflow:auto;-webkit-overflow-scrolling: touch; height:100vh; top:0; padding:0; width:80%; z-index:10; background:#1972c4;}

#mainnav ul + ul {display: table;}


/* MENU --------------------*/
#mainnav{background:#E24031;}
#mainnav>*:last-child{margin-bottom: 3em}
#mainnav li{position: relative; margin:0; display: block; width:100%; text-align:left; border-top:1px solid rgba(255,255,255,.2)}
#mainnav ul{padding-left: 0;margin: 0; display: block}
#mainnav a{position: relative;font-size: 1em; padding:.65em .5rem .65em 1rem;color:rgba(255,255,255,.65);line-height:1.2em;display:block;}
#mainnav li ul{display: none; position: relative;background:none; width:100%; padding:0}
#mainnav li.on>ul{display:block !important}
#mainnav li>span{display: none}
#mainnav li>ul+span{display: block; z-index: 2; position: absolute; right: 0.25rem; top: 0.25rem; opacity: .2; color: #fff; text-align: center; display: inline-block; width: 2rem; height: 2rem; line-height: 2rem; border-radius: 50%; background: #fff;}
#mainnav li>ul+span:before{content:"\203A";font-weight:600; color: #000;display: inline-block;}
#mainnav li.on>span{-webkit-transform: rotate(90deg);transform: rotate(90deg);opacity:.5}
#mainnav li li{font-size:.95em;border-top:1px solid rgba(255,255,255,.1)}
#mainnav li.on{background:rgba(0,0,0,.3)}
#mainnav a{color:rgba(255,255,255,1)}
#mainnav a.menu:before{content:""; width: 1rem; height: 1.2rem; display: inline-block; vertical-align: top; background: url(/images/icons/misc/close.svg) no-repeat center / 70%; margin-right:0.25em}
#mainnav ul a{padding-left:1rem}
#mainnav li ul li a{padding:0.75em 2.5em}
#mainnav ul ul ul a{padding-left:3rem}
#mainnav ul ul ul ul a{padding-left:4rem}
#mainnav > ul > li.on > a {background:none}

#mainnav .search,body>footer .search{width:100%;display: block}
#mainnav .search{padding:1rem;border-top:1px solid rgba(255,255,255,.2);position: relative;overflow: auto}
.search input[type="search"]{height: 2em;width:calc(100% - 2em);line-height: 2em;font-size: 1em;padding: 0 0 0 .5em;border: 0; border-radius: 3px 0 0 3px; float: left;background-color: #fff}
.search button{height: 2rem; opacity: 1; width: 2rem;line-height: 2rem; position: relative; padding: 0;border: 0; border-radius: 0 3px 3px 0; float: left;-webkit-appearance:none;background: #001121 url(/images/icons/misc/search.svg) no-repeat center / 60%; opacity:1; }

/* CONTENT --------------------*/
main{padding:1rem;clear:both;word-wrap:break-word}
main>.wrap {padding-top: 0.75em}
#content{max-width:40rem;float:none; width:100%; padding:0;margin:0 auto;min-height: 50vh}
#content img{max-width:100%;height:auto}
#content .photoright, #content .photoleft{max-width:40%;max-height:40%; margin: 0 0 1em 1em; height:auto}
#content .photoright img,#content .photoleft img {max-width:100%;height:auto}
img.phototreatment, .phototreatment img{max-width:100%; max-height:120px}
.photoright{float:right;padding:0;clear:right}
.photoleft{float:left;padding:0;clear:left}
.muted {opacity:0.5;filter:alpha(opacity=50)}
.highlight{background:#FFC;padding:1em;margin:.7em 0}
.highlight, .content .highlight {padding:1.5em 1em}
#content * h1{font-size:1.2em}
main>div>aside {width:100%; margin: 3em 0 0}

.home > section {padding: 3em 1em}
.home > section h1 {font-size: 1.4em}
.home > section p {margin-bottom: 2em}
.home > section a {width: 100%; float: none; padding-bottom:90%}
.home > section a+a {margin: 2em 0 0}
.home > section span {font-size: 1.15em; font-weight:600}
.home > main:after {width: 100%; height: 100%; lefT:0; top:0; right:0; bottom:0}
.home > main, .home > main .wrap {width:100%; padding:0}
.home > main #content {width:100%; padding: 2em 1em; text-align: center; background: rgba(0,0,0,0.75); color:#fff}
.home > main #content h1 {line-height: 120%; color:#fff}
.home > main #content a {border: 0; line-height: 120%}
.home > main #content a+a {margin-top: 1em}
.home > main #content p {color:#fff}

.home .categories a {margin: 1em 0}
.interior .categories a {width:100%; box-shadow:none; border:1px solid rgba(0,0,0,0.15); margin:0 0 3em}
.interior .categories a > span span {font-size: 1em}
.product-page .tab-content {padding:2em 1em}
.product-page .tabs li {width: 100%; float: left; clear: both; margin:0}
.product-page .tabs a {font-size: 1em; float: left; display: block; width:100%; border-radius: 0;}
.product-page .topVideo .mainVideo, .product-page .topVideo .mainDetail {width:100%; padding:0}
.product-page .topVideo .mainDetail {margin-top:1em}
.product-page .videoGallery .videoSmall {width: 47.25%; margin: 0 1% 6%}

/* Comparison Table */
.comparison-wrapper {position: relative; z-index:1; padding: 0 0 3rem; overflow:auto;}

/* Breadcrumb */
.breadcrumb a:after{content:"\00A0\f105\00A0\0020";font-family:FontAwesome;opacity: .5}

/* Children */
#content nav.children{margin-top:2em}
#content nav.children ul{background-color:rgba(0,0,0,.1);border-radius:4px;padding:0}
#content nav.children li{background:none;padding:0;margin:0}
#content nav.children a{padding:.4em .6em;display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#content nav.children li+li a{border-top:1px solid rgba(255,255,255,1)}


.product-page .top > .gallery,
.product-page .top > .overview {width:100%; padding:0}
.product-page .top > .overview {margin: 2em 0}
.product-page .top > .overview .cta-buttons {
    font-size: 0.875em;
}

/* FOOTER */
body>footer .fatFooter {padding-top:2em}
body>footer .fatFooter > * {width:100%; text-align: center}
body>footer .fatFooter > * + * {padding-top: 2em; margin-top:2em; border-top: 1px solid rgba(255,255,255,0.25)}
body>footer .fatFooter .icons a {float: none}
body>footer .fatFooter .icons a+a {margin-left:1em}
body>footer .copyright .wrap {padding:0}
body>footer .copyright .wrap > div:first-child {display: none}
body>footer nav{display: block}





/* SPLIT RIBBON ------------------------------ */

.split-ribbon .ribbon-right {
  margin-top: 2em;
}