@import url("https://p.typekit.net/p.css?s=1&k=mry8xnf&ht=tk&f=6801.6805.6806.9945.6808.6809.8415.8416.6846.6847.6848.6851.27069.27070.27073.27074.35556.35557.35558.35559.35560.35561.35562.35563.35564.35565.35566.35567&a=3827916&app=typekit&e=css");

@font-face {
font-family:"myriad-pro";
src:url("https://use.typekit.net/af/cafa63/00000000000000000001709a/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/cafa63/00000000000000000001709a/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/cafa63/00000000000000000001709a/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
font-display: optional;font-style:normal;font-weight:400;
}

@font-face {
font-family:"myriad-pro";
src:url("https://use.typekit.net/af/1b1b1e/00000000000000000001709e/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/1b1b1e/00000000000000000001709e/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/1b1b1e/00000000000000000001709e/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
font-display: optional; font-style:normal;font-weight:700;
}

@font-face {
font-family:"myriad-pro";
src:url("https://use.typekit.net/af/d32e26/00000000000000000001709b/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff2"),url("https://use.typekit.net/af/d32e26/00000000000000000001709b/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("woff"),url("https://use.typekit.net/af/d32e26/00000000000000000001709b/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=i4&v=3") format("opentype");
font-display: optional; font-style:italic;font-weight:400;
}

.whatsapp {
    position: fixed;
    bottom: 0;
    right: 2px;
    height: 70px;
    z-index: 999;
    display: flex;
}

.whatsapp img {
    width: 55px;
    height: 55px;
}

.whatsapp a {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    padding-left: 2px;
}

.whatsapp span {
    color: black;
    font-size: 12px;
    padding-right: 5px;
    margin-right:10px;
    background-color: #FFF;
    z-index: -1;
    left: -10px;
    position: relative;
    padding-left: 15px;
}

.whatsapp a:hover {
    filter: grayscale(100);
}


.line-1 {
	font-weight: bold;
    width: 15em;
	margin-top: 16px;
    border-right: 2px solid #000;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    transform: translateY(-50%);  
	display: inline-flex
}

.anim-typewriter {
  animation: typewriter 4s steps(44) 1s 1 both,
             blinkTextCursor 650ms steps(44) infinite normal;
}

@keyframes cssAnimation {	
    0% {opacity: 1;}
	75% {opacity: 1}
	100% {opacity: 0;}
}

@keyframes typewriter {
  from{width: 0;}
  to{width: 15em;}
}

@keyframes blinkTextCursor {
  from{border-right-color: #000;}
  to{border-right-color: transparent;}
}


html {
	font-family: "myriad-pro", sans-serif;
	scroll-behavior: smooth;
	font-size: 14pt;
}

body {
	margin:0;
	line-height: 1.0;
	background-color: #FFFFFF;
}

img {
	display: block;
	border: 0;
	max-width: 100%;
}

/*Ausgewählter Text erscheint grau mit orangem Hintergrund */
::-moz-selection { color: #333; background-color: #ffaa5f}
::selection { color: #333; background-color: #ffaa5f}



h1 {
	line-height: 1.3;
	font-size: 2.0em;
	color: #0055A0;
	margin-top: 1.5em;
	margin-bottom: 1em;
}

h2 {
	line-height: 1.5;
	font-size: 1.3em;
	color: #000000;
	padding-bottom: 0;
	padding-top: 0;
	margin-bottom: 0.5em;
	margin-top: 1.5em;
}

p, span {
	line-height: 1.5;
	margin: 0;
	padding: 0
}


.briefkopf {
	display: none;
}

a {
	color: #0055A0;
	text-decoration: none;
	cursor: pointer;
	white-space: normal
}

a:hover{
	color: #d31126
}

p {
	width: 100%;
}

header {
	box-sizing: border-box;
    padding-left: 50px;
    padding-right: 50px;
    margin-bottom: 4em;
}

.headercenter {
    width: 100%;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	background-color: #FFF;
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
}

.headernavigation {
	flex-grow: 1;
}

.headernavigation ul {
	list-style: none;
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-end;
	margin-right: 28px;
}

.headernavigation li {
	margin-left: 22px;
}

.headernavigation a {
	margin-top: 29px;
	margin-bottom: 23px;
	padding-bottom: 4px;
	color: #000;
    white-space: nowrap;
}

.headernavigation a:hover {
	opacity: 0.8;
	border-bottom: 2px solid #d31126;
}

.headernavigation a:valid {
	color: green;
}

.headernavigationhome:before {
	content: '\f015';
	font-family: FontAwesome;
	display: inline-block;
	width: 24px;
	font-size: 0.85em;
}

.headernavigationverkauf:before {
	content: '\f1b9';
	font-family: FontAwesome;
	display: inline-block;
	width: 23px;
	font-size: 1.05em
}

.headernavigationgarage:before {
	content: '\f7d9';
	font-family: FontAwesome;
	display: inline-block;
	width: 21px;
	font-size: 0.9em;
}

.headernavigationstandorte:before {
	content: '\f3c5';
	font-family: FontAwesome;
	display: inline-block;
	width: 19px;
	font-size: 1.05em
}

.headernavigationuberuns:before {
	content: '\f2bb';
	font-family: FontAwesome;
	display: inline-block;
	width: 23px;
	font-size: 0.95em
}

.garagereichlinlogo {
	width: 220px;
	box-sizing: border-box;
	margin-left: 0;
	margin-bottom: 10px;
	margin-top: 10px;
}

.garagereichlinlogo a img {
       height: 100%;
}


.footernavicontainer {
	display: flex;
	justify-content: space-between;
	align-items: flex-start
}

.footernavi {
	background-color: #edf2f8;
	padding-top: 80px;
	padding-bottom: 80px;
	padding-left: 50px;
	padding-right: 50px;
	margin-top: 30px;	
}


.footernavi a {
	color: #000;
}

.footernavi a:hover {
	color: #0055A0;
}

#footernavihome:before {
	content: '\f015';
	font-family: FontAwesome;
	width: 25px
}

.footernavi ul {
	display: flex;
	flex-direction: column;
	list-style-position: inside;
	list-style-type: none;
	box-sizing: content-box;
	padding-inline-start: 0;
	margin-top: 0
}

.footernavititel {
	font-size: 24px;
	margin-top: 0;
	color: #000;
	padding-bottom: 10px;
	font-weight: bold;
	display: block;
}

.footernavi li {
	font-size: 18px;
	padding-bottom: 10px;
	padding-top: 10px;
}

.footercopyright {
	display:  flex; 
	background-color: #0055A0;
	padding-bottom: 25px;
	color: #FFF;
	justify-content: center;
}

.footercopyright a {
	color: #FFF
}

.footercopyright a:hover {
	color: #C1C1C1
}

.footerlogo {
	padding-top: 28px;
	padding-bottom: 15px;
}

.impressum {
	margin-right: 20px;
	margin-left: 20px;
	padding-top: 28px;
	padding-bottom: 15px;
}

#navigationswrapper  {
	position: fixed;
	display: none;
	box-shadow: 0 0 50px 2000px rgba(0, 0, 0, 0.4);
	top: 0;
	right: 0;
	height: 100%;
	background-color: #f6f6f6;
	width: 30vw;
	max-width: 499px;
	z-index: 10;
	font-size: 1em; 
	box-sizing: border-box; 
	line-height: 1.5;
	flex-wrap: wrap;
	align-content: flex-start;
    justify-content: center;
	transition: all 2s linear;
} 

#navigationswrapper label {
	padding-left: 35px;
	width: 100%;
}

#navigationswrapper div a {
	color: #000
}

#navigationswrapper input([type="radio"]) {
	border: 0;
	display: none
}

.navigationswrapperclickanywhere {
	cursor: default;
	position: fixed;
	z-index: -1;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0
}

.navititel {
	display: block;
	padding-top: 12px;
	padding-bottom: 10px;
	cursor: pointer;
	font-weight: 600;
	background-color: #FFF;
}

.navititel:hover {
	color: #0055A0;
}

.inputnaviverkauf, .inputnavifahrzeugliste, .inputnavigarage, .inputnavistandorte, .inputnaviuberuns  {
	display: inline-block;
	visibility: hidden;
	display: none
}

.filtertitelh2 {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 30px;
}

.filtertitel {
	padding-bottom: 12px;
	font-weight: bold;
	width: 100%;
	padding-left: 5px;
}

.filternavifahrzeugliste a {
	color: #000
}

.mobilemenubutton {
	align-items: flex-end;
	width: 30px;
}

.mobilemenubutton a {
	color: #000;
}

.mobilemenubutton a:hover {
	color: #d31126;
}

.mobilemenubutton a i {
	padding-bottom: 4px;
	font-size: 21px;
}

.mobilenavihomelink {
	color: #000;
	padding-bottom: 12px;
	padding-top: 12px;
	display: flex;
	font-weight: 600;
	width: 100%;
	padding-left: 35px;
	background-color: #FFF;
}

#filternavifahrzeugliste_expand, #filternaviverkauf_expand, #filternavistandorte_expand, #filternavigarage_expand, #filternaviuberuns_expand {
	height: 0px;
	overflow: hidden;
	width: 100%
}

#filternavifahrzeugliste_expand a, #filternaviverkauf_expand a, #filternavistandorte_expand a, #filternavigarage_expand a, #filternaviuberuns_expand a {
	display: block;
	padding-left: 55px;
	padding-top: 0px;
	padding-bottom: 12px;
	cursor: pointer;
	background-color: #FFF;
}

#filternavifahrzeugliste_expand a:hover, #filternaviverkauf_expand a:hover, #filternavistandorte_expand a:hover, #filternavigarage_expand a:hover, #filternaviuberuns_expand a:hover {
	color: #174ea6;
	padding-left: 55px;
}
	
#togglenaviverkauf:checked ~ #filternaviverkauf_expand {height: auto;}
.filternaviverkauf:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

#togglenaviverkauf:checked ~ .filternaviverkauf:before {
	content: '\f0d7';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px;
}
	
#togglenavifahrzeugliste:checked ~ #filternavifahrzeugliste_expand {
	height: auto;
}

.filternavifahrzeugliste:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px;
}

#togglenavifahrzeugliste:checked ~ .filternavifahrzeugliste:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px;
	padding-left: 5px;
}
	
#togglenavistandorte:checked ~ #filternavistandorte_expand {
	height: auto;
}

.filternavistandorte:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

#togglenavistandorte:checked ~ .filternavistandorte:before {
	content: '\f0d7';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}
	
#togglenavigarage:checked ~ #filternavigarage_expand {
	height: auto;
}

.filternavigarage:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

#togglenavigarage:checked ~ .filternavigarage:before {
	content: '\f0d7';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

#togglenaviuberuns:checked ~ #filternaviuberuns_expand {
	height: auto;
}

#filternaviuberuns_expand a:last-child {
	border-bottom: 1px solid rgba(0,0,0,.2);
}

.filternaviuberuns {
	border-bottom: 1px solid rgba(0,0,0,.2);
}

#togglenaviuberuns:checked ~ .filternaviuberuns {
	border-bottom: 0;
}

.filternaviuberuns:before {
	content: '\f0da';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

#togglenaviuberuns:checked ~ .filternaviuberuns:before {
	content: '\f0d7';
	font-family: FontAwesome;
	display: inline-block;
	width: 20px
}

.buttonfahrzeugsuchemobile {
	display: inline-flex;
	margin-top: 20px;
	margin-bottom: 10px;
	padding: 6px 15px;
	color: #0055A0 !important;
	font-size: 1em;
	background-color: #FFFFFF;
	border: 2px solid #0055A0;
	box-sizing: border-box;
	flex-grow: 1;
	justify-content: center;
    width: 100%;
    margin-left: 10%;
    margin-right: 10%;
    border-radius: 5px;
}

.buttonfahrzeugsuchemobile:hover {
	box-shadow: 3px 4px 6px 0 rgba(0,0,0,.2);
	background-color: #edf2f8;
}

#ButFilter {
	margin-top: 5px !important;
    margin-bottom: 5px !important;
    margin-right: 5px !important;
}

.main {
	box-sizing: border-box; 
	padding-left: 50px; 
	padding-right: 50px;
	margin-bottom: 4em;
}

.firstmainmargin {
	margin-top: 7em
}

.mainvideo {
	margin-top: -4em;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 4.5em !important;
}

.container {
	max-width: 1500px; 
	position: relative; 
	margin: 0 auto; 
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.element12 {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	box-sizing: border-box;	
}

.element12small {
	display: flex;
	flex-wrap: wrap;
	align-content: space-around;
	width: 25%;
	padding-left: 2.5em;
	box-sizing: border-box;	
	padding-bottom: 1em;
}

.element12smallleft {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 33%;
	box-sizing: border-box;	
	margin-right: 2.5em;
}

.element13, .teammember {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	width: calc(93% / 3);
	margin-bottom: 5em;	
}

.probefahrt {
    align-items: flex-start;
    width: 40%;
    margin-bottom: 2em;
}

.teamliste {
	justify-content: flex-start !important
}

.element13:hover {
	background-color: #edf2f8;
}

.element13:hover > .element13text {
	padding-left: 10px;
	transition: 0.3s;
}

.element13:hover > .element13pic img {
	transform: scale(1.03);
	transition: 0.3s;
}

.element13pic {
	overflow: hidden;
}

.element13pic img {
	width: 100%;
	height: auto;
}

.element13text {
	color: #000000;
	line-height: 1.5;
	display: flex;
	flex-direction: column;
	width: 100%;
}

.element13text:after {
	display: flex;
	content: "";
	width: 60px;
	height: 3px;
	left: 0;
	margin-top: 20px;
	background-color: #d31126;
}

.element13text a {
	color: #000000
}

.element13text h2 {
	margin-top: 0.5em;
	margin-bottom: 0
}

.element13text .tagoben {
	padding-top: 5px;
	margin-bottom: -5px;
	color: #0055A0
}

.element13text .fahrzeugtag {
	color: #FFF;
	background-color: #0055A0;
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 3px;
	padding-bottom: 3px;
	font-size: 0.8em;
	align-self: flex-end;
	position: absolute
}

.element13text .fahrzeugtag:empty {
	display: none
}

.fahrzeugliste {
	margin-bottom: 3em
}

.fahrzeuglisteletztelink::after {
    content: "";
    width: calc(93% / 3)
}

.fahrzeuglistetext {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
}

.fahrzeuglistetext h2 {
	width: 100%;
}

.fahrzeuglistemodell {
	width: 100%;
}

.fahrzeuglistemodell span {
	padding-left: 5px;
}

.fahrzeuglisteinv {
	width: 30%;
}

.fahrzeuglisteinv:before {
	content: '\f133';
	font-family: FontAwesome;
	display: inline-block;
	width: 24px;
	font-size: 0.85em;
	vertical-align: 0px
}

.fahrzeuglistekm {
	width: 70%;
}

.fahrzeuglistekm:before {
	content: '\f018';
	font-family: FontAwesome;
	display: inline-block;
	width: 24px;
	font-size: 0.85em;
	vertical-align: 0px
}


.fahrzeuglistepic {
	display: flex;
	max-height: 270px;
	overflow: hidden;
	align-content: flex-end;
}

.fahrzeuglistepic img {
	width: 100%;
	align-self: flex-end;
}

.hellblauerhintergrund {
	background-color: #edf2f8;
}


.hellblauerhintergrundtitel {
	background-color: #edf2f8;
}

.hellblauerhintergrundsmall {	
	background: linear-gradient(180deg, #FFFFFF 22%, #edf2f8 0%);
	margin-top: 5em;
	margin-bottom: 5em;
}

.button {
	display: flex;
	margin-top: 20px;
	margin-bottom: 19px;
	margin-right: 20px;
	padding-left: 15px;
	padding-right: 15px;
	color: #0055A0;
	font-size: 1em;
	background-color: #FFFFFF;
	border: 2px solid #0055A0;
	box-sizing: border-box;
	align-self: flex-end;
	justify-content: center;
	align-items: center;
	flex-grow: 0;
	height: 42px;
	width: fit-content;
    border-radius: 5px;
}

.button:hover {
	box-shadow: 3px 4px 6px 0 rgba(0,0,0,.2);
	background-color: #edf2f8;
	color: #174ea6
}

.secondarybutton {
	display: flex;
	margin-top: 20px;
	margin-bottom: 19px;
	margin-right: 20px;
	padding-left: 15px;
	padding-right: 15px;
	color: #0055A0;
	font-size: 1em;
	border: 2px solid #0055A0;
	box-sizing: border-box;
	align-self: flex-end;
	justify-content: center;
	align-items: center;
	flex-grow: 0;
	height: 42px;
    width: fit-content;
    background-color: #edf2f8;
    border-radius: 5px;
}

.secondarybutton:hover {
	box-shadow: 3px 4px 6px 0 rgba(0,0,0,.2);
	background-color: #FFF;
}

.textlink {
    color: #0055A0
}

.textlink:hover {
	text-decoration: underline;
	text-decoration-color: #d31126;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;	
    color: #000;
}

.buttonteam:before {
	content: '\f2bb';
	font-family: FontAwesome;
	display: inline-block;
	width: 26px;
	font-size: 0.80em;
	vertical-align: 1px	
}

.buttonfahrzeuge:before {
	content: '\f1b9';
	font-family: FontAwesome;
	display: inline-block;
	width: 26px;
	font-size: 0.80em;
	vertical-align: 1px	
}

.markenlogo-grid {
	display: flex;
	flex-wrap: wrap;
	align-content: space-around;
    align-items: center;
	width: 100%;
	margin-top: 3em;
	margin-bottom: 4em;
}

.markenlogo-element {
	width: 25%;
	display: flex;
	justify-content: center;
    flex-wrap: wrap;
    height: 100%;
}


.markenlogo-mitbutton {
	width: 100%;
	display: flex;
	justify-content: center;
    margin-bottom: 1em;
    align-self: flex-end;
}

.markenlogo:hover > img {
  filter: invert(0.3);                                  
}

.kialogo {
	width: 185px;
}

.opellogo {
	width: 125px;
}

.lexuslogo {
	width: 155px;
}

.toyotalogo {
	width: 150px;
}

.titelbild {
	position: relative;
	top: -3vw;
	width: 58%
}

.titelbildclipping {
	clip-path: polygon(0% 0, 100% 0%, 92% 100%, 0% 100%);
    width: 100%;    
}

.titelbildlegende {
	font-size: 0.8em;
	padding-top: 7px;
}

.titelbildtext {
	margin-bottom: 3em;
	padding-right: 3vw;
	width: 40%;
	align-content: center;
}

.titelbildtext img {
	margin-bottom: 2em;
}

video {
	max-width: 100%
}

.quicklinkboxwrapper {
	width: 100%;
	justify-content: center;
	margin-top: 6em;
}

.quicklinkbox {
	border: 3px solid #0055A0;
	width: 46%;
	box-sizing: border-box;
	padding-top: 15px;
	padding-left: 30px;
	padding-right: 25px;
	padding-bottom: 0px;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	height: fit-content;
}

.textleft {
	width: 45%;
	justify-content: left;
	text-align: justify;
	line-height: 1.5;
    box-sizing: border-box;
}

.centertext {
	width: 45%;
    margin-left: auto;
    margin-right: auto;
	justify-content: center;
	text-align: justify;
	line-height: 1.5;
    box-sizing: border-box;
}

.centertext h2, .centertext h3 {
	text-align: left;
	width: 100%;
}

.centertext .button {
	margin-right: auto;
}

.video {
	margin-top: 2.5em;
	margin-bottom: 2.5em;
}

.quicklinkbox a {
	width: 100%;
	margin-top: 5px;
	margin-bottom: 25px;
}

.quicklinkbox a:hover {
	color: #0055A0;
}

.nohover a:hover {
    cursor: default;
}

.quicklinkmodellpalette:before {
	content: '\f518';
	font-family: FontAwesome;
	display: inline-block;
	width: 22px;
	font-size: 0.85em;
	vertical-align: 1px	
}

.quicklinkonfigurator:before {
	content: '\f1de';
	font-family: FontAwesome;
	display: inline-block;
	width: 22px;
	font-size: 0.85em;
	vertical-align: 1px	
}

.quicklinkprospekt:before {
	content: '\f1c1';
	font-family: FontAwesome;
	display: inline-block;
	width: 22px;
	font-size: 0.85em;
	vertical-align: 2px	
}

.quicklinkprobefahrt:before {
	content: '\f1b9';
	font-family: FontAwesome;
	display: inline-block;
	width: 22px;
	font-size: 0.85em;
	vertical-align: 1px	
}

.quicklinkcheck:before {
	content: '\f00c';
	font-family: FontAwesome;
	display: inline-block;
	width: 22px;
	font-size: 0.85em;
}

.quicklinkcheck {
    display: flex;
    margin-top: 5px;
}

.quicklinkboxtitel {
	position: relative;
    top: -24px;
    left: 0px;
	margin-left: -5px;
    text-align: left;
    background-color: #FFFFFF;
    font-weight: bold;
    color: #0055A0;
    padding-left: 15px;
    padding-right: 15px;
}

.titelleistefahrzeugsuche {
	align-items: center;
}


.anzahlfahrzeuge {
	margin-top: 0;
	margin-bottom: 0;
	flex-grow: 1
}

.fahrzeuglistewrapper {
    margin-bottom: 1em;
}

.fahrzeuglistefilter {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
	overflow: hidden;
	padding-left: 0px;
	justify-content: flex-start;
    margin-top: 1em;
	margin-bottom: 0.5em;
    padding-bottom: 1em;
}

.fahrzeuglistefilterspalte {
	max-width: calc(100% / 3);
	min-width: calc((100% - 60px) / 4);
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	border-left: 1px solid #0055A0;
	padding-left: 10px;
	margin-top: 0.5em;
}

.fahrzeuglistefilterspalte span {
	width: 100%;
	height: 26px;
	margin-bottom: 2px;
	padding-left: 5px;
	color: #000;
    cursor: pointer;
    -webkit-user-select: None;
	margin-right: 30px;
	display: flex;
	justify-content: space-between;
	box-sizing: border-box;
	margin-left: 5px;
}

.fahrzeuglistefilterspalte span:hover {
	background-color: #cccccc;
}

.FilterSelectedPos {
	background-color: #cccccc;
}

.FilterSelectedPos:hover {
	background-color: #dbdada !important;
}

.FilterSelectedPos:hover:after {
	content: "X";
	padding-right: 5px;
}


.backtolistbutton {
	color: #000000;
	font-size: 1em;
	margin-right: 1.5em;
}

.backtolistbutton:before {
	content: '\f060';
	font-family: FontAwesome;
	display: inline-block;
	width: 21px;
	font-size: 0.85em;
}

.merklistebutton {
	color: #000000;
	font-size: 1em;
}

.merklisteleer {
    margin-top: 1em;
}

.merklisteleer a {
    padding-left: 0
}

.merklistebutton:before {
	content: '\f005';
	font-family: FontAwesome;
	display: inline-block;
	width: 21px;
	font-size: 0.85em;
}

.printbutton:before {
	content: '\f02f';
	font-family: FontAwesome;
	display: inline-block;
	width: 19px;
	font-size: 0.7em;
}

.merkenbutton:after {
	content: 'merken';
}

.merkenbutton:before {
	content: '\f005';
	font-family: FontAwesome;
	display: inline-block;
	width: 19px;
	font-size: 0.7em;
}


.testred::after {
	content: 'gespeichert';
}

.testred::before {
	content: "\f00c";
}

.testblue {
	border-color: #0055A0;
}



.linkfilterreset {
	color: #000;
	padding-right: 15px;
	font-size: 1em;
}

.linkfilterreset:before {
	content: '\f2ea';
	font-family: FontAwesome;
	display: inline-block;
	width: 19px;
	font-size: 0.85em;
    margin-left: 3px;
}

.inputfilterlabel {
	padding: 12px 18px;
	color: #FFFFFF;
	font-size: 16px;
	background-color: #0055A0;
	margin-left: 15px;
	box-sizing: border-box;
	cursor: pointer;
	height: 40px;
	width: 210px;
	text-align: center;
}

.inputfilterlabeldown:after {
	content: '\f078';
	font-family: FontAwesome;
	display: inline-block;
	padding-left: 8px;
	font-size: 0.85em;
}

.inputfilterlabelup:before {
	content: "Filter schliessen";
}

.inputfilterlabelup span {
	display: none;
}

.inputfilterlabelup:after {
	content: '\f077';
	font-family: FontAwesome;
	display: inline-block;
	padding-left: 8px;
	font-size: 0.85em;
}

select {
  	-moz-appearance: none;
  	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	height: 42px;
	background-color: #FFF;
	box-sizing: border-box;
	margin-top: 20px;
	margin-bottom: 10px;
	padding: 4px 0px 4px 10px;
	font-size: 1em;
	line-height: 1.7em;
	vertical-align: middle;
	border: 2px solid #0055A0;
    background-image: url("/layout/arrow_down.png");
    background-position: 90% center; /*Positioning*/
    background-repeat: no-repeat; /*Prevent showing multiple background images*/
	background-size: 15px;
	align-self: flex-end;
	align-items: center;
	flex-grow: 0;
    color: #0055A0;
}

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

.fahrzeugsortierung {
	margin-right: 0;
}

#CarListLoader  {
	height: 35vh;
	width: 100vw;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	margin-bottom: 15vh;
}

.loadwrapper {
	position: fixed;
	height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	background-color: rgba(255,255,255,0.76);
	z-index: 999;
	height: 100%;
	overflow: hidden;

}

.loadwrapperinhalt {
	position: absolute;
	left: auto;
	right: auto;
	top: 20%;
	font-size: 3em;
	color: black;
}

.loadwrapperbackground {
	color: #000000
}

/** ANIMATION AUTO im LOADER **/
.car__body {
	animation: shake 0.2s ease-in-out infinite alternate;
    stroke: #000000;
}
.car__wheel--left, .car__wheel--right {
	stroke: #000000;
    fill: #0055A000;
}
.car__line {
	stroke: #000000;
  	transform-origin: center right;
  	stroke-dasharray: 22;
  	animation: line 0.8s ease-in-out infinite;
  	animation-fill-mode: both;
}
.car__line--top {
  	animation-delay: 0s;
}
.car__line--middle {
	animation-delay: 0.2s;
}
.car__line--bottom {
  	animation-delay: 0.4s;
}

/*** FAHRZEUGDETAIL ***/



.fzdetailbildundtitel {
	margin-bottom: 4em;
}

.fzdetailbildgross {
    display: block;
    width: 55%;
    margin-bottom: 2.5em
}

.fahrzeugbildweitere {
    display: block;
    width: 100%;
    margin-top: 2.5em;
    margin-left: auto;
    margin-right: auto;
}

.fahrzeugbildweitere li {
    list-style: none;
    padding-bottom: 0.5em;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}


.fzdetailtitel {
	display: flex;
}

.fzdetailtiteldatawrapper {	
	width: 36%;
	display: flex;
	align-content: space-between;
	flex-direction: column;
	flex-wrap: nowrap;
}

.fzdetailtitel {
	width: 100%;
	flex-wrap: nowrap;
	flex-direction: column;
	flex-grow: 3;
}


.zuruckbutton, .merklistebutton {
	padding-left: 22px;
}

.tagwrapper {
	display: flex;
	width: 100%;
	justify-content: flex-end;
}

.fzdetailhead {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 2.5em;
}

.fzdetailtopbuttons {
	height: 22%;
	flex-grow: 0;
	flex-shrink: 0;
	display: flex;
	width: 100%;
	justify-content: flex-end;
	align-items: stretch;
	flex-wrap: wrap;
}

.fzdetailhead .button {
	width: 100%;
	margin-right: 0;
}

.fzdetailhead .buttonsmall {
	width: 48%;
	margin-top: 3px !important;
	box-sizing: border-box;	
	margin-right: 0;
}


.fzdetailtag {
	font-size: 1em;
	height: 36px;
	padding-top: 8px;
	padding-bottom: 0px;
	padding-left: 16px;
	padding-right: 16px;
	box-sizing: border-box;
	align-self: flex-end;
	flex-grow: 0;
	background-color: #0055A0;
	color: #FFF;
}

.fzdetailtag:empty {
	display: none
}

.fahrzeugmarkemodell h1 {
	margin-top: 0.5em;
	margin-bottom: 0.3em;
}

.fzdetailuntertitel {
	margin-bottom: 1em;
    line-height: 1.2;
}

.fzdetailuntertitel:empty {
	display: none;
}

.fzdetailpreis {
}

.fzdetailpreis h1 {
	color: #000000;
	margin-top: 0em;
	margin-bottom: 0;
}

.fzdetaildaten {
	width: 100%;
	margin-bottom: 2em;
}

.fzdetaildatenwrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    width: 55%;
}

.fzdetaildatenlabel {
	flex-grow: 0;
	width: 35%;
	margin-bottom: 10px;
}

.fzdetaildatenwert {
	flex-grow: 2;
	width: 65%;	
	margin-bottom: 12px;
}

.fzdetailbemerkung {
	width: 80%;
	flex-direction: row; 
	display: flex;
	flex-wrap: nowrap; 
	align-content: flex-start;
	justify-content: flex-start;
}

.fzdetailsonderausstattung {
	width: 100%;
	flex-direction: column; 
	display: flex;
	flex-wrap: nowrap; 
	align-content: flex-start;
	justify-content: flex-start;
}

.fzdetailsonderausstattung ul  {
	display: flex; 
	width: 100%; 
	list-style: none; 
	flex-wrap: wrap;
	margin: 0;
	box-sizing: border-box;
	line-height: 1.5;
	padding: 0; 
	padding-bottom: 7px;
	display: inline-block;	
	width: 100%;
}

.fzdetailsonderausstattung ul:before {
	content: "\f00c"; 
	font-family: FontAwesome;
	color: #5f6368; 
	padding-right: 7px;
	font-size: 14px; 
	padding-top: 1px
}

.fzdetailsonderausstattung ul li {
	padding-top: 4px; 
	margin-left: 23px; 
	line-height: 1.5
}

.fzdetailsonderausstattung ul li:before {
	content: "–";
	color: #5f6368; 
	padding-right: 7px;
	font-size: 14px;
}

.fzdetailsonderausstattung p {
	color: #5f6368;
	padding-top: 10px;
}

.fzdetailserienausstattung {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column-reverse
}

.fzdetailserienausstattungwrapper {
	width: 100%;
	display: table-column;
	column-count: 2;
	height: 10.5em;
	overflow: hidden;
	column-gap: 0;	
}

.fzdetailserienausstattung ul {
	list-style: none;	 
	flex-wrap: wrap;
	margin: 0;
	box-sizing: border-box;
	line-height: 1.5;
	padding: 0;
	padding-bottom: 9px;	
	display: inline-block;	
	width: 100%;

}

.fzdetailserienausstattung ul:before {
	content: '\f061';
	font-family: FontAwesome;
	padding-right: 7px;
	font-size: 14px;
	color: #5f6368;
	padding-top: 2px;
}

.fzdetailserienausstattung ul li {
	display: flex;
	width: 100%; margin: 0;
	padding-left: 20px;
	padding-bottom: 2px;
	box-sizing: border-box;
	flex-grow: 1;
	line-height: 1.5
}


.fzdetailserienausstattung ul li:before {
	content: '–';
	padding-right: 7px;
	font-size: 14px;
	color: #5f6368
}

.fzdetailserienausstattung p {
	color: #5f6368;
	padding-top: 10px;
	margin-top: 1em;
}


.fzdetailservice h2 {
	display:flex;
	width: 450px;
	margin: 0;
	margin-top: -8px;
	line-height: 1.5
}

.fzdetailservicewrapper {
	flex-wrap: wrap;
	display: flex;
	width: 100%; 
	box-sizing: border-box; 
}

.fzdetailservicewrapper div {
	margin-bottom: 30px;
	width: 50%;
	padding-right: 8em; 
	line-height: 1.5;
	box-sizing: border-box
}

.fzdetailservicewrapper div span:before {
	content: "\f00c";
	font-family: FontAwesome;
	color: #0055A0; 
	padding-right: 7px; 
	font-size: 14px;
	padding-bottom: 7px; 
	display: inline-block
}

.fzdetailansprechpartner {
	flex-direction: row;
	display: flex; 
	flex-wrap: nowrap; 
	align-content: flex-start; 
	justify-content: flex-start;
	width: 100%;
}

.fzdetailansprechpartnerwrapper {
	flex-wrap: nowrap;
	display: flex; 
	width: 35%;
	box-sizing: border-box;
}

.fzdetailansprechparterndetail {
	display: flex;
	align-items: flex-end;
	font-size: 1em;
	width: 100%;
}

.fzdetailansprechparternname {
	display: flex;
	flex-wrap: wrap;
	align-content: flex-end;
	justify-content: flex-start;
	width: 55%;
	box-sizing: border-box;
}

.fzdetailansprechparternname h3 {
	margin-top: 1.5em;
	margin-bottom: 0.3em;
	width: 100%;
}

.fzdetailansprechpartnerwrapper img {
	display: inline-block;
	display: flex;
	margin-right: 20px;
	overflow: hidden;
}
.funktion {
	line-height: 1.5;
	margin-bottom: 1em;
	color: #5f6368;
	width: 100%;
}

.telefon {
	font-size: 1em;
	margin-bottom: 0.5em;
	color: #5f6368;
	width: 100%;
}

.telefon:before {
	content: '\f87b';
	font-family: FontAwesome;
	display: inline-block;
	width: 23px;
	color: #8d8d8d;
}

.teammemberdetail {
	width: 100%;
}

.teamkontakt {
}

.teamkontakt a:first-child:before {
	content: '\f199';
	font-family: FontAwesome;
	display: inline-block;
	width: 23px;
	color: #8d8d8d;
}

.teamkontakt a {
	margin-right: 10px;
	font-size: 1em
}

#ButToCarQue {
	margin-top: 4em;
    margin-bottom: 2em;
}

.mehrAnzeigen {
	color: #0055A0;
	margin-top: 1em
}

.mehrAnzeigen:before {
	content: '\f063';
	font-family: FontAwesome;
	display: inline-block;
	width: 23px;
}

.mehrAnzeigen:after {
	content: "mehr anzeigen"
}

.mehrAnzeigen:hover {
	text-decoration: underline;
	text-decoration-color: #d31126;
	text-decoration-thickness: 2px;
	text-underline-offset: 5px;	
}

.mehranzeigenbox {
	display: none;
}

.mehranzeigenbox:checked ~ .mehrAnzeigenSerienausstattung {
	height: auto;
}

.mehranzeigenbox:checked ~ label:after {
	content: "weniger anzeigen"
}

.mehranzeigenbox:checked ~ .mehrAnzeigen:before {
	content: '\f062';
}

.neuwagenbestseller {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	justify-content: flex-start;
}

.neuwagenbestseller a {
	width: calc(100% / 4);
	box-sizing: border-box;
	padding: 25px;
	margin-bottom: 0.5em;
}

    
.newsmain {
    margin-top: 2em !important
    }

.newshauptbild {
    margin: auto;
}

.newsdatum {
    font-size: 1em;
    width: 100%;
    color: #5f6368;
}

.newsartikel h1 {
    width: 100%;
    margin-top: 0.5em;
    margin-bottom: 0;
    text-align: left;
}

.newsartikel h2 {
    width: 100%;
    margin-top: 0;
    margin-bottom: 2em;
}

.newseinleitung {
    font-weight: bold;
    width: 100%;
    margin-bottom: 2em;
    line-height: 1.5;
    border-left: 3px solid #0055A0;
    padding-left: 20px;
    font-size: 1.15em;
}

.newstext {
    width: 100%;
    line-height: 1.5;
    text-align: justify;
    margin-bottom: 0.5em;
}

.newstext:empty {
    display: none;
}

.newstext li {
	text-align: left;
}

.newsbild {
    padding-top: 3em;
    padding-bottom: 3em;
    margin-top: 2.5em;
    margin-bottom: 3em;
    max-width: 100%;
}

.newsbild:empty {
    display: none;
}

.newsbildtag {
    margin-bottom: 3em;
    border-left: 3px solid #0055A0;
    margin-left: 1em;
    margin-right: 25px;
    padding-left: 10px;
    margin-top: 0.5em;
    max-width: 970px;
}



/*  #Formular ================================================== */

.buttonsend {
	margin-top: 2.5em;
}

element:hover, element:active {
	-webkit-user-select: none;
	-webkit-touch-callout: none
}

.fortschritt {
	display: flex;
	justify-content: center;
	margin-bottom: 40px;
	justify-content:  space-between;
	width: 700px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
	margin-top: 1.5em;
}

.schritt {
	width: 90px;
	text-align: center;
	background-color: #FFF;
	border: 2px solid #0055A0;
	color: #000;
	padding: 0px 20px 6px 20px;
	font-size: 1em;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.schrittaktiv {
	background-color: #0055A0;
	color: #FFF;
}

.schritterledigt {
	background-color: rgba(0,85,160,0.42);
	color: #636363;
}

.nummer {
	font-size: 1.6em;
	font-weight: bold;
	padding-bottom: 5px;
	margin-top: 5px;
	width: 100%;
}

form {
	background-color: #edf2f8;
	width: 800px;
	padding-top: 2em;
    padding-bottom: 3em;
    padding-left: 8em;
    padding-right: 8em;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin-bottom: 3em;
}

form h1 {
    margin-top: 1em;
}

form h2 {
	width: 100%;
	margin-bottom: 0;
}

form p {
    text-align: justify;
}

form label {
	width: 100%;
	padding-bottom: 0px;
	padding-top: 12px;
}

.labelbold {
	font-weight: bold;
	margin-top: 1.5em;
}

form div {
	width: 100%;
}

form textarea {
	width: 80%;
	padding: 8px;
	height: 70px;
	box-sizing: border-box;
	margin-top: 10px;
    border-radius: 3px;
}

input, textarea {
	font-family: "myriad-pro", "sans-serif";
	font-weight: 400;
	font-size: 16px;
    border-radius: 3px;
    border: 1px solid #86868b;
}

form input[type="text"], form input[type="email"], form input[type="date"] {
	width: 80%;
	padding: 8px;
	margin-top: 10px;
	height: 32px;
	box-sizing: border-box
}

form select {
	width: 80%;
	padding-left: 8px;
	padding-top: 2px;
	padding-bottom: 2px;
	margin-top: 10px;
	height: 32px;
	box-sizing: border-box;    
    -moz-appearance: none;
  	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	background-color: #FFF;
	color: #000;
	margin-bottom: 10px;
	font-size: 16px;
	line-height: 1.7em;
	text-overflow: ellipsis;
	vertical-align: middle;
    background-image: url("/layout/arrow_down.png");
    background-position: 98% center; /*Positioning*/
    background-repeat: no-repeat; /*Prevent showing multiple background images*/
	background-size: 15px;
	align-self: flex-end;
	align-items: center;
	flex-grow: 0;
    border-radius: 3px;
    border: 1px solid #86868b;
}

form input[type="checkbox"] {
	display: inline-block;
	margin-right: 15px;
	margin-left: 0;
	width: 18px;
	height: 18px;
}

.tooltip [data-tip] {
	position:relative; 
	cursor:help; 
}

.tooltip [data-tip]:before {
	content:'';
	display:none; 
	border-top-color:transparent; 
	border-right-color:transparent;
	border-bottom-color:transparent;
	border-left-color:transparent;
	position:absolute;
	top:-7px;
	left:3px;
	z-index:8; 
	font-size:0; 
	line-height:0;
	width:0; 
	height:0; 
}
.tooltip [data-tip]:hover:before, .tooltip [data-tip]:hover:after {
	display:block;
}

.tip-above[data-tip]:after {
	top: -108px;
	left: -101px; 
	height: auto;
	width: 300px;
}

.tip-below[data-tip]:after {
	top: 22px; 
	left: -101px;
	height: auto;
	width: 210px;
}

.tip-below[data-tip]:before {
	border-top-color:transparent;
	border-right-color:transparent;
	border-bottom-color:transparent;
	border-left-color:transparent;
	top:13px;
	left:5px;
}

.icon-question-sign:before {
	content: "\f05a"; 
	font-family: FontAwesome;
	font-style: normal;
	color: #636363
}

.tooltip [data-tip]:after {
	display:none;
	content:attr(data-tip);
	position:absolute;
	top:-35px;
	left:-0px; 
	padding:5px 8px;
	background:#FEF1B6;
	color:#000;
	border-left: 3px solid #E1C542;
	z-index:9; font-size: .9em;
	line-height:18px;
	white-space:normal;
	word-wrap:normal; 
	text-align:center; 
	text-decoration:none;
}

.buttonweiter {
	margin-top: 2em;
}

.buttonweiter span:after {
	content: '\f061'; 
	font-family: FontAwesome;
	display: inline-block;
	padding-left: 8px;
}

.buttonzuruck {
	border: 1px solid #636363;
	margin-top: 2em;
	background-color: rgba(0,85,160,0.42);
	color: #636363;
}
.buttonzuruck span:before {
	content: '\f060'; 
	font-family: FontAwesome;
	display: inline-block;
	padding-right: 8px;
}

.buttonsend span:after {
	content: '\f1d8'; 
	font-family: FontAwesome; 
	display: inline-block;
	padding-left: 8px;
}

.probefahrtmodell-grid {
	background-color: #edf2f8;
	padding-top: 3em;
	padding-bottom: 6em;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.probefahrtmodell-grid a {
	background-color: #FFF;
	padding: 10px;
	margin: 10px;
	box-sizing: border-box;
	color: #000;
	font-weight: bold;
}

.probefahrtmodell-grid a:hover {
	box-shadow: 3px 4px 6px 0 rgba(0,0,0,.2);
	opacity: 0.8;
	color: #1967d2;
	transform: scale(1.05);
	transition: 0.3s;
}


.formelement {
	margin-bottom: 1.2em;
	box-sizing: border-box;
	position: relative;
}

.formelement input[type="radio"] {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	box-sizing: border-box;
	cursor: pointer;
	appareance: none;
	margin: 0;
	padding: 0;
    border-radius: 3px;
    border: 0;
}

.formelementlabel {
	display: flex;
	align-content: center;
	justify-content: center;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	background-color: #FFF;
	height: 100%;
	width: 100%;
	display: flex;
	cursor: pointer;
	border: 1px solid #d6d6d6;;
	outline: none;
	margin-top: 2px;
	margin-bottom: 2px;
}

.formelementlabel label {
	padding: 8px 0px;
	cursor: pointer;
	line-height: 1.3;
}

input[type="radio"]:hover + .formelementlabel {
    border: 1px solid #333;
}

input[type="radio"]:checked + .formelementlabel {
    border: 3px solid #0055A0;
	margin-top: 0px;
	margin-bottom: 0px;
}

input[type="radio"]:focus + .formelementlabel {
    border: 3px solid #0055A0;
	margin-top: 0px;
	margin-bottom: 0px;
}

.wettbewerbsfrage {
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}

.checkboxnutzungderdaten {
	width: 80%;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	margin-top: 1.5em
}

.checkboxnutzungderdaten label {
	margin-left: 0.5em;
	padding-top: 0;
	font-size: 16px;
}

.teilnahmebedingungen {
	font-size: 16px;
	color: rgba(142,142,142,1.00);
	margin-top: 1.5em;
}

.error {
	color: #d31126;
	padding-top: 5px;
}
	
#StartTime, #InpPhone {
	margin-bottom: 2.5em;
}	

#FbMessage:empty, #FbName:empty, #FbMail:empty, #FbPhone:empty, #FbMsgStep1:empty, #FbMsgStep2:empty, #FbMsgStep3:empty, #FbMsgStep4:empty, #FbMessage_Step1:empty, #FbMessage_Step2:empty,  #FbCarQuestMessage:empty, #FbCarQuestName:empty, #FbCarQuestMail:empty, #FbCarQuestPhone:empty, #FbCarDriveDate:empty, #FbCarDriveTime:empty, #FbCarDriveName:empty, #FbCarDrivePhone:empty, FbCarDriveMail:empty {
	display: none
}

#FbMessage, #FbName, #FbMail, #FbPhone, #FbMsgStep1, #FbMsgStep2, #FbMsgStep3, #FbMsgStep4, #FbMessage_Step1, #FbMessage_Step2, #FbCarQuestMessage, #FbCarQuestName, #FbCarQuestMail, #FbCarQuestPhone, #FbCarDriveDate, #FbCarDriveTime, #FbCarDriveName, #FbCarDrivePhone, FbCarDriveMail {
	background-color: #d31126;
    padding-top: 1em;
    padding-bottom: 1em;
    color: #FFF;
    padding-left: 0.7em;
	box-sizing: border-box;
    width: 80%;
}

/* MEILENSTEINE */
.image-grid-meilensteine {
	display: -ms-grid;
	display: grid;
	width: 80%;
	-ms-grid-columns: 3fr 1fr 3fr;
	grid-template-columns: 3fr 0.7fr 3fr;
	margin-bottom: 3em;	
	margin-left: 10%;
	margin-right: 10%;
}

.image-grid-meilensteine-1 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 1;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 1/4;
}

.image-grid-meilensteine-2 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 3;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 2/5;
}

.image-grid-meilensteine-3 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 8;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 5/8;
}

.image-grid-meilensteine-4 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 9;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 6/9;
}

.image-grid-meilensteine-5 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 14;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 9/12;
}

.image-grid-meilensteine-6 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 15;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 10/13;
}

.image-grid-meilensteine-7 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 20;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 13/16;
}

.image-grid-meilensteine-8 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 21;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 14/17;
}

.image-grid-meilensteine-9 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 26;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 17/20;
}

.image-grid-meilensteine-10 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 27;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 18/21;
}

.image-grid-meilensteine-11 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 32;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 21/24;
}

.image-grid-meilensteine-12 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 33;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 22/25;
}

.image-grid-meilensteine-13 {
    -ms-grid-column: 0;
    -ms-grid-column-span: 1;
    -ms-grid-row: 38;
    -ms-grid-row-span: 4;
    grid-column: 1/2;
    grid-row: 25/28;
}

.image-grid-meilensteine-14 {
    -ms-grid-column: 3;
    -ms-grid-column-span: 1;
    -ms-grid-row: 39;
    -ms-grid-row-span: 4;
    grid-column: 3/4;
    grid-row: 26/29;
}

.meilensteinetag {
	font-size: 0.9em;
    margin-top: 10px;
    margin-left: 2em;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 5px;
    border-left: 3px solid #0055A0;
    box-sizing: border-box;
	line-height: 1.5
}

.bildergallerie {
	width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    box-sizing: border-box;
    justify-content: space-between;
    align-items: center;
}

.bildergallerie a {
	width: 22%;
	margin-bottom: 2.5em;
}

.lageplan iframe {
    width: 100%;
    height: 400px;
    margin-top: 2.5em;
    margin-bottom: 2.5em;
    box-sizing: border-box;
}


/*  #ZWISCHENGRöSSE ================================================== */


@keyframes shake {
  0% {
    transform: translateY(-1%);
  }
  100% {
    transform: translateY(3%);
  }
}
@keyframes line {
  0% {
    stroke-dashoffset: 22;
  }
  25% {
    stroke-dashoffset: 22;
  }
  50% {
    stroke-dashoffset: 0;
  }
  51% {
    stroke-dashoffset: 0;
  }
  80% {
    stroke-dashoffset: -22;
  }
  100% {
    stroke-dashoffset: -22;
  }
}


 @media only screen and (min-width: 860px) and (max-width: 1165px) {
	 
	 .buttonsmall {
		 display: none;
	 }
}


 @media only screen and (max-width: 1028px) {
	 
	 
	 .swiffy-slider {
		 width: 100% !important;
	 }

	 .swiffy-slider.slider-indicators-outside {
		 margin-bottom: 0 !important;
		 padding-bottom: 0 !important;
	 }
	 
	 .fzdetailtiteldatawrapper {
		 width: 100%;
		 padding-left: 10px;
		 padding-right: 10px;
	 }
     
     .fzdetaildatenwrapper {
         width: 100%;
     }
     
     .fzdetailbildgross {
         width: 100%;
         margin-bottom: 0;
     }
     
     .fahrzeugbildweitere {
        width: 100%;
     }        
	 
	 .buttonsmall {
		 display: none;
	 }
	 
	 .fzdetailtopbuttons a {
		 display: none
	 }
	 
	 .fzdetailtopbuttons {
		 height: auto;
	 }
	 
	 .fzdetailhead {
		 margin-bottom: 0;
	 }
	 
	 .fzdetaildatenlabel {
		 width: 40%;
	 }
	 
	 .fzdetaildatenwert {
		 width: 40%;
	 }
	 
	 .fzdetailserienausstattungwrapper {
		 column-count: 1;
	 }
	 
	 .tagwrapper {
		 justify-content: flex-start;
	 }
	 
	 .fzdetailansprechpartnerwrapper {
		 width: 100%;
	 }
	 
	 .fzdetailservicewrapper div {
		 width: 100%;
		 padding-right: 0
	 }
	 

	 
}




/*  #ZWISCHENGRöSSE ================================================== */

 @media only screen and (min-width: 860px) and (max-width: 1028px) {
	 
	 .element12 {
		 width: 100%;
	 }
	 
	 .titelbildtext {
		 padding-left: 0;
	 }
	 
	 .titelbildtext h1 {
		 margin-top: 0;
	 }
	 
	 .titelbild {
		 top: -3em;
	 }
	 
	 h1 {
		 margin-top: 1em
	 }
    
     
}




/*  #Mobile (Portrait) ================================================== */
/* Note: Design for a max-width of 859px */

@media only screen and (max-width: 859px) {
	
	header {
	margin-bottom: 0.2em;
    padding-left: 0;
    padding-right: 0;
	}
    
    	
	.headernavigation {
	display: none;
	}

	.garagereichlinlogo {
	flex-grow: 1;
    padding-top: 0;
    margin-left: 10px;
	}
	
	.garagereichlinlogo a img {
	width: 170px;
	}
	
	h1 {
	font-size: 1.8em;
	margin-top: 0.5em;
    margin-bottom: 0.7em
	}
	
	h2 {
	}
	
	/*Navigationswrapper*/
	#navigationswrapper  {
	position: fixed; 
	display: none; 
	box-shadow: 0 0 50px 800px rgba(0, 0, 0, 0.4); 
	top: 0; 
	right: 0; 
	height: 100%; 
	width: 55vw; 
	z-index: 10; 
	font-size: 1em;
	min-width: 300px;
	}  
	
	.navigationswrapperclickanywhere {
	cursor: default; 
	position: fixed; 
	z-index: -1; 
	width: 100%; 
	height: 100%; 
	left: 0; 
	top: 0
	}
	
	.mobilemenubutton {
	margin-right: 10px;
	}
	
	.footernavi {
	display: none
	}
	
		
	.main {
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 1em;
	}
	
	.firstmainmargin {
	margin-top: 0;
	}
	
	.container {
	max-width: 767px;
	}
	
	.element12 {
	width: 100%;
	padding-right: 0;
	margin-bottom: 0em;
	}
	
	.element12small {
	width: 75%;
	margin-left: 0;
	margin-right: 0;
	padding: 0
	}
	
	.element12smallleft {
	width: 75%;
	justify-content: flex-start;
	margin-bottom: 1em;
	margin-left: 0;
	margin-right: 0;
	padding: 0
	}
	
	.element13 {
	width: 100%;
	}		
    
    .probefahrt {
    width: 100%;
    }
	
	.markenlogo-grid {
		margin-top: 0em;
	}
	
	.markenlogo {
	width: 50%;
	padding-right: 1em;
	padding-left: 1em;
	margin-bottom: 1.5em;
	margin-top: 1.5em;
	box-sizing: border-box;
	}
    
    .markenlogo-element {
    height: auto;
    }
    
    .markenlogo-mitbutton {
    padding-right: 1em;
	padding-left: 1em;
	margin-bottom: 1.5em;
	margin-top: 1.5em;
	box-sizing: border-box;
    }
	
	.kialogo {
	width: 145px;
	}

	.opellogo {
	width: 85px;
	}

	.lexuslogo {
	width: 115px;
	}

	.toyotalogo {
	width: 110px;
	}

	.firstmainmargin {
	padding-left: 0;
	padding-right: 0;
	}
	
	.hellblauerhintergrundsmall {
	padding-bottom: 0.5em;
	}

	.titelbild {
	position: relative;
	top: auto;
	}
	
	.titelbildclipping {
	clip-path: polygon(0% 0, 100% 0%, 100% 100%, 0% 100%);
	margin: 0;
	width: 100%
	}
	
	.titelbildlegende {
	display: none;
	}
	
	.titelbildtext {
	padding-left: 10px !important;
	padding-right: 10px;
	margin-bottom: 2em;	
    }
    
    .titelbildtext p {
    line-height: 1.2
    }
    
    .titelbildtext h1 {
    margin-top: 0.3em;
    margin-bottom: 0.35em;
    }
    
    .line-1 {
    margin-top: 0 !important;
    }
    
    .titelbildtext a {
    margin-top: 3px !important
    }
    
	
	.titelbildtext img {
	margin-left: auto;
	margin-right: auto;
	margin-top: 1em
	}
	
	.fahrzeuglistepic {
    width: 100%;
	}
	
	.quicklinkboxwrapper {
	margin-top: 4em;
	margin-bottom: 2em;
	}
	
	.quicklinkbox {
	width: 100%;
	}
	
	.centertext {
	width: 100%;
    padding: 0;
	margin-bottom: 2.5em;
	}
	
	.fahrzeuglistefilter {
	flex-direction: column;
	}
	
	.fahrzeuglistefilterspalte {
	width: 100%;
	margin-top: 0;
	margin-bottom: 1.5em;
	border-left: none;	
	min-width: none;
	max-width: none;
	padding-left: 0
	}	
	
	.fahrzeuglistefilterspalte span {
	height: 28px;
	}
	
	.fahrzeuglistefilterspalte span:hover {
	background-color: transparent;
	}
	
	.titelleistefahrzeugsuche {
	}	
	
    .fahrzeuglistepic img {
	align-self: center;
    }
    
    .titelleistefahrzeugsuche {
    margin-bottom: 0;
    }
    
	.titelleistefahrzeugsuche :nth-child(2) { order: 3; }
	.titelleistefahrzeugsuche :nth-child(3) { order: 2; }
	.titelleistefahrzeugsuche :nth-child(4) { order: 4; }
	
	#ButFilter { 
	}
	
    .filtertitelh2 {
    width: 100%;
    padding-left: 5px;
    }
    
	.linkfilterreset {
	text-align: right;
	padding-right: 0
	}

	.fahrzeugsortierung {
        max-width: 45%;
	}
	
	.linkfilterreset:before {
	padding-right: 6px;
	}
	
	.teammember {
		width: 100%;
		margin-bottom: 3em;
		flex-wrap: inherit;
	}
	
	.teammember h3 {
		margin-bottom: 0.25em;
	}
	
	.teammember img {
		padding-right: 25px;
	}
	
	.teammemberdetail {
		width: auto;
	}
	
	.neuwagenbestseller a {
	width: calc(100% / 2);
	box-sizing: border-box;
	padding: 25px;
	margin-bottom: 0.5em;
}

.bildergallerie a {
	width: 47%;
	margin-bottom: 1.5em;
}
    
.newsmain {
        margin-top: 0 !important;
}
    
.newsartikel h1 {
    margin-top: 0;    
}
    
.newsartikel h2 {
     margin-bottom: 1em
}
    
.newseinleitung {
     margin-bottom: 1em
}
    
.newsbild {
    padding-top: 4%;
    padding-bottom: 0;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
}
    
.image-grid-meilensteine {
    width: 100%;
    margin-left: 0;
    margin-right: 0;            
}
    
.meilensteinetag {
    margin-left: 0.5em
}
    
.textleft {
    width: 100%;
    margin-bottom: 1.5em;
}
    
.buttonmarkenuebersicht {
     display: none;
}    
    
.footercopyright {
     flex-wrap: wrap
    }
    
 .footerlogo {
     width: 100%;
     text-align: center;
}
	
	
/*  #Formular ================================================== */
	
	.fzdetailformulare {
		padding-left: 0;
		padding-right: 0
		
	}
	
	select, textarea {
	width: 100% !important
	}
	
	form select {
		padding-left: 6px;
        padding-top: 0;
        padding-bottom: 0;
	}

	form input[type="text"], form input[type="email"], form input[type="date"]  {
		width: 100%;
	}	
    
    .labelbold {
        margin-top: 0.5em;
    }

	form div {
		width: 100%;
	}

	form input[type="checkbox"] {
		margin-right: 8px;
	}

	.schritt {
		width: 60px; 
		margin-left: 10px;
		margin-right: 10px; 
		text-align: center;
		padding: 0px 10px 3px 10px;
		font-size: 1em;
		}

	.schritt span {
		display: none
		}

	.nummer {
		display: block !important
		}

	.schrittaktiv {
		color: #FFF;
		}

	.schritterledigt {
		}

	.fortschritt {
		width: 100%;
		}	

	form {
		width: 100%;
		padding: 1em 0.5em;
		box-sizing: border-box;
		}

	.tooltip [data-tip]:after {
		display:none; 
		content:attr(data-tip); 
		width: 100%;
		position: static;
		margin-top: 5px;
		}

	.checkboxnutzungderdaten {
		width: 100%;
		}

    #InpSort {
        display: none;
    }
    
	textarea, #StartTime, #InpPhone {
		margin-bottom: 2.5em;
		}	

	#FbMessage, #FbName, #FbMail, #FbPhone, #FbMsgStep1, #FbMsgStep2, #FbMsgStep3, #FbMsgStep4, #FbCarQuestMessage, #FbCarQuestName, #FbCarQuestMail, #FbCarQuestPhone, #FbCarDriveDate, #FbCarDriveTime, #FbCarDriveName, #FbCarDrivePhone, FbCarDriveMail {
		background-color: rgba(223, 8, 34, 1);
		padding-top: 1em;
		padding-bottom: 1em;
		color: #000;
		padding-left: 0.7em;
		border-left: #666 4px solid;
		margin-bottom: 0;
		box-sizing: border-box;
		position: fixed;
		top: 46px;
		left: 0;
		z-index: 999;
	}
    
    #BoxFormCarQuest {
        display: flex !important;
    }


	}