@font-face {
  font-family: 'cg_regular';
  src:  url('/fonts/centurygothicregular.woff2') format('woff2'),
        url('/fonts/centurygothicregular.woff') format('woff');
}

body{
    background-color: #282828;
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-family: "cg_regular", Segoe UI, Calibri, Verdana, Arial;
    scroll-behavior: smooth;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
    transition: all 0.5s;
}

.wrapper{
    max-width: 1850px;
    width: 100%;
    margin: auto;
    transition: all 0.5s;
}

.wrapper2{
    max-width: 1450px;
    width: calc(100% - 40px);
    margin: auto;
}

#top{
    background-color: #282828;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    transition: all 0.5s;
    z-index: 4500;
}

#top_container{
    text-align: center;
    margin: 20px 0;
    position: relative;
    transition: all 0.5s;
}

#nav{
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 100px;
    font-size: 105%;
    transition: all 0.5s;
}

#nav li{
    display: inline-block;
}

#nav>li:first-child{ width: calc(50% - 195px); }
#nav>li:last-child{ width: calc(50% - 195px); }

#nav li .navgroup{
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

#nav li #nav_left{
    justify-content: flex-end;
    gap: 80px;
}

#nav li #nav_center{
    justify-content: space-between;
    gap: 40px;
}

#nav li #nav_right{
    justify-content: flex-start;
    gap: 80px;
}

#nav li .navgroup li{
    width: auto;
    display: inline-block;
}

#nav li #nav_left li:first-child{
    display: none;
}

#nav li #nav_right li:nth-last-child(2){
    display: none;
}

#nav li #nav_right li:nth-last-child(3){
    display: none;
}

#nav li .navgroup li a{
    text-decoration: none;
    color: #dcdcdc;
    white-space: nowrap; 
    transition: all 0.5s;
}

#nav li .navgroup li a[href]:link, #nav li .navgroup li a[href]:visited, #nav li .navgroup li a[href]:active, #nav li .navgroup li a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    white-space: nowrap; 
    transition: all 0.5s;
}

#nav li .navgroup li a[href]:hover, #nav li .navgroup li a[href].active{
    color: #fff;    
    transition: all 0.5s;
}

#logo_alfa{
    height: 45px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#logo_alfa:hover, #logo_alfa.active{
    fill: #fff !important;
}

#logo_weitmann{
    height: 60px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#logo_weitmann:hover, #logo_weitmann.active{
    fill: #fff !important;
}

#logo_jeep{
    height: 27px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#logo_jeep:hover, #logo_jeep.active{
    fill: #fff !important;
}

#mobilelogos{
    padding: 0;
    margin: 0;
    display: none;
    align-items: center;    
    justify-content: center;
    gap: 20px;
}

#mobilelogos li{
    display: inline-block; 
    justify-content: center;
}

#mobilelogos li #mobilelogo_alfa{
    height: 45px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#mobilelogos li #mobilelogo_alfa:hover, #mobilelogos li #mobilelogo_alfa.active{
    fill: #fff !important;
    transition: all 0.5s;
}

#mobilelogos li #mobilelogo_weitmann{
    height: 60px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#mobilelogos li #mobilelogo_weitmann:hover, #mobilelogos li #mobilelogo_weitmann.active{
    fill: #fff !important;
    transition: all 0.5s;
}

#mobilelogos li #mobilelogo_jeep{
    height: 27px;
    width: auto;
    transition: all 0.5s;
    fill: #dcdcdc;
}

#mobilelogos li #mobilelogo_jeep:hover, #mobilelogos li #mobilelogo_jeep.active{
    fill: #fff !important;
    transition: all 0.5s;
}

#mobilenav{
    color: #dcdcdc;
    font-size: 200%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    display: none;
    cursor: pointer;
}

#main{
    margin: 105px auto 0 auto;
    transition: all 0.5s;
    background-color: #fdfcfa;
}

#filter{
    background-color: #484848;
    padding: 20px;
    transition: all 0.5s;
}

#filtercontainer{    
    display: flex;
    flex-shrink: 0;
    flex-wrap: wrap;
    padding: 0;
    margin: 0;
    gap: 10px;
    align-content: self-start;
    transition: all 0.5s;
    justify-content: center;
    align-items: center;
}

.filtergroup{
    width: calc(16.66666% - 8.33333px);     
    flex-shrink: 0;
    margin: 0;
    vertical-align: middle;
    transition: all 0.5s
}

.filtergrouphalf{
    width: calc(50% - 2.5px);
    display: inline-block;
    vertical-align: middle;
}

.filtergrouphalf:first-child{
    margin-right: 5px;
}

.filtergroup label{
    display: block;
    background-color: #282828;
    color: #dcdcdc;
    font-size: 60%;
    padding: 2px 4px;
    white-space: nowrap;
    overflow: hidden;
}

.filtergroup select{
    display: block;
    width: 100%;
    user-select: none;
    outline: none;
    -webkit-border-radius: 0px;
    border: 0px solid #dcdcdc;
    font-size: 90%;
    color: #282828;
    background-color: #dcdcdc;
    padding: 11px;
}

.filtergroup select:focus{
    outline: none;
}

.filtergroup select option{
    display: block;
    user-select: none;
    padding: 30px;
}

.filtergroup input[type=text]{
    display: block;
    width: calc(100% - 16px);
    user-select: none;
    outline: none;
    -webkit-border-radius: 0px;
    border: 2px solid #dcdcdc;
    appearance: textfield;
    background-color: #dcdcdc;
    padding: 4px 6px 4px 6px;
    font-size: 95%;
    color: #282828;
}

.filtergroup button{
    display: block;
    width: 100%;
    user-select: none;
    outline: none;
    -webkit-border-radius: 0px;
    background-color: #282828;
    color: #dcdcdc;
    border: 0px solid #282828;
    user-select: none;
    outline: none;
    -webkit-border-radius: 0px;
    padding: 17px 10px 17px 10px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
}

.filtergroup button:hover{
    color: #fff;
}

#filter_hersteller{
    order: 1;
}

#filter_modell{
    order: 2;
}

#filter_kraftstoff{
    order: 3;
}

#filter_getriebe{
    order: 4;
}

#filter_antrieb{
    order: 5;
}

#filter_bauart{
    order: 7;
}

#filter_km{
    order: 8;
}

#filter_leistung{
    order: 9;
}

#filter_preis{
    order: 10;
}

#filter_kategorie{
    order: 11;
}

#filter_kfznummer{
    order: 6;
}

#filter_filterreset{
    order: 12;
}

.boxen{
    display: flex;
    align-items: center;
    justify-content: left;
    flex-wrap: wrap;
    margin: 0 auto;
    padding: 20px;
    gap: 20px;
    max-width: 1450px;
    transition: all 0.5s;
}

.boxen li{
    display: inline-block;
    width: calc(50% - 10px);
    aspect-ratio: 4/3;
    text-align: center;
    align-self: flex-start;
    position: relative;    
    overflow: hidden;
    background-color: #e8e8e7;
    transition: all 0.5s;
}

.boxen li .bimg{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    top: 0;
    bottom: 20%;
    left: 0;
    right: 0;
    text-decoration: none;
    transition: all 0.5s;
}

.boxen li .bimg .offer{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    background-color: #ba1a2b;
    padding: 5px;
    transform: rotate(320deg);
    position: absolute;
    width: 100%;
    font-size: 100%;
    top: 10%;
    left: -40%;
    transition: all 0.5s;
}

.boxen li .bimg .kontakticons{    
    position: absolute;    
    top: 5%;
    right: 5%;
    transition: all 0.5s;
}

.boxen li .bimg .kontakticons .icon{
    color: #dcdcdc;
    text-decoration: none;
    font-size: 400%;
    display: block;
    margin: 0 0 15px 0;
    transition: all 0.5s;
}

.boxen li .bimg .kontakticons .icon:hover{
    color: #fff;
}

.boxen li .bimg .kontakticons .icon:last-child{
    margin: 0;
}

.boxen li .btxt{
    position: absolute;
    bottom: 0;
    top: 80%;
    left: 0;
    right: 0;
    padding: 20px;
    background-color: #282828;
}

.boxen li .btxt.pointer{
    cursor: pointer;
}

.boxen li h2{
    margin: 0 auto 10px auto;
    padding: 0;
    font-size: 120%;
    white-space: nowrap;
    color: #dcdcdc;
    transition: all 0.5s;
}

.boxen li h2 a[href]:link, .boxen li h2 a[href]:visited, .boxen li h2 a[href]:active, .boxen li h2 a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    transition: all 0.5s;
}

.boxen li:hover h2 a[href]{
    color: #fff;    
}

.boxen li .subheadline{
    margin: 0 auto;
    padding: 0;
    font-weight: normal;
    font-size: 100%;
    white-space: nowrap;
    color: #dcdcdc;
    transition: all 0.5s;
}

.boxen li .subheadline:hover{
    color: #fff;    
}

.boxen li .subheadline a[href]:link, .boxen li .subheadline a[href]:visited, .boxen li .subheadline a[href]:active, .boxen li .subheadline a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    transition: all 0.5s;
}

.boxen li:hover .subheadline a[href]{
    color: #fff;    
    transition: all 0.5s;
}

.headerimage{
    aspect-ratio: 5/3;
    max-height: 450px;
    width: 100%;
    margin: auto;
    max-width: 2500px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #e8e8e7;
    transition: all 0.5s;
}

.content{
    background-color: #e8e8e7;
    color: #282828;
    font-size: 85%;
    line-height: 150%;
    display: flex;
    padding: 20px;
    margin: 20px auto 0 auto;
    position: relative;
    overflow: hidden;
    text-align: justify;
    transition: all 0.5s;
}

.content h1{
    font-family: "cg_bold", Segoe UI, Calibri, Verdana, Arial;
    font-size: 150%;
    text-align: center;
    margin: 20px auto;
    font-weight: 700;
}

.content h1:first-child{
    margin: 0 auto 20px 0;
}

.content h2{
    font-size: 125%;
    text-align: center;
    margin: 15px auto;
    font-weight: 400;
}

.content h2:first-child{
    margin: 0 auto 15px 0;
}

.content h3{
    font-size: 120%;
    font-weight: 700;
    margin: 10px auto;
}

.content hr{
    height: 0;
    border-bottom: 1px solid #282828;
    border-top: none;
    width: 30%;
    margin: 20px auto;
}

.content ul{
    padding: 0 0 0 00px;
}

.content ul li{
    margin: 0 0 0 20px;
}

.content a[href]:link, .content a[href]:visited, .content a[href]:active, .content a[href]:focus, .content a[href]:hover{
    color: #282828;
    text-decoration: none;
}

.content_container{
    display: grid;
    width: calc(100% - 470px);
    flex-shrink: 0;
    transition: all 0.5s;
}

.content_separator{
    width: 30%;
    height: 0;
    border-bottom: 1px solid #282828;
    border-top: none;
    margin: 20px auto;
}

.imagecontainer{
    display: block;
    width: auto;
    margin: 0 0 auto 20px;
    padding: 0;
    transition: all 0.5s;
}

.imagecontainer .image{
    position: relative;
    width: 100%;
    margin: 0 0 20px 0;
    display: block;
    aspect-ratio: 16/10;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: all 0.5s;
}

.imagecontainer .image:last-child{
    margin: 0;
}

.imagecontainer .image .alt{
    position: absolute;
    display: inline-block;
    right: 0px;
    bottom: 50px;
    padding: 5px;
    background-color: rgba(100,96,93,0.8);
    color: #fff;
    font-size: 80%;
}

.imagecontainer .image.video{
    aspect-ratio: 16/9 !important;
}

.content_text{
    padding: 0 20px 0 0;
}

.zoomimage{
    width: 100%;
    height: auto;
    margin: 20px 0;
    transition: all 0.5s;
}

.content_gallery{
    width: 100%;
    aspect-ratio: 16/10;
    margin: auto;
    transition: all 0.5s;
}

.content_gallery #gal_image {
    width: 100%;
    aspect-ratio: 16/10;
    position: relative;
    background-color: #818181;
    transition: all 0.5s;
    margin: 0;
}

.content_gallery #gal_image .gal_picture{
    width: 100%;
    aspect-ratio: 16/10;
    background-size: cover;
    background-position: center;
    position:absolute;
    transition: all 0.5s;
    opacity: 0;
    overflow: hidden;
}

.content_gallery #gal_image .gal_picture .gal_link{
    position: absolute;
    right: 0;
    top: 0;
    z-index: 4000;
    font-size: 200%;
    padding: 20px;
    color: rgba(220,220,220,0.5);
}

.content_gallery #gal_image .gal_picture .gal_link:hover{
    color: rgba(255,255,255,0.9);
}

.content_gallery #gal_image .gal_picture.active{
    opacity: 1;
}

.content_gallery #gal_image .gal_picture .text{
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    background-color: rgba(232,232,231,0.85);
    color: #282828;
    font-size: 90%;
    padding: 10px 20px;
}

.content_gallery #gal_forward {
    position: absolute;
    top: 20px;
    bottom: 20px;
    width: calc(60% - 20px);
    right: 20px;
    font-size: 200%;
    color: rgba(220,220,220,0.5);
    cursor:pointer;
    transition: all 0.5s;
    display: flex;
    align-items: center;
    justify-content: right;
    z-index: 3500;
}

.content_gallery #gal_forward:hover{
    color: rgba(255,255,255,0.9);
}

.content_gallery #gal_back {
    position: absolute;
    top: 20px;
    bottom: 20px;
    width: calc(40% - 20px);
    left: 20px;
    font-size: 200%;
    color: rgba(220,220,220,0.5);
    cursor:pointer;
    transition: all 0.5s;
    display: flex;
    align-items: center;
    justify-content: left;
    z-index: 3500;
}

.content_gallery #gal_back:hover{
    color: rgba(255,255,255,0.9);
}

.content_gallery #gal_preview{
    width: 100%;
    aspect-ratio: 16/10;
    position: relative;
    transition: all 0.5s;
    margin: 5px 0 0 0;
    height: 80px;
    overflow: hidden;
}

.content_gallery #gal_preview #prev_list{
    position: absolute;
    left: 0;
    transition: all 0.5s;
}

.content_gallery #gal_preview #prev_list .prev_picture{
    height: 80px;
    width: 145px;
    margin-right: 5px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
    cursor: pointer;
    user-select: None;
    transition: all 0.5s;
    opacity: 0.5;
}

.content_gallery #gal_preview #prev_list .prev_picture:last-child{
    margin-right: 0px;
}
  
.content_gallery #gal_preview #prev_list .prev_picture.active{
    opacity: 1;
}

.content_gallery #gal_preview #prev_back{
    font-size: 120%;
    text-align: left;
    display: inline-block;    
    cursor: pointer;
    user-select: None; 
    position: absolute;
    left: 0px;
    width: 20px;
    top: 0px;
    bottom: 0px;
    padding-left: 5px;
    padding-top: 30px;
    z-index: 500;
    transition: all 0.5s;
    color: rgba(220,220,220,0.5);
}

.content_gallery #gal_preview #prev_back:hover{
    color: rgba(255,255,255,0.9);
}

.content_gallery #gal_preview #prev_forward{
    text-align: right;
    display: inline-block;    
    cursor: pointer;
    user-select: None; 
    position: absolute;    
    right: 0px;
    width: 20px;
    top: 0px;
    bottom: 0px;
    padding-right: 5px;
    padding-top: 30px;
    z-index: 500;
    transition: all 0.5s;
    color: rgba(220,220,220,0.5);
}

.content_gallery #gal_preview #prev_forward:hover{
    color: rgba(255,255,255,0.9);
}

.content_gallery .offer{
      color: #fff;
    text-decoration: none;
    font-weight: bold;
    background-color: #ba1a2b;
    padding: 5px;
    transform: rotate(320deg);
    position: absolute;
    width: 400px;
    text-align: center;
    font-size: 18px;
    top: 40px;
    left: -130px;
    transition: all 0.5s;
}

.accordion .panel{
    margin: -12px auto 10px auto;
    height: 0;
    overflow: hidden;
    padding: 0;
    box-sizing: border-box;
    transition: all 0.5s;
}

.accordion input:checked~.panel{
    height: auto;
    padding: 0 12px 12px 12px;
    transition: all 0.5s;
}

.accordion label{
    cursor: pointer;
    background-color: #282828;
    display: block;
    margin-bottom: 4px;
    padding: 12px;
    width: 100%;
    color: #dcdcdc;
    box-sizing: border-box;
    z-index: 100;
    font-size: 120%;
    font-weight: bold;
    text-align: left;
}

.accordion label:hover{
    color: #fff;
}

.accordion input{
    display: none;
}

.accordion input:checked+label{
    background-color: unset;
    color: #282828;
}

.accordion input:checked+label:before{
    transition: 0.5s;
}

.accordion h3{
    margin: 30px auto 10px auto;
}

.accordion h3:first-child{
    margin: 10px auto;
}

.content_fzpreis{
    text-align: center;
    font-weight: bold;
    font-size: 115%;
    margin: 0 auto 20px auto;
    transition: all 0.5s;
}

.content_fzpreis.specialoffer{
    color: #ba1a2b;
    transition: all 0.5s;
}

.content_fzdata{
    margin: 20px auto;
    transition: all 0.5s;
}

.content_fzdata h3{
    font-size: 120%;
    font-weight: bold;
    margin: 10px auto;
    text-align: left;
}

.content_fzdata #datalist{
    margin: 0 auto 0 0;
    padding: 4px 0;
    width: 100%;
    transition: all 0.5s;
}

.content_fzdata #datalist li{
    display: block;
    margin: 0 auto;
    text-align: left;
    font-weight: bold;
    transition: all 0.5s;
}

.content_fzdata #datalist li .label{
    width: 260px;
    text-align: left;
    display: inline-block;
    float: left;
    font-weight: normal;
}

.content_fzdescription{
    margin: 40px auto 0 auto;
    transition: all 0.5s;
}

.content_fzdescription h3{
    font-size: 120%;
    font-weight: bold;
    margin: 10px auto;
}

.disclaimer{
    font-size: 80%;
    line-height: 110%;
    margin: 20px auto 40px auto;
}

.content_form .formlist{
    padding: 0;
    margin: 0;
    width: 100%;
    max-width: 750px
}

.content_form .formlist li{
    list-style-type: none;
    margin: 0 auto 5px 0;
}

.content_form label{
    display: inline-block;
    width: 260px;
    margin: 2px auto auto auto;
    float: left;
}

.content_form input, .content_form textarea{
    width: calc(100% - 274px);
    border: none;
    -webkit-appearance: none; 
    -moz-appearance: none;
    appearance: none;   
    padding: 8px 6px;
    transition: all 0.5s;
    border: 1px solid #fff;
    font-family: "cg_regular", Segoe UI, Calibri, Verdana, Arial;
    font-size: 100%;
}

.content_form input[name=plz]{
    width: 60px;
}

.content_form input[name=ort]{
    width: calc(100% - 353px);
    margin: 0 0 0 5px;
}

.content_form textarea{
    font-size: 95%;
    resize: none;
    height: 140px;
    font-size: 100%;
    font-family: "cg_regular", Segoe UI, Calibri, Verdana, Arial;
    transition: all 0.5s;
    margin: 0;
}

.content_form .selectBox-dropdown{
    width: calc(100% - 262px) !important;
    max-width: unset !important;
    min-width: unset !important;
    border: 1px solid #fff;
    background: #fff;
}

.content_form .selectBox-dropdown .selectBox-label{
    background: #fff;
    font-size: 100%;
}

.content_form input:focus, .content_form textarea:focus{
    outline: none;
}

.content_form input[type=checkbox]{
    width: 36px;
    height: 36px;
    border: 1px solid #fff;
    display: inline-block;
    background-color: #fff;
    transition: all 0.5s;
    margin: 0;
}

.content_form input[type=checkbox]:checked{
    background-color: #282828;
}

.content_form .info{
    display: inline-block;
    vertical-align: top;
    margin: 8px auto auto 8px;
}

.content_form #captchacontainer{
    width: calc(100% - 262px);
    display: inline-block;
}

.content_form #captchacontainer #simplecaptcha{
    display: block;
    height: 35px;
    width: 100%;
    margin: 5px auto;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
}

.content_form #captchacontainer #captcha{
    width: calc(100% - 12px);
}

.content_form button, .content_form input[type=submit]{
    max-width: 220px;
    background-color: #282828;
    display: block;
    border: none;
    -webkit-appearance: none; 
    -moz-appearance: none;
    appearance: none;   
    color: #dcdcdc;
    cursor: pointer;
    width: auto;
    padding: 5px 20px;
    font-size: 100%;
    transition: all 0.5s;
    margin: 0 auto 0 260px;
}

.content_form button:hover, .content_form input[type=submit]:hover{
    color: #fff;
}

.content_form .errormessage{
    color: #ba1a2b;
    padding: 0;
    margin: 20px auto 20px 260px;
}

.content_form .rating {
    width: auto;
    display: inline-block;
    color: #484848;
    transition: all 0.5s;
}

.content_form .rating * {
    float: right;
    margin: 0 6px 5px 0;
}

.content_form .rating input {
    display: none;
}

.content_form .rating label {
    font-size: 30px;
    cursor: pointer;
    width: auto;
    transition: all 0.5s;
}

.content_form .rating input:checked ~ label {
    color: rgb(50,47,44);
}

.content_form .rating #r1:checked ~ label {
    color: #ef2d1a;
}

.content_form .rating #r2:checked ~ label {
    color: #f4730e;
}

.content_form .rating #r3:checked ~ label {
    color: #fbc801;
}

.content_form .rating #r4:checked ~ label {
    color: #74c928;
}

.content_form .rating #r5:checked ~ label {
    color: #058b49;
}

.content_form .rating #r1:hover,
.content_form .rating #r1:hover ~ label {
    color: #ef2d1a;
}

.content_form .rating input:checked ~ .content_form .rating #r1:hover,
.content_form .rating input:checked ~ .content_form .rating #r1:hover ~ label {
    color: #ef2d1a !important;
}

.content_form .rating #r2:hover,
.content_form .rating #r2:hover ~ label {
    color: #f4730e;
}

.content_form .rating input:checked ~ .content_form .rating #r2:hover,
.content_form .rating input:checked ~ .content_form .rating #r2:hover ~ label {
    color: #f4730e !important;
}

.content_form .rating #r3:hover,
.content_form .rating #r3:hover ~ label {
    color: #fbc801;
}

.content_form .rating input:checked ~ .content_form .rating #r3:hover,
.content_form .rating input:checked ~ .content_form .rating #r3:hover ~ label {
    color: #fbc801 !important;
}

.content_form .rating #r4:hover,
.content_form .rating #r4:hover ~ label {
    color: #74c928;
}

.content_form .rating input:checked ~ .content_form .rating #r4:hover,
.content_form .rating input:checked ~ .content_form .rating #r4:hover ~ label {
    color: #74c928 !important;
}

.content_form .rating #r5:hover,
.content_form .rating #r5:hover ~ label {
    color: #058b49;
}

.content_form .rating input:checked ~ .content_form .rating #r5:hover,
.content_form .rating input:checked ~ .content_form .rating #r5:hover ~ label {
    color: #058b49 !important;
}

#appdata_onlineterminanfrage{
    min-height: 900px;
    transition: all 0.5s;
}

.side{
    width: 469px;
    display: grid;
    flex-shrink: 0;
    border-left: 1px solid #282828;    
    align-content: start;
    transition: all 0.5s;
}

.sidebutton{
    display: block;
    text-align: center;
    background-color: #282828;
    color: #dcdcdc !important;
    transition: all 0.5s;
    width: auto;
    margin: 20px 0 0 20px;
    padding: 10px 10px 5px 10px;
    transition: all 0.5s;
}

.sidebutton:hover{
    color: #fff !important;
}
/* Detect Mac Safari 6.1 or newer, hide any straggling Chrome references */
@media screen and (-webkit-max-device-pixel-ratio:1) and (min-color-index:0) {
    .sidebutton{ padding: 5px 10px; }
}

.kontakt_inner{
    display: block;
    text-align: center;
    margin: 0 0 0 20px;
    transition: all 0.5s;
}

.kontakt_image{
    background-color: #484848;
    width: 60%;
    max-width: 160px;
    aspect-ratio: 1/1;
    margin: 20px auto;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: all 0.5s;
}

.kontakt_ansprechpartner{
    font-size: 80%;
    margin: 0 auto -5px auto;
}

.kontakt_name{
    font-family: "cg_bold", Segoe UI, Calibri, Verdana, Arial;
    margin: 0 auto 20px auto;
    font-weight: bold;
}

.kontakt_funktion{
    font-size: 80%;
    font-family: "cg_bold", Segoe UI, Calibri, Verdana, Arial;
    font-weight: bold;
    margin: 0 auto 20px auto;
    line-height: 120%;
}

.kontakt_link{
    text-decoration: none;
    font-size: 80%;
    display: block;
    margin: 0 auto -2px auto;
}

.kontakt_link:last-child{
    margin: 0 auto;
}

.kontakt_link .fa-solid{
    margin-right: 3px;
    display: inline-block;
}

.fzcontainer{
    margin: 40px 0 40px 20px;
    transition: all 0.5s;
}

.fzcontainer #sidefz{
    margin: 0;
    padding: 0;
    transition: all 0.5s;
}

.fzcontainer #sidefz li{
    display: block;
    width: auto;
    aspect-ratio: 4/3;
    text-align: center;
    position: relative;    
    overflow: hidden;
    margin: 0 auto 20px auto;
}

.fzcontainer #sidefz li .bimg{
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    top: 0;
    bottom: 20%;
    left: 0;
    right: 0;
    text-decoration: none;
}

.fzcontainer #sidefz li .bimg .offer{
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    background-color: #ba1a2b;
    padding: 5px;
    transform: rotate(320deg);
    position: absolute;
    width: 100%;
    font-size: 100%;
    top: 10%;
    left: -40%;
}

.fzcontainer #sidefz li .btxt{
    position: absolute;
    bottom: 0;
    top: 80%;
    left: 0;
    right: 0;
    padding: 10px;
    background-color: #282828;
    cursor: pointer;
}

.fzcontainer #sidefz li .btxt.pointer{
    cursor: pointer;
}

.fzcontainer #sidefz li h4{
    margin: 0 auto 2px auto;
    padding: 0;
    font-size: 100%;
    white-space: nowrap;
    color: #dcdcdc;
    transition: all 0.5s;
}

.fzcontainer #sidefz li h4:hover{
    color: #fff;    
}

.fzcontainer #sidefz li h4 a[href]:link, .fzcontainer #sidefz li h4 a[href]:visited, .fzcontainer #sidefz li h4 a[href]:active, .fzcontainer #sidefz li h4 a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    transition: all 0.5s;
}

.fzcontainer #sidefz li:hover h4 a[href]{
    color: #fff;    
}

.fzcontainer #sidefz li .subheadline{
    margin: 0 auto;
    padding: 0;
    font-weight: normal;
    font-size: 80%;
    white-space: nowrap;
    color: #dcdcdc;
    transition: all 0.5s;
}

.fzcontainer #sidefz li .subheadline:hover{
    color: #fff;    
}

.fzcontainer #sidefz li .subheadline a[href]:link, .fzcontainer #sidefz li .subheadline a[href]:visited, .fzcontainer #sidefz li .subheadline a[href]:active, .fzcontainer #sidefz li .subheadline a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    transition: all 0.5s;
}

.fzcontainer #sidefz li:hover .subheadline a[href]{
    color: #fff;    
    transition: all 0.5s;
}

#newsletter table:first-of-type tr:nth-child(2) td{
    height: 0;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

#newsletter br{
    display: none;
}

#newsletter #emailconfirm{
    padding: 0;
}

#newsletter .content_form input{
    width: 228px;
}

#newsletter .selectBox-dropdown{
    width: 238px !important;
}

#newsletter .content_form input[type=checkbox]{
    width: 29px;
    margin: -3px 5px 0 0;
    float: left;
}

#newsletter input[type=submit]{
    margin: 20px auto;
}

#termin{
    text-align: center;
    transition: all 0.5s;
}

#bottom{
    background-color: #282828;
    color: #dcdcdc;
    font-size: 70%;
    margin: 0 20px;
    transition: all 0.5s;
}

#bottom a[href]:link, #bottom a[href]:visited, #bottom a[href]:active, #bottom a[href]:focus{
    text-decoration: none;
    color: #dcdcdc;
    transition: all 0.5s;
}

#bottom a[href]:hover, #bottom a[href].active{
    color: #fff;    
    transition: all 0.5s;
}

#bottom #bottom_container{
    position: relative;
    text-align: right;
}

#address{
    padding: 0;
    margin: 0;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.5s;
}

#address li{
    display: inline-block;
    margin: 0 10px 0 0;
    padding: 0 10px 0 0;
    border-right: 1px solid #dcdcdc;
    transition: all 0.5s;
}

#address li:last-child{
    border-right: none;
    margin: 0;
    padding: 0;
}

#bnav{
    margin: 0;
    padding: 50px 0 20px 0;
    transition: all 0.5s;
}

#bnav li{
    display: inline-block;
    margin: 0 0 0 10px;
    padding: 0 0 0 10px;
    border-left: 1px solid #dcdcdc;
    vertical-align: middle;
    transition: all 0.5s;
}

#bnav li:first-child{
    border-left: none;
    margin: 0;
    padding: 0;
}

#bnav li:nth-child(5){
    font-size: 250%;
    border-left: none;
    margin: 0 0 0 15px;
    padding: 0;
}

#bnav li:nth-child(6), #bnav li:nth-child(7), #bnav li:nth-child(8){
    font-size: 250%;
    border-left: none;
    margin: 0 0 0 5px;
    padding: 0;
}

#credits{
    margin: 0;
    padding: 0 0 20px 0;
    transition: all 0.5s;
    font-size: 70%;
}

#credits li{
    display: inline-block;
    margin: 0;
    padding: 0;
    vertical-align: middle;
    transition: all 0.5s;
}

/* Dropdown control */
.selectBox-dropdown {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    position: relative;
    border: none;
    text-decoration: none;
    text-align: left;
    color: #282828;
    outline: none;
    vertical-align: middle;
    background: #dcdcdc;
    box-shadow: none;
    border-radius: 0;
    display: inline-block;
    cursor: default;
    transition: all 0.5s;
    overflow: hidden;
}

.selectBox-dropdown:focus,
.selectBox-dropdown:focus .selectBox-arrow {
    border-color: transparent;
}

.selectBox-dropdown .selectBox-label {
    padding: 2px 8px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    font-size: 90%;
    color: #282828;
    background-color: #dcdcdc;
    padding: 6px;
    width: unset !important;
}

.selectBox-dropdown .selectBox-arrow {
    position: absolute;
    top: 0;
    right: 0;
    width: 23px;
    height: 100%;
    background: url(/images/jquery.selectBox-arrow.gif) 50% center no-repeat;
    border-left: solid 1px transparent;
    background-color: #dcdcdc;
}

/* Dropdown menu */
.selectBox-dropdown-menu {
    position: absolute;
    z-index: 99999;
    max-height: 200px;
    min-height: 1em;
    border: none; /* should be the same border width as .selectBox-dropdown */
    background: #dcdcdc;
    box-shadow: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    border-bottom: 5px solid #dcdcdc;
}

/* Inline control */
.selectBox-inline {
    width: 100%;
    outline: none;
    border: none;
    background: #dcdcdc;
    display: inline-block;
    border-radius: 0;
    overflow: auto;
}

.selectBox-inline:focus {
    border-color: #666;
}

/* Options */
.selectBox-options,
.selectBox-options LI,
.selectBox-options LI A {
    list-style: none;
    display: block;
    cursor: default;
    margin: 0;
    transition: all 0.5s;
    padding: 2px 0;
}

.selectBox-options.selectBox-options-top{
    border-bottom:none;
	margin-top:1px;
}
.selectBox-options.selectBox-options-bottom{
	border-top:none;
}

.selectBox-options LI A {
    line-height: 1.5;
    padding: 0 6px;
    white-space: nowrap;
    overflow: hidden;
    font-size: 90%;
}

.selectBox-options LI.selectBox-hover A {
    background-color: #fff;
}

.selectBox-options LI.selectBox-disabled A {
    color: #484848;
    background-color: transparent;
}

.selectBox-options LI.selectBox-selected A {
    background-color: #fff;
}

.selectBox-options .selectBox-optgroup {
    color: #666;
    background: #fff;
    font-weight: bold;
    line-height: 1.5;
    padding: 0 .3em;
    white-space: nowrap;
}

/* Disabled state */
.selectBox.selectBox-disabled {
    color: #888 !important;
}

.selectBox-dropdown.selectBox-disabled .selectBox-arrow {
    opacity: .5;
    filter: alpha(opacity=50);
    border-color: #666;
}

.selectBox-inline.selectBox-disabled {
    color: #888 !important;
}

.selectBox-inline.selectBox-disabled .selectBox-options A {
    background-color: transparent !important;
}


@media only screen and (max-width: 1500px){
    .boxen li .btxt{ padding: 15px 20px; }
    .boxen li h2{ margin: 0 auto 7.5px auto; }    
    .content_container{ width: calc(100% - 450px); }
    .side{ width: 449px; }
}

@media only screen and (max-width: 1400px){
    #nav{ gap: 60px; }
    #nav li #nav_left{ gap: 60px; }
    #nav li #nav_center{ gap: 30px; }
    #nav li #nav_right{ gap: 60px; }    
    .boxen li .bimg .kontakticons .icon{ font-size: 300%; }
    .boxen li h2{ font-size: 115%; }
    .boxen li .subheadline{ font-size: 100%; }    
    .content_container{ width: calc(100% - 425px); }
    .side{ width: 424px; }    
    .fzcontainer #sidefz li .btxt{ padding: 8px; }
    #bnav{ width: 350px; margin: 0 0 0 auto; padding: 20px 0; }
    #bnav li:nth-child(5){ margin: 20px 0 0 80px; }
    #bnav li:nth-child(6), #bnav li:nth-child(7){ margin: 20px 0 0 5px; }
    #bnav li:nth-child(8){ margin: 20px 0 0 5px; }
}

@media only screen and (max-width: 1300px){
    .boxen li .btxt{ padding: 12.5px 20px; }
    .boxen li h2{ font-size: 110%; }
    .boxen li .subheadline{ font-size: 95%; }
    .content_container{ width: calc(100% - 385px); }
    .content_gallery .offer{  font-size: 100%; top: 30px; left: -150px; }
    .side{ width: 384px; }
    .fzcontainer #sidefz li .btxt{ padding: 4px; }
    .fzcontainer #sidefz li .bimg .offer{ font-size: 80%; }
}

@media only screen and (max-width: 1200px) {
    #nav{ gap: 40px; }
    #nav li #nav_left{ gap: 40px; }
    #nav li #nav_center{ gap: 20px; }
    #nav li #nav_right{ gap: 40px; }
    .filtergroup{ width: calc(25% - 7.5px); }
    #filter_bauart{ order: 6; }
    #filter_km{ order: 7; }
    #filter_kfznummer{ order: 8; }
    .boxen li .bimg .offer{ font-size: 95%; }
    .boxen li .btxt{ padding: 10px 20px; }
    .boxen li h2{ font-size: 105%; margin: 0px auto 5px auto;  }
    .boxen li .subheadline{ font-size: 90%; }
    .content_container{ width: calc(100% - 355px); }
    .side{ width: 354px; }
    .fzcontainer #sidefz li .btxt{ padding: 2px; }
    #bottom #bottom_container{ text-align: center; padding: 20px 0; }
    #address{ position: relative; top: unset; left: unset; transform: unset; margin: 0 auto; }
    #bnav{ margin: 20px auto 0 auto; padding: 0; }
    #bnav li:nth-child(5){ margin: 20px 0 0 40px; }
    #bnav li:nth-child(8){ margin: 20px 40px 0 5px; }
    #credits{ padding: 20px 0; }
}

@media only screen and (max-width: 1100px){
    .boxen li .bimg .offer{ font-size: 90%; }
    .boxen li .btxt{ padding: 7.5px 10px; }
    .boxen li h2{ font-size: 100%; margin: 0px auto 2.5px auto; }
    .boxen li .subheadline{ font-size: 85%; }
    .content_container{ width: calc(100% - 320px); }
    .content_fzdata #datalist li .label{ width: 180px; }
    .content_form label{ width: 180px; }
    .content_form input, .content_form textarea{ width: calc(100% - 194px); }
    .content_form input[name=ort]{ width: calc(100% - 273px); }
    .content_form .selectBox-dropdown{ width: calc(100% - 182px) !important; }
    .content_form .errormessage{ margin: 20px auto 20px 180px; }
    .content_form button{ margin: 0 auto 0 180px; }
    .side{ width: 319px; }
    .fzcontainer #sidefz li .btxt{  }
    .fzcontainer #sidefz li h4{ margin: -3px auto; }
}

@media only screen and (max-width: 1000px){
    body{ overflow-x: hidden; }
    #top_container{ text-align: left; margin: 20px; }
    #nav{ display: none; font-size: 115%; position: absolute; right: -200px; top: 85px; width: 160px; padding: 20px; background-color: #282828; transition: unset; }
    #nav li:nth-child(2){ display: none; transition: unset; }
    #nav li #nav_left li:first-child{ display: block; transition: unset; }
    #nav li #nav_right li:nth-last-child(2){ display: block; transition: unset; }
    #nav li #nav_right li:nth-last-child(3){ display: block; transition: unset; }
    #nav li{ display: block; width: unset; transition: unset; }    
    #nav li .navgroup{ display: block; transition: unset; }
    #nav li .navgroup li{ margin: 0 auto 5px 0; padding: 3px 0; transition: unset; }
    #nav li:last-child .navgroup li:last-child{ margin: 0 auto 0 0; transition: unset; }
    #mobilenav{ display: inline-block; }
    #mobilelogos{ display: flex; }
    .zoomimage{ margin: 20px; width: calc(100% - 40px); }
    .boxen{ xmargin: 0 20px; }
    .boxen li .bimg .offer{ font-size: 85%; }
    .boxen li .btxt{ padding: 10px; }
    .boxen li h2{ font-size: 95%; }
    .boxen li .subheadline{ font-size: 80%; }
    .content_container{ width: calc(100% - 280px); }
    .side{ width: 279px; }
    .kontakt_inner{ margin: 0; }
    .fzcontainer #sidefz{ margin: 0; }
    .fzcontainer #sidefz li .btxt{ font-size: 75%; }
    .fzcontainer #sidefz li h4{ margin: 0 auto -8px auto; }
    .fzcontainer #sidefz li .bimg .offer{ font-size: 70%; }
    .sidebutton{ margin: 20px 0 0 20px; }
    #bottom_container{ margin: 0 20px; }
    #address{ width: auto; }
    #address li{ display: block; }
    #address li:first-child{ margin: 0 auto; padding: 0; border-right: none; }
    #address li:nth-child(2){ margin: 10px auto 0 auto; padding: 0;  border-right: none; }
    #address li:nth-child(3){ margin: 10px auto 0 auto; padding: 0; border-right: none; }
    #address li:nth-child(4){ margin: 10px auto 0 auto; padding: 0; }
}

@media only screen and (max-width: 900px){
    .wrapper{ max-width: unset; }
    .boxen li .btxt{ padding: 5px 10px; }
    .boxen li h2{ font-size: 90%; margin: 0 auto 2.5px auto; }
    .boxen li .subheadline{ font-size: 80%; }
    .fzcontainer{ margin: 40px 0;}
    .fzcontainer #sidefz li .btxt{ padding: 25px; font-size: 120%; }
    .fzcontainer #sidefz li h4{ margin: 5px auto; }
    .fzcontainer #sidefz li .bimg .offer{ font-size: 100%; }
    .content{ flex-direction: column; }
    .content_container{ width: auto; }
    .side{ width: auto; border-top: 1px solid #282828; border-left: none; }    
    .sidebutton{ margin: 20px 0 0 0; }    
    .imagecontainer{ margin: 20px auto auto auto; width: 100%; }
    .imagecontainer.fz{ display: none; }    
}

@media only screen and (max-width: 800px){    
    .filtergroup{ width: calc(33.33333% - 6.66666px); }
    #filter_leistung{ order: 8; }
    #filter_kfznummer{ order: 9; }    
    .boxen li{ width: 100%; }
    .boxen li .bimg .offer{ font-size: 100%; }
    .boxen li .btxt{ padding: 20px; }
    .boxen li h2{ font-size: 120%; margin: 0 auto 10px auto;  }
    .boxen li .subheadline{ font-size: 105%; }    
    .imagecontainer{ float: unset; max-width: 100%; }
    .content_text{ padding: 0; }    
    .fzcontainer #sidefz li .btxt{ padding: 20px; font-size: 110%; }
}

@media only screen and (max-width: 700px){    
    .boxen li .btxt{ padding: 12.5px 20px; }
    .boxen li h2{ font-size: 110%; margin: 0 auto 7.5px auto; }
    .boxen li .subheadline{ font-size: 100%; }
    .content_gallery .offer{  font-size: 80%; top: 20px; left: -165px; padding: 2px; }
    .content_gallery #gal_preview{ display: none; }    
    .fzcontainer #sidefz li .btxt{ padding: 10px; font-size: 110%; }    
    .content_form label{ width: 100%; }
    .content_form input, .content_form textarea{ width: calc(100% - 12px); }
    .content_form input[name=ort]{ width: calc(100% - 93px); }
    .content_form .selectBox-dropdown{ width: calc(100% - 2px) !important; }
    .content_form .errormessage{ margin: 20px auto 20px 0; }
    .content_form button{ margin: 0 auto 0 0; min-width: 250px; }
}

@media only screen and (max-width: 600px){
    .filtergroup{ width: calc(50% - 5px); }
    #filter_preis{ order: 9; }
    #filter_kfznummer{ order: 10; }
    .content_fzdata #datalist li{ margin: 0 auto 5px auto; }
    .content_fzdata #datalist li:last-child{ margin: 0 auto; }
    .content_fzdata #datalist li .label{ width: unset; display: block; float: unset; }
    .boxen li .bimg .offer{ font-size: 95%; }
    .boxen li .bimg .kontakticons .icon{ font-size: 200%; }
    .boxen li .btxt{ padding: 10px 20px; }
    .boxen li h2{ font-size: 100%; margin: 0 auto 2.5px auto; }
    .boxen li .subheadline{ font-size: 90%; }
    .fzcontainer #sidefz li .btxt{ padding: 5px; font-size: 105%; }
    .fzcontainer #sidefz li h4{ margin: 0 auto; }
}

@media only screen and (max-width: 500px){
    .filtergroup{ width: 100%; }
    #filter_kategorie{ order: 10; }
    #filter_kfznummer{ order: 11; }    
    .boxen li .bimg .offer{ font-size: 90%; }
    .boxen li h2{ font-size: 85%; }
    .boxen li .subheadline{ font-size: 75%; }    
    .fzcontainer #sidefz li h4{ margin: -2px auto; }
}