* { box-sizing: border-box; font-family: Helvetica, Arial, sans-serif; } body { min-height: 100vh; padding: 0; } body::-webkit-scrollbar { width: 10px } body::-webkit-scrollbar-track { background-color: white; } body::-webkit-scrollbar-thumb { background: #476B1C; } header { background-color: #9BB558; } header > h1 { padding-top: 0.3em; padding-left: 7em; margin: 0; font-size: 2.5em; } header > p { padding-left: 17.6em; margin-top: 0.5em; margin-bottom: 0; } .header_logo { float: left; margin-left: 1em; transform: scale(1.2); } .navbar { background-color: #476B1C; display: grid; grid-template-columns: repeat(var(--items), 1fr); width: 100%; } .navbar a { text-align: center; text-decoration: none; color: white; padding: 0.5em 0 0.5em 0; } .aktuell a { color: #f4eb49; } .content { position: relative; } .content p { margin-top: 0.1em; margin-bottom: 0.1em; } .content :not(h1, strong) { margin-left: 3.5em; } .content h1 { text-align: center; font-size: 2.5em; } .content h2 { text-align: center; } html body.index .content::before, html body.datenschutz .content::before, html body.ueberuns .content::before, html body.kontakt .content::before, html body.impressum .content::before{ content: ""; background-image: url('../pictures/gemuese_transparent.png'); background-repeat: no-repeat; background-position: center top; position: absolute; overflow: auto; top: 0px; right: 0px; bottom: 0px; left: 0px; opacity: 0.2; pointer-events: none; } #aktuelle_auswahl { margin-left: 2.3em; font-size: 1.5em; } .beispiel_produkte { margin: 10px; margin-left: 8px; } .beispiel_produkte img { border: #606060 1px solid; } .button_produkte { background-color: #476B1C; color: white; padding: 5px 20px; border-radius: 15px; text-align: center; text-decoration: none; display: inline-block; font-size: 1em; margin: 4px 2px; cursor: pointer; } #balken { background-color: #9BB558; height: 20px; position: relative; left: 0; bottom: 0; width: 100%; } input { font-family: Arial, Helvetica, sans-serif; color: #606060 } label { font-weight: normal; border: none; } #anrede, #titel, #vorname, #name, #straße, #hausnummer, #plz, #wohnort, #email { border: none; width:600px; } .bestellung_tabelle { font-family: Arial, Helvetica, sans-serif; font-size: 0.8em; color: #606060; text-align: left; margin-top:30px; margin-left: 50px; border: thin solid #606060; border-collapse: collapse; } .bestellung_tabelle th { border: thin solid #606060; } .bestellung_tabelle td { border: thin solid #606060; width: 600px; } .bestellung_tabelle tr{ height: 25px; } .stern { width: 30px; text-align: center; } .feld_vorn { width: 115px; } #tabellenbeschreibung{ font-size: 0.8em; margin-top: 6px; margin-left: 60px; } #gesamtkosten{ font-size: 1em; color: black; margin-top: 40px; margin-left: 50px; } .checkboxen{ display: inline-block; font-size: 0.8em; text-align:justify; } .checkbox_ausrichtung{ margin-left: 50px; } #begrueßung_bestellung_abschließen{ font-size: 2em; font-family: Arial, Helvetica, sans-serif; color: black; text-align: center; margin-top: 0.5px; } .button_abschließen{ background-color: #476B1C; color: white; padding: 3px 10px; border-radius: 6px; text-align: center; text-decoration: none; display: inline-block; font-size: 0.8em; margin: 4px 2px; cursor: pointer; font-weight: normal; } .button_abschließen_position{ margin-left: 100px; } .produktueberschrift{ text-align: center; margin:50px; } .parent{ display: flex; justify-content: space-around; flex-wrap:wrap; align-content: center; } .produkte{ display: flex; border:#606060 3px solid; display: inline-block; margin: 25px; } .produktbottom{ justify-content: space-between; display: flex; margin:10px; } .produkte_warenkorb{ position: relative; max-width: 88%; height: 165px; border: thin solid #606060; margin-top: 22.5px; margin-bottom: 22.5px; display: flex; align-items: center; } .produkte_warenkorb img { margin-right: -60px; height:60%; } .produkte_details { width: 150px; display: block; font-size: 0.8em; margin-top: -40px; } .button_mit_menue{ display: flex; align-items: center; position:absolute; bottom: 50px; right: 30px; } .button_entfernen{ background-color: #ebebeb; border: thin solid black; color: black; width: 115px; height: 31px; padding: 6px; border-radius: 3px; text-align: center; text-decoration: none; display: inline-block; font-size: 0.8em; margin: 4px 2px; cursor: pointer; font-weight: normal; } #menue{ width: 35px; height: 25px; margin-left: 10px; } .gesamtbetrag{ position: absolute; font-size: 1em; bottom: 15px; right: 15px; } a:hover{ color: #f4eb49; }