/* ============================================================ TimeSecPlan – Basis-Stylesheet Die mobilen Anpassungen stehen in mobile.css, die NACH dieser Datei geladen wird. ============================================================ */ :root { --bg-color: #f4f6f9; --card-bg: #ffffff; --primary: #3498db; --primary-dark: #2c3e50; --primary-sub: #9b59b6; --primary-sub-hover: #8e44ad; --danger: #e74c3c; --text: #2c3e50; --text-dark: #2c3e50; --text-muted: #7f8c8d; --border: #dcdde1; --border-light: #e2e8f0; --shadow-soft: 0 1px 3px rgba(0, 0, 0, 0.02); --card-shadow: 0 4px 6px rgba(0, 0, 0, 0.05), 0 1px 3px rgba(0, 0, 0, 0.03); --transition: all 0.2s ease-in-out; } /* ============================================================ GRUNDGERÜST ============================================================ */ body {font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-color:var(--bg-color); color:var(--text); margin:0; padding:0;} /* Gilt für den einfachen Seitenkopf (z.B. scanner.php) UND als Flex-Basis für .main-header – beide Regeln greifen dort gemeinsam. */ header {background:#2c3e50; color:white; padding:15px 30px; display:flex; justify-content:space-between; align-items:center;} .container {max-width:80%; margin:30px auto; padding:0 15px;} .card {background:var(--card-bg); padding:25px; border-radius:8px; box-shadow:0 4px 6px rgba(0,0,0,0.1); margin-bottom:30px;} .inline-form {display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap;} input, select, button {padding:10px; border:1px solid var(--border); border-radius:4px; font-size:14px;} button {background:var(--primary); color:white; border:none; cursor:pointer;} button:hover { opacity:0.9; } table {width:100%; border-collapse:collapse; margin-top:10px;} th, td {padding:12px; text-align:left; border-bottom:1px solid var(--border);} th { background:#f8f9fa; } /* ============================================================ STATUS-ABZEICHEN UND BUTTONS ============================================================ */ .badge { padding:5px 10px; border-radius:4px; font-weight:bold; font-size:12px; color:white; display:inline-block; } .badge-present { background-color:#2ecc71; } .badge-absent { background-color:#7f8c8d; } .btn-edit { background:#f1f2f6; color:var(--text); padding:6px 10px; border-radius:4px; cursor:pointer; } .btn-maps { text-decoration:none; color:#44bd32; font-weight:bold; } /* ============================================================ LOGIN-LAYOUT ============================================================ */ .login-body { display:flex; justify-content:center; align-items:center; height:100vh; background:#2c3e50; } .login-card { background:white; padding:40px; border-radius:8px; width:300px; } .login-card form { display:flex; flex-direction:column; gap:15px; } /* ============================================================ BENUTZERVERWALTUNG – EINGABEFELDER MIT SCHWEBENDEM LABEL ============================================================ */ .input-wrapper { position:relative; margin-top:20px; width:400px; } .input-wrapper input { width:100%; padding:12px; border:2px solid #ccc; border-radius:4px; font-size:16px; outline:none; } .input-wrapper label { position:absolute; left:12px; top:-10px; background-color:white; padding:0 5px; font-size:14px; color:#666; } .input-wrapper input:focus { border-color:#007bff; } .input-wrapper input:focus + label { color:#007bff; } .select-wrapper { position: relative; ;margin-top: 20px; ;width: 400px; } .select-wrapper select { width: 100%; ;padding: 12px; ;border: 2px solid #ccc; ;border-radius: 4px; ;font-size: 16px; ;outline: none; ;background-color: white; ;cursor: pointer; ;appearance: none; /* Entfernt das Standard-Design des Browsers */ ;-webkit-appearance: none;} .select-wrapper label { position: absolute; ;left: 12px; ;top: -10px; /* Verschiebt das Label hoch auf den Rahmen */ ;background-color: white; /* Überdeckt die Rahmenlinie */ ;padding: 0 5px; /* Schafft Platz links und rechts vom Text */ ;font-size: 14px; ;color: #666; ;pointer-events: none; /* Klicks gehen durch das Label hindurch auf das Select-Feld */} .select-wrapper select:focus { border-color: #007bff;} .select-wrapper select:focus + label { color: #007bff;} /* ============================================================ QR-VERWALTUNG ============================================================ */ .qr-canvas-container { display:flex; flex-direction:column; align-items:center; justify-content:center; background:#fff; padding:10px; border:1px solid #eee; border-radius:4px; } .btn-print { background:#27ae60; color:white; padding:5px 10px; border:none; border-radius:4px; cursor:pointer; font-size:12px; margin-top:5px; text-decoration:none; display:inline-block; } /* ============================================================ OBJEKT-ÜBERSICHT (object_schedule_list.php) ============================================================ */ .object-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:20px; margin-top:20px; } .object-card { background:var(--card-bg); text-align:center; padding:30px; border-radius:8px; border-top:4px solid var(--primary); box-shadow:0 4px 6px rgba(0,0,0,0.1); } .object-card:hover {transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08); border-top: 4px solid #27ae60; } .object-card a { display: inline-block; margin-top: 15px; background: var(--primary); color: white; padding: 10px 20px; text-decoration: none; border-radius: 4px; font-weight: bold; } .object-card a:hover { background: #27ae60; } .object-info h3 {margin: 0 0 8px 0; color: #2c3e50;font-size: 18px;} .object-info p {margin: 0 0 15px 0; color: #7f8c8d;font-size: 12px;} .btn-calendar {display: block;text-align: center;background: #2980b9;color: white;text-decoration: none;padding: 10px;border-radius: 4px} .btn-calendar:hover {background: #2471a3;} .no-objects { text-align: center;color: #7f8c8d;padding: 40px;background: #ffffff;border-radius: 6px;border: 1px solid var(--border);} /* ============================================================ LOGIN-PROTOKOLL (view_login_logs.php) ============================================================ */ .badge-success { background-color: #2ecc71; } .badge-failed { background-color: #e74c3c; } .row-failed { background-color: #fff5f5; } .ip-warning { color: #d32f2f; background-color: #ffebee; padding: 4px 8px; border-radius: 4px; font-weight: bold; border: 1px solid #ffcdd2; display: inline-block;} .ip-normal { color: #2c3e50;font-family: monospace;} /* ============================================================ SCHICHTKALENDER (object_calendar_manage.php) ============================================================ */ .shift-badge { background: #f1f2f6; font-size: 11px; padding: 8px; border-radius: 4px; margin-bottom: 5px; display: flex; justify-content: space-between; align-items: center; border-left: 3px solid var(--primary); } .btn-shift-action { background: none; border: none; cursor: pointer; padding: 0; font-size: 13px; } /* ============================================================ SCHICHTLISTEN (view_main_shifts.php / view_my_shifts.php) ============================================================ */ .calendar-list-container {display: flex; flex-direction: column; gap: 8px; margin-top: 20px;} .day-list-row {background: #ffffff; border: 1px solid var(--border-light); border-radius: 6px; padding: 12px 15px; display: flex; align-items: center; justify-content: space-between; gap: 20px; box-shadow: var(--shadow-soft);} .day-list-row.today {border-color: var(--primary-sub); background: #faf0fc;} .day-title-shift {font-weight: bold; min-width: 140px; flex-shrink: 0; display: flex; align-items: center; gap: 15px;} .day-number {font-size: 24px; font-weight: bold; min-width: 35px; text-align: right;} .day-number.weekend {color: var(--text-muted);} .day-number.workday {color: var(--text-dark);} .month-label {font-size: 14px; font-weight: bold; display: block; color: var(--text-dark);} .weekday-label {font-size: 12px;} .weekday-label.weekend {color: #e74c3c;} .weekday-label.workday {color: var(--text-muted);} .shifts-wrapper {flex: 1; display: flex; flex-direction: column; gap: 6px;} .no-shifts-text {color: var(--text-muted); font-size: 13px; font-style: italic;} .shifts-inner-list {display: flex; flex-direction: column; gap: 5px; width: 100%;} .shift-badge-sub {background: #faf0fc; font-size: 11px; padding: 8px 12px; border-radius: 4px; border-left: 4px solid var(--primary-sub); display: flex; align-items: center; justify-content: space-between; gap: 15px; flex: 1;} .shift-info-meta {display: flex; align-items: center; gap: 20px; flex-wrap: wrap; flex: 1;} .location-name {font-size: 13px; font-weight: bold; color: var(--text-dark);} .time-range {font-size: 13px; font-weight: bold; color: var(--text-dark);} .overnight-icon {color: var(--primary-sub); font-size: 11px;} .actions-and-status {display: flex; gap: 15px; align-items: center; flex-shrink: 0;} .live-counter {background: var(--primary-sub); color: white; padding: 4px 12px; border-radius: 20px; font-size: 12px; font-weight: bold; flex-shrink: 0;} .live-counter.full {background: #e74c3c;} .btn-assign {text-decoration: none; padding: 5px 12px; font-size: 12px; background: var(--primary-sub); color: white; font-weight: bold; border-radius: 4px; transition: background 0.2s;} .btn-assign:hover {background: var(--primary-sub-hover);} .filter-flex-container {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px;} .filter-form-wrapper {display: flex; gap: 15px; align-items: center; flex-wrap: wrap; width: 100%; max-width: 500px;} .filter-input-group {flex: 1; min-width: 250px;} .filter-input-group label {font-size: 11px; font-weight: bold; color: #555; text-transform: uppercase; display: block; margin-bottom: 4px;} .filter-select {border: 1px solid #dcdde1; padding: 8px; border-radius: 4px; width: 100%; background: white; font-size: 13px; font-weight: bold; cursor: pointer;} .navigator-wrapper {display: flex; align-items: center;} .navigator-current {margin: 0 15px; font-size: 15px; color: var(--text-dark); background: #eef2f5; padding: 6px 15px; border-radius: 20px;} /* ============================================================ FEHLGESCHLAGENE SCANS (view_failed_scans.php) ============================================================ */ .reason-text { color: #c0392b; font-weight: 500; } .danger-card { border-top: 4px solid #e74c3c; } /* ============================================================ SCHICHTZUWEISUNG (object_shift_assign.php) ============================================================ */ .info-panel {background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);border-left: 5px solid #2980b9;padding: 20px;border-radius: 8px;margin-bottom: 25px;box-shadow: var(--card-shadow);} .info-panel h2 {margin: 0 0 5px 0;color: var(--primary-dark);font-size: 22px;} .info-panel p {margin: 0;color: #4a5568;font-size: 15px;font-weight: 500;} .info-panel .highlight {color: #2b6cb0;} .slot-grid {display: grid;grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));gap: 20px;margin-top: 15px;} .slot-card {background: #ffffff;border: 1px solid var(--border-light);border-radius: 10px;padding: 20px;box-shadow: var(--card-shadow);display: flex;flex-direction: column;gap: 15px;position: relative;transition: var(--transition);} .slot-card:hover {transform: translateY(-2px);box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);} .form-group-shift {display: flex;flex-direction: column;gap: 6px;} .form-group-shift label {font-size: 11px;font-weight: bold;text-transform: uppercase;color: var(--text-muted);letter-spacing: 0.5px;} .form-control {width: 100%;padding: 10px;border-radius: 6px;border: 1px solid #cbd5e0;background-color: #ffffff;font-size: 14px;color: var(--text-dark);box-sizing: border-box;transition: var(--transition);} .form-control:focus {outline: none;border-color: #3182ce;box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.15);} .live-worker-text {font-size: 15px;font-weight: bold;padding: 4px 0;} .option-blocked {color: #c0392b;background: #fdf2f2;} .badge-shift {display: inline-flex;align-items: center;padding: 6px 12px;border-radius: 20px;font-size: 11px;font-weight: bold;text-transform: uppercase;width: fit-content;} .badge-success-shift {background: #2ecc71;color: white;} .submit-btn {background: #27ae60;color: white;border: none;padding: 14px 35px;font-size: 16px;font-weight: bold;border-radius: 50px;cursor: pointer;box-shadow: 0 4px 6px rgba(39, 174, 96, 0.2);transition: var(--transition);display: block;margin: 30px 0 0 auto;} .submit-btn:hover {background: #219653;transform: translateY(-1px);box-shadow: 0 6px 12px rgba(39, 174, 96, 0.25);} /* Status-Zustände für Karten */ .slot-card.status-live {border-color: #2ecc71;background: #f4fbf7;} .slot-card.status-beendet {border-color: #ff0000;background: #f7cfcf;opacity: 0.85;} .slot-number {position: absolute;top: 15px;right: 15px;background: #edf2f7;color: #4a5568;font-size: 11px;font-weight: bold;padding: 4px 8px;border-radius: 20px;} .slot-title {font-size: 16px;font-weight: bold;color: var(--text-dark);margin: 0;display: flex;align-items: center;gap: 8px;} /* ============================================================ SCANNER-ANZEIGE (scanner.php) ============================================================ */ .action-indicator { padding:15px; margin-bottom:15px; border-radius:6px; font-weight:bold; font-size:18px; text-align:center; } .status-check_in { background:#e3f2fd; color:#0d47a1; border:2px solid #1e88e5; } .status-check_out { background:#ffebee; color:#b71c1c; border:2px solid #e53935; } /* ============================================================ LIVE-STATUS (live_status.php) ============================================================ */ .stats-container { display:flex; gap:20px; margin-bottom:20px; } .stats-box { background:#fff; padding:15px 25px; border-radius:6px; border-left:5px solid var(--primary); box-shadow:0 2px 5px rgba(0,0,0,0.05); } .stats-box.active { border-left-color:#2ecc71; } .stats-number { font-size:24px; font-weight:bold; margin-top:5px; } /* ============================================================ OBJEKT-AUSWERTUNG (view_object_reports.php) ============================================================ */ .grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; margin-bottom: 15px; } .mini-card { background: #f8f9fa; padding: 15px; border-radius: 6px; border: 1px solid var(--border); text-align: center; } .mini-card h4 { margin: 0 0 5px 0; font-size: 11px; text-transform: uppercase; color: #7f8c8d; } .mini-card p { margin: 0; font-size: 18px; font-weight: bold; } .live-pulse { display: inline-block; width: 8px; height: 8px; background: #2ecc71; border-radius: 50%; margin-right: 5px; animation: pulse 1.5s infinite; } @keyframes pulse { 0% { opacity: 0.4; } 50% { opacity: 1; } 100% { opacity: 0.4; } } /* ============================================================ DASHBOARD-MENÜ (dashboard.php) ============================================================ */ .menu-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-top: 20px; } .menu-box { text-align: center; padding: 30px; border-top: 4px solid var(--primary); } .menu-box:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08); border-top: 4px solid #27ae60; } .menu-box a { display: inline-block; margin-top: 15px; background: var(--primary); color: white; padding: 10px 20px; text-decoration: none; border-radius: 4px; font-weight: bold; } .menu-box a:hover { background: #27ae60; } /* ============================================================ FILTERMASKEN (view_logs_admin.php / view_object_reports.php) ============================================================ */ .filter-card { background:#f8f9fa; border:1px solid var(--border); padding:15px; margin-bottom:20px; border-radius:6px; } .filter-form { display:flex; gap:15px; flex-wrap:wrap; align-items:flex-end; } .filter-group { display:flex; flex-direction:column; gap:5px; } .filter-group label { font-size:12px; font-weight:bold; color:#555; } .btn-reset { background:#7f8c8d; color:white; text-decoration:none; padding:10px 15px; border-radius:4px; font-size:14px; text-align:center; } /* ============================================================ SPINNER FÜR LOGOUT (logout.php) ============================================================ */ .logout-box { text-align:center; padding:30px; } .spinner { border:4px solid rgba(0,0,0,0.1); width:36px; height:36px; border-radius:50%; border-left-color:#3498db; animation:spin 1s linear infinite; margin:20px auto; } @keyframes spin { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } } /* ============================================================ MODAL-FENSTER ============================================================ */ .modal {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(44, 62, 80, 0.7); backdrop-filter:blur(4px); justify-content:center; align-items:center; z-index:9999; padding:20px; box-sizing:border-box;} .modal-content {background:var(--card-bg); padding:35px; border-radius:8px; width:100%; max-width:500px; max-height:90vh; overflow-y:auto; box-shadow:0 10px 25px rgba(0,0,0,0.2); animation:modalFadeIn 0.3s ease-out;} .modal-content h3 {margin-top:0; margin-bottom:25px; color:var(--text); font-size:22px; border-bottom:2px solid var(--border); padding-bottom:10px;} .modal-content label {font-weight:bold; font-size:13px; color:#555; margin-bottom:-5px; grid-column:span 2;} .modal-content input {width:100%; box-sizing:border-box; padding:12px; font-size:15px;} .modal-content input[type="email"] {grid-column:span 2;} .modal-actions {grid-column:span 2; display:flex; justify-content:flex-end; gap:12px; margin-top:20px; border-top:1px solid var(--border); padding-top:20px;} .modal-actions button {padding:12px 25px; font-size:15px; font-weight:bold;} @keyframes modalFadeIn { from { opacity:0; transform:translateY(-20px); } to { opacity:1; transform:translateY(0); } } /* ============================================================ HEADER UND NAVIGATION ============================================================ */ .main-header {background-color:#2c3e50; box-shadow:0 2px 10px rgba(0,0,0,0.15); position:sticky; top:0; z-index:9999; font-family:'Segoe UI', Arial, sans-serif;} .header-container {max-width:80%; margin:0 auto; display:flex; justify-content:space-between; align-items:center; padding:0 20px; height:65px;} /* Navigations-Struktur */ .nav-bar {height:100%;} .nav-menu {list-style:none; margin:0; padding:0; display:flex; height:100%; align-items:center;} .nav-menu > li {position:relative; height:100%; display:flex; align-items:center;} .nav-menu > li > a, .dropdown-trigger {color:#ecf0f1; text-decoration:none; padding:0 20px; height:100%; display:flex; align-items:center; font-weight:500; font-size:15px; transition:background 0.2s, color 0.2s; cursor:pointer;} .nav-menu > li:hover > a, .dropdown-trigger:hover {background-color:#34495e; color:#3498db;} /* Dropdown-Logik */ .dropdown-menu {position:absolute; top:65px; left:0; background-color:#ffffff; min-width:240px; box-shadow:0 8px 16px rgba(0,0,0,0.15); list-style:none; padding:10px 0; margin:0; border-radius:0 0 6px 6px; border-top:3px solid #3498db; opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity 0.2s, transform 0.2s, visibility 0.2s;} .dropdown-menu li a {color:#2c3e50; padding:12px 20px; text-decoration:none; display:block; font-size:14px; font-weight:400; transition:background 0.15s, color 0.15s;} .dropdown-menu li a:hover {background-color:#f8fafc; color:#3498db; padding-left:25px;} .dropdown:hover .dropdown-menu {opacity:1; visibility:visible; transform:translateY(0);} /* Rechte Zone: Benutzer und Logout */ .user-status-zone {display:flex; align-items:center; gap:15px;} .user-badge {font-size:12px; font-weight:bold; padding:5px 10px; border-radius:20px; color:white;} .user-badge.admin { background-color:#e74c3c; } .user-badge.subcontractor { background-color:#f39c12; } /* Diese drei Rollen hatten bisher keine Farbe und damit keine erkennbare Plakette */ .user-badge.dispatcher { background-color:#2980b9; } .user-badge.view { background-color:#7f8c8d; } .user-badge.employee { background-color:#27ae60; } .btn-logout {color:#95a5a6; text-decoration:none; font-size:14px; padding:8px 12px; border:1px solid #7f8c8d; border-radius:4px; transition:all 0.2s;} .btn-logout:hover {color:#ffffff; background-color:#c0392b; border-color:#c0392b;} /* Hamburger-Button (auf dem Desktop ausgeblendet) */ .menu-toggle {display:none; flex-direction:column; justify-content:space-between; width:30px; height:21px; background:transparent; border:none; cursor:pointer; padding:0; z-index:10000;} .menu-toggle span {width:100%; height:3px; background-color:#ffffff; border-radius:2px; transition:all 0.3s ease-in-out;} /* Animation zum "X", wenn aktiv */ .menu-toggle.toggle-active span:nth-child(1) {transform:translateY(9px) rotate(45deg);} .menu-toggle.toggle-active span:nth-child(2) {opacity:0;} .menu-toggle.toggle-active span:nth-child(3) {transform:translateY(-9px) rotate(-45deg);} /* ------------------------------------------------------------ Navigation auf Smartphones und Tablets (weitere mobile Korrekturen stehen in mobile.css) ------------------------------------------------------------ */ @media (max-width:992px) { .menu-toggle {display:flex;} .header-container {justify-content:space-between;} /* Versteckt die Navigation standardmäßig außerhalb des Bildschirms */ .nav-bar {position:absolute; top:65px; left:0; width:100%; background-color:#2c3e50; flex-direction:column; align-items:stretch; max-height:0; overflow:hidden; transition:max-height 0.3s ease-in-out; box-shadow:0 4px 10px rgba(0,0,0,0.2);} /* Wird per JavaScript vergeben, um das Menü auszurollen */ .nav-bar.nav-active {max-height:90vh; overflow-y:auto;} .nav-menu {flex-direction:column; width:100%; gap:0;} .nav-menu > li {width:100%; border-bottom:1px solid #34495e;} .nav-menu > li > a, .dropdown-trigger {padding:15px 20px; width:100%; box-sizing:border-box; justify-content:space-between;} /* Mobiles Dropdown-Verhalten: per Klick einblenden */ .dropdown-menu {position:relative; top:0; width:100%; background-color:#1a252f; box-shadow:none; border-top:none; border-left:4px solid var(--primary); border-radius:0; display:none; transform:none; opacity:1; visibility:visible; padding:5px 0;} .dropdown.dropdown-active .dropdown-menu {display:block;} .dropdown-menu li a {color:#ecf0f1; padding:12px 35px;} .user-status-zone {width:100%; padding:20px; box-sizing:border-box;} } /* ============================================================ OBJEKT-FORMULAR (object_management.php) ============================================================ */ .object-form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 30px; width: 100%;} .object-form-left, .object-form-right { min-width: 0;} /* Formularfelder */ .form-group { margin-bottom: 18px;} .form-group label { display: block; margin-bottom: 6px; font-weight: bold;} .label-hint { font-weight: normal; color: #777; font-size: 13px;} .form-group input { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #ccc; border-radius: 5px; font-size: 15px; background: #fff;} .form-group input:focus { outline: none; border-color: #3498db; box-shadow: 0 0 0 2px rgba(52, 152, 219, 0.12);} /* Latitude + Longitude */ .coordinates-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px;} /* Adresssuche */ .address-search-row { display: flex; gap: 8px;} .address-search-row input { flex: 1; min-width: 0;} .address-search-button { flex-shrink: 0; padding: 10px 18px; border: none; border-radius: 5px; background: #2980b9; color: white; font-size: 15px; cursor: pointer;} .address-search-button:hover { background: #2471a3;} .address-search-button:disabled { background: #95a5a6; cursor: wait;} .address-status { min-height: 20px; margin-top: 7px; font-size: 13px; color: #666;} /* Karte */ .map-wrapper { margin-top: 5px;} .map-hint { margin-bottom: 7px; color: #666; font-size: 13px;} #object-map { width: 100%; height: 430px; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);} /* Button "Objekt anlegen" */ .object-submit-button { margin-top: 5px; padding: 11px 22px; border: none; border-radius: 5px; background: #27ae60; color: white; font-size: 15px; cursor: pointer;} .object-submit-button:hover { background: #219150;} /* Tablet / kleinere Bildschirme */ @media (max-width: 900px) { .object-form-grid { grid-template-columns: 1fr; } #object-map { height: 400px; } } /* Handy */ @media (max-width: 600px) { .coordinates-row { grid-template-columns: 1fr; } .address-search-row { flex-direction: column; } .address-search-button { width: 100%; } #object-map { height: 350px; } } /* ============================================================ ANMELDE- UND KONTOSEITEN forgot_password.php, reset_password.php, change_password.php Vorher lagen diese Regeln als