* {box-sizing: border-box;}
/*a {cursor: pointer}*/
#logo-container.header-h,#bkgrdtopmenu.header-h,#m2topmenu.mtopmen {height: 55px; max-height: 55px;}
#bkgrdtopmenu.header-h {background-color: #f00;}
body {margin-top: 0; margin-left: auto; margin-right: auto; position: relative; z-index: 0; overflow: hidden; /*max-width: 1680px*/; font-family: 'Barlow', sans-serif; font-weight: 400; font-size: 16px; /*font-size:1.1vw*/; letter-spacing: 0.07vw;}
#logo-container.header-h,#logo-main.pic-c {max-width: 177px; width: 177px;}
#logo-container.header-h {z-index: 0; float: left; margin: 0px}
#logo-main.pic-c {max-width: 100%; overflow: hidden;}
#square-container.logo-sq {z-index: 0; float: left; margin-left: 20px; width: 80px; height: 52px; padding: 12px 20px 0px 20px;}
#square-container.logo-sq,#square.pic-c {min-width: 30px; width: 30px;}
#square.pic-c {max-width: 100%; overflow: hidden}
#fb-container.logo-fb {z-index: 0; float: right; margin-left: 15px; width: 40px; padding: 14px 0px 0px 0px}
#facebook-icon.pic-c {width: 25px; max-width: 100%; overflow: hidden}
#menu-container.m-container {text-align: left; z-index: 15; float: right; margin-right:2%}
ul.topnav {list-style-type: none; margin: 0; padding: 0; overflow: hidden; line-height: 1; /*height:55px*/}
ul.topnav li {float: left;}
ul.topnav li a {display: inline-block;}
ul.topnav li a,.dropdown .dropbtn {color: white; text-shadow: 0.035em 0.035em 1px rgba(0, 0, 0, 0.75); text-align: center; padding: 17.5px 12px; transition: 0.03s; text-decoration: none;}
ul.topnav li a:hover:not(.active) {background-color: #555; min-height: 55px}
ul.topnav li a.active,ul.topnav li.active {background-color: #0a43fc; min-height: 55px}
ul.topnav li a.hreficon:hover:not(.active) {background-color: rgba(0, 0, 255, 0);}
ul.topnav li a.minus-margin {margin-left: -10px}
ul.topnav li.icon {display: none;}
ul.topnav li.noshow {display: none;}
ul.topnav.responsive li a.hreficon:hover:not(.active) {background-color: #555;}
.updateDate {color: black; text-decoration: none}
.myp {margin-top: 0px; margin-bottom: 0px}
.fa {padding-left: 8px;}
#page-container {margin-left: auto; margin-right: auto; position: relative; z-index: 0; overflow: hidden; background-color: white;}
.fade2 {-webkit-animation-name: fade2; -webkit-animation-duration: 2.9s; animation-name: fade2; animation-duration: 2.9s;}
.fade1 {-webkit-animation-name: fade1; -webkit-animation-duration: 1.9s; animation-name: fade1; animation-duration: 1.9s;}
.slideshow-main-container {width: 100%; position: relative; }


#slides {
    position: relative;
    display: inline-block;
    width: 60%;
    float:left
}

#slidescontainer section {
    margin: 0 3%;
    width: 44%;
    float: left;
}

#slidescontainer section div {
    color:blue; line-height: 1.7
}

.circle1-o,.sloganmainimg-1,.sloganmainimg-2,.sloganmainimg-3 {position: absolute; z-index: 99}
.circle1-o {
    left: 3%;
    height: 170px;
    width: 170px;
    top: 15px;
    border-radius: 50%;
    box-shadow: 5px 8px 9px rgba(0, 0, 0, 0.6);
}
.circle1-i {color: rgb(85, 85, 85); padding: 38px 0px 0px 0px; margin: 4px; font-weight: bold; line-height: 1.5; position: relative; text-align: center; letter-spacing: 0.09em; height: 170px; width: 170px; border-radius: 50%;}

/*-------- For Slideshow  ------*/

/* Slideshow container */

.slideshow-container {position: relative; margin-top: 0px;/*padding: 0.6vw 0*/; background: radial-gradient(circle, #e5fbff 15.13%, #a7effb 79.83%); display:inline-block; width: 100%}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {color: darkslategray; font-size: 0.75em; padding: 8px 12px; position: absolute; top: 0; z-index:9}


/* The dots/bullets/indicators */

/*.dot {cursor: pointer; height: 15px; width: 15px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease;}
.dot:hover {background-color: #515151;}
*/

.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

#ShowMainDetails {
  position: relative;
}

#ShowMainDetailsnew {
    position: relative;
    display: inline-block;
}

#slides section {position:relative; }

#slides #slimg1 {float: left; width: 60%; margin: 1.2vw 0}
/*#slides #slimg1:hover {width: 100%;}*/
/*#slides #slimg1:hover ~ #slidetext {display: none;}*/

#slides #slidetext {float: left; width: 36%; margin: 6% 0 1.2vw 0}

#slides section a {color: blue; text-decoration: none}

#slidetext table td {padding: 0.7vw; font-size:0.9em; letter-spacing: 0.1vw}

#ShowMainDetails img:nth-of-type(1) {
    position: relative;
    display: block
}
#ShowMainDetails img:nth-of-type(2) {
    display: block
}

#ShowMainDetails img {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}
    
#ShowMainDetails section:nth-of-type(1) {
    position: absolute;
    display: block
}

#ShowMainDetails section {
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

.slimginfo {
    position:relative; 
    display:block;
    text-align: center;
}

.slimgvp {top:0; right:15px; text-decoration: line-through; color:red!important;}
.slimgvpprom {top:15px; right:15px; font-weight: bold;}

.slimgvp, .slimgvpprom {position:absolute; }
.slimgvp, .slimgvpprom, .slimginfo {font-size: 1em}

#HeaderOffer, #infoBfTitle {font-size: 1.5em; margin: 10px 0}
#FooterOffer {font-size: 0.8em; text-align: right; margin-right: 1vw}

.slidemodel { max-height:100%}
.slidetext {color: #ffffff; font-size: 0.8em; padding: 8px 12px; position: absolute; bottom: 40px; width: 100%; text-align: center; font-weight: bold; z-index: 999;}
.slidehltextext {
color: #040404;
font-size: 1em;
padding: 5px;
position: absolute;
top: 12px;
width: 25%;
/* text-align: right; */
/* font-weight: bold; */
z-index: 999;
right: 1%;
line-height: 1.2}
#slidesdot {display: block}
#sidebar1-c.sidebar {margin-top: 0px; padding-top: 10px; margin-right: 7px; background-color: rgba(22,176,254, 1);}
#sidebar1-c.txtadr {line-height: 0.5; font-size: 0.875em; padding: 20px;}
#sidebar2-c.sidebar {margin-right: 7px;}
#sidebarfix-c {z-index: 10; width: 44px; height: 304px; float: left;}
.sidebarfixcolor {background-color: aqua;}
.sidebaricons {background-color: rgba(3,161,251,0.8);}
#sidebartextoh.p1text {color: white; font-size: 0.875em; margin-right: 7px; background-color: rgba(22,176,254, 1);}
#sidebarvar-c.sidebarvar{width: 271px; height: 304px; float: left; margin-left: 0px; background-color: aqua;}
#sidebox-container.sidebox-c {z-index: 5; cursor: pointer; position: fixed; width: 315px; height: 304px; top: 70px; padding: 0px; right:-271px;}
#imgenv.imgsidebar {margin-top: 45px; margin-bottom: 14px;}
.imgsidebar {z-index: 0; max-width: 100%; width: 44px; padding-left: 8px; padding-right: 6px;}
#imgoh.imgsidebar {margin-top: 14px; margin-bottom: 30px;}
#imgpfr.imgsidebar {margin-top: 90px; display: none}
.p1title, .p1titleprts {font-size: 1.2em; letter-spacing: 2px; min-height:20px; padding-bottom: 15px; margin-bottom: 0px; color:#000; text-shadow:0.071em 0.071em #fff; line-height:0.7; text-align:center; text-decoration:none; }
.txtadr {color:#fff; text-decoration:none; text-align:center}
.ic-map {padding: 0px 0px 16px 0px}
#mapicon-sidebar.ic-map {margin-top: 20px}
#logogooglemaps, #logogooglemapssi {width:35px; max-width:100%; overflow:hidden }
.l-align {text-align: left}
.r-align {text-align: right}
#coord-open.coord-items, #coord-open-bf.coord-items  {padding-top: 1.2em; line-height: 1.5}
.coord-container {font-size: 0.95em; padding: 10px 0px 10px 0px; display: inline-block; width: 100%; background-color: rgb(1, 223, 223); /*border-bottom: 0.5px solid grey; border-top: 0.5px solid grey;*/}
.coord-items {padding: 0 0 10px 0; text-align: center; z-index: 15; /*width: calc(100% / 4); float: left*/}
/*.coord-pkshop-img {height: 35px; margin-top: -10px; margin-right: 8px; max-width: 100%; float: left}*/
/*.coord-pkshop-txt {float: left; margin-left: 0px}*/
.coord-adr-show {background-color: rgba(217, 217, 217, 1); position: absolute; overflow: visible; width: 60%; z-index: 99; left: 20%; padding: 10px}
.coord-adr-txt {text-align: center; margin-top: 10px; margin-bottom: 10px}
/*.coord-adr-ctr {top:90px}*/
.coord-map {/*height: 44vw*/; overflow: visible; padding:10px}
/*
#coord-hz {border-bottom: 1px solid #ccc ;}
*/
#coord-hz, #coord-bf {display: inline-block; width: 42%; float:left; margin: 0 4%}
#coord-bf {margin-bottom: 10px}

.p1mbox-c {width: 33%; z-index:0; float: left; padding: 0; text-decoration:none; }
.p1mbox-c a {text-decoration: none;}
.p1box_wrapper {margin: 1% 10%; padding: 0 2%}
.img_wrapper {display: inline-block; overflow: hidden; position: relative}
.img_wrapperm {width: 24%;  padding: 10px 5px; display: inline-block; overflow: hidden; position: relative}
.img_wrapperm img {width: 100%}
.ourbrands {position:relative}
.ourbrands .inbrandlogo {margin-bottom: 0!important; position: absolute; top: 24%; left: 0;}

.p1box_animation, .p1box_animation_2{
    display: block;
    transition: all .2s ease; /* Animation */
    width: 100%;
    height: 100%;
    margin: 0 auto;
}

.p1box_animation:hover {-webkit-transform: scale(1.2); z-index: 25}

.img_wrapper:hover .left-icon-animate {
    animation-name: fadeout;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-fill-mode: both;
    /*opacity: 0*/
}

.p1boxdescr {font-size: 0.9em; line-height: 1.5; text-align: center}
.p1boxdescr_c {overflow: hidden;}
.p1boxdescr_extra {text-shadow: 1px 1px 3px grey;}

.left-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 20%;
    background-color: aqua;
    z-index: 11;
    height: 100%;
    transition: all .2s ease; /* Animation */
}

.left-icon-img {
    position: absolute;
    top: 0;
    left: 0;
    max-height: 100%;
}

/*
#partners {width: 100%; background-color: aqua; font-size:1.375em; padding-top: 15px; text-align: center}
*/

.imgpartner {width: calc(93%/6); margin:  2%; box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8)}

h1 {font-weight: bold; font-size: 1.125em; width: 100%; text-align: center; padding: 0; text-shadow: 1px 1px 3px grey;}
h1:first-child {margin-top: 0px}
h2 {font-size: 1.125em !important; padding: 8px !important; letter-spacing: 0.09em !important; text-align: center !important;}
h2:first-child {margin-top: 0px}
h3 {text-align: center !important; font-size: 1.125em !important; padding: 7px !important; letter-spacing: 0.08em !important;}
h3:first-child {margin-top: 0px}

#rescontainer, #resconfirmed {width: 26rem; background-color: rgba(0, 180, 255, 0.93); z-index:109; overflow: visible; padding: 0.5rem; box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8); margin: auto}

.clear {clear: both; display: block; width: 0; height: 0px; float: none; font-size: 0; line-height: 0;}

.p1title {padding-top:15px; }
.mainbody {padding-left: 10px}

#map {width:100%; height:96.67%; z-index:0; clear:both; overflow:hidden }
#map {z-index:0; clear:both; overflow:hidden }
#mapclose-container, #mapclose-container-bf {width:25px; height:30px; min-height:22px; z-index:0; float:right; overflow:auto }
#mapcloseimg, #mapcloseimg-bf {width:20px; height:20px; overflow:hidden }
#mapicon-container.ic-map {position: relative; margin-top: 15%; width:35px; z-index:3; clear:both; margin-left:auto; margin-right:auto }

.MapP1 {position:absolute; left:30%; top:1255px; width:435px; height:443px; z-index:1; padding-top:7px; background-color:lightgrey; box-shadow: 12px 20px 20px 20px rgba(0, 0, 0, 0.55); border-radius: 5px 5px 5px 5px;}
#maptxt {min-height:30px; min-width:90%; z-index:0; float:left; overflow:auto }
#maptxt {z-index:0; overflow:auto }
.myfooter2 {color:#00f; text-decoration:underline }
.mymap {border-radius: 0px 0px 5px 5px;}
#MyMap-container {display: none}
#MyMap-container {max-width:600px; z-index:0; clear:both; margin-left:auto; margin-right:auto }
.mymapcl-c {cursor: pointer}
.mymaptxt {padding: 7px 0px 0px 30px;}
.M14-Black {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:0.875em; letter-spacing:0.05em; line-height:0.75; text-align:center }
.f-fp {margin-top:0px }
.f-lp {margin-bottom:0px }
#rescontainer .w3-col, #resconfirmed .w3-col {width: 50px}
#rescontainer .w3-section, #resconfirmed .w3-section {/*margin: 0.5rem 0 0.5rem 0!important; */width: 99.5%}
#rescontainer .adrinput, #resconfirmed .adrinput {background: white; margin-right:0.5rem; width: 100%; }
#rescontainer .adrinput textarea, #resconfirmed.adrinput textarea {width:97%; height:115px; padding: 5px; margin: 0.5rem; border: 1px solid #ccc}
#resrecap {background-color: white; margin: 0.5rem 0 0.5rem 0; overflow:auto; width: 100%;}
#resrepconfirm, # {width: 100%; margin-top: 0.5rem}
#resrepconfirm button {height: 4rem}

#custadr .w3-input {padding: 4px}

.custadr {float: left; width:87%}
#rescalendar-container {margin: auto; z-index:99;}
#fahrrad-art {margin: 0.2rem; overflow:auto}
.custlast {float:left; width: 46%}
.custfirst {float:left; width: 40%; margin-left: 0.29rem}

.custplz {float:left; margin-left: 50px; width: 26%}
.custcity {float:right; width:60%}
#resrecap table tr {height: 30px;}
#resrecap table td {padding: 0.5rem; vertical-align: middle}
#resrepconfirm .mybtn, #rentconfirm .mybtn {width: 98.5%; margin: 25px 0}
#dankemsg {color: blue; font-family: 'Lemonada', cursive; text-align: center; padding: 0 0 10px 0;
margin-top: -14px;}

#repinputtitles.w3-button {letter-spacing: 0.09em; width:110px}
.cookies-advice {float:left; width: calc(100% - 240px)}
.cookies-ref, .cookies-conf {margin-right: 9px; padding: 10px; float:right;background-color: rgb(203, 203, 203)}

#btnHZ:hover ~ #imgHZ {display: block!important;}
#btnBF:hover ~ #imgBF {display: block!important;}

.myselect:not(.occupied){cursor:pointer;}

#jscalendar.calendarpos{margin: auto; z-index:99;}
.calendarchoice {background-color: black!important; color: white!important}
.seppoint {width: 0.8rem; text-align: center;}
.bordertd {border-bottom: 1px solid grey; width: 19.5rem}
.infotd {width: 7.5rem; }

.servicetarif td {height: 30px; border-bottom: 1px solid rgba(255,255,255,1);}
.verleihtarif td {height: 50px; border-bottom: 1px solid rgba(255,255,255,1);}
.td1 {/*width: 80%*/border-right: 1px solid rgba(255,255,255,1)}
.td2 {width: 28%; max-height:30px; text-align: center }
.td4 {width: 28%; max-height:30px; border-right: 1px solid rgba(255,255,255,1); text-align: center}
.td3 {max-height:30px; margin: 0 35%}
.td5 {font-size: 0.85em}

.servicetarifhead h2 {font-weight: bold}

.serviceprice {width: 25%; float: left; background-color: aqua;}
.servicepricetxt {font-size: 2em; text-align: center;}
.servicemsg {margin: 15px 10%; text-align:center; line-height:1.4}
#p1sboxin1-c.p1sbox-c, #p1sboxin2-c.p1sbox-c, #p1sboxin3-c.p1sbox-c, #p1sboxin4-c.p1sbox-c, #p1sboxverleih-c.p1sbox-c  {width: 50%; margin: 22px auto; padding:0 0 0 25px}

#p1mboxin1-c.p1mbox-c, #p1mboxin2-c.p1mbox-c, #p1mboxin3-c.p1mbox-c, #p1mboxin4-c.p1mbox-c {width: 100%; z-index:0; padding: 0;}
.verleihbox {padding: 75px 0!important}
#partnersimg a {text-decoration: none} 

#p1mboxpa-c.p1mbox-phil  {width: 100%; margin: 10px 0;}
#p1sboxpa-c {width: 60%; margin: auto}
#p1imgbox-pa.imgn-c {background-color: rgba(2, 110, 143, 0.7); margin-bottom: 25px; max-width: 85%}
.philomess {clear: both; line-height: 2.1vw; font-size: 1.3vw; text-align:center; padding: 6% 15px; margin-left: auto; margin-right: auto;}
.fillermargin {margin-top:25px}
#p1titlepa.p1title {padding: 5px 0 0}
.fade {-webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s;}
.fade {position: relative;}

.fade3 {-webkit-animation-name: fade3; -webkit-animation-duration: 3s; animation-name: fade3; animation-duration: 3s;}
.fade4 {-webkit-animation-name: fade4; -webkit-animation-duration: 19s; animation-name: fade4; animation-duration: 19s;}



#sboxpartnersfahrradde .partners-text {margin-top: 5%} 
#agcloseimg {max-width: 100%}
#angebotclose-c {position:absolute; width:25px; height:25px; right:5px; top: 7px; z-index:3}
.biketitles {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:0.75em; letter-spacing:0.05em; text-align:center; z-index:0; }

.blacklink {color:#000 }
.bltitle {color: white; background-color: rgb(9, 34, 250);}
.bluehemicas {color: #00f}
.bluenews {color:#00f; text-decoration:underline }

.body-c {overflow: auto;}
#body-container,#shopbody-container,#paybody-container {overflow: hidden; z-index: 0; position: relative; font-size: 0.875em; font-family: inherit;}
button {margin:0px; border-style:none; padding:0px; background-color:transparent; vertical-align:top }
.card .img1p1 {position: relative;display: inline-block;}
.card .img2p1{display: none; position: absolute; top: 0; left: 0;z-index: 99; }
.card .imgp1 {position: relative;display: inline-block;}
.card:hover .img2p1 {display: inline;}
.caroussel-container {position: relative; margin: auto; padding: 2%; overflow: auto}
.caroussel-info-container {margin-top: 20px;}
.caroussel-main-container {margin-top: 15px;}
.caroussel-main-container,.caroussel-info-container {position: relative; width: 47%; margin-left: 2%; margin-right: 1%; float: left;}
.caroussel-title2 {font-weight: bold;}

.cont-adr {padding: 20px 0px 20px 0px; line-height: 1.3;}
#cont-adr {z-index:0; clear:both }
#cont-adr a:active {color:#ff0 }
#cont-adr a:hover {color:#c0c0c0 }
#cont-adr a:link {color:#ff0 }
#cont-adr a:visited {color:#ff0 }
.cont-map {height: 480px!important}
.cont-map-c {width: 80%; margin-left: 10%; border-right:solid #818080 3px; border-bottom:solid #818080 3px}
.cont-maptxt {background-color: aqua; padding: 15px 0px 15px 0px; width: 100%;}
.cont-t {padding: 20px 0px 20px 0px;}
#cont-title {z-index:0 }
#contact-info {width: 80%}
#contact-info a:active {color:#ff0 }
#contact-info a:hover {color:#c0c0c0 }
#contact-info a:link {color:#ff0 }
#contact-info a:visited {color:#ff0 }
#contact-info.txtadr {z-index: 3; position:absolute; top:5%; left: 10% font-size:0.75em; line-height:0.5;}
.contact-tit {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:1.5em; letter-spacing:0.05em; text-shadow:0.071em 0.071em #fff; line-height:0.7; text-align:center }
.contact-txtadr {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:1.125em; letter-spacing:0.05em; line-height:0.5; text-align:center }

.copyright {color:#000 }
.covidnewheader {font-size:inherit; font-weight:bold; text-align:center;}
.covidnewheader p {margin: 0px; padding: 0px}
#covidnews {background-color: rgba(173,255,47,1); box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8);}
#covidnews {/*background: linear-gradient(to top, rgba(59, 239, 0, 0.8) 11.77%, rgba(195, 238, 0, 0.8) 51.26%, rgba(67, 205, 109, 0.74) 90.76%);box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8)*/;}
.covidnewscircle {position:absolute; top:1%; left:25%; height: 370px; width: 50%; font-size: inherit; border-radius:5%; display: block; z-index:9}
.imgnews {width: 30%; margin: 0px 35% ; box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8);}
/*.covidnewscircle {position:absolute; top:1%; left:37%; height: 370px; width: 370px; font-size: inherit; border-radius:5%; display: block; z-index:9}*/
.covidnewspadd {padding:0 5px 25px 9px; font-size: inherit}
.covidnewstext {font-size:inherit;text-align:center;}
.covidnoshow {display: none}
.imgnews {width: 30%; margin: 0px 35% ; box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8);}
div#sbox3.p1sbox-c {color:#c1c1c1}
.dotactive {background-color: #515151 !important}
.dottext {height: 250px; width: 250px; background-color: #bbb; border-radius: 50%; display: inline-block;}

.h-sb-1 {height:448px}
.h-sb-2 {height:245px}
.h-sb-3 {height:96px}
.h-sb-4 {height:96px}

.f-pagination {border-right: solid black 1px;}




#footer-container {z-index: 0; clear: both; padding: 10px}

#header-container.header-c {z-index: 999; clear: both; position: fixed; left: 0px; top: 0px; width: 100%; overflow: visible; box-shadow: 5px 10px 18px #888888;}
#Hinweis {z-index:0; float:left; padding:5px }
.hinweis-c {display: none}
.hoverboard-price {margin-top: 20px; margin-bottom: 20px;}
.hoverboard-specs-c {width: 50%; float: right; margin-top: 30px; margin-bottom: 0px;}
html {-webkit-text-size-adjust: 100%; height: 100%;}

.img1p1 {max-width: 100%; overflow: hidden; opacity: 1;}
.img1p1:hover {opacity: 0; }
.img2p1 {max-width: 100%; overflow: hidden;}

.imgn-c {position: relative; z-index:0; padding: 0px; margin-left:auto; margin-right:auto; overflow: hidden; max-width: 501px; min-height: 10vw;}
.imgnoopac {max-width: 100%; overflow: hidden; opacity: 1.0}

.imgp1 {max-width: 100%; overflow: hidden; opacity: 0.8;}
.imgp1:hover {opacity: 1; }
.imgp1vl {max-width: 100%; overflow: hidden; opacity: 0.3;}
.imgp1it {max-width: 100%; overflow: hidden; opacity: 1;}


.info-body-c {padding: 0px 50px 0px 50px}
.info-text {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; letter-spacing:0.05em; line-height:1.5; text-align:left }
#inforent {padding: 3px; margin:3px}
#inforent p {margin: 0.7vw 0 0 0}
.justify-txt {text-align: justify}

.L12-LightBlack {color:#505050; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:0.75em; letter-spacing:normal; line-height:1; text-align:left}
.l16-blue {color: #00f; text-decoration: none; line-height: 1.5; text-align: left !important;}
.lb18-blue {color: #00f; font-weight: bold; text-decoration: none; font-size: 1.5em; text-align: left !important;}
.line {clear: both; display: block; width: 100%; height: 1px; float: none; font-size: 0; line-height: 0; padding: 0 !important; margin: 0 !important; border-bottom: 1px solid black !important;}
#custadr .w3-section {margin-top: 10px!important; margin-bottom: 10px!important;}







.m-align {text-align: center}



.myCaroussel {position: relative; display: none;}
#mydots {margin-top: 20px; margin-bottom: 12px}
#myemail-c.myemail {width: 100%; margin-top: 10px; margin-bottom: 30px; text-align: center; color: blue;}
.myfooter {color:#000; font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; font-size:0.75em; letter-spacing:0.05em; line-height:1.2; text-align:center}


.myp-w3m {margin-bottom: 3px; margin-top: 3px}
#mypopupwin-c {display: none}
#mypopupwin-c.nimg-c {position: absolute; left: 25%; top: 24%; width: 720px; height: 473px; z-index: 5; background-color: lightgrey; box-shadow: 12px 20px 20px 20px rgba(0, 0, 0, 0.55); border-radius: 5px 5px 5px 5px;}
.myprice {font-size: 1.5em}
.mytabs {margin-bottom: 50px}
.mythumnails {width: 23%; margin-left: 1%; margin-right: 1%; float: left; cursor: pointer}
#neuheitenclose-c {position:absolute; width:25px; height:25px; right:5px; top: 7px; z-index:3}
/*.next {right: 0; border-radius: 3px 0 0 3px;}*/
.nextcarou {padding: 3.4% 0% 3.4% 1.4%; }
#nhcloseimg {max-width: 100%}
.nimgimg {max-width: 100%; width: 100%}

.myinfo {color: blue; font-size: 1.3em;  padding: 10px 20px; position: absolute; top: 0px; left: 33%; z-index:999; cursor: pointer}
.om1 {position: absolute; padding-left: 5px; bottom: 5px; font-size: 0.6875em; }
#p1imgbox-in1.imgn-c, #p1imgbox-in2.imgn-c {background-color: rgba(252, 255, 220, 0.6);}
#p1imgbox-oh.imgn-c {background-color: rgba(255, 255, 255, 0.8);}

#p1imgbox5.imgn-c {background-color: rgba(255, 255, 255, 1);}
#p1imgboxsa.imgn-c {background-color: snow}

.p1mbox-c2 {width: 24.2%; margin: 0.2%; z-index:0; float: left; padding: 5px; text-decoration:none; }
.p1mbox-c3 {width: 65.9%; z-index:0; float: left; padding: 5px; text-decoration:none; }
#p1mboxsv-c.p1mbox-c{margin-left: 5%; width: 42%;}
.p1sbox-c {margin: 5px; padding: 5px; background-color:#f3f2f2; box-shadow: 5px 10px 18px #888888; font-size: 0.85em;}
.p1text {position: relative; width:100%; padding: 7px; text-align: center; color: rgb(40, 40, 40); line-height: 1.2; overflow: hidden;}

.p1text ul {text-align: left; margin: 0px 0px 10px -10px; list-style-type: square; list-style-position: outside; line-height: 2.2;}
.p1texth1 {height: 300px;}
#p1textoh.p1text {line-height: 1.3; font-size: 0.875em;}
#p1textin1.p1text, #p1textin2.p1text {line-height: 1.1vw; font-size: 0.9vw}
#p1textin1.p1text, #p1textin2.p1text, #p1textpa.p1text, #p1textoh.p1text {color: black; }
#p1textnw.p1text {overflow: auto}
#p1textoh, #p1textpa, #p1textvl, #p1textin1, #p1textin2 {width: 100%; z-index: 3; position:absolute; top:0px; left: 0px; color: snow;  height:100%}
#p1textoh.p1text {color: white}
#p1textvl {padding: 7px; line-height: 1.2vw; font-size: 0.9vw; color: black}


.p1titleprts {padding-top:5px; }
#p1vlremark {font-size: 0.75em; position: absolute; bottom: 2%}

#PageDiv {position: relative; margin-top: 55px}
#PageDivContact {height:800px; max-width:1120px; position: relative; margin: auto; margin-top: 55px}
#PageDivDatenschutz {max-width:1120px; position: relative; margin: auto; margin-top: 55px}
#PageDivImp {max-width:1120px; position: relative; margin: auto; margin-top: 55px}
.pages-active a:link {text-decoration: none;}
#pages-container {z-index: 0; float: right; color: white; margin-top: 7px;}
#pages-container-f {z-index: 0; float: right; color: black; margin-top: 7px;}
#partners-7 {position: relative;}
#partners-7 a {text-decoration: none;}
.partners-img-ral {padding-left: 5px}
.partners-ral-ctr {position: absolute; top: 8px; left: 5px; width: 36%;}
.partners-ral-head-txt {padding-bottom: 3px; font-size: 0.8125em; letter-spacing: -0.05px; color: rgba(145, 86, 52, 1); font-family: 'Engravers MT Regular';}
.partners-ral-txt {color: darkgray; font-size: 8px; letter-spacing: -0.1px;}
.partners-text {position: absolute; top: 0px; text-align: center; width: 100%; line-height: 2;}
#PF3 {border-right: none;}

.pi_title {color: black; font-size: 1.125em!important; border-bottom: 1px solid gray; letter-spacing: 0.1em!important;}
.prdbikes {color:#00f; font-size: 0.75em; text-align:right }
.prdbikes, .prdbrand {font-family:'Roboto',Arial,sans-serif; font-weight: 400; text-decoration:none; letter-spacing:0.05em; line-height:1; }
.mybrand {color:blue!important}
.mytermin {color:grey!important; font-size:0.8em}

.prdbox {max-width: 100%; z-index:0; padding:5px; margin-left:auto; margin-right:auto; background-color:white;}
.prdboxc {width: 33.3%; z-index:0; float:left; padding:5px }
.prdimg {max-width: 100%; overflow:hidden animate}
.prdimgc {position:relative; max-width: 100%; z-index:0; padding:2px; margin-left:auto; margin-right:auto }
.prdimgov {position: absolute;top: 0px;left: 0px; max-width: 100%; overflow:hidden; opacity: 0 }
.prdimgov:hover {opacity: 0.3}

.prdpr1, .prdbrand {position: absolute; width:200px; z-index:1 }
.prdpr1 {top:2.28%; height:14px; right:2.15%; }

.prdbrand {
    color:black; font-size: 1em; text-align:center; left: -7.15%; top:8.5%; height:42px; text-shadow: 0.1em 0.1em 2px rgba(74, 72, 72, 0.75); transform: rotate(-15deg);
}

.prdpr2 {position: absolute; width:200px; top:10.04%; right:2.15%; height:14px; z-index:1 }


.prev, .next {z-index: 10; cursor: pointer; position: absolute; bottom: 1.3em; width: auto; padding: 12px; color: gray; margin-top:-22px; font-weight: bold; font-size: 28px; transition: 0.6s ease; border-radius: 0 3px 3px 0;}

.prev:hover, .next:hover {background-color: rgba(0, 0, 0, 0.8);}

.prevcarou{padding: 3.4% 0px 3.4% 1.4%; }
.prevcarou, .nextcarou {width: 5%; font-size: 1.5em; float: left; cursor: pointer; border: solid gray 1px; margin-right: 1%; margin-left: 1%;}
/*#prevslide.prev, #nextslide.next {color: rgb(108, 108, 108); position: absolute; top: 70%; z-index:999}*/


.slidedots {text-align: center; position: absolute; bottom: 8px; width: 100%; z-Index: 999}

.slideshow-c-mess {z-index: 3; font-size: 36px; color: dimgray; position: absolute; top: 1%; left: 10%; padding: 25px; text-align: center;}

.sloganmainimg-1 {top: 25px; right: 14%; padding: 22px 0px 0px 0px;}
.sloganmainimg-1 a {text-decoration: none !important}
.sloganmainimg-1,.sloganmainimg-2,.sloganmainimg-3 {color: rgb(85, 85, 85); line-height: 1.5vw; text-align: center; letter-spacing: 0.09em; height: 10vw; width: 10vw; border-radius: 50%;font-size: 1.2vw}
.sloganmainimg-2 {top: 25px; right: 5%; padding: 3vw 0px 0px 0px;}
.sloganmainimg-2 a {text-decoration: none !important}
.sloganmainimg-3 {top: 10vw; right: 9.5%; padding: 3vw 0px 0px 0px;}
.sloganmainimg-3 a {text-decoration: none !important}
.slogmcol0 {background-color: rgb(255, 255, 255, 0.9);}
.space {clear: both; display: block; width: 0; height: 1px; float: none; font-size: 0; line-height: 0; padding: 0 !important; margin: 0 !important;}
#specs-main-c.specs-c {width: 47%; z-index: 0; float: left; margin-top: 0px; margin-left: 1%; margin-right: 2%; padding: 5px; text-decoration: none;}
.specssbox-c {width: 100%; padding: 5px;}


strong {font-weight: bold}
.style18 {color: #191919}
.style7 {color: #18376a; margin-left: 0px; margin-right: 0px; text-align: left}
#subfc {margin-bottom: 15px;}
.tabbhl {text-align:center;}
table.p1oh td, table.p1pa td {padding-top: 4.5%; padding-right: 5px; padding-bottom: 0px; padding-left: 3px}
table.p1oh, table.p1pa, table.p1in1, table.p1in2 { width: 100%; line-height: 1.9}
table.p1rent {border-spacing:2px; width: 100%}
table.p1rent td:nth-child(1) {width: 50%;}
table.p1rent td:nth-child(2) {width: 30%;}
table.p1rent td:nth-child(3) {width: 20%;}
table.prdinfo td {padding-top: 7px; padding-bottom: 6px; padding-left: 10px}
table.prdinfo td:nth-child(1) {max-width: 50%}
table.prdinfo tr:nth-child(odd) {background-color: rgba(236, 246, 255, 0.6)}
table.spperf td, table.spother td, table.splg td, table.spmanual td {padding-top: 5px; padding-bottom: 5px; padding-left: 10px}
table.spperf th, table.spother th, table.splg th, table.spmanual th, table.prdinfo th {padding-top: 10px; padding-bottom: 10px}
table.spperf, table.spother, table.splg, table.spmanual, table.prdinfo {padding-top: 10px; padding-bottom: 10px; width: 100%}
#text-container {margin-top: 20px}
#text-container h2 {padding-left: 0 !important;}
#text-container h3 {padding-left: 0 !important;}
#text-container.f-ms {max-width:100%; z-index:0 }
#textspecs li {padding-top: 5px; padding-bottom: 5px;}
#textspecs ul {text-align: left; list-style-type: square; list-style-position: outside; line-height: 1.5;}
#textspecs ul.specs {color: blue; font-size: 115%}
#textspecs.text {position: relative; width: 98%; text-align: center; color: black; overflow: hidden; margin: auto}

#slidespecs li {padding-top: 5px; padding-bottom: 5px;}
#slidespecs ul {text-align: left; list-style-type: square; list-style-position: outside; line-height: 1.5;}
#slidespecs ul.specs {color: blue; font-weight: normal; font-size: 90%}
#slidespecs.text {position: relative; width: 98%; text-align: center; color: blue; font-weight: bold; overflow: hidden; margin: auto}

.thumnails-c {float: left; width: 86%;}
.thumnails-container {position: relative; overflow: auto; border: solid gray 1px; margin: 5px; padding: 5px;}
.thumnails-main-container {position: relative; width: 100%; overflow: auto}
.title1descr {font-size: 0.875em; padding-top:3px; padding-bottom:3px; background-color: rgba(0, 102, 255,0.95); color: white}
#titlespecs h3 {font-weight: bold; letter-spacing: 0.15em !important;}
#t1.p1text {width: 100%; margin: auto}

.video-footer {text-align: center; font-size: 60%}
.w3-bar {margin-top: 25px;}
.w3-button {border-bottom: solid #505050 0.5px!important;}
.w3-button {letter-spacing: 0.09em;}
.w3-button:hover {color:#2196F3!important; background-color:white!important}
.w3-container {width: 47%; margin-left: 2%; margin-right: 1%; float: left; }
.w3-margin-basket {margin: 16px 0 16px 0}
.w3-xxlarge {font-size: 30px!important}
#represmsg, #represmsgbox {width: 100%; font-size: 1vw; letter-spacing: 0.1rem; z-index: 8; background: linear-gradient(to top, rgb(40, 40, 98), rgb(10, 67, 252));}

#represmsg {padding:0.5rem;}
#represmsgbox {padding:0.3rem;}

#represmsg h3, #represmsgbox h3 {padding: 0px!important}
.res-circle {width: 20%;border-radius: 50%;background: #bcd6ff;}
.res-sphere {background: linear-gradient(135deg, #a7cfdf 0%,#23538a 100%); box-shadow: inset -8px -7px 4px 0px rgba(0,0,0,0.3);}
.res-sphere:after {content: ""; display: block; padding-bottom: 100%;}}
.res-circle::after {content: ""; display: block; padding-bottom: 100%;}
.circle-txt {width: 100%; text-align: center; color: white; line-height: 1.5}
.insptermin-txt {width: 100%; text-align: center; color: white; line-height: 1.25vw; font-size: 0.8vw; overflow: visible}


#rentcontainer {position:fixed; top: 6%; right: 42%; width: 26rem; background-color: rgba(0, 180, 255, 0.93); z-index:109; overflow: visible; padding: 0.5rem; box-shadow: 5px 10px 18px rgba(0, 0, 0, 0.8)}



#rentcontainer .w3-col {width: 50px}
#rentcontainer .w3-section {margin: 0.5rem 0 0.5rem 0!important; width: 99.5%}
#rentcontainer .adrinput{background: white; margin-right:0.5rem; width: 100%; }
#rentcontainer .adrinput textarea {width:97%; height:115px; padding: 5px; margin: 0.5rem; border: 1px solid #ccc}

#rentrecap {background-color: white; margin: 0.5rem 0 0.5rem 0; overflow:auto; width: 100%;}
#rentconfirm {width: 100%; margin-top: 0.5rem}
#rentconfirm button {height: 4rem}
#resbtnclose {position: absolute; top: 0; right: -3rem; color: blue; cursor: pointer}

.mybtn {color: white; background: linear-gradient(135deg, #a7cfdf 0%,#23538a 100%); box-shadow: inset -8px -7px 4px 0px rgba(0,0,0,0.3); width: calc(95% / 2); margin: 0.2rem; padding: 0.3rem; letter-spacing: 0.125rem; text-shadow: 0 0.1875rem 0.3125rem rgba(0, 0, 0, 0.5); border-radius: 5px; float: left; cursor: pointer}
#standort .mybtn {width: 100%; margin: 0.3rem; padding: 0.4rem; }

#inpmodelfilter input.mysubmit {font-weight: bold; background-color: rgb(217, 217, 217); padding: 10px; margin: 0;letter-spacing: 0.2vw!important;}

/*#inpmodelfilter input.mysubmit {margin: 20px}*/

#inpmodelfilter div.submitbutton {/*padding-left:15%; margin-top: 15px; margin-bottom: 15p;x*/ margin: 10px; }

#inpmodelfilter input {margin: 6px;}
#inpmodelfilter label {margin: 6px;}

#chooseNM, #chooseAkku, #choosePrice {float: left; width: 33%; text-align: center; }
#chooseNM span, #chooseAkku span, #choosePrice span {width: 100%; font-weight: bold; line-height: 2.5; }

#modmultichoice {position:absolute; top: 20px; width: 100%; z-index: 999; font-size: 0.9vw}

#filterboxes {background-color: rgb(244, 229, 192); width: 65%; margin: 0px auto 10px; padding: 12px;box-shadow:6px 6px 5px rgb(106, 105, 105);border-radius: 10px;}

#modmultichoice table {width: 90%; margin: auto; border: black solid 1px}
#modmultichoice table th {text-align: center; font-weight: bold; background: none!important; border-bottom: black solid 1px}
#modmultichoice table td {text-align: right}
#modmultichoice table td:nth-child(1) {width: 90%; text-align: left}
#modmultichoice table td:nth-child(2) {width: 10%}
/*#modmultichoice table td:nth-child(3) {width: 25%}
#modmultichoice table td:nth-child(4) {width: 25%; padding-right: 10px}*/

#showfilter {background-color:aqua; top: 12px;}
#resetfilter {background-color:red; top: 40%;}

#showfilter, #resetfilter {
    position:absolute;  right:0px; padding:15px 0; font-size: 1.1vw; z-index:9999; border-radius:10px 0 0 10px;letter-spacing: 0.07vw; cursor:pointer; width:70px
}

#showfilter i.myfilterimg, #resetfilter i.myfilterimg {font-size:1.8vw; padding: 0}


#closebtn.posclosebtn {position:absolute; top: 4px; right:19%; font-size:1vw!important; cursor:pointer}

* lemonada-300 - latin */
@font-face {
  font-family: 'Lemonada';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/lemonada-v20-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lemonada-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lemonada-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lemonada-v20-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lemonada-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lemonada-v20-latin-300.svg#Lemonada') format('svg'); /* Legacy iOS */
}
/* lemonada-regular - latin */
@font-face {
  font-family: 'Lemonada';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lemonada-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lemonada-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lemonada-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lemonada-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lemonada-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lemonada-v20-latin-regular.svg#Lemonada') format('svg'); /* Legacy iOS */
}
/* lemonada-500 - latin */
@font-face {
  font-family: 'Lemonada';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/lemonada-v20-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lemonada-v20-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lemonada-v20-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lemonada-v20-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lemonada-v20-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lemonada-v20-latin-500.svg#Lemonada') format('svg'); /* Legacy iOS */
}


/* TYPEWRIITER Effect */

.typewriter {
    color: black;
    overflow: hidden; /* Ensures the content is not revealed until the animation */
    /*font-family: monospace;*/
    font-size: 1.3em;
    /*font-weight: bold;*/
    margin: 0 auto; /* Gives that scrolling effect as the typing happens */
    letter-spacing: .08em; /* Adjust as needed */
    line-height: 2;
    text-align: left;
}

.typewriter p {
    
    /*border-right: .15em solid orange; *//* The typwriter cursor */
    /*white-space: nowrap; *//* Keeps the content on a single line */
     animation: 
        typing 3.0s steps(30, end),
        blink-caret .5s step-end infinite;
}

/* The typing effect */
@keyframes typing {
      from { width: 0 }
      to { width: 100% }
}

/* The typewriter cursor effect */
@keyframes blink-caret {
      from, to { border-color: transparent }
      50% { border-color: orange }
}

.modelname {font-weight: bold}

/* FEDER Fliegen lassen */

.feather-container {
  position: fixed;
  top: -100px;
  left: 30%;
  width: 200px;
  height: auto;
  animation: floatDown 10s ease-in-out /*infinite*/;
  pointer-events: none;
  z-index: 9999;
}

.feather {
  width: 100%;
  height: auto;
  transform: rotate(0deg);
  animation: rotateFeather 5s ease-in-out infinite alternate;
}

@keyframes floatDown {
  0% {
    transform: translateX(0) translateY(0);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  50% {
    transform: translateX(-100px) translateY(500px);
  }
  100% {
    transform: translateX(100px) translateY(1000px);
    opacity: 0;
  }
}

@keyframes rotateFeather {
  0% {
    transform: rotate(-15deg);
  }
  100% {
    transform: rotate(15deg);
  }
}