/* General styles */
.home h2 {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 60px;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.home h3 {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 32px;
  line-height: 1.3;
  text-transform: uppercase;
}
.home button {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 18px;
  text-transform: uppercase;
  text-decoration: none;
}
.home p {
  font-family: "Benton Sans", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 15px;
  line-height: 1.4;
  margin: 0;
}
.home a p,
.home p a {
  color: #343434;
}

/* Fillslot 1 */

.main-banner {
  position: relative;
  /* margin: -1px -72px 20px -71px; */
  margin: -1px -72px 10px -71px; /* Only use with Holiday Banner */
}

.main-banner > h1 {
  opacity: 1;
  color: #fff;
  font-family: "Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 78px;
  text-align: left;
  position: absolute;
  top: 0px;
  left: 20px;
  right: auto;
  width: 960px;
  text-transform: uppercase;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-shadow: 0 0 2px rgba(0, 0, 0, 0.75);
}

.main-banner > h1 br {
  display: none;
}
.main-banner > p.subhead br {
  display: none;
}
.main-banner > p.subhead {
  opacity: 1;
  color: #fff;
  font-family: "Libre Baskerville", "Times New Roman", "Times", "serif";
  font-size: 30px;
  text-transform: none;
  line-height: 1.35em;
  letter-spacing: 0;
  position: absolute;
  top: 105px;
  left: 20px;
  right: auto;
  width: 660px;
  text-align: left;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}

.main-banner button {
  cursor: pointer;
  text-align: center;
  padding: 0;
  font-weight: normal;
  border-radius: 4px;
  background: #ec0928;
  color: #fff;
  height: 45px;
  letter-spacing: 0.02em;
  border: none;
  outline: none;
  position: absolute;
  top: 155px;
  width: 140px;
  left: 20px;
  right: auto;
  line-height: 0.5em;
}

.main-banner img.caricon {
  position: absolute;
  top: 425px;
  margin-left: 50%;
  left: -62px;
}
.main-banner-carousel-wrapper h4 {
  font-family: "Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 38px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #ec0928;
  display: inline-block;
  vertical-align: middle;
  width: 100%;
}
.main-banner-carousel-wrapper h4 span {
  font-size: 20px;
  color: #343434;
  display: block;
}
.main-banner-carousel-wrapper .leftlink,
.main-banner-carousel-wrapper .rightlink {
  font-family: "Benton Sans", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 14px;
  display: inline-block;
  vertical-align: middle;
  text-transform: uppercase;
  width: 33%;
}
.main-banner-carousel-wrapper .leftlink a,
.main-banner-carousel-wrapper .rightlink a {
  color: #343434;
}
.main-banner-carousel-wrapper .leftlink {
  text-align: left;
}
.main-banner-carousel-wrapper .rightlink {
  text-align: right;
}
.main-banner-carousel-wrapper .leftlink a:before {
  content: url(/text/content/homepage/images/previous-next_chevron.png);
  padding-right: 12px;
  top: 3px;
  position: relative;
}
.main-banner-carousel-wrapper .rightlink a:after {
  content: url(/text/content/homepage/images/previous-next_chevron.png);
  padding-right: 12px;
  top: -3px;
  position: relative;
  transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  display: inline-block;
}
.home .slick-slide img {
  width: 150px;
  margin: 0 auto;
}
.home .slick-prev:before,
.home .slick-next:before {
  content: url(/text/content/homepage/images/previous-next_chevron.png);
  top: -40px;
  position: relative;
  font-family: "Benton Sans", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
}
.home .slick-next:before {
  transform: rotate(180deg);
  display: inline-block;
}
.home h5 {
  font-family: "Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 15px;
  line-height: 1.4;
  color: #343434;
  text-transform: uppercase;
  margin-bottom: 0px;
}
.home h5 span {
  white-space: nowrap;
}
.home h5 span:after {
  font-family: "FontAwesome";
  content: " \f0da";
  font-size: 16px;
  color: #ec0928;
  padding-left: 8px;
}
#home_5_fillslots-1 a p {
  padding: 0 10px;
}
.home .slick-slide a {
  text-align: center;
}

/* --------------------------------------------------------------------------------- */
/* ---------------------BLACK FRIDAY/CYBER MONDAY/HOLIDAY STYLES-------------------- */
/* --------------------------------------------------------------------------------- */



/* --------------------------------------------------------------------------------- */
/* ------------------END BLACK FRIDAY/CYBER MONDAY/HOLIDAY STYLES------------------- */
/* --------------------------------------------------------------------------------- */

/*Holiday shipping cut-off banner*/
.span-full {
	position: relative;
	padding: 10px;
	margin: -1px -72px 20px -71px;
	top: -9px;
	text-align: center;
	}

.shipping { background: #141E30;  /* fallback for old browsers */
            background: -webkit-linear-gradient(to bottom, #243B55, #141E30);  /* Chrome 10-25, Safari 5.1-6 */
            background: linear-gradient(to bottom, #243B55, #141E30); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
            /* padding:30px 10px; */
            text-align:center;
            line-height:1.75em;
            overflow: hidden;
          }

.shipping-bold {
	font-family: "Benton Sans Cond",'Helvetica Neue','Helvetica','Arial','sans-serif';
    	font-size: 18px;
    	line-height: 1.4;
    	color: #ffffff;
    	text-transform: uppercase;
    	margin-bottom: 0px;
    	margin-top: 30px;
}
.shipping-subhead {
	font-family: "Benton Sans",'Helvetica Neue','Helvetica','Arial','sans-serif';
      font-size: 17px;
      text-transform: uppercase;
    	line-height: 1.5;
    	color: #ffffff;
      margin-bottom: 30px;
}
/*End Holiday shipping cut-off banner*/

.spring-essentials-wrapper {
  margin: 63px -15px 0 -15px;
}
.spring-essentials {
  width: 49%;
  margin-right: 1%;
  /* display: inline-block; */
  float: left;
  position: relative;
  background-image: url(/text/content/homepage/images/20210316-home-springessentials-bkgrd.jpg);
  background-position: center;
  height: 605px;
  cursor: pointer;
}
.spring-essentials h2 {
  color: #888888;
  text-align: left;
  font-size: 50px;
  position: absolute;
  top: 14px;
  left: 21px;
  width: 90%;
  line-height: 1.1;
}
.spring-essentials button {
  cursor: pointer;
  text-align: center;
  padding: 0;
  font-weight: normal;
  border-radius: 3px;
  background: #ec0928;
  color: #fff;
  height: 49px;
  font-size: 30px;
  letter-spacing: 0.02em;
  border: none;
  outline: none;
  position: absolute;
  top: 468px;
  width: 310px;
  margin-left: 50%;
  left: -155px;
}
.mid-page-nav-wrapper {
  width: 49%;
  margin-left: 1%;
  /* display: inline-block; */
  float: right;
}
.mid-page-nav-wrapper .wash-and-detail {
  background: #f5f5f5;
  border-top: 1px solid #d6d6d6;
  height: 143px;
  position: relative;
  padding: 45px 0 0 20px;
}
.mid-page-nav-wrapper .polish-and-wax {
  background: #f5f5f5;
  border-top: 1px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  height: 154px;
  position: relative;
  padding: 36px 0 0 162px;
}
.mid-page-nav-wrapper .buffers-and-pads {
  background: #f5f5f5;
  height: 154px;
  position: relative;
  padding: 34px 0 0 27px;
}
.mid-page-nav-wrapper .garage-and-more {
  background: #f5f5f5;
  border-top: 1px solid #d6d6d6;
  border-bottom: 1px solid #d6d6d6;
  height: 154px;
  position: relative;
  padding: 36px 0 0 222px;
}
.mid-page-nav-wrapper h4 {
  font-family: "Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 34px;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #ec0928;
  display: block;
  /* vertical-align: middle; */
  margin: 0;
  margin-bottom: 8px;
}
.mid-page-nav-wrapper .wash-and-detail a img {
  position: absolute;
  top: -50px;
  right: -15px;
}
.mid-page-nav-wrapper .polish-and-wax a img.polishes1 {
  position: absolute;
  top: -27px;
  left: 23px;
}
.mid-page-nav-wrapper .polish-and-wax a img.polishes2 {
  position: absolute;
  top: -28px;
  left: 78px;
}
.mid-page-nav-wrapper .buffers-and-pads a img {
  position: absolute;
  top: -27px;
  right: -28px;
}
.mid-page-nav-wrapper .garage-and-more a img {
  position: absolute;
  top: -48px;
  left: 16px;
}
/* Fillslot 3 */

.richard-tips-wrapper {
  /*height: 1056px;*/
  height: 1140px;
  clear: both;
  overflow: hidden;
  margin-left: -10000px;
  margin-right: -10000px;
  padding-left: 10000px;
  padding-right: 10000px;
}
.richard-tips-wrapper a p {
  text-decoration: underline;
}
.richard-tips-background {
  height: 647px;
  background-color: #f6f8f8;
  background: -webkit-gradient(linear, 0 0, 0 100%, from(#f6f8f8), to(#fff));
  background: -webkit-linear-gradient(top, #f6f8f8, #fff);
  background: -moz-linear-gradient(to bottom, #f6f8f8, #fff);
  background: -ms-linear-gradient(top, #f6f8f8, #fff);
  background: -o-linear-gradient(top, #f6f8f8, #fff);
  margin-left: -10000px;
  margin-right: -10000px;
  z-index: 1;
  position: relative;
  top: 293px;
}
.bubbles-brush-wrapper {
  position: relative;
  z-index: 2;
  top: -632px;
}
.bubbles-brush-wrapper .bubbles-left {
  position: absolute;
  left: -220px;
}
.bubbles-brush-wrapper .bubbles-right {
  position: absolute;
  top: 15px;
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
  right: -97px;
}
.bubbles-brush-wrapper .brush {
  position: absolute;
  right: -780px;
}
.aocc-wrapper {
  z-index: 2;
  position: relative;
  top: -610px;
  margin-left: -22px;
  margin-right: -22px;
}
.aocc-featured {
  position: absolute;
  top: 365px;
  left: 55px;
  text-align: center;
}

.richard-tips-wrapper p.bold {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  text-transform: uppercase;
}
.richard-tips-wrapper p.grey {
  color: #343434;
}
.richard-and-tips-wrapper {
  z-index: 2;
  position: relative;
  top: -597px;
}
.richard-wrapper {
  position: absolute;
  top: 23px;
  left: -69px;
  width: 530px;
}

.richard-sig img {
  left: -24px;
  position: absolute;
}
.richard-sig p.bold.grey {
  padding-top: 45px;
}
.tips-wrapper {
  width: 50%;
  float: right;
}
.tips-wrapper h3 {
  width: 100%;
}
.tips-list-md-sm {
  display: block;
}
.tips-list-xs {
  display: none;
}
.tips-wrapper .number-tips {
  clear: both;
  padding-bottom: 15px;
}
.tips-wrapper .number {
  border-radius: 20px;
  height: 31px;
  background: #000;
  border: none;
  width: 31px;
  float: left;
  text-align: center;
  padding-top: 7px;
  margin-top: 3px;
}
.tips-wrapper .number span {
  color: #fff;
  font-size: 15px;
  line-height: 1.15em;
  text-align: center;
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
}
.tips-wrapper .tips {
  /* display: inline-block; */
  float: right;
  width: 88%;
  padding: 0 20px 20px 0;
}
.tips-wrapper .tips strong {
  font-family: "Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 17px;
}
.tips-wrapper .tips-links {
  clear: both;
  float: none;
  text-align: center;
  width: 100%;
}
.tips-wrapper .learn-more {
  cursor: pointer;
  text-align: center;
  height: 35px;
  letter-spacing: 0.02em;
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 18px;
  text-transform: uppercase;
  text-decoration: none;
}
.tips-wrapper .learn-more a {
  color: #ec0928;
}
.tips-wrapper .learn-more:after {
  font-family: "FontAwesome";
  content: " \f0da";
  font-size: 18px;
  color: #ec0928;
  padding-left: 7px;
  transform: scale(1.75, 1);
  -webkit-transform: scale(1.75, 1);
  display: inline-block;
}

/* Fillslot 4 */

.visit-griots-garage-wrapper {
  background: url(/text/content/homepage/images/home-visitgarage-bkgrd.jpg);
  height: 449px;
  margin: 0 -69px;
  position: relative;
  clear: both;
}

.visit-griots-garage-wrapper .dark-background {
  width: 50%;
  height: 449px;
  background-color: rgba(0, 0, 0, 0.6);
  text-align: center;
  display: flex;
  align-items: center;
}
.visit-griots-garage-wrapper h3 {
  color: #fff;
  margin-top: 40px;
  padding: 0 0 12px 0;
}
.visit-griots-garage-wrapper p {
  color: #fff;
  padding: 20px 40px;
}
.visit-griots-garage-wrapper a p {
  color: #fff;
  text-decoration: underline;
}
.visit-griots-garage-wrapper img.car-inset {
  position: absolute;
  left: 690px;
  top: 260px;
  z-index: 2;
}
.visit-griots-garage-wrapper img.bubbles-left {
  position: absolute;
  left: -32px;
  top: 14px;
}
.visit-griots-garage-wrapper img.bubbles-right {
  position: absolute;
  right: -42px;
  top: 28px;
}
.visit-griots-garage-wrapper div.pluslink-bkgrd {
  position: absolute;
  border-radius: 12px;
  height: 25px;
  background: #fff;
  border: none;
  width: 25px;
  left: 875px;
  top: 278px;
  z-index: 3;
}
.visit-griots-garage-wrapper div.pluslink-bkgrd div.pluslink-vert {
  background: #00aeef;
  text-align: center;
  left: 11px;
  top: 5px;
  position: absolute;
  height: 15px;
  width: 3px;
}
.visit-griots-garage-wrapper div.pluslink-bkgrd div.pluslink-horiz {
  background: #00aeef;
  text-align: center;
  left: 5px;
  position: absolute;
  height: 3px;
  width: 15px;
  top: 11px;
}

/*================ Digital Catalog ================*/
.visit-griots-garage-digital-catalog {
  background: url(/text/content/homepage/images/home-digitalcatalog-bkgrd-496.jpg);
  height: 449px;
  /* margin: 0 -69px; */
  margin: 50px -15px 0;
  position: relative;
  clear: both;
}
.visit-griots-garage-digital-catalog .dark-background {
  width: 50%;
  height: 449px;
  background-color: rgba(0, 0, 0, 0.6);
  text-align: center;
  display: flex;
  align-items: center;
}
.visit-griots-garage-digital-catalog h2.dc {
  color: #fff;
  margin: 0;
  padding: 0;
  line-height: 1em;
  font-weight: lighter;
  font-size: 30px;
  font-family: "Benton Sans", "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
  display: inline-block;
}
.visit-griots-garage-digital-catalog h3.dc {
  color: #fff;
  margin: 0;
  padding: 5px 0 10px;
  line-height: 1em;
  font-size: 45px;
  width: 100%;
}
img.dc {
  width:280px;
  padding:0 0 20px;
}
.visit-griots-garage-digital-catalog p {
  color: #fff;
  padding: 20px 40px;
}
.visit-griots-garage-digital-catalog a p {
  color: #fff;
  text-decoration: underline;
}
.visit-griots-garage-digital-catalog img.car-inset {
  position: absolute;
  left: 690px;
  top: 260px;
  z-index: 2;
}
.visit-griots-garage-digital-catalog img.bubbles-left {
  position: absolute;
  left: -32px;
  top: 14px;
}
.visit-griots-garage-digital-catalog img.bubbles-right {
  position: absolute;
  right: -42px;
  top: 28px;
}
.visit-griots-garage-digital-catalog div.pluslink-bkgrd {
  position: absolute;
  border-radius: 12px;
  height: 25px;
  background: #fff;
  border: none;
  width: 25px;
  left: 875px;
  top: 278px;
  z-index: 3;
}
.visit-griots-garage-digital-catalog div.pluslink-bkgrd div.pluslink-vert {
  background: #00aeef;
  text-align: center;
  left: 11px;
  top: 5px;
  position: absolute;
  height: 15px;
  width: 3px;
}
.visit-griots-garage-digital-catalog div.pluslink-bkgrd div.pluslink-horiz {
  background: #00aeef;
  text-align: center;
  left: 5px;
  position: absolute;
  height: 3px;
  width: 15px;
  top: 11px;
}

.visit-griots-garage-digital-catalog a.catalog-button {
  background: #ec0928;
  color:white !important;
  padding:15px 20px;
  border-radius:3px;
  font-family:"Benton Sans Cond", "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
  font-size: 16px;
  text-transform: uppercase;
  color:white !important;
}

.visit-griots-garage-digital-catalog a.catalog-button:hover {
  color:white !important;
}

.visit-griots-garage-digital-catalog a.catalog-button:visited {
  color:white !important;
}


/* //Digital Catalog */

.driven-to-perfection-wrapper {
  background: url(/text/content/homepage/images/20180611_home-car-care-for-the-perfectionist-background.jpg);
  height: 446px;
  margin: 0 -69px;
  display: flex;
  align-items: center;
  text-align: center;
  border-bottom: 1px solid #d6d6d6;
  clear: both;
}
.driven-to-perfection-wrapper > div {
  margin: 0 auto;
}
.driven-to-perfection-wrapper img {
  margin-top: 20px;
}
.driven-to-perfection-wrapper p {
  padding: 0 40px 22px 40px;
}
.driven-to-perfection-wrapper a p {
  text-decoration: underline;
  display: block;
}
.visit-griots-garage-digital-catalog h3 br {
  display: none;
}
.title-color {
  color: #ec0928;
}
/* Fillslot 5 */
.quiz-cars-we-love-wrapper {
  margin: 20px;
  clear: both;
  height: 304px;
}
.quiz-box {
  width: 28%;
  float: left;
  background: #e7e7e7;
  height: 304px;
  display: flex;
  align-items: center;
  padding: 20px;
}
.quiz-box > div {
  width: 100%;
}
.quiz-box .quiz-header {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 20px;
  line-height: 1.3;
  text-transform: uppercase;
  text-align: center;
  padding-bottom: 18px;
  margin-bottom: 22px;
  border-bottom: 1px solid #d6d6d6;
  display: block;
  color: #000;
}
.quiz-box form {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 20px;
  line-height: 1.3;
  text-transform: uppercase;
  padding: 0 0 20px 40px;
  display: block;
  color: #000;
}
.quiz-box input[type="radio"] {
  display: none;
}
.quiz-box input[type="radio"] + label span.button {
  display: inline-block;
  width: 12px;
  height: 12px;
  background: #fff;
  border: solid #fff 3px;
  border-radius: 6px;
  margin: 0 22px 16px 0;
}
.quiz-box input[type="radio"]:checked + label span.button {
  background: #28a6f6;
}
.quiz-box input[type="radio"] + label span.label {
  display: inline-block;
  font-size: 20px;
  color: #000;
  position: relative;
  top: -13px;
  padding: 0;
}
.quiz-box #answer-correct,
.quiz-box #answer-incorrect {
  font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica", "Arial",
    "sans-serif";
  font-size: 20px;
  line-height: 1.3;
  text-transform: uppercase;
  text-align: center;
  display: block;
}
.quiz-box #answer-correct {
  color: #28a6f6;
}
.quiz-box #answer-incorrect {
  color: #ec0928;
}
.cars-we-love-box {
  width: 64%;
  margin: 10px 0 0 6%;
  float: left;
}
.cars-we-love-box h3,
.cars-we-love-box p {
  display: inline-block;
}
.cars-we-love-box h3 {
  width: 48%;
  padding: 0;
  text-align: left;
}
.cars-we-love-box p.cars-we-love {
  width: 51%;
  margin-right: -30px;
}
.cars-we-love-box p a {
  text-decoration: underline;
}
.cars-we-love-box .car-pictures {
  display: block;
  margin-top: 20px;
}
.cars-we-love-box .car1,
.cars-we-love-box .car2,
.cars-we-love-box .car3 {
  width: 28%;
  display: inline-block;
  vertical-align: top;
  text-align: center;
}
.cars-we-love-box .car-pictures p {
  margin-top: 20px;
  display: block;
}
.cars-we-love-box .divider1,
.cars-we-love-box .divider2 {
  width: 6%;
  display: inline-block;
}
.quiz-cars-bottom-border {
  background: #d6d6d6;
  height: 1px;
  margin: 0 -69px;
  clear: both;
}
@media only screen and (max-width: 991px) {
  /* General styles */

  .home h2 {
    font-size: 38px;
  }
  .home h3 {
    font-size: 34px;
  }

  /* Fillslot 1 */

  .main-banner {
    position: relative;
    margin: 15px 0 20px 0;
  }
  .main-banner > h1 {
    font-size: 57px;
    top: 0vw;
    left: 20px;
    right: auto;
    width: 700px;
    text-align: left;
  }

  .main-banner > p.subhead {
    font-size: 25px;
    top: 11vw;
    left: 20px;
    right: auto;
    width: 600px;
    text-align: left;
  }
  .main-banner button {
    top: 16vw;
    left: 20px;
    right: auto;
  }
  .main-banner img.caricon {
    top: 272px;
  }
  #home_5_fillslots-1 h4 {
    width: 100%;
  }
  .home .leftlink,
  .home .rightlink {
    display: none;
  }
  .home .carousel-container {
    margin-left: 15px;
    margin-right: 15px;
  }

  /*Holiday shipping cut-off banner*/
  .shipping {
    position: relative;
    margin: 15px 0 20px 0;
  }

  /* Fillslot 2 */

  .mid-page-nav-wrapper h4 {
    font-size: 24px;
  }
  .spring-essentials h2 {
    top: 49px;
  }
  .spring-essentials button {
    top: 349px;
  }

  /* Fillslot 3 */

  .aocc-featured {
    top: 296px;
    right: 101px;
  }

  .bubbles-brush-wrapper .brush {
    display: none;
  }
  .tips-wrapper .tips {
    padding: 0 0 20px 0;
  }
  .richard-wrapper {
    left: 0px;
    height: 300px;
    width: 338px;
  }
  .richard-sig {
    top: 330px;
    left: 121px;
  }
  .richard-tips-wrapper {
    height: 996px;
  }

  /* Fillslot 4 */
  .visit-griots-garage-wrapper img.car-inset {
    left: 490px;
  }
  .visit-griots-garage-wrapper .pluslink {
    left: 675px;
  }
  .visit-griots-garage-wrapper {
    margin: 0;
  }
  .driven-to-perfection-wrapper {
    margin: 0;
  }
  .visit-griots-garage-wrapper h3 br {
    display: block;
  }

  /* Digital Catalog */
  .visit-griots-garage-digital-catalog img.car-inset {
    left: 490px;
  }
  .visit-griots-garage-digital-catalog .pluslink {
    left: 675px;
  }
  .visit-griots-garage-digital-catalog {
    margin: 0;
  }
  .driven-to-perfection-wrapper {
    margin: 0;
  }
  .visit-griots-garage-digital-catalog h3 br {
    display: block;
  }
  /* //Digital Catalog */

  /* Fillslot 5 */
  .quiz-cars-we-love-wrapper {
    margin: 20px 0;
  }
  .quiz-box .quiz-header {
    font-size: 16px;
  }
  .quiz-box form {
    padding: 0 0 20px 25px;
  }
  .quiz-box input[type="checkbox"] + label span.label {
    font-size: 16px;
  }
  .quiz-box #answer-correct,
  .quiz-box #answer-incorrect {
    font-size: 16px;
  }
  .cars-we-love-box h3 {
    width: 100%;
    text-align: center;
    display: block;
  }
  .cars-we-love-box p.cars-we-love {
    width: 100%;
    text-align: center;
    display: block;
  }

  @media only screen and (max-width: 767px) {
    /* Fillslot 1 */

    .main-banner {
      margin: 15px -15px 21px -15px;
    }
    .main-banner img {
      height: 100%;
      margin-right: -50%;
      width: 100%;
      max-width: none;
    }
    .main-banner > h1 {
      font-size: 40px;
      text-align: left;
      left: 2vw;
      right: auto;
      top: auto;
      bottom: 42vw;
      width: 100%;
    }
    .main-banner > p.subhead {
      font-size: 21px;
      line-height: inherit;
      text-align: left;
      left: 2vw;
      right: auto;
      top: auto;
      bottom: 38vw;
      width: 500px;
      text-shadow: 0 1px 5px rgba(0, 0, 0, 0.75);
    }
    .main-banner > h1 br {
      display: block;
    }
    .main-banner > p.subhead br {
      display: block;
    }
    .main-banner button {
      height: 35px;
      left: 2vw;
      right: auto;
      top: auto;
      bottom: 30vw;
    }
  }
  .main-banner img.caricon {
    height: auto;
    width: auto;
    max-width: none;
    top: 293px;
  }

  /*Holiday shipping cut-off banner*/
  .shipping {
    margin: 15px -15px 21px -15px;
  }

  .shipping-subhead {
    font-size: 17px;
  }

  #home_5_fillslots-1 h4 {
    font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica",
      "Arial", "sans-serif";
    font-size: 32px;
  }
  #home_5_fillslots-1 h4 span {
    font-family: "Benton Sans Cond Black", "Helvetica Neue", "Helvetica",
      "Arial", "sans-serif";
    font-size: 16px;
  }

  /* Fillslot 2 */

  #home_5_fillslots-2 {
    margin: 0 -15px 0 -15px;
  }
  .spring-essentials {
    width: 100%;
    margin-right: 0;
    height: 380px;
    background-repeat: no-repeat;
    background-image: url(/text/content/homepage/images/20210316-home-springessentials-bkgrd-sm.jpg);
  }

  .mid-page-nav-wrapper {
    width: 100%;
    margin-left: 0;
  }
  .spring-essentials h2 {
    top: 2px;
    right: 24px;
    left: 34px;
    text-align: left;
    font-size: 34px;
  }
  .spring-essentials button {
    top: 322px;
    left: -189px;
    width: 220px;
    height: 39px;
    font-size: 20px;
  }
  .mid-page-nav-wrapper .wash-and-detail a img {
    position: absolute;
    top: auto;
    left: 57vw;
    width: auto;
    height: 38vw;
    bottom: 10px;
  }
  .mid-page-nav-wrapper .polish-and-wax a img.polishes1 {
    display: none;
  }
  .mid-page-nav-wrapper .polish-and-wax a img.polishes2 {
    position: absolute;
    top: auto;
    left: 8vw;
    width: auto;
    height: 33vw;
    bottom: 0px;
  }
  .mid-page-nav-wrapper .buffers-and-pads a img {
    position: absolute;
    top: auto;
    left: 59vw;
    width: auto;
    height: 33vw;
    bottom: 10px;
  }
  .mid-page-nav-wrapper .polish-and-wax {
    padding: 36px 0 0 28vw;
  }
  .mid-page-nav-wrapper .wash-and-detail {
    height: 173px;
    padding: 6vw 0 0 7vw;
  }
  .mid-page-nav-wrapper .polish-and-wax {
    height: 173px;
    padding: 6vw 0 0 30vw;
  }
  .mid-page-nav-wrapper .buffers-and-pads {
    height: 173px;
    padding: 7vw 0 0 7vw;
  }
  /* Fillslot 3 */

  .richard-tips-background {
    display: none;
  }
  .tips-list-md-sm {
    display: none;
  }
  .tips-list-xs {
    display: block;
  }
  .aocc-wrapper {
    display: none;
  }
  .bubbles-brush-wrapper {
    display: none;
  }
  .richard-and-tips-wrapper {
    top: 0;
  }
  .richard-wrapper {
    background-image: url(/text/content/homepage/images/home-richard-xs.jpg);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 89px 101px;
    height: 121px;
    float: none;
    position: relative;
    width: 100%;
    top: 20px;
    left: 0;
    display: none;
  }
  .richard-sig {
    display: none;
  }
  .tips-wrapper {
    width: 100%;
    float: none;
  }
  .tips-wrapper .number {
    float: none;
    margin: 3px auto 0 auto;
  }
  .tips-list-xs .carousel-container {
    margin-left: auto;
    margin-right: auto;
    width: 260px;
  }
  .tips-wrapper .tips {
    display: block;
    float: none;
    padding: 0;
    text-align: center;
    width: 100%;
    padding: 0 20px;
  }
  .tips-wrapper .tips strong {
    display: block;
    padding: 10px 0;
  }
  .tips-wrapper button:after {
    font-size: 1px;
    color: #fff;
  }
  .tips-wrapper button:after:hover {
    font-size: 1px;
    background: #fff;
  }
  .tips-links {
    display: block;
  }
  .richard-tips-wrapper {
    height: 600px;
  }
  .tips-wrapper .learn-more:after {
    display: none;
  }
  .tips-list-xs .slick-prev,
  .tips-list-xs .slick-next {
    margin-top: 26px;
  }
  /* Fillslot 4 */

  .visit-griots-garage-wrapper img.car-inset {
    display: none;
  }
  .visit-griots-garage-wrapper .pluslink {
    display: none;
  }
  .visit-griots-garage-wrapper {
    height: 378px;
    margin: 0 -15px;
    background-position: -450px center;
    background-size: 320%;
  }
  .visit-griots-garage-wrapper .dark-background {
    width: 100%;
    height: 378px;
  }
  .visit-griots-garage-wrapper h3 br {
    display: block;
  }
  .visit-griots-garage-wrapper p {
    padding: 10px 40px;
  }
  .visit-griots-garage-wrapper h3 {
    margin-top: 0;
  }
  .driven-to-perfection-wrapper {
    margin: 0 -15px;
    height: 328px;
    background-position: 10% 50%;
    background-size: 270%;
  }
  .driven-to-perfection-wrapper p br {
    display: none;
  }
  .visit-griots-garage-wrapper h3 br {
    display: none;
  }

  /* Digital Catalog */
  .visit-griots-garage-digital-catalog img.car-inset {
    display: none;
  }
  .visit-griots-garage-digital-catalog .pluslink {
    display: none;
  }
  .visit-griots-garage-digital-catalog {
    height: 378px;
    margin: 0 -15px;
    background-position: -450px center;
    background-size: 320%;
  }
  .visit-griots-garage-digital-catalog .dark-background {
    width: 100%;
    height: 378px;
  }
  .visit-griots-garage-digital-catalog h3 br {
    display: block;
  }
  .visit-griots-garage-digital-catalog p {
    padding: 10px 40px;
  }
  .visit-griots-garage-digital-catalog h3 {
    margin-top: 0;
  }
  .driven-to-perfection-wrapper {
    margin: 0 -15px;
    height: 328px;
    background-position: 10% 50%;
    background-size: 270%;
  }
  .driven-to-perfection-wrapper p br {
    display: none;
  }
  .visit-griots-garage-digital-catalog h3 br {
    display: none;
  }
  /* //Digital Catalog */


  /* Fillslot 5 */

  .quiz-box .quiz-header {
    font-size: 20px;
  }
  .quiz-box form {
    padding: 0 0 20px 25%;
  }
  .quiz-box input[type="checkbox"] + label span.button {
    margin: 0 12% 16px 0;
  }
  .quiz-box input[type="checkbox"] + label span.label {
    font-size: 20px;
  }
  .quiz-box #answer-correct,
  .quiz-box #answer-incorrect {
    font-size: 20px;
  }
  .quiz-box {
    width: 100%;
  }
  .cars-we-love-box {
    width: 100%;
    margin: 20px 0;
    text-align: center;
  }
  .cars-we-love-box .divider2,
  .cars-we-love-box .car3 {
    display: none;
  }
  .cars-we-love-box .car1,
  .cars-we-love-box .car2 {
    width: 38%;
  }

  @media only screen and (max-width: 450px) {
    .mid-page-nav-wrapper .wash-and-detail {
      height: 39vw;
      padding: 14vw 0 0 7vw;
    }
    .mid-page-nav-wrapper .polish-and-wax {
      height: 39vw;
      padding: 6vw 0 0 30vw;
    }
    .mid-page-nav-wrapper .buffers-and-pads {
      height: 39vw;
      padding: 7vw 0 0 7vw;
    }

    .visit-griots-garage-wrapper h3 br {
      display: block;
    }

    /* Digital Catalog */
    .visit-griots-garage-digital-catalog h3 br {
      display: block;
    }
    /* //Digital Catalog */

    .main-banner > h1 {
      font-size: 30px;
      text-align: left;
      left: 2vw;
      right: auto;
      top: auto;
      bottom: 41vw;
      width: 100%;
    }
    .main-banner > p.subhead {
      font-size: 10px;
      line-height: inherit;
      text-align: left;
      left: 2vw;
      right: auto;
      top: auto;
      bottom: 38vw;
      width: 90%;
      text-shadow: 0 1px 5px rgba(0, 0, 0, 0.75);
    }
    .main-banner > h1 br {
      display: block;
    }
    .main-banner > p.subhead br {
      display: block;
    }
    .main-banner button {
      right: auto;
      left: 2vw;
      top: auto;
      bottom: 25vw;
      height: 35px;
    }
    .shipping-subhead {
      font-size: 17px;
    }
  }
}