/*
Theme Name: Loyalty Preowned
Theme URI: https://www.dealervenom.com/
Description: This is the theme for Loyalty Preowned.
Author: Dealer Alchemist
Author URI: https://www.dealervenom.com/
Template: dv-framework
Version: 1.0
*/
body {
  font-family: 'Poppins', sans-serif;
}
header {
  background-color: #fff;
  position: sticky;
  top: 0;
  z-index: 200;
  width: 100%;
  height: auto !important;
}
#nav-icon1,
#nav-icon2,
#nav-icon3,
#nav-icon4 {
  margin: 17px auto;
}
#nav-icon1 span,
#nav-icon2 span,
#nav-icon3 span,
#nav-icon4 span {
  background: #fff;
}
@media screen and (max-width: 1485px) {
  #desktop-nav {
    margin-right: 25px;
  }
}
@media screen and (max-width: 1291px) {
  #desktop-nav {
    display: none;
  }
}
#desktop-nav #main_nav_menu > ul > li > a span {
  line-height: 80px;
}
.main-nav {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: space-between;
}
#main_nav_menu > ul > li > a {
  padding: 0px 10px;
  text-decoration: none;
  -webkit-transition: color 0.3s ease-out;
  -moz-transition: color 0.3s ease-out;
  -o-transition: color 0.3s ease-out;
  -webkit-transition: color ease-in-out;
  -moz-transition: color ease-in-out;
  -o-transition: color ease-in-out;
  transition: color ease-in-out;
}
#main_nav_menu > ul > li > a span {
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  font-weight: 600;
  margin-left: 10px;
  margin-right: 10px;
}
#main_nav_menu > ul > li:hover {
  color: #00b1eb;
}
#main_nav_menu ul li.has-sub ul span {
  font-size: 0.688rem !important;
}
#main_nav_menu ul li > ul {
  white-space: nowrap;
}
#main_nav_menu ul li > ul li {
  border-left: 0;
  display: block;
  list-style: inside none;
  padding: 0;
  margin: 0;
  position: relative;
  background: #00b1eb;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
#main_nav_menu ul li > ul li a {
  color: #fff;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
#main_nav_menu ul li > ul li:hover {
  background: #fff;
}
#main_nav_menu ul li > ul li:hover a {
  color: #00b1eb;
}
#main_nav_menu ul li > ul .car-menu {
  background: #000 !important;
}
#main_nav_menu ul li > ul .car-menu > a > span {
  color: #fff !important;
}
#main_nav_menu ul li > ul,
#main_nav_menu ul li > div {
  display: none;
  width: auto;
  position: absolute;
  padding-left: 0;
  z-index: 999;
  top: 80px;
}
#main_nav_menu ul li.has-sub:hover > ul,
#main_nav_menu ul li.has-sub:hover > div {
  display: block;
}
#main-menu-nav-container #main_nav_menu {
  margin-right: 20px;
  border-right: 1px solid #e9e9e9;
}
#menu-main-nav-menu {
  -webkit-padding-start: 0;
}
#menu-main-nav-menu a {
  font-weight: 500 !important;
  text-decoration: none;
}
.secondary-nav {
  height: 40px;
  background-color: #000;
  color: #e9e9e9;
}
@media screen and (max-width: 1291px) {
  .dv-sidenav {
    display: block !important;
  }
}
nav ul li {
  display: inline-block;
  display: -moz-inline-stack;
  align-self: center;
  border-left: 1px solid #e9e9e9;
}
nav ul li a {
  border: none;
  display: block;
}
nav ul li ul li {
  background-color: #fff;
}
nav ul li ul li a {
  display: block;
  padding: 15px 12px;
}
.nav-below-btn {
  position: absolute;
  right: 0;
  border-left: 1px solid #e9e9e9;
  background: #00b1eb;
  display: none;
  padding-bottom: 1px;
}
@media screen and (max-width: 1291px) {
  .nav-below-btn {
    display: block;
  }
}
.logo-container {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  height: 100%;
}
.logo-container div:first-of-type img {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  justify-content: center;
  align-items: center;
  margin-left: 25px;
  margin-right: 25px;
  margin-top: 10px;
  z-index: 100;
  vertical-align: middle;
}
.logo-container h2 {
  padding-top: 6px;
  padding-bottom: 12px;
  color: #000;
  font-size: 1.5rem;
  font-weight: 500;
}
.logo-container h2 > span {
  font-weight: 700;
}
.logo-container > a {
  border-left: 1px solid #e9e9e9;
  height: 60px;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  text-transform: uppercase;
}
.logo-container img {
  max-height: 45px;
  padding: 0 20px;
}
@media screen and (max-width: 395px) {
  .logo-container img {
    max-height: 33px;
    padding: 0 15px;
  }
}
.header-ctas {
  display: flex;
  align-items: center;
  margin-right: 25px;
}
@media screen and (max-width: 1485px) {
  .header-ctas {
    display: none;
  }
}
.header-ctas > a {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  flex-flow: column;
  color: #00b1eb;
  font-weight: 700;
  font-size: 1.5rem;
}
.header-ctas > a span {
  font-size: 0.825rem;
  font-weight: 600;
  color: #a0a0a0;
  text-transform: uppercase;
  padding-bottom: 2%;
}
/*Mobile*/
#mobile-nav-icon {
  display: none;
}
#mobile-nav {
  display: none;
}
.mobile-nav-click-open {
  display: grid;
  display: -ms-grid;
  height: inherit;
}
.mobile-nav-subheader-hide {
  display: none !important;
}
.mobile-nav-subheader-close {
  display: block !important;
}
#mobile-nav-click-call {
  display: none;
  grid-template-columns: 54% 38% 7%;
}
#mobile-nav-click-call div span {
  font-size: 0.75rem;
}
@media screen and (max-width: 900px) {
  #mobile-nav-subheader {
    display: grid;
    display: -ms-grid;
    top: 79px !important;
  }
}
.whyloyalty-images {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  flex-flow: wrap;
}
.whyloyalty-images > div > img {
  max-height: 130px;
}
@media screen and (max-width: 1291px) {
  .whyloyalty-images > div > img {
    max-height: 116px;
  }
}
#subheader {
  z-index: 103;
  height: 40px;
  width: 100%;
  background: #000;
  font-family: "Poppins", sans-serif;
  font-size: 0.875rem;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  justify-content: space-between;
  align-items: center;
}
.subheader-right-side {
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
}
.subheader-phone-and-hours .mabel-bhi-businesshours-inline {
  display: inline;
  text-transform: uppercase;
}
.subheader-address {
  margin-right: 15px;
}
.subheader-phone-and-hours {
  margin-left: 15px;
  color: #fff;
}
.subheader-why-loyalty {
  height: 40px;
  background: #00b1eb;
  color: #fff;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  justify-content: center;
  width: 264px;
  font-weight: 400;
  font-size: 0.875rem;
  max-height: 619px;
}
.subheader-why-loyalty:hover {
  background: #000;
}
.subheader-why-loyalty .fa {
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}
.subheader-why-loyalty:hover .fa {
  transform: rotate(180deg);
  padding-right: 10px;
  padding-left: 0 !important;
}
.subheader-why-loyalty-dropdown {
  height: 0;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  position: absolute;
  top: 120px;
  right: 0;
  width: 264px;
  overflow: hidden;
  cursor: default;
  background: #fff;
  max-height: 658px;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  align-items: center;
  flex-flow: column;
}
@media screen and (max-width: 1291px) {
  .subheader-why-loyalty-dropdown {
    max-width: 600px;
  }
}
.subheader-why-loyalty-dropdown > img {
  max-height: 50px;
  margin-top: 5%;
}
.subheader-why-loyalty-dropdown > h4 {
  color: #000;
  margin: 5% 0;
  text-align: center;
}
@media screen and (max-width: 900px) {
  #subheader {
    display: none;
  }
}
#subheader .subheader-why-loyalty-hover {
  height: max-content;
}
#subheader .subheader-why-loyalty-copy {
  display: none;
  background: url("//bucket.dealeralchemist.com/2019/10/lifetimeloyaltiesdropdown.png?auto=compress%2Cformat&ixlib=php-1.2.1");
  background-size: contain;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  max-height: 619px;
  background-position: left;
  position: relative;
  z-index: 1;
}
#subheader .subheader-why-loyalty-copy h2 {
  color: #00b1eb;
  font-size: 1.875rem;
  font-weight: 900;
  padding: 0 8px;
  margin-top: -18px;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  justify-content: center;
  margin-bottom: -14px;
}
.car-menu-container ul {
  width: 725px !important;
  background: #00b1eb;
  box-shadow: none !important;
  margin-left: -63px;
}
.car-menu {
  float: right;
}
.car-menu li {
  background: #00b1eb;
}
.car-menu li a {
  padding: 10px;
}
.car-menu li a span {
  color: #fff;
  font-weight: 600;
}
.car-menu li:hover a span {
  color: #00b1eb;
  font-weight: 600;
}
.car-menu > ul {
  top: 0 !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  position: relative !important;
}
.two-columns {
  width: 50%;
}
.three-columns {
  width: 33.333333%;
}
.four-columns {
  width: 25%;
}
.car-menu-no-title > a > span {
  visibility: hidden;
}
/*Searchbar */
.nav-cont {
  position: relative;
  align-items: normal;
}
.nav-cont .nav-below-btn-toggle {
  top: 8px;
}
.nav-cont * {
  box-sizing: border-box;
}
#search {
  display: flex;
  align-items: center;
  position: relative;
  padding: 0 25px;
  font-weight: 600;
  border-left: 1px solid #e9e9e9;
  background: #fff;
  font-family: "Poppins", sans-serif;
}
@media screen and (max-width: 1291px) {
  #search {
    height: 60px;
  }
}
#search * {
  box-sizing: border-box;
}
#search #autocomplete {
  position: absolute;
  top: 0;
  right: 60px;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  border-left: 1px solid #e9e9e9;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  visibility: hidden;
}
#search #autocomplete.searchbar-slide-out {
  visibility: visible !important;
  width: calc(100vw - 70px) !important;
  background: #fff;
}
@media screen and (max-width: 1291px) {
  #search #autocomplete.searchbar-slide-out {
    width: calc(100vw - 150px) !important;
  }
}
#search #autocomplete .selectize-control {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 768px) {
  #search #autocomplete .selectize-control {
    max-width: 80%;
  }
}
#search #autocomplete .selectize-control .selectize-input {
  width: 100%;
  position: relative;
  display: block;
  max-height: 100%;
}
#search #autocomplete .selectize-control .selectize-input input {
  background: #fff;
  width: 100% !important;
  height: 100%;
  display: block;
  padding: 1rem 2rem;
  max-height: 100%;
  text-transform: none;
  -webkit-transition: 100ms ease-in-out;
  -moz-transition: 100ms ease-in-out;
  -o-transition: 100ms ease-in-out;
  transition: 100ms ease-in-out;
  font-size: 1rem;
  border: 1px solid transparent;
  font-family: Poppins, sans-serif;
}
#search #autocomplete .selectize-control .selectize-input input:focus,
#search #autocomplete .selectize-control .selectize-input input:hover {
  border: 1px solid transparent;
}
#search #autocomplete .selectize-control .selectize-input input::placeholder,
#search #autocomplete .selectize-control .selectize-input input::-webkit-input-placeholder,
#search #autocomplete .selectize-control .selectize-input input::-moz-placeholder,
#search #autocomplete .selectize-control .selectize-input input:-moz-placeholder,
#search #autocomplete .selectize-control .selectize-input input:-ms-input-placeholder {
  color: #000;
}
#search #autocomplete .selectize-control .selectize-input::before {
  color: #000;
  content: '\f002';
  font-family: 'Font Awesome 5 Pro';
  font-weight: 900;
  position: absolute;
  z-index: 1;
  display: inline-block;
  display: -moz-inline-stack;
  margin: 0;
  left: 10px;
  top: 50%;
  transform: translate(0, -50%);
  font-style: normal;
}
#search #autocomplete .selectize-control .selectize-dropdown {
  position: absolute;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1;
  left: 0 !important;
  right: 0 !important;
  font-family: Poppins, sans-serif;
}
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content {
  width: 100%;
  text-align: left;
  background: #fff;
  border-top: 1px solid #000;
}
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option {
  border-bottom: 1px solid #000;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  width: 100%;
  padding: 1rem;
  color: #000;
  text-transform: none;
  font-size: 0.75rem;
}
@media screen and (max-width: 768px) {
  #search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option {
    font-size: 0.875rem;
  }
}
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option:hover,
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option:active,
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option:link,
#search #autocomplete .selectize-control .selectize-dropdown .selectize-dropdown-content .option:visited {
  background: #00b1eb;
  cursor: pointer;
  color: #fff;
}
#searchbox {
  font-family: 'Poppins', sans-serif;
}
#search-interactions {
  position: absolute;
  right: 42px;
  width: 0;
  height: 80px;
  border: 0;
  border-left: 1px solid #e9e9e9;
  padding-left: 20px;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  visibility: hidden;
  overflow: hidden;
}
#searchbar-input {
  position: absolute;
  right: 52px;
  width: 0;
  height: 70px;
  border: 0;
  border-left: 1px solid #e9e9e9;
  padding-left: 20px;
  padding-top: 5px;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  visibility: hidden;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 600;
}
#search-condition {
  position: absolute;
  z-index: 1;
  display: flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  height: 50px;
  background: #fff;
  align-items: center;
  top: 13px;
}
#search-condition > div {
  padding: 0 10px;
}
.search-condition-hidden {
  display: none !important;
}
#searchbar-btn,
#searchbar-btn:hover {
  cursor: pointer;
  margin: 0 auto;
}
.searchbar-search {
  opacity: 1;
  font-size: 0.875rem;
  -webkit-transition: 400ms;
  -moz-transition: 400ms;
  -ms-transition: 400ms;
  -o-transition: 400ms;
  -webkit-transition: 400ms ease-in-out;
  -moz-transition: 400ms ease-in-out;
  -o-transition: 400ms ease-in-out;
  transition: 400ms ease-in-out;
  position: absolute;
}
.searchbar-close {
  opacity: 0;
}
.searchbar-hidden {
  opacity: 0;
}
.searchbar-display {
  opacity: 1 !important;
}
/*Searchbar */
/*Across the site*/
li {
  list-style: none;
}
#warranty-img {
  position: relative;
}
.number-title {
  color: #888;
  margin-right: 10px;
}
.slash {
  display: none;
}
@media not all and (min-resolution: 0.001dpcm) {
  .dv-toggle-open {
    top: 79px !important;
  }
}
@supports (font: -apple-system-body) and (-webkit-appearance: none) {
  .dv-toggle-open {
    top: 79px !important;
  }
}
