WEB-Team-A4/public/css/desktop.css

246 lines
3.7 KiB
CSS

* {
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;
}
.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;
}
.content::before {
content: "";
background-image: url('gemuese_transparent.png');
background-repeat: no-repeat;
background-position: 50% 10%;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
opacity: 0.2;
}
#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;
}
.produkte{
border:#606060 3px solid;
display: inline-block;
margin: 10px;
}
.produktbild{
border:#606060 3px solid;
}
.produktbottom{
margin:10px;
}