/* inter-regular - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/inter-v12-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/inter-v12-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/inter-v12-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/inter-v12-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/inter-v12-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/inter-v12-latin-regular.svg#Inter') format('svg'); /* Legacy iOS */
}
/* inter-700 - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/inter-v12-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/inter-v12-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/inter-v12-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/inter-v12-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/inter-v12-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/inter-v12-latin-700.svg#Inter') format('svg'); /* Legacy iOS */
}
body {
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    color:#6F6F6F;
}
p{line-height:1.5rem}

:root {
 --blue: #45CBE7;
  --orange: #FF881A;
 --grey:   #E9E9E9;
}
.bg-dark {
    background-color: var(--blue) !important;
}

h1,
h2,
h3 {
    font-family: nove, sans-serif;
    font-weight: 400;
    font-style: normal;
    color: var(--blue);
}

h1, h2{font-size:2.8rem}
h3, .h3{font-size:1.68rem}

a {
    color: var(  --blue);
    text-decoration: none;
}

a:hover{ color:#6F6F6F;}

.custom-tooltip {
  --bs-tooltip-bg: var(--grey);
     --bs-tooltip-color:#222;
}

h2.stoererbutton span{    background: var(--orange);
    color: white;
    font-size: 1.1rem;
    padding: 0.7rem 1.4rem;
    border-radius: 0.5rem;
    height: fit-content;
    margin-left: 1.4rem;}
h2.stoererbutton{display:flex;}

button.stoerer{pointer-events: none ; background: var(--blue);
    color: white;
    font-size: 1.1rem;
    padding: 0.7rem 1.4rem 0.5rem 1.4rem;
    border-radius: 0.5rem;  
line-height:1.3;
}

img.headerimage{
    max-width: unset;
    width: 100%;
}
#topvideo {
    margin: 0 auto;
    margin-bottom: -8px;
    max-height: calc(100vh - 82px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.headervideo{
    max-width: unset;
    width: 100%;
    height:auto;
}

#contact{margin-top:5rem}
.supdetail.item>h3>span{font-size:1rem; font-family: 'Inter';margin-left:0.5rem}
footer {
    background: var(--blue);
    color: #fff;
}

footer a {
    display: block;
    color: #fff;
    text-decoration: none
}

footer iframe {
    width: 100%
}

button{ font-family: nove, sans-serif;border:0}
.supselect {margin-bottom: 11.5rem;}

.supdetail {
    max-width: 400px;
     max-width: 72vw;
}
.supimg {position:relative; width:100%;padding-top:125%}
.owl-carousel .owl-item .supimg img {
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
    ;
    position: absolute;
    top: 0;
    height: 93%;
    width: auto;
}
.supimg:after{content: "";
    display: block;
    background: var(--blue);
    width: 100%;
    padding-top: 98%;
    border-radius: 25px;
    position: absolute;
    top: 20%;
    z-index: -1;}
.supdetail h3{margin-top:1rem}
.supdetail p{height:145px;overflow:scroll;margin-bottom:1.5rem;position:relative;padding-right:8px;}

.supdetail p.scrolltext:before {
   content: "▾";
    width: 100%;
    /* float: right; */
    height: 1rem;
    position: fixed;
    margin-top: 140px;
    /* display: block; */
    text-align: right;
    font-size: 1rem;
    color: #6F6F6F;
}

.suptime button {
    width: 40px;
    height: 40px;
   
    line-height: 0px;
    text-align: center;
    font-size: 1rem;
    border: 0;
}

.suptime button:hover {
    opacity: 0.7
}

.suptime button.selected {
    background: var(--blue);
    color: #fff
}

.addons {
    position: relative;
    background: #E9E9E9;
    border-radius: 20px;
    font-family: nove, sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-top: 0.5rem;
    background-image:url(../images/drop_down.svg);
    background-position:top right;
    background-repeat:no-repeat;
}
.addons.active{   border-radius: 20px 20px 0 0;
 background-image:url(../images/drop_down_close.svg);}
.addswitch {
   line-height: 40px;
    width: 100%;
    text-align: left;
    height: 40px;
    padding: 0 1rem;
    border: 0;
    background: transparent;
}

.addselect {
    list-style-type: none;
    margin: 0;
    padding: 0;
    height: 0;
    overflow: hidden;
    position: absolute;
    background: #E9E9E9;
    border-radius: 0 0 20px 20px;
}

.addons.active .addselect {
   margin-top: 0rem;
    height: auto;
    padding-top: 1rem;
    width: 100%;
    padding:0.5rem  1rem 1rem 1rem;
}

.addselect li.add {
    line-height: 2.1rem;
    cursor: pointer;
    list-style: none;
}

.addselect li.add:after{content:"+"; color: var(--blue);
    font-family: monospace;
    font-weight: 200;
    font-size: 1.8rem;
    width: 5%;
    text-align: center;
    position: absolute;
}
.addselect li.add.selected:after{content:"-";}

li.add span:first-child {
    width: 70%;
    display: inline-flex;
}
li.add span:nth-child(2){
    width: 25%;
    display: inline-flex;
}


  li.add span:nth-child(3) {
    width: 100%;
    display: inline-flex;
    position: absolute;
    left: 1rem;
    margin-top: 1rem;
    font-size: 0.57rem;
}

.addselect li.add.selected {
    color: var(--blue)
}
button:hover,.addselect li.add:hover{opacity:0.7; transition:opacity 0.15s}
.summary{
    margin-top:1.5rem;
    display: flex;
    justify-content: space-between;}

.summary button{height:40px;border-radius:20px;line-height:20px;padding:0 3rem;color:#fff;background:var(--blue)}

.theselected button {height: 40px;
    border-radius: 20px;
    line-height: 20px;
    padding: 0 1rem;
    width: 100%;
    text-align: left;
    margin-top: 0.5rem;
    color: #fff;
    background: var(--blue);
  background-image:url(../images/minus.svg);
    background-position:top right;
    background-repeat:no-repeat;
}

.owl-stage>.owl-item:nth-child(odd) h3 {color:var(--blue)}
.owl-stage>.owl-item:nth-child(even) h3 {color:var(--orange)}

.owl-stage>.owl-item:nth-child(odd) .suptime button.selected {background: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .suptime button.selected {background: var(--orange);}

.owl-stage>.owl-item:nth-child(odd) .summary button {background: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .summary button {background: var(--orange);}

.owl-stage>.owl-item:nth-child(odd) .addons {background-image:url(../images/drop_down.svg);}
.owl-stage>.owl-item:nth-child(even) .addons {background-image:url(../images/drop_down_even.svg);}
.owl-stage>.owl-item:nth-child(odd) .addons.active{background-image:url(../images/drop_down_close.svg);}
.owl-stage>.owl-item:nth-child(even) .addons.active{background-image:url(../images/drop_down_close_even.svg);}

.owl-stage>.owl-item:nth-child(odd) .addselect li.add:after{color: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .addselect li.add:after{color: var(--orange);}

.owl-stage>.owl-item:nth-child(odd) .addselect li.add.selected { color: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .addselect li.add.selected { color: var(--orange);}

.owl-stage>.owl-item:nth-child(odd) .theselected button {background-color: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .theselected button {background-color: var(--orange);}

.owl-stage>.owl-item:nth-child(odd) .supdetail p.scrolltext:before{ color: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .supdetail p.scrolltext:before{ color: var(--orange);}


.owl-stage>.owl-item:nth-child(odd) .supimg:after{background: var(--blue);}
.owl-stage>.owl-item:nth-child(even) .supimg:after{background: var(--orange);}

.iconnav img{width:25px;filter: invert(1);}
.nav-link{ font-family: nove, sans-serif;}
.navbar-toggler{border:0}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none;
}
.navbar-dark .navbar-toggler {
    color: rgba(255,255,255,1);
}
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.9);
}

.nav-link-modal img{width:44px;filter:invert(50%) sepia(100%) saturate(3.5) hue-rotate(343deg);transition:all .2s ease;
}

.contactlinks{display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin: 1.5rem 0;}

a.nav-link-modal:hover img{transform:scale(1.2);transition:all .2s ease}

.modal-dialog {
    max-width: 450px;
    margin: 1.75rem auto;
}


#datenschutzModal .modal-dialog, #agbModal .modal-dialog  {
    width:90vw;
    max-width: 1000px;
    margin: 1.75rem auto;
}
.modal-content{  background:#E9E9E9;}

.modal-header{    z-index: 5;}
.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
    margin: 0 auto;
    margin-top: -3rem;
    width: 95%;
}

.modal-body  ol{
    padding-left: 1rem;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background:  var(--blue);;
}

.owl-theme .owl-dots .owl-dot span {
    width: 22px;
    height: 5px;
    margin: 5px 5px;
    background: #D6D6D6;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 0;
}

#rental {max-width:1900px}

.owl-carousel .owl-nav button.owl-prev,.owl-carousel .owl-nav button.owl-prev:hover{width:103px;height:103px;
    background:transparent;
    background-image:url(../images/backward.svg);margin-left:-28px}
.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-next:hover{width:103px;height:103px;
    background:transparent;
    background-image:url(../images/forward.svg);margin-right:-28px}

.owl-carousel .owl-nav button span{display:none}
.owl-theme .owl-nav {
    position: absolute;
    top: 26%;
    width: 100%;
    /* margin: 0 -30px 0 -30px; */
    /* width: 100%; */
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

@media (max-width: 767px){
    .onlydesktop{display:none}
}

@media (min-width: 768px) {
    .onlymobile{display:none}
}


@media only screen and (max-width: 576px) {
    .owl-carousel .owl-nav{display:none;} 
    .modal-dialog {
    max-width: 325px;
}
    h1, h2{font-size:2.2rem}
}

@media only screen and (max-width: 991px) {
    .navbar-nav.iconnav {
    flex-direction: row;
    }
    .navbar-nav.iconnav .nav-link{padding-right:1rem;}
}