@font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Regular.latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FB00-FB06,U+FEFF,U+FFFD; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Regular.latinext.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0100-0130,U+0132-0151,U+0154-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-036F,U+0370-03FF,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-2190,U+2192,U+2194-2211,U+2213-2214,U+2216-2FFF,U+A720-A7FF; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Regular.vietipa.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+1D00-1DBF,U+1E00-1EFF; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Regular.cyrillic.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0400-052F,U+1C80-1C88,U+2116,U+20B4,U+2DE0-2DFF,U+A640-A69F; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Italic.latin.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FB00-FB06,U+FEFF,U+FFFD; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Italic.latinext.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+0100-0130,U+0132-0151,U+0154-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-036F,U+0370-03FF,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-2190,U+2192,U+2194-2211,U+2213-2214,U+2216-2FFF,U+A720-A7FF; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Italic.vietipa.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+1D00-1DBF,U+1E00-1EFF; } @font-face { font-family: 'Playfair Display'; src: url('https://12andus.com/mod/theme_extension/fonts/PlayfairDisplay-Italic.cyrillic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+0400-052F,U+1C80-1C88,U+2116,U+20B4,U+2DE0-2DFF,U+A640-A69F; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Regular.latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FB00-FB06,U+FEFF,U+FFFD; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Regular.latinext.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+0100-0130,U+0132-0151,U+0154-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-036F,U+0370-03FF,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-2190,U+2192,U+2194-2211,U+2213-2214,U+2216-2FFF,U+A720-A7FF; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Regular.vietipa.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; unicode-range: U+1D00-1DBF,U+1E00-1EFF; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Italic.latin.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FB00-FB06,U+FEFF,U+FFFD; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Italic.latinext.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+0100-0130,U+0132-0151,U+0154-02BA,U+02BD-02C5,U+02C7-02D9,U+02DB,U+02DD-036F,U+0370-03FF,U+2070-2073,U+2075-20AB,U+20AD-2121,U+2123-2190,U+2192,U+2194-2211,U+2213-2214,U+2216-2FFF,U+A720-A7FF; } @font-face { font-family: 'Source Sans Pro'; src: url('https://12andus.com/mod/theme_extension/fonts/SourceSansPro-Italic.vietipa.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; unicode-range: U+1D00-1DBF,U+1E00-1EFF; } @font-face { font-family: 'EB Garamond'; src: url('https://12andus.com/mod/theme_extension/fonts/EBGaramond-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Asap'; src: url('https://12andus.com/mod/theme_extension/fonts/Asap-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Asap'; src: url('https://12andus.com/mod/theme_extension/fonts/Asap-Italic.ttf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: 'Asap'; src: url('https://12andus.com/mod/theme_extension/fonts/Asap-Bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; } @font-face { font-family: 'Sacramento'; src: url('https://12andus.com/mod/theme_extension/fonts/Sacramento-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Merriweather'; src: url('https://12andus.com/mod/theme_extension/fonts/Merriweather-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Merriweather'; src: url('https://12andus.com/mod/theme_extension/fonts/Merriweather-Italic.ttf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: 'Merriweather'; src: url('https://12andus.com/mod/theme_extension/fonts/Merriweather-LightItalic.ttf') format('truetype'); font-weight: 300; font-style: italic; font-display: swap; } @font-face { font-family: 'HamburgSymbols'; src: url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.eot'); src: url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.eot?#iefix') format('embedded-opentype'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.woff2') format('woff2'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.woff') format('woff'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.ttf') format('truetype'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.svg#hamburgsymbolsregular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'hamburgsymbolsregular'; src: url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.eot'); src: url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.eot?#iefix') format('embedded-opentype'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.woff2') format('woff2'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.woff') format('woff'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.ttf') format('truetype'), url('https://12andus.com/mod/theme_extension/fonts/hamburgsymbols-webfont.svg#hamburgsymbolsregular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } :root { --color-void: #0a0a12; --color-cosmos: #0d1321; --color-nebula: #151b2d; --color-twilight: #1d2541; --color-stardust: #c9b8ff; --color-moonbeam: #e8e4f0; --color-aurora-teal: #00d4aa; --color-aurora-pink: #ff6b9d; --color-solar-gold: #ffd700; --color-solar-amber: #ffb347; --color-supernova: #ff4757; --color-comet: #5f9ea0; --color-mercury: #b8c5d6; --color-text-primary: #e8e4f0; --color-text-secondary: #9ca3b0; --color-text-muted: #6b7280; --color-link: #c9b8ff; --color-link-hover: #00d4aa; --color-surface-dark: rgba(13, 19, 33, 0.95); --color-surface-card: rgba(29, 37, 65, 0.85); --color-surface-elevated: rgba(45, 55, 85, 0.9); --color-glass: rgba(200, 200, 220, 0.08); --color-glass-border: rgba(200, 200, 220, 0.15); --color-success: #00d4aa; --color-warning: #ffb347; --color-error: #ff4757; --color-info: #c9b8ff; --font-display: 'Playfair Display', 'EB Garamond', Georgia, serif; --font-body: 'Source Sans Pro', 'Asap', system-ui, -apple-system, sans-serif; --font-accent: 'Sacramento', 'Dancing Script', cursive; --font-mono: Monaco, 'Courier New', Courier, monospace; --font-astro: 'HamburgSymbols', sans-serif; --text-xs: clamp(0.7rem, 0.65rem + 0.25vw, 0.8rem); --text-sm: clamp(0.8rem, 0.75rem + 0.25vw, 0.9rem); --text-base: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem); --text-lg: clamp(1.1rem, 1rem + 0.5vw, 1.3rem); --text-xl: clamp(1.3rem, 1.15rem + 0.75vw, 1.6rem); --text-2xl: clamp(1.6rem, 1.4rem + 1vw, 2.2rem); --text-3xl: clamp(2rem, 1.7rem + 1.5vw, 3rem); --text-4xl: clamp(2.5rem, 2rem + 2.5vw, 4rem); --text-5xl: clamp(3rem, 2.5rem + 3vw, 5rem); --weight-light: 300; --weight-normal: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700; --leading-none: 1; --leading-tight: 1.2; --leading-snug: 1.35; --leading-normal: 1.5; --leading-relaxed: 1.7; --leading-loose: 2; --tracking-tighter: -0.05em; --tracking-tight: -0.02em; --tracking-normal: 0; --tracking-wide: 0.05em; --tracking-wider: 0.1em; --tracking-widest: 0.2em; --space-0: 0; --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.25rem; --space-6: 1.5rem; --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem; --space-16: 4rem; --space-20: 5rem; --space-24: 6rem; --space-32: 8rem; --radius-none: 0; --radius-sm: 4px; --radius-md: 8px; --radius-lg: 16px; --radius-xl: 24px; --radius-2xl: 32px; --radius-full: 9999px; --border-thin: 1px; --border-medium: 2px; --border-thick: 4px; --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3); --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.4), 0 2px 4px rgba(0, 0, 0, 0.3); --shadow-lg: 0 10px 25px rgba(0, 0, 0, 0.5), 0 6px 10px rgba(0, 0, 0, 0.4); --shadow-xl: 0 20px 50px rgba(0, 0, 0, 0.6), 0 12px 20px rgba(0, 0, 0, 0.5); --shadow-inner: inset 0 2px 4px rgba(0, 0, 0, 0.3); --glow-stardust: 0 0 20px rgba(201, 184, 255, 0.3), 0 0 40px rgba(201, 184, 255, 0.15); --glow-aurora: 0 0 20px rgba(0, 212, 170, 0.4), 0 0 40px rgba(0, 212, 170, 0.2); --glow-solar: 0 0 20px rgba(255, 215, 0, 0.4), 0 0 40px rgba(255, 215, 0, 0.2); --glow-cosmic: 0 0 30px rgba(255, 107, 157, 0.3), 0 0 60px rgba(95, 158, 160, 0.2); --glow-supernova: 0 0 20px rgba(255, 71, 87, 0.4), 0 0 40px rgba(255, 71, 87, 0.2); --duration-instant: 50ms; --duration-fast: 150ms; --duration-base: 250ms; --duration-slow: 400ms; --duration-slower: 600ms; --duration-slowest: 1000ms; --ease-linear: linear; --ease-in: cubic-bezier(0.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --ease-bounce: cubic-bezier(0.68, -0.55, 0.265, 1.55); --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1); --ease-in-expo: cubic-bezier(0.7, 0, 0.84, 0); --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1); --transition-fast: 150ms ease-out; --transition-base: 250ms ease-out; --transition-slow: 400ms ease-out; --transition-slower: 600ms ease-out; --z-behind: -1; --z-base: 1; --z-dropdown: 100; --z-sticky: 200; --z-fixed: 300; --z-modal-backdrop: 400; --z-modal: 500; --z-popover: 600; --z-tooltip: 700; --z-notification: 800; --z-stars: -1; --container-xs: 480px; --container-sm: 640px; --container-md: 768px; --container-lg: 1024px; --container-xl: 1280px; --container-2xl: 1536px; --header-height: 80px; --header-height-mobile: 60px; --sidebar-width: 280px; --sidebar-width-collapsed: 64px; --footer-height: 200px; --breakpoint-sm: 640px; --breakpoint-md: 768px; --breakpoint-lg: 1024px; --breakpoint-xl: 1280px; --breakpoint-2xl: 1536px; } [data-theme="dark"], .theme-dark { --color-bg-primary: var(--color-void); --color-bg-secondary: var(--color-cosmos); } @media (prefers-reduced-motion: reduce) { :root { --duration-instant: 0ms; --duration-fast: 0ms; --duration-base: 0ms; --duration-slow: 0ms; --duration-slower: 0ms; --duration-slowest: 0ms; --transition-fast: 0ms; --transition-base: 0ms; --transition-slow: 0ms; --transition-slower: 0ms; } } body { font-family: var(--font-body); font-size: var(--text-base); font-weight: var(--weight-normal); line-height: var(--leading-normal); color: var(--color-text-primary); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: var(--font-display); font-weight: var(--weight-normal); line-height: var(--leading-tight); color: var(--color-moonbeam); margin-top: 0; margin-bottom: var(--space-4); } h1, .h1 { font-size: var(--text-4xl); letter-spacing: var(--tracking-tight); text-shadow: 0 0 40px rgba(201, 184, 255, 0.2); } h2, .h2 { font-size: var(--text-3xl); letter-spacing: var(--tracking-tight); } h3, .h3 { font-size: var(--text-2xl); } h4, .h4 { font-size: var(--text-xl); } h5, .h5 { font-size: var(--text-lg); font-family: var(--font-body); font-weight: var(--weight-semibold); } h6, .h6 { font-size: var(--text-base); font-family: var(--font-body); font-weight: var(--weight-semibold); text-transform: uppercase; letter-spacing: var(--tracking-wide); } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { color: inherit; text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { color: var(--color-stardust); } .headline-cosmic { font-family: var(--font-display); font-style: italic; background: linear-gradient(90deg, var(--color-solar-gold) 0%, var(--color-aurora-pink) 50%, var(--color-stardust) 100%); background-size: 200% auto; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .headline-accent { font-family: var(--font-accent); font-size: var(--text-3xl); font-weight: var(--weight-normal); color: var(--color-stardust); } .headline-glow { text-shadow: 0 0 10px rgba(201, 184, 255, 0.5), 0 0 20px rgba(201, 184, 255, 0.3), 0 0 40px rgba(201, 184, 255, 0.2); } p { margin-top: 0; margin-bottom: var(--space-4); color: var(--color-text-primary); } p:last-child { margin-bottom: 0; } .lead, .text-lead { font-size: var(--text-lg); line-height: var(--leading-relaxed); color: var(--color-text-secondary); } small, .small, .text-small { font-size: var(--text-sm); } .text-xs { font-size: var(--text-xs); } .text-muted, .elgg-subtext { color: var(--color-text-muted); } .elgg-subtext { font-size: var(--text-xl); font-style: italic; } .text-secondary { color: var(--color-text-secondary); } a { color: var(--color-link); text-decoration: none; transition: color var(--transition-fast), text-shadow var(--transition-fast); } a:hover, a:focus { color: var(--color-link-hover); text-shadow: 0 0 10px rgba(0, 212, 170, 0.3); } a:active { color: var(--color-aurora-teal); } .elgg-quiet a, a.elgg-quiet { color: var(--color-text-muted); } .elgg-quiet a:hover, a.elgg-quiet:hover { color: var(--color-stardust); } .elgg-loud, a.elgg-loud { color: var(--color-stardust); } ul, ol { margin-top: 0; margin-bottom: var(--space-4); padding-left: var(--space-6); } li { margin-bottom: var(--space-2); } .list-unstyled { padding-left: 0; list-style: none; } .list-unstyled li { margin-bottom: 0; } .list-inline { padding-left: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-4); } blockquote { font-family: var(--font-display); font-style: italic; font-size: var(--text-lg); line-height: var(--leading-relaxed); color: var(--color-stardust); border-left: 3px solid var(--color-aurora-teal); padding: var(--space-4) var(--space-6); margin: var(--space-6) 0; background: var(--color-glass); border-radius: 0 var(--radius-md) var(--radius-md) 0; position: relative; } blockquote::before { content: '\201C'; font-size: var(--text-5xl); color: var(--color-aurora-teal); opacity: 0.3; position: absolute; left: var(--space-3); top: 0; line-height: 1; } blockquote p { margin-bottom: 0; } blockquote cite, blockquote footer { display: block; margin-top: var(--space-3); font-size: var(--text-sm); font-style: normal; color: var(--color-text-muted); } blockquote cite::before, blockquote footer::before { content: '\2014\00a0'; } code, kbd, pre, samp { font-family: var(--font-mono); } code { padding: var(--space-1) var(--space-2); font-size: var(--text-sm); color: var(--color-aurora-teal); background: var(--color-surface-dark); border-radius: var(--radius-sm); } pre { padding: var(--space-4); margin: var(--space-4) 0; font-size: var(--text-sm); line-height: var(--leading-relaxed); color: var(--color-text-primary); background: var(--color-surface-dark); border: 1px solid var(--color-glass-border); border-radius: var(--radius-md); overflow-x: auto; white-space: pre-wrap; word-wrap: break-word; } pre code { padding: 0; background: transparent; border-radius: 0; color: inherit; } kbd { padding: var(--space-1) var(--space-2); font-size: var(--text-sm); color: var(--color-moonbeam); background: var(--color-twilight); border: 1px solid var(--color-glass-border); border-radius: var(--radius-sm); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25); } hr { border: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--color-glass-border), var(--color-stardust), var(--color-glass-border), transparent); margin: var(--space-8) 0; } hr.divider-cosmic { height: 2px; background: linear-gradient(90deg, transparent, var(--color-aurora-teal), var(--color-stardust), var(--color-aurora-pink), transparent); } .text-left { text-align: left; } .text-center { text-align: center; } .text-right { text-align: right; } .text-justify { text-align: justify; } .text-lowercase { text-transform: lowercase; } .text-uppercase { text-transform: uppercase; } .text-capitalize { text-transform: capitalize; } .font-light { font-weight: var(--weight-light); } .font-normal { font-weight: var(--weight-normal); } .font-medium { font-weight: var(--weight-medium); } .font-semibold { font-weight: var(--weight-semibold); } .font-bold { font-weight: var(--weight-bold); } .font-italic { font-style: italic; } .font-normal-style { font-style: normal; } .leading-none { line-height: var(--leading-none); } .leading-tight { line-height: var(--leading-tight); } .leading-normal { line-height: var(--leading-normal); } .leading-relaxed { line-height: var(--leading-relaxed); } .leading-loose { line-height: var(--leading-loose); } .tracking-tight { letter-spacing: var(--tracking-tight); } .tracking-normal { letter-spacing: var(--tracking-normal); } .tracking-wide { letter-spacing: var(--tracking-wide); } .tracking-wider { letter-spacing: var(--tracking-wider); } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } ::selection { background: rgba(201, 184, 255, 0.3); color: var(--color-moonbeam); } ::-moz-selection { background: rgba(201, 184, 255, 0.3); color: var(--color-moonbeam); } .elgg-heading-main { font-family: var(--font-display); font-size: var(--text-2xl); color: var(--color-moonbeam); margin-bottom: var(--space-4); } .elgg-heading-basic { font-family: var(--font-display); font-size: var(--text-xl); color: var(--color-stardust); font-weight: var(--weight-normal); } .elgg-heading-site, .elgg-heading-site:hover { font-family: var(--font-display); } .elgg-heading-site a { color: var(--color-moonbeam); text-shadow: 0 0 20px rgba(201, 184, 255, 0.3); } .elgg-text-help { display: block; font-size: var(--text-sm); font-style: italic; color: var(--color-text-muted); margin-top: var(--space-2); } .elgg-output { margin-top: var(--space-4); line-height: var(--leading-relaxed); } .elgg-output ul, .elgg-output ol { margin: 0 0 var(--space-4) var(--space-6); padding-left: var(--space-4); } .elgg-output ul { list-style-type: disc; } .elgg-output ol { list-style-type: decimal; } .elgg-output img { max-width: 100%; height: auto; } body { font-weight: 400 !important; } .working { background: url('https://12andus.com/mod/theme_extension/img/ui-anim_basic_16x16.gif') no-repeat left !important; font-style: italic; } ul.nav-tabs li.info-thumbnail-link img { max-width: 140px; } div.report-bigbuttons .description { min-height: 110px; } div.report-bar label { text-transform: capitalize; width: 125px; } div.report-bar { margin-bottom: 5px; } div.report-bar td.label { width: 165px; text-align: right; padding-right: 5px; } div.report-bar td.label label { vertical-align: middle; white-space: normal; } div.report-bar td.value { padding-left: 3px; } div.general-report-link { padding: 15px; clear: both; } div.run-general-report { margin-left: 10px; } div.user-meta-bottom { float: left; display: none; } div.quality-links { width: 100%; } div.explanation-text { clear: both; width: 90%; margin-left: auto; margin-right: auto; margin-top: 15px; margin-bottom: 15px; } @media screen and (max-width:650px){ div.user-meta-top { display: none; } div.user-meta-bottom { display: block; } ul.elgg-menu-entity-default { margin-top: 0px; } div.run-general-report { } ul.elgg-menu-entity-default li { margin-left: 5px; } ul.elgg-menu-entity-default { margin-right: 0px; } body.friends ul.elgg-menu-entity-default li, #search-results ul.elgg-menu-entity-default li { display: inline-block; margin-left: 0px; } body.friends ul.elgg-menu-entity-default, #search-results ul.elgg-menu-entity-default { margin-left: auto; margin-right: auto; float: left; } body.friends li.elgg-menu-item-befriend, #search-results li.elgg-menu-item-befriend { margin-left: 5px; } body.friends .instagram div.instagram-entry, #search-results .instagram div.instagram-entry { width: 75px; height: 75px; } body.friends .instagram div.instagram-entry img, #search-results .instagram div.instagram-entry img { width: 75px; height: 75px; } } @media screen and (max-width:992px){ div.profile-ownerblock div#profile-owner-block { width: 100%; } div.profile-body { clear: both; } } span.elgg-icon-icon-overlay { background: url("https://12andus.com/mod/theme_extension/img/12andus-logo_RGB_16x16 optimized.gif") no-repeat scroll left bottom rgba(0, 0, 0, 0) !important; height: 100%; position: absolute; width: 100%; } span.elgg-icon-icon-overlay-large { background: url("https://12andus.com/mod/theme_extension/img/12andus-logo_RGB_large.gif") no-repeat scroll left bottom rgba(0, 0, 0, 0) !important; height: 100%; position: absolute; width: 100%; } span.elgg-icon-premium-icon-overlay { background: url("https://12andus.com/mod/theme_extension/img/user-premium-band-small.png") no-repeat scroll bottom rgba(0, 0, 0, 0) !important; height: 100%; position: absolute; width: 100%; } div.members-search-list span.elgg-icon-premium-icon-overlay-large { width: 56px; } div.members-search-list span.elgg-icon-hover-menu { right: 10px; } span.elgg-icon-premium-icon-overlay-large { background: url("https://12andus.com/mod/theme_extension/img/user-premium-band-small.png") no-repeat scroll bottom rgba(0, 0, 0, 0) !important; height: 100%; position: absolute; width: 100%; } .elgg-heading-site, .elgg-heading-site:hover { float: left; width: 261px; height: 100px; margin-bottom: 20px; } .birthdata-incomplete { font-style: italic; color: grey; } .birthdata-details .text { float: left; max-width: 60%; line-height: 22px; } .birthdata-mine .elgg-menu-item-edit { margin-right: 50px; } a.advanced-search-link { font-size: xx-small; } form.advanced-search div.option-box { margin-top: 10px; } div.qualities-dropdown input.date-ctl { width: 150px; } div.advanced-search-box { padding: 10px; margin-top: 5px; } div.advanced-search-box .elgg-search input[type="submit"] { float: right; position: inherit; margin-top: 5px; width: 200px; display: block; } div.advanced-search-box label.btn { display: inline-block; margin-bottom: 5px; font-weight: 700; font-size: 100%; } div.advanced-search-box label { font-size: 100%; } div.advanced-search-box h2 { display: inline-block; top: 5px; position: relative; } div.advanced-search-box div.planet-selector-row-item { display: inline; width: 30px; } div.advanced-search-box div.planet-selector-row-item img { max-width: 30px; } div.advanced-search-box .option-box-gender .btn, div.advanced-search-box .option-box-gender .btn.active { -webkit-box-shadow: none; box-shadow: none; padding-left: 0px; padding-right: 2px; } @media screen and (max-width: 667px) { div.advanced-search-box .option-box-distance { display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; } div.advanced-search-box .option-box-distance .distance-control { flex: 0 0 auto; max-width: 45%; } div.advanced-search-box .option-box-distance .city-control { flex: 1 1 auto; min-width: 0; width: auto !important; max-width: none !important; height: 34px !important; } div.advanced-search-box .option-box-distance > label { flex: 0 0 auto; white-space: nowrap; } } label > input + img { cursor:pointer; border: 2px solid #f5f5f5; } div.planet-selector-disabled img { opacity: 0.4; cursor: not-allowed; } div.advanced-search-box .planet-selections { display: flex; flex-wrap: wrap; gap: 6px 4px; align-items: center; } div.advanced-search-box .planet-selector { margin-left: 0 !important; margin-right: 0 !important; flex: 0 0 calc(33.333% - 4px); max-width: calc(33.333% - 4px); display: flex; align-items: center; box-sizing: border-box; } div.advanced-search-box .planet-selector-row-headline { flex: 0 0 30px; width: 30px; } div.advanced-search-box .planet-sign-dropdown { flex: 1 1 auto; margin-left: 6px; min-width: 0; } div.advanced-search-box select.planet-sign-select { height: 32px; padding: 2px 4px; font-size: 13px; line-height: 1.2; width: 100%; min-width: 0; max-width: 100%; background-color: #fff; } div.planet-selector-disabled select.planet-sign-select { opacity: 0.4; cursor: not-allowed; } label > input:checked + img { border:2px solid #f00; } select.distance-control, input.city-control { width: inherit; display: inline; } select.distance-control { margin-bottom: 5px; } input.city-control { min-width: 200px; } div.sharebuttons { height: 25px; } div.sharebuttons div.sharebutton { margin:5px; float: left; } div.sharebuttons div.sharebutton div.email { margin-top: 2px; } div#harmonic div.sharing-form { margin-top: 10px; margin-bottom: 20px; clear: both; } div#harmonic div.post-qualities-form { padding: 5px; border: 1px solid #555; } div#harmonic div.sharing-form h1, div#harmonic div.sharing-form div.buttons, div#harmonic div.sharing-form textarea { padding: 5px; border: 1px solid #555; } div.warning_dialog, div#number-studies { clear: both; margin-top: 60px; margin-bottom: 40px; margin-left: 100px; margin-right: 100px; padding: 15px; font-weight: bold; } div.warning_dialog, div#number-studies a { color: red; } @media screen and (max-width: 768px) { div.warning_dialog, div#number-studies { margin-left: 5px; margin-right: 5px; } ul.elgg-menu-entity-default { margin-top: 0px; margin-right: 0px; } #search-results ul.elgg-menu-entity-default li { display: inline-block; } #search-results ul.elgg-menu-entity-default { margin-left: auto; margin-right: auto; } } span.message-on-topbar { left: auto; margin-left: 2px; } #profile-owner-block { width: 230px; } nav#mainMenu .fa { font-size: 125%; } .navbar .navbar-brand { text-transform: none !important; } #elgg-river-selector { display: none; } li.elgg-menu-item-rss { display: none !important; } .elgg-module { padding: 10px 15px; } div.sharebuttons div.facebook { margin-top: 2px; } div.sharebuttons div.email i { font-size: 1.3em; } form label { width: 100%; } form.advanced-search label { width: inherit; } .get-premium:hover { background-color: #eee; } .get-premium h3 { font-size: 100%; margin-top: 0px; line-height: 1.42857; } .get-premium { margin-top: 10px; } input[type="button"], input[type="submit"] { padding-left: 10px; padding-right: 10px; width: auto; } input[type="checkbox"] { height: inherit; display: inline; } div#contactform div.blurb { margin-bottom: 20px; } div#contactform div.formfield { margin-top: 30px; } div#contactform div.body { margin-top: 40px; } div#contactform input[type="submit"] { padding-left: 10px; padding-right: 10px; } footer div.social_connect_site_connect div { display: none; } footer div.social_connect_site_connect { float: right; } div.mutual-attraction div.mutual-label { text-align: center; font-size: 1.3em; margin-bottom: 10px; } div.elgg-module-widget div.elgg-head { height: 50px; } div.elgg-module-widget div.elgg-head h3 { margin-top: 5px; } div.report-error { color: #f00; font-weight: bold; } div.register-footer { margin-top: 20px; } div#innate-predispositions td.label { font-size: 100%; } div#innate-predispositions div.quality_container { } li.elgg-menu-item-register a.btn, li.elgg-menu-item-add a.btn { font-size: 1.2em; } div.nextreport { clear: both; } div.nextreport a { font-size: 2em; } div.messages-buttonbank .btn { background-color: #bababa; } div.messages-buttonbank .btn:hover { background-color: #ddd; } .elgg-menu-title-default { margin-bottom: 10px !important; } .elgg-menu-title-default li { margin-left: 5px; } .nav-members li { } .nav-members li a { padding-left: 10px !important; padding-right: 10px !important; } div.field-languages label { width: auto; margin-right: 10px; min-width: 0; width: auto; } .astro-title-main { margin: 1em 0 0.5em 0; font-weight: 500; font-family: 'Arial', sans-serif; position: relative; font-size: 32px; line-height: 40px; padding: 15px 15px 15px 78px; color: #355681; box-shadow: inset 0 0 0 1px rgba(53,86,129, 0.4), inset 0 0 5px rgba(53,86,129, 0.5); border-radius: 0 10px 0 10px; } .astro-title-sub { margin: 1em 0 0.5em 0; font-weight: 300; font-family: 'Arial', sans-serif; position: relative; font-size: 22px; line-height: 40px; padding: 15px 15px 15px 68px; color: #355681; box-shadow: inset 0 0 0 1px rgba(53,86,129, 0.4), inset 0 0 5px rgba(53,86,129, 0.5); border-radius: 0 10px 0 10px; } div.astro-controls div.info-thumbnail-link div.caption { min-height: 380px; } @media screen and (max-width:995px){ div.col-md-3 { clear: both !important; } } .button-hover { font-size: small; } div.tab-contents { min-height: 700px; } div#qualities-content .nav-tabs { margin-bottom: 60px; } #number-studies a, #number-studies a:hover { color: #2a4d63; } li.elgg-item-object-blog h3 { margin-top: 0px; } li.elgg-item-object-blog .elgg-content { margin-left: 0px; } li.elgg-item-object-blog .elgg-tags { display: none; } div.elgg-admin-sidebar-menu { height: inherit; } div.elgg-admin-sidebar-menu div.elgg-body { height: 100%; } textarea#invitefriends-emails, textarea#invitefriends-emailmessage { height: 120px; } ul.owner-block { } ul.owner-block li { min-width: 150px; } li.elgg-menu-item-birthdata-edit a.btn { font-size: 1.2em; } div.object-share { margin-top: 15px; } @media screen and (max-width:600px){ div.navbar-header div.language_selector img { max-width: 16px; display: inline; } div.navbar-header div.language_selector { padding-top: 12px; } } @media screen and (max-width:767px){ div.navbar-header div.language_selector { padding-top: 12px; } } @media screen and (max-width:600px){ #search-results .elgg-image-block .elgg-image { margin-right: auto; margin-left: auto; width: 160px; float: none; } #search-results .symbol-planet { margin-top:10px; } } .ui-dialog { z-index: 1100 !important ;} ul.elgg-menu-message-ex-default li.elgg-menu-item-block { margin-right: 5px; } div.poll-comments { display: none; } .elgg-avatar-medium > a > img { width: 120px; height: 120px; } div.blog-comments li.elgg-menu-item-embed, body.messages li.elgg-menu-item-embed { display:none; } li.elgg-menu-item-forward { display: none; } div#qualities-content li.info-thumbnail-link span { min-height: 70px; } div#qualities-content li.info-thumbnail-link a { min-height: 240px; } div.chart img { margin-bottom: 20px; } li.elgg-menu-item-befriend a { padding: 0px !important; margin-left: 10px; } div.profile-menu li.elgg-menu-item-befriend a { margin-left: 0px; } div.blog-post { font-size: 120%; font-family: Sans-Serif; } div.blog-post p { font-size: 100%; line-height: 1.5em; } div.blog-post h1 { border-bottom: none; font-size: 160%; } div.blog-post h2 { border-bottom: none; font-size: 140%; } .elgg-subtext { font-size: 1.25rem; } .elgg-menu.elgg-menu-entity, .elgg-image-block .elgg-menu-entity, .elgg-body .elgg-menu-entity { display: block !important; clear: both !important; float: none !important; margin-top: 10px !important; width: auto !important; } .elgg-menu.elgg-menu-entity.pull-right { float: none !important; } div.elgg-item-object-question h3 { margin-top: 5px; } body.questions div.elgg-module elgg-head { } div#question-answers { padding-bottom: 0px; margin-bottom: 5px; } body.questions div.elgg-module h3 { margin-bottom: 0px; margin-top: 0px; } ul.search-list .elgg-item .elgg-body h3 { margin-top: 0px; } .grecaptcha-badge { visibility: hidden; } @media screen and (max-width: 768px) { footer.site-footer { padding-bottom: 70px; padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px)); } } nav.sidebar { width: 100%; } nav.sidebar ul { width: 100%; } nav.sidebar li a { padding-top: 15px !important; padding-bottom: 15px !important; } nav.sidebar li a:hover { padding-top: 25px !important; padding-bottom: 5px !important; } nav.sidebar { margin-bottom: 10px; } .main .row{ padding: 0px; margin: 0px; } nav.sidebar.navbar { border-radius: 0px; } nav.sidebar, .main{ -webkit-transition: margin 200ms ease-out; -moz-transition: margin 200ms ease-out; -o-transition: margin 200ms ease-out; transition: margin 200ms ease-out; } .main{ padding: 10px 10px 0 10px; } @media (min-width: 768px) { .main{ position: absolute; width: calc(100% - 40px); margin-left: 40px; float: right; } nav.sidebar:hover + .main{ margin-left: 200px; } nav.sidebar.navbar.sidebar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand { margin-left: 0px; } nav.sidebar .navbar-brand, nav.sidebar .navbar-header{ text-align: center; width: 100%; margin-left: 0px; } nav.sidebar a{ padding-right: 13px; } nav.sidebar .navbar-nav > li:first-child{ border-top: 1px #e5e5e5 solid; } nav.sidebar .navbar-nav > li{ border-bottom: 1px #e5e5e5 solid; } nav.sidebar .navbar-nav .open .dropdown-menu { position: static; float: none; width: auto; margin-top: 0; background-color: transparent; border: 0; -webkit-box-shadow: none; box-shadow: none; } nav.sidebar .navbar-collapse, nav.sidebar .container-fluid{ padding: 0 0px 0 0px; } .navbar-inverse .navbar-nav .open .dropdown-menu>li>a { color: #777; } nav.sidebar{ height: 100%; float: left; z-index: 8000; margin-bottom: 0px; } nav.sidebar li { width: 100%; } nav.sidebar:hover{ margin-left: 0px; } .forAnimate{ opacity: 0; } } @media (min-width: 1330px) { .main{ width: calc(100% - 200px); margin-left: 200px; } nav.sidebar{ margin-left: 0px; float: left; } nav.sidebar .forAnimate{ opacity: 1; } } nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover, nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus { color: #CCC; background-color: transparent; } nav:hover .forAnimate{ opacity: 1; } section{ padding-left: 15px; } #loading { height: 100%; left: 0; margin: auto; top: 0; width: 100%; } .bokeh { border: 0.01em solid rgba(150, 150, 150, 0.1); border-radius: 50%; font-size: 100px; height: 1em; list-style: outside none none; margin: 0 auto; position: relative; top: 35%; width: 1em; z-index: 2147483647; } .bokeh li { border-radius: 50%; height: 0.2em; position: absolute; width: 0.2em; } .bokeh li:nth-child(1) { animation: 1.13s linear 0s normal none infinite running rota, 3.67s ease-in-out 0s alternate none infinite running opa; background: #00c176 none repeat scroll 0 0; left: 50%; margin: 0 0 0 -0.1em; top: 0; transform-origin: 50% 250% 0; } .bokeh li:nth-child(2) { animation: 1.86s linear 0s normal none infinite running rota, 4.29s ease-in-out 0s alternate none infinite running opa; background: #ff003c none repeat scroll 0 0; margin: -0.1em 0 0; right: 0; top: 50%; transform-origin: -150% 50% 0; } .bokeh li:nth-child(3) { animation: 1.45s linear 0s normal none infinite running rota, 5.12s ease-in-out 0s alternate none infinite running opa; background: #fabe28 none repeat scroll 0 0; bottom: 0; left: 50%; margin: 0 0 0 -0.1em; transform-origin: 50% -150% 0; } .bokeh li:nth-child(4) { animation: 1.72s linear 0s normal none infinite running rota, 5.25s ease-in-out 0s alternate none infinite running opa; background: #88c100 none repeat scroll 0 0; margin: -0.1em 0 0; top: 50%; transform-origin: 250% 50% 0; } @keyframes opa { 12% { opacity: 0.8; } 19.5% { opacity: 0.88; } 37.2% { opacity: 0.64; } 40.5% { opacity: 0.52; } 52.7% { opacity: 0.69; } 60.2% { opacity: 0.6; } 66.6% { opacity: 0.52; } 70% { opacity: 0.63; } 79.9% { opacity: 0.6; } 84.2% { opacity: 0.75; } 91% { opacity: 0.87; } } @keyframes rota { 100% { transform: rotate(360deg); } } }.lds-ripple, .lds-ripple div { box-sizing: border-box; } .lds-ripple { display: inline-block; position: relative; width: 80px; height: 80px; } .lds-ripple div { position: absolute; border: 4px solid currentColor; opacity: 1; border-radius: 50%; animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; } .lds-ripple div:nth-child(2) { animation-delay: -0.5s; } @keyframes lds-ripple { 0% { top: 36px; left: 36px; width: 8px; height: 8px; opacity: 0; } 4.9% { top: 36px; left: 36px; width: 8px; height: 8px; opacity: 0; } 5% { top: 36px; left: 36px; width: 8px; height: 8px; opacity: 1; } 100% { top: 0; left: 0; width: 80px; height: 80px; opacity: 0; } }