﻿/* BEGIN RESET */
* {background:transparent; border:0; margin:0; padding:0; font-family: 'Montserrat', sans-serif; font-style:normal; -webkit-text-size-adjust: none;}
ol, ul, li {list-style: none; font-size:15px; line-height:25px;}
.clear {clear: both; height:0px; margin:0;}

h1 {font-size:32px;}
h2 {font-size:28px;}
h3 {font-size:24px; font-weight:700;}
h4 {font-size:18px; font-weight:700;}
p {font-size:16px; line-height:24px; margin-bottom:10px;}

a {text-decoration:none;}

/* BASIC STYLES */
#contentwrapper {width:90%; margin:0 auto; display: flex; justify-content: space-between; align-items:center; gap:20px 10px;flex-wrap: wrap;}
#pagewrap {width:75%; margin:2% auto;}

/* HEADER */
header {background: url(../siteart/headerbg.jpg) repeat; padding:1.5% 0;}
.logo {width:20%;}
.logo img {width:100%;}
.logo2 {width:20%;}
.logo2 img {width:100%;}

.headerright {text-align:right; font-size:16px; line-height:21px;}
.headerright a {color:#000;}

.headerbtn {float:right; background:#343434; color:#fff; text-align:center; width:275px; font-size:18px; font-weight:700; padding:7px 0; margin-top:1%;}
.headerbtn:hover {background:#ffd204;}
.headerbtn img {height:20px; display:inline-block; vertical-align:top; margin-top:1px;}


/* CONTENT STYLES */
.tagline {color:#000; font-size:16px; z-index:999999999; }
.btn-1 {border:2px solid #ffd204; color:#000; text-align:center; width:175px; font-size:18px; font-weight:700; padding:5px 0; margin-top:2%;}
.btn-1:hover {border:2px solid #000;}

.pageleft {float:left; width:45%; margin:2% 0;}
.pageright {float:right; width:50%; margin:2% 0;}
.pageright img {width:100%; padding:3px;}
.pageright a {color:#000;}
.pageright a:hover {color:#ffd204;}

.partsbtn {background:#ffd204; color:#fff; text-align:center; width:55%; font-size:24px; font-weight:700; padding:5px 0; margin-top:1%;}
.partsbtn:hover {background:#343434;}
.partsbtn img {height:25px; display:inline-block; vertical-align:top; margin-top:1px;}

.gap {height:285px;}

.productwrap {border-bottom:1px solid #000;}
.product {float:left; width:20%; margin:20px 0; padding:20px 0;}
.product img {width:100%;}
.producttext {float:right; width:78%; margin:40px 0; padding:20px 0;}

div.wrap-div-topSpacer {width: 0px; height: 60px; float: left;}
div.wrap-div {float: right; clear: both; margin: 0px 10px 0 0; width: 35%; padding-left:10px;}

.day {float:left; width:18%;}
.hours {float:left; width:40%; margin-left:1%;}

/* SIDEBAR */
.side {background:#fff; width: 300px; height: 520px; position: fixed; z-index: 9990;}

#fb {top: 275px;  right: -300px;  z-index: 99999999; transition: .3s ease-in;}
#fb:hover {right: 0px;}
.fb_iframe_widget {display: inline-block; position: relative;}
#facebookTab {display: block; height: 60px; width: 60px;  background: url(../siteart/icons/fbwidget.jpg); position: absolute; left: -60px; top: 200px;}
#facebookTab:hover {background: url(../siteart/icons/fbwidget_on.jpg); z-index: 99999999999; }
	
#facebookTab:hover #fb {right: 0px;}

#parts {top: 275px; right: -300px; z-index: 99999;}
#partstab {display: block; height: 60px; width: 60px;  background: url(../siteart/icons/nhwidget.jpg); position: absolute; left: -60px; top: 260px;}
#partstab:hover {background: url(../siteart/icons/nhwidget_on.jpg); z-index: 99999999999;}

.slideLeft {right: 0px !important;}
.slideRight {left: 0px !important;}

/* ICON BUTTONS */
#maininv {background:#e5e4e2;}
.homeinventory {width:32.8%; float:left; margin:.25%;}
.homeinventory img {width:100%;}

.hovereffect {width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default;}
.hovereffect .overlay {width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0;}

.hovereffect img {display: block; position: relative; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in;}
.hovereffect:hover img {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /><feGaussianBlur stdDeviation="3" /></filter></svg>#filter');
  filter: grayscale(1) blur(3px);
  -webkit-filter: grayscale(1) blur(3px);
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

.hovereffect a.info {display:inline-block; margin:4%; font-size:42px; font-weight:800; width:90%; height:70%; color:#fff; line-height:30px; padding-top:25%;}

/* MANU */
#manu {width:90%; margin:1.5% auto; text-align:center;}
#manu img {width:auto; height:65px; margin:2% .25%;}  

/* FOOTER */
footer {background:#343434; padding:1.5% 0; color:#fff;}
.footerleft {float:left; width:58%; border-right:1px solid #ffd204;}
.bottomnav {color:#ffd204; font-size:11px;}
.bottomnav a {color:#ffd204; font-size:11px;}
.bottomnav a:hover {color:#fff;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:11px; color:#fff;}
a.footerlink:hover {font-size:11px; color:#ffd204;}
.footertext{font-size:11px; color:#fff;}
.smallfootertext{font-size:11px; color:#fff;}
.divfooter {width:80%;}

.footerright {float:right; width:28%; color:#fff; font-size:12px;}
.footerright a {color:#fff!important;}
.footerright a:hover {color:#fff!important;}
.footerright img {width:3%; margin-top:10px;}

/************************************************ Responsive Styles **/
@media screen and (max-width: 1480px) and (min-width:1281px) {


.tagline {top:20px; right:300px;}

.hovereffect a.info {font-size:32px; padding-top:25%;}

.gap {height:0;}

.product {margin:10px 0; padding:10px 0;}
.producttext {margin:10px 0; padding:10px 0;}

.partsbtn {width:55%; font-size:18px; padding:5px 0; margin-top:1.5%;}
.partsbtn img {height:18px;}

#manu img {width:auto; height:50px; margin:2% .25%;}

.footerleft {width:60%;}
.bottomnav {font-size:10px;}
.bottomnav a {font-size:10px;}
.divfooter {width:90%;}
.footerright {margin-top:20px;}
}

@media screen and (max-width: 1280px) and (min-width:1025px) {
h1 {font-size:28px;}
h2 {font-size:22px;}
h3 {font-size:18px;}
p {font-size:14px; line-height:20px;}

.tagline {top:15px; right:300px; font-size:16px;}
.btn-1 {font-size:16px;}

#facebookTab {top: 50px;}
#partstab {top: 110px;}

.hovereffect a.info {font-size:32px; padding-top:25%;}

.product {margin:10px 0; padding:10px 0;}
.producttext {margin:10px 0; padding:10px 0;}

.partsbtn {width:60%; font-size:18px; padding:5px 0; margin-top:1.5%;}
.partsbtn img {height:18px;}

#manu img {width:auto; height:40px; margin:2% .25%;}

.footerleft {width:60%;}
.footerleft img {width:40%;}
.bottomnav {width:90%; font-size:10px;}
.bottomnav a {font-size:10px; line-height:16px;}
.divfooter {width:90%;}
.footerright {width:33%; margin-top:20px; font-size:11px;}
}

@media screen and (max-width: 1024px) and (min-width:768px) {
h1 {font-size:24px;}
h2 {font-size:18px;}
h3 {font-size:16px;}
p {font-size:14px; line-height:20px;}

.tagline {top:10px; right:225px; font-size:12px;}
.headerright {font-size:14px;}

.btn-1 {font-size:14px;}

#facebookTab {top: 50px;}
#partstab {top: 110px;}

#pagewrap {width:90%; margin:3% auto;}
.hovereffect a.info {font-size:28px; padding-top:25%;}

.gap {height:0;}

.product {margin:10px 0; padding:10px 0;}
.producttext {margin:10px 0; padding:10px 0;}

.partsbtn {width:85%; font-size:18px; padding:5px 0; margin-top:1.5%;}
.partsbtn img {height:18px;}

.day {width:32%;}
.hours {width:45%;}

#manu img {width:auto; height:40px; margin:2% .25%;}

.footerleft {width:60%;}
.footerleft img {width:40%;}
.bottomnav {width:90%; font-size:10px;}
.bottomnav a {font-size:10px; line-height:16px;}
.divfooter {width:90%;}
.footerright {width:33%; margin-top:20px; font-size:11px;}
}

@media screen and (max-width: 767px) and (min-width:551px) {
h1 {font-size:18px;}
h2 {font-size:16px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
p {font-size:12px; line-height:16px;}
header {padding-bottom:25px;}

.headerright {font-size:10px; line-height:14px; padding-top:5px;}
.tagline {top:15px; right:175px; font-size:10px;}

.btn-1 {font-size:12px; width:100px;}

#facebookTab {display:none;}
#partstab {display:none;}

#pagewrap {width:90%; margin:3% auto;}
.hovereffect a.info {font-size:20px; padding-top:25%;}

.gap {height:0;}

.product {float:none; width:50%; margin:10px auto 0; padding:10px 0 0;}
.producttext {float:none; width:100%; margin:0 0 10px; padding:0 0 10px;}

.partsbtn {width:100%; font-size:16px; padding:5px 0; margin-top:3%;}
.partsbtn img {height:15px;}

.day {width:34%;}
.hours {width:65%;}

#manu img {width:auto; height:30px; margin:2% .25%;}

.footerleft {width:60%;}
.footerleft img {width:60%;}
.bottomnav {width:90%; font-size:9px;}
.bottomnav a {font-size:9px; line-height:13px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}
.divfooter {width:95%;}
.footerright {width:35%; margin-top:20px; font-size:10px;}
}
@media screen and (max-width:1060px)  {
    .logo, .logo2 {
        width:18%;
    }
}

@media screen and (max-width:600px)  {

.headerright {width:100%; font-size:11px; line-height:16px; text-align:center;}
.btn-1 {margin:0 auto;}
.tagline {position:relative; top:0; left:0;margin:0 auto; font-size:10px; width:100%; text-align:center;}
}

@media screen and (max-width: 550px) and (min-width:381px) {
h1 {font-size:15px;}
h2 {font-size:13px;}
h3 {font-size:13px;}
h4 {font-size:13px;}
p {font-size:12px; line-height:16px;}
header {padding:2% 0 2%;}

.headerright {width:100%; font-size:11px; line-height:16px; text-align:center;}
.btn-1 {margin:0 auto;}
.tagline {position:relative; top:0; left:0;margin:0 auto; font-size:10px; width:100%; text-align:center;}

.btn-1 {font-size:10px; width:100px; padding:3px 0;}
.headerbtn {font-size:9px; width:135px;}
.headerbtn img {height:9px;}

#facebookTab {display:none;}
#partstab {display:none;}

#pagewrap {width:90%; margin:3% auto;}
.homeinventory {width:49.5%; float:left; margin:.25%;}
.hovereffect a.info {font-size:16px; padding-top:25%;}

.gap {height:0;}

.pageleft {float:none; width:100%; margin:5% auto 1%;}
.pageright {float:none; width:100%; margin:1% auto 5%;}

.product {float:none; width:65%; margin:10px auto 0; padding:10px 0 0;}
.producttext {float:none; width:100%; margin:0 0 10px; padding:0 0 10px;}

.partsbtn {width:75%; font-size:16px; padding:5px 0; margin:3% 0 3%;}
.partsbtn img {height:15px;}

.day {width:30%;}
.hours {width:50%;}

#manu img {width:auto; height:25px; margin:1.5% .25%;}

.footerleft {float:none; width:100%; border-right:none; padding-bottom:10px; border-bottom:1px solid #ffd204;}
.footerleft img {width:50%;}
.bottomnav {width:100%; font-size:9px;}
.bottomnav a {font-size:9px; line-height:13px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}
.divfooter {width:100%;}
.footerright {float:none; width:100%; margin:10px 0; font-size:10px;}
}
@media screen and (max-width:580px)  {
    .logo, .logo2 {
        width:47%;
    }
    .logo img, .logo2 img {
        margin:0 auto;
    }
}

@media screen and (max-width:380px)  {
h1 {font-size:15px;}
h2 {font-size:13px;}
h3 {font-size:13px;}
h4 {font-size:13px;}
p {font-size:12px; line-height:16px;}
header {padding:2% 0 2%; text-align:center;}

.headerright {float:none; width:90%; font-size:11px; line-height:16px; text-align:center;}
.tagline {position:relative; top:0; left:0;margin:0 auto; font-size:10px; width:100%; text-align:center;}
.btn-1 {font-size:10px; width:100px; padding:3px 0; margin:0 auto;}
.headerbtn {font-size:9px; width:100%;}
.headerbtn img {height:9px;}

#facebookTab {display:none;}
#partstab {display:none;}

#pagewrap {width:90%; margin:5% auto;}
.homeinventory {width:100%; float:none; margin:0%;}
.hovereffect a.info {font-size:16px; padding-top:25%;}

.gap {height:0;}

.pageleft {float:none; width:100%; margin:5% auto 1%;}
.pageright {float:none; width:100%; margin:1% auto 5%;}

.product {float:none; width:100%; margin:10px 0 0; padding:10px 0 0;}
.producttext {float:none; width:100%; margin:0 0 10px; padding:0 0 10px;}

.partsbtn {width:100%; font-size:12px; padding:5px 0; margin:1.5% auto 3%;}
.partsbtn img {height:10px;}

.day {width:35%; font-size:10px !important;}
.hours {width:64%; font-size:10px !important;}

#manu img {width:auto; height:20px; margin:1.5% .25%;}

.footerleft {float:none; width:100%; border-right:none; padding-bottom:10px; border-bottom:1px solid #ffd204;}
.footerleft img {width:50%;}
.bottomnav {width:100%; font-size:9px;}
.bottomnav a {font-size:9px; line-height:13px;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{font-size:10px;}
a.footerlink:hover {font-size:10px;}
.footertext{font-size:10px;}
.smallfootertext{font-size:10px;}
.divfooter {width:100%;}
.footerright {float:none; width:100%; margin:10px 0; font-size:10px;}
}
