 
body 
{font-family: Arial, Helvetica, sans-serif;
background-color: orange;
}

.linie {
    border-bottom: 3px solid #c2b8b8; /* Dicke, Stil, Farbe */
    width: 100%; /* Breite der Linie */
    margin: 25px 0; /* Abstand oben/unten */
    margin-left: auto;
    margin-right: auto;
  } 
.container {
  display: grid;
  grid-template-columns: 358px 640px ;
  gap: 0px;
  background-color: orange;
  padding: 2px;
  border: 0px;
  justify-content: center;
  text-align: center;
} 
 
 

.container div {
  background-color: black;
  padding: 1px;
  
}

.item1 {
  grid-column-start: 1;
  grid-column-end: 2;
   background-color:black;
    text-align: center;
    color:whitesmoke;   /* Farbe orange */
    font-size: 20px;
    font-style: 28px;  /* Größe 28pt   */
    font-family:arial, "lucida console", sans-serif; /* Schriftart */
}

.beispielbild {
    display: grid;
    place-items: center;  
    width: 280px;
    height: 120px;
    border: 1px solid whitesmoke;
}
#honey{
    width: 100%;
    height: 100%;
}


.item2 {
  grid-column-start: 2;
  grid-column-end: 3;
  text-align: center;
  writing-mode: vertical; 
  word-spacing:50px; 
   color:whitesmoke;   /* Farbe orange */
    font-size: 18px;
    font-style: 28px;  /* Größe 28pt   */
}
 
#link {color:whitesmoke; text-decoration: none;}

.fa {
  padding: 0px;
  font-size: 30px;
  width: 120px;
  text-align: left;
  text-decoration: none;
  margin:0px 2px;
}

.fa:hover {
    opacity: 0.7;
}


.fa-instagram {
  background: black ;
  color: white;
}

.item3 {
  grid-column-start: 1;
  grid-column-end: 3;
  font-family: Arial, Helvetica, sans-serif; 
  background-color: #050505;
  padding: 20px; 
}
 
.card-container { 
  max-width: 420px; 
  margin: auto; 
  background: black; 
  padding: 3px 10px; 
  border: 2px solid white;
  border-radius: 8px; 
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
}
h2 { 
  text-align: center; 
  color: white; 
}
.form-group {
   margin-bottom: 15px; 
}
label { 
  display: block; 
  margin-bottom: 16px; 
  font-weight: bold;
  color: white; 
}
input[type="text"], input[type="email"]   {
  width: 90%; 
  padding: 8px; 
  border:3px solid grey ;
  border-radius: 4px; 
  box-sizing: border-box; 
}
textarea[name="message"]{
width: 90%;
height: 200px; 
  padding: 8px; 
  border:3px solid grey ;
  border-radius: 4px; 
  box-sizing: border-box; 
}  

input[type="checkbox"] {
  display: inline;
  width: 1.1em;
  height: 1.1em;
  appearance: auto;
  margin-right: .2em
}
input[type="reset"] {
  background-color: #cfc3c2;  
  color: black;
  padding: 1px 3px;
  border:3px solid grey ;
  border-radius: 5px;
  cursor: pointer;
  font-size: 14px;
  font-family: Arial black
}

input[type="reset"]:hover {
  background-color: #676161; /* Dunkleres Rot beim Hovern */
}
textarea { 
  resize: vertical; 
}
button {
  background-color:orange;
  color: black; 
  padding: 2px 18px; 
  border: 3px solid grey; 
  border-radius: 4px; 
  cursor: pointer; width: 80%; 
  font-size: 18px;
  font-family: Arial black, Helvetica, sans-serif; 
}
button:hover { 
  background-color:rgb(255, 197, 5); 
}
#formMessage { 
  padding: 10px;
   border-radius: 4px; 
   text-align: center; 
  }
.success {
  background-color: #d4edda;
   color: rgb(202, 134, 7); 
  }
.error { background-color: #f8d7da; color: #721c24; }
 

.item4 {
  grid-column-start: 1;
  grid-column-end: 3;
  height: 120px; 
  text-align: center;
  writing-mode: vertical; 
  word-spacing: 60px; 
   color:whitesmoke;   /* Farbe orange */
    font-size: 18px;
    font-style: 28px;  /* Größe 28pt   */
    
}

#impressum {
  word-spacing: normal; 
}

.item5 {
  grid-column-start: 1;
  grid-column-end: 3;
    height: 120px; 
    text-align: center;
    writing-mode: vertical;  
}