/*
Description:  Template zur Darstellung der Fahrzeugdetailansicht auf der Ausgabeseite
Version:      1.2
Author:       Elmar Elberskirch
Author URI:   https://www.wbmc.de
*/

/******************************

Detailansicht für einzelnes Fahrzeug-Objekt

*******************************/ 
p, td {
   font-weight: 400;
   font-size: 16px;
}
.detail-text{font-weight:600;}
.fzg-data td{width:50%;}
.blogbutton-small {border: 2px solid var(--dealer-color)!important; background-color: var(--dealer-color)!important; color: #0c0c0c !important;width: 98%;padding:8px;border-radius:4px;}
.blogbutton-small-btn {background: transparent!important; background-color: var(--dealer-color)!important; border: 2px solid var(--dealer-color) !important; color: #fff !important;width: 98%;padding:8px;border-radius:4px;border-radius:4px!important; width:100%;}
/* Sweep To Right */
.hvr-sweep-to-right { color:#0c0c0c; background-color: var(--dealer-color)!important; display: inline-block;  vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden;  -moz-osx-font-smoothing: grayscale;  position: relative; -webkit-transition-property: color;  transition-property: color;  -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.hvr-sweep-to-right:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: var(--dealer-color); -webkit-transform: scaleX(0);  transform: scaleX(0); -webkit-transform-origin: 0 50%;  transform-origin: 0 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.hvr-sweep-to-right:hover, .hvr-sweep-to-right:focus, .hvr-sweep-to-right:active { color: #0c0c0c !important; background-color: var(--dealer-color)!important;}
.hvr-sweep-to-right:hover:before,.hvr-sweep-to-right:focus:before, .hvr-sweep-to-right:active:before {  -webkit-transform: scaleX(1);  transform: scaleX(1);}

.hvr-sweep-to-mid { color:#0c0c0c;display: inline-block;  vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden;  -moz-osx-font-smoothing: grayscale;  position: relative; -webkit-transition-property: color;  transition-property: color;  -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.hvr-sweep-to-mid:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: var(--dealer-color); -webkit-transform: scaleX(0);  transform: scaleX(0); -webkit-transform-origin: 50% 0;  transform-origin: 50% 0; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.hvr-sweep-to-mid:hover, .hvr-sweep-to-mid:focus, .hvr-sweep-to-mid:active { color: #0c0c0c !important; background-color: var(--dealer-color)!important;}.hvr-sweep-to-mid:hover:before,.hvr-sweep-to-mid:focus:before, .hvr-sweep-to-mid:active:before {  -webkit-transform: scaleX(1);  transform: scaleX(1);}

.hvr-sweep-to-left { color:#0c0c0c; background-color: var(--dealer-color)!important; display: inline-block;  vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden;  -moz-osx-font-smoothing: grayscale;  position: relative; -webkit-transition-property: color;  transition-property: color;  -webkit-transition-duration: 0.3s; transition-duration: 0.3s;}
.hvr-sweep-to-left:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: var(--dealer-color); -webkit-transform: scaleX(0);  transform: scaleX(0); -webkit-transform-origin: 100% 50%;  transform-origin: 100% 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
.hvr-sweep-to-left:hover, .hvr-sweep-to-left:focus, .hvr-sweep-to-left:active { color: #0c0c0c !important; background-color: var(--dealer-color)!important;}.hvr-sweep-to-left:hover:before,.hvr-sweep-to-left:focus:before, .hvr-sweep-to-left:active:before {  -webkit-transform: scaleX(1);  transform: scaleX(1);}
/****Content****/
/****Content****/
#fzg-detail-wrapper h2 {font-weight: 600;}
.top20 {margin-top: 20px;}
table.fzg-data {width: 100%;}
table.fzg-data tr:nth-child(even) {background-color: transparent;}
table.fzg-data tr td {padding: 6px 12px;}
.fzg-detail-main-left {width:49.99%;float:left;}
.fzg-detail-main-left, .fzg-detail-main-right, .fzg-detail-enwi, .fzg-detail-main-center {font-size:1.2rem;}
.fzg-detail-main-right {width:49.99%;float:right;}
.fzg-detail-price {font-weight: 600;float:right;}
.flex-ul-items { display: flex; flex-direction: row; justify-content:space-between; flex-wrap: wrap; padding-left: 0px!important;overflow-x: auto; overflow-y:hidden ; }
.extra-item {display: block;padding: 8px 12px;}
.extra-item::before {content: "\2713 ";}
.social-links a {display: inline-block; margin: 4px;}
.social-links { display: flex; justify-content: flex-end;}

.social-icon{background-color:transparent;color:var(--dealer-color);border-radius:4px;}
.social-icon:hover{background-color:var(--dealer-color);color:#fff;}

.co2-label img {margin-bottom: 0;}


.umweltdaten {padding:0px;}
.wrbr-tab {margin-bottom:30px;}
.wrbr-tab h5{margin-bottom:3px; padding-bottom:3px;}
.vrbr-tab-left  {border-bottom:1px solid #5c5c5c; background: #f7f7f7; padding:5px; display:inline-block; width:55%;}
.vrbr-tab-right {border-bottom:1px solid #5c5c5c; background: #f7f7f7; padding:5px; display:inline-block; width:35%;}

.detail-top-row {
   display:flex;
   align-items: center; 
}

.swiper-button-next, .swiper-button-prev {color: var(--dealer-color,var(--dealer-color));}

@media screen and (max-width: 792){
   .flex-ul-items {max-height: 480px;}
}

@media screen and (max-width: 558px){
   .flex-ul-items {max-height: none;}
}