/* Datei: style_formulare_frontend.css  / Basislayout – übernommen aus fehltag_eingabe.php */
    body {
      font-family: Arial, sans-serif;
      background-color: #f4f4f4;
      margin: 0;
      padding: 20px;
    }

    .container {
      background-color: #ffffff;
      border-radius: 10px;
      box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
      padding: 20px;
      width: 80%;
      max-width: 800px;
      margin: auto;
    }

    .form-group {
      margin-bottom: 20px;
    }

    label {
      display: block;
      font-weight: bold;
      margin-bottom: 5px;
      color: #333;
    }

    input, select, textarea {
      width: 100%;
      padding: 12px;
      font-size: 18px;
      border: 1px solid #ddd;
      border-radius: 5px;
      box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
      box-sizing: border-box;
      transition: all 0.3s ease;
    }

    input:focus, select:focus, textarea:focus {
      border-color: #FF6600;
      box-shadow: 0px 4px 8px rgba(255, 102, 0, 0.2);
      outline: none;
    }

    textarea {
      resize: vertical;
    }

    .form-group em {
      display: block;
      font-size: 14px;
      color: #555;
    }

    .form-group a {
      font-size: 14px;
      color: #007BFF;
      text-decoration: none;
    }

    .form-group a:hover {
      text-decoration: underline;
    }

	input[type="submit"] {
	  background-color: #FF6600; /* Gleiche Hintergrundfarbe */
	  border: 3px solid #e65c00; /* Gleicher Rahmen */
	  color: white; /* Gleiche Schriftfarbe */
	  font-size: 18px; /* Gleiche Schriftgröße */
	  padding: 15px 30px; /* Gleiche Innenabstände */
	  border-radius: 8px; /* Gleiche abgerundete Ecken */
	  cursor: pointer;
	  transition: all 0.3s ease; /* Gleiche Übergänge */
	  width: 100%; /* Gleiche Breite */
	  white-space: normal;
	  word-wrap: break-word;
	  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Gleicher Schatten */
	}
	
	input[type="submit"]:hover {
	  background-color: #e65c00; /* Gleicher Hover-Effekt */
	  border-color: #d84e00; /* Gleiche Hover-Rahmenfarbe */
	  transform: scale(1.05); /* Gleiche Vergrößerung beim Hover */
	  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); /* Gleicher Hover-Schatten */
	}
	
    h1 {
      /* color: #FF6600; // Orange – ursprünglich genutzt */
	  color: #4caf50;
      font-size: 20px;
      margin-bottom: 20px;
      text-align: center;
    }

    @media (max-width: 600px) {
      .container {
        width: 90%;
      }

      input, select, textarea {
        font-size: 16px;
        padding: 10px;
      }

      input[type="submit"] {
        font-size: 18px;
        padding: 12px;
      }
    }
	.container img {
  width: 100%;          /* Das Bild füllt die Container-Breite */
  max-height: 200px;    /* Optional: maximale Höhe */
  height: auto;         /* Höhe proportional zur Breite */
  object-fit: contain;  /* Bild skalieren, ohne es zu beschneiden */
  margin-bottom: 20px;  /* Abstand zum nachfolgenden Inhalt */
  display: block;       /* Vermeidet zusätzlichen Leerraum */
}
