@import url('../css/form.css');
#vdp {/*background-color: #E5E5E5;*/font-size:14px;line-height:27px; padding-top: 0;}
#vdp #vdp-stats {margin: 20px 0; background-color: #fff;}
#vdp .section-title {font-size: 18px; line-height: 21px; text-transform: uppercase; font-weight: bold;}
/* breadcrumbs */
#vdp #vdp-breadcrumbs {padding-bottom: 0;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget {text-align: left;text-transform: uppercase;font-weight: 700;font-size: 12px;line-height: 14px;font-family: "vw-text-regular",verdana,sans-serif;display: block;float: left;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget a {color: #000;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget a:hover {text-decoration: none;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget a:first-child {margin-left: 0;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget a:after {content: '\f054'; font-family: "FontAwesome"; font-size: 10px; font-weight: normal; position: relative; left: 10px;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget a:last-child:after {display: none;}
#vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget span {display: none; color: #000;}
/* share icons */
#vdp #vdp-breadcrumbs #vdp-share {display: flex;justify-content: space-evenly;align-items: flex-end;width: 250px; float: left;}
#vdp #vdp-breadcrumbs #vdp-share span[class*="vdp-"] {display: block;text-transform: uppercase;font-size: 12px;font-weight: bold; width: 40px; cursor: pointer; text-align: center;}
#vdp #vdp-breadcrumbs #vdp-share span[class*="vdp-"] i {font-size: 36px;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at4-visually-hidden {color: #000;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-svc-facebook .at4-visually-hidden {color: #fff;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-share-tbx-element .at-share-btn:not(.at-svc-compact) {display: none;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-share-tbx-element .at-share-btn.at-svc-compact {background-color: transparent !important;margin: 0 !important;display: block !important;overflow: visible;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-share-tbx-element .at-share-btn.at-svc-compact:before {content: 'present_to_all';font-family: 'Material Icons';font-size: 24px;font-weight: normal;color: #000;padding-bottom: 10px;position: relative;bottom: 10px;}
#vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-share-tbx-element .at-share-btn.at-svc-compact span {display: none;height: 0 !important;width: 0 !important;line-height: 0 !important;}
/* price block */
#vdp #price-block {background-color: #000; color: #fff;}
#vdp #price-block .fee-widget .fee-row {padding: 0;}
#vdp #price-block .fee-widget .fee-row .fee-value {font-weight: bold;}
#vdp #price-block .fee-widget .fee-row.discount .fee-value {color: #fff;}
#vdp #price-block .fee-widget .fee-row.dealerPrice {padding: 60px 0;margin-top: 0;float: none;margin-bottom: 0;font-size: 18px;line-height: 21px;text-transform: uppercase;background-color: transparent;}
#vdp #price-block .fee-widget.normal-price {padding: 0; margin-top: 0; float: none; margin-bottom: 0; font-size: 18px; line-height: 21px; text-transform: uppercase; background-color: transparent;}
#vdp #price-block .fee-widget .fee-row ~ .fee-row.dealerPrice:before {display: none;}
#vdp #price-block .fee-widget .fee-row.dealerPrice .fee-value, 
#vdp #price-block .fee-widget .fee-row.dealerPrice .fee-label {background-color: transparent;padding: 0;font-size: 18px;line-height: 21px;}
#vdp #price-block .fee-widget .fee-row.priceTaxDisclosure {background-color: transparent; display: none;}
#vdp #price-block .fee-widget.call-for-price, 
#vdp #price-block .fee-widget.normal-price {font-size: 18px;line-height: 21px;padding: 20px 0 40px 0; background-color: transparent;}
#vdp #price-block .fee-widget.normal-price::before {content: "YOU PAY"; font-weight: normal; float: left;}
#vdp #price-block .btn.btn-primary {width: 100%; text-transform: uppercase; margin-top: 5px;}
/* vdp modules */
.modal .modal-dialog .modal-content .modal-header {border-bottom: none;}
.modal .modal-dialog .modal-content .close {font-size:0;opacity: 1;text-shadow: none;filter: alpha(opacity=100); position: relative; right: 5px;}
.modal .modal-dialog .modal-content .close::before {content:'\e681'; font-family: 'Pe-icon-7-stroke'; font-size: 30px !important;}
.modal .modal-dialog .modal-content .modal-header .modal-title {display: none;}
/* highlights */
#vdp #vdp-highlights .module-vehicleBulletsWidget {display: inline-block; width: 100%; list-style-type: none; color: #707070;}
#vdp #vdp-highlights .module-vehicleBulletsWidget > span {display: block;color: #000; font-weight: bold;}
/* summary */
#vdp #vdp-summary .dealer-comments {color: #000;}
/* specs */
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-content div[id^=vehicle_options_widget_].tab-pane {height: 310px;overflow-y: scroll;overflow-x: clip;scrollbar-width: thin;scrollbar-color: #707070 #FFFFFF;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-content div[id^=vehicle_options_widget_].tab-pane > div {width: 100%;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-content div[id^=vehicle_options_widget_].tab-pane::-webkit-scrollbar{width:5px;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-content div[id^=vehicle_options_widget_].tab-pane::-webkit-scrollbar-thumb {background: #707070;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-content div[id^=vehicle_options_widget_].tab-pane::-webkit-scrollbar-track {background:#FFFFFF; -webkit-box-shadow:inset 0 0 1px #000;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-pane ul {column-count: 1;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-pane ul > li {page-break-inside: avoid; break-inside: avoid; float: none; width: auto;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs {width: 100%; text-align: left;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs li {text-align: left;display: inline-block;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs li > a {padding: 20px; background-color: #E7E7E7; border: none; color: #000; font-weight: bold; text-transform: uppercase; font-size: 12px; line-height: 14px;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs li > a:after {content: '\f078'; font-family: "FontAwesome"; float: right; padding-left: 20px;}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs li.active a {background-color: var(--clr1); color: var(--clr2);}
#vdp #vdp-detailspecs .module-vehicleOptionsWidget .nav-tabs li.solo-spec > a:after {content: '';}
/* dealer info & map */
#vdp #vdp-mapform #casl div {line-height: 21px;}
#vdp #vdp-mapform #form-block {padding: 40px;}
#vdp #vdp-mapform #form-block h4.h4 {font-size: 20px; line-height: 24px;}
/*#vdp #vdp-dealerinfo span {display: block;}*/
#vdp #vdp-dealerinfo a:not(.btn.btn-primary) {text-align: right;float: right;}
#vdp #vdp-dealerinfo .gray {color: #707070;}
#vdp #vdp-dealerinfo a[href*='tel'] {font-weight: bold;}
#vdp #vdp-dealerinfo a[href*='map'] {font-weight: bold;}
#vdp #vdp-dealerinfo .btn.btn-primary {text-transform: uppercase;margin-top: 20px;}
/* similar vehicles */
#vdp .similar-vehicles .vehicle {font-family: "vw-text-regular",verdana,sans-serif; border: none;}
#vdp .similar-vehicles .vehicle .padding {padding: 0;}
#vdp .similar-vehicles .vehicle .vehicle-padding {padding: 30px;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-title {font-size: 24px; line-height: 28px; font-weight: bold; text-transform: uppercase;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vtitle-trim {font-size: 12px; line-height: 14px; text-transform: uppercase;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices {padding: 20px 0;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsWasPriceWrapper {display: block;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsWasPrice {color: #000; font-weight: bold; font-size: 24px; line-height: 28px;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsSelectedPrice,
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsSelectedPrice a.dealer-price {cursor: initial; color: #000; font-weight: bold; font-size: 24px; line-height: 28px;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsSelectedPrice a.dealer-price:after {display: none;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsSelectedPrice .popover.fade.top.in {display: none !important;}
#vdp .similar-vehicles .vehicle .vehicle-padding .vehicle-prices .vehicleResultsCallForPrice {color: #000; font-weight: bold; font-size: 24px; line-height: 28px;}
#vdp .similar-vehicles .vehicle .price-header .priceLabel {display: none;}
#vdp .similar-vehicles .vehicle .tax-disclosure {display: none;}
#vdp .similar-vehicles .vehicle .vehicle-padding ul[itemprop="description"] {font-size: 14px; line-height: 27px;}
#vdp .similar-vehicles .vehicle .button.quick-view {background: transparent; text-transform: uppercase; font-size: 12px; line-height: 14px; font-style: normal; padding: 15px 30px;}
#vdp .carousel-wrap .carousel{margin: 0 -10px;width: calc(100% + 20px);}
#vdp .carousel-wrap .carousel .carousel-indicators{display:none;}
#vdp .carousel-wrap .carousel .carousel-indicators li{pointer-events: none;}
#vdp .carousel-wrap .carousel .carousel-inner{display: block;overflow:hidden;margin:0;white-space:nowrap;}
#vdp .carousel-wrap .carousel .carousel-inner .item{width:calc(100% - 20px);opacity:1;display: inline-block;margin: 0 10px;}
#vdp .carousel-wrap .carousel a.carousel-control{display:none;pointer-events:none;}

#vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir]{display:block;width:84px;height:44px;background-color:#191919;position:absolute;left:-10px;bottom:0;text-align:left;cursor:pointer;}
#vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir=right]{left:auto;right:-10px;text-align:right;}
#vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir]:before{content:'\f053';font-family:"FontAwesome";color:#fff;font-style: normal;line-height:44px;margin-left:50px;}
#vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir=right]:before{content:'\f054';margin-right:50px;margin-left: 0;}
#vdp .carousel .carousel-inner[data-count="1"] ~ [data-dir]{opacity:0;}

#vdp-similars .similar-vehicles .wrap > .col .vehicle .vehicle-image-wrap:before {content:"";display:block;width:100%;height:0;padding-top: 75%;margin-right: -100%;float: left;pointer-events:none;}
#vdp-similars .similar-vehicles .wrap > .col .vehicle .vehicle-image-wrap:after{content:"";clear:left;width:100%;display:table;}
#dealerMap{min-height:480px;}
#vdp-dealerinfo .salesHours .hours-list tr td{font-weight:bold;text-transform:capitalize;padding:3px 20px 3px 10px;text-align: right;}
#vdp-dealerinfo .salesHours .hours-list tr td:first-child {text-align: left;padding-left: 20px;}
#vdp-dealerinfo .salesHours .hours-list tr:nth-last-of-type(odd){background-color:#e5e5e5;}
#vdp-detailspecs .module-vehicleOptionsWidget .tab-content .tab-pane ul li{padding-right:24px}
#vdp-dealerinfo #wrapper{padding-top:40px;}
#vdp-dealerinfo #wrapper, #mapwrapper{padding-top:40px;}
#vdp-dealerinfo #wrapper .hours-list {width: 100%;}
@media(min-width: 768px) {
  #vdp #vdp-breadcrumbs .vehicleBreadcrumbWidget {display: inline-block; width: 50%;}
  #vdp #vdp-breadcrumbs #vdp-share {float: right; align-items: flext-end;}
  #vdp #vdp-breadcrumbs #vdp-share span[class*="vdp-"]:before {font-size: 36px;}
  #vdp #vdp-breadcrumbs #vdp-share .vdp-share .at-share-tbx-element .at-share-btn.at-svc-compact:before {font-size: 36px;}
  #vdp .carousel-wrap .carousel .carousel-inner .item{width:calc((100% - 40px)/2);}
  #vdp .carousel-wrap .carousel .carousel-inner[data-count="1"] .item{margin-left:calc(25% + 10px) !important;}
  #vdp-dealerinfo #wrapper{padding-top:0px}
  #vdp .carousel .carousel-inner[data-count="2"] ~ [data-dir]{opacity:0;}
  #vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-pane ul {column-count: 2;}
}
@media(min-width: 992px) {
  #vdp .carousel-wrap .carousel .carousel-inner .item{width:calc((100% - 60px)/3);}
  #vdp .carousel-wrap .carousel .carousel-inner[data-count="2"] .item:nth-child(1){margin-left:calc((100% - 40px)/6) !important;}
  #vdp .carousel-wrap .carousel .carousel-inner[data-count="1"] .item{margin-left:calc((100% - 60px)/3) !important;}
  #vdp-dealerinfo #wrapper{padding-top:40px;padding-bottom: 40px;}
  #vdp #vdp-highlights .module-vehicleBulletsWidget {width: 50%; padding-bottom: 20px;}
  #vdp .carousel .carousel-inner[data-count="3"] ~ [data-dir]{opacity:0;}
  #vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-pane ul {column-count: 3;}
  .modal .modal-dialog {width: 60% !important;}
  #form-block {margin-right: 0;}
  #form-block form .form-group {margin-right: 0;}
  #form-block form textarea.form-control {height: 90px;}
  #form-block form .form-group.comments-box, #form-block form .form-field-name.comments-box {padding-left: 0;}
}
@media(min-width: 1200px) {
  #vdp #vdp-stats >*{width:calc(100% - 390px)}
  #price-block{width:390px;position:absolute;right:-390px}
  #vdp #vdp-stats[data-scrolled="true"] #price-block{position:fixed;top:20px;right:20px;}
  #vdp #vdp-detailspecs .module-vehicleOptionsWidget .tab-pane ul {column-count: 2;}
  #mapwrapper{padding-top:0px;}
}
@media (min-width: 1440px) {
  #vdp #vdp-stats {margin: 40px 0;}
  #price-block{right:-390px}
  #vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir]{left:-30px;}
  #vdp .carousel-wrap .carousel.module-vehicleImageCarouselWidget i[data-dir=right]{left:auto;right:-30px;text-align:right;}
  #vdp #vdp-highlights .module-vehicleBulletsWidget {width: 33.33%;}
  .modal .modal-dialog {width: 50% !important;}
}