100 lines
1.9 KiB
CSS
100 lines
1.9 KiB
CSS
:root {
|
|
--main: #2d2726;
|
|
--bg: #FDFDFD;
|
|
--border-subtle: #d4d7e1;
|
|
--text-main: #191919;
|
|
--text-muted: #5e5e5e;
|
|
--paddingSite: 20px;
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
:root {
|
|
--main: #f0f0f0; /* Flipped to a bright off-white for main accents/highlights */
|
|
--bg: #121212; /* Dark background (replacing the near-white #FDFDFD) */
|
|
--border-subtle: #2d2d2d; /* Soft, dark border that won't clip harshly against the background */
|
|
--text-main: #f5f5f5; /* Light grey/white for high readability */
|
|
--text-muted: #a0a0a0; /* Mid-tone grey for secondary text */
|
|
--paddingSite: 20px; /* Kept identical for layout consistency */
|
|
}
|
|
}
|
|
|
|
/* --- BASE & TYPOGRAPHY --- */
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
box-sizing: border-box;
|
|
-webkit-tap-highlight-color: transparent;
|
|
}
|
|
|
|
b {
|
|
font-weight: 600;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
width: 100vw;
|
|
background: var(--bg);
|
|
color: var(--text-main);
|
|
overflow-x: hidden;
|
|
overscroll-behavior: none;
|
|
font-optical-sizing: auto;
|
|
}
|
|
|
|
.bgSection {
|
|
position: relative;
|
|
width: 100vw;
|
|
margin: 100px auto 80px auto;
|
|
padding: var(--paddingSite);
|
|
max-width: 1800px;
|
|
}
|
|
|
|
@media (max-width: 600px) {
|
|
.bgSection {
|
|
margin-top: 100px;
|
|
}
|
|
}
|
|
|
|
.headerWrapper {
|
|
margin: 40px 0;
|
|
color: var(--main);
|
|
text-align: center;
|
|
}
|
|
|
|
.headerMain {
|
|
margin: 0 0 10px 0;
|
|
font-weight: 200;
|
|
font-size: clamp(34px, 6vw, 3.5rem);
|
|
letter-spacing: 12px;
|
|
position: relative;
|
|
z-index: 4;
|
|
}
|
|
|
|
.headerWrapper > h4 {
|
|
margin: 0 0 10px 0;
|
|
letter-spacing: 3px;
|
|
font-weight: 300;
|
|
}
|
|
|
|
.headerAbt {
|
|
margin: 0;
|
|
font-weight: 400;
|
|
color: var(--main);
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.tableCutter {
|
|
height: 120px;
|
|
z-index: 3;
|
|
width: 100%;
|
|
position: fixed;
|
|
top: 0;
|
|
background: var(--bg);
|
|
}
|
|
|
|
.tableWraper {
|
|
margin: 20px 0 80px 0;
|
|
}
|
|
|
|
.customDisplayEditorTable th {
|
|
top: 120px !important;
|
|
} |