@import url("https://fonts.googleapis.com/css2?family=Raleway&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;700;800&display=swap");

html {
  height: 100%;
  font-size: 100%;
}

* {
  font-family: Inter, Arial, Helvetica, sans-serif !important;
}

body {
  background: white;
  padding: 0px;
  margin: 0px;
  min-height: 100% !important;
  height: 100%;
  font-family: Inter, Arial, Helvetica, sans-serif !important;
  font-size: 14px;
  color: #4a495c;
  max-width: 100%;
  overflow-x: hidden;
}

a {
  color: #0169ff;
}

p {
  font-size: 18px;
}

a:hover {
  color: #00a7e1;
}

a:focus {
  color: #dedede !important;
  text-decoration: none !important;
}

.text-bright-blue {
  color: #00a7e1;
}

.container {
  max-width: 1260px;
}

.sub-sub-menu li a {
  position: relative;
}

.nav-dropdown .active-promo,
#buyCar,
.medScreen.smallScreen .sub-sub-menu .warranty-promo,
.medScreen.smallScreen .sub-sub-menu .concierge-promo,
.medScreen.smallScreen .sub-sub-menu .insights-promo,
#dealer-invoice {
  position: relative;
}
#dealer-invoice a::after {
  position: absolute;
  top: -4px;
  right: -9px;
  display: flex;
  padding: 6px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #e71b00;
  content: "FREE";
  color: #fff;
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
}
/*.nav-dropdown .active-promo::after,
#buyCar::after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -10px;
  width: 5px;
  height: 5px;
  border-radius: 100%;
  min-width: 5px;
  background-color: #E71B00;
  content: "";
}*/
.nav-dropdown #buyCar,
.nav-dropdown #warranty {
  width: max-content;
}

.medScreen.smallScreen .sub-sub-menu .insights-promo::after,
.medScreen.smallScreen .sub-sub-menu .concierge-promo::after,
.medScreen.smallScreen .sub-sub-menu .warranty-promo::after {
  top: 4px !important;
}

.nav-dropdown .second-level.insights-promo > a::after,
.nav-dropdown .third-level.insights-promo > a::after,
.medScreen.smallScreen .sub-sub-menu .insights-promo::after {
  position: absolute;
  top: -4px;
  right: 0;
  display: flex;
  padding: 6px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #e71b00;
  content: "20% OFF";
  color: #fff;
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
}

.nav-dropdown .second-level.concierge-promo > a::after,
.nav-dropdown .third-level.concierge-promo > a::after,
.medScreen.smallScreen .sub-sub-menu .concierge-promo::after {
  position: absolute;
  top: -4px;
  right: 0;
  display: flex;
  padding: 6px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #e71b00;
  content: "$100 OFF";
  color: #fff;
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
}

.nav-dropdown .second-level.warranty-promo > a::after,
.nav-dropdown .third-level.warranty-promo > a::after,
.medScreen.smallScreen .sub-sub-menu .warranty-promo::after {
  position: absolute;
  top: -4px;
  right: 0;
  display: flex;
  padding: 6px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #e71b00;
  content: "$250 OFF";
  color: #fff;
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
}

.grey_strip {
  width: 100%;
  padding: 25px 0;
  background: #f3f3f3;
}

.grey_strip ul {
  margin: 0;
}

.grey_strip li {
  position: relative;
  height: 100%;
}

.grey_strip li:first-child {
  margin-left: 0;
}

.header-logo {
  max-height: 40px;
  border: none;
  margin: -4px 0 0 0;
}

footer {
  padding: 48px 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  background-color: #004171;
  line-height: 27px;
  color: white;
  font-weight: 400;
}

footer a {
  color: #ececec;
}

footer a:hover {
  color: #fff;
}

footer p {
  font-size: 1.1em;
}

.footer-logo {
  max-width: 260px;
  border: none;
  margin-bottom: 1em;
}

.home-video {
  margin: 1em 0 1.5em 0;
}

.home-main {
  margin: 1em 0 1.5em 0;
  background-image: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/caredge-banner.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 300px;
}

.home-main-slogan {
  padding: 3.25em 0 0.75em 0.75em;
  font-size: 3.5em;
  color: #ffffff;
  font-weight: bold;
  text-shadow: 3px 3px 5px #000000;
}

.home-ranks-hr {
  padding: 0;
  height: 2px;
  width: 40%;
  background-color: rgba(65, 83, 100, 0.2);
  border: none;
}

.home-ranks-right-border {
  padding: 0 2em;
  border-right: 1px solid rgba(65, 83, 100, 0.1);
}

.home-ranks-sub-title {
  font-size: 1.4em;
  color: #415364;
}

.home-ranks-num {
  color: #a2a9ad;
}

.home-ranks-item a {
  font-size: 1.2em;
  color: #0069b5;
}

.home-ranks-button {
  background-color: #0069b5;
  padding: 8px 0;
  margin: 0.75em;
  border-radius: 8px;
  color: #fff;
  border: none;
  opacity: 0.9;
  max-width: 220px;
}

.home-ranks-button:hover,
.ce-button:hover {
  background-color: #00a7e1;
}

#home-research {
  padding: 0;
  margin: 0;
  background-image: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/car-research.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  min-height: 300px;
  position: relative;
}

#home-shop {
  padding: 0;
  margin: 0;
  background-image: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/car-shopping.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  min-height: 300px;
  position: relative;
}

.text-bottom-center {
  position: absolute;
  width: 100%;
  bottom: 0;
  text-align: center;
}

.text-bottom-overlay {
  background-color: rgba(255, 255, 255, 0.8);
}

.text-bottom-overlay h2 {
  margin: 0;
  padding: 0.25em;
  font-size: 2.5em;
  color: #4a495c;
}

.home-blocks {
  margin: 1em 0 2.5em 0;
}

.home-block {
  text-align: center;
}

.home-ad {
  min-height: 280px;
}

.home-form,
.home-news {
  padding: 0.25em 0;
  width: 100%;
  min-height: 280px;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff;
  vertical-align: middle;
}

.home-form-title {
  font-size: 1.1em;
}

.home-form-element {
  margin: 18px 0;
}

.home-submit {
  padding: 6px;
  margin: 10px;
  height: 34px;
  width: 280px;
  font-size: 1.1em;
  font-weight: bold;
  vertical-align: bottom;
  overflow: hidden;
}

.home-select {
  -webkit-appearance: none;
  padding: 6px;
  margin: 10px;
  height: 34px;
  width: 280px;
  font-size: 1.2em;
  vertical-align: bottom;
  overflow: hidden;
}

a.home-news-title {
  color: #666666;
}

a.home-news-date {
  font-size: 0.85em;
  color: #bbbbbb;
  font-style: italic;
}

.home-news-container {
  margin: -5px 0 0 0;
  display: table;
  border-spacing: 10px;
}

.home-news-row {
  display: table-row;
  background-color: #fafafa;
}

.home-news-row-left {
  display: table-cell;
}

.home-news-row-right {
  display: table-cell;
  width: 100%;
  padding: 6px;
  text-align: left;
  vertical-align: middle;
}

.other-news {
  margin: 1em 0;
  padding-top: 1.5em;
  border-top: 1px solid #f4f4f5;
}

.other-news-thumb {
  margin: 0;
  width: 80px;
}

a.other-news-title {
  color: #415364;
  font-size: 1.2em;
  font-weight: bold;
}

a.other-news-title:hover {
  color: #00a7e1;
  text-decoration: none;
}

.other-news-date,
a.other-news-date {
  font-size: 0.85em;
  color: #bbbbbb;
  font-style: italic;
}

.other-news-container {
  display: table;
  border-spacing: 10px;
}

.other-news-row {
  display: table-row;
}

.other-news-row-left {
  display: table-cell;
}

.other-news-row-right {
  display: table-cell;
  width: 100%;
  padding: 6px;
  text-align: left;
  vertical-align: middle;
}

.other-news-ad {
  margin: 2em 0;
  min-width: 300px;
}

.other-news-more {
  font-size: 1.4em;
  font-weight: bold;
  margin: 0;
  padding: 0;
}

.news-sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 20px;
}

.faq {
  padding: 2em;
}

.chart-title {
  margin: 0;
  font-size: 40px;
  font-family: inter !important;
  font-style: normal;
  font-weight: 700;
  line-height: 52px;
  color: #4a495c;
  padding-left: 15px;
  padding-bottom: 40px;
}

.section-title {
  margin: 0 0 24px;
  font-size: 40px;
  font-family: "Inter", Helvetica, Arial, Lucida, sans-serif;
  font-weight: 900;
  color: #4a495c;
}

.styled-select {
  -moz-appearance: none;
  -webkit-appearance: none;
  background: url(https://d2bq9obxtvkjtt.cloudfront.net/images/site/option_arrow.png) no-repeat 96% 0;
  height: 35px;
  overflow: hidden;
  width: 220px;
  margin: 10px 0px 10px 15px;
}

.styled-select select {
  background: transparent;
  border: none;
  font-size: 14px;
  height: 35px;
  padding: 5px;
  width: 268px;
}

.top-select {
  width: 160px;
  font-size: 14px;
  height: 32px;
  margin: 8px 0 0 0;
  padding: 2px;
  border: 1px solid #f4f4f5;
  color: #ffffff;
  background-color: #e52231;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.top-submit {
  width: 30px;
  font-size: 14px;
  height: 32px;
  margin: 8px 0 0 0;
  padding: 2px;
  border: 1px solid #f4f4f5;
  color: #ffffff;
  background-color: #e52231;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.top-select:hover,
.top-submit:hover {
  background-color: #ff1628;
}

.semi-square {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.input-red-white,
.input-blue-white {
  -webkit-appearance: none;
  background-color: #0069b5;
  color: #fff;
  border: 1px solid #0069b5;
  padding: 0 0 0 10px;
}

.input-white-red,
.input-white-blue {
  -webkit-appearance: none;
  background-color: #fff;
  color: #0069b5;
  border: 1px solid #fff;
}

.text-bold {
  font-weight: bold;
}

.mc_form {
  margin: 1.5em 0;
}

.input-white-black {
  background-color: #fff;
  color: #111111;
  border: 1px solid #fff;
}

.styled-input-text {
  padding: 6px;
  height: 36px;
  overflow: hidden;
  width: 240px;
  margin: 10px 5px 10px 5px;
  font-size: 1.2em;
  font-weight: bold;
  border: 1px #ececec solid;
}

.styled-submit {
  padding: 6px;
  height: 34px;
  overflow: hidden;
  width: 60px;
  margin: 10px 5px 10px 5px;
  font-size: 1.2em;
  font-weight: bold;
  vertical-align: bottom;
}

.compare-title {
  margin: 0;
  padding: 0;
  font-weight: bold;
  font-size: 1.6em;
}

.compare-wrapper {
  padding: 0;
}

.compare-select {
  width: 100%;
  margin: 0.5em 0.5em 0.5em 0;
  border-radius: 3px;
}

.compare-select-title {
  font-weight: bold;
  margin: 2.5em 0 0.5em 0;
}

.compare-select-wrapper {
  margin: 0;
}

.compare-listings-title {
  font-size: 1.3em;
  font-weight: bold;
  margin: 4em 1em 0 1em;
  padding: 0.5em;
}

.compare-listing-zip-form {
  font-size: 1em;
  margin: 0 0 -1em 0;
  padding: 0 0.5em;
}

.compare-text {
  margin-bottom: -1em;
  font-size: 1.2em;
}

.compare-about {
  padding: 1.5em;
  font-size: 1.2em;
}

.compare-button {
  width: 100%;
  padding: 6px 0;
  margin: 0.5em 0.5em 0.5em 0;
  border-radius: 3px;
}

.compare-comparisons-title {
  font-size: 1.3em;
  font-weight: bold;
  margin-top: 1em;
  padding: 0;
}

.compare-lookup-title {
  font-weight: bold;
  margin: 2.5em 0 0.5em 0;
}

.car-logo {
  margin: 5px;
  padding: 5px;
  width: 120px;
}

.general-content {
  padding: 50px 0 50px 0;
  text-align: center;
}

.post-text {
  font-size: 1.2em;
}

.make-info h1 {
  margin: 0 0 20px 0;
  font-size: 1.8em;
  font-weight: bold;
  color: #ccc;
}

.imagedropshadow:hover {
  -moz-box-shadow: 1px 1px 5px #ccc;
  -webkit-box-shadow: 1px 1px 5px #ccc;
  box-shadow: 1px 1px 5px #ccc;
}

.div-right-top {
  font-size: 2em;
  font-weight: bold;
  margin: 20px 0 20px 0;
  background-color: #0069b5;
  color: #fff;
  border: 1px solid #0069b5;
}

.div-search-box {
  background-color: #efefef;
  margin: 30px 0 0 0;
  border: 1px solid #f4f4f5;
}

.div-right-link {
  font-size: 1.2em;
  font-weight: bold;
}

.styled-submit-right {
  padding: 6px;
  height: 34px;
  overflow: hidden;
  width: 90%;
  margin: 10px 5px 10px 5px;
  font-size: 1.2em;
  font-weight: bold;
  vertical-align: bottom;
}

.input-red-white:hover,
.input-blue-white:hover {
  background-color: #00a7e1;
}

.search-input {
  margin: 0.5em 0;
}

.user-form {
  margin: 20px;
  padding: 20px 30px 20px 30px;
  background: rgba(255, 255, 255, 0.8);
  color: #fff;
}

.form-box {
  padding: 20px 20px 5px 20px;
  margin: 20px 0 0 0;
  background: rgba(255, 255, 255, 0.8);
}

.form-hero {
  display: block;
  position: relative;
  width: 100%;
  background: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/buy-bg.jpg") no-repeat fixed center center;
  background-size: cover;
}

.form-hero .caption {
  margin: 20px;
}

.form-hero .caption h1 {
  color: #0069b5;
  font-family: "open_bold", Helvetica, Arial, sans-serif;
  font-size: 34px;
  font-weight: bold;
  word-break: break-word;
}

.form-hero .caption h2 {
  color: #222;
  font-family: "open_bold", Helvetica, Arial, sans-serif;
  font-size: 24px;
  font-weight: bold;
  word-break: break-word;
}

.form-hero .caption h3 {
  color: #222;
  font-family: "open_bold", Helvetica, Arial, sans-serif;
  font-size: 18px;
  font-weight: bold;
  word-break: break-word;
}

.form-hero .caption p {
  color: #222;
  font-family: "open_regular", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 30px;
  margin: 15px 0 35px 0;
}

.form-select {
  width: 240px;
  padding: 0 0 0 10px;
  margin: 10px 0 10px 0;
  font-size: 1.2em;
}

.form-select option {
  color: #999;
  font-weight: bold;
}

.full-width {
  width: 100%;
}

.styled-form-submit {
  padding: 6px;
  height: 40px;
  margin: 10px 5px 10px 5px;
  background-color: #0069b5;
  font-size: 1.2em;
  font-weight: bold;
  vertical-align: bottom;
  color: #fff;
  border: 1px #415364 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 5px 0 rgba(0, 0, 0, 0.19);
}

.styled-form-submit:hover {
  background-color: #00a7e1;
}

.styled-form-submit-small {
  padding: 3px 6px 3px 6px;
  height: 30px;
  margin: 10px 10px 20px 10px;
  background-color: #0069b5;
  font-size: 1.1em;
  font-weight: bold;
  vertical-align: bottom;
  color: #fff;
  border: 1px #415364 solid;
}

.styled-form-submit-small:hover {
  background-color: #00a7e1;
}

.form-error {
  color: #ff0000;
  font-weight: bold;
}

.listing-box {
  margin: 12px 0 12px 0;
  padding: 10px 10px 0 10px;
  border: 1px #fcfcfc solid;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.08);
}

.listing-vehicle {
  font-weight: bold;
  font-size: 1.5em;
}

.listing-vehicle a {
  color: #333;
}

.listing-price {
  font-size: 1.8em;
}

.listing-miles,
.div-13em {
  font-size: 1.3em;
}

.listing-details {
  margin: 2px 0 2px 0;
  font-size: 1.1em;
}

.listing-location {
  margin: 6px 0 4px 0;
  font-size: 1em;
  color: #666;
}

.listing-link {
  margin: 0 0 10px 0;
}

.listing-link a {
  font-weight: bold;
  font-size: 1.3em;
}

.grid-listing {
  margin: 8px;
  padding: 0;
  border: 1px #f4f4f5 solid;
  border-radius: 4px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff;
}

.grid-listing:hover {
  border: 1px #bbbbbb solid;
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.08);
}

.grid-listing-hover:hover a {
  text-decoration: none;
}

.grid-listing-title {
  margin: -6px 0 0 0;
  padding: 0;
  color: #666666;
  font-size: 1em;
  font-weight: bold;
}

.grid-listing-info {
  margin: 0;
  padding: 0;
  color: #666666;
  font-size: 1em;
  font-weight: normal;
}

.grid-listing-fine {
  margin: 0;
  padding: 0;
  color: #999999;
  font-size: 0.9em;
  font-weight: normal;
  font-style: italic;
}

.grid-listing-price {
  margin: 0;
  padding: 0;
  color: #d42a36;
  font-size: 1.3em;
  font-weight: bold;
}

.grid-listing-photo {
  display: block;
  max-width: 300px;
  min-height: 176px;
  max-height: 176px;
  width: 100%;
  height: auto;
  object-fit: cover;
  margin: 0 0 10px 0;
  border-radius: 4px 4px 0 0;
}

.wide-95 {
  width: 95%;
}

.to-dep-button {
  margin: 0 5px 0 -5px;
}

.first-name {
  padding-left: 5px;
  padding-right: 15px;
}

.last-name {
  padding-left: 0;
  padding-right: 15px;
}

.car-listing-content {
  margin: 2em 0em;
  padding: 0 1em;
}

.car-listing-box {
  margin: 20px 0;
  padding: 0;
  width: 100%;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff;
}

.car-listing-photo {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  margin: 0;
}

.car-listing-title {
  font-size: 1.8em;
}

.car-listing-price {
  font-size: 1.8em;
  font-weight: bold;
  color: #0069b5;
}

.car-listing-trim {
  font-size: 1.3em;
  color: #333333;
  margin: 0 0 16px 0;
}

.car-listing-info {
  padding: 0 10px;
}

.car-listing-details {
  margin: 10px 5px;
  padding: 0;
  text-align: left;
  font-size: 1.1em;
}

.car-listing-promo {
  margin: 10px 5px;
  padding: 0 10px;
  text-align: left;
  font-size: 1em;
}

.car-listing-detail {
  white-space: nowrap;
  margin: 5px 0 5px 0;
}

.car-listing-specs {
  padding: 0.85em 1em;
  text-align: left;
  font-size: 1.3em;
}

.car-listing-contact {
  margin: 20px 0;
  padding: 0;
  width: 100%;
  border: 1px #c41622 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #d42b37;
}

.car-listing-check {
  margin: 16px 0 6px 0;
  font-size: 1.6em;
  color: #444444;
}

.car-listing-contact-fine {
  font-size: 0.85em;
  color: #999999;
  font-style: italic;
}

.vehicle-lookup {
  margin: 12px 0 0 0;
  padding: 10px 5px 6px 5px;
  border: 1px #fcfcfc solid;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.1), 0 3px 10px 0 rgba(0, 0, 0, 0.08);
}

.listing-hidden,
.listing-show {
  margin: 0;
  padding: 0;
}

.partner-listing-heading {
  margin: 1em 0 -0.5em 0;
  padding: 0;
}

.partner-listing-wrapper {
  width: 100%;
  margin: 1em 0;
  padding: 0;
}

.partner-listing-wrapper:hover {
  background-color: #fffee8;
}

.partner-listing-column {
  float: left;
}

.partner-listing-left {
  width: 25%;
}

.partner-listing-middle {
  width: 55%;
  padding: 0.5em;
}

.partner-listing-right {
  width: 20%;
  padding: 0.5em;
}

.partner-listing-row:after {
  content: "";
  display: table;
  clear: both;
}

.partner-listing-photo-img {
  max-width: 200px;
  max-height: 160px;
  border-radius: 8px;
}

.partner-listing-title {
  margin: 0 0 0 1em;
  font-size: 1.3em;
  font-weight: 600;
  color: #333333;
}

.partner-listing-price {
  margin: 0;
  padding: 0;
  font-size: 1.4em;
  font-weight: 600;
  color: #333333;
}

.partner-listing-no-price {
  margin: 0;
  padding: 0;
  font-size: 0.8em;
  color: #999999;
}

.partner-listing-info {
  font-size: 1em;
  margin: 0.2em 0 0 1.2em;
  color: #333333;
}

.partner-listing-very-low-risk {
  margin: 0.1em 0 0 0;
  font-size: 1em;
  font-weight: 700;
  color: #02c100;
}

.partner-listing-low-risk {
  margin: 0.1em 0 0 0;
  font-size: 0.9em;
  font-weight: 700;
  color: #5dc2fc;
}

.partner-listing-zip-form {
  font-size: 1em;
  margin: 0 0 -1.5em 0;
  padding: 1.25em 0 0 0;
}

.zip-form-text {
  height: 1.75em;
  width: 11em;
}

.zip-form-submit {
  font-size: 1.1em;
  height: 1.75em;
  margin: 0 0 0.75em 0;
  padding: 0 0.5em 0 0.5em;
}

.ad-box {
  margin: 1.5em 0;
  padding: 0;
}

.ad-ins-bottom {
  width: 100%;
  margin: 1em auto;
}

.chart-box {
  margin: 1em 0 2em 0;
  padding: 0 0.25em;
  background-color: #ffffff;
  border-radius: 2px;
  position: relative;
}

.chart-share {
  position: absolute;
  top: 16px;
  right: 18px;
  color: #ccc;
}

.export-wrapper {
  margin: -0.5em 0 0 0;
  font-size: 0.85em;
}

.export-item {
  display: inline;
  margin: 0 2em;
}

.export-link {
  color: #01b200;
}

.car-photo-img {
  width: 100%;
  border-radius: 16px;
}

.car-photo-box,
.nuv-box {
  margin: 2em 0;
  padding: 0.5em;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff;
  border-radius: 2px;
}

.side-box {
  margin: 2em 0;
  padding: 0.5em 0.5em 1em 0.5em;
  border: 1px #9fd4ff solid;
  background-color: #f6fbff;
  border-radius: 2px;
}

.side-title {
  font-size: 1.2em;
  font-weight: bold;
  color: #555555;
  margin-left: 12px;
}

.related-blog-title {
  margin: 2em 0 0 0;
  font-size: 1.3em;
  font-weight: bold;
  color: #444444;
}

.make-models {
  display: inline-block;
  margin: 0 1em 1em 0;
  font-size: 1.1em;
}

.make-logo {
  margin: 5px;
  padding: 5px;
  width: 160px;
}

.content-box {
  padding: 0.5em 1.5em;
}

.compare-comparisons {
  font-size: 1em;
  margin: 0.75em 0;
}

.compare-visitors {
  font-size: 1.2em;
}

.comparison-link {
  margin: 0.25em 0;
}

.compare-lookup {
  margin: 0;
}

.news-content {
  margin: 0 0 30px 0;
}

.news-body {
  font-size: 1.3em;
}

.news-body h1 {
  font-size: 1.6em;
  font-weight: bold;
  margin-top: 1em;
}

.news-body h2 {
  font-size: 1.5em;
  font-weight: bold;
  margin-top: 1em;
}

.news-body h3 {
  font-size: 1.6em;
  font-weight: bold;
  margin-top: 1em;
}

.news-body h4 {
  font-size: 1.4em;
  font-weight: bold;
  margin-top: 1em;
}

.news-body h5 {
  font-size: 1.2em;
  font-weight: bold;
  margin-top: 1em;
}

.news-box {
  padding: 1.25em;
}

.news-list-box {
  padding: 1em;
  margin-bottom: 1em;
  position: relative;
}

.news-list-box a {
  text-decoration: none;
}

.news-list-thumb {
  margin: 0 2em 0 0;
  padding: 0;
  max-width: 220px;
}

.news-list-box-text-container {
  padding: 0;
}

.news-list-box-thumb {
  float: left;
}

.news-list-box-thumb img {
  border: 1px solid #eee;
}

.news-list-box-text {
  height: 220px;
  display: table-cell;
  vertical-align: middle;
}

.news-list-box-title h2 {
  margin: 0 0 1em 0;
  padding: 0;
  font-size: 1.5em;
  font-weight: bold;
  color: #000;
}

.news-list-box-summary p {
  color: #415364;
}

.news-list {
  margin-top: 15px;
}

.news-photo {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  margin: 0;
  padding: 0.75em 0 0.5em 0;
}

.news-title {
  padding: 0;
  font-weight: 800;
  font-size: 50px;
  color: #0069b5;
  margin: 0 0 24px;
}

.news-title-summary {
  font-size: 2em;
  font-weight: bold;
  padding: 0;
  margin: 0.25em 0;
  color: #415364;
}

.news-summary,
.news-summary a {
  font-size: 1.1em;
  margin: 2em 0;
  color: #222222;
}

.news-li-item {
  padding: 0 0.5em 1.5em 0.5em;
  font-size: 1.2em;
}

p.news-li-item {
  text-align: left;
}

.news-header {
  padding: 0 0.5em 1.5em 0.5em;
  text-align: left;
  font-size: 1.2em;
}

.news-footer {
  padding: 0 0 30px 10px;
  font-size: 1.2em;
}

.news-list-title {
  font-size: 1.6em;
  font-weight: bold;
  margin: 15px 0 5px 0;
}

.news-posted {
  padding: 0 0.25em 1.25em 0.25em;
  font-size: 0.9em;
  color: #a2a9ad;
}

.ce-button {
  background-color: #0169ff;
  padding: 12px 24px;
  margin: 0.75em 0 0.75em -0.25em;
  border-radius: 8px;
  font-size: 16px;
  color: #fff;
  border: none;
  opacity: 0.9;
  font-style: normal;
  font-weight: 700;
  line-height: 22.86px;
  text-align: center;
  font-family: Inter;
}

.news-thumb {
  margin: 0 1em;
  max-width: 160px;
}

.home-news-thumb {
  max-height: 280px;
  border: 1px solid #f4f4f5;
}

.home-news-thumb-container {
  text-align: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
  width: 100%;
  min-height: 300px;
  position: relative;
  border: 1px solid #ccc;
}

.home-news-thumb-headline {
  margin: 0;
  padding: 0.75em 0.25em;
  width: 100%;
  background: rgba(255, 255, 255, 0.85);
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translate(-50%);
  font-size: 1.1em;
  font-weight: bold;
  color: #4a495c;
}

.home-news-thumb-headline:hover {
  background: rgba(0, 167, 225, 0.85);
}

.side-news-thumb-container {
  text-align: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  min-height: 200px;
  border: 1px solid #ccc;
  background-position: bottom center;
  border-radius: 16px;
}

.side-news-thumb-headline {
  margin: 0;
  padding: 0.75em 0.25em;
  width: 100%;
  background: rgba(255, 255, 255, 0.9);
  font-size: 18px;
  text-align: left;
  color: #4a495c;
  font-family: Inter !important;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.side-news-thumb-headline:hover {
  background: rgba(246, 251, 255, 0.9);
}

.news-listing-containter {
  border-bottom: 1px solid #f4f4f5;
  margin: 0 0 20px 0;
  padding: 0 0 10px 0;
}

.news-list-inner {
  margin-left: 0.5em;
  padding-right: 2em;
}

.news-video {
  margin-bottom: 1.5em;
}

.news-ul-no-bullets li {
  list-style-type: none;
}

.disqus_comments {
  margin: 2em 0 0 0;
}

.page-title {
  text-align: left;
  font-size: 2em;
  font-weight: bold;
  margin: 5px 5px 10px 5px;
}

#center-share {
  display: flex;
  justify-content: center;
}

.small-lookup-select {
  margin: 5px;
}

.mega-title {
  margin: 0 0 -0.5em 0;
  font-size: 3em;
  font-weight: bold;
}

.huge-title {
  font-size: 2.5em;
  font-weight: bold;
}

.big-title {
  font-size: 2.5em;
  font-weight: 800;
  margin: 0 0 -0.5em 0;
  color: #4a495c;
}

.home-sub-slogan-title {
  margin: 0 0 0.75em 0;
  padding: 0;
  font-size: 3em;
  font-style: italic;
}

.home-section-title {
  margin-top: 1em;
  font-size: 3em;
}

.home-sub-section-title {
  margin: -0.5em 0 0.5em 0;
  padding: 0;
  font-size: 2.5em;
}

.medium-title {
  margin: 0 0 30px 0;
  font-size: 1.6em;
  font-weight: bold;
}

.faq-title {
  font-size: 1.6em;
  font-weight: bold;
}

.faq-box {
  font-size: 1.1em;
  margin: 5px 0 35px 0;
  padding: 10px;
  background-color: #f0f0f0;
}

.home-models {
  text-align: left;
}

.home-slogan {
  font-size: 1.3em;
  color: #555555;
}

.home-medium-title {
  margin: 12px 0;
  font-size: 1.3em;
  color: #555555;
}

.home-section-grey {
  padding: 3em 0;
  margin: 0;
  background-color: #eee;
}

.home-section-white {
  padding: 3em 0;
  margin: 0;
}

.best-models {
  padding: 40px 0 40px 0;
  margin: 0;
  background-color: #0069b5;
}

.best-makes {
  padding: 40px 0 40px 0;
  margin: 0;
}

.rankings {
  padding: 20px 0 30px 0;
}

.rankings-makes {
  background-color: #fafafa;
}

.rankings-models {
  background-color: #fff;
}

.rankings-sub-title {
  font-weight: bold;
  font-size: 1.4em;
}

.rankings-sub-script {
  font-size: 0.9em;
  margin: -20px 0 10px 0;
}

.model-ranks {
  color: #bbb;
  font-size: 0.8em;
}

.model-links {
  color: #eee;
}

.model-links:hover {
  color: #fff;
}

.email-list {
  padding: 1em 2em;
  margin: 0;
  background-color: #415364;
  background-image: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/glass_only_transparent.png");
  background-repeat: no-repeat;
  background-position: center;
}

.right-side {
  margin: 0;
  padding-left: 5px;
  position: sticky;
  top: 20px;
}

.v-info-row .right-side {
  padding: 0;
  min-width: 300px;
}

.privacy-title {
  font-size: 1.6em;
  font-weight: bold;
  margin: 1em 0;
}

.privacy-text {
  font-size: 1.2em;
  padding: 1em;
  margin: 0em;
}

.u1-red,
.ce-blue {
  color: #0069b5;
}

.ce-dark-blue {
  color: #0069b5;
}

.u1-dark-grey {
  color: #555;
}

.u1-medium-grey {
  color: #aaa;
}

.u1-light-grey {
  color: #f4f4f5;
}

.white {
  color: #fff;
}

.all-makes {
  margin: 40px 0 30px 0;
}

.all-cars {
  margin: 10px 20px;
}

.all-nameplates {
  padding: 40px 0 40px 160px;
}

.pull-left-160 {
  margin-left: -160px;
}

.v-content {
  margin: 26px 0;
  color: #4a495c;
}

@media (min-width: 1440px) {
  .v-content {
    margin: 26px auto;
    max-width: 1440px;
    height: 100%;
    position: relative;
    display: flex;
    justify-content: space-between;
  }

  .insights-qs-ad-container {
    position: sticky;
    top: 80px;
    height: 400px;
  }
}

@media (min-width: 1200px) {
  .v-content.main-depreciation-container .container {
      width: 1040px;
  }
}

.home-process {
  width: 100%;
  padding: 0.5em 0 1em 0;
  background-color: #415364;
  color: #ffffff;
}

.home-process p {
  padding: 0 1em;
  font-size: 1.4em;
}

.home-process hr {
  padding: 0;
  height: 4px;
  width: 50%;
  background-color: #00a7e1;
  border: none;
}

.mw-500 {
  padding: 0 16px 0 16px;
  max-width: 500px;
  margin: 0 auto;
}

.sub-title {
  margin: 0 0 10px 0;
  font-size: 0.9em;
}

.rankings-list {
  text-align: left;
  margin: 0;
}

.rankings-top {
  margin-top: 20px;
}

.rankings-mid-title {
  margin-bottom: 10px;
}

.rankings-small {
  display: none;
}

.related-models {
  font-size: 1.1em;
  margin: 0.25em 1em;
}

.right-ad {
  margin: 1em 0 0 0;
  padding: 0;
}

.main-ad {
  margin: 0 0 30px 0;
}

.sub-ad {
  margin: 40px 0 0 0;
}

.rank-ad {
  margin: 20px 0 30px 0;
}

.navbar {
  position: relative;
  z-index: 2;
  margin: 0;
  /* padding: 10px; */
  background-color: #ffffff;
  border-radius: 0;
  min-height: 70px;
  color: #4a495c !important;
  font-family: "Inter", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  border-bottom: 1px solid #cdcdcd;
}

.main-nav {
  list-style-type: none;
  display: none;
  margin: auto 0;
  padding-left: 40px !important;
}

.nav-select {
  display: none;
}

.logo:hover {
  text-decoration: none;
}

.nav-links {
  text-decoration: none;
  color: #4a495c !important;
  font-family: "Inter", sans-serif;
  margin: 0 10px;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

.nav-links:hover {
  color: #000000;
  text-decoration: none;
}

.main-nav li {
  text-align: left;
  margin: 0 auto;
  padding: 10px 0;
}

.main-nav.active {
  position: relative;
  margin: 4em 0 0 0;
  padding: 0 0 1em 0;
  background-color: #0061c3;
  z-index: 99;
  opacity: 1;
}

.logo,
.logo a {
  font-size: 28px;
  text-decoration: none;
  color: #fff !important;
  line-height: 48px !important;
  font-weight: bold;
}

.main-logo {
  display: inline-block;
}

.main-logo img {
  height: 45px;
}

.navbar-toggle {
  margin: 0;
  padding: 0;
  cursor: pointer;
  color: #0061c3;
  font-size: 28px;
  font-weight: 400;
  float: none;
  border: 0;
  border-radius: 0;
}

.nav-select {
  display: none;
}

.active {
  display: block;
}

.mm-options {
  display: inline-block;
}

.nav-dropbtn {
  border: none;
}

.nav-dropdown {
  position: relative;
  display: inline-block;
}

.nav-dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  box-shadow: 0px 0px 1px 0px rgba(48, 49, 51, 0.05),
    0px 8px 16px 0px rgba(48, 49, 51, 0.1);
  z-index: 1;
  font-family: "Inter", Helvetica, Arial, Lucida, sans-serif;
  font-size: 16px;
  padding: 30px;
  border-radius: 16px;
}

.nav-dropdown-content a {
  color: #4a495c;
  padding: 8px;
  text-decoration: none;
  display: block;
  font-weight: 400;
}

.nav-dropdown-content-desc {
  color: #000000;
  font-size: 14px;
  font-weight: 300;
}

.nav-dropdown:hover .nav-dropdown-content {
  display: block;
  text-decoration: none;
}

.ribbon-holder {
  overflow: hidden;
  position: relative;
}

.ribbon {
  position: absolute;
  background: white;
  transform: rotate(-45deg);
  text-align: center;
  top: 18px;
  left: -26px;
  width: 116px;
  box-shadow: 0 0 18px rgba(0, 0, 0, 0.6);
}

.best-to-buy-bold {
  font-weight: bold;
}

.about-small {
  font-size: 0.95em;
  font-style: italic;
}

.options-multi-box {
  margin: 0.25em;
  padding: 0.5em 1em;
  background-color: #fcfcfc;
  border: 1px solid #dcdcdc;
  border-radius: 4px;
  max-height: 12em;
  overflow: auto;
  text-align: left;
}

.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out;
}

.loader {
  color: #00a7e1;
  font-size: 10px;
  margin: 80px auto;
  position: relative;
  text-indent: -9999em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.loader:before,
.loader:after {
  content: "";
  position: absolute;
  top: 0;
}

.loader:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.loader:after {
  left: 3.5em;
}

@-webkit-keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

@keyframes load7 {
  0%,
  80%,
  100% {
    box-shadow: 0 2.5em 0 -1.3em;
  }

  40% {
    box-shadow: 0 2.5em 0 0;
  }
}

.lform-split-left {
  padding-left: 0;
}

.lform-split-right {
  padding-right: 0;
}

.slider-input-container {
  margin: 1em 0 3.5em 0;
}

.slider-title {
  margin-bottom: 0.5em;
}

.slider-box-title {
  margin: 0.5em 0 -2em 0;
}

.slider-box-spacer {
  height: 3.5em;
  padding: 0 1em;
  border-bottom: 1px solid #ededed;
}

.slider-bar-div {
  max-width: 95%;
}

.slider-value-wrapper {
  margin: 1em 0 0 0;
  max-width: 98%;
  text-align: center;
}

.slider-value-box {
  padding: 2px 4px;
  display: inline;
  font-size: 1em;
}

.slider-value-box-left {
  float: left;
}

.slider-value-box-right {
  float: right;
}

.slider-value-divider {
  color: #999999;
}

#listings-search-title {
  margin: 0.5em 0 -0.5em 0;
  font-weight: bold;
}

#search-header {
  margin: 0.75em 0;
  padding: 0.5em 0.1em 0.5em 0.5em;
  background-color: #f5f5f5;
  min-height: 3em;
}

#search-header-page {
  padding: 0.25em 0 0 0.5em;
  font-size: 1.1em;
  text-align: left;
}

#search-footer-page {
  padding: 1em;
}

#search-header-sort {
  margin-top: -0.15em;
  text-align: right;
}

#sort-label {
  float: left;
  margin: 0.5em 0.5em;
  color: #555555;
  font-weight: bold;
}

.result-message {
  padding: 2em;
  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
  color: #666666;
}

.result-links {
  margin-top: 0.5em;
}

.result-links-after {
  margin-bottom: 4em;
}

.result-make-link {
  margin: 0.5em;
  padding: 0.5em;
  border: 1px solid #ffffff;
}

.result-make-link:hover {
  background-color: #fdfdfd;
  border: 1px solid #f4f4f5;
  border-radius: 4px;
}

.seller-info-title {
  font-size: 2em;
  margin: 0.25em 0;
  font-weight: bold;
  color: #555555;
}

.seller-name {
  font-size: 1.8em;
  margin: 1em 0 0.5em 0;
  font-weight: bold;
}

.seller-phone {
  font-size: 2em;
  margin: 0.5em 0 0 0;
  font-weight: bold;
}

.seller-address {
  font-size: 1.6em;
  margin: 0.5em 0 0 0;
}

.seller-misc {
  font-size: 1.2em;
  margin: 1em 0;
}

.seller-small {
  margin: 0.5em 0;
  font-size: 0.8em;
  color: #cccccc;
  font-style: italic;
  text-decoration: none;
}

#seller-map {
  height: 300px;
  margin: 2em 0;
  padding: 0;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  border-radius: 2px;
}

#dealer-map {
  height: 400px;
  margin: 1.5em 0;
  padding: 0;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  border-radius: 2px;
}

.nav-nowrap {
  white-space: nowrap;
}

.u1-logo {
  max-width: 550px;
}

.custom-radio-style,
.custom-checkbox-style {
  margin-right: 4px;
  height: 16px;
  width: 16px;
  vertical-align: middle;
  position: relative;
  bottom: 4px;
}

.option-check {
  margin: 5px 0;
}

#mobile-result-link {
  margin-top: 0.5em;
  font-size: 1.1em;
}

.no-mobile-results {
  color: #bbbbbb;
  font-style: italic;
  font-size: 0.9em;
}

ul.share-buttons {
  list-style: none;
  padding: 0;
}

ul.share-buttons li {
  display: inline;
  font-size: 1em;
  color: #676767;
  vertical-align: middle;
}

ul.share-buttons .sr-only {
  position: absolute;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0;
  border: 0;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.btn-ranks {
  font-size: 18px;
  color: #415364;
  background-color: #eee;
  padding: 12px 14px;
}

.btn-ranks:hover {
  color: #ffffff;
  background-color: #00a7e1;
}

.btn-ranks-active {
  color: #ffffff;
  background-color: #0069b5;
}

.ranks-logo-image {
  margin: 1em 2em;
  max-width: 135px;
}

.ranks-car-image {
  margin: 0.85em 1.5em 0.85em 0.75em;
  max-width: 240px;
}

.brand-car-image {
  margin: 0.85em 1.5em 0.85em 0.75em;
  max-width: 300px;
}

.ranks-top-container {
  margin: 1em 0;
  padding: 0;
  display: flex;
  border: 1px solid #eee;
  border-radius: 4px;
  align-items: center;
  justify-content: center;
}

.ranks-top-container:hover {
  background-color: #fafafa;
  border: 1px solid #f4f4f5;
}

.ranks-top-img {
  display: table-cell;
}

.ranks-top-text-title {
  margin: 0;
  padding: 0;
  color: #111;
  font-size: 1.4em;
  font-weight: bold;
  text-decoration: none;
}

.ranks-top-text-title a {
  color: #111;
  text-decoration: none;
}

.ranks-top-text {
  display: table-cell;
  padding-right: 0.25em;
}

.ranks-table {
  margin: 1em 0;
}

.ranks-top-title {
  font-size: 1.5em;
  font-weight: bold;
}

.ranks-top-sub-title {
  margin: 1.2em 0 0.9em 0;
  font-size: 1.3em;
  font-weight: bold;
}

.ranks-buttons {
  margin: 1.5em 0 -1em 0;
}

.ranks-page-sub-title {
  font-size: 0.85em;
}

.top-link {
  margin: 1.5em 0;
}

.top-link a {
  width: 100%;
  color: #0069b5;
  text-decoration: none;
  font-size: 1.4em;
}

.info-box p {
  font-size: 1em;
}

.info-box h4 {
  font-size: 1.4em !important;
  font-weight: bold;
}

.depreciation-text {
  margin: 24px 0;
}

.ranks-intro p,
.depreciation-text p,
.cto-content p {
  font-size: 18px;
}

.cto-content h2 {
  color: #4a495c;
  font-weight: 700;
  font-size: 24px;
  line-height: normal;
  font-style: normal;
  font-family: Inter;
}

.depreciation-text h2 {
  margin: 0 0 0.5em 0;
  font-size: 1.3em;
}

.footer-right {
  padding-left: 2em;
  max-width: 340px;
}

.footer-social-links {
  margin: -1em 0 0 0;
  padding: 1em;
}

.home-news-link p {
  font-size: 1.4em;
  margin: 1em 0 -1.5em 0;
}

.compare-to-links {
  font-size: 1.1em;
  margin: 0.5em 0;
}

.calc-inputs {
  margin: 1em 0;
  align-self: end;
}

.required-star {
  color: #00a7e1;
  font-size: 0.9em;
}

.compare-chart-legend {
  margin: -1em 0 0 0;
  padding: 0;
  text-align: center;
}

.dvc-legend {
  width: 12px;
  height: 12px;
  border-radius: 6px;
  display: inline-block;
}

.dvc-legend-text {
  margin: 0 1em 0 0.25em;
  display: inline-block;
  font-size: 0.9em;
  color: #333;
}

.photos-title {
  margin: 1em 0 -0.75em 0;
}

.blog-car-photo {
  width: 100%;
  margin-bottom: 0.5em;
}

.toc,
.toc-blog {
  display: table;
  margin-bottom: 1em;
  padding-left: 2em;
}

.toc li,
.toc li a {
  font-size: 18px;
}

.toc-blog li,
.toc-blog li a {
  font-size: 1em;
}

.cto-ul {
  display: table;
  margin: 0 auto 1em auto;
  font-size: 1.3em;
}

.cto-ul li,
.cto-ul li a {
  font-size: 1em;
}

.treemap {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  height: 670px;
}

.treemap .node {
  padding: 0.75em 1em;
  margin: 0;
  font-size: 18px;
  overflow: hidden;
  text-align: left;
  display: block;
  color: white;
  position: absolute;
}

.treemap .node:first-child {
  display: none;
}

.treemap .node:hover {
  background: #75aec6 !important;
  transition: background 0.25s;
}

.treemap .node a {
  color: #000;
  text-decoration: none;
}

.cto-photo-box {
  padding: 0;
  border: 1px #f4f4f5 solid;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 5px 0 rgba(0, 0, 0, 0.08);
  background-color: #ffffff;
  border-radius: 16px;
  position: relative;
}

.cto-metric-left {
  text-align: left;
}

.cto-metric-right {
  text-align: right;
}

.carchex-promo {
  margin: 1.5em 0;
  height: 300px;
  width: 100%;
  border: 6px solid #2680b0;
  background: url("https://d2bq9obxtvkjtt.cloudfront.net/images/site/carchex-bg.jpg");
}

.carchex-promo-title {
  margin: 0.75em 1em 2em 33%;
  color: #fff;
  font-size: 1.4em;
  font-weight: bold;
}

.carchex-promo-text {
  margin: 1em 0 1em 40%;
  color: #000;
  font-size: 1em;
}

.carchex-green-check {
  color: #41ad49;
}

.carchex-button {
  background-color: #ce0404;
  padding: 8px 16px;
  margin: 0 0 0 50%;
  border-radius: 8px;
  font-size: 1.2em;
  color: #fff;
  border: none;
  opacity: 0.9;
}

.carchex-logo {
  display: inline-block;
  margin: -0.5em 0 0 5em;
  text-align: right;
  width: 120px;
}

.carchex-blog {
  font-size: 0.7em;
}

.carchex-blog .carchex-logo {
  width: 80px;
}

/* start slider */

#carousel {
  position: relative;
  width: 100%;
  margin: 0 auto;
}

#slides {
  overflow: hidden;
  position: relative;
  width: 100%;
}

#slides ul {
  list-style: none;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
}

#slides li {
  width: 100%;
  float: left;
  text-align: center;
  position: relative;
  font-family: lato, sans-serif;
}

/* Styling for prev and next buttons */
.btn-bar {
  max-width: 346px;
  margin: 0 auto;
  display: none;
  position: relative;
  top: 40px;
  width: 100%;
}

#buttons {
  padding: 0 0 5px 0;
  float: right;
}

#buttons a {
  text-align: center;
  display: block;
  font-size: 50px;
  float: left;
  outline: 0;
  margin: 0 60px;
  text-decoration: none;
  display: block;
  padding: 9px;
  width: 35px;
}

a#prev:hover,
a#next:hover {
  color: #fff;
  text-shadow: 0.5px 0px #b14943;
}

.quote-phrase,
.quote-author {
  display: table-cell;
  vertical-align: middle;
  padding: 5px 20px;
}

.quote-phrase {
  height: 120px;
  font-size: 24px;
  font-style: italic;
}

.quote-marks {
  font-size: 30px;
  padding: 0 3px 3px;
  position: inherit;
}

.quote-author {
  font-style: normal;
  font-size: 20px;
  height: 30px;
}

.quoteContainer,
.authorContainer {
  display: table;
  width: 100%;
}

.gate {
  display: none;
}

.gated {
  height: 600px;
  overflow-y: hidden;
  position: relative;
}

.gated .gate {
  background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
  display: block;
  height: 600px;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}

.gate_cta {
  background: #0069b5;
  border-radius: 6px;
  margin: 0 auto;
  max-width: 440px;
  padding: 0.25em 1.5em 1em 1.5em;
  position: relative;
  top: 60%;
  text-align: center;
  transform: translateY(-50%);
  width: 100%;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.8), 0 3px 5px 0 rgba(0, 0, 0, 0.1);
}

.gate_cta button {
  background: #3197d6;
  border: none;
  border-radius: 4px;
  color: #fff;
  display: block;
  font-size: 18px;
  margin: 0 auto 18px;
  padding: 13px 33px;
}

.gate_cta .gate-skip {
  color: #93a1af;
  display: inline-block;
  font-size: 12px;
  font-weight: 300;
  text-decoration: none;
}

.gate_cta h3 {
  color: #fff;
  font-size: 2em;
  font-weight: 600;
  margin-bottom: 0;
  text-align: center;
}

.gate_cta input {
  border: 1px solid #d6dde3;
  border-radius: 2px;
  font-size: 18px;
  margin-bottom: 23px;
  padding: 13px;
  width: 100%;
}

.gate_cta p {
  color: #fcfcfc;
  font-size: 1em;
  margin-bottom: 23px;
  text-align: center;
}

.ce-grade {
  width: 144px;
  height: 144px;
  color: white;
  font-size: 50px;
  font-weight: 800;
  line-height: 144px;
  text-align: center;
  background-color: #eaeaeb;
  border-radius: 16px;
}

.ce-grade-info {
  margin: 2em 4em;
}

.ce-grade-desc {
  padding-left: 4em;
}

.dealer-breadcrumb {
  margin: 2em 0 -2em 0.25em;
  padding-bottom: 0.5em;
  color: #999;
}

.other-costs-title {
  margin: 0 0 -0.75em 0;
}

.dealer-listing-left {
  margin-top: 0.75em;
}

.dealer-listing-middle {
  margin-top: -0.25em;
}

.car-info-table {
  padding: 0;
  margin: 0;
  font-size: 1.2em;
}

.nav-select-options {
  height: 44px;
  width: 111px;
  padding: 0 4px;
  margin: auto 1px;
  font-size: 14px;
  font-weight: 300;
  border: 1px solid #7a7884;
  border-radius: 4px;
  background-color: white;
  color: #7a7884;
}

.nav-select-submit {
  height: 44px;
  width: 96px;
  margin: auto 1px;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  border: 1px solid #0069b5;
  color: #0069b5;
  border-radius: 8px;
  background-color: transparent;
}

.footer-copy {
  margin-top: 10px;
}

th {
  font-weight: normal;
}

.content-box h4 {
  font-weight: bold;
  font-size: 24px;
  line-height: 32px;
}

.content-box {
  margin: 24px 0;
  padding: 0;
}

#calculator {
  display: block;
}

.select-grid-3,
.select-grid-4,
.select-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 16px;
}

.select-grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.select-grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.form-control {
  font-size: 14px;
  display: flex;
  height: 48px;
  padding: 8px 24px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 8px;
  border: 1px solid var(--Neutral-N-40, #c9c9cc);
  background: var(--Secondary-White-100, #fff);
  appearance: none !important;
  background: #fff !important;
  background-image: url(https://caredge.com/wp-content/uploads/2024/06/angle-down.png) !important;
  background-repeat: no-repeat !important;
  background-position-x: 95% !important;
  background-position-y: 50% !important;
  background-size: 12px !important;
}

.form-control-text {
  font-size: 14px;
  display: flex;
  height: 48px;
  padding: 8px 24px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 8px;
  border: 1px solid var(--Neutral-N-40, #c9c9cc);
  background: var(--Secondary-White-100, #fff);
  appearance: none !important;
  background: #fff !important;
  width: 100%;
}

.calculator-fields {
  margin-bottom: 8px;
}

.select-grid-3,
.select-grid-4,
.select-grid div div {
  text-transform: uppercase;
  font-size: 14px;
  color: #4a495c;
  margin-bottom: 4px;
  letter-spacing: 1.6px;
}

h3 {
  font-weight: bold;
  font-size: 24px;
  margin: 24px 0;
}

.mpg-table th {
  width: 20%;
}

.mpg-table td {
  height: 88px;
  vertical-align: middle !important;
  font-size: 16px;
}

.mpg-table td:nth-child(n + 3) {
  color: #0069b5;
}

.cta-blue,
.cta {
  border-radius: 2px;
  background: #ffecd1;
  padding: 40px;
  text-align: left;
}

.cta.blue {
  background: #dcf1f9;
}

.cta div:nth-child(1) {
  font-weight: bold;
  font-size: 24px;
  margin-bottom: 12px;
  max-width: 600px;
}

.cta div:nth-child(2) {
  font-size: 18px;
}

.cta form {
  margin-top: 8px;
}

.cta input,
.cta select {
  height: 44px;
  font-size: 14px;
  border: 1px solid #7a7884;
  border-radius: 4px;
  background-color: white;
  color: #7a7884;
  padding: 0 12px;
  margin-right: 12px;
}

.top-ce-bar {
  width: 100%;
  height: 60px;
  padding: 20px;
  background: #0169ff;
  border-bottom: 1px #c9c9cc solid;
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
  line-height: 21px;
}

.top-ce-bar a {
  color: #ffffff;
}

.top-ce-bar-left {
  padding-left: 10px;
  display: inline-block;
  float: left;
}

.top-ce-bar-right {
  display: inline-block;
  float: right;
}

.top-ce-bar-center {
  display: inline-block;
  float: center;
  text-align: center;
  width: 100%;
}
.pillar-content-wrapper {
  padding: 0;
}

.pillar-title {
  margin-top: 0px;
  color: #343243;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.pillar-sub-title {
  margin: 20px 0 10px 0;
  color: #343243;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.pillar-text {
  color: #474747;
  line-height: 1.5;
}

.pillar-related-compare-title {
  color: #676767;
  font-size: 16px;
  font-weight: 600;
}

.pillar-related-compare {
  color: #474747;
  line-height: 2;
  font-weight: 300;
}

.pillar-related-article-title {
  padding-top: 24px;
  color: #474747;
  font-size: 18px;
  font-weight: 600;
}

.pillar-related-article-title a:hover {
  text-decoration: underline;
}

.pillar-related-thumb {
  width: 180px;
  height: 140px;
  margin: 10px 0;
  border-radius: 16px;
}

.pillar-dark-links a {
  text-decoration: none;
  color: #474747;
}

.pillar-dark-links a:hover {
  text-decoration: underline;
}

.pillar-grey-box {
  padding: 16px;
  background-color: #f7f7f7;
  border-radius: 16px;
}

.pillar-button {
  background-color: #0169ff;
  padding: 12px 24px;
  margin: 16px 0;
  border-radius: 8px;
  font-size: 16px;
  color: #fff;
  border: none;
  opacity: 0.9;
  font-style: normal;
  font-weight: 700;
  line-height: 22.86px;
  text-align: center;
  font-family: Inter;
}

.calc-title,
.calc-disclaimer {
  color: #6b6b6b;
  margin: 12px 0 6px 0;
}

.pillar-table-border-none {
  border-collapse: collapse;
  border: none;
}

.pillar-table-border-none td {
  border: 1px solid #dedede;
  padding: 16px !important;
}

.pillar-table-border-none th {
  border: none;
}

.pillar-table-border-none tr:first-child td {
  border-top: none;
  padding: 16px !important;
}

.pillar-table-border-none tr:last-child td {
  border-bottom: none;
  padding: 16px !important;
}

.pillar-table-border-none tr td:first-child {
  border-left: none;
  padding: 16px !important;
}

.pillar-table-border-none tr td:last-child {
  border-right: none;
  padding: 16px !important;
}

.pillar-related-box {
  width: 96%;
  padding: 16px;
  margin: 12px 0;
  border: 1px solid #cccccc;
  border-radius: 16px;
}

.pillar-related-wrapper a {
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  color: #474747;
}

.pillar-related-wrapper a:hover {
  text-decoration: underline;
}

.pillar-fa-icons {
  font-size: 18px;
}

.pillar-related-link {
  line-height: 2.5;
}

.pillar-related-subtext {
  font-size: 12px;
  color: #757575;
  font-weight: 400;
}

.pillar-model-image-small {
  border-radius: 16px;
  width: 240px;
}

.pillar-fa-chevron-right {
  color: #0169ff;
  font-size: 15px;
  vertical-align: middle;
  font-weight: 400;
  margin-left: 6px;
}

.clerk-initials {
  color: #004171;
  background: #9fd4ff;
  border-radius: 50%;
  height: 36px;
  width: 36px;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  line-height: 36px;
}

.calc-labels {
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 9999px) {
  .bigScreen {
    display: block;
  }

  .smallScreen {
    display: none;
  }

  .bigInline {
    display: inline-block;
  }
}

@media screen and (max-width: 1200px) {
  .carchex-promo {
    margin: 1.5em 0;
    height: 330px;
    width: 100%;
    border: 6px solid #2680b0;
    background: url(https://d2bq9obxtvkjtt.cloudfront.net/images/site/carchex-bg-sm.jpg);
  }

  .carchex-promo-title {
    margin: 0.5em 1em 2em 1em;
    color: #fff;
    font-size: 1.4em;
    font-weight: bold;
  }

  .carchex-promo-text {
    margin: 1em 2em;
    color: #000;
    font-size: 1em;
  }

  .carchex-button {
    background-color: #ce0404;
    padding: 8px 16px;
    text-align: center;
    margin: 1em 2em;
    border-radius: 8px;
    font-size: 1.2em;
    color: #fff;
    border: none;
    opacity: 0.9;
  }

  .carchex-logo {
    display: inline-block;
    margin: 0.5em 1em 2em 0;
    text-align: right;
    width: 120px;
    float: right;
  }
}
/* mobile change starts here 1120 changes to 1230*/
@media screen and (min-width: 1230px) {
  .navbar {
    width: 100%;
    margin: 0 auto;
  }

  .main-nav {
    display: flex;
    margin: 0 150px 0 0;
    flex-direction: row;
    line-height: 24px;
    gap: 5px;
  }

  .main-nav li {
    margin: 0;
    border: none;
  }

  .nav-select {
    position: absolute;
    top: 0;
    right: 10px;
    margin-top: 0;
    height: 100%;
    display: flex;
    align-items: center;
  }

  .mm-options {
    margin-right: 1px;
  }

  .logo,
  .logo a {
    margin-top: 0;
    display: inline-block;
    font-size: 24px;
    text-decoration: none;
    width: 140px;
    color: #fff !important;
    display: flex;
    justify-content: flex-end;
    width: 100%;
  }

  .logo:hover,
  .nav-links:hover {
    color: rgba(255, 255, 255, 1);
  }
}

@media screen and (max-width: 1230px) {
  #dealer-invoice a::after {
    position: absolute;
    top: 15px;
    left: 212px;
    right: 0px;
    width: 31px;
    display: flex;
    padding: 6px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #e71b00;
    content: "FREE";
    color: #fff;
    font-family: Inter;
    font-size: 8px;
    font-style: normal;
    font-weight: 800;
    line-height: 100%;
  }
  .nav-select {
    width: 100%;
    display: inline-block;
    text-align: center;
  }

  .nav-select-submit {
    vertical-align: top;
    height: 30px !important;
    width: 100px !important;
    margin: 0 0 -30px 0 !important;
    padding: 0 10px;
    font-size: 14px !important;
    font-weight: 600;
    border: 1px solid #0069b5;
    color: #0069b5;
    border-radius: 4px;
    background-color: #ffffff;
  }

  .main-nav {
    margin-right: 0;
  }

  .main-nav li {
    margin-left: -10px;
    padding: 8px;
    border-bottom: 1px solid #0051c3;
    width: 95%;
  }

  .nav-links {
    color: #ffffff !important;
    font-size: 18px !important;
    font-weight: 600 !important;
  }

  .nav-dropdown-content a:hover {
    display: none;
  }

  .bigScreen,
  .smallScreen {
    display: none;
  }

  .medScreen {
    display: block;
  }
}

.reportCta {
  display: flex;
}

.reportCta > :first-child {
  background: #a1cefb;
  padding: 16px;
}

.reportCta > :first-child > :first-child {
  font-weight: bold;
  font-size: 1.6em;
  margin-bottom: 12px;
  line-height: 1.1em;
  color: black;
  width: 240px;
}

.reportCta iframe {
  margin-bottom: -60px;
}

.reportCta > :first-child > :nth-child(2) {
  font-size: 1.1em;
}

.reportCta img {
  width: 100%;
}

.reportCtaImages {
  display: flex;
  align-items: center;
}

.reportCtaImages img:first-child {
  display: none;
}

.listings-cta,
.report-may-cta,
.buying-cta {
  display: flex;
}

.buying-cta {
  justify-content: space-between;
}

.listings-cta img {
  width: 250px;
}

.report-may-cta img {
  width: 240px;
  margin-right: 24px;
}

.buying-cta-data {
  text-align: left;
}

.buying-cta img {
  width: 300px;
  margin-left: 24px;
}

.listings-cta-data > :first-child {
  font-weight: bold;
  font-size: 24px;
  margin-top: 30px;
}

.buying-cta-data > :first-child {
  font-weight: bold;
  font-size: 22px;
  margin-top: 8px;
}

.buying-cta-data span {
  color: #0169ff;
}

.report-may-cta-data > :first-child {
  font-weight: bold;
  font-size: 24px;
  margin-top: 15px;
}

.listings-cta-data > :nth-child(2) {
  font-family: Inter;
}

.listings-cta select {
  padding: 8px 12px;
  height: 46px;
  font-size: 14px;
  margin: 0;
  margin-right: 12px;
  width: 180px;
}

.listings-cta form input[type="submit"] {
  margin-left: 8px;
}

.listings-cta form {
  display: flex;
  align-items: center;
  margin-top: 12px;
}

@media (max-width: 764px) {
  .email-ad-container {
    display: none;
  }

  .reportCta {
    flex-direction: column;
  }

  .reportCtaImages img:first-child {
    display: block;
  }

  .reportCtaImages img:last-child {
    display: none;
  }
}

@media (max-width: 1200px) {
  #home-search-wrapper {
    margin: 0;
  }

  .partner-listing-left {
    width: 30%;
  }

  .partner-listing-middle {
    width: 50%;
  }

  .news-list-inner {
    margin-left: 2em;
  }
}

@media (max-width: 992px) {
  .select-grid-3,
  .select-grid-4,
  .select-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .home-video {
    margin: 0 0 2em 0;
  }

  .ce-grade {
    margin: 12px 0;
  }

  .ce-grade-info-letter {
    text-align: center;
    margin: 1em 25%;
  }

  .ce-grade-info {
    margin: 2em 2em;
  }

  .ce-grade-desc {
    padding-left: 0;
  }

  header .logo {
    display: table-cell;
    margin: 16px 16px 0 0;
  }

  .bigMenu {
    font-size: 14px;
  }

  .partner-listing-heading {
    margin: 1em 0 0.5em 0;
  }

  .partner-listing-zip-form {
    font-size: 0.9em;
    margin: -0.5em 0 0.75em 0;
    padding: 0 0 0 0;
  }

  .partner-listing-middle {
    text-align: left;
  }

  #home-search-wrapper {
    margin: 0;
  }

  .listing-main,
  .listing-right {
    text-align: center;
  }

  footer .copyright {
    text-align: center;
  }

  .rankings-list {
    text-align: center;
    font-size: 1.2em;
  }

  .rankings-small {
    display: block;
  }

  .rankings-sub-title {
    margin-top: 15px;
  }

  .car-models,
  .rank-links,
  .related_models {
    font-size: 1.3em;
  }

  .car-logo {
    width: 100px;
    margin: 0;
  }

  .best-to-buy {
    font-size: 0.8em;
  }

  .best-to-buy-bold {
    margin-bottom: 1em;
  }

  .all-nameplates {
    margin: 0;
  }

  .car-listing-info {
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0;
  }

  .car-listing-details,
  .car-listing-promo {
    width: 100%;
    text-align: center;
  }

  .news-box {
    margin: 0;
    padding: 0.5em 1.5em;
    box-shadow: none;
    width: 100%;
  }

  .content-box,
  .side-box {
    margin: 0;
    padding: 0.5em 2em;
    box-shadow: none;
    width: 100%;
  }

  .content-box {
    margin-bottom: 2em;
  }

  .other-thumb {
    margin: 0.5em 0;
    width: 300px;
  }

  .side-box {
    margin: 2em 0;
  }

  .info-box {
    margin: 0.75em;
  }

  .make-models {
    display: block;
    margin: 0 0 0.75em 0;
    font-size: 1.75em;
  }

  .make-logo {
    width: 140px;
  }

  .chart-title {
    margin: 0;
    font-size: 40px;
    font-family: inter !important;
    font-style: normal;
    font-weight: 700;
    line-height: 52px;
    color: #4a495c;
    padding-left: 15px;
    padding-bottom: 40px;
  }

  .section-title {
    margin: 0.5em 1em;
    padding: 0;
    font-family: "Inter", Helvetica, Arial, Lucida, sans-serif;
    font-weight: 900;
    font-size: 2em;
    color: #4a495c;
  }

  .chart-box {
    margin: 0;
    padding: 0.25em 0 0 0.75em;
    box-shadow: none;
    width: 100%;
  }

  .car-photo-box {
    margin: 1em 0.5em;
    padding: 0;
    box-shadow: none;
    width: 97%;
  }

  .news-sidebar {
    margin: 2em 0;
    padding: 0;
    width: 100%;
    text-align: center;
  }

  .news-li-item {
    padding: 0 5px 0 10px;
  }

  .news-footer,
  div.news-li-item {
    text-align: left;
  }

  .news-thumb {
    margin: 0 1em;
    max-width: 280px;
  }

  .page-title,
  .page-sub-title {
    text-align: center;
    margin: 0;
    padding: 0 1em 0.5em 1em;
  }

  .news-listing-containter {
    margin: 0;
    padding: 0 1em 0.5em 1em;
  }

  .first-name {
    padding-left: 12px;
    padding-right: 15px;
  }

  .last-name {
    padding-left: 0;
    padding-right: 22px;
  }

  .home-form,
  .home-news {
    margin: 1.5em 0 1.5em 0;
    padding: 2px 6px;
    width: 100%;
    box-shadow: none;
    text-align: center;
    font-size: 1.2em;
    border-right: none;
    border-left: none;
  }

  .home-ad {
    min-height: 0;
  }

  .home-blocks {
    margin: -1.5em 0 0.5em 0;
  }

  .car-logo-image {
    max-width: 240px;
    margin: 0;
    width: 52px;
    height: 39px;
  }

  .right-side {
    padding: 0 15px;
  }

  .compare-title {
    margin: 0 0 0.5em 0;
    padding: 0 1em;
  }

  .compare-select-title {
    margin-top: 0;
    font-size: 1.4em;
  }

  .compare-select-wrapper {
    margin: 0;
  }

  .compare-text {
    margin: 0.5em;
  }

  .compare-about-wrapper {
    margin: 1.5em 0;
  }

  .compare-comparisons-title {
    font-size: 1.4em;
    margin-top: 1.25em;
  }

  .compare-comparisons {
    font-size: 1.3em;
    margin: 0.75em 0;
  }

  .other-news-thumb {
    margin: 0;
    width: 120px;
  }

  a.other-news-title {
    color: #415364;
    font-size: 1.4em;
    font-weight: bold;
  }

  .other-news-more {
    margin-top: 1em;
    font-size: 2em;
    font-weight: bold;
  }

  .lform-split-left {
    padding-left: 0;
    padding-right: 0;
  }

  .lform-split-right {
    padding-left: 0;
    padding-right: 0;
  }

  #listings-search-title {
    margin: 0.5em;
    font-weight: bold;
  }

  .seller-phone {
    text-align: center;
  }

  #home-research {
    margin-bottom: 2em;
  }

  .home-ranks {
    margin: 1.5em 0;
  }

  .home-ranks-right-border {
    border: none;
  }

  .home-news-thumb-container {
    margin-bottom: 2em;
    background-position: top;
  }

  .home-ranks-item {
    text-align: center;
  }

  .ranks-buttons {
    margin: 0 0 1em 0;
    font-size: 0.9em;
  }

  .ranks-buttons-group {
    margin: 1em 0;
  }

  .ranks-top-title {
    margin: 1em 0 1em 0;
    font-size: 1.3em;
  }

  .ranks-top-sub-title {
    margin: 2em 0 1em 0;
    font-size: 1.1em;
  }

  .ranks-top-text {
    padding: 0.5em 0 0.5em 1em;
    font-size: 0.9em;
  }

  .ranks-car-image {
    margin: 0.5em 0 0.5em 0.5em;
    width: 120px;
  }

  .brand-car-image {
    margin: 0.5em 0 0.5em 0.5em;
    max-width: 120px;
  }

  .ranks-logo-image {
    width: 200px;
    margin: 0.5em 0 0.5em 0.5em;
  }

  .footer-left {
    padding: 2em 1em;
  }

  .footer-right {
    padding: 2em 1em;
    margin-bottom: 3em;
  }

  .footer-center {
    padding: 0 2em;
    text-align: left;
  }

  .home-news-link p {
    margin: 0.75em 0 -0.75em 0;
  }

  .compare-chart-legend {
    margin: 1em 0 2em 0;
  }

  .side-news-thumb-container {
    min-height: 300px;
    font-weight: bold;
    border-radius: 16px;
  }

  .right-wrapper {
    margin: 0 2em;
  }

  .cto-metric-left {
    text-align: center;
  }

  .cto-metric-right {
    text-align: center;
  }

  .cto-ul li {
    margin-left: -1em;
    font-size: 0.85em;
  }

  .dealer-breadcrumb {
    margin: 0.5em 0 0.5em 1.25em;
    padding-bottom: 0.5em;
  }

  .other-costs-title {
    margin: 1em 0 0.5em 0;
  }

  .dealer-listing-middle {
    margin-top: 1em;
  }
}

@media (max-width: 767px) {
  .partner-listing-column {
    width: 100%;
    text-align: center;
  }

  partner-listing-left {
    margin: 0 2em;
    text-align: center;
  }

  .partner-listing-middle {
    text-align: center;
  }

  .partner-listing-photo-img {
    max-width: 280px;
    max-height: 300px;
    margin: 0;
    padding: 0;
  }

  .partner-listing-right {
    display: none;
  }

  .partner-listing-wrapper:hover {
    background-color: #ffffff;
  }

  .faq {
    margin: 0 1.5em;
  }

  .grey_strip ul li {
    margin-bottom: 25px !important;
  }

  .bigScreen,
  .medScreen {
    display: none;
  }

  .smallScreen {
    display: block;
  }

  .bigInline {
    display: none;
  }

  .listing-link {
    margin: 5px 0 10px 0;
  }

  .vehicle-lookup {
    border: none;
    box-shadow: none;
  }

  .home-models {
    text-align: center;
  }

  .pull-left-160 {
    margin-left: 0;
  }

  .car-models,
  .rank-links {
    font-size: 1.6em;
  }

  .model-links {
    font-size: 1.3em;
  }

  .best-to-buy {
    font-size: 1em;
  }

  .car-listing-col {
    width: 100%;
    padding: 0;
    margin: 0;
  }

  .car-listing-box {
    padding: 4px;
    width: 100%;
    box-shadow: none;
    text-align: center;
    font-size: 1.2em;
  }

  .container {
    padding-left: 0;
    padding-right: 0;
  }

  .car-listing-trim {
    padding: 0;
    margin: 10px;
  }

  .car-listing-price {
    padding: 0;
    margin: 5px;
  }

  .car-listing-detail {
    white-space: normal;
  }

  .first-name,
  .last-name {
    padding-left: 6px;
    padding-right: 18px;
  }

  .footer-logo {
    max-width: 300px;
    margin-bottom: 2em;
  }

  .home-process {
    width: 100%;
    padding: 2em 1em;
  }

  .best-to-buy,
  .best-to-buy-bold {
    font-size: 1.6em;
  }

  .car-logo {
    width: 200px;
    margin: 5px;
  }

  .best-models {
    padding: 2em 1em;
  }

  .nuv-box,
  .car-photo-box {
    padding: 1em;
  }

  #DepreciationTableSmall {
    font-size: 1em;
  }

  .news-ul-no-bullets {
    margin: 0;
    padding: 0;
  }

  .news-ul-no-bullets li {
    margin-bottom: 3em;
  }

  .grid-listing {
    font-size: 1.4em;
    margin: 10px 0;
    padding: 16px 12px;
    border: 1px #f4f4f5 solid;
    border-radius: 0;
    box-shadow: none;
    background-color: #ffffff;
  }

  .grid-listing-photo {
    display: block;
    max-width: 372px;
    max-height: none;
    width: 100%;
    margin: 0 auto 10px auto;
    border-radius: 0;
  }

  .rankings-sub-title {
    font-size: 1.8em;
  }

  .about-numbers,
  .info-box p {
    font-size: 1.3em;
  }

  .news-li-item {
    padding-top: 1em;
    font-size: 1.3em;
  }

  .compare-select-title {
    margin-top: 1.75em;
    font-size: 1.4em;
  }

  .compare-text {
    margin-bottom: 1em;
  }

  .compare-chart {
    margin: 1.5em 0;
  }

  .about-small {
    color: #999;
  }

  .news-wrapper {
    margin: 0;
  }

  .other-news-thumb {
    margin: 0 1em 0 0;
    width: 200px;
  }

  .other-news-more {
    margin: 0.5em 0;
  }

  a.other-news-title {
    color: #415364;
    font-size: 1.5em;
    font-weight: bold;
  }

  .other-news-date,
  a.other-news-date {
    font-size: 0.9em;
    color: #bbbbbb;
    font-style: italic;
  }

  #search-header-page {
    padding: 0.25em 0 0 0.5em;
    text-align: center;
  }

  #search-header-sort {
    margin-top: 1em;
    text-align: center;
  }

  .mega-title,
  .big-title {
    margin: 0 0 0.25em 0;
    padding: 0 0.25em;
  }

  .post-text {
    padding: 0 1em;
  }

  .form-control {
    font-size: 18px;
  }

  input[type="checkbox"],
  input[type="radio"] {
    padding: 10px;
    height: 20px;
    width: 20px;
  }

  .small-home-main {
    margin: -1.5em 0 -1em 0;
    background-color: #415364;
  }

  .other-news-mobile-link:hover {
    text-decoration: none;
  }

  .other-news-mobile-hr {
    margin: 0 4em 1em 4em;
    border-top: 1px solid #a2a9ad;
    text-align: center;
    opacity: 0.4;
  }

  .content-box,
  .chart-box,
  .nuv-box,
  .side-box {
    margin-left: 0;
    margin-right: 0;
    border: none;
    box-shadow: none;
  }

  .content-box,
  .nuv-box {
    max-width: 99%;
  }

  .chart-box {
    max-width: 97%;
    text-align: center;
  }

  .side-box-text a {
    font-size: 1.4em;
  }

  .side-title {
    font-size: 1.6em;
  }

  .side-box {
    padding-bottom: 1.5em;
  }

  .compare-to-links {
    font-size: 1.4em;
  }

  .footer-right {
    padding: 1em;
  }

  .footer-copy {
    padding: 1em 0;
  }

  .review-videos {
    max-width: 96%;
  }

  .photos-title {
    margin: 1em 0 -0.25em 0;
  }

  .car-info-table {
    padding: 0;
    margin: 0;
    font-size: 0.9em;
  }
}

@media (max-width: 520px) {
  .bestText,
  .bestYear,
  .bestBar {
    display: none;
  }

  .form-hero {
    background: #ffffff;
    background-color: #ffffff;
    min-height: 800px;
  }

  .form-hero .caption h1 {
    margin: -40px 0 0 0;
  }

  .form-hero .caption h2 {
    margin: 0 0 -20px 0;
  }

  .user-form {
    padding: 60px 10px 10px 0px;
    margin: 0 5px 0 0;
  }

  .to-dep-button {
    margin: 0 15px 0 5px;
  }

  .home-main {
    margin: 0;
    min-height: 140px;
    background-size: 150%;
  }

  .home-main-slogan {
    padding: 1em 0 0 0;
    margin: auto;
    font-size: 2.5em;
    color: #ffffff;
    font-weight: bold;
    text-shadow: 3px 3px 5px #000000;
    text-align: center;
  }

  .footer-logo {
    max-width: 300px;
    margin-bottom: 2em;
  }

  .u1-logo {
    max-width: 330px;
  }

  .home-ranks-item {
    font-size: 1.2em;
  }

  .news-list-thumb {
    max-width: 140px;
    margin: 0 1em 0 0;
  }

  .news-list-box,
  .news-list-box:hover {
    box-shadow: none;
    border: none;
    background-color: #faf9f9;
  }

  .news-list-box-text {
    height: 140px;
  }

  .news-list-box-title h2 {
    font-size: 1.3em;
    margin: 0 0 0.25em 0;
  }

  .news-list-box-summary p {
    font-size: 1.1em;
  }

  .other-news-mobile {
    margin: 1em 0 4em 0;
    padding: 0 1em;
  }

  .other-news-thumb {
    width: 120px;
  }

  .other-news-mobile-thumb {
    margin: 0;
  }

  .other-news-mobile-text {
    margin: 0;
    font-size: 0.9em;
  }

  .other-news-mobile-link:hover {
    text-decoration: none;
  }

  ul.share-buttons {
    margin-top: 2em;
  }

  ul.share-buttons li.bigScreen {
    display: none;
  }

  .chart-share {
    top: 2px;
    right: 10px;
  }

  .carchex-promo {
    margin: 1.5em 0;
    height: 360px;
    width: 100%;
    border: 6px solid #2680b0;
  }

  .carchex-promo-title {
    margin: 0.5em 1em 1em 1em;
    color: #fff;
    font-size: 1.1em;
    font-weight: bold;
    text-align: center;
  }

  .carchex-promo-text {
    margin: 1em;
    font-size: 0.9em;
  }

  .carchex-button {
    width: 80%;
    margin: 0 10%;
  }

  .carchex-logo {
    display: block;
    margin: 0.5em auto;
    width: 100px;
    float: none;
  }
}

@media (max-width: 414px) {
  .footer-logo {
    max-width: 280px;
    margin-bottom: 2em;
  }
}

@media (max-width: 360px) {
  .grey_strip li {
    display: block;
    width: 100%;
  }

  .div-home {
    margin: 30% 0 -100px 0;
  }

  .hero .caption h1 {
    padding-top: 40px;
  }

  .footer-logo {
    max-width: 240px;
    margin-bottom: 2em;
  }
}

@media screen and (max-width: 1480px) {
  .nav-select-options {
    height: 30px;
    width: 90px;
    padding: 0 2px;
    font-size: 12px;
    font-weight: 300;
  }

  .nav-select-submit {
    height: 30px;
    width: 72px;
    font-size: 12px;
  }

  .main-logo img {
    height: 30px;
  }

  .nav-links {
    font-size: 14px;
  }
}

select::-ms-expand {
  display: none;
}

/* Extended-warranty CSS start */
.warranty-widget-card {
  padding: 32px !important;
  max-width: 1140px;
  width: 100%;
  background: #ffffff;
  box-shadow: 0px 0px 1px rgba(48, 49, 51, 0.05),
    0px 4px 8px rgba(48, 49, 51, 0.1) !important;
  border-radius: 4px !important;
  border: none !important;
  margin-top: 64px;
}

.widget-text-padding {
  padding: 0 24px !important;
}

.title-text-h1 {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 700;
  font-size: 48px;
  line-height: 150%;
  color: #0069b5;
  margin-bottom: 0;
}

.title-text-h2 {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  font-size: 40px;
  line-height: 150%;
  color: #0069b5;
  margin-bottom: 32px;
}

.title-text-h3 {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 500;
  font-size: 36px;
  line-height: 150%;
  color: #0069b5;
  margin-bottom: 0;
}

.title-text-h4 {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  font-size: 32px;
  line-height: 150%;
  color: #0069b5;
}

.buy-insurance-how-it-works-card-title {
  color: #333333 !important;
}

.extended-page-title-subtext,
.testimonial-title {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 500;
  font-size: 24px;
  line-height: 150%;
  color: #333333;
}

.extended-page-title-subtext {
  margin-bottom: 32px;
}

.testimonial-title {
  margin-top: 32px;
  color: #0069b5 !important;
}

.extended-trust-container {
  margin-bottom: 32px;
}

.extended-trust-container > h5,
.title-text-h5,
.key-areas-coverage-subText,
.buy-insurance-subText {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 150%;
  color: #0069b5;
}

.key-areas-coverage-subText {
  font-weight: 500 !important;
  color: #333333 !important;
}

.buy-insurance-subText {
  color: #0069b5 !important;
}

.key-areas-coverage-subText > span {
  font-weight: 500 !important;
  color: #0069b5 !important;
}

.extended-trust-container > h6,
.road-assistance-text,
.road-assistance-subText,
.title-text-h6,
.electricity-note-title,
.buy-insurance-label {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 150%;
  color: #0069b5;
}

.buy-insurance-label {
  font-weight: 300 !important;
  color: #0069b5 !important;
}

.buy-insurance-input {
  padding: 14px 16px;
  gap: 8px;
  width: 100%;
  max-width: 343px;
  height: 64px;
  background: #ffffff;
  border: 1px solid #999999;
  border-radius: 8px;
  font-family: "Raleway";
  font-style: normal;
  font-weight: 300;
  font-size: 24px;
  line-height: 150%;
  color: #333333;
  outline: none;
  margin-top: 16px;
}

.buy-insurance-button {
  padding: 0px 24px;
  gap: 4px;
  width: 100%;
  max-width: 343px;
  height: 52px;
  background: #0069b5;
  border-radius: 8px;
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 150%;
  color: #ffffff;
  margin-bottom: 16px;
}

.buy-insurance-call-text {
  color: #0069b5 !important;
}

.buy-insurance-call-text > span {
  color: #0069b5 !important;
}

.buy-insurance-how-it-works-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 32px 16px;
  gap: 16px;
  width: 100%;
  background: #faf9f9;
  border-radius: 24px;
  margin: 32px 0;
}

.how-it-works-card-subText {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 150%;
  color: #333333;
  text-align: center;
}

.how-it-works-card-subText-width {
  max-width: 695px;
  width: 100%;
  margin: 32px 0 0 0;
}

.how-it-works-card-subText > a {
  color: #0069b5 !important;
}

.how-it-works-card-step-container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 32px;
  margin-top: 16px;
}

.how-it-works-card-step1,
.how-it-works-card-step2,
.how-it-works-card-step3,
.how-it-works-card-step4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  max-width: 215px;
  width: 100%;
}

.electricity-note-title,
.how-it-works-card-title {
  font-weight: 700 !important;
  color: #0069b5 !important;
}

.road-assistance-number {
  margin-top: 24px;
}

.road-assistance-subText {
  margin-top: 32px;
  color: #0069b5 !important;
}

.extended-trust-container > h5,
.extended-trust-container > p {
  margin-bottom: 24px;
}

.extended-trust-container > h6 {
  margin-bottom: 8px;
}

.extended-trust-container > p,
.need-extended-warranty-text,
.testimonial-text,
.coverage-highlights-items-text,
.key-areas-coverage-item-text,
.electricity-note-text,
.paragraph-text,
.how-it-works-card-title {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  color: #333333;
}

.paragraph-text > a {
  color: #0069b5 !important;
}

.key-areas-coverage-item-text {
  margin-top: 16px;
  max-width: 800px;
  width: 100%;
}

.coverage-exclusions-text-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 800px;
  width: 100%;
  margin-top: 32px;
}

.testimonial-text {
  margin-top: 24px;
}

.road-assistance-text {
  margin-bottom: 0;
}

.coverage-highlights-items-text {
  color: #0069b5 !important;
  font-weight: 600 !important;
}

.road-assistance-container {
  min-width: 250px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.road-assistance-wrapper {
  display: flex;
  justify-content: space-between;
  margin-top: 64px;
}

.road-assistance-card,
.trust-text-card,
.need-extended-warranty-card,
.testimonial-card,
.coverage-highlights-card,
.warranty-coverage-details-card,
.key-areas-coverage-card,
.coverage-exclusions-card,
.buy-insurance-card {
  padding: 64px;
  max-width: 1140px;
  width: 100%;
  background: #ffffff;
  box-shadow: 0px 0px 1px rgba(48, 49, 51, 0.05),
    0px 4px 8px rgba(48, 49, 51, 0.1);
  border-radius: 4px;
  margin-bottom: 24px;
}

.buy-insurance-card,
.buy-insurance-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.buy-insurance-form {
  margin-top: 32px;
  gap: 16px;
}

.assistance-card {
  padding: 32px;
  gap: 8px;
  width: 100%;
  background: #faf9f9;
}

.need-extended-warranty-card {
  background: #0069b5 !important;
}

.testimonial-card {
  background: #0069b5 !important;
}

.color-white {
  color: #ffffff !important;
}

.need-extended-warranty-text-container {
  width: 250px;
}

.need-extended-warranty-text-wrapper {
  display: flex;
  justify-content: space-between;
  margin-top: 88px;
}

.view-details-text {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-size: 20px;
  line-height: 150%;
  display: flex;
  justify-content: center;
  text-decoration-line: underline;
  color: #0069b5;
  margin-top: 64px;
}

.testimonial-text-card {
  padding: 32px 32px 72px;
  background: #ffffff;
  border-radius: 16px;
}

.coverage-image-style {
  width: 100%;
}

.coverage-highlights-items-wrapper {
  display: none;
}

.coverage-highlights-items-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 8px 0px;
  gap: 8px;
  max-width: 311px;
  width: 100%;
  background: #faf9f9;
  border: 1px solid #b3b3b3;
  border-radius: 8px;
  margin: 32px 0;
}

.key-areas-coverage-item-card {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 24px;
  max-width: 1012px;
  width: 100%;
  background: #faf9f9;
  border-radius: 4px;
  margin-top: 32px;
}

.electricity-note-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 32px;
  max-width: 1012px;
  width: 100%;
  background: #faf9f9;
  border-radius: 4px;
  margin-top: 32px;
}

@media (max-width: 1024px) {
  .road-assistance-wrapper {
    margin-top: 32px !important;
    flex-direction: column;
    gap: 32px;
  }

  .need-extended-warranty-text-wrapper {
    margin-top: 48px !important;
    flex-direction: column;
    gap: 16px;
  }

  .coverage-image-style {
    display: none !important;
  }

  .road-assistance-card,
  .trust-text-card,
  .need-extended-warranty-card,
  .testimonial-card,
  .coverage-highlights-card,
  .warranty-coverage-details-card,
  .key-areas-coverage-card,
  .coverage-exclusions-card,
  .buy-insurance-card {
    padding: 32px !important;
  }

  .coverage-highlights-items-wrapper {
    display: block;
  }
}

#getQuoteEstimateBtn {
  background-color: #0378cd !important;
  border-color: #0378cd !important;
}

.fade {
  opacity: 1 !important;
}

.popover > .arrow {
  border-width: 0px !important;
}

.popover-body {
  border: none !important;
}

.cBcBID {
  border: 1px solid #d9d9d9 !important;
  border-radius: 0.4rem !important;
  font-weight: 400 !important;
  font-size: 1.5rem !important;
  line-height: 165% !important;
}

.jLfClo {
  font-weight: 400 !important;
  font-size: 1.5rem !important;
  line-height: 165% !important;
}

.promotionBanner {
  text-align: center;
  background-color: #fbd037;
  font-size: 16px;
  font-weight: 600;
  line-height: 40px;
}

.promotionBanner > a {
  text-decoration: none;
  color: #4a495c;
}

.slidein {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 300px;

  height: 300px;
  background-color: #004171;
  font-family: Inter, sans-serif;
  background-image: url(https://d2bq9obxtvkjtt.cloudfront.net/images/site/slidein-bg.png);
  background-size: cover;
  padding: 32px;
  color: white;

  transform: translateX(300px);
  animation: slide 1s forwards;
  animation-delay: 2s;
}

.slidein-2 {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 300px;
  /*
  height: 300px;
  background-color: #004171;
  font-family: Inter, sans-serif;
  background-image: url(/images/site/slidein-bg.png);
  background-size: cover;
  padding: 32px;
  color: white;
*/
  transform: translateX(300px);
  animation: slide 1s forwards;
  animation-delay: 8s;
}

.slideinFast {
  animation-delay: 0.1s;
}

@keyframes slide {
  100% {
    transform: translateX(0);
  }
}

.slideinHeader {
  font-size: 25.61px;
  line-height: 28.5px;
  font-weight: 900;
}

.slideinHeader span {
  font-style: italic;
}

.slidein ul {
  list-style: none;
  padding: 0;
  margin: 16px 0 12px;
}

.slidein li {
  display: flex;
  align-items: center;
  margin-bottom: 6px;
  font-weight: 500;
  font-size: 11.38px;
}

.slidein li :first-child {
  margin-right: 4px;
}

.slidein form {
  display: flex;
  justify-content: space-between;
}

.slidein input {
  border-radius: 6px;
  outline: none;
  border: none;
}

.slidein input[type="email"] {
  width: 167px;
  padding: 8px 0 8px 16px;
  font-family: Inter, sans-serif;
  color: black;
}

.slidein input[type="submit"] {
  font-weight: 900;
  color: white;
  background-color: #0169ff;
  font-size: 11.38px;
  padding: 10px;
}

.slideinDisclaimer {
  font-size: 6.4px;
  margin-top: 6px;
}

.slideinDisclaimer a {
  color: white;
  text-decoration: underline;
}

.hiddenInput {
  width: 0;
  height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.slideinThanks {
  width: 171px;
  text-align: center;
  margin: 70px auto 0;
}

.slideinSubheader {
  font-weight: 500;
  font-size: 11.38px;
  margin-top: 8px;
}

.slideinClose {
  float: right;
  color: #666;
  display: inline-block;
  font-weight: bold;
  margin: 3px 3px 0 0;
}

.slideinClose:hover {
  cursor: pointer;
}

/* Promo Sliders */

.promo-slide {
  padding: 37px 30px;
  text-align: center;
  border-radius: 12.5px;
  border: none;
  background: #fdecaf;
  color: #004171;
  position: relative;
}

.slideinClose {
  position: absolute;
  top: 8px;
  right: 8px;
  cursor: pointer;
  user-select: none;
}

.promo-slide h5 {
  padding: 0 !important;
  text-align: center;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  text-transform: capitalize;
}

.promo-slide h5 span {
  color: #e71b00;
}

.promo-slide .text-container h5:nth-child(2) {
  width: 70%;
  margin: 10px auto 20px;
}

.promo-slide .text-container h5:nth-child(3) {
  width: 70%;
  margin: 0 auto;
}

.promo-slide .text-container h5:first-child {
  color: #004171;
  text-align: center;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.promo-slide .text-container h3 {
  color: #e71b00;
  text-align: center;
  font-family: Inter;
  font-size: 45px;
  font-style: normal;
  font-weight: 900;
  line-height: 96.667%;
  letter-spacing: -1px;
  text-transform: uppercase;
  padding: 0;
}

.promo-slide button {
  display: flex;
  padding: 6px 12px;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  background: #e71b00;
  color: #fdecaf;
  font-family: Inter;
  font-size: 15px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border: none;
  margin: 1rem auto 0;
  cursor: pointer;
  user-select: none;
}

.star-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #0169ff;
  font-size: 24px;
}

.icontainer {
  color: #0169ff;
  font-size: 52px;
}

.text-container {
  margin: 10px auto;
}

/* End Promo Sliders */

.left-container {
  padding-right: 24px;
}

.calculator-title {
  padding-top: 8px;
}

.logo-div {
  position: absolute;
  top: 16px;
  left: 16px;
  border-radius: 10000px;
  background: #fff;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Pillar page New Banner CSS */
.new-banner {
  display: flex;
  padding: 40px 32px;
  gap: 60px;
  border-radius: 16px;
  background: #f6fbff;
}

.banner-img {
  width: 27.25%;
  height: 190px;
}

.banner-div {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 72.75%;
}

.banner-heading {
  color: #4a495c;
  font-family: Inter;
  font-size: 27px;
  font-style: normal;
  font-weight: 700;
  line-height: 42px;
}

.banner-description {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.banner-content {
  display: flex;
  flex-direction: column;
  gap: 17px;
}

.banner-content-text {
  display: flex;
  gap: 70px;
}

.inner-content {
  display: flex;
  gap: 10px;
}

.content-series {
  color: #22c55e;
  text-align: center;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.content-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.content-text span {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.banner-buttons {
  display: flex;
  gap: 24px;
}

.banner-button-options {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
}

.fair-price-btn {
  display: flex;
  height: 48px;
  padding: 17px 36px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #fff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  background: #0169ff;
  border: 1px solid #0169ff;
  border-radius: 8px;
}

.learn-more-btn {
  display: flex;
  width: auto;
  height: 48px;
  padding: 17px 36px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  background: #f6fbff;
  border: 1px solid #f6fbff;
  border-radius: 8px;
}

.buttons {
  display: flex;
  gap: 8px;
  flex-direction: column;
}

.banner-div h3,
.banner-div h4,
.banner-div p {
  padding: 0px;
  margin: 0px;
  text-align: left;
}

.banner-heading.mobile-view {
  display: none;
}

.banner-heading.desktop-view {
  display: block;
}

@media only screen and (max-width: 800px) {
  .new-banner {
    width: 400px;
  }

  .banner-img {
    display: none;
  }

  .banner-heading.mobile-view {
    display: block;
  }

  .banner-heading.desktop-view {
    display: none;
  }

  .banner-div {
    width: 100%;
  }

  .banner-buttons {
    flex-direction: column;
    width: 100%;
    gap: 9px;
  }

  .banner-button-options {
    text-align: center !important;
  }

  .fair-price-btn,
  .learn-more-btn {
    width: 100%;
  }
}

@media only screen and (max-width: 415px) {
  .new-banner {
    width: 100%;
  }
}

/* End Css  */
.car-logo-image {
  max-width: 240px;
  margin: 0;
  width: 52px;
  height: 39px;
}

.acura-mdx-wrapper .sectioon-title,
.cost-container-title,
.make-page-title {
  color: #343243;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.acura-mdx-wrapper .first-img-wrapper img {
  width: 600px;
  height: 388px;
}

.acura-mdx-wrapper .first-img-wrapper {
  border-radius: 16px;
  margin-right: 16px;
}

.acura-mdx-wrapper .flex {
  display: flex;
}

.acura-mdx-wrapper .car-gallary {
  display: grid;
  grid-template-columns: max-content max-content;
  grid-column-gap: 16px;
  grid-row-gap: 13px;
}

.acura-mdx-wrapper .car-item-img {
  height: 114px;
  width: 254px;
  padding-left: 0px;
  width: 142px;
}

.acura-mdx-wrapper .pos-relative {
  position: relative;
}

.acura-mdx-wrapper .view-photo-btn {
  width: 100%;
  position: absolute;
  display: flex;
  height: 100%;
  padding: 0px 36px;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  border: none;
  border-radius: 8px;
  background: #f4f4f5;
  bottom: 0px;
  left: 0px;
}

.acura-mdx-wrapper .price {
  color: #4a495c;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0;
}

.acura-mdx-wrapper .car-info-wrapper {
  margin: 24px 0px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.acura-mdx-wrapper .sub-label {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
  text-wrap: nowrap;
}

/* .unlock-btn,
.unlock-btn:hover {
  display: flex;
  width: 85px;
  height: 22px;
  padding: 4px 8px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 1000px;
  background-color: #0169FF;
  border: none;
} */

.unlock-btn,
.unlock-btn:hover {
  display: flex;
  width: 33px;
  height: 24px;
  padding: 7px 0px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #4a495c;
}

/* .unlock-text,
.unlock-text:hover, */
.view-pricing-text,
.view-pricing-text:hover {
  color: #fff;
  text-align: right;
  font-family: Inter;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  padding-top: 3px;
}

.view-pricing-text,
.view-pricing-text:hover {
  padding-top: 0px;
}

.acura-mdx-wrapper .price-wrapper {
  display: grid;
  grid-template-columns: max-content max-content max-content;
  grid-column-gap: 60px;
}

.lock-icon {
  width: 9px;
  height: 9px;
  flex-shrink: 0;
  color: #fff;
  text-align: center;
  font-family: "Font Awesome 6 Duotone";
  font-size: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 150%;
}

.view-inventory-btn,
.view-inventory-btn:hover {
  display: flex;
  height: 48px;
  padding: 0px 32px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  color: #0169ff;
  background: #fff;
  border-radius: 8px;
  border: 1px solid var(--Primary-Primary-Brand-Blue, #0169ff);
}

.view-inventory-btn .btn-text,
.view-inventory-btn .btn-text:hover {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.acura-mdx-wrapper .want-car-btn {
  display: flex;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  background-color: #0169ff;
  border: none;
  border-radius: 8px;
}

.want-car-btn .btn-text {
  color: #fff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}

/* .lock-shadow {
  position: absolute;
  height: 7px;
  top: 8px;
  left: 83px;
  background: #666678;
  font-family: Inter;
  font-size: 15px;
  width: 11px;
  font-style: normal;
  font-weight: 900;
  line-height: 20px;
  filter: blur(4.999999523162842px);
} */

.lock-shadow {
  position: absolute;
  height: 10px;
  top: 8px;
  left: 26px;
  background: #666678;
  font-family: Inter;
  font-size: 15px;
  width: 30px;
  font-style: normal;
  font-weight: 900;
  line-height: 20px;
  filter: blur(4.999999523162842px);
}

.btn-golden {
  color: #c9a62c;
  text-align: right;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 165%;
  border: none;
  background: none;
  white-space: nowrap;
}

@media only screen and (max-width: 760px) {
  .btn-golden {
    white-space: normal;
  }
}

.view-pricing-text-golden {
  position: relative;
  bottom: 11px;
  left: 4px;
}

/*css start  */

.car-overview {
  display: flex;
  justify-content: space-between;
  padding: 20px;
  background-color: #f8faff;
  border-radius: 10px;
}

.car-details {
  flex: 2;
}

.car-details h2 {
  font-size: 24px;
  margin-bottom: 10px;
  margin-top: 0px;
}

.car-details p {
  font-size: 16px;
  margin-bottom: 10px;
}

.car-details .learn-more {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 24px;
}

.car-stats {
  display: flex;
  margin-top: 20px;
  gap: 16px;
}

.car-stats .stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #fff;
  text-align: left;
  padding: 24px;
  border-radius: 16px;
  width: 33.33%;
}

.car-stats .stat svg,
.learn-more svg {
  color: #0169ff;
  font-size: 16px;
  font-weight: 400;
}

.car-stats .stat span {
  display: block;
  font-size: 18px;
  font-weight: bold;
}

.car-stats .stat small {
  display: block;
  font-size: 12px;
}

.sidebar {
  flex: 1;
  margin-left: 20px;
}

.sidebar ul {
  list-style-type: none;
  padding: 0;
  margin: 0 0 20px 0;
}

.sidebar ul li {
  margin-bottom: 10px;
}

.sidebar ul li a {
  text-decoration: none;
  color: #333;
  font-size: 16px;
}

.sidebar .cta-button {
  display: block;
  text-align: center;
  background-color: #007bff;
  color: #fff;
  padding: 10px;
  border-radius: 5px;
  text-decoration: none;
  margin-bottom: 10px;
}

.sidebar .view-inventory {
  display: block;
  text-align: center;
  color: #007bff;
  text-decoration: none;
  font-size: 14px;
}

/* Mobile view */
@media screen and (max-width: 768px) {
  .car-overview {
    flex-direction: column;
    padding: 10px;
  }

  .car-stats {
    flex-direction: column;
    align-items: center;
  }

  .car-stats .stat {
    width: 100%;
    margin-bottom: 10px;
  }

  .sidebar {
    margin-left: 0;
  }

  .sidebar ul {
    display: flex;
    flex-wrap: wrap;
  }

  .sidebar ul li {
    flex: 1 1 50%;
    text-align: center;
  }

  .sidebar ul li a {
    font-size: 14px;
  }

  .sidebar .cta-button {
    margin-bottom: 10px;
  }

  .sidebar .view-inventory {
    font-size: 12px;
  }
}

.text-black-24 {
  color: #4a495c;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
}

.text-black-16 {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.car-overview {
  border-radius: 16px;
  background: #f6fbff;
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.car-logo-image {
  max-width: 240px;
  margin: 0;
  width: 52px;
  height: 39px;
}

.car-image-wrapper {
  padding-bottom: 32px;
}

.overview_text {
  color: #111827;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

/* Make Model Price Detail class */
.car-price-main-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  align-self: stretch;
  padding: 24px;
}

#pricing .info-box {
  width: 100%;
  padding: 16px;
  background: #f6fbff;
  border-radius: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px auto 24px;
}

#pricing .info-box .icon {
  width: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#pricing .info-box .fa-circle-info {
  color: #0069b5;
  font-size: 20px;
  font-weight: 900;
  line-height: 24px;
  text-align: center;
}

#pricing .info-box .info-text {
  flex: 1;
  color: #0069b5;
  font-size: 14px;
  font-family: Inter, sans-serif;
  font-weight: 500;
  line-height: 26px;
}

.most-recent-car-cards {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}

.car-price-heading {
  color: #4a495c;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
  padding: 0px;
  margin: 0px 0px 16px;
}

.car-type-trim {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.car-type {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
}

.car-msrp-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  border-left: 1px solid #eaeaeb;
  padding-left: 24px;
}

.p-text {
  color: #7a7884;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  padding-bottom: 8px !important;
}

.pill-details {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  flex-wrap: wrap;
}

.pill {
  display: flex;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.pill:hover {
  border-radius: 11px;
  color: #fff;
  background: #0069b5;
}

.divider {
  width: 1px;
  background-color: #ddd;
}

.msrp-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.msrp-details p {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  padding: 0px;
  margin: 0px;
}

.msrp-rate {
  color: #4a495c;
  font-family: Inter;
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  padding: 0px;
  margin: 0px;
}

.msrp-avg {
  color: #22c55e;
  font-family: Inter;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 0px;
  margin: 0px;
}

.sales-text {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
}

.car-card {
  display: flex;
  padding: 24px;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-radius: 16px;
  background: #f7f7f7;
}

.car-card-details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 360px;
}

.car-card-prices {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}

.view-price-details {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.view-price-link {
  display: flex;
  align-items: center;
  gap: 4px;
}

.view-price-link p,
.view-price-link svg {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.car-showing {
  color: #4a495c;
  text-align: right;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.car-name {
  display: flex;
  align-items: center;
  gap: 8px;
}

.car-card-heading {
  color: #4a495c;
  text-align: center;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.car-label {
  display: flex;
  padding: 0px 8px;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 8px;
  border-radius: 4px;
  background: #fff;
  color: #004171;
  text-align: center;
  font-family: Inter;
  font-size: 10px;
  font-style: normal;
  font-weight: 500;
  line-height: 165%;
}

.car-price-main-container h3,
.car-price-main-container p,
.car-specification-details h3,
.car-specification-details p,
.car-warranty-details h3,
.car-warranty-details p {
  margin: 0px;
  padding: 0px;
}

.car-info {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

.car-description {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}

.car-card-price-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
}

.car-card-price-details span {
  color: #4a495c;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.car-card-price-details p {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}

.saving-price {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  padding: 0px;
  margin: 0 0 10px;
}

@media screen and (max-width: 768px) {
  .car-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  .car-info {
    display: flex;
    align-items: center;
    align-content: center;
    gap: 8px 24px;
    align-self: stretch;
    flex-wrap: wrap;
    width: 220px;
  }

  .car-card-details,
  .car-card-prices {
    width: 100%;
  }
}

/* End */
/* Lead Specs */
.car-specification-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;
  padding: 24px;
}

.car-specs-details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 40px;
  align-self: stretch;
}

.specs-details {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}

.car-specs {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  width: 100%;
}

.base-capacity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.base-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.specs-text {
  color: #343243;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.specs-text-bold {
  color: #343243;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.spec-description {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.details-specs {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

@media screen and (max-width: 768px) {
  .specs-details {
    flex-direction: column;
  }

  .car-specs {
    width: 100%;
  }

  .trim_details {
    flex-direction: column;
    padding: 24px;
  }
}

/* End */
/* Car Warranty Class */
.warranty-card {
  background-color: #f8f9fa;
  border-radius: 10px;
  padding: 20px;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 500;
  margin-bottom: 24px;
}

.warranty-title {
  font-weight: normal;
  color: #6c757d;
}

.warranty-value {
  font-weight: bold;
  color: #343a40;
}

.pl-0 {
  padding-left: 0px;
}

.car-warranty-cards .row > .col-xs-12.col-sm-6 {
  padding-right: 24px;
}

.car-warranty-details {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  border-radius: 8px;
  background: #fff;
}

.warranty-title {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.warranty-items {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 24px;
  align-self: stretch;
  flex-wrap: wrap;
}

.warranty-items-frame {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  flex: 1 0 0;
}

.warranty-details {
  display: flex;
  align-items: center;
  gap: 24px;
  align-self: stretch;
}

.warranty-item-details {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  flex: 1 0 0;
  border-radius: 16px;
  background: #f7f7f7;
}

.item-warranty {
  display: flex;
  height: 52px;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
}

.item-heading {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.item-description {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
}

@media screen and (max-width: 768px) {
  .warranty-details {
    flex-direction: column;
    align-items: flex-start;
  }

  .warranty-item-details {
    align-self: stretch;
  }
}

/* End */
/*Lease Deals Section for make-model */
.lease-deals-wrapper {
  padding: 24px;
}

.horizontal-line {
  height: 1px;
  align-self: stretch;
  background: #eaeaeb;
  margin: 60px 0 60px 0;
}

.lease-deals-wrapper .title {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  margin: 0;
}

.lease-deals-wrapper .sub-title {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.lease-deals-row {
  margin: 24px 0;
  padding: 24px;
  border-left: 1px solid #eaeaeb;
}

.lease-card {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 16px;
  background: #f7f7f7;
  width: 221px;
  flex: 0 0 calc(50% - 10px);
}

.lease-card-title {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
}

.lease-card-subtitle {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  margin: 0;
}

.lease-card-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
}

.lease-pay-title {
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
}

.lease-pay-info {
  align-self: stretch;
  color: var(--Neutral-N-70, #666678);
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.view-lease-link {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

@media screen and (max-width: 1000px) {
  .lease-card-wrapper {
    margin-bottom: 24px;
  }
}

.price-disclaimer {
  margin: 0 0 30px 0;
  padding: 10px;
  color: #888888;
  font-size: 12px;
}

/* End lease deal css*/

/* Type and Trim  */
.btn-custom {
  background-color: #f8f9fa;
  border: 1px solid #ddd;
  color: #333;
  margin-right: 8px;
  border-radius: 11px;
  margin-bottom: 8px;
}

.btn-custom.active-btn,
.btn-custom:active,
.btn-custom:hover {
  background-color: #006fcf;
  color: white;
}

/* End Type and Trim */

/* make-model photo gallary*/
/* my class */
.p-0 {
  padding: 0px;
}

.gap-16 {
  gap: 16px;
}

.flex-wrap {
  flex-wrap: wrap;
}

.mt-4 {
  margin-top: 16px !important;
}

.mr-4 {
  margin-right: 16px;
}

.car-image-container {
  width: 116%;
}

@media only screen and (max-width: 1199px) {
  .car-image-container {
    width: 108%;
  }

  .acura-mdx-wrapper .car-item-img {
    width: 235px;
  }

  .car-stats .stat {
    width: 210px;
  }
}

@media only screen and (max-width: 1024px) {
  .acura-mdx-wrapper .car-item-img {
    width: 242px;
  }

  .car-item-img img {
    width: 100%;
  }
}

@media only screen and (max-width: 990px) {
  .img-1 {
    width: 100%;
  }

  .acura-mdx-wrapper .car-item-img {
    width: 50%;
    padding: 16px 8px;
    height: 283px;
  }
}

@media only screen and (max-width: 768px) {
  .img-1 {
    width: 97%;
  }

  .acura-mdx-wrapper .car-item-img {
    height: 270px;
    width: 48.5%;
    padding: 16px;
  }

  .car-item-img img {
    width: 100%;
  }

  .car-stats .stat {
    width: 100%;
  }

  .acura-mdx-wrapper .col-xs-12 .price {
    margin-top: 16px;
  }

  .pillar-content-wrapper {
    padding: 0 20px;
  }
}

@media only screen and (max-width: 500px) {
  .lease-deals-wrapper,
  .lease-card-wrapper {
    padding: 0;
  }

  .mpadding-0,
  .car-specification-details {
    padding: 0;
  }

  .car-warranty-cards .row > .col-xs-12.col-sm-6 {
    padding: 0;
  }

  .car-image-wrapper .row {
    margin: auto 0px;
  }

  .img-1 {
    width: 100%;
    height: 92%;
  }

  .acura-mdx-wrapper .car-item-img {
    width: 46.5%;
    height: auto;
    padding: 0px 4px;
  }

  .acura-mdx-wrapper .car-item-img img {
    width: 100%;
    height: 100%;
  }

  .sectioon-title {
    margin: 0px 16px;
    padding: 0px;
  }

  .acura-mdx-wrapper .car-info-wrapper {
    flex-direction: column;
  }

  .want-car-btn,
  .view-inventory-btn,
  .costOfOwnershipChart svg {
    width: 100%;
  }

  .acura-mdx-wrapper {
    padding: 0px 24px;
  }

  .model-grade {
    margin: 10px 16px;
  }

  .model-years {
    margin: 22px 0;
  }

  .left-container {
    padding: 0px;
    margin-bottom: 20px;
  }

  .m-col-reverse {
    margin-top: 8px !important;
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
  }

  .car-msrp-details {
    border-left: unset;
    padding-left: 0px;
  }

  .img-flex {
    flex-direction: column;
  }

  .img-small-sec {
    width: 100%;
  }

  .img-small-sec .img-col {
    flex-direction: row !important;
  }

  .img-small-sec .img-col .car-item-img-1 {
    width: 49% !important;
  }

  .right-side {
    position: relative;
  }

  .acura-mdx-wrapper .view-photo-btn {
    padding: 0px;
    flex-direction: row;
  }
}

@media (min-width: 992px) {
  .v-info-row .col-md-9.left-container {
    width: calc(100% - 300px);
  }
}

/*end-make-model photo gallary*/

.model-grade {
  display: flex;
  margin: 24px 0px 0px;
}

.model-years {
  margin: 0;
}

@media only screen and (max-width: 373px) {
  .model-years {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    height: 77px;
  }
}

.ce-grade-sm {
  color: #fff;
  text-align: center;
  font-family: Inter;
  font-size: 20.931px;
  font-style: normal;
  font-weight: 900;
  line-height: 100%;
  /* 20.931px */
  display: flex;
  width: 52px;
  padding: 0.327px 2.943px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 3.27px;
  align-self: stretch;
  border-radius: 4px;
  margin-right: 16px;
}

.graph-link {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.graph-cost-link {
  font-size: 16px;
  font-weight: 500;
  display: flex;
  height: 24px;
  align-items: center;
  gap: 4px;
}

.costOfOwnershipChart,
.graph-cost-link {
  margin-top: 24px;
}

/*Start FAQ*/
.faq-wrapper {
  margin-bottom: 60px;
}

.faq-wrapper .faq-label {
  align-self: stretch;
  color: #4a495c;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
  margin-bottom: 24px;
}

.faq-wrapper .panel-heading {
  padding: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fff;
}

.faq-wrapper .panel-title {
  padding: 10px 15px 0 0;
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.faq-wrapper .panel {
  border: none;
  border-bottom: 1px solid #eaeaeb;
  min-height: 60px;
}

.faq-wrapper .panel-body {
  border: none;
  color: #7a7884;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  padding: 0 0 10px 0;
  border-top-color: #fff !important;
  gap: 14px;
}

.faq-wrapper .arrow {
  color: #4a495c;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.faq-wrapper .link {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  display: flex;
  align-items: center;
  column-gap: 10px;
  text-decoration: none;
}

/*End FAQ*/

.link-text {
  padding: 8px 8px 8px 12px;
}

.savings-market-condition {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.divider-horizontal-line {
  height: 1px;
  align-self: stretch;
  background: #eaeaeb;
}

.divider-vertical-line {
  width: 1px;
  align-self: stretch;
  background: #eaeaeb;
}

.vertical-line-color {
  background: #d9d9d9;
}

@media only screen and (min-width: 820px) and (max-width: 834px) and (orientation: portrait) {
  .sidebar {
    margin-left: 0;
  }

  .right-side {
    margin-top: 10px;
  }
}

/* Lease Deals Model CSS start */
.breadcrumb-wrapper {
  display: flex;
  align-items: center;
  column-gap: 16px;
  flex-wrap: wrap;
}

.breadcrumb-label {
  color: #afafb4;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  padding: 0;
  margin: 0;
}

.breadcrumb-label.active {
  color: #4a495c;
}

.model-info-wrapper {
  margin: 0 0 32px 0;
}

.lease-deals-models .model-title {
  flex: 1 0 0;
  color: #343243;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.lease-deals-models .vehical-title {
  align-self: stretch;
  color: #343243;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.lease-deals-models .vehical-info {
  align-self: stretch;
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
}

.lease-deals-models .vehical-info-wrapper {
  margin: 24px 0;
  gap: 40px;
  display: flex;
}

.lease-deals-models .vehical-info-wrapper > div {
  width: 50%;
}

.lease-deals-models .vehical-img {
  border-radius: 16px;
}

.lease-deals-models .jump-trim-label {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
}

.lease-deals-models .jump-trim-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.lease-deals-models .jump-trim-card {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  flex: 1 0 0;
  border-radius: 16px;
  border: 1px solid #c9c9cc;
}

.lease-deals-models .trim-type {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
}

.lease-deals-models .trim-price {
  align-self: stretch;
  color: #4a495c;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px;
  margin: 0;
}

.lease-deals-models .container {
  margin-top: 60px;
  margin-bottom: 60px;
}

.lease-deals-models .deal-card {
  background-color: #f7f7f7;
  padding: 18px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 172px;
}

.lease-deals-models .detail-item {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.75;
  margin-bottom: 10px;
  padding-left: 16px;
}

.lease-deals-models .icon-text {
  font-family: "Inter";
  color: #343243;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  margin-left: 10px;
}

.lease-deals-models .text-muted {
  font-family: "Inter";
  color: #4a495c;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.lease-deals-models .bold-text {
  font-family: "Inter";
  color: #343243;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  margin-bottom: 20px;
  margin-top: 20px;
}

.lease-deals-models .action-btn {
  background-color: #0169ff;
  color: white;
  border-radius: 8px;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  border: none;
  font-family: "Inter";
  height: 48px;
  margin-top: 24px;
  margin-left: 10px;
}

.lease-deals-models .view-inventory {
  text-align: center;
  font-family: "Inter";
  font-size: 16px;
  font-weight: 500;
  color: #0169ff;
  margin-top: 40px;
}

.lease-deals-models .lease-title {
  font-family: "Inter";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.lease-deals-models .lease-subtitle {
  font-family: "Inter";
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.lease-deals-models .lease-info {
  margin-left: 10px;
  margin-top: 85px;
}

@media (max-width: 768px) {
  .lease-deals-models .lease-info {
    margin-top: 40px;
  }

  .lease-deals-models .view-inventory {
    margin-top: 12px;
  }

  .breadcrumb-wrapper {
    align-items: baseline;
    margin-bottom: 24px;
  }
}

@media (min-width: 425px) {
  .lease-deals-models .detail-item {
    margin-top: 4px;
  }

  .lease-deals-models .btn-container {
    margin-right: 25px;
  }

  .lease-deals-models .deal-card {
    width: auto;
    height: auto;
  }
}

@media (min-width: 375px) {
  .lease-deals-models .detail-item {
    font-size: 16px;
    margin-top: 4px;
  }

  .lease-deals-models .btn-container {
    margin-right: 25px;
  }

  .lease-deals-models .deal-card {
    width: auto;
    height: auto;
  }
}

@media (max-width: 575px) {
  .lease-deals-models .vehical-info-wrapper {
    flex-direction: column;
  }

  .lease-deals-models .vehical-info-wrapper > div {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .lease-deals-models {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
  }
}

.lease-deals-models .container {
  font-family: "Inter";
}

.lease-deals-models .miles-container {
  display: flex;
  flex-direction: column;
  gap: 24px;
  text-align: center;
}

.lease-deals-models .miles {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: auto 79px;
  height: auto 19px;
}

.lease-deals-models .btn-ele {
  color: #0169ff;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  text-decoration: none;
}

.lease-deals-models .btn-ele-mobile {
  display: none;
}

.lease-deals-models .btn-ele i {
  margin-left: 5px;
}

.lease-deals-models a:hover {
  text-decoration: none;
}

.lease-deals-models .heading-desktop,
.lease-deals-models .heading-mobile {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
}

.lease-deals-models .heading-mobile {
  display: none;
}

.hsub-heading {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
}

.lease-deals-models .msrp {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.lease-deals-models .range {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 0px;
}

.lease-deals-models .table-head {
  color: #343243;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 0 0 25px 20px;
  word-wrap: break-word;
  border-bottom: 1px solid rgb(235, 226, 226);
}

.lease-deals-models .table-cols {
  border-right: 1px solid rgb(235, 226, 226);
  padding-right: 40px;
  padding-left: 40px;
}

.lease-deals-models .table-cols-left {
  border-right: 1px solid rgb(235, 226, 226);
  padding-right: 40px;
}

.lease-deals-models .table-cols-right {
  padding-right: 40px;
  padding-left: 40px;
}

.lease-deals-models .table-content {
  padding: 24px 0px 24px 20px;
  border-bottom: 1px solid rgb(235, 226, 226);
  color: #343243;
  font-size: 16px;
  line-height: normal;
  font-weight: 400px;
  word-wrap: break-word;
}

.lease-deals-models .table-content-bottom {
  padding: 24px 0px 0px 20px;
  color: #343243;
  font-size: 16px;
  line-height: normal;
}

.lease-deals-models .dropdown-button {
  padding: 6px 10px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  border-radius: 14px;
  justify-content: space-between;
  border: 1px solid var(--Neutral-N-30, #eaeaeb);
  background: var(--Neutral-N-10, #fbfbfc);
  width: 100%;
  color: #343243;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.lease-deals-models .dropdown-content {
  display: none;
  width: 100%;
  position: absolute;
  background-color: #f9f9f9;
  box-shadow: 0px 8px 16px rgba(186, 184, 184, 0.2);
  z-index: 1;
  border-radius: 10px;
}

.lease-deals-models .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.lease-deals-models .dropdown-content a:hover {
  background-color: #f1f1f1;
}

.lease-deals-models .dropdown:hover .dropdown-content {
  display: block;
}

@media (max-width: 767px) {
  .lease-deals-models .table-cols {
    border-right: 1px solid rgb(235, 226, 226);
    padding-right: 20px;
    padding-left: 20px;
  }

  .lease-deals-models .table-head {
    padding: 0 0 25px 5px;
    width: 100px;
    height: 55px;
  }

  .lease-deals-models .table-content {
    padding: 24px 0px 24px 5px;
    border-bottom: 1px solid rgb(235, 226, 226);
    color: #343243;
    font-size: 16px;
    line-height: normal;
    font-weight: 400px;
    word-wrap: break-word;
    width: 100px;
  }

  .lease-deals-models .table-content-bottom {
    padding: 24px 0px 0px 5px;
    color: #343243;
    font-size: 16px;
    line-height: normal;
    width: 100px;
  }

  .lease-deals-models .table-cols-left {
    border-right: 1px solid rgb(235, 226, 226);
    padding-right: 20px;
  }

  .lease-deals-models .table-cols-right {
    padding-left: 20px;
  }

  .lease-deals-models .heading-mobile {
    display: block;
  }

  .lease-deals-models .heading-desktop {
    display: none;
  }

  .lease-deals-models .btn-ele-desktop {
    display: none;
  }

  .lease-deals-models .btn-ele-mobile {
    display: block;
  }

  .lease-deals-models .table-container {
    margin: 40px 0 40px 0;
  }
}

.lease-deals-models .section-title {
  color: #4a495c;
  font-family: "Inter";
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
  margin-left: 13px;
  margin-bottom: 16px;
}

.lease-deals-models .section-subtitle {
  color: #666678;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 36px;
  margin-bottom: 24px;
}

.lease-deals-models .section-title2 {
  color: #4a495c;
  font-family: "Inter";
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
  margin: 0;
  padding: 0;
}

.lease-deals-models .icon-box {
  background-color: #f7f7f7;
  padding: 20px;
  border-radius: 16px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  margin-bottom: 16px;
}

.lease-deals-models .icon-box .icone {
  font-size: 24px;
  margin-right: 10px;
}

.lease-deals-models .icon-box2 {
  padding: 20px;
  margin-bottom: 15px;
}

.lease-deals-models .icon-box2 .icone {
  font-size: 24px;
  margin-right: 10px;
}

.lease-deals-models .requirements-methodology,
.lease-payments {
  margin-top: 16px;
}

.lease-deals-models .btn-custom {
  color: white;
  border: 0;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  padding: 10px 15px;
  border-radius: 8px;
  background: #0169ff;
  margin-top: 24px;
}

.lease-deals-models .icon-title .icone {
  color: #343243;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 900;
  line-height: 28px;
}

.lease-deals-models .icon-title {
  color: #343243;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
}

.lease-deals-models .icon-desc {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  padding-left: 27px;
}

/* Lease Deals Model CSS end */

/* make model specs page start */
/* car-deatils */
.specs-deatils .car-specs-header {
  font-size: 24px;
  font-weight: 800;
}

.specs-car-title {
  padding: 16px;
  color: #343243;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.specs-title {
  color: #4a495c;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 36px;
}

.specs-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.specs-deatils .car-trims button {
  margin-right: 10px;
  margin-bottom: 24px;
  margin-top: 24px;
  border: none;
  border-radius: 4px;
  padding: 5px 10px;
}

.specs-deatils .f-27360 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.specs-deatils .f--27360 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  justify-items: center;
}

.specs-deatils .specs-image img {
  width: 100%;
  border-radius: 16px;
  margin-bottom: 24px;
}

.specs-deatils .specs-deatils .info-label {
  color: #888;
}

.specs-deatils .info-value {
  font-weight: bold;
}

.specs-deatils .cta-button {
  background-color: #007bff;
  color: white;
  border: none;
  padding: 10px;
  border-radius: 4px;
  width: 100%;
  margin-top: 10px;
}

.specs-deatils .view-inventory {
  display: block;
  text-align: center;
  margin-top: 10px;
  color: #007bff;
}

.specs-deatils .custom-btn {
  border-radius: 11px;
  background-color: #0069b5;
  color: white;
}

.specs-deatils .custom-btn-1 {
  border-radius: 11px;
  background: #fbfbfc;
  color: black;
}

.specs-deatils .car-trims-mobile {
  display: none;
}

/* Active button style */
.specs-deatils .active {
  background-color: #0069b5 !important;
  color: white !important;
}

.specs-deatils .col-sm-5-right {
  border-right: 1px solid #eaeaeb;
}

@media (max-width: 768px) {
  .specs-deatils,
  .car-description1 {
    padding: 0px 20px;
  }
}

@media (max-width: 500px) {
  .specs-deatils .specs-container {
    text-align: start;
  }

  .specs-deatils .f-27360 {
    justify-content: flex-start;
  }

  .specs-deatils .specs-info .col-sm-6 {
    float: none;
    display: inline-block;
    width: 100%;
    margin-bottom: 20px;
  }

  .specs-deatils .col-sm-5-right {
    border-right: none;
    border-bottom: 1px solid #eaeaeb;
  }

  .specs-deatils .car-trims {
    margin-top: 20px;
  }

  .specs-deatils .car-trims-desktop {
    display: none;
    margin-bottom: 10px;
  }

  .specs-deatils .view-inventory {
    margin-bottom: 60px;
  }

  .specs-deatils .f--27360 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
  }

  .costOfOwnershipChart,
  .graph-cost-link {
    margin-top: 0;
  }

  .breadcrumb-label {
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    padding: 0;
    margin: 0 0 12px 0;
  }

  .view-inventory-btn {
    margin: 10px 0;
  }

  .car-description1 {
    margin-bottom: 20px;
  }
}

/* car-description */
.car-description1 .h1-title {
  color: #4a495c;
  font-family: "Inter";
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: 36px;
  margin-top: 60px;
  margin-bottom: 16px;
}

.car-description1 .spec-item {
  border-radius: 16px;
  background: #f7f7f7;
  padding: 10px;
  margin-bottom: 10px;
}

.car-description1 .spec-item2 {
  border-radius: 16px;
  padding: 10px;
  margin-bottom: 10px;
}

.car-description1 .spec-label {
  color: #343243;

  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.car-description1 .spec-value {
  color: #343243;
  text-align: right;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.car-description1 .view-all {
  margin-top: 16px;
  display: block;
  color: #0169ff;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  text-decoration: none;
}

.car-description1 .icone {
  color: #343243;
  text-align: right;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.car-description1 .menu-container {
  margin-top: 60px;
  margin-left: 40px;
  border-radius: 16px;
  background: #fbfbfc;
}

.car-description1 .list-group-item {
  border: none;
  color: #7a7884;
  font-family: "Inter";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  padding: 14px 15px;
  cursor: pointer;
}

.car-description1 .list-group-item a {
  color: #7a7884;
  text-decoration: none;
}

.car-description1 .list-group-item.active {
  padding: 12px;
  border-radius: 8px;
  background: #eaeaeb;
  font-family: "Inter";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  padding: 14px 15px;
  cursor: pointer;
}

.car-description1 .list-group-item.active a {
  color: #111827;
  text-decoration: none;
}

.car-description1 .list-group-item.active:hover {
  background-color: #eaeaeb;
}

.car-description1 .btn-custom {
  border: 0;
  background-color: #007bff;
  text-align: center;
  color: #fff;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border-radius: 8px;
  padding: 10px 0 12px;
  width: 100%;
}

.car-description1 .view-inventory {
  padding-top: 12px;
  margin-top: 10px;
  display: block;
  text-align: center;
  color: #0169ff;
  font-family: "Inter";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.car-description1 .scrollable-section::-webkit-scrollbar {
  display: none;
}

/* .car-description1 .scrollable-section {
-ms-overflow-style: none;
overflow-y: scroll;
height: 100vh;
padding-right: 15px;
}
.car-description1 .scrollable-section {
height: 100vh;
overflow-y: auto;
padding-right: 15px;
} */

.car-description1 .sticky-section {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

/* make model specs page end*/

/* Price-details CSS start */
.price-details-wrapper {
  margin-top: 32px;
}

.price-details-wrapper .car-title {
  flex: 1 0 0;
  color: #343243;
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  margin: 0;
}

.price-details-wrapper .deals-count {
  color: #666678;
  font-variant-numeric: lining-nums proportional-nums;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.car-details {
  margin-top: 24px;
}

.avg-price {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.acura-mdx-wrapper .sub-label.text-wrap {
  text-wrap: wrap;
}

.price-filters {
  display: flex;
  height: 24px;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  align-self: stretch;
}

.filter-option {
  display: flex;
  align-items: center;
  gap: 4px;
}

.margin-gap {
  margin: 24px -15px;
}

.p-16 {
  padding: 16px;
}

/* Price-details CSS end */

/* Make model page link section css start */
.link-text {
  color: #7a7884;

  /* text-sm/leading-5/font-medium */
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  /* 142.857% */
}

.active-btn {
  border-radius: 8px;
  background: #eaeaeb;
  align-items: center;
}

.btn-custom-url {
  background-color: transparent;
  border: 1px solid transparent;
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  margin-right: 8px;
  border-radius: 11px;
  margin-bottom: 8px;
}

.btn-custom-url.active-btn,
.btn-custom-url:active,
.btn-custom-url:hover {
  background-color: #eaeaeb;
  color: #111827;
}

/* Make model page link section css end */

/* css for offer card */
.img-flex {
  display: flex;
  align-items: center;
  gap: 8px;
}

.img-small-sec .img-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.img-small-sec .img-col .car-item-img-1 {
  width: 142px;
  height: 109px;
}

.offer-container {
  background-color: #fff;
  padding: 24px;
  border-radius: 16px;
  min-height: 460px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.offer-container-gradient {
  background: #fff;
  padding: 40px;
  border-radius: 16px;
  position: relative;
  height: 364px;
}

.offer-container-left-sec .title-subtitle-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.offer-container-left-sec .title-subtitle-section h1 {
  color: #4a495c;
  text-align: center;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: 46px;
  margin: 0;
  width: 92%;
}
.popup-img {
  width: 388px;
  height: 364px;
  position: absolute;
  right: 0px;
  top: 0px;
  border-radius: 0px 16px 16px 0px;
}

@media (max-width: 767px) {
  .popup-img {
    position: relative;
    height: 227px;
    width: 100%;
    object-fit: cover;
    border-radius: 16px 16px 0px 0px;
  }
  .offer-container-gradient {
    padding: 0px;
    height: auto;
  }
  .offer-gradient-inner-heading-secrtion {
    flex-direction: column;
  }
  .offer-container-tags.ps-1 {
    right: 53% !important;
  }
  .offer-container-left-sec .title-subtitle-section {
    width: 100%;
    margin: 0 auto;
  }
  .offer-container-left-sec .title-subtitle-section h1 {
    padding-top: 24px;
    font-size: 18px;
    line-height: 30px;
  }
  .offer-container-row {
    width: 100% !important;
  }
  #email-popup-form {
    padding: 0px 24px 24px;
  }
}
.offer-container-left-sec .title-subtitle-section h1 .bold-text {
  font-weight: 700;
}
.offer-container-left-sec .title-subtitle-section h1 .blue-text {
  color: #0169ff;
  font-weight: 800;
}

.offer-title {
  color: #4a495c;
  font-family: Inter;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 30px;
  margin-bottom: 24px;
}

.offer-sub-title {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  margin-bottom: 16px;
}

.widget-checks {
  font-size: 15px;
  margin: 20px 2px;
  font-weight: 400;
}

.select-container {
  border: 1px solid #c9c9cc;
  border-radius: 16px;
  margin-bottom: 24px;
}

.select-container label {
  color: var(--Neutral-N-60, #7a7884);
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  text-transform: uppercase;
  margin: 0px;
}

.form-content {
  display: flex;
  align-items: center;
}

.form-content .form-select {
  width: 50%;
  padding: 8px 16px;
  margin: 0px;
}

.form-content-fw .form-content {
  display: block;
  padding: 8px 16px;
}

.form-content-fw .form-select {
  width: 100%;
  margin: 0px;
}

.br-1 {
  border-right: 1px solid var(--Neutral-N-40, #c9c9cc);
}

.by-1 {
  border-bottom: 1px solid var(--Neutral-N-40, #c9c9cc);
  border-top: 1px solid var(--Neutral-N-40, #c9c9cc);
}

.select-container .form-content .form-select select,
.select-container .form-content-fw .form-content select,
.select-container .form-content-fw .form-content input {
  width: 100%;
  height: 26px;
  padding: 0px;
  border: none;
  box-shadow: none;
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.price {
  font-size: 28px;
  font-weight: bold;
  margin-top: 15px;
}

.dealer-info {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.dealer-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 10px;
  border: 2px solid white;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
}

.btn-cta {
  background-color: #007bff;
  color: #fff;
  width: 100%;
  padding: 15px;
  border-radius: 10px;
  font-size: 16px;
  font-weight: bold;
}

.btn-cta:hover {
  color: #fff;
}

.average-text {
  font-size: 12px;
  margin-bottom: 15px;
  color: #808080;
}

.form-disclaimer-text {
  font-size: 12px;
  margin: 15px 0px;
  color: #808080;
}

/*css end for offer card */

/* CSS start for lead ad */
.lead-sales-widget {
  display: flex;
  padding: 32px 24px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  background: radial-gradient(
    445.22% 160.99% at 107.08% -8.92%,
    #d8dcff 0%,
    #e4fcff 75.01%
  );
}

.lead-sales-widget .widget-heading {
  color: #4a495c;
  text-align: center;
  font-family: Inter;
  font-size: 30px;
  font-style: normal;
  font-weight: 900;
  line-height: 128%;
}

.lead-sales-widget .highlight {
  color: #0169ff;
  font-family: Inter;
  font-size: 38px;
  font-style: normal;
  font-weight: 900;
  line-height: 128%;
}

.lead-sales-widget .sales-widget-ques {
  align-self: stretch;
  color: #4a495c;
  text-align: center;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
  margin: 0 0 24px 0;
}

.lead-sales-widget .card {
  display: flex;
  padding: 18px 36px;
  flex-direction: column;
  gap: 8px;
  align-self: stretch;
  border-radius: 11.827px;
  background: rgba(255, 255, 255, 0.5);
  box-shadow: 4px 8px 24px 0px rgba(2, 52, 128, 0.1);
  margin-bottom: 8px;
}

.lead-sales-widget .card h5 {
  margin: 0;
  text-align: left;
}

.lead-sales-widget .card a {
  padding: 0;
  text-align: left;
}

.lead-sales-widget .offer-label {
  color: #4a495c;
  font-family: Inter;
  font-style: normal;
  font-size: 13px;
  font-weight: 700;
  line-height: 24px;
  margin: 0;
  text-align: left;
}

.m-0 {
  margin: 0;
}

.widget-options {
  display: flex;
}

.widget-options > div {
  flex: 1;
}

.lead-sales-widget .zip-input {
  height: 48px;
  padding: 8px 24px;
  border: 1px solid #c9c9cc;
  background: #fff;
  width: 100%;
  outline: none;
}

.lead-sales-widget .form-control {
  border-radius: 0;
}

.lead-sales-widget .get-pricing-btn {
  display: flex;
  height: 48px;
  padding: 0px 25px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  background: #0169ff;
  border: none;
  width: 100%;
  border-radius: 0px 8px 8px 0px;
}

.lead-sales-widget .btn-label {
  color: #fff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
}

.sales-info-bar {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.sales-info-bar .card {
  flex: 1;
  margin-bottom: 0 !important;
}

#vehicle_inventory {
  border-radius: 8px 0px 0px 8px;
}

.card-link {
  color: #0169ff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
}

@media (max-width: 500px) {
  .widget-options {
    flex-direction: column;
  }

  .sales-info-bar {
    flex-direction: column;
  }

  .lead-sales-widget {
    margin: 0 10px;
  }

  .offer-container {
    margin-top: 60px;
    margin-bottom: 20px;
    min-height: 360px;
  }
}

/* CSS end for lead ad */

/* Specs Css */
.trim-div {
  display: flex;
  padding: 8px 24px;
  justify-content: space-between;
  align-items: center;
  border-radius: 16px;
  border: 1px solid var(--Neutral-N-40, #c9c9cc);
}

.trim-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.get-dealer-price-details {
  display: flex;
  width: 360px;
  padding: 24px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  border: 1px solid var(--Neutral-N-30, #eaeaeb);
  background: var(--Secondary-White-100, #fff);
  box-shadow: 4px 8px 24px 0px rgba(0, 0, 0, 0.1);
}

/* dealers-best-price CSS START */
.dealers-best-price {
  width: 100%;
}

.dealers-best-price .btccc {
  border-top: 1px solid #ccc;
}

.dealers-best-price .dealer-price-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.dealers-best-price .checkbox {
  color: #22c55e;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.dealers-best-price .dealer-price-item-wrapper {
  margin-bottom: 24px;
}

.dealers-best-price .price-feature {
  flex: 1 0 0;
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
}

.dealers-best-price .amount {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
}

.dealers-best-price .zip-error {
  display: none;
  color: red;
  font-size: 12px;
}

@media (max-width: 500px) {
  .get-dealer-price-details {
    width: 100%;
  }

  .get-dealer-price-container {
    width: 100%;
    padding: 24px;
  }
}

/* top nav menu css start*/
#ranking-label p {
  padding: 0px;
}

#ranking-label:hover {
  background: none;
}

.nav-dropdown-content {
  padding: 16px 0px;
  width: max-content;
}

.main-menu-label {
  color: #7a7884;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 166.667%;
  text-transform: uppercase;
  padding: 0 16px;
  margin: 0;
}

.nav-dropdown .sub-sub-menu {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  flex-direction: column;
  list-style: none;
  padding: 0;
}

.nav-dropdown .third-level {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 24px;
  border-radius: 16px;
}

.nav-dropdown .third-level:hover {
  background: #f6fbff;
}

.nav-dropdown .menu-icon {
  display: flex;
  width: 36px;
  min-width: 36px;
  height: 36px;
  justify-content: center;
  align-items: center;
  border-radius: 12px;
  background: #e2f2ff;
}

.nav-dropdown .submenu-label {
  font-size: clamp(12px, 0.97vw, 14px);
  line-height: 185%;
  text-wrap: wrap;
  font-style: normal;
  font-weight: 600;
  color: #4a495c;
  font-family: Inter;
  padding: 0;
}
.nav-dropdown .active-promo + .nav-dropdown-content .submenu-label {
  width: 100%;
}
.nav-dropdown .description {
  color: #7a7884;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 166.667%;
}

.nav-dropdown .menu-icon svg {
  color: #0094ff;
}

.nav-dropdown .sub-menu {
  list-style: none;
  display: flex;
  padding: 0px;
}

.nav-dropdown .sub-menu .second-level:nth-child(1) {
  border-right: 1px solid #eaeaeb !important;
}

#research-sub-menu-right .third-level {
  padding: 8px 24px;
}

.main-logo img {
  height: 25px;
}

.main-menu {
  padding: 0 !important;
  margin: 0;
}

.main-menu .nav-links {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 4px;
  font-size: clamp(12px, 0.97vw, 14px);
  line-height: 185%;
  text-wrap: wrap;
  font-style: normal;
  font-weight: 600;
  color: #4a495c;
  font-family: Inter;
}

.left-navbar {
  display: flex;
  gap: 10px;
  justify-content: flex-start;
  align-items: center;
}

#research-nav .sub-menu {
  width: 880px;
}
#research-nav .sub-menu #research-tools .sub-sub-menu {
  width: 594px;
  flex-wrap: wrap;
  gap: 0px;
  flex-direction: row;
}
#research-nav .sub-menu #research-tools .sub-sub-menu li {
  flex: 1 1 34%;
}

#right-navbar {
  display: flex;
  align-items: center;
  gap: clamp(16px, 5.6vw, 24px);
}

#right-navbar #login {
  font-size: clamp(12px, 0.97vw, 14px);
  color: #4a495c;
  font-family: Inter;
  font-style: normal;
  font-weight: 600;
  white-space: nowrap;
}

#right-navbar #sign-up-desktop {
  color: #fff;
  font-family: Inter;
  font-size: clamp(12px, 1.1vw, 16px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border-radius: 16px;
  background: #0169ff;
  height: auto;
  padding: clamp(8px, 0.83vw, 12px) clamp(18px, 1.6vw, 24px);
  border: none;
  white-space: nowrap;
}

#right-navbar a:hover {
  text-decoration: none;
}

@media screen and (max-width: 1230px) {
  .left-navbar {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }

  .main-nav.active {
    background-color: #fff;
    width: 100%;
  }

  .nav-links {
    color: #4a495c !important;
  }

  .main-nav li {
    border-bottom: none;
  }
}

/* top nav menu css end*/
#breadcrumb-make-select,
#breadcrumb-model-select {
  width: max-content;
  padding: 0px 16px;
  border: none;
  background: #fff;
  appearance: none;
  background-image: url(https://caredge.com/wp-content/uploads/2024/09/caret-down.png);
  background-repeat: no-repeat;
  background-position-x: 98%;
  background-position-y: 50%;
  background-size: 8px;
  cursor: pointer;
}

#breadcrumb-make-select:focus,
#breadcrumb-model-select:focus {
  outline: none;
  border-radius: 21px;
}

select::-webkit-scrollbar {
  width: 6px;
  height: 42px;
}

select::-webkit-scrollbar-thumb {
  background-color: #ddd;
  border-radius: 21px;
}

select::-webkit-scrollbar-track {
  background-color: #fff;
}

@media only screen and (max-width: 1130px) {
  #research-sub-menu-right {
    gap: 16px;
  }

  .medScreen.smallScreen .nav-dropdown-content {
    position: unset;
    position: relative;
    z-index: 999;
  }

  .medScreen.smallScreen .nav-dropdown .submenu-label {
    margin: 0px;
  }

  .medScreen.smallScreen .nav-dropdown-content {
    border: none;
    box-shadow: none;
    width: 100%;
  }

  .medScreen.smallScreen .nav-dropdown,
  .medScreen.smallScreen {
    width: 100%;
  }

  .medScreen.smallScreen .nav-dropdown .sub-menu {
    flex-direction: column;
  }

  .medScreen.smallScreen .nav-dropdown .sub-menu .second-level:nth-child(1) {
    border-right: none !important;
    margin: 0px;
  }

  .dropdown-backdrop {
    z-index: 0 !important;
  }

  .medScreen.smallScreen .nav-dropdown .third-level {
    margin: -10px;
  }

  .medScreen.smallScreen .main-menu-label {
    margin-bottom: 16px;
  }

  .medScreen.smallScreen .sub-sub-menu .main-menu-label {
    margin-bottom: 0px;
  }
}

/* top nav menu css end*/
/* search css */
#mobile-search-container #mobile-search-input {
  width: 100%;
}

#dashboard-btn {
  display: flex;
  width: 100%;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  background: #0169ff;
  color: #fff;
  font-family: Inter;
  font-size: 16px;
  font-weight: 700;
  border: none;
  cursor: pointer;
}

.nav-search-bar,
#mobile-search-container .mobile-nav-search-bar {
  display: flex;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 8px 12px;
  background-color: #f7f8fb;
  width: 250px;
  cursor: pointer;
  gap: 16px;
}

.nav-search-bar svg,
.mobile-nav-search-bar svg {
  color: #888;
  font-size: 16px;
}

.staticContent {
  display: flex;
  padding: 0px 24px 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.nav-search-bar input,
.mobile-nav-search-bar input {
  border: none;
  outline: none;
  background: transparent;
  width: 100%;
  color: #555;
  font-size: 14px;
  pointer-events: none !important;
}

.popup-overlay,
.pricing-popup-overlay,
.sidebar-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 990;
}

.popup-overlay.show,
.pricing-popup-overlay.show,
.sidebar-overlay.show {
  display: block;
}

.popup-suggestions {
  display: none;
  position: fixed;
  top: 14%;
  left: 50%;
  transform: translateX(-50%);
  background: white;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  z-index: 1001;
  opacity: 0;
  transition: opacity 0.3s ease;
  width: 653px;
  height: auto;
  background-clip: padding-box;
  border: 2px solid transparent;
}

.popup-suggestions::before {
  content: "";
  position: absolute;
  top: -2px;
  right: -2px;
  bottom: -2px;
  left: -2px;
  z-index: -1;
  border-radius: inherit;
  background: conic-gradient(
    from 180deg,
    #8ad4ec,
    #ef96ff 25%,
    #ff56a9 50%,
    #ffaa6c 75%,
    #8ad4ec
  );
  padding: 2px;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask-composite: destination-out;
}

.popup-suggestions.show {
  opacity: 1;
  display: block;
}

.close-btn {
  background: #fff;
  color: #4a495c;
  cursor: pointer;
  width: 24px;
  height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid #ccc;
}

.close-btn svg,
#close-pricing-popup svg {
  font-size: 14px;
  color: #4a495c;
  width: unset !important;
}

.popup-search-bar {
  display: flex;
  width: 650px;
  height: 48px;
  padding: 10px 8px;
  align-items: center;
  gap: 10px;
}

.popup-search-bar input {
  border: none;
  outline: none;
  width: 100%;
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  border-bottom: 1px solid #ccc;
  padding-bottom: 4px;
}

.popup-search-bar svg {
  display: flex;
  width: 24px;
  justify-content: center;
  align-items: center;
  font-size: 14px;
}

.quick-links h4 {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 20px;
  display: flex;
  align-items: center;
  text-transform: uppercase;
  color: #7a7884;
}

.quick-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.quick-links li {
  padding: 8px 0;
}

.quick-links li a {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 26px;
  text-transform: capitalize;
  color: #4a495c;
}

.quick-links li a:hover {
  color: #008fff;
}

.suggestions {
  overflow-y: auto;
  padding: 16px 0px;
}

.suggestion-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 10px 16px;
  gap: 10px;
  height: 68px;
  width: 100%;
  justify-content: space-between;
  flex: none;
  order: 1;
  align-self: stretch;
  flex-grow: 0;
}

.suggestion-item:hover {
  background: #e6f4ff;
  text-decoration: none;
}

.suggestion-item span {
  font-family: "Inter";
  font-style: normal;
  font-size: 14px;
  line-height: 17px;
  color: #4a495c;
  font-weight: 400;
}

.icon-text {
  display: flex;
  align-items: center;
  gap: 10px;
}

.icon-text .cart-icon {
  width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid #ccc;
  background: #fbfbfc;
}

.icon-text .cart-icon svg {
  font-size: 14px;
  color: #4a495c;
  transform: none;
  transition: none;
}

.suggestion-item .category {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  display: flex;
  align-items: center;
  color: #7a7884;
  flex: none;
  order: 2;
  flex-grow: 0;
}

.popup-header {
  display: flex;
  align-items: center;
  border-radius: 16px;
  padding: 16px;
  font-size: 14px;
  color: #0069b5;
  background: #e6f4ff;
  width: 100%;
}

.popup-header.not-found {
  color: #92400e;
  background: #fffaeb;
}

.popup-header svg {
  margin-right: 10px;
}

#mobile-search-container {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.nav-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1440px;
  margin: 0 auto;
}
.nav-mobile {
  display: none;
  position: absolute;
  top: 14px;
  right: 18px;
  align-items: center;
  gap: 24px;
}
.nav-mobile a {
  font-size: clamp(12px, 3vw, 16px);
  color: #4a495c;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  text-decoration: none;
}
.navbar-toggle svg {
  color: #4a495c;
}
@media only screen and (max-width: 1431px) {
  .nav-search-bar {
    width: 156px;
  }
}
@media only screen and (max-width: 1230px) {
  .navbar-toggle {
    display: block;
  }
  .nav-mobile {
    display: flex;
  }
  .navbar #right-navbar {
    display: none;
  }
  .main-nav.active {
    margin: 1em 0px 0px;
  }
}
@media (max-width: 768px) {
  .popup-suggestions {
    width: 80%;
    padding: 15px;
  }

  .suggestion-item {
    padding: 8px 12px;
  }

  .popup-search-bar {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .search-icon {
    display: inline-block;
    color: #555;
    cursor: pointer;
    margin-left: 15px;
  }

  .popup-suggestions {
    width: 90%;
    padding: 10px;
  }

  .suggestion-item {
    padding: 8px;
  }
}

/* depriciation popup css start*/
.offer-container-popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  z-index: 9999;
  margin: 0 auto;
}

.offer-container-popup-overlay .overlay-content {
  width: 989px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.offer-title-close-icon {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 24px;
}

.offer-container-popup-overlay-close {
  border-radius: 100%;
  background-color: #fbfbfc;
  border: unset;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid #eaeaeb;
  position: absolute;
  z-index: 22;
  right: 16px;
  top: 8px;
}

.offer-container-popup-overlay-close svg {
  color: #4a495c;
  font-size: 14px;
}
.offer-container-tags {
  display: flex;
  padding: 8px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  background: rgba(241, 241, 241, 0.75);
  font-size: 14px;
  font-weight: 700;
  color: #4a495c;
}
.offer-container-tags.ps-1 {
  position: absolute;
  right: 212px;
  top: 12px;
}
.offer-container-tags.ps-2 {
  position: absolute;
  right: 12px;
  bottom: 12px;
}
/* .offer-gradient-inner {
  background-color: #ffffff;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
} */

.offer-gradient-inner h4 {
  font-size: 16px;
  line-height: 28px;
  font-weight: 400;
  color: #4a495c;
  margin: 0;
}

#toolkit-guide-popup .offer-title {
  color: #ffffff;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 800;
  line-height: 28px;
  width: 575px;
  margin: 0;
}

.offer-container-form-content {
  display: flex;
  flex-direction: column;
}

.offer-container-form-content-label {
  margin-bottom: 0px;
  font-weight: 700;
  font-size: 14px;
  line-height: 28px;
  margin-bottom: 12px;
  color: #4a495c;
  display: none;
}

.offer-container-row {
  width: 52%;
  display: flex;
  gap: 10px;
  align-items: center;
  flex-direction: column;
}

.offer-container-form-field {
  padding: 14.5px 16px;
  width: 100%;
  border-radius: 8px;
  border: 1px solid #d9d9d9;
  height: 50px;
}

.offer-container-form-btn {
  width: 100%;
  padding: 12px 36px;
  border: unset;
  background-color: #0169ff;
  color: #ffff;
  font-size: 16px;
  line-height: 150%;
  font-weight: 700;
  border-radius: 8px;
}

.offer-gradient-terms-condition {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #7a7884;
  margin: 0;
}

/*  */
.dealer-invoice-feature-section {
  margin-bottom: 24px;
}

.feature-section {
  display: flex;
  gap: 16px;
}
.feature-cards {
  padding: 16px;
  border-radius: 16px;
  border: 1px solid #eaeaeb;
  background-color: #ffffff;
  width: 270px;
}
.feature-icon {
  background-color: #f7fff9;
  padding: 8.32px;
  border-radius: 100%;
  width: 32px;
  height: 32px;
  margin-bottom: 8px;
}

.feature-icon.hand-holding {
  background-color: #f9f9ff;
}

.feature-icon.comments {
  background-color: #fffbf7;
}

.feature-icon svg {
  font-size: 15.36px;
  color: #2cc949;
}

.feature-icon.hand-holding svg {
  color: #6c6cfe;
}

.feature-icon.comments svg {
  color: #f19e4b;
}

.feature-cards h3 {
  margin-bottom: 4px;
  font-size: 16px;
  line-height: 28px;
  color: #4a495c;
  font-weight: 500;
  padding: 0;
  margin: 8px 0 0 0;
  white-space: nowrap;
}

.feature-cards p {
  font-size: 14px;
  line-height: 28px;
  color: #7a7884;
  font-weight: 400;
  margin: 0;
}

@media screen and (max-width: 920px) {
  .feature-section {
    flex-wrap: wrap;
  }
  .feature-cards {
    width: 48%;
  }
}

@media screen and (max-width: 715px) {
  .feature-section {
    flex-wrap: nowrap;
    flex-direction: column;
  }
  .feature-cards {
    width: 100%;
  }
  .offer-container-popup-overlay .overlay-content {
    width: 90%;
    height: 80vh;
    overflow: hidden;
    margin-top: 24px;
  }
  /* .offer-gradient-inner-heading-secrtion .title-subtitle-section {
    width: 100%;
  } */

  .offer-container-gradient {
    margin-bottom: 24px;
  }
}

@media screen and (max-width: 700px) {
  #toolkit-guide-popup .offer-title {
    width: 100%;
  }

  .offer-container-row {
    flex-direction: column;
  }

  .offer-container-form-btn {
    width: 100%;
  }
}
/* depriciation popup css end */

/* favorite icon css starts */

.pillar-header-text-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.favorite-icon-wrapper {
  cursor: pointer;
  display: flex;
  height: 48px;
  width: 48px;
  padding: 0px 6.5px;
  justify-content: center;
  gap: 8px;
  align-items: center;
  background: #fff;
  border-radius: 1000px;
  filter: drop-shadow(0 0 1px rgba(48, 49, 51, 0.05))
    drop-shadow(0 1px 3px rgba(48, 49, 51, 0.2));
}

.favorite-icon-wrapper svg {
  width: 16px;
  height: 16px;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  color: #0169ff;
}

.icon-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 20px;
}
/* favorite icon css ends */

/* css for warranty score cards start*/

.warranty-score-card-header {
  display: flex;
  padding: 24px 16px 24px 24px;
  align-items: center;
  align-self: stretch;
  border-radius: 16px;
  background: #e6f3ee;
  margin-top: 8px !important;
  margin-bottom: 24px !important;
  margin-right: -6px;
}

.thumbs-up-icon-wrapper {
  color: #fff;
  background: #4a495c;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.thumbs-up-icon-wrapper svg {
  font-size: 16px;
  padding: 8px;
}

.score-card-header-text {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-variant-numeric: lining-nums proportional-nums;
  font-family: "Suisse Int'l";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-left: 10px !important;
}

.car-warranty-score-cards {
  width: 100%;
}

.score-cards-wrapper {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.cost-repair-container .cost-repair-card {
  width: 48% !important;
}

.mr-24 {
  margin-right: 24px;
}

.cost-repair-card {
  background: #f7f7f7;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cost-repair-details h4 {
  color: #4a495c;
  font-family: "Inter", sans-serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 30px;
  margin-top: 0px !important;
}

.cost-repair-details p {
  color: #4a495c;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.cost-repair-overview {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.cost-repair-overview p {
  color: #4a495c;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
}

.cost-repair-card #learn-more-link {
  color: #0169ff !important;
  font-family: "Inter", sans-serif !important;
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
}

.score-level-container {
  display: flex;
  padding: 24px;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
  border-radius: 16px;
  background: #f7f7f7;
  margin-bottom: 32px !important;
}

.score-title h3 {
  color: #4a495c;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
}

.score-title p {
  color: #7a7884;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
}

.score-level-container .col-sm-4 img {
  display: block;
  margin: 0 auto;
  width: 129px;
  height: auto;
  object-fit: cover;
}

.score-details {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.score-details h3 {
  color: #4a495c;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
}

.score-details p {
  color: #4a495c;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
}

.score-details a {
  color: #0169ff !important;
  font-family: "Inter", sans-serif !important;
  font-size: 16px;
  font-weight: 700;
  line-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
}

.cost-repair-overview .fa-circle-info {
  font-size: 16px;
  color: #fbd037;
}

.car-warranty-cards > p {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin-bottom: 8px;
}

@media only screen and (max-width: 1200px) {
  .cost-repair-container .cost-repair-card {
    width: 47.5% !important;
  }
}

@media only screen and (max-width: 767px) {
  .cost-repair-container .cost-repair-card {
    margin-right: 0px;
    width: 100% !important;
  }

  .cost-repair-container .mr-24 {
    margin-bottom: 24px;
  }

  .score-details {
    width: 60%;
  }

  .car-warranty-score-cards {
    width: 96%;
  }

  .car-warranty-details {
    padding: 0px 24px;
  }
}

@media only screen and (max-width: 500px) {
  .car-warranty-score-cards,
  .score-details {
    width: 100%;
  }

  .car-warranty-details {
    padding: 0px;
  }

  .score-level-container {
    flex-direction: column;
  }

  .warranty-score-card-header {
    margin-right: -12px;
  }
}

/* css for warranty score cards end*/

/* profile dropdown css start */

.profile-modal-container {
  position: absolute;
  width: 350px;
  padding: 24px 40px 24px;
  background-color: #f6fbff;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-family: Inter;
  z-index: 999;
  height: auto;
}

.profile-avtar-details {
  display: flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
  border-bottom: 1px solid #c9c9cc;
  padding-bottom: 24px;
}

.profile-avtar {
  height: 2.25rem;
  width: 2.25rem;
  border-radius: 100%;
  overflow: hidden;
  background-color: #9fd4ff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 16px;
  color: #004171;
  font-family: Inter;
  font-weight: 400;
  cursor: pointer;
}

.profile-details {
  font-size: 16px;
  color: #4a495c;
  font-family: Inter;
  font-weight: 600;
}

.modal-option-details {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.modal-option-details svg,
.modal-actions svg {
  color: #0169ff;
  font-size: 16px;
}

.modal-option-details p,
.modal-actions p {
  font-size: 16px;
  color: #4a495c;
  font-family: Inter;
  font-weight: 400;
  margin: 0;
  transform: translateX(0);
  transition: all 0.2s ease-in-out;
  line-height: 24px;
}

.modal-actions.mb-32 {
  margin-bottom: 8px;
}

.modal-option-details.border-bottom {
  border-bottom: 1px solid #c9c9cc;
  padding-bottom: 24px;
}

.modal-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.modal-option-details p:hover,
.modal-actions p:hover {
  transform: translateX(5px);
}

@media (min-width: 64.0625em) {
  .profile-modal-container {
    right: 0;
    top: 72px;
  }
}

@media (max-width: 1024px) {
  .profile-modal-container {
    bottom: -9px;
    right: -72px;
    top: 70px;
    height: fit-content;
  }
}
/* profile dropdown css end */

/* what can i do popup css start */

.profile-modal-container a svg {
  transform: none !important;
}
#what-can-i-do-next {
  cursor: pointer;
}
.popup {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

#quickStartPopup .popup-content {
  position: relative;
  margin: auto;
  padding: 48px 64px;
  width: 100%;
  max-width: 1200px;
  background: #fff;
  border-radius: 10px;
  top: 0px;
}

.quick-start {
  color: #4a495c;
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 900;
  padding-bottom: 16px;
}

.onboarding-header h1 {
  color: #0169ff;
  font-size: 36px;
  font-weight: 900;
  line-height: 44px;
  margin: 0px 0px 16px 0px;
  padding: 0px;
}

.onboarding-header h2 {
  padding-top: 24px;
  margin-bottom: 16px;
  margin-top: 0;
  font-weight: 900;
  font-size: 24px;
  line-height: 32px;
  color: #4a495c;
}

.onboarding-header p {
  color: #4a495c;
  margin-bottom: 16px !important;
  font-size: 16px;
  line-height: 24px;
}

#services .img-container {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab-content .img-container img {
  max-height: 285px;
  width: 100%;
}

.tab-content .flex-row {
  display: flex;
  gap: 3rem;
  text-align: left;
}
.tab-content .flex-row div {
  width: 48%;
}

.tab-content .tab-content-description h3,
.tabs-container-mobile .tab-content h3 {
  font-size: 22px;
  font-weight: 900;
  color: #4a495c;
  padding-bottom: 16px;
  margin: 0;
}
.tabs-container-mobile .tab-content h3 {
  position: relative;
  padding: 0px !important;
  text-align: center;
}
.tab-content .tab-content-description p a,
.tabs-container-mobile .tab-content p a {
  font-size: 16px;
  font-weight: 600;
  color: #0169ff;
  text-decoration: none;
  cursor: pointer;
}
.tabs-container-mobile .blue-border-bottom {
  background-color: #0169ff;
  position: absolute;
  width: 1.5rem;
  height: 0.25rem;
  left: 50%;
  bottom: -0.6rem;
  transform: translateX(-50%);
}
.tab-content .tab-content-description p,
.tabs-container-mobile .tab-content p {
  font-size: 16px;
  color: #4a495c;
  padding-bottom: 16px;
  line-height: 24px;
  font-weight: 400;
}
.tabs-container-mobile .icon-container {
  margin: 50px auto 40px;
  width: 5.5rem;
  height: 5.5rem;
  border-radius: 100%;
  background-color: #f6fbff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tabs-container-mobile .icon-container svg {
  font-size: 32px;
  color: #0169ff;
}
.tabs-container-mobile .onboarding-btn-container {
  flex-direction: column;
  width: 100%;
  gap: 16px;
}
.tabs-container-mobile .onboarding-btn-container button,
.tabs-container-mobile .onboarding-btn-container a {
  width: 100%;
}
.close {
  position: absolute;
  top: 3rem;
  right: 4rem;
  font-size: 24px;
  cursor: pointer;
  opacity: 1 !important;
}
.close svg {
  font-size: 24px;
  color: #4a495c;
}
.tabs {
  width: 100%;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #c9c9cc;
  padding: 1.5rem 0;
  margin: 1.5rem 0;
}

.tab-link {
  cursor: pointer;
  border: none;
  background: transparent;
  font-size: 1.125rem;
  line-height: 1.75rem;
  color: #afafb4;
  font-weight: 900;
}

.tab-link.active {
  color: #4a495c;
  border-bottom: 3px solid #0169ff;
}

.tab-content {
  display: none;
}

.tab-content.active {
  display: block;
}

.primary-btn {
  background: #007bff;
  color: #fff;
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  border-radius: 5px;
}

.onboarding-btn-container {
  width: 96% !important;
  display: flex;
  justify-content: flex-start;
  margin-top: 24px;
}

.onboarding-btn-container button.next-tab-btn,
.onboarding-btn-container button.done-btn {
  color: #0169ff;
  background-color: #fff;
  border: 1px solid #0169ff;
}

.onboarding-btn-container button.next-tab-btn:hover,
.onboarding-btn-container button.done-btn:hover {
  background-color: #e2f2ff;
}

.onboarding-btn-container button,
.onboarding-btn-container a {
  cursor: pointer;
  border-radius: 8px;
  border: 2px solid transparent;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  padding: 12px 24px;
  line-height: 20px;
  min-width: 120px;
  max-height: 48px;
  width: 100%;
  flex: 0 0 50%;
  font-weight: 700;
  margin-right: 16px;
}

.onboarding-btn-container a.dark {
  color: #fff;
  background-color: #0169ff;
  text-decoration: none;
}

.onboarding-btn-container a.dark:hover {
  background-color: #0094ff;
}

.mr-16 {
  margin-right: 16px;
}
.tabs-container-mobile {
  display: none;
  margin-top: 64px;
}
.slide-dots-container-mobile {
  display: none;
  justify-content: center;
  margin: 20px 0 0;
}
.slide-dot {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  background-color: #ddd;
  border-radius: 50%;
  display: inline-block;
  cursor: pointer;
}
.slide-dot.active {
  background-color: #007bff;
}
@media (max-width: 1000px) {
  .tabs-container-mobile {
    display: block;
  }
  .slide-dots-container-mobile {
    display: flex;
  }
  .tabs-container-desktop,
  .tabs,
  .onboarding-header {
    display: none;
  }
  #quickStartPopup .popup-content {
    padding: 26px;
    width: 48vw;
  }
}
@media (max-width: 766px) {
  #quickStartPopup .popup-content {
    width: 90vw;
  }
  .close {
    top: 1.5rem;
    right: 1.5rem;
  }
}

/* what can i do popup css end  */

/* ranks depreciation  css starts */

.resale-value-title-text {
  color: var(--Neutral-N-90, #343243);
  font-family: Inter;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  margin-bottom: 0px 0px 24px;
}

.ranks-intro-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  align-self: stretch;
}

.ranks-intro-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0 !important;
}

.ranks-intro-text strong {
  color: #4a495c;
  font-weight: 700;
}

.ranks-buttons-wrapper {
  margin-top: 60px;
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
}

.ranks-buttons-item {
  display: flex;
  align-items: center;
  gap: 16px;
}

.pr-10 {
  padding-right: 10px;
}

.middle-item {
  border-right: 2px solid #eaeaeb;
  border-left: 2px solid #eaeaeb;
  padding: 0px 32px;
}

.ranks-btn-label {
  color: #7a7884;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.ranks-button {
  border-radius: 11px;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  padding: 8px 16px;
}

.ranks-btn-group {
  display: flex;
  gap: 8px;
}

.best-ranks-title {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
}

.methodology-text,
.methodology-text a {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.methodology-text a,
.rank-description a {
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.back-to-top-text {
  display: flex;
  height: 24px;
  align-items: center;
  gap: 4px;
  width: 145px;
  text-decoration: none !important;
  padding: 0px 15px;
}

.back-to-top-text span {
  color: var(--Primary-Brand-Blue, #0169ff);
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.top-makes-container {
  display: flex;
  padding: 24px 0px;
  align-items: center;
  gap: 24px;
}

.rank-title-wrapper {
  display: flex;
  align-items: center;
  gap: 16px;
}

.rank-title-wrapper a {
  color: var(--Neutral-N-90, #343243);
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  text-decoration: none;
}

.title-icon-link svg {
  color: var(--Primary-Brand-Blue, #0169ff);
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.rank-description,
.rank-description a {
  color: #666678;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.ranks-top-text-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
}

.ranks-model-img {
  width: 250px;
  height: 130px;
  border-radius: 8px;
  background: url(https://d2bq9obxtvkjtt.cloudfront.net/inc/css/<path-to-image>) lightgray 50% / cover no-repeat;
  max-width: 240px;
}

.model-icon-title {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}

@media (max-width: 992px) {
  .ranks-buttons-item {
    margin-bottom: 24px;
  }
  .ranks-buttons-wrapper {
    flex-direction: column;
    gap: 10px;
  }
  .middle-item {
    border-right: none;
    border-left: none;
    padding: 0px;
  }
}

@media (max-width: 650px) {
  .top-makes-container {
    flex-direction: column;
  }
  .ranks-model-img {
    width: 100%;
    height: auto;
  }
}

/* ranks depreciation css ends */

/* Car Buying Toolkit CSS Code */

.nav-dropdown #car-buying-toolkit {
  cursor: pointer;
}

#custom-pricing-popup {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
  background: white;
  box-shadow: 4px 8px 24px rgba(1, 105, 255, 0.25);
  border-radius: 16px;
  overflow: hidden;
  border: 4px solid #a5e4ff;
  flex-direction: column;
  gap: 36px;
  max-width: 480px;
  width: 90%;
}

#custom-pricing-popup.show {
  display: flex;
}

.get-popup-offers-btn {
  border: none;
  background: #0169ff !important;
  color: #ffffff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  cursor: pointer !important;
  border-radius: 8px;
  display: flex;
  padding: 12px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  width: 100%;
  margin-top: 14px;
}

#custom-pricing-popup #error-message {
  color: red;
  font-size: 14px;
  text-align: center;
}

.header-text-wrapper {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.pricing-popup-header-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
}

.pricing-header-description {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.pricing-popup-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  width: 100%;
}

#car-buying-toolkit a {
  cursor: pointer;
}

#custom-pricing-popup .card-content {
  flex: 1;
  padding-bottom: 24px;
  display: flex;
  flex-direction: column;
}

#custom-pricing-popup .card-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 16px 24px 0;
  background: white;
}

#custom-pricing-popup .icon-placeholder {
  width: 24px;
  height: 24px;
}

#custom-pricing-popup .header-text {
  color: #4a495c;
  font-size: 14px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
  line-height: 26px;
}

#close-pricing-popup {
  background: #fff;
  color: #4a495c;
  cursor: pointer;
  border: 0;
}

#close-pricing-popup svg {
  font-size: 16px;
}

#custom-pricing-popup .card-body {
  flex: 1;
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#custom-pricing-popup .title-section {
  text-align: center;
  color: #0069b5;
}

#custom-pricing-popup .title {
  font-size: 22px;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  line-height: 34px;
}

#custom-pricing-popup .subtitle {
  color: #4a495c;
  font-size: 14px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 26px;
}

#custom-pricing-popup .form-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#custom-pricing-popup .form-tabs {
  display: flex;
  gap: 4px;
}

#custom-pricing-popup .tab {
  flex: 1;
  height: 42px;
  padding: 8px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 16px;
  background: white;
  border: 1px solid #eaeaea;
  cursor: pointer;
}

#custom-pricing-popup .tab:hover,
#custom-pricing-popup .tab.selected {
  background: #e2f2ff;
}

#custom-pricing-popup .tab-icon {
  font-size: 14px;
  color: #0169ff;
}

#custom-pricing-popup .tab-text {
  font-size: 14px;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  line-height: 26px;
  color: #0169ff;
}

#custom-pricing-popup .form-fields {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

#custom-pricing-popup .field-group {
  display: flex;
  gap: 4px;
}

#custom-pricing-popup .field-group input,
#custom-pricing-popup .field-group select {
  padding: 8px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  height: 48px;
  background-color: transparent !important;
}

#custom-pricing-popup .submit-button {
  height: 48px;
  padding: 12px 48px;
  background: #0169ff;
  border-radius: 16px;
  display: flex;
  justify-content: center;
  align-items: center;
}

#custom-pricing-popup .field-group {
  display: flex;
  flex-wrap: wrap;
  grid-column-gap: 0 !important;
  grid-row-gap: 0 !important;
  border: 1px #eaeaeb solid;
  border-radius: 16px;
  overflow: hidden;
}

#custom-pricing-popup .field-group select:first-child {
  border-right: 1px #eaeaeb solid !important;
}

#custom-pricing-popup .field-group select {
  flex: 0 0 50%;
}

#custom-pricing-popup .field-group input {
  flex: 0 0 100%;
  border-top: 1px #eaeaeb solid !important;
}

#custom-pricing-popup #iType-container {
  visibility: hidden;
  height: 0;
  max-height: 0;
  max-width: 0;
  margin: 0;
  padding: 0;
}

#custom-pricing-popup .gfield_label {
  padding-left: 16px;
  margin-bottom: 0;
  font-size: 8px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  color: #afafb4;
}

/* Car Buying Toolkit CSS ends */
.desktop-insurance-header {
  margin-top: 20px;
}
.mt-0 .pillar-sub-title {
  margin-top: 0px !important;
}

/* v4789234556 */

/*Quin popup css*/

.slidein.mobile-popup {
  height: 410px;
  width: 380px;
  background-color: #fff;
  background-image: none;
}
.slidein.mobile-popup .shmktpl-form-input {
  width: 100% !important;
  margin-bottom: 12px;
}

.chart-div {
  padding-top: 24px;
}

.chart-container .cost-table {
  display: flex;
  /* width: 70%; */
}
.chart-container .cost {
  width: 50%;
}
.chart-container .value {
  width: 40%;
  border-left: 1px solid #eaeaeb;
}
.chart-container .percent {
  width: 30%;
  border-left: 1px solid #eaeaeb;
}
.chart-container .value h1,
.chart-container .percent h1 {
  margin: 5px 10px 5px 10px !important;
  padding: 15px 0;
  border-bottom: 1px solid #eaeaeb;
}
.chart-container .cost-table h1 {
  font-size: 14px;
  font-weight: bold;
  color: #343243;
  margin: 5px 10px 5px 0;
  padding: 15px 0;
  border-bottom: 1px solid #eaeaeb;
}
.chart-container .cost-table ul {
  padding: 0;
}
.chart-container .cost-table ul li {
  list-style: none;
  display: flex;
  gap: 4px;
}
.chart-container .cost-clumn {
  display: flex;
  padding: 13px 0;
  gap: 15px;
  border-bottom: 1px solid #eaeaeb;
  margin: 5px 10px 0 0;
}
.chart-container .cost-clumn:last-child {
  border-bottom: none;
}

.chart-container .cost-clumn span {
  font-size: 16px;
  text-decoration: underline;
  text-underline-offset: 2px;
  color: #474747;
}
.chart-container .depreciation {
  background-color: #a98afe;
  width: 24px;
  height: 24px;
}
.chart-container .insurance {
  background-color: #50cfa7;
  width: 24px;
  height: 24px;
}
.chart-container .fuel {
  background-color: #5277c6;
  width: 24px;
  height: 24px;
}
.chart-container .interest {
  background-color: #fe9abd;
  width: 24px;
  height: 24px;
}
.chart-container .maintenance {
  background-color: #56c9da;
  width: 24px;
  height: 24px;
}

.chart-container .cost-list li {
  padding: 15px 0 15px 0;
  border-bottom: 1px solid #eaeaeb;
  margin: 5px 10px;
  font-size: 14px;
}
.chart-container .cost-list li:last-child {
  border-bottom: none;
}
#chart .c3-chart-arcs-title {
  width: 10% !important;
  word-break: keep-all;
  background-color: aquamarine;
}

@media (min-width: 992px) and (max-width: 1050px) {
  .chart-container .cost-table {
    width: 100%;
  }
}

@media (max-width: 992px) {
  .chart-container .cost-table {
    width: 100%;
    align-items: center;
    justify-content: center;
  }
  #chart {
    margin-bottom: 20px;
  }
}

/* table 2 css */
.table-heading {
  font-weight: 800;
  color: #4a495c;
  line-height: 36px;
  font-size: 18px;
  margin: 0 0 16px;
}
.table tr th {
  width: 140px;
  color: #343243;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px; /* 200% */
}
.table tr td {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px !important;
  vertical-align: middle !important;
}
.mt-24 {
  margin-top: 24px;
}

/* video css */
lite-youtube {
  border-radius: 16px;
}
.news-video .link {
  color: #0169ff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px; /* 175% */
}
.pillar-grey-box {
  background: #fbfbfc;
  padding: 24px;
}
.pillar-grey-box h5 {
  color: #555;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 18.48px;
}
.pillar-grey-box .related-models a {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}
/* media query */
@media only screen and (max-width: 790px) {
  .pillar-content-wrapper {
    padding: 0px 24px !important;
  }
}
@media only screen and (max-width: 500px) {
  .pillar-content-wrapper .flex-row {
    flex-wrap: wrap;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .pillar-text .list {
    flex-direction: column;
    gap: 16px;
  }
}

@media (max-width: 767px) {
  .cost-container {
    padding: 0px 24px;
  }
  .icon-container {
    display: none;
  }
}

@media (max-width: 980px) {
  .bb-line {
    padding-bottom: 60px;
  }
}

.costs-calc-btn {
  width: 100%;
}

.costs-dealer-widget {
  margin-bottom: 60px;
}

.insurify-mobile-widget {
  width: 100%;
  height: 262px;
  padding: 24px;
  z-index: 999;
  border-radius: 16px 16px 0px 0px;
  border: 1px solid var(--Neutral-N-30, #eaeaeb);
  background: var(--Secondary-White-100, #fff);
  box-shadow: 4px -10px 24px 0px rgba(0, 0, 0, 0.1);
}

.close-insurify-mobile-widget {
  position: absolute;
  right: 16px;
  top: 16px;
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.mobile-insurify-header {
  margin-bottom: 16px;
}

.mobile-insurify-header h2 {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: Inter;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: 34px;
  margin: 0px;
}

.mobile-insurify-header p {
  color: var(--Secondary-Neutral-80-Base, #4a495c);
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0px;
}

.insurify-features {
  margin: 0px 16px 16px 16px;
}

.feature-icon-text {
  padding: 0px;
}

.feature-icon-text svg {
  color: #22c55e;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin-right: 8px;
}

.feature-text {
  color: var(--Neutral-N-60, #7a7884);
  font-family: Inter;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.feature-text span {
  font-weight: 700;
}

#mobileInsSubmit {
  margin-top: 0px;
}

/* Insuracne Page Css */

.insurane-quinn-widget {
  margin: 20px 0px;
}
.ranks-quinn-widget {
  margin: 10px 0px 40px 0px;
}

/* make page css */

#make-page-sec .chart-title {
  padding: 0px 0px 24px;
}

#make-page-sec .col-car-brand-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  border-bottom: 1px solid #eaeaeb;
  padding-bottom: 16px;
}

#make-page-sec .make-car-brand-img {
  width: 30%;
  height: 240px;
  padding: 40px;
  background-color: #f7f7f7;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#make-page-sec .make-car-overview {
  width: 70%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

#make-page-sec .make-car-overview p {
  margin: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #4a495c;
}

#make-page-sec .make-car-overview a {
  width: fit-content;
  display: flex;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  border: 0;
  background-color: #0169ff;
  font-size: 16px;
  font-weight: 900;
  line-height: 150%;
  color: #ffffff;
  border-radius: 8px;
  text-decoration: none;
}

#make-page-sec .make-car-brand-img img {
  width: 100%;
  object-fit: contain;
}

#make-page-sec .make-car-cards-section {
  margin-top: 60px;
}

#make-page-sec .make-car-cards-section h2 {
  font-size: 24px;
  font-weight: 900;
  color: #4a495c;
  margin: 0 0 24px 0;
}

#make-card-sec {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin: 0px;
}

#make-card-sec .car-brand-flex {
  width: 364px;
  border: 1px solid #eaeaeb;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
}

#make-card-sec .car-brand-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#make-card-sec .car-brand-header h4 {
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  margin: 0;
  color: #4a495c;
}

#make-card-sec .car-brand-header span {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  font-size: 14px;
  color: #0169ff;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#make-card-sec .car-brand-img img {
  width: 100%;
  height: 180px;
  margin: 10px 0px;
  object-fit: cover;
}

#make-card-sec .car-brand-footer {
  display: flex;
  align-items: center;
  gap: 16px;
}

#make-card-sec .footer-item {
  width: 48%;
}

#make-card-sec .footer-left {
  border-right: 1px solid #eaeaeb;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: flex-start;
}

#make-card-sec .footer-right {
  padding: 0px;
  display: flex;
  justify-content: flex-end;
}

#make-card-sec .footer-item h4 {
  font-size: 16px;
  font-weight: 800;
  margin: 0;
  color: #4a495c;
}

#make-card-sec .footer-left p {
  font-size: 14px;
  line-height: 26px;
  font-weight: 300;
  margin: 0;
  color: #4a495c;
}

#make-card-sec .footer-right a {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  text-decoration: none;
  color: #0169ff;
  white-space: nowrap;
}

#make-card-sec .footer-right span {
  margin-left: 4px;
}

@media only screen and (max-width: 1202px) {
  #make-card-sec .car-brand-flex {
    width: 31.5%;
  }
}

@media only screen and (max-width: 992px) {
  #make-card-sec .car-brand-flex {
    width: 48%;
  }

  #make-card-sec .footer-item {
    padding: 0px;
    margin: 0px;
  }
}

@media only screen and (max-width: 767px) {
  #make-page-sec {
    margin: 26px 24px;
  }

  #make-card-sec .car-brand-flex {
    width: 100%;
  }

  #make-page-sec .col-car-brand-flex {
    flex-direction: column;
  }

  #make-page-sec .make-car-brand-img,
  #make-page-sec .make-car-overview,
  #make-page-sec .make-car-overview a {
    width: 100%;
  }

  #make-page-sec .make-car-brand-img img {
    width: 380px;
    height: 240px;
  }
}

/* make-series css */

.make-series-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 8px;
  padding-top: 16px;
}

.jump-series-text {
  color: #7a7884;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.model-tags-wrapper {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 8px;
  align-self: stretch;
  flex-wrap: wrap;
}

.model-tag {
  display: flex;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 11px;
  border: 1px solid #eaeaeb;
  background: #fbfbfc;
  cursor: pointer;
  color: #4a495c;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.model-tag.active {
  background: #0069b5;
  color: #fff;
  font-weight: 700;
}

/* make page car listings css */

.vehicle-ranking-sales-card .car-listings {
  margin: 60px 0px;
  padding: 60px 0px;
  border-top: 1px solid #eaeaeb;
  border-bottom: 1px solid #eaeaeb;
}

.vehicle-ranking-sales-card .car-listings h2,
.sub-heading-title {
  font-size: 24px;
  font-weight: 800;
  margin: 0px 0px 24px;
  color: #4a495c;
  text-transform: capitalize;
  line-height: 36px;
  margin-top: 60px;
}

.vehicle-ranking-sales-card .vehicle-ranking-listings-container {
  display: flex;
  gap: 16px;
  overflow: hidden;
}

.vehicle-ranking-sales-card .vehicle-ranking-listing-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 20px;
  width: 270px;
  flex: 0 0 auto;
}

.vehicle-ranking-sales-card .vehicle-ranking-listing-card:hover {
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
  text-decoration: none;
}

.vehicle-ranking-sales-card .car-image-container {
  width: 100%;
}

.vehicle-ranking-sales-card .car-image {
  width: 100%;
  object-fit: cover;
}

.vehicle-ranking-sales-card .like-icon {
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: white;
  padding: 8px 10px;
  border-radius: 50%;
  font-size: 18px;
  color: #007bff;
  cursor: pointer;
}

.vehicle-ranking-sales-card .like-icon:hover {
  color: red;
}

.vehicle-ranking-sales-card .vehicle-ranking-car-details {
  padding: 24px;
}

.vehicle-ranking-sales-card .new-badge {
  display: inline-block;
  background-color: #e2f2ff;
  color: #004171;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 400;
  line-height: 165%;
  margin-bottom: 10px;
}

.vehicle-ranking-sales-card h3 {
  color: #4a495c;
  font-size: 18px;
  font-weight: 700;
  margin: 0;
  line-height: 150%;
}

.vehicle-ranking-sales-card p {
  color: #4a495c;
  font-size: 14px;
  margin: 0 0 16px;
  font-weight: 400;
  line-height: 150%;
}

.vehicle-ranking-sales-card .car-details-price {
  font-size: 18px;
  color: #4a495c;
  font-weight: 700;
  line-height: 130%;
  display: flex;
  flex-direction: column;
}

.vehicle-ranking-sales-card .car-details-price small {
  font-size: 12px;
  color: #4a495c;
  font-weight: 500;
}

.vehicle-ranking-sales-card .target-discount {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.vehicle-ranking-sales-card .target-discount i {
  color: #007bff;
  padding: 2px;
}

.vehicle-ranking-sales-card .unlock-btn {
  width: max-content;
  background-color: #007bff;
  color: white;
  padding: 8px 16px;
  border: none;
  border-radius: 100px;
  cursor: pointer;
  font-size: 8px;
  font-weight: 800;
  box-shadow: 15px 1px 17px -5px grey;
}

.vehicle-ranking-sales-card .unlock-btn:hover {
  background-color: #0056b3;
}

.vehicle-ranking-sales-card .target-discount span {
  color: #666678;
  font-weight: 400;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 4px;
}

.vehicle-ranking-sales-card .target-discount span svg {
  color: #0169ff;
  font-size: 14px;
}

.vehicle-ranking-sales-card .view-listings {
  color: #007bff;
  font-size: 16px;
  font-weight: 500;
}

.vehicle-ranking-sales-card .vehicle-ranking-listing-btn {
  display: flex;
  gap: 4px;
  align-items: center;
}

.vehicle-ranking-sales-card .vehicle-ranking-listing-btn svg {
  color: #007bff;
  font-size: 14px;
}

.vehicle-ranking-sales-card .view-listings:hover {
  text-decoration: underline;
}

.vehicle-ranking-sales-card .car-details-actions {
  display: flex;
  align-items: center;

  gap: 26px;
}

.make-research-all-models h3 {
  color: #afafb4;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0px 0px 8px;
}

.make-research-all-models ul {
  padding: 0px;
}

.make-research-all-models ul li {
  list-style-type: none;
}

.make-research-all-models ul li a {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.make-research-all-models .make-page-hr {
  border-top: 1px solid #eaeaeb;
  margin-top: 24px;
}

@media (max-width: 1199px) {
  .vehicle-ranking-sales-card .vehicle-ranking-listings-container {
    overflow: auto;
  }

  .vehicle-ranking-sales-card .vehicle-ranking-listing-card {
    width: 31%;
  }
}

@media (max-width: 991px) {
  .vehicle-ranking-sales-card .vehicle-ranking-listing-card {
    width: 30%;
  }
}

@media (max-width: 767px) {
  .vehicle-ranking-sales-card .vehicle-ranking-listing-card {
    width: 81%;
  }
}

/* Electric Vehicle Data CSS starts */

.electric-vehicle-container h3 {
  color: #4a495c;
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
}

.electric-vehicle-container p {
  color: #666678;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.electric-vehicle-container .electric-specs-card {
  display: flex;
  padding: 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  flex: 1 0 0;
  border-radius: 16px;
  border: 1px solid #f4f4f5;
  background: #fff;
  width: 246px;
}

.electric-vehicle-container h4 {
  color: #4a495c;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 900;
  line-height: 36px;
}

.electric-specs-card h5 {
  margin: 0px;
  color: #343243;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.electric-specs-card p {
  margin: 0px;
  color: #666678;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.charging-specs-text {
  margin-top: 24px;
}

.charging-specs-text p {
  color: #666678;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.electric-vehicle-container .charging-specs-card {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  flex: 1 0 0;
  border-radius: 16px;
  border: 1px solid #eaeaeb;
  background: #fbfbfc;
  width: 374px;
}

.charging-specs-card .charging-specs-card-text h3,
.charging-specs-card .charging-specs-card-details h3 {
  color: #000;
  text-align: right;
  font-family: Inter;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px;
  text-align: center;
}

.charging-specs-card .charging-specs-card-text {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.charging-specs-card svg {
  font-size: 32px;
}

.charging-specs-card .charging-specs-card-text p,
.charging-specs-card .charging-specs-card-details p {
  color: #7a7884;
  text-align: right;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  text-align: center;
}

.electric-specs-card-section {
  display: flex;
  gap: 16px;
}

.electric-specs-card-section .electric-specs-card:nth-of-type(-n + 3) {
  margin-bottom: 10px;
}

.charging-specs-card-section {
  display: flex;
  gap: 24px;
}

.similar-models-wrapper {
  display: flex;
  gap: 16px;
}

@media only screen and (max-width: 768px) {
  .similar-models-wrapper {
    flex-direction: column;
  }
  .similar-models-card {
    width: 170px;
  }
  .electric-specs-card-section .electric-specs-card:nth-of-type(-n + 2) {
    margin-bottom: 0px;
  }
  .electric-specs-card-section .electric-specs-card:nth-of-type(3) {
    margin-bottom: 16px;
  }
  .charging-specs-card-section,
  .electric-specs-card-section {
    flex-direction: column;
  }
  .electric-vehicle-container .electric-specs-card,
  .electric-vehicle-container .charging-specs-card {
    width: 100%;
  }
}

/* Electric Vehicle Data CSS end */

/* Best Deals Container CSS start */

.ef-checkbox-label {
  display: flex;
  padding: 12px 24px;
  align-items: center;
  gap: 16px;
  align-self: stretch;
  border-radius: 16px;
  background: #fbfbfc;
}

.checkbox-label-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 96%;
}

.checkbox-label-section label {
  color: #4a495c;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.checkbox-label-section h4 {
  margin: 0;
  padding: 0;
  color: #4a495c;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
}

.filter-dropdown .form-section {
  display: flex;
  gap: 4px;
}

.form-section .tooltip-container {
  display: flex;
  align-items: center;
}

.best-deals-incentives-deals-card {
  padding: 16px;
  border: 1px solid #eaeaeb;
  border-radius: 16px;
  display: flex;
  width: 100%;
  align-items: center;
  gap: 16px;
}

.best-deals-container-header h2 {
  color: #4a495c;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  margin: 0;
}

.best-deals-container-header p {
  color: #5e6282;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.incentives-deals-card-up-section {
  display: flex;
  gap: 24px;
  flex: 1;
}

.incentives-deals-card-chip {
  padding: 2px 12px;
  border-radius: 12px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 78px;
}

.input-checkbox-chip-container .incentives-deals-card-chip {
  display: none;
}

.incentives-deals-card-chip.cash-deals {
  background-color: #fef3c7;
}

.incentives-deals-card-chip.lease {
  background-color: #fee2e2;
}

.incentives-deals-card-chip.finance {
  background-color: #ede9fe;
}

.incentives-deals-card-chip span {
  color: #92400e;
  text-align: center;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.incentives-deals-card-chip.cash-deals span {
  color: #92400e;
}

.incentives-deals-card-chip.lease span {
  color: #991b1b;
}

.incentives-deals-card-chip.finance span {
  color: #5b21b6;
}

.incentives-deals-card-up-section h1 {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
  text-transform: capitalize;
  margin: 0;
}

.description-deals-section {
  display: flex;
  width: 100%;
  justify-content: space-between;
}

.incentives-deals-card-down-section {
  display: flex;
  gap: 24px;
  flex: 2;
}

.customer-cash-text {
  display: flex;
  gap: 8px;
  align-items: center;
}

.customer-cash-text span {
  font-size: 16px;
  line-height: 20px;
  color: #7a7884;
  font-weight: 400;
}

.customer-cash-text strong {
  font-size: 24px;
  line-height: 32px;
  color: #4a495c;
  font-weight: 500;
}

/*.customer-cash-text-seperator {
border-bottom: 1px solid #ededed;
}*/

.exp-view-details-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.exp-view-details-section p {
  font-size: 14px;
  color: #7a7884;
  padding: 0;
  line-height: 20px;
  font-weight: 600;
  margin: 0px;
}

.exp-view-details-section p span {
  color: #4a495c;
}

.exp-view-details-section a {
  font-size: 14px;
  color: #4a495c;
  padding: 0;
  line-height: 24px;
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}

.customer-cash-text-section {
  display: flex;
  align-items: center;
  gap: 4px;
}

.customer-cash-tex-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.customer-cash-tex-title span {
  color: #7a7884;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
}

.customer-cash-tex-title h2 {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
  padding: 0;
  margin: 0;
}

/* .customer-cash-tex-title-sep {
border-right: 1px solid #d9d9d9;
height: 32px;
} */

.best-deals-container .best-deals-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.best-deals-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0 24px;
}

.best-deals-container-btn {
  display: flex;
  justify-content: center;
  align-items: center;
}

.best-deals-container-btn .best-deals-btn {
  height: 48px;
  padding: 0px 36px;
  gap: 12px;
  align-self: stretch;
  color: #fff;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border-radius: 16px;
  background: #0169ff;
  border: none;
  width: 420px;
}
.best-deals-container-btn .best-deals-btn.logged-In {
  width: 342px;
}

.best-deals-incentives-deals-card-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  height: 452px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.more-deals-icon-container {
  display: flex;
  width: 36px;
  height: 36px;
  padding: 4px 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  border: 1px solid #eaeaeb;
  background: #fff;
  color: #4a495c;
}

.more-deals-icon-container svg {
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: #4a495c;
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: 24px;
}

.filter-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.filter-container .filter-button-address-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.filter-container .filter-button-address-section .filter-buttons {
  display: flex;
  gap: 4px;
}
.filter-container .filter-button-address-section .filter-buttons .filter-btn {
  display: flex;
  padding: 4px 16px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 11px;
  border: 1px solid #eaeaeb;
  background: #fff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
  color: #4a495c;
}

.filter-container
  .filter-button-address-section
  .filter-buttons
  .filter-btn.filter-active {
  color: #fff;
  background: #4a495c;
}

.filter-container .filter-dropdown {
  display: flex;
  align-items: flex-start;
  align-content: flex-start;
  gap: 4px;
  align-self: stretch;
  width: 100%;
}

.filter-container .filter-dropdown .filter-select {
  border: 1px solid #eaeaeb;
  border-radius: 12px;
  padding: 4px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 11px;
  cursor: pointer;
  width: max-content;
}

.filter-container .filter-dropdown .filter-select label {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  margin: 0;
}

.filter-container .filter-dropdown .filter-select .dropdown-option,
#eligibility-factors-list {
  border: unset;
  font-size: 14px;
  font-weight: 800;
  color: #0169ff;
  appearance: none !important;
  padding: 0 4px;
  background: #fff;
}
.filter-container .filter-dropdown .filter-select .dropdown-option:focus {
  border: none;
  outline: none;
}
.filter-container .filter-dropdown .filter-select svg {
  font-size: 16px;
  color: #0169ff;
}

#jdp-trim-select {
  position: relative;
}

#jdp-trim-list {
  position: absolute;
  opacity: 0;
  height: 100%;
  width: 94%;
}
.trim-selected-option {
  font-size: 14px;
  font-weight: 800;
  color: #0169ff;
}
.filter-container .more-dealers-addredd-section {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.filter-container .more-dealers-addredd-section .more-dealers-icon-text {
  display: flex;
  gap: 10px;
  align-items: center;
}
.filter-container .more-dealers-addredd-section .more-dealers-icon-text svg {
  color: #4a495c;
  font-size: 18px;
}
.filter-container
  .more-dealers-addredd-section
  .more-dealers-icon-text
  .city-zip-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
}

.filter-container
  .more-dealers-addredd-section
  .more-dealers-addredd-seperator {
  border-right: 1px solid #eaeaeb;
  height: 20px;
}
.filter-container .more-dealers-addredd-section .location-btn {
  color: #0169ff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  border: none;
  cursor: pointer;
  background-color: #fff;
  text-decoration: underline;
}
.best-deals-incentives-deals-card .deals-checkbox {
  width: 16px;
  height: 16px;
  margin: 0;
  cursor: pointer;
}
.input-checkbox-chip-container {
  display: flex;
  gap: 8px;
  align-items: center;
}
.pgid-more-deals-container {
  display: flex;
  gap: 10px;
  align-items: center;
  cursor: pointer;
}
.pgid-more-deals-container h3 {
  color: #22c55e;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 26px;
  text-transform: capitalize;
  display: none;
  margin: 0;
}

.ef-error-message {
  font-size: 14px;
  font-weight: 700;
  line-height: 26px;
  color: red;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}

.best-deals-container #deals-loader {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
  line-height: 28x;
  text-align: center;
}
#best-deals-change-location-popup .popup-content {
  width: 303px;
}
.change-location-form-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.change-location-form-section h1 {
  font-size: 24px;
  color: #4a495c;
  padding: 0;
  font-weight: 800;
  line-height: 36px;
  margin: 0 0 20px 0;
}
.change-location-form-section p {
  font-size: 14px;
  font-weight: 500;
  line-height: 24px;
  color: #7a7884;
  margin: 0;
}

.change-location-form-section .form-label-text-filed {
  display: flex;
  flex-direction: column;
}

.change-location-form-section .form-label-text-filed .label-text-filed {
  display: flex;
  flex-direction: column;
  border: 1px solid #c9c9cc;
  border-radius: 8px;
  margin: 16px 0 24px;
}
.change-location-form-section .label-text-filed label {
  font-size: 8px;
  color: #7a7884;
  font-weight: 800;
  line-height: 16px;
  padding: 8px 0 0 16px;
  margin: 0;
}
.change-location-form-section .label-text-filed .change-location-text-field {
  width: 100%;
  border: none;
  font-size: 14px;
  color: #4a495c;
  font-weight: 500;
  padding: 0 16px 8px;
  border-radius: 8px;
}
.change-location-form-section
  .label-text-filed
  .change-location-text-field:focus {
  outline: none;
  border: none;
}
.change-location-form-section .form-error-msg {
  font-size: 12px;
  color: red;
  font-weight: 600;
  padding: 0 16px 8px;
}
.change-location-form-section .change-location-confirm-btn {
  border: none;
  font-size: 16px;
  color: #fff;
  background-color: #0169ff;
  border-radius: 16px;
  font-weight: 800;
  height: 48px;
  width: 100%;
  cursor: pointer;
}
#best-deals-eligibility-factors-popup .popup-content {
  width: 704px;
  max-width: 704px;
  padding: 24px;
}
#best-deals-eligibility-factors-popup .popup-content .popup-close {
  top: 15px;
  right: 20px;
}

#best-deals-eligibility-factors-popup .ef-popup-container h5 {
  color: #4a495c;
  text-align: center;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0px 0px 16px 0px;
}
#best-deals-eligibility-factors-popup
  .ef-popup-container
  .ef-form-label-text-filed {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 16px;
  height: 500px;
  overflow-y: auto;
}
#best-deals-eligibility-factors-popup
  .ef-popup-container
  .ef-form-label-text-filed
  .ef-checkbox-label {
  display: flex;
  align-items: center;
  gap: 16px;
  cursor: pointer;
}
#best-deals-eligibility-factors-popup
  .ef-popup-container
  .ef-form-label-text-filed
  .ef-checkbox-label
  input {
  width: 4%;
  height: 16px;
  margin: 0;
  cursor: pointer;
}
#best-deals-eligibility-factors-popup
  .ef-popup-container
  .ef-form-label-text-filed
  .ef-checkbox-label
  label {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  margin: 0;
}
#best-deals-eligibility-factors-popup .ef-popup-container .ef-next-btn {
  display: flex;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
  background: #0169ff;
  width: 100%;
  color: #fff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border: none;
  margin-top: 24px;
}

@media only screen and (max-width: 1192px) {
  .incentives-deals-card-down-section {
    flex-direction: column;
    gap: 4px;
  }
}

@media only screen and (max-width: 993px) {
  .best-deals-container {
    padding: 0px 0px;
  }
}
@media only screen and (max-width: 738px) {
  #best-deals-eligibility-factors-popup .popup-content {
    width: 535px;
  }
}
@media only screen and (max-width: 605px) {
  .description-deals-section {
    flex-direction: column;
    gap: 8px;
  }

  .incentives-deals-card-up-section {
    width: 100%;
  }
}
@media only screen and (max-width: 655px) {
  #best-deals-eligibility-factors-popup
    .ef-popup-container
    .ef-form-label-text-filed {
    padding: 0 0px;
  }
}

@media only screen and (max-width: 560px) {
  #best-deals-eligibility-factors-popup .popup-content {
    width: 300px;
  }
}

@media only screen and (max-width: 535px) {
  .filter-container .filter-button-address-section {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
  }
  .incentives-deals-card-up-section .incentives-deals-card-chip {
    display: none;
  }
  .input-checkbox-chip-container .incentives-deals-card-chip {
    display: flex;
    height: 24px;
  }
  .best-deals-incentives-deals-card {
    align-items: flex-start;
    flex-direction: column;
  }
  .customer-cash-text-section {
    align-items: flex-start;
    gap: 0px;
    flex-direction: column;
  }
  .filter-container .filter-dropdown {
    flex-direction: column;
  }
  .filter-container .filter-dropdown .filter-select {
    gap: 0px;
    width: 100%;
  }
  .pgid-more-deals-container {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media only screen and (max-width: 400px) {
  .filter-container .filter-dropdown .filter-select label {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
}

/* Best Deals Container CSS end */

/* Best Deals Pop Up CSS start */
.popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  justify-content: center;
  align-items: center;
}

.popup-content {
  background-color: white;
  padding: 20px;
  border-radius: 10px;
  max-width: 500px;
  width: 90%;
  position: relative;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.popup-close {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  font-size: 24px;
  color: #888;
}

.deal-details-popup-conatiner {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.deal-details-popup-section {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 0px 31px;
}

.heading-img-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.heading-img-section h2 {
  font-size: 24px;
  line-height: 36px;
  font-weight: 800;
  color: #4a495c;
  padding: 0;
}

.heading-img-section img {
  width: 100%;
  height: 173px;
  object-fit: contain;
}

.deal-details-popup-section h3 {
  font-size: 16px;
  line-height: 28px;
  font-weight: 600;
  color: #4a495c;
  padding: 0;
}

.deal-details-popup-section ul {
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.deal-details-popup-section ul li {
  list-style-type: none;

  display: flex;
  gap: 8px;
  align-items: baseline;
  font-size: 16px;
  line-height: 28px;
  color: #4a495c;
  font-weight: 400;
}

.deal-details-popup-section ul li svg {
  font-size: 14px;
}

.deal-details-popup-section p {
  font-size: 14px;
  line-height: 24px;
  color: #7a7884;
  font-weight: 500;
}

.deal-details-popup-conatiner a {
  font-size: 16px;
  line-height: 150%;
  color: #fff;
  background-color: #0169ff;
  font-weight: 800;
  border: none;
  border-radius: 16px;
  padding: 12px 36px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
}

.area-outer-wrap .da-close {
  right: 8px;
  top: 8px;
}

@media (max-width: 500px) {
  .deal-details-popup-section {
    padding: 0px;
  }
}

/* Best Deals Pop Up CSS end */
/* Fastest Selling Widget CSS start */

.fastest-selling-content-description {
  color: #5e6282;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
}

.car-selling-table th:nth-child(4) .tooltip-container,
.car-selling-table th:nth-child(5) .tooltip-container,
.car-selling-table th:nth-child(6) .tooltip-container {
  display: inline-block;
  margin-left: 8px;
  vertical-align: middle;
}

.car-selling-table-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-family: Inter;
}
.car-selling-table-container h2 {
  font-size: 24px;
  line-height: 36px;
  font-weight: 900;
  color: #4a495c;
  margin: 0;
  padding: 0;
}
.car-selling-table {
  border: none !important;
}
.car-selling-table thead tr th,
.car-selling-table tbody tr td {
  font-size: 14px;
  line-height: 28px;
  font-weight: 600;
  color: #343243;
  padding: 8px 16px;
  border-bottom: 1px solid #eaeaeb;
  text-align: left;
}

.car-selling-table thead tr th .text-head span {
  font-size: 12px;
  line-height: 28px;
  font-weight: 300;
}
.car-selling-table thead tr th {
  border-right: 1px solid #eaeaeb;
  white-space: nowrap;
}

.car-selling-table tbody tr td {
  font-weight: 400;
  line-height: 20px;
  color: #4e4e4e;
  border-right: 1px solid #eaeaeb;
}

.car-selling-table tbody tr td:nth-child(1) {
  white-space: nowrap;
}
.car-selling-table tbody tr td:nth-child(2) {
  color: #0169ff;
  white-space: nowrap;
}

.car-selling-table tbody tr td:nth-child(1) p {
  color: #333333;
  font-weight: 700;
  margin-right: 8px;
  padding: 0;
  display: inline-block;
}

.car-selling-table thead tr th:last-child,
.car-selling-table tbody tr td:last-child {
  border-right: none;
}

.table-row a {
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  color: #0169ff;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.car-selling-table tbody tr td:last-child svg,
.table-row a svg {
  margin-left: 8px;
}

.car-selling-table tbody tr td:last-child svg {
  margin-left: 8px;
}

.show-all-fast-selling-cars-link {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 24px 0px;
}

.show-all-fast-selling-cars-link .show-fastest-car-link-text {
  color: #0169ff;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 28px;
}

.show-all-fast-selling-cars-link .show-fastest-car-link-text:hover {
  text-decoration: underline;
  cursor: pointer;
}

.chevron-right-icon-wrapper {
  color: #0169ff;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.tooltip-container {
  position: relative;
}
.tooltip-icon {
  color: #0169ff;
  font-size: 16px;
  font-weight: 900;
  position: relative;
  cursor: pointer;
}
.tooltip-text {
  width: max-content;
  visibility: hidden;
  background-color: #333;
  color: #fff;
  text-align: center;
  padding: 5px 10px;
  border-radius: 4px;
  position: absolute;
  bottom: 125%; /* Adjust position above the icon */
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.9rem;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip-container:hover .tooltip-text {
  visibility: visible;
  opacity: 1;
}

.tooltip-container .tooltip-text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-width: 5px;
  border-style: solid;
  border-color: #333 transparent transparent transparent;
}

.form-wrapper {
  width: 100%;
  margin: 24px 0px;
}

.form-wrapper .col-md-6:nth-child(1) {
  padding-right: 0px;
}
.form-wrapper .col-md-6:nth-child(2) {
  padding-left: 8px;
}

.mobile-view-for-table-component {
  display: none;
}

.table-row {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 275px;
  height: 28px;
}

.table-cell {
  display: flex;
  align-items: center;
  gap: 8px;
}

.table-row h3 {
  font-size: 14px;
  line-height: 28px;
  font-weight: 600;
  color: #343243;
  padding: 6px 0 !important;
}
.table-row p {
  font-size: 14px;
  line-height: 28px;
  font-weight: 400;
  color: #4e4e4e;
  padding: 10px 0 !important;
  margin: 0px !important;
}

.table-heading-body-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
  border: 1px solid #eaeaeb;
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 24px;
  align-items: flex-start;
  align-self: stretch;
}

#make-row {
  justify-content: space-between;
}

.make-table-cell {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fastest-selling-indexing {
  color: #333333;
  font-weight: 700;
  padding-right: 16px;
}

#state-dropdwon-container,
#city-dropdwon-container {
  cursor: pointer !important;
}

#tooltip-span {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid #ccc;
  border-radius: 5px;
  display: none;
  white-space: nowrap;
  z-index: 1000;
  font-size: 12px;
  border: 1px solid #ccc;
  background-color: #fff;
  color: #4a495c;
  padding: 8px;
  border-radius: 8px;
}

#tooltip-span .tooltipArrow {
  content: "";
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid #f5f5f5;
  z-index: 1000;
}

@media only screen and (max-width: 860px) {
  .car-selling-table {
    display: none;
  }

  .mobile-view-for-table-component {
    display: flex;
    margin-top: 24px;
    overflow-x: scroll;
    gap: 16px;
  }
  .tooltip-text {
    width: 300px;
  }
}

@media only screen and (max-width: 768px) {
  .form-wrapper .col-md-6:nth-child(1) {
    padding-left: 0px;
  }
}

@media only screen and (max-width: 501px) {
  .fastest-row-wrapper .row .col-md-12:nth-child(1) {
    padding: 0 0px;
  }
  .form-wrapper .col-md-6:nth-child(2) {
    padding-right: 0px;
  }
}

@media only screen and (max-width: 445px) {
  .table-heading-body-container .table-row {
    width: 250px;
  }
}

@media only screen and (max-width: 400px) {
  .table-heading-body-container .table-row {
    width: 212px;
  }
}

/* Fastest Selling Widget CSS end */

/* Thanks Popup CSS start */

.thanks-popup-btn {
  display: flex;
  height: 60px;
  padding: 19px 24px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  align-self: stretch;
  border-radius: 10px;
  background: #0169ff;
  box-shadow: 0px 20px 35px 0px rgba(1, 105, 255, 0.15);
  color: var(--white, #fff);
  text-align: center;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  border: none;
}

@media only screen and (max-width: 760px) {
  .offer-gradient-inner-heading-secrtion .title-subtitle-section {
    margin-top: 0px !important;
  }
}

/* Thanks Popup CSS end */

/* new email popup css */
#toolkit-guide-popup .offer-container-left-sec {
  width: 100%;
  max-width: 521px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
#guide-form .guide-form-container {
  padding: 8px 0px;
  margin: 0px 0px 24px;
  display: flex;
  border-radius: 31px;
  box-shadow: 0 4px 19px rgba(0, 0, 0, 0.05);
  background: #fff;
  border: 1px solid #eaeaeb;
  align-items: center;
}
#guide-form .guide-form-container * {
  width: 25%;
}
#guide-form .guide-form-container select {
  background: transparent;
  appearance: none;
  border: none;
  height: 21px;
  font-size: 14px;
  font-weight: 400;
  padding: 0px 16px;
  background-image: url(https://caredge.com/wp-content/uploads/2025/01/caret-down.webp);
  background-repeat: no-repeat;
  background-size: 8px;
  border-right: 1px solid #8c959f;
  background-position-x: 85%;
  background-position-y: 50%;
}
#guide-form .guide-form-container input {
  height: 21px;
  min-height: 21px;
  font-size: 14px;
  font-weight: 400;
  padding: 0px 16px;
  color: #4a495c;
  border: 0px;
  background: transparent;
}
#guide-form .guide-form-container input:focus-visible,
#guide-form .guide-form-container select {
  outline: none;
}
@media (max-width: 1023px) {
  .offer-container-popup-overlay .overlay-content {
    width: 90%;
    overflow: scroll;
  }
  .offer-container-left-sec {
    max-width: 55% !important;
  }
}
@media (max-width: 1000px) {
  .popup-img {
    width: 42%;
  }
  .offer-container-tags.ps-1 {
    right: 21%;
  }
  .offer-container-left-sec .title-subtitle-section h1 {
    width: 100%;
  }
}
@media (max-width: 880px) {
  .offer-container-left-sec .title-subtitle-section h1 {
    font-size: 20px;
    line-height: 40px;
  }
  .offer-container-tags.ps-1 {
    right: 18%;
  }
}
@media (max-width: 767px) {
  .popup-img {
    width: 100%;
  }
  .offer-gradient-inner-heading-secrtion {
    position: relative;
  }
  .offer-container-left-sec {
    max-width: 100% !important;
    padding: 0px 24px 24px;
  }
  #guide-form .guide-form-container {
    flex-direction: column;
    gap: 24px;
    padding: 24px 0px;
  }
  #guide-form .guide-form-container * {
    width: 100%;
  }
  #guide-form .guide-form-container select {
    border-right: none;
    background-position-x: 92%;
  }
  .offer-container-tags.ps-2 {
    bottom: 10px;
  }
}

/* new nav css added here */
.new-header-menu {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  /* max-width: 1280px; */
  margin: 0 auto;
  padding: 16px 24px;
  position: fixed;
  background: #fff;
  z-index: 2;
  top: 0;
  box-shadow: 0 0 7px rgba(0, 0, 0, 0.1) !important;
}
.new-header-menu .new-center-nav {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 48px;
}
.new-header-menu .header-logo {
  width: 110px;
}

.new-header-menu .new-center-nav a {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.profile-container {
  display: flex;
  align-items: center;
  gap: 8px;
}

.caredge-bagde-profile {
  display: flex;
  width: 48px;
  height: 48px;
  justify-content: center;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  border: 1px solid #eaeaeb;
  background: #fff;
  cursor: pointer;
}

.caredge-bagde-profile .caredge-badge-icon {
  width: 24.001px;
  height: 23.876px;
  transform: none;
  transition: none;
}

.caredge-bagde-profile img {
  width: 100%;
}

.menu-container {
  display: flex;
  height: 48px;
  padding: 0px 8px;
  align-items: center;
  gap: 8px;
  border-radius: 16px;
  border: 1px solid #eaeaeb;
  background: #fff;
  cursor: pointer;
}

.menu-container span {
  display: flex;
  width: 36px;
  height: 36px;
  padding: 8px;
  justify-content: center;
  align-items: center;
  color: #4a495c;
}

.menu-container .bar-menu svg {
  font-size: 18px;
  color: #4a495c;
}

.menu-container .p-menu {
  border-radius: 12px;
  background: #f4f4f5;
  position: relative;
  font-size: 16px;
}

.menu-container .p-menu svg {
  font-size: 16px;
  color: #4a495c;
}

.menu-container .p-menu::after {
  content: "";
  width: 12px;
  height: 12px;
  position: absolute;
  right: 0px;
  top: -1px;
  background: #e71b00;
  border-radius: 50%;
}
@media (max-width: 767px) {
  .menu-v3-main-menu-container {
    display: none;
  }
}

/* right drawer css code */
.drawer {
  position: fixed;
  top: 0;
  right: -408px;
  width: 390px;
  height: 100%;
  background: #fff;
  padding: 16px 24px 24px;
  transition: right 0.3s ease-in-out;
  display: flex;
  flex-direction: column;
  box-shadow: -4px 0px 24px 0px rgba(1, 105, 255, 0.24);
}
.drawer.open {
  right: 0;
}
#drawer .close-btn-container {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-bottom: 16px;
}
#drawer .close-btn-container .close-btn {
  padding: 0px;
  cursor: pointer;
  border: none;
  background: transparent;
  font-size: 18px;
  color: #000;
  position: unset;
}

#drawer .close-btn svg {
  font-size: 18px;
}

.flex-content-container {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
}
.slider-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.profile-avatar-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.profile-wrapper {
  display: none;
  align-items: center;
  gap: 16px;
}

.guest-profile-wrapper {
  display: flex;
  align-items: center;
  gap: 16px;
}

.profile-img {
  display: flex;
  width: 32px;
  height: 32px;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: #f4f4f5;
}

.profile-img svg {
  font-size: 16px;
  color: #4a495c;
}

.profile-avatar,
.menu-profile-avatar {
  overflow: hidden;
  background-color: #9fd4ff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
}

.profile-avatar {
  height: 32px;
  width: 32px;
  border-radius: 100%;
}

.menu-profile-avatar {
  height: 36px;
  width: 36px;
  border-radius: 12px;
}

.profile-auth-info {
  display: flex;
  align-items: center;
  gap: 24px;
}

.profile-auth-info #profile-login {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
}

.profile-auth-info #profile-sign-up {
  color: #fff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  border-radius: 12px;
  background: #0169ff;
  height: 36px;
  padding: 0px 24px;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
}

.profile-auth-info a:hover {
  text-decoration: none;
}

#drawer .profile-details {
  color: #4a495c;
  font-family: Inter;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 32px;
  margin: 0px;
}

.add-car-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
}

.manage-subscription-section {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
  justify-content: space-between;
}

.subscription-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
}

.subscription-logo-text {
  display: flex;
  align-items: center;
  gap: 12px;
}

.manage-link {
  display: flex;
  align-items: center;
  gap: 6.373px;
  border-radius: 6.373px;
  background: #fff;
}

.manage-link svg {
  -webkit-text-stroke-width: 1.59px;
  -webkit-text-stroke-color: #4a495c;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 26px;
}

.manage-link a {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

#drawer .car-image-wrapper-sec {
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: center;
  gap: 12.745px;
  align-self: stretch;
  border-radius: 12.745px;
  border: 0.797px solid #eaeaeb;
  background: #fff;
}

#drawer .car-image-wrapper-sec .top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}

.top-loading-skeleton {
  width: 100px;
  height: 26px;
  border-radius: 3.186px;
  background: #f4f4f5;
}

.add-car-wrapper,
.more-icon-wrapper {
  display: flex;
  align-items: center;
  gap: 6.373px;
  border-radius: 6.373px;
  background: #fff;
}

.add-car-wrapper .svg,
.more-icon-wrapper svg {
  -webkit-text-stroke-width: 1.59px;
  -webkit-text-stroke-color: #4a495c;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 26px;
}

.add-car-wrapper a,
.more-icon-wrapper a {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

#drawer .car-image-wrapper-sec img {
  width: 168.079px;
  height: 65.32px;
}

#drawer .car-image-wrapper-sec .bottom {
  display: flex;
  height: 54px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.full-loading-skeleton {
  height: 24px;
  width: 100%;
  flex-shrink: 0;
  align-self: stretch;
  border-radius: 3.186px;
  background: #f4f4f5;
}

.bottom-loading-skeleton {
  width: 238px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 3.186px;
  background: #f4f4f5;
}

.vehicle-owned-container {
  display: none;
  padding: 16px;
  flex-direction: column;
  align-items: center;
  gap: 12.745px;
  align-self: stretch;
  border-radius: 12.745px;
  border: 0.797px solid #eaeaeb;
  background: #fff;
}

.vehicle-price-more-section {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  align-self: stretch;
}

.price-info {
  display: flex;
  align-items: center;
  gap: 4px;
}
.price-info svg {
  color: #9e1e0c;
  font-size: 14px;
}
.price-info p {
  color: #9e1e0c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
}

.vehicle-img {
  width: 145.071px;
  flex-shrink: 0;
}

.vehicle-details {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}

.vehicle-make-model {
  overflow: hidden;
  color: #4a495c;
  text-overflow: ellipsis;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
}

.vehicle-details p {
  display: flex;
  align-items: center;
  gap: 8px;
}

.vehicle-vin-text,
.mileage-text {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.profile-options-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.profile-options-details {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  padding: 8px 0px;
}

.profile-options-details svg {
  color: #4a495c;
  text-align: center;
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.profile-options-details p {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 26px;
  margin: 0px;
}

.profile-options-details:hover {
  text-decoration: none;
}

.profile-sub-options svg,
.profile-sub-options p {
  color: #afafb4;
}

.profile-option-accordian {
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.profile-option-accordian div {
  display: flex;
  gap: 8px;
  align-items: center;
}

.profile-sub-options-sec {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
  background-color: #fff;
}

.active .profile-sub-options-sec {
  max-height: 200px;
  transition: max-height 0.3s ease-in;
}

.dynamic-margin {
  margin-top: -8px;
}

.profile-options-details .toggle-icon {
  font-size: 14px;
}

.bottom-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 26px;
  align-self: stretch;
}

.question-text {
  color: #0169ff;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  padding: 0px;
  cursor: pointer;
}

.question-text:hover {
  text-decoration: none;
  color: #0169ff;
}

.logout-action {
  display: flex;
  align-items: center;
  gap: 13px;
  align-self: stretch;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
  padding-bottom: 8px;
}

.logout-action:hover {
  text-decoration: none;
}

.logout-action svg {
  color: #4a495c;
  text-align: center;
  font-family: "Font Awesome 6 Pro";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.logout-action p {
  color: #4a495c;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  margin: 0px;
}

@media (max-width: 500px) {
  .drawer {
    width: 100%;
    right: -102%;
  }

  .bottom-section {
    gap: 24px;
  }

  .flex-content-container {
    gap: 32px;
  }
}

/* what can i do popup css */
#what-can-i-do-with-caredge-popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(74, 73, 92, 0.4);
  display: none;
  justify-content: center;
  align-items: center;
}

.popup {
  background: #fff;
  border-radius: 8px;
  width: 100%;
  max-width: 1108px;
  height: auto;
  text-align: center;
  position: relative;
  border-radius: 16px;
  animation: fadeIn 0.3s ease-in-out;
  display: flex;
}

#what-can-i-do-with-caredge-popup .close-popup {
  font-size: 20px;
  cursor: pointer;
  border: none;
  background: none;
}

#what-can-i-do-with-caredge-popup .popup .close-popup {
  padding: 0px;
  cursor: pointer;
  background: transparent;
  color: #000;
  border: none;
  font-size: 18px;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

#what-can-i-do-with-caredge-popup .sidebar {
  width: 27.5%;
  padding: 0px;
  border-right: 1px solid #eaeaeb;
  margin: 0px;
}

.content-wrapper {
  width: 72.5%;
}

.tab {
  display: flex;
  padding: 16px 24px;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  color: #4a495c;
  font-size: 14px;
  font-weight: 500;
}

.tabs-group {
  padding: 0px 0px 18px;
  border-bottom: 1px solid #eaeaeb;
}

.tabs-group:last-of-type {
  border-bottom: none;
}

.tab-header {
  display: flex;
  padding: 16px 24px;
  gap: 8px;
  align-items: center;
  color: #4a495c;
  font-size: 16px;
  font-weight: 700;
  margin-top: 20px;
  cursor: pointer;
}

#what-can-i-do-with-caredge-popup .tab-header img {
  width: 22px;
  height: 22px;
}

#what-can-i-do-with-caredge-popup .tab .popup-tab-icon {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#what-can-i-do-with-caredge-popup .tab .popup-tab-icon svg {
  font-size: 16px;
}

#what-can-i-do-with-caredge-popup .tab:hover,
.tab.active {
  background: #e2f2ff;
  color: #0169ff;
  font-weight: 700;
}

#what-can-i-do-with-caredge-popup .tab:hover .popup-tab-icon svg,
#what-can-i-do-with-caredge-popup .tab.active .popup-tab-icon svg {
  color: #0169ff !important;
}

.content {
  flex: 1;
  padding: 0px;
  display: none;
}

.content.active {
  display: block;
}

.content h2 {
  font-size: 22px;
  margin-bottom: 10px;
}

.content p {
  color: #555;
  font-size: 14px;
  margin-bottom: 20px;
}

.popup .top-sec {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 56px;
  padding: 0px 24px;
  border-bottom: 1px solid #eaeaeb;
}

.top-sec p {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  margin: 0px;
}

.popup .content-wrap-sec {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.bottom-sec {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #eaeaeb;
  padding: 0px 0px 24px;
}

.bottom-sec-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 69%;
}

#market-insights .bottom-sec-content {
  width: 62%;
}

#black-book .bottom-sec-content {
  width: 61%;
}

.bottom-sec-content h2 {
  color: #4a495c;
  font-family: Inter;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px;
  padding: 0px;
  margin: 0px;
  text-align: left;
  text-transform: capitalize;
}

.bottom-sec-content p {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0px;
  text-align: left;
}

.bottom-sec-btn {
  display: flex;
  height: 48px;
  padding: 0px 24px;
  justify-content: flex-end;
  align-items: center;
  border-radius: 16px;
  background: #0169ff;
  text-decoration: none;
  color: #fff;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}

.bottom-sec-btn:hover {
  color: #fff;
  text-decoration: none;
}

.popup .content-wrap-sec img {
  width: 100%;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.1);
  border-radius: 7.514px;
  /* height: 456px; */
}
.mobile-nav,
.popup .sidebar .close-popup {
  display: none;
}
.new-header-menu .profile-container .menu-container .menu-profile-avatar {
  border-radius: 12px;
}
.drawer {
  overflow-y: auto;
}

/* style for make-model-dropdown */

.custom-dropdown {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 300px;
  cursor: pointer;
}

.selected-option {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 24px;
  cursor: pointer;
  gap: 8px;
  text-align: center;
}

.selected-option span {
  overflow: hidden;
  color: #4a495c;
  text-overflow: ellipsis;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 28px;
  width: 100%;
  white-space: nowrap;
}

.dropdown-options {
  display: none;
  position: absolute;
  width: 100%;
  margin-top: 5px;
  padding: 0;
  list-style: none;
  border-radius: 16px;
  border: 1px solid #eaeaeb;
  background: #fff;
  box-shadow: 0px 0px 24px 0px rgba(1, 105, 255, 0.25);
  z-index: 10;
}

.custom-dropdown.open .dropdown-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 0px;
}

.dropdown-option {
  display: flex;
  align-items: center;
  padding: 0px 24px;
  font-size: 14px;
  font-weight: 500;
  color: #4a495c;
  cursor: pointer;
  gap: 13px;
}

.check-icon {
  visibility: hidden;
}

.check-icon.visible {
  visibility: visible;
  color: #4a495c;
  font-size: 16px;
}
/* style for make-model-dropdown ended */
.mobile-drawer-top-sec,
.mobile-modal-header {
  display: none;
}
/* style progress tracker */
.progress-tracker-sec {
  display: none;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.progress-tracker-sec p {
  color: #afafb4;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
}
.progress-container {
  width: 100%;
  height: 12px;
  background: #ddd;
  position: relative;
  border-radius: 16px;
  overflow: hidden;
}
.progress-bar {
  width: 20%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgb(24, 229, 192) 0%,
    rgb(198, 249, 52) 100%
  );
  transition: width 0.3s ease-in-out;
}
.progress-tracker-circle {
  width: 12px;
  height: 12px;
  background: #fff;
  border: 2px solid #c6f934;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 20%;
  transform: translate(-50%, -50%);
  transition: left 0.3s ease-in-out;
}
@media (max-width: 959px) {
  .content-wrapper {
    display: none;
  }
  .popup {
    width: 90%;
  }
  .sidebar,
  .content-wrapper,
  .bottom-sec-content,
  .bottom-sec-btn,
  #market-insights .bottom-sec-content,
  #black-book .bottom-sec-content {
    width: 100%;
  }
  .popup .content-wrap-sec img {
    height: auto;
  }
  .bottom-sec {
    flex-direction: column;
    padding: 0px;
    border-bottom: none;
  }
  .bottom-sec-btn {
    justify-content: center;
  }
  #what-can-i-do-with-caredge-popup .sidebar {
    border-right: none !important;
  }
  .mobile-nav {
    display: block;
    width: 100%;
  }
  .mobile-nav .menu-v3-main-menu-container {
    display: block;
  }
  .mobile-nav .new-center-nav {
    flex-direction: column;
    gap: 7px;
    align-items: flex-start;
    border-bottom: 1px solid #eaeaeb;
    padding: 0px 0px 16px;
  }
  .profile-options-details a svg {
    font-size: 16px;
    font-weight: 400;
  }
  .profile-option-accordian .toggle-icon {
    font-size: 14px;
  }

  .profile-options-container {
    gap: 6px;
  }
  .new-header-menu .new-center-nav {
    display: none;
  }
  .mobile-nav .new-center-nav {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    border-bottom: 1px solid #eaeaeb;
    padding: 0px 0px 16px;
  }
  .mobile-nav .new-center-nav svg {
    width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 400;
  }
  .new-header-menu .new-center-nav a {
    font-weight: 500;
    margin: 0px;
    padding: 8px 0px;
  }
  .flex-content-container {
    gap: 68px;
  }
  .popup .sidebar .top-sec {
    justify-content: center;
  }
  .popup .sidebar .close-popup {
    position: absolute;
    right: 24px;
    display: inline-block;
  }
  .logout-action {
    margin-bottom: 32px;
    padding-bottom: 0px;
  }
  .mobile-modal-header {
    display: block;
    text-align: left;
  }
  .mobile-modal-header p {
    color: #4a495c;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 30px;
    padding: 24px 24px 8px;
    margin: 0px;
  }
  .tab-header {
    cursor: none;
  }
}

@media (max-width: 767px) {
  .mobile-drawer-top-sec {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    position: fixed;
    top: 0px;
    width: 100%;
    background: white;
  }
  #drawer .close-btn-container {
    display: none;
  }
  #drawer .flex-content-container {
    margin-top: 80px;
    padding: 16px 24px;
  }
  #drawer {
    padding: 0px;
  }
}

/* new nav css ended */
/* make page css */
#make-page-sec .chart-title {
  padding: 0px 0px 24px;
}
#make-page-sec .col-car-brand-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  border-bottom: 1px solid #eaeaeb;
  padding-bottom: 16px;
}
#make-page-sec .make-car-brand-img {
  width: 30%;
  height: 240px;
  padding: 40px;
  background-color: #f7f7f7;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#make-page-sec .make-car-overview {
  width: 70%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
#make-page-sec .make-car-overview p {
  margin: 0;
  font-size: 16px;
  font-weight: 400;
  line-height: 30px;
  color: #4a495c;
}
#make-page-sec .make-car-overview a {
  width: fit-content;
  display: flex;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  border: 0;
  background-color: #0169ff;
  font-size: 16px;
  font-weight: 900;
  line-height: 150%;
  color: #ffffff;
  border-radius: 8px;
  text-decoration: none;
}

#make-page-sec .make-car-brand-img img {
  width: 100%;
  object-fit: contain;
}
#make-page-sec .make-car-cards-section {
  margin-top: 60px;
}
#make-page-sec .make-car-cards-section h2 {
  font-size: 24px;
  font-weight: 900;
  color: #4a495c;
  margin: 0 0 24px 0;
}
#make-card-sec {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin: 0px;
}

#make-card-sec .car-brand-flex {
  width: 364px;
  border: 1px solid #eaeaeb;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
}
#make-card-sec .car-brand-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#make-card-sec .car-brand-header h4 {
  font-size: 16px;
  line-height: 28px;
  font-weight: 700;
  margin: 0;
  color: #4a495c;
}

#make-card-sec .car-brand-header span {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  font-size: 14px;
  color: #0169ff;
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#make-card-sec .car-brand-img img {
  width: 100%;
  height: 180px;
  margin: 10px 0px;
  object-fit: cover;
}

#make-card-sec .car-brand-footer {
  display: flex;
  align-items: center;
  gap: 16px;
}
#make-card-sec .footer-item {
  width: 48%;
}
#make-card-sec .footer-left {
  border-right: 1px solid #eaeaeb;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: flex-start;
}
#make-card-sec .footer-right {
  padding: 0px;
  display: flex;
  justify-content: flex-end;
}
#make-card-sec .footer-item h4 {
  font-size: 16px;
  font-weight: 800;
  margin: 0;
  color: #4a495c;
}
#make-card-sec .footer-left p {
  font-size: 14px;
  line-height: 26px;
  font-weight: 300;
  margin: 0;
  color: #4a495c;
}
#make-card-sec .footer-right a {
  font-size: 16px;
  line-height: 28px;
  font-weight: 500;
  text-decoration: none;
  color: #0169ff;
  white-space: nowrap;
}
#make-card-sec .footer-right span {
  margin-left: 4px;
}
@media only screen and (max-width: 1202px) {
  #make-card-sec .car-brand-flex {
    width: 31.5%;
  }
}
@media only screen and (max-width: 992px) {
  #make-card-sec .car-brand-flex {
    width: 48%;
  }
  #make-card-sec .footer-item {
    padding: 0px;
    margin: 0px;
  }
}
@media only screen and (max-width: 767px) {
  #make-page-sec {
    margin: 26px 24px;
  }
  #make-card-sec .car-brand-flex {
    width: 100%;
  }
  #make-page-sec .col-car-brand-flex {
    flex-direction: column;
  }
  #make-page-sec .make-car-brand-img,
  #make-page-sec .make-car-overview,
  #make-page-sec .make-car-overview a {
    width: 100%;
  }
  #make-page-sec .make-car-brand-img img {
    width: 380px;
    height: 240px;
  }
}
/* make page css end */

/* extension promo footer banner start */
.ext-promo-banner {
  position: fixed;
  top: auto;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100vw;
  box-shadow: 0px 0px 1px 0px rgba(48, 49, 51, 0.05),
    0px -8px 16px 0px rgba(48, 49, 51, 0.1);
  background-color: #fff;
  z-index: 10;
  padding: 14px 24px;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  color: #4a495c;
}

.epb-close-container {
  position: absolute;
  top: 12px;
  right: 12px;
  cursor: pointer;
}

.epb-img-container {
  display: none;
}

.epb-cta-container {
  margin-top: 14px;
  display: flex;
  justify-content: space-around;
  gap: 16px;
}

.epb-cta-container a {
  flex: 1;
}

.epb-cta-container button {
  width: 100%;
  background: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  outline: inherit;
  height: 38px;
  border-radius: 16px;
  display: flex;
  padding: 0px 24px;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  white-space: nowrap;
}

.epb-cta-container a:first-child button {
  border: 1px solid #0169ff;
}

.epb-cta-container a:last-child button {
  color: #fff;
  border: 1px solid #0169ff;
  background-color: #0169ff;
}

@media (min-width: 768px) {
  .epb-inner {
    display: flex;
    align-items: center;
    justify-content: space-around;
    max-width: 1152px;
    margin: 0 auto;
  }

  .epb-content {
    position: relative;
  }

  .epb-content div:last-child {
    padding-left: 220px;
  }

  .epb-img-container {
    display: block;
    position: absolute;
    bottom: -28px;
    left: 0;
  }

  .epb-cta-container {
    margin-top: 0;
  }

  .epb-cta-container button {
    height: 48px;
  }
}

/* extension promo footer banner end */

.menu-item {
  list-style-type: none !important;
}

.menu-item.first-level {
  position: relative;
}

.menu-item.second-level {
  margin: 0;
  padding-top: 16px;
}

.first-level.menu-item-has-children .sub-menu,
.first-level.menu-item-has-children:hover .sub-menu {
  position: absolute;
  background: #fff;
  width: max-content;
  top: 24px;
  left: 0;
  max-height: fit-content;
  box-shadow: 0px 0px 1px 0px rgba(48, 49, 51, 0.05),
    0px 24px 16px 0px rgba(48, 49, 51, 0.1);
}

.first-level.menu-item-has-children .sub-menu {
  padding: 0;
  max-height: 0;
  width: 0;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s ease;
}

.first-level.menu-item-has-children:hover .sub-menu {
  padding: 16px 24px;
  max-height: none;
  width: auto;
  visibility: visible;
  opacity: 1;
  transition: all 0.2s ease;
}

ul.sub-menu {
  padding-top: 10px;
  padding-left: 46px;
}

.second-level a:hover {
  color: #0169ff !important;
}

.mobile-nav .sub-menu li {
  padding: 8px 0;
}

/* make/model/lease-deals credit score dropdown */

.credit-score-dropdwon-container {
  display: flex;
  align-items: center;
  gap: 10px;
  align-self: stretch;
}

.credit-score-dropdwon-container p {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 0;
}

.credit-score-dropdown-section {
  display: flex;
  height: 48px;
  padding: 8px 24px;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  border: 1px solid #c9c9cc;
  background: #fff;
  position: relative;
  cursor: pointer;
}

.credit-score-dropdown-section label {
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  margin-bottom: 0;
}

.credit-score-dropdown-section select {
  appearance: none;
  outline: none;
  color: #4a495c;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  border: none;
  position: absolute;
  opacity: 0;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  text-align: center;
  cursor: pointer;
}

.credit-score-dropdown-section svg {
  color: #4a495c;
  font-size: 20px;
}

@media (max-width: 700px) {
  .credit-score-dropdwon-container {
    align-items: flex-start;
    flex-direction: column-reverse;
  }
  .credit-score-dropdown-section {
    justify-content: space-between;
    width: 100%;
  }
}
/* Promo Row Start */

.promo-row {
  width: 100%;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  margin-top: 10px !important;
  margin-bottom: 0px !important;
  background: radial-gradient(
    circle,
    rgba(230, 145, 16, 0.2),
    rgba(230, 145, 16, 0.3),
    rgba(230, 145, 16, 0.4)
  );
}

#seeDeals p {
  margin: 0;
}

/* .promo-for-warranty {
  position: relative;
}

.promo-for-warranty::after {
  position: absolute;
  top: -16px;
  right: -16px;
  display: flex;
  padding: 4px;
  justify-content: center;
  align-items: center;
  border-radius: 100px;
  background: #49b400;
  content: "SALE";
  color: #FFF;
  font-family: Inter;
  font-size: 8px;
  font-style: normal;
  font-weight: 800;
  line-height: 100%;
} */

.topBanner {
  display: block !important;
  text-align: center;
  padding: 0px 16px 0px 16px;
}

.top-banner-container {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  margin-top: 10px !important;
  background: radial-gradient(circle, rgba(230, 145, 16, 0.2), rgba(230, 145, 16, 0.3), rgba(230, 145, 16, 0.4));
  align-items: center;
  height: 55.8px;
}

/* Depreciation info modal css start */

.help-me-text-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
}

.help-me-text-wrapper svg {
  color: #0169FF;
  text-align: right;
  font-family: "Font Awesome 6 Pro";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.help-me-understand-text {
  color: #0169FF;
  text-align: right;
  font-family: Inter;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
  cursor: pointer;
}

.depreciation-info-modal {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  width: 672px;
  padding: 24px;
  border-radius: 8px;
  background: #FFF;
  box-shadow: 0px 20px 25px -5px rgba(0, 0, 0, 0.10), 0px 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.depreciation-info-modal.show {
	display: flex;
}

.info-modal-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  gap: 24px;
}

.info-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}

.info-modal-header svg { 
  color: #AFAFB4;
  font-family: "Font Awesome 6 Pro";
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
  cursor: pointer; 
}

.info-modal-header h3 {
  color: #4A495C;
  font-family: Inter;
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: 40px;
  margin: 0;
}

.info-modal-description {
  color: #4A495C;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 28px;
  margin: 0;
}

.info-modal-description ul {
  margin: 0;
}

.depreciation-info-modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 998;
}

.depreciation-info-modal-overlay.show {
  display: block;
}

@media (max-width: 700px) {
  .depreciation-info-modal {
    width: 90%;
  }
}

/* Depreciation info modal css end */

/* Car lease calculator interlinking css start */
.clc-container {
  display: flex;
  align-items: center;
  gap: 40px;
  align-self: stretch;
  margin-bottom: 40px;
}

.clc-img-wrapper img {
  width: 100%;
  height: auto;
  max-width: 568px;
  display: block;
}

.clc-info-cta-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  flex: 1 0 0;
}

.clc-info-cta-content h3 {
  color: #4A495C;
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin: 0px;
}

.clc-info-cta-content p {
  color: #4A495C;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 30px;
  margin: 0px;
}

.try-lease-calc-btn {
  display: flex;
  height: 48px;
  padding: 0px 36px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  border-radius: 8px;
  background: #0169FF;
  color: #FFF;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  cursor: pointer;
  border: none;
}

@media (max-width: 991px) {
  .clc-container {
    flex-direction: column;
    padding: 0px 15px;
  }

  .clc-img-wrapper img {
    max-width: 100%;
  }
}
/* Car lease calculator interlinking css end */

/* Try Free Lease Calculator Card css start */

.try-lease-calculator-free-mobile-card-wrapper{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 60px;
}

.try-lease-calculator-free-card, .try-lease-calculator-free-mobile-card{
  display: flex;
  height: 462px;
  padding: 24px 32px;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  background: linear-gradient(90deg, #6270B9 2.5%, #5BA3D0 100%);
  overflow: hidden;
}

.try-lease-calculator-free-mobile-card{
   max-width: 352px;
   width: 100%;
}

.lease-calculator-card-title-section{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}
.lease-calculator-card-title-section h1{
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.6px;
  background: linear-gradient(100deg, #FFF 8.14%, #E3E0E0 85.74%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin: 0;
}

.lease-calculator-card-title-section h1 span{
  font-weight: 800;
}

.lease-calculator-card-title-section p{
  color:   #FFF;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 0;
}

.try-free-lease-calculator-btn{
  display: flex;
  height: 40px;
  padding: 12px 16px;
  justify-content: center;
  align-items: flex-start;
  gap: 10px;
  align-self: stretch;
  border-radius: 24px;
  background:  #FFF;
  color:   #000;
  font-family: Inter;
  font-size: 15.23px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-decoration: none !important;
}

.try-free-lease-calculator-btn:hover{
  color:   #000 !important;
}

.lease-calculator-result-view-img-wrapper {
    display: flex;
    padding: 19px 8.201px 0px 0px;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    width: 100%;
}

.try-free-lease-right-side{
  top: 100px;
}

.lease-deals-all-list-img{
  max-width: 200px; 
  width: 100%
}
/* Try Free Lease Calculator Card css end */