body { margin-top:0px; margin-left:1px; margin-right:1px; margin-bottom:1px; background-color:#ffffff; color:rgb(0,0,0); font-family:Arial,helvetica; font-style:bold; font-size:9pt; scrollbar-base-color:rgb(165,140,127); scrollbar-3dlight-color:#ffffff; scrollbar-arrow-color:#ffffff; scrollbar-darkshadow-color:rgb(0,0,0); scrollbar-face-color:rgb(165,140,127); scrollbar-highlight-color:#ffffff; scrollbar-shadow-color:rgb(120,70,0); scrollbar-track-color:#ffffff; } p {font-size:9pt;} td {font-size:9pt;} th {font-size:9pt;} a:link { color:rgb(0,0,0); text-decoration:none; font-weight:bold; } a:visited { color:rgb(0,0,0); text-decoration:none; font-weight:bold; } a:hover { color:rgb(0,0,0); text-decoration:none; background-color:#ddcccc; font-weight:bold; } a:active { color:rgb(200,52,0); background-color:#FFFF99; font-weight:bold; } h1 { color:rgb(0,0,0); font-size:10pt;} h2 { color:rgb(0,0,0); font-size:12pt;} h3 { color:rgb(0,0,0); font-size:12pt;} h4 { color:rgb(0,0,0); font-size:11pt;} h5 { font-size:10pt; margin-top:0px; margin-left:1px; margin-right:1px; margin-bottom:1px; background-color:#ffffff; color:rgb(0,0,0); font-family:Arial,helvetica; font-style:bold; } h6 { font-size:9pt; margin-top:0px; margin-left:1px; margin-right:1px; margin-bottom:0px; background-color:#ffffff; color:rgb(0,0,0); font-family:Arial,helvetica; font-style:normal; } b.Rabatttext { text-decoration:line-through; font-style:normal; COLOR: black } b.EndText { text-decoration:none; COLOR: black; font-size:9pt; margin-top:0px; margin-left:1px; margin-right:1px; margin-bottom:0px; font-family:Arial,helvetica; font-style:normal; } select { color:rgb(0,0,0); border-top-color:#ffffff; border-bottom-color:rgb(69,32,0); border-left-color:#ffffff; border-right-color:rgb(69,32,0); background-color:rgb(221,206,198); cursor:hand; } input { color:rgb(0,0,0); border-top-color:#ffffff; border-bottom-color:rgb(69,32,0); border-left-color:#ffffff; border-right-color:rgb(69,32,0); background-color:rgb(221,206,198); cursor:hand; } #Navigation { font-family:Arial,helvetica; font-size:10pt; } #NavigationGr { font-family:Arial,helvetica; font-size:11pt; } #shadow { width:100%; font-family:"Andale Mono",Arial,sans-serif; font-size:26pt; padding-bottom:5px; } #Kopfzeile { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:rgb(69,32,0); padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:rgb(69,32,0); padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; color:rgb(69,32,0); background-color:rgb(239,195,156); } #ProduktLink{ .link { color:rgb(0,0,0); text-decoration:none; font-weight:bold; } .visited { color:rgb(0,0,0); text-decoration:none; font-weight:bold; } .hover { color:rgb(0,0,0); text-decoration:none; background-color:#ddcccc; font-weight:bold; } .active { color:rgb(200,52,0); background-color:#FFFF99; font-weight:bold; } } #Kopfzeile1 { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:rgb(255,242,232); padding-top:1px; border-bottom-width:0px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:0px; border-left-style:solid; border-left-color:rgb(255,242,232); padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; color:rgb(255,242,232); background-color:rgb(255,242,232); } #XKnopf { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:#ffffff; padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(69,32,0); padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:#ffffff; padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:rgb(69,32,0); padding-right:1px; color:rgb(69,32,0); background-color:rgb(221,206,198); } #Knopf { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:#ffffff; padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(69,32,0); padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:#ffffff; padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:rgb(69,32,0); padding-right:1px; font-style:bold; color:#FF0000; background-color:#eeeeee; } #Hervor { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:#ffffff; padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(69,32,0); padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:#ffffff; padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:rgb(69,32,0); padding-right:1px; background-color:rgb(225,203,184); } #Herein1 { font-size:10pt; border-top-width:0px; border-top-style:solid; border-top-color:rgb(69,32,0); padding-top:1px; border-bottom-width:0px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:0px; border-left-style:solid; border-left-color:rgb(69,32,0); padding-left:1px; border-right-width:0px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; background-color:rgb(255,255,255); } #HervorBlack10 { font-size:11pt; color:#000000; font-style:normal; font-weight:bold; } #HervorBlack11 { font-size:12pt; color:#000000; font-style:normal; font-weight:bold; } #HervorBlack12 { font-size:13pt; color:#000000; font-style:normal; font-weight:bold; } #LieferbarRed { font-size:10pt; color:#ff0000; font-style:normal; font-weight:bold; } #LieferbarGreen { font-size:11pt; color:#009900; font-style:normal; font-weight:bold; } #SmallText { font-size:8pt; color:#000000; font-style:normal; font-weight:normal; } #StreichPreisRed { font-size:13pt; color:#ff0000; font-style:normal; font-weight:bold; } #StreichPreisOriginal { text-decoration:line-through; font-size:10pt; color:#000000; font-style:normal; font-weight:bold; } #HervorRed10 { font-size:11pt; color:#Cc0000; font-style:normal; font-weight:bold; } #HervorRed09 { font-size:10pt; color:#Cc0000; font-style:normal; } #HervorGreen09 { font-size:09pt; color:#339933; font-style:normal; } #HervorRed09Bold { font-size:10pt; color:#Cc0000; font-style:normal; font-weight:bold; } #HervorGray10 { font-size:11pt; color:#C0C0C0; font-style:normal; font-weight:bold; } #HervorBlack09 { font-size:10pt; color:#000000; font-style:normal; } #HervorBlack07 { font-size:8pt; color:#000000; font-style:normal; } #HervorGrey07{ font-size:8pt; color:#C0C0C0; font-style:normal; } #HervorMarked07{ font-size:9pt; color:#Cc0000; font-style:normal; font-weight:bold; } #HBlack09Bold { font-size:10pt; color:#000000; font-weight:bold; font-style:normal; } #Herein { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:rgb(69,32,0); padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:rgb(69,32,0); padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; background-color:rgb(225,203,184); } #Menublock { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:#ffffff; padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(69,32,0); padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:#ffffff; padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:rgb(69,32,0); padding-right:1px; background-color:#cccccc; } #fusszeile { background-color:#ffffff; } #Bereichaussen { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:rgb(69,32,0); padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:rgb(69,32,0); padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; background-color:rgb(221,206,198); } #Bereichinnen { font-size:10pt; border-top-width:1px; border-top-style:solid; border-top-color:rgb(69,32,0); padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:#ffffff; padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:rgb(69,32,0); padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:#ffffff; padding-right:1px; background-color:rgb(221,206,198); } #trenner { font-size:10pt; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(155,145,145); padding-bottom:1px; } #UMenutrenner { font-size:10pt; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(155,145,145); padding-bottom:1px; } #unsichtbar { position:absolute; top:-500; left:140; color:#000000; width:138; height:159; cursor:pointer; z-index:4; border-top-width:1px; border-top-style:solid; border-top-color:#ffffff; padding-top:1px; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:rgb(69,32,0); padding-bottom:1px; border-left-width:1px; border-left-style:solid; border-left-color:#ffffff; padding-left:1px; border-right-width:1px; border-right-style:solid; border-right-color:rgb(69,32,0); padding-right:1px; background-color:#ACACE6; background-image:url(/Portal/imageslokal/hintergross_hell.jpg); font-size:10pt; } /****************************************************************************/ /* Add pointer-events:none to disable clicking the link */ a[href$=".mp3"] { pointer-events: none; cursor: default; } /* Custom play button CSS */ .play-btn { display: inline-block; position: relative; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(to bottom right, #ff4960, #ffae00); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); cursor: pointer; } .play-btn::before, .play-btn::after { content: ""; position: absolute; } .play-btn::before { width: 0; height: 0; border-style: solid; border-width: 12px 0 12px 22px; border-color: transparent transparent transparent #fff; left: 12px; top: 6px; } .play-btn::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background-color: #fff; left: 13px; top: 12px; } /* Play and pause button states */ .play-btn.playing::before { border-style: none none none solid; border-width: 0 0 0 20px; border-color: transparent transparent transparent #fff; left: 30px; top: 20px; } .play-btn.playing::after { content: "\f28c"; /* Font Awesome pause icon */ font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 24px; line-height: 80px; text-align: center; color: #fff; } /****************************************************************************/ .viewproductdetail-button { margin-top: auto; display: block; width: 300px; padding: 10px; font-size: 16px; text-align: center; background-color: #ffdb58; color: #fff; text-decoration: none; border-radius: 5px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); transition: transform 0.3s, box-shadow 0.3s; position: relative; overflow: hidden; } .viewproductdetail-button::after { content: ""; position: absolute; bottom: -100%; left: -50%; width: 200%; height: 200%; background-color: orange; transform: rotate(30deg); transform-origin: bottom left; transition: bottom 0.3s ease; } .viewproductdetail-button:hover::after { bottom: 0; } .viewproductdetail-button:hover { transform: translate(1px, 1px); box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); } /****************************************************************************/ .addtocart-button { margin-top: auto; display: block; width: 300px; height: auto; padding: 8px; text-align: center; font-size: 14px; background-color: #ffdb58; color: black; align-items: center; text-decoration: none; border-radius: 5px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); transition: transform 0.3s, box-shadow 0.3s; position: relative; overflow: hidden; font-weight: bold; } .addtocart-button::after { content: ""; position: absolute; bottom: -100%; left: -50%; width: 200%; height: 200%; background-color: orange; transform: rotate(30deg); transform-origin: bottom left; transition: bottom 0.3s ease; } .addtocart-button:hover::after { bottom: 0; } .addtocart-button:hover { transform: translate(1px, 1px); box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); } .small-addtocart-button { /* Vererbe den Stil von .addtocart-button und passe die Breite an */ width: 120px; margin-top: auto; display: block; height: 32; padding: 4px; text-align: center; font-size: 12px; background-color: #ffdb58; color: black; align-items: center; text-decoration: none; border-radius: 4px; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3); transition: transform 0.2s, box-shadow 0.2s; position: relative; overflow: hidden; font-weight: bold; } .small-addtocart-button::after { content: ""; position: absolute; bottom: -200%; left: -50%; width: 80%; height: 150%; background-color: orange; transform: rotate(30deg); transform-origin: bottom left; transition: bottom 0.2s ease; } .small-addtocart-button:hover::after { bottom: 0; } .small-addtocart-button:hover { transform: translate(1px, 1px); box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3); } .button-container { text-align: center; /* Horizontal zentrieren */ vertical-align: middle; /* Vertikal zentrieren */ height: 100%; /* Vollständige Höhe der Zelle verwenden */ } /****************************************************************************/ /* Add some basic styling to the button */ .search-form { float: left; margin-right: 5px; } .search-input { padding: 5px; border: 1px solid #ccc; border-radius: 3px; } .search-button { float: left; width: 35x; height: 30px; background-color: #FFDB58; border: none; border-radius: 3px; cursor: pointer; color: #fff; } .search-button::before { content: '\1F50D'; /* Unicode für das Lupe-Symbol */ font-size: 18px; } .search-form { display: inline-block; /* Setze das Formular auf inline-block, damit es in einer Zeile mit dem Button erscheint */ } .search-input { padding: 5px; border: 1px solid #ccc; border-radius: 3px; margin-right: 5px; } /****************************************************************************/ /*button { display: inline-block; height: 30px; padding: 0; margin: 0; vertical-align: top; width: 30px; } .container { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; } .column { flex-basis: calc(25% - 20px); box-sizing: border-box; padding: 10px; border: 1px solid #ddd; border-radius: 5px; display: flex; flex-direction: column; } .column h2 { margin-top: 0; } */