601 lines
16 KiB
CSS
601 lines
16 KiB
CSS
/* =================================================================
|
|
Human Body Neural & Circulation Lab — Koyu Bilimsel Laboratuvar
|
|
================================================================= */
|
|
|
|
:root {
|
|
--bg: #05070d;
|
|
--bg-2: #0a0f1a;
|
|
--panel: rgba(15, 23, 42, 0.72);
|
|
--panel-solid: #0f172a;
|
|
--border: rgba(56, 189, 248, 0.16);
|
|
--border-2: rgba(94, 234, 212, 0.28);
|
|
--text: #e2e8f0;
|
|
--text-dim: #b6c4d6; /* WCAG AA icin acildi (eski #94a3b8) */
|
|
--text-faint: #8fa3ba; /* WCAG AA icin acildi (eski #64748b) */
|
|
--cyan: #22d3ee;
|
|
--teal: #5eead4;
|
|
--red: #ef4444;
|
|
--blue: #3b82f6;
|
|
--amber: #f59e0b;
|
|
--purple: #a855f7;
|
|
--green: #4ade80;
|
|
--radius: 10px;
|
|
--gap: 12px;
|
|
}
|
|
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
|
|
html, body {
|
|
height: 100%;
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
|
|
font-size: 14px;
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
background:
|
|
radial-gradient(1200px 600px at 20% -10%, rgba(34, 211, 238, 0.07), transparent 60%),
|
|
radial-gradient(900px 500px at 90% 10%, rgba(168, 85, 247, 0.06), transparent 60%),
|
|
var(--bg);
|
|
}
|
|
|
|
/* ---------------- TOPBAR ---------------- */
|
|
.topbar {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
padding: 12px 20px;
|
|
border-bottom: 1px solid var(--border);
|
|
background: linear-gradient(180deg, rgba(10, 15, 26, 0.95), rgba(10, 15, 26, 0.55));
|
|
backdrop-filter: blur(8px);
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 20;
|
|
}
|
|
|
|
.brand { display: flex; align-items: center; gap: 12px; }
|
|
|
|
.logo {
|
|
width: 40px; height: 40px;
|
|
display: grid; place-items: center;
|
|
border-radius: 11px;
|
|
font-size: 22px;
|
|
font-weight: 700;
|
|
/* Koyu metin + acik gradient = yuksek kontrast (WCAG AA) */
|
|
color: #021014;
|
|
background: linear-gradient(135deg, #2dd4bf, #7dd3fc);
|
|
box-shadow: 0 0 20px rgba(34, 211, 238, 0.35);
|
|
}
|
|
|
|
.brand h1 {
|
|
font-size: 15px;
|
|
font-weight: 700;
|
|
letter-spacing: 0.2px;
|
|
}
|
|
.brand h1 span { color: var(--cyan); font-weight: 600; }
|
|
.brand .sub { font-size: 11px; color: var(--text-faint); margin-top: 2px; }
|
|
|
|
.topbar-right { display: flex; align-items: center; gap: 14px; }
|
|
|
|
.sim-clock {
|
|
text-align: right;
|
|
padding: 5px 12px;
|
|
border: 1px solid var(--border);
|
|
border-radius: 8px;
|
|
background: rgba(2, 6, 23, 0.6);
|
|
}
|
|
.sim-clock .lbl { display: block; font-size: 9px; letter-spacing: 1.1px; color: var(--text-faint); }
|
|
.sim-clock strong { font-family: ui-monospace, monospace; font-size: 16px; color: var(--teal); }
|
|
|
|
.numex-tag {
|
|
font-size: 10px;
|
|
letter-spacing: 1.4px;
|
|
padding: 5px 10px;
|
|
border-radius: 999px;
|
|
color: var(--teal);
|
|
border: 1px solid var(--border-2);
|
|
background: rgba(94, 234, 212, 0.07);
|
|
}
|
|
|
|
/* ---------------- LAYOUT ---------------- */
|
|
.layout {
|
|
flex: 1;
|
|
display: grid;
|
|
grid-template-columns: 292px minmax(0, 1fr) 306px;
|
|
gap: var(--gap);
|
|
padding: var(--gap);
|
|
min-height: 0;
|
|
}
|
|
|
|
.panel {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--gap);
|
|
min-height: 0;
|
|
}
|
|
|
|
.panel-left, .panel-right {
|
|
overflow-y: auto;
|
|
padding-right: 4px;
|
|
scrollbar-width: thin;
|
|
scrollbar-color: rgba(94, 234, 212, 0.35) transparent;
|
|
}
|
|
.panel-left::-webkit-scrollbar, .panel-right::-webkit-scrollbar { width: 6px; }
|
|
.panel-left::-webkit-scrollbar-thumb, .panel-right::-webkit-scrollbar-thumb {
|
|
background: rgba(94, 234, 212, 0.3);
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.block {
|
|
background: var(--panel);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
padding: 12px;
|
|
backdrop-filter: blur(6px);
|
|
flex-shrink: 0; /* bloklar sikismasin */
|
|
}
|
|
.block.grow {
|
|
flex: 1 1 auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 140px; /* senaryo listesi icin taban */
|
|
overflow: hidden; /* tasma listede kalir, disari sizmaz */
|
|
}
|
|
|
|
.block-title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 7px;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
letter-spacing: 1.1px;
|
|
text-transform: uppercase;
|
|
color: var(--teal);
|
|
margin-bottom: 10px;
|
|
}
|
|
.block-title span { font-size: 13px; }
|
|
|
|
/* ---------------- BUTONLAR ---------------- */
|
|
.btn-row { display: flex; gap: 8px; margin-bottom: 10px; }
|
|
|
|
.btn {
|
|
flex: 1;
|
|
min-height: 44px; /* mobil dokunma hedefi (WCAG) */
|
|
padding: 10px 12px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
font-family: inherit;
|
|
color: var(--text);
|
|
background: rgba(30, 41, 59, 0.8);
|
|
border: 1px solid var(--border);
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
transition: all 0.16s ease;
|
|
}
|
|
.btn:hover {
|
|
background: rgba(51, 65, 85, 0.9);
|
|
border-color: var(--border-2);
|
|
transform: translateY(-1px);
|
|
}
|
|
.btn:active { transform: translateY(0); }
|
|
|
|
.btn-primary {
|
|
color: #04121a;
|
|
background: linear-gradient(135deg, var(--teal), var(--cyan));
|
|
border-color: transparent;
|
|
box-shadow: 0 0 16px rgba(34, 211, 238, 0.25);
|
|
}
|
|
.btn-primary:hover { background: linear-gradient(135deg, var(--cyan), var(--teal)); }
|
|
.btn-primary.paused {
|
|
background: linear-gradient(135deg, var(--amber), #fbbf24);
|
|
color: #1a1204;
|
|
box-shadow: 0 0 16px rgba(245, 158, 11, 0.3);
|
|
}
|
|
|
|
.btn-sm { min-height: 44px; padding: 8px 10px; font-size: 11px; }
|
|
|
|
/* ---------------- FORM ---------------- */
|
|
.field { display: block; margin-bottom: 8px; }
|
|
.field-label {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 11px;
|
|
color: var(--text-dim);
|
|
margin-bottom: 5px;
|
|
}
|
|
.field-label b { color: var(--cyan); font-family: ui-monospace, monospace; }
|
|
|
|
/* Slider: ray ince ama DOKUNMA ALANI 44px (mobil WCAG) */
|
|
input[type="range"] {
|
|
width: 100%;
|
|
height: 44px;
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background: transparent;
|
|
outline: none;
|
|
cursor: pointer;
|
|
margin: 0;
|
|
}
|
|
input[type="range"]::-webkit-slider-runnable-track {
|
|
height: 6px;
|
|
border-radius: 3px;
|
|
background: linear-gradient(90deg, var(--cyan), rgba(148, 163, 184, 0.28));
|
|
}
|
|
input[type="range"]::-webkit-slider-thumb {
|
|
-webkit-appearance: none;
|
|
width: 20px; height: 20px;
|
|
margin-top: -7px; /* ray ortasina hizala */
|
|
border-radius: 50%;
|
|
background: var(--teal);
|
|
border: 2px solid #04121a;
|
|
box-shadow: 0 0 10px rgba(94, 234, 212, 0.75);
|
|
cursor: pointer;
|
|
}
|
|
input[type="range"]::-moz-range-track {
|
|
height: 6px;
|
|
border-radius: 3px;
|
|
background: linear-gradient(90deg, var(--cyan), rgba(148, 163, 184, 0.28));
|
|
}
|
|
input[type="range"]::-moz-range-thumb {
|
|
width: 20px; height: 20px;
|
|
border-radius: 50%;
|
|
background: var(--teal);
|
|
border: 2px solid #04121a;
|
|
box-shadow: 0 0 10px rgba(94, 234, 212, 0.75);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.hint {
|
|
font-size: 10px;
|
|
color: var(--text-faint);
|
|
line-height: 1.45;
|
|
margin-top: 6px;
|
|
}
|
|
|
|
/* ---------------- SENARYOLAR ---------------- */
|
|
/* flex:1 + min-height:0 → liste ebeveynine SIGAR, tasmaz ve
|
|
alttaki elemanlarin tiklamasini ENGELLEMEZ (pointer-intercept fix) */
|
|
.scenario-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1 1 auto;
|
|
gap: 6px;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
min-height: 0;
|
|
max-height: 100%;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.scenario-btn {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 9px;
|
|
padding: 9px 10px;
|
|
text-align: left;
|
|
font-family: inherit;
|
|
color: var(--text);
|
|
background: rgba(2, 6, 23, 0.5);
|
|
border: 1px solid var(--border);
|
|
border-left: 3px solid transparent;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
transition: all 0.16s ease;
|
|
}
|
|
.scenario-btn:hover {
|
|
background: rgba(30, 41, 59, 0.75);
|
|
border-left-color: rgba(94, 234, 212, 0.5);
|
|
}
|
|
.scenario-btn.active {
|
|
background: rgba(94, 234, 212, 0.11);
|
|
border-color: var(--border-2);
|
|
border-left-color: var(--teal);
|
|
box-shadow: 0 0 14px rgba(94, 234, 212, 0.12);
|
|
}
|
|
|
|
.sc-icon { font-size: 16px; line-height: 1; margin-top: 1px; }
|
|
.sc-body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
|
|
.sc-body strong { font-size: 12px; font-weight: 600; }
|
|
.sc-body small { font-size: 10px; color: var(--text-faint); line-height: 1.4; }
|
|
|
|
.scenario-desc {
|
|
margin-top: 9px;
|
|
padding: 8px 10px;
|
|
font-size: 11px;
|
|
line-height: 1.5;
|
|
color: var(--cyan);
|
|
background: rgba(34, 211, 238, 0.06);
|
|
border: 1px solid rgba(34, 211, 238, 0.18);
|
|
border-radius: 7px;
|
|
}
|
|
|
|
/* ---------------- KISAYOLLAR ---------------- */
|
|
.keys { list-style: none; display: flex; flex-direction: column; gap: 5px; }
|
|
.keys li { font-size: 11px; color: var(--text-dim); display: flex; align-items: center; gap: 6px; }
|
|
kbd {
|
|
display: inline-block;
|
|
min-width: 20px;
|
|
padding: 2px 5px;
|
|
font-family: ui-monospace, monospace;
|
|
font-size: 10px;
|
|
text-align: center;
|
|
color: var(--text);
|
|
background: rgba(51, 65, 85, 0.8);
|
|
border: 1px solid rgba(148, 163, 184, 0.3);
|
|
border-bottom-width: 2px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
/* ---------------- ORTA PANEL / CANVAS ---------------- */
|
|
.panel-center { min-height: 520px; }
|
|
|
|
.canvas-wrap {
|
|
position: relative;
|
|
flex: 1;
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
overflow: hidden;
|
|
background: var(--bg-2);
|
|
box-shadow: inset 0 0 60px rgba(34, 211, 238, 0.04), 0 8px 30px rgba(0, 0, 0, 0.4);
|
|
min-height: 0;
|
|
}
|
|
|
|
#body-canvas {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
touch-action: none;
|
|
}
|
|
|
|
.canvas-hint {
|
|
position: absolute;
|
|
top: 12px;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 7px;
|
|
padding: 6px 13px;
|
|
font-size: 11px;
|
|
color: var(--cyan);
|
|
background: rgba(2, 6, 23, 0.82);
|
|
border: 1px solid rgba(34, 211, 238, 0.24);
|
|
border-radius: 999px;
|
|
backdrop-filter: blur(6px);
|
|
pointer-events: none;
|
|
white-space: nowrap;
|
|
}
|
|
.canvas-hint .dot {
|
|
width: 6px; height: 6px;
|
|
border-radius: 50%;
|
|
background: var(--cyan);
|
|
box-shadow: 0 0 8px var(--cyan);
|
|
animation: blink 1.6s ease-in-out infinite;
|
|
}
|
|
@keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
|
|
|
|
.legend {
|
|
position: absolute;
|
|
bottom: 12px;
|
|
left: 12px;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 10px;
|
|
padding: 8px 12px;
|
|
background: rgba(2, 6, 23, 0.82);
|
|
border: 1px solid var(--border);
|
|
border-radius: 8px;
|
|
backdrop-filter: blur(6px);
|
|
pointer-events: none;
|
|
}
|
|
.leg { display: flex; align-items: center; gap: 6px; font-size: 10px; color: var(--text-dim); }
|
|
.sw { width: 11px; height: 3px; border-radius: 2px; }
|
|
.sw-artery { background: var(--red); box-shadow: 0 0 6px var(--red); }
|
|
.sw-vein { background: var(--blue); box-shadow: 0 0 6px var(--blue); }
|
|
.sw-motor { background: var(--amber); box-shadow: 0 0 6px var(--amber); }
|
|
.sw-sensory { background: var(--cyan); box-shadow: 0 0 6px var(--cyan); }
|
|
|
|
/* ---------------- METRIKLER ---------------- */
|
|
.metric-hero {
|
|
position: relative;
|
|
padding: 11px 12px 8px;
|
|
border-radius: 9px;
|
|
background: radial-gradient(120% 100% at 0% 0%, rgba(34, 211, 238, 0.09), rgba(2, 6, 23, 0.45));
|
|
border: 1px solid var(--border);
|
|
margin-bottom: 9px;
|
|
}
|
|
.metric-label { font-size: 10px; letter-spacing: 0.9px; color: var(--text-faint); text-transform: uppercase; }
|
|
.metric-value {
|
|
font-family: ui-monospace, monospace;
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
color: var(--text);
|
|
line-height: 1.15;
|
|
}
|
|
.metric-value.big { font-size: 34px; letter-spacing: -1px; }
|
|
.metric-value.good { color: var(--green); }
|
|
.metric-value.warn { color: var(--amber); }
|
|
.metric-value.bad { color: var(--red); text-shadow: 0 0 14px rgba(239, 68, 68, 0.5); }
|
|
.metric-unit { font-size: 10px; color: var(--text-faint); margin-top: -2px; }
|
|
|
|
.metric-badge {
|
|
position: absolute;
|
|
top: 10px; right: 10px;
|
|
font-size: 9px;
|
|
font-weight: 700;
|
|
letter-spacing: 0.8px;
|
|
padding: 3px 8px;
|
|
border-radius: 999px;
|
|
}
|
|
.metric-badge.good { color: var(--green); background: rgba(74, 222, 128, 0.13); border: 1px solid rgba(74, 222, 128, 0.35); }
|
|
.metric-badge.warn { color: var(--amber); background: rgba(245, 158, 11, 0.13); border: 1px solid rgba(245, 158, 11, 0.35); }
|
|
.metric-badge.bad { color: var(--red); background: rgba(239, 68, 68, 0.15); border: 1px solid rgba(239, 68, 68, 0.4); animation: pulseBad 1.3s ease-in-out infinite; }
|
|
@keyframes pulseBad { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
|
|
|
|
.metric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 9px; }
|
|
|
|
.metric {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2px;
|
|
padding: 8px 9px;
|
|
border-radius: 8px;
|
|
background: rgba(2, 6, 23, 0.5);
|
|
border: 1px solid var(--border);
|
|
}
|
|
.metric span { font-size: 9.5px; color: var(--text-faint); letter-spacing: 0.3px; }
|
|
.metric strong {
|
|
font-family: ui-monospace, monospace;
|
|
font-size: 15px;
|
|
font-weight: 700;
|
|
color: var(--text);
|
|
}
|
|
.metric strong.bad { color: var(--red); }
|
|
.metric small { font-size: 9px; color: var(--text-faint); }
|
|
|
|
.metric.last-target { margin-bottom: 0; }
|
|
.metric.last-target strong { font-size: 13px; color: var(--cyan); }
|
|
|
|
.spark {
|
|
display: block;
|
|
width: 100%;
|
|
height: 32px;
|
|
margin-top: 6px;
|
|
border-radius: 5px;
|
|
background: rgba(2, 6, 23, 0.6);
|
|
border: 1px solid rgba(56, 189, 248, 0.1);
|
|
}
|
|
.spark.wide { height: 38px; margin-top: 0; }
|
|
|
|
/* ---------------- OLAY GUNLUGU ---------------- */
|
|
.logbar {
|
|
margin: 0 var(--gap) var(--gap);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius);
|
|
background: var(--panel);
|
|
overflow: hidden;
|
|
backdrop-filter: blur(6px);
|
|
}
|
|
.logbar header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 9px 13px;
|
|
border-bottom: 1px solid var(--border);
|
|
background: rgba(2, 6, 23, 0.5);
|
|
}
|
|
.logbar h2 {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 7px;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
letter-spacing: 1.1px;
|
|
text-transform: uppercase;
|
|
color: var(--teal);
|
|
}
|
|
.log-count-wrap { font-size: 10px; color: var(--text-faint); }
|
|
.log-count-wrap b { color: var(--cyan); font-family: ui-monospace, monospace; }
|
|
|
|
.event-log {
|
|
max-height: 148px;
|
|
overflow-y: auto;
|
|
padding: 6px 8px;
|
|
scrollbar-width: thin;
|
|
scrollbar-color: rgba(94, 234, 212, 0.35) transparent;
|
|
}
|
|
.event-log::-webkit-scrollbar { width: 6px; }
|
|
.event-log::-webkit-scrollbar-thumb { background: rgba(94, 234, 212, 0.3); border-radius: 3px; }
|
|
|
|
.log-entry {
|
|
display: flex;
|
|
gap: 9px;
|
|
padding: 4px 7px;
|
|
font-size: 11px;
|
|
border-radius: 5px;
|
|
border-left: 2px solid transparent;
|
|
animation: logIn 0.25s ease;
|
|
}
|
|
@keyframes logIn { from { opacity: 0; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
|
|
|
|
.log-t {
|
|
flex-shrink: 0;
|
|
font-family: ui-monospace, monospace;
|
|
font-size: 10px;
|
|
color: var(--text-faint);
|
|
min-width: 42px;
|
|
}
|
|
.log-msg { color: var(--text-dim); line-height: 1.45; }
|
|
|
|
.log-info { border-left-color: rgba(56, 189, 248, 0.55); }
|
|
.log-info .log-msg { color: #bae6fd; }
|
|
.log-good { border-left-color: rgba(74, 222, 128, 0.6); }
|
|
.log-good .log-msg { color: #bbf7d0; }
|
|
.log-warn { border-left-color: rgba(245, 158, 11, 0.7); }
|
|
.log-warn .log-msg { color: #fde68a; }
|
|
.log-crit { border-left-color: rgba(239, 68, 68, 0.75); background: rgba(239, 68, 68, 0.06); }
|
|
.log-crit .log-msg { color: #fecaca; }
|
|
|
|
/* ---------------- FOOTER ---------------- */
|
|
.site-footer {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 14px;
|
|
flex-wrap: wrap;
|
|
padding: 9px 20px 14px;
|
|
font-size: 10px;
|
|
color: var(--text-faint);
|
|
border-top: 1px solid rgba(56, 189, 248, 0.08);
|
|
}
|
|
.site-footer .disc { color: #a8b8cc; font-style: italic; }
|
|
|
|
/* ---------------- RESPONSIVE ---------------- */
|
|
@media (max-width: 1180px) {
|
|
.layout {
|
|
grid-template-columns: 260px minmax(0, 1fr);
|
|
grid-template-areas: "left center" "right right";
|
|
}
|
|
.panel-left { grid-area: left; }
|
|
.panel-center { grid-area: center; }
|
|
.panel-right {
|
|
grid-area: right;
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
|
align-items: start;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 780px) {
|
|
.layout {
|
|
grid-template-columns: 1fr;
|
|
grid-template-areas: "center" "left" "right";
|
|
padding: 9px;
|
|
gap: 9px;
|
|
}
|
|
.panel-center { min-height: 460px; }
|
|
.panel-right { grid-template-columns: 1fr; }
|
|
.topbar { flex-wrap: wrap; padding: 10px 13px; }
|
|
.brand h1 { font-size: 13px; }
|
|
.logo { width: 34px; height: 34px; font-size: 18px; }
|
|
.sim-clock strong { font-size: 14px; }
|
|
.numex-tag { display: none; }
|
|
.logbar { margin: 0 9px 9px; }
|
|
.canvas-hint { font-size: 10px; padding: 5px 10px; max-width: calc(100% - 24px); white-space: normal; text-align: center; }
|
|
.legend { gap: 7px; padding: 6px 9px; }
|
|
.leg { font-size: 9px; }
|
|
.metric-value.big { font-size: 28px; }
|
|
.event-log { max-height: 120px; }
|
|
.site-footer { padding: 8px 13px 12px; font-size: 9px; }
|
|
}
|