:root {
    --tuvblue:          #001fd2;
    --tuchtgreen:       #60ac30;
    --tuchtpurple:      #813E90;
    --tuvblue-hover:    #425cf4;
    --tuchtgreen-hover: #3b7913;
    --tuchtpurple-hover:#4d1858;
    --button:           #00ff96;
    --button-hover:     #4bc291;
    --text-color:       #292929; 
    --primary:          var(--tuvblue)!important;
    --bs-primary:       var(--tuvblue)!important;

    --squareList-height: 16px;
}

/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/inter-v20-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/inter-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

html, body {
     font-family: 'Inter';
    overflow-x:hidden;
}

header {
    box-shadow:0px 0px 10px rgba(0,0,0,.3);
    position: sticky;
    top:0;
    z-index: 1337;
}

.navbar-brand img {
    height:46px;
    width:auto;
}

.btn.btn-primary {
    background:var(--primary);
    border-color:var(--primary);
}
.btn.btn-primary:hover {
    background:var(--tuvblue-hover);
    border-color:var(--primary);
}
.btn.btn-primary:focus,
.btn.btn-primary:active {
    background:var(--button);
    border-color:var(--tuvblue-hover);
    color:var(--primary);
}

.btn.btn-purple {
    background:var(--tuchtpurple-hover);
    border-color:var(--tuchtpurple-hover);
}
.btn.btn-purple:hover {
    background:var(--tuchtpurple);
    border-color:var(--tuchtpurple);
}
.btn.btn-purple:focus,
.btn.btn-purple:active {
    background:var(--tuchtpurple-hover);
    border-color:var(--tuchtpurple-hover);
    color:var(--tuchtgreen);
}

.btn.btn-green {
    background:var(--tuchtgreen-hover);
    border-color:var(--tuchtgreen-hover);
}
.btn.btn-green:hover {
    background:var(--tuchtgreen);
    border-color:var(--tuchtgreen);
}
.btn.btn-green:focus,
.btn.btn-green:active {
    background:var(--tuchtgreen-hover);
    border-color:var(--tuchtgreen-hover);
    color:#fff;
}

#tuchtOpenTimes {
    position:relative;
    z-index: 1;
    top:-50%;
    margin-bottom: -40%;
} 

iframe {
    pointer-events:none;
}

@media (max-width:767px) {
    #tuchtOpenTimes {
        top:0;
        margin-bottom:0;
    }   
}

#tuchtOpenTimes {
    border-width:0px;
    border-radius: 0px;
    background:var(--tuvblue);
    color:#fff;
}
#targetContainer > .flex {
    border-bottom:1px solid var(--tuvblue-hover);
    display: flex;
    gap: 1rem;
    align-items: center;
}
#targetContainer > .flex p{
    font-weight:600;
    text-transform: uppercase;
}

#targetContainer > .flex p {
    padding-left:24px;
    position:relative;
}

#targetContainer > .flex p:before {
    content:"";
    width:var(--squareList-height);
    height:var(--squareList-height);
    border-radius:var(--squareList-height);
    position:absolute;
    left:0;
    top:calc(50% - (var(--squareList-height) / 2));
    background:var(--button);
}
#targetContainer > .flex p[class*="system-failure"]:before {
    background:#c00000;
}
#targetContainer > div[id*="opening-hours"] p{
    padding:0;
    margin:0;
}

#targetContainer > div[id*="opening-hours"] .flex-col[class*="flex-row"] {
    margin-bottom:1rem;
}

#targetContainer > div[id*="opening-hours"] .border-gray-600 {
    font-size:75%;
}

#targetContainer > div[id*="opening-hours"] .border-gray-600 p {
    margin:0!important;
    padding:0!important;
}

.plakette {
    z-index:0;
    position:absolute; 
    width:70%;
    height:auto;
    top:-90%;
    right:-15%;
}

@media (max-width:757px) {
    .plakette {
        top:-20%;
        width:33%;
        right:0;
    }
}

#tuchtOpenTimes .btn.btn-primary {
    background-color:var(--button);
    color:var(--tuvblue);
    border-color: var(--button);
}

#targetContainer > .flex p + div {
    background:var(--tuvblue-hover);
    font-weight:bold;
    margin-bottom:1rem;
    border-radius:1rem;
    padding:.125rem .25rem;
}

#tuchtOpenTimes .btn.btn-primary:hover {
    background-color:var(--button-hover);
    color:var(--tuvblue);
    border-color: var(--button-hover);
}

#tuchtOpenTimes .btn.btn-primary:active,
#tuchtOpenTimes .btn.btn-primary:focus {
    background-color:#fff;
    color:var(--button-hover);
    border-color: var(--button-hover);
}

#stageImgContainer {
    width:100%;
    height:50vh;
    overflow: hidden;
    object-fit: cover;
    position:relative;
}

#stageImgContainer > img {
    object-fit: cover;
    height:100%;
    width:100%;
}

.stageTxt {
    position:absolute;
    left:0;
    bottom:3rem;
    right:0;
}

.stageTxt h1 {
    background:var(--tuvblue);
    color:#fff;
    text-transform: uppercase;
    font-weight: 600;
    padding:0 .5rem;
    display:inline-block;
}

h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6 {
    color:var(--tuvblue);
    font-weight: 600;
}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,
.h1 a,.h2 a,.h3 a,.h4 a,.h5 a,.h6 a {
    text-decoration: none;
    color:var(--tuvblue);
}

h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover,
.h1 a:hover,.h2 a:hover,.h3 a:hover,.h4 a:hover,.h5 a:hover,.h6 a:hover {
    color:var(--tuvblue-hover);
}

a.inline-link {
    text-decoration: none;
    color:var(--tuvblue);
}

a.inline-link:hover {
    text-decoration: none;
    color:var(--tuvblue-hover);
}

.bg-tucht {
    background:url("../gfx/fahrzeugpruefung_tucht_hintergrund2.jpg") center center no-repeat;
    background-attachment: fixed;
    background-size:cover;
    padding-top:3rem!important;
    padding-bottom:3rem!important;
}

.stageTxt h2 {
    background:#fff;
    color:var(--tuvblue);
    padding:0 .5rem;
    display:inline-block;
}

ul.squarelist {
    list-style: none;
    padding-left:0;
}
ul.squarelist li {
    position:relative;
    padding-left:calc(var(--squareList-height) + .5rem);
    font-size:120%;
    padding-top:.25rem;
    padding-bottom:.25rem;
}
ul.squarelist li:before {
    content:"";
    width:var(--squareList-height);
    height:var(--squareList-height);
    position:absolute;
    left:0;
    top:calc(50% - (var(--squareList-height) / 2));
    background:var(--tuvblue);
}

.card {
    border-width:0px;
    border-color:transparent;
    border-radius:0px;
}

.btn {
    border-radius:0px!important;
}

.osmEmbed iframe {
    height:70vh!important;
    border-width:0px!important;
}
.smallerText {
    padding-top:6rem; 
}
.smallerText,
.smallerText h1,
.smallerText h2,
.smallerText h3,
.smallerText h4,
.smallerText h5,
.smallerText h6 {
    font-size:1rem;
}

footer {
    background:var(--tuchtgreen-hover);
    padding-top:3rem;
    padding-bottom: 3rem;
}

footer h5 {
    color:#fff;
}

footer p, footer a {
    color:#fff;
}

footer a {
    text-decoration: none;
}

footer a:hover {
    color:#ebebeb;
}

.footerlogo {
    filter:saturate(0) invert(1) contrast(0) brightness(200);
    margin-bottom: 3rem;
}

.lText h3 {
    margin:0!important;
    align-content:start;
    align-items:start;
    display:flex;
    height:0px;
    position:relative;
}

.lText h3 a {
    position:absolute;
    bottom:1rem;
    text-transform: uppercase;
    font-size:1.15rem;
    color:#fff;
    background:var(--tuvblue);
    padding:0 .25rem 0 1.75rem!important;
    margin:0 0 1rem -1.75rem;
    display:inline-block;
}

.lText.purple h3 a {
    background:var(--tuchtpurple-hover);
}

.lText.green h3 a {
    background:var(--tuchtgreen-hover);
}

.lText.purple h3 a {
    background:var(--tuchtpurple-hover);
}

.lTeaser {
    background:transparent;
}
.lTeaser > .card-body.row {
    padding:0 0 1rem 0!important;
    overflow: hidden;
    width:calc(100% - .5rem);
    margin:auto;
    background:#fff;
}

.lTeaser > .card-body.row > .col-12.lImg {
    padding:0!important;
}