/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
  color: #005798;
  font-weight: bold;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px; /* Vertically center the text there */
}

/*------ EVC mods: */
@media (min-width: 992px) { .dropdown:hover .dropdown-menu { display: block; } }
.nav-item > a:hover { background-color: #92C5F4; }
.dropdown-menu > a:hover { background-color: #92C5F4; }
.list-group > a:hover { background-color: #92C5F4; }

.rp-3x { padding-left: 0.4rem!important; padding-right: 0.4rem!important; }
@media (min-width: 400px) { .rp-3x { padding-left: 0.5rem!important; padding-right: 0.5rem!important; } }
@media (min-width: 800px) { .rp-3x { padding-left: 0.7rem!important; padding-right: 0.7rem!important; } }
@media (min-width: 1200px) { .rp-3x { padding-left: 1rem!important; padding-right: 1rem!important; } }

.rw { width:70px; }
@media (min-width: 700px) { .rw { width:141px; } }

.rwcs { width:50%; }
@media (min-width: 700px) { .rwcs { width:100%; } }



/*.tabelle1     { background-color: rgb(219,233,255); border:1px solid #96C8FF }
.tabelle1 td  { border:1px solid #96C8FF }
.tabelle1 th  { border:1px solid #96C8FF; text-align:left; font-size:13px; font-family: "Open Sans",sans-serif; }
.tabelle1 table { border:0px }
.tabelle1 table td { border:0px }*/

.tabelle2     { background-color: rgb(255,255,255); }

a.nl:link, a.nl:visited, a.nl:active, a.nl:hover {color:#0000FF;cursor:help;}


.hoverrow th {
    background-color: rgb(219,233,255);
}
.hoverrow tr:hover {
    background-color: #ccc;
}
.hoverrow td:hover {
    background-color: none;
    cursor: pointer;
}

.floatingHeader /*sticky table headers*/
{
position: fixed;
top: 0;
visibility: hidden;
}

.rot90
{
    transition: transform 300ms;
    transform-origin: 27% 42%;
    transform: rotate(-90deg);
}

.buybutton
{ cursor: pointer; }

.sortbutton
{ cursor: pointer; color:black; font-weight:bold; }

.custom-tab.active {
    background: transparent !important;
    color: black !important;
    border-bottom: 3px solid rgb(4, 79, 102) !important;
    border-radius: 0px !important;
}

.font-weight-normal
{
font-weight: normal;
}

li [class^="icon-"],li [class*=" icon-"]{width:1em}

@media ((min-width: 576px) and (max-width: 768px)) { .nav-link { padding-right: 0.5rem; padding-left: 0.5rem; } }
@media (max-width: 576px) { .nav-link { padding-right: 0.2rem; padding-left: 0.2rem; } }

/* Mehr Kontrast für Primary Buttons */
.btn-primary, .btn.btn-primary, .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary:active, .btn.btn-outline-primary:hover, .btn.btn-outline-primary:focus, .btn.btn-outline-primary:active { background-color:#005798; color:white; border-color:#005798; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary:active { background-color:#00457b; border-color:#00457b; }
.btn-outline-primary, .btn.btn-outline-primary { color:#005798; border-color:#005798; }

footer a, footer h2 { color:#444 }

/* Accesibilty: */
:focus-visible {
  outline: 3px solid #007acc;
  outline-offset: 3px;
}

.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #000;
  color: #fff;
  padding: 8px 16px;
  z-index: 1000;
  text-decoration: none;
}

.skip-link:focus {
  top: 0;
}

.circle-background {
  display: inline-block;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  background-color: #000;
  padding:1vw;
  aspect-ratio: 1 / 1; 
}

.circle-background img {
  object-fit: cover;
}

.rounded-1 { border-radius: 10px; }
.rounded-2 { border-radius: 20px; }
.rounded-3 { border-radius: 30px; }
.shadow2 { box-shadow: 0.5rem 0.5rem 2rem rgba(0, 0, 0, .7) !important; }
.rounded2 { border-radius: 1rem !important; }    
.zoomfx, .zoomfx2 { transition: transform 0.2s ease-in-out; }      
.zoomfx:hover { transform: scale(1.02); transition: all 0.4s ease-in-out; }
.zoomfx2:hover { transform: scale(1.10); transition: all 0.4s ease-in-out; }

.col {padding-left:0}

.bb1 { border:1px solid black }

table.tabelle1 {
  width: 95%;
  border-collapse: collapse;
  font-family: "Segoe UI", system-ui, sans-serif;
  background: #DBE9FF;
  border-radius: 15px;
  overflow:hidden; 
  margin:0.3em;
  margin-bottom:0.7em;
  box-shadow: 0.1rem 0.1rem 0.7rem rgba(0, 0, 0, .3) !important;
}

.tabelle1 th,
.tabelle1 td {
  padding: 7px 9px;
  text-align: left;
  border: 1px solid #c8d9ff;
}

.tabelle1 table td { border:0; }

.tabelle1 th {
  background-color: #BFD4FF;
  color: #1a1a1a;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

.tabelle1 tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.6);
}

.tabelle1 tr:hover {
  background-color: #C7DBFF;
  transform: scale(1.01);
  transition: all 0.4s ease-in-out;
}

.tabelle1 caption {
  caption-side: top;
  font-size: 1.2rem;
  font-weight: 700;
  color: #1a1a1a;
  padding: 10px;
  text-align: left;
}

.tabelle1NoTransform tr:hover {
  transform: none;
  transition: none;
}






.animleft { animation:fill 35s ease infinite;  will-change:height, padding-left; }
.animleft2 { animation:fill2 35s ease infinite; will-change:transform, height, padding-left; }
.animleft3 { animation:fill3 35s ease infinite; will-change:transform, height, padding-left; }
.animright2 { animation:fill2r 35s ease infinite; will-change:transform, height, padding-left; }
.animright3 { animation:fill3r 35s ease infinite; will-change:transform, height, padding-left; }
.animFlat { animation:fillFlat 35s ease infinite; will-change:transform, height, padding-left; }

@keyframes fill {
  0% { padding-left:100px; height:440px; } 
  50% { padding-left:0; height:400px; }
  100% { padding-left:100px; height:440px; }
}

@keyframes fill2 {
  0% { transform:perspective(75em) rotateY(18deg) scale(1,1); } 
  50% { transform:perspective(75em) rotateY(38deg) scale(1.5,1.5); }  
  100% { transform:perspective(75em) rotateY(18deg) scale(1,1); }
}

@keyframes fill2r {
  0% { transform:perspective(75em) rotateY(-18deg) scale(1,1); } 
  50% { transform:perspective(75em) rotateY(-38deg) scale(1.5,1.5); }  
  100% { transform:perspective(75em) rotateY(-18deg) scale(1,1); }
}

@keyframes fill3 {
  0% { transform:perspective(75em) rotateY(8deg) scale(1,1); } 
  50% { transform:perspective(75em) rotateY(18deg) scale(1.5,1.5); }  
  100% { transform:perspective(75em) rotateY(8deg) scale(1,1); }
}

@keyframes fill3r {
  0% { transform:perspective(75em) rotateY(-8deg) scale(1,1); } 
  50% { transform:perspective(75em) rotateY(-18deg) scale(1.5,1.5); }  
  100% { transform:perspective(75em) rotateY(-8deg) scale(1,1); }
}

@keyframes fillFlat {
  0% { transform:scale(1,1); } 
  50% { transform:scale(1.5,1.5); }  
  100% { transform:scale(1,1); }
}

.reflection {
   width:200%;
   height:200%;
   animation: reflection-animation 35s ease infinite alternate;
   background:-webkit-gradient(linear,0% 100%,100% 0%,color-stop(0.5,rgba(255,255,255,.2)),color-stop(0.51,rgba(255,255,255,.1)),color-stop(.7,rgba(255,255,255,0)),color-stop(0.8,rgba(255,255,255,0)));
}
@keyframes reflection-animation {
    0% { transform: translateX(-15%); }
    50% { transform: translateX(-70%); }
    100% { transform: translateX(-20%); }
}

.reflection2 {
   width:200%;
   height:200%;
   animation: reflection2-animation 35s ease infinite alternate;
   background:-webkit-gradient(linear,0% 100%,100% 0%,color-stop(0.6,rgba(255,255,255,.2)),color-stop(0.61,rgba(255,255,255,.1)),color-stop(.8,rgba(255,255,255,0)),color-stop(0.9,rgba(255,255,255,0)));
}
@keyframes reflection2-animation {
    0% { transform: translateX(0%); }
    50% { transform: translateX(-170%); }
    100% { transform: translateX(-0%); }
}


.rfs1 { font-size: calc(0.3rem + 1.6vw); }
@media (min-width: 1200px) { .rfs1 { font-size: 1.5rem; } }

.rcah400 { height:clamp(300px, calc(11.11vw + 266.67px), 400px); }
.rcah600 { height:clamp(300px, calc(33.33vw + 200px), 600px); }
.rcah800 { height:clamp(300px, calc(55.56vw + 133.33px), 800px); }
.rcah400mt { margin-top:clamp(-400px, calc(-11.11vw - 266.67px), -300px);}
.rcah600mt { margin-top:clamp(-600px, calc(-33.33vw - 200px), -300px);}
.rcah800mt { margin-top:clamp(-800px, calc(-55.56vw - 133.33px), -300px);}

.carousel-indicators .active
{
  border-top:0;
  border-bottom:0;
  margin-top:10px;
  animation: prg 6s linear;
  animation-fill-mode:both;
  will-change: width, border-left;
}

@keyframes prg {
  0% { width: 31px; border-left:0px solid #fff8; } 
  80% { width: 0px; border-left:31px solid #fff8; } 
  85% { width: 0px; border-left:31px solid #fff8; }
  100% { width: 0px; border-left:31px solid #fff8; }
}

.carousel-item h1 { font-size:clamp(0.6rem, calc(0.6rem + 2vw), 3rem); }
.carousel-item h2 { font-size:clamp(0.5rem, calc(0.4rem + 1.8vw), 2rem); }
.carousel-item h3 { font-size:clamp(0.4rem, calc(0.3rem + 1.6vw), 1.4rem); }

.card { overflow:hidden; }
.card.shine-once::after
{
  content: "";
  position: absolute;
  top: -30%;
  left: -120%;
  width: 60%;
  height: 160%;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, #fff0, #fff4 50%, #fff0);
  animation: cardShine 1.2s ease-out 1;
  pointer-events: none;
}
@keyframes cardShine
{
  from { left: -120%; }
  to { left: 140%; }
}

.blueprice { color:blue }