html, body {
 padding: 0; margin: 0;
}

body { font-size: 16px; font-family: 'Roboto', sans-serif; }
textarea {font-family:"Roboto",sans-serif;}
/* BASE FONT SIZE: For this to work well, font-sizes, margins, padding, positioning, etc should be defined in 'em' wherever possible */
@media only screen and (max-width:1250px) { body { font-size:15px; } }
@media only screen and (max-width:1180px) { body { font-size:14px; } }
@media only screen and (max-width:1100px) { body { font-size:13px; } }
@media only screen and (max-width:1025px) { body { font-size:12px; } }
@media only screen and (max-width:800px)  { body { font-size:16px; } }


a { color:#0d4c88; }

.inner-container img { max-width:100%; height:auto!important; }

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

.page h2 { border-bottom: 3px solid #6699cc; font-weight: 400; padding-bottom: 8px; }
 
iframe { max-width:100%; }

/*------------------------------- HEADER */
.header-accent { background: #222222; height: 30px; }
.header-top { background: rgba(238,238,238,.75); }
.header-top > div { margin: 0 auto; max-width: 1200px; height: 90px; position: relative; }
.header-top .header-logo { position: absolute; bottom: 0; left: 0; text-decoration: none; }
.header-top .header-logo img { height: 90px; }
.header-right { margin-left: 375px; padding: 29px 10px; width: calc(100% - 395px); text-align: right; }
.header-right .viewVideos { padding: 7px 15px 7px 35px; margin-right: 20px; border-radius: 50px; background: #669900; color: #fff; text-decoration: none; font-size: 14px; position: relative; display: inline-block; vertical-align: middle; }
.header-right .viewVideos:hover { text-decoration: underline; }
.header-right .viewVideos:after { content: url('../img/icon-video.svg'); position: absolute; top: 2px; left: 2px; }
.header-right .findFloor { padding: 7px 15px 7px 35px; margin-right: 20px; border-radius: 50px; background: #2d2c89; color: #fff; text-decoration: none; font-size: 14px; position: relative; display: inline-block; vertical-align: middle; }
.header-right .findFloor:hover { text-decoration: underline; }
.header-right .findFloor:after { content: url('../img/icon-find-floorplans.svg'); position: absolute; top: 2px; left: 2px; }
.header-right .search { display: inline-block; vertical-align: middle; position: relative; margin-right: 10px; }
.header-right .search > input { padding: 7px; border: 1px solid #efefef; min-width: 250px; }
.header-right .search:after { content: url('../img/icon-search.svg'); position: absolute; top: 7px; right: 5px; }
.header-right .advSearch { display: inline-block; vertical-align: middle; text-decoration: none; color: #0d4c88; text-align: left; }
.header-bottom { background: #0d4c88; position: relative; }
.header-bottom > ul { margin: 0 auto; padding: 0; max-width: 1200px; list-style: none; text-align: center; }
.header-bottom ul li { display: inline-block; text-align: left; position: relative; }
.header-bottom > ul > li > a { display: block; color: #ffffff; border-left: 1px solid #3d70a0; padding: 1.25em; padding-right: 5em; text-decoration: none; text-transform: uppercase; font-weight: 700; position: relative; cursor: pointer; }
.header-bottom > ul > li > a:before { position: absolute; content: url('../img/icon-dropdown.svg'); top: 1.875em; right: 1.875em; transition: top .3s; }
.header-bottom > ul > li:hover > a:before { top: 2.5em; }
.header-bottom ul li a > span { font-size: 1.5em; display: block; }
.header-bottom > ul > li:last-child > a { border-right: 1px solid #3d70a0; }

/* dropdowns */

.header-bottom ul li ul{display:none;z-index:1;padding:0;margin:0;width:100%;position:absolute;right:0;background:#fff;list-style:none;z-index: 2; box-shadow:0 10px 10px rgba(0,0,0,.4); }
.header-bottom ul li:hover ul,
.header-bottom ul li ul:hover{display:block}
.header-bottom ul li ul:after{bottom:100%;right:1.5em;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-color:transparent;border-bottom-color:#fff;border-width:1.066em;margin-left:-1.066em}
.header-bottom ul li ul li{display:block;padding:0 1px}
.header-bottom ul li ul li a{display:block;padding:.5em 1em;color:#000;text-align:right;text-transform:uppercase;font-size:1.175em;font-weight:700;text-decoration:none}
.header-bottom ul li ul li a:hover{color:#486d9b}

.header-bottom ul li ul.product-menu { right:auto; left:0; background:#fff; width:100%; box-sizing:content-box; }
/*.header-bottom ul li ul.product-menu, */ /*uncomment to test*/
.header-bottom ul li ul.product-menu li { position:static; background-color:#fff; }
.header-bottom ul li ul.product-menu .dropdown { display:none; position:absolute; top:1.5em; right:0; padding: 0 15px 0; width:550px; box-sizing:border-box; border-left:1px solid #ccc; }

@media (min-width: 875px) {
	.header-bottom ul li ul li:first-of-type a { padding-top:1.5em; }
	.header-bottom ul li ul li:last-of-type a { padding-bottom:1.5em; }
	.header-bottom ul li ul.product-menu:hover { padding-right: 550px; min-height: 420px; }
	/*.header-bottom ul li ul.product-menu li:first-of-type div,*/ /*uncomment to test*/
	.header-bottom ul li ul.product-menu li:hover div { display: block; }
}

.tagline { text-transform: uppercase; text-decoration: none; font-size: 1em; color: #333333; text-align: center; }

.tagline b { padding: 0 5px; color: #0d4c88; }


/*------------------------------- HOMEPAGE */

.feature-callouts { background: #222222; padding: 10px 20px; }
.feature-callouts > div { max-width: 1200px; margin: 0 auto; text-align: center; }
.feature-brands { background: #ffffff; padding: 20px; text-align: center; }
.feature-brands > div { max-width: 1200px; margin: 0 auto; }
.feature-brands h1 { font-size: 2.8125em; text-transform: uppercase; font-weight: 300; }

.feature-brands ul { list-style-type: none; margin: 0; padding: 0; column-count: 3; column-gap: 2em; }
.feature-brands li { list-style-type: none; margin: 0; padding: 0; break-inside: avoid-column; }
.feature-brands li a { display: block; background-color: #333; color: #fff; text-decoration: none; padding: .75em 0; border-bottom: 2px solid #fff; border-radius: 5px; }
.feature-brands li a:hover,
.feature-brands li a:active,
.feature-brands li a:focus { background-color: #0d4c88; }
.feature-quote { background: url('../img/bkgd-quote.jpg') no-repeat center center / cover; padding: 30px 20px; }
.feature-quote > div { max-width: 1200px; margin: 0 auto; color: #ffffff; text-transform: uppercase; }
.feature-quote p { padding: 0; margin: 0; }
.feature-quote p:nth-of-type(1) { font-size: 2.8125em; font-weight: 700; margin-top: 5px; }
.feature-quote p:nth-of-type(2) { font-size: 1.25em; font-weight: 400; margin-top: 5px; }
.feature-quote p:nth-of-type(3) { font-size: .9375em; font-weight: 200; margin-top: 7px; }


.feature-content { background: #f5f5f5; padding: 20px; }
.feature-content > div { max-width: 1200px; margin: 0 auto; }
.feature-content .content { padding: 0 10px; width: calc(65% - 20px); display: inline-block; vertical-align: top; }
.feature-content .news { padding: 0 10px; width: calc(35% - 20px); display: inline-block; vertical-align: top; }
.feature-content .news .n { margin-bottom: .6em; }
.feature-content .news .n .txt a { margin-top: .24em; display: block; }
.feature-content .news a { color: #0d4c88; text-decoration: none; }
.feature-content .news a:hover { text-decoration: underline; }

/*------------------------------- INNER */

.banner-wrapper { /*height: 300px;*/ background-position: center; background-size: cover; overflow: hidden; }
.banner-wrapper > div { margin: 0 auto; padding: 20px; width: calc(100% - 40px); max-width: 1200px; color: #ffffff; }
.banner-wrapper .title { font-size: 4.375em; font-weight: 700; text-transform: uppercase; margin: 0 0 5px 0; color #ffffff; text-align: center; }
.banner-wrapper .line1 { font-size: 1.775em; font-weight: 400; text-transform: uppercase; color: #6699cc; text-align: center; margin-bottom: 10px; }
.banner-wrapper .line2 { font-size: 1.125em; font-weight: 700; color #ffffff; text-align: center; }
.inner-container { margin: 30px auto; max-width: 1200px; padding: 0 20px; }
.inner-callouts { border-top: 1px solid #cccccc; background: #f5f5f5; padding: 20px 10px; clear: both; }
.inner-callouts > div { max-width: 1200px; margin: 0 auto; }

/* fix callouts not centered on some resolutions */
.callout { text-align: center; }

/* swiper adjustments */
.swiper-nextprev { position:relative; padding:0 50px; }
.swiper-slide img { max-width:100%; }
.swiper-full-width .swiper-button-prev { background-image:url(../img/icon-arrow-gallery-left.svg); }
.swiper-full-width .swiper-button-next { background-image:url(../img/icon-arrow-gallery-right.svg); }
.swiper-button-next.swiper-button-disabled, 
.swiper-button-prev.swiper-button-disabled { display:none; }

/*
.dhwidget.content-dhwidget img, .dhwidget.content-simplified-dhwidget img { height:auto !important; }

.product-gallery { width:40%; float:right; }
*/


/*------------------------------- PRODUCTS */
.child-list { text-align: center; }

.child-list > p a { text-decoration: none; display: block; position: relative; height: 100%; }
.child-list > p { display: inline-block; vertical-align: top; width: 31.3%; margin-right: 1%; }
.child-list > p img { margin: 0 auto; max-width: 100%; }
.child-list > p strong { text-align: center; text-transform: uppercase; color: #0d4c88; text-align: center; font-size: 24px; display: block; }
.child-list > p .summary { display: block; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 300; text-align: center; font-size: 14px; margin: -10px 0 55px 0; }
.child-list > p .link-container { position: absolute; left: 0; right: 0; bottom: 0; margin-top: 50px; }
.child-list > p .link { display: block; width: 100%; padding: 15px 0; text-transform: uppercase; color: #0d4c88; border: 1px solid #0d4c88; font-weight: 600; text-align: center; border-radius: 0 0 8px 8px; position: relative; }
.child-list > p .link:after, .child-list > p .link:before { bottom: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }

.child-list > p .link:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 15px; margin-left: -15px; }
.child-list > p .link:before { border-color: rgba(13, 76, 136, 0); border-bottom-color: #0d4c88; border-width: 16px; margin-left: -16px; }
.child-list > p a:hover .link { color: #fff; background: #222; border: 1px solid #222; }
.child-list > p a:hover .link:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #222; border-width: 15px; margin-left: -15px; }
.child-list > p a:hover .link:before { border-color: rgba(13, 76, 136, 0); border-bottom-color: #0d4c88; border-width: 16px; margin-left: -16px; }

.brand-header { background: #eee; border-bottom: 1px solid #222; }
.brand-header .inner-container { margin: 0 auto; position: relative; height: 170px; }
.brand-links { margin: 0; padding: 0; list-style: none; position: absolute; top: 15px; right: 15px; }
.brand-links li { display: inline-block; margin-left: 10px; }
.brand-links a { display: block; text-decoration: none; color: #fff; text-transform: uppercase; font-family: 'Roboto Condensed', sans-serif; background: #6699cc; padding: 10px 15px; border-radius: 5px; }
.brand-links a:hover {  color: #6699cc; background: #fff; }
.brand-navigation ul { margin: 0; padding: 0; list-style: none; position: absolute; bottom: 0; left: 15px; }
.brand-navigation li { display: inline-block; margin-right: 5px; }
.brand-navigation a { display: block; text-decoration: none; border-radius: 5px 5px 0 0; padding: 10px 15px; border: 1px solid #222; color: #fff; background: #222; }
.brand-navigation a:hover { background: #555; border-bottom: 1px solid #555; }
.brand-navigation li.active { /* background: #fff; - problem with border radius*/ }
.brand-navigation li.active a { color: #222; background: #fff; border-bottom: none; padding-bottom: 12px; margin-bottom: -1px; }
.brand-header h1 { padding: 10px 0; margin: 0; font-weight: 600; font-style: italic; font-size: 45px; }

.brand-logo { padding-top:12px; }
.brand-nav-desktop { display: block; }

.brand-nav-mobile { display: none; }

.left-of-filters { float:left; margin-top:0; }
.filters { text-align: right; }
.filters fieldset { border: 0; padding: 0; margin: 0; display: inline-block; vertical-align: top; padding-left: 10px; }
.filters fieldset.specsToggle { }
.filters fieldset.filterBy { }
#spec-fieldset { position:relative; } 
#spec-fieldset-note { position:absolute; left:20px; top:100%; display:none; font-weight:300; font-size:10pt; text-align:left; width:400px; }
.filters fieldset legend { display: inline-block; vertical-align: middle; font-weight: 600; margin-right: 5px; }
.filters fieldset label { display: inline-block; vertical-align: middle; font-weight: 300; margin-left: 10px; }
.filters fieldset label input[type="checkbox"] { border: 1px solid #ccc; height: 13px; width: 13px; position: relative; opacity: 1; }
.model-image-list, .model-specs-list { text-align: left; }
.model-image-list h2, .model-specs-list h2 { text-align: left; }
.model-image-list p, .model-specs-list p { display: inline-block; vertical-align: top; width: calc(31.3% - 2%); padding: 0 1%; margin-bottom: 15px; }
.model-image-list p a, .model-specs-list p a { text-decoration: none; display: block; text-align: center; color: #000; }
.model-image-list p .divider, .model-specs-list p .divider { color: #d7d7d7; padding: 0 5px; }

.model-image-list p img, .model-specs-list p img { margin: 0 auto; max-width: 100%; margin-bottom: 7px; }
.model-image-list p strong, .model-specs-list p strong {  }
.model-image-list p .summary, .model-specs-list p .summary { display: block; color: #000; font-family: 'Roboto Condensed', sans-serif; font-weight: 300; text-align: center; font-size: 14px; margin: -10px 0 5px 0; }
.model-image-list p .link, .model-specs-list p .link { display: block; width: 100%; padding: 15px 0; text-transform: uppercase; color: #0d4c88; border: 1px solid #0d4c88; font-weight: 600; text-align: center; border-radius: 0 0 8px 8px; position: relative; }
.model-image-list h2, .model-specs-list h2 { font-weight: 300; border-bottom: 1px solid #d7d7d7; padding-bottom: 8px; }
.model-image-list p strong:nth-of-type(1), .model-specs-list p strong:nth-of-type(1) { color: #6699cc; background: transparent url("../img/icon-search.svg") no-repeat right center / contain; padding-right: 30px; }
.model-image-list p span strong:nth-of-type(1), .model-specs-list p span strong:nth-of-type(1) { color: #000; background: none; padding: 0; }

.specs-table img { max-width: 100%; }
.specs-table tr th { text-align: left; padding: 2px 6px; table-layout: fixed; text-transform: uppercase; font-weight: 600; background: #f5f5f5; color: #6699cc; border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; }
.specs-table tr th a { text-decoration: none; color: #6699cc; }
.specs-table tr th .model-name { background: transparent url("../img/icon-search.svg") no-repeat right center / contain; padding-right: 30px;}
.group-specs tr th .model-name {  }
.specs-table thead tr th, .group-specs thead tr th:first-child { background: none; color: #000; border: none; }
.group-specs tr th:first-child { vertical-align: bottom; text-align: left;  cursor: pointer; }
.group-specs tr.collapse th:first-child { background: #f5f5f5 url("../img/icon-collapse.svg") no-repeat right 6px center / 15px 15px; }
.group-specs tr.expand th:first-child { background: #f5f5f5 url("../img/icon-expand.svg") no-repeat right 6px center / 15px 15px; }
.specs-table tr td:first-child { white-space: nowrap; text-align: left; }
.specs-table tr.hide-spec { display: none; }
.specs-table td { padding: 2px 6px; border-bottom: 1px solid #d7d7d7; text-align: center; }
.specs-table {  table-layout:fixed; width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.hide-element { display: none; }

.brand-header { background: transparent url("../img/header-bg.jpg") no-repeat center center / cover; }

.back-to-floorplans { float: right; }
.back-to-floorplans a { text-decoration: none; color: #6699cc; }
.inner-model h1 { border-bottom: 1px solid #d7d7d7; font-weight: 300; padding-bottom: 15px; }
.inner-model h1 .headline-divider { color: #d7d7d7; }
.inner-model h1 .headline-model { color: #6699cc; font-weight: 600; }
.inner-model h2 { border-bottom: 3px solid #6699cc; font-weight: 400; }

.model-specs-wrap, .model-gallery { display: inline-block; vertical-align: top; margin: 0 1%; }
.model-gallery { float: left; width: calc(70% - 2%); }
.model-gallery .product-gallery .swiper-slide img { max-height:550px; }
.model-specs-wrap { width: calc(30% - 2%); }
.model-specs table, .model-specs table tr { width: 100%; }

.model-gallery img { max-width: 100%; }
.model-fp-container { width: 100%; text-align: center; }
.model-fp { max-width: 100%; margin: 0 auto; }

.brand-top img { float: right; max-width: 100%; margin-left: 2%; }
.brand-top .highlight { font-weight: 600; color: #6699cc; }
.brand-bottom { margin-top: 20px; }
.brand-feature { display: inline-block; vertical-align: top; width: calc(33.3% - 2%); margin: 0 1%; }
/*.brand-feature h2 { border-bottom: 3px solid #6699cc; font-weight: 400; padding-bottom: 8px; } whole site now uses this for h2*/

.brand-top.has-gallery, .brand-gallery { display: inline-block; vertical-align: top; width: calc(50% - 2em); padding: 0 1em; }

.brand-top.has-gallery { float: left; }

/*.product-gallery.zoomed { float: none; max-width: 100%; width: 100%; margin: 0; }*/

/* jobs and employment app */
.job-details > div { margin-bottom: 1em; }
.button { display: inline-block; background-color: #669900; text-decoration: none; color: white; padding: 7px 2em 7px; border-radius: 5px; }

/*------------------------------- FOOTER */

.footer-top { background: #0d4c88; }
.footer-top > div { margin: 0 auto; max-width: 1200px; padding: 0 20px; }
.footer-top > div > div { display: inline-block; vertical-align: middle; padding: 0; color: #ffffff; }
.footer-top > div .left { width: calc(70% - 20px); }
.footer-top > div .right { width: calc(30% - 20px); }
.footer-top > div a { color: #ffffff; text-decoration: underline; }
.footer-top > div a:hover { text-decoration: none; }
.footer-top > div > div img { display: inline-block; vertical-align: middle; width: 50px; }
.footer-top > div > div p { display: inline-block; vertical-align: middle; width: calc(100% - 60px); padding-left: 10px; }
.footer-bottom { background: #222222; color: #8a8a8a; }
.footer-bottom > div { margin: 0 auto; max-width: 1200px; padding: 30px 10px; }
.footer-bottom .content img { max-width: 250px; width: 100%; }
.footer-bottom .content { display: inline-block; vertical-align: top; width: calc(23% - 20px); padding: 0 10px; text-align: center; }
.footer-bottom .content .tagline { color: #c8c8c8; }
.footer-bottom .content p { font-style: italic; }
.footer-bottom .connect { display: inline-block; vertical-align: top; width: calc(18% - 20px); padding: 0 10px; }
.footer-bottom > div > ul { display: inline-block; vertical-align: top; width: calc(59% - 20px); padding: 0; margin: 0; list-style: none; }
.footer-bottom > div > ul > li { display: inline-block; vertical-align: top; width: calc(25% - 10px); padding: 0 5px; }
.footer-bottom > div > ul > li > ul { list-style: none; padding: 0; margin: 0; }
.footer-bottom > div > ul > li > ul li a { text-decoration: none; color: #5f8dbb; }

.footer-bottom > div > ul > li > ul li a:hover { text-decoration: underline; }
.footer-bottom > div > ul > li > a > span.extra { display: none; }

.footer-bottom .connect > span, .footer-bottom > div > ul > li > a { display: block; text-decoration: none; text-transform: uppercase; color: #ffffff; font-weight: 700; font-size: 1em; margin-bottom: 10px; }

#dev_log { overflow: hidden; }


/* Hide product menu dropdowns from footer */
.footer-bottom ul li ul.product-menu .dropdown { display:none; }

/*hide dealer-locator from footer*/
.footer-bottom .parent.id324 { display: none; }

/*------------------------------- BLOG */

.wp-hook { line-height: normal !important; font-family: 'Roboto', sans-serif !important; }
.wp-hook p { margin: 1em 0 !important; }
.wp-hook .page a { color: #0d4c88; text-decoration: underline; }
.wp-hook .page a:hover { color: #0d4c88; text-decoration: none; }


/*------------------------------- PRODUCT SLIDESHOWS */
.product-gallery { position:relative; }
.product-gallery .swiper-wrapper { display:flex; align-items:center; }
.product-gallery .swiper-slide { text-align:center; }
.product-gallery .swiper-slide img { display:block; margin:0 auto; max-height:450px; float:none; }

.product-gallery .swiper-thumbs .swiper-slide img { max-height:50px; }
.product-gallery .swiper-thumbs { margin:1em 0; display: none;}

.galThumbs-button-next, .galThumbs-button-prev {
 display: none;
}

.product-gallery .swiper-thumbs a { box-sizing:border-box; display:block; }
.product-gallery .swiper-thumbs a img { opacity:.7; border:2px solid #fff; }
.product-gallery .swiper-thumbs a.selected img { opacity:1; border-color:black; }

.product-gallery div.caption { margin:0; width:100%; color:#333; font-size:.8em; padding:.25em 2em; box-sizing:border-box; }

.product-gallery .slideshow-zoom { opacity:.8; cursor:pointer; position:absolute; top:0; right:1em; text-transform:uppercase; color:#000; font-weight:bold; font-size:.8em; padding:.25em .25em .25em 20px; border-radius:3px; background:white url(../img/icon-enlarge.svg) no-repeat .25em center; z-index:2; background-size:16px; }
.product-gallery .slideshow-zoom:hover { opacity:1; }
.product-gallery .slideshow-zoom .close { display:none; }
.product-gallery.zoomed .slideshow-zoom { background-image:url(../img/icon-cancel-white.svg); font-size:1.2em; margin:0; color:#fff; background-color:black;  top:1vh; right:5%; background-size:25px; padding-left:35px; line-height:1.5; }
.product-gallery.zoomed .slideshow-zoom .close { display:block; }
.product-gallery.zoomed .slideshow-zoom .zoom { display:none; }

.product-gallery.zoomed { position:fixed; top:0; left:0; right:0; padding:8vh 2% 4vh; bottom:0; width:96%; background:rgba(0,0,0,.85); z-index:99; }
.product-gallery.zoomed .swiper-slide img { max-height:85vh; }
.product-gallery.zoomed .swiper-slide div.caption { font-size:1.1em; color:#fff; }
.product-gallery.zoomed .swiper-thumbs,
.product-gallery.zoomed .galThumbs-button-next,
.product-gallery.zoomed .galThumbs-button-prev { display:none; }
.product-gallery.zoomed .swiper-thumbs .swiper-slide img { max-height:5vh; }

.product-gallery .swiper-nextprev .swiper-button-next,
.product-gallery .swiper-nextprev .swiper-button-prev { transform:scale(.5); }


#product-gallery .swiper-button-next { background-image:url(../img/icon-triangle-gallery-right.svg); }
#product-gallery .swiper-button-prev { background-image:url(../img/icon-triangle-gallery-left.svg); }


/*------------------------------- PRODUCT SEARCH */
.product-result { }
.product-result a { float:left; display:block; box-sizing:border-box; border:1px solid #eee; text-align:center; padding:.25em; text-decoration:none; color:#666; font-size:.8em; }
.product-result img { max-width:100%; max-height:100%; }
.product-result span.image { display:block; height:40%; }
.product-result span.image br { display:none; }
.product-result span.brand { text-transform:uppercase; color:#0d4c88; font-weight:bold; }
.product-result span.model { text-transform:uppercase; font-size:1.1em; font-weight:bold; }

.product-result.hidden { display:none; }

@media (max-width: 513px) {
	/*sizing for mobile */
	.product-result a { width: 31%; margin: 1%; height: 120px; }
}

@media (min-width: 513px) {
	/* sizing for non-mobile */
	.results-1x .product-result a { width: 100%; height: auto; font-size: 110%; }
	.results-2x .product-result a { width: 48%; margin: 1%; height: auto; font-size: 110%; }
	.results-2x .product-result a span.image { height: 65%; }
	.results-3x .product-result a { width: 31%; margin: 1%; height: 150px; }
	.results-3x .product-result a span.image { height: 60%; }
	.results-4x .product-result a { width: 23%; margin: 1%; height: 150px; }
	.results-4x .product-result a span.image { height: 50%; }
	.results-5x .product-result a { width: 18%; margin: 1%; height: 120px; }
	.results-6x .product-result a { width: 15.5%; margin: .5%; height: 120px; }
	.results-7x .product-result a { width: 13%; margin: .5%; height: 120px; }
	.results-8x .product-result a { width: 11.5%; margin: .5%; height: 60px; }
	.results-9x .product-result a { width: 10%; margin: .5%; height: 55px; }
	.results-10x .product-result a { width: 9%; margin: .5%; height: 50px; }
	.results-8x .product-result span.brand,
	.results-9x .product-result span.brand,
	.results-10x .product-result span.brand,
	.results-8x .product-result span.group,
	.results-9x .product-result span.group,
	.results-10x .product-result span.group { display: none; }
	.results-8x .product-result span.model,
	.results-9x .product-result span.model,
	.results-10x .product-result span.model { font-weight: normal; font-size: 1em; }
	.results-8x .product-result span.image,
	.results-9x .product-result span.image,
	.results-10x .product-result span.image { height: 70%; }
}
@media (min-width: 513px) and (max-width: 875px) {
	/* at small screen sizes, treat 4x the same as 3x */
	.results-4x .product-result a { width: 31%; margin: 1%; height: 150px; }
	.results-4x .product-result a span.image { height: 60%; }

	/* at small screen sizes, treat 6x and 7x the same as 5x - and hide details for all of them */
	.results-5x .product-result a,
	.results-6x .product-result a,
	.results-7x .product-result a { width: 18%; margin: 1%; height: 60px; }
	.results-5x .product-result span.brand,
	.results-6x .product-result span.brand,
	.results-7x .product-result span.brand,
	.results-5x .product-result span.group,
	.results-6x .product-result span.group,
	.results-7x .product-result span.group { display: none; }
	.results-5x .product-result span.model,
	.results-6x .product-result span.model,
	.results-7x .product-result span.model { font-weight: normal; font-size: 1em; }
	.results-5x .product-result span.image,
	.results-6x .product-result span.image,
	.results-7x .product-result span.image { height: 70%; }

	/* at small screen sizes, treat 9x and 10x the same as 8x */
	.results-9x .product-result a,
	.results-10x .product-result a { width: 11.5%; margin: .5%; height: 60px; }

}

#product-search-filters .noUi-connect { background:#0d4c88; }
#product-search-filters label { display:block; }
#product-search-filters select { width:100%; font-size:1em; }
.range-inputs { font-size:.9em; margin-top:1em; }
.range-inputs input { width:25%; font-size:.9em; }


/*------------------------------- RESPONSIVE */

@media (max-width: 975px) {

	.header-right { display: none; } 

}

@media (max-width: 875px) {
	.headMobileMenu { background: #0d4c88; border-radius: 3px; width: 30px; height: 25px; white-space: nowrap; padding-top: 5px; line-height: 0; position: absolute; top: 30px; right: 1.55em; display: block; margin: auto; }
	.headMobileMenu span.line { background: #fff; width: 20px; height: 4px; display: block; margin: 0 auto 4px auto; }
	.header-bottom > ul { background: #0d4c88; position: absolute; left: 0; right: 0; z-index: 99; display: none; }
	.header-bottom > ul.active { display: block; }
	.header-bottom > ul > li { display: block; width: 100%; }
	.header-bottom > ul > li > ul { position: relative; width: 100%; left: 0; right: 0; padding: 1.25em 0; }
	.header-bottom > ul > li > ul > li > a { padding: 5px 20px; }
	.header-bottom > ul > li > ul:after { right: 50%; }
	.header-bottom ul li ul.product-menu:hover { min-height: 0; padding-right: 0; }
	.header-bottom ul li ul.product-menu li:hover div { display: none; }
	.header-bottom > ul > li:hover > ul { display: none; }
	.header-bottom > ul > li.ddactive > ul { display: block; }
	.header-bottom > ul > li.ddactive > a:before { top: 2.5em; }
	.feature-content .content { margin-top: 20px; width: calc(100% - 20px); display: block; }
	.feature-content .news { margin-top: 20px; width: calc(100% - 20px); display: block; }
	.feature-brands ul { column-count: 2; }
	.banner-wrapper .title { font-size: 2em; }
	.banner-wrapper .line1 { font-size: 1em; }
	.banner-wrapper .line2 { font-size: .975em; }
	.brand-feature { display: block; width: calc(100% - 2%); }
	.brand-top.has-gallery, .brand-gallery { display: block; width: calc(100% - 2em); }
	.brand-top.has-gallery { float: none; }
	.brand-nav-desktop { display: none; }
	.brand-nav-mobile { display: block; position: absolute; bottom: 0; left: 0; right: 0; }
	.brand-nav-mobile > a { display: block; font-weight: 800; text-transform: uppercase; text-align: center; padding: 1em; color: #ffffff; background: #0d4c88; cursor: pointer; }
	.brand-nav-mobile > div { display: none; position: absolute; top: 3em; left: 0; right: 0; z-index: 3; background: #ffffff; border-top: 2px solid #939393 }
	.brand-nav-mobile > div > ul { padding: 0; margin: 0; list-style: none; }
	.brand-nav-mobile > div > ul > li { border-bottom: 1px solid #0d4c88; }
	.brand-nav-mobile > div > ul > li > a { display: block; padding: .875em 1em; text-decoration: none; background: #0d4c88; color: #ffffff; transition: background .3s, color .3s; }
	.brand-nav-mobile > div > ul > li > a:hover { background: #ffffff; color: #0d4c88; }
	.brand-nav-mobile.active > div { display: block; }
	.child-list > p { display: block; width: 100%; }
	.model-image-list p, .model-specs-list p { display: block; width: calc(100% - 2%); }
	/* drop specs view */
	.filters fieldset.specsToggle { display: none; }

	/* overwrite hide-element on mobile to force non-spec view on mobile*/
	.inner-container .model-image-list { display: block !important; }
	.inner-container .model-specs-list { display: none !important; }
	.model-gallery { float: none; }
	.model-specs-wrap, .model-gallery { display: block; width: calc(100% - 2%); }
	.footer-bottom > div { text-align: center; }
	.footer-bottom .content { width: calc(50% - 20px); }
	.footer-bottom .connect { width: calc(50% - 20px); }
	.footer-bottom > div > ul { display: block; width: 100%; margin-top: 40px; }
}

@media (max-width: 700px) {
	.footer-top > div .left, .footer-top > div .right { display: block; width: 100%; }

	/*gallery thumbs become unuseful at this point */
	.product-gallery .swiper-thumbs,
	.product-gallery .galThumbs-button-next,
	.product-gallery .galThumbs-button-prev { display: none; }


}

@media (max-width: 600px) {
	.feature-brands ul { column-count: 1; }
	.feature-quote p:nth-of-type(1) { font-size: 1.2em; }
	.feature-quote p:nth-of-type(2) { font-size: 1em; }
	.feature-quote p:nth-of-type(3) { font-size: .7375em; }
	.footer-bottom .content { display: block; width: calc(100% - 20px); }
	.footer-bottom .connect { display: block; width: calc(100% - 20px); }
	.footer-bottom > div > ul > li { display: block; width: calc(100% - 10px); margin-bottom: 30px; }
}

@media (max-width: 475px) {
	.header-top .header-logo { width: calc(100% - 4em); }
	.header-top .header-logo img { width: 100%; }
}
