|
|
| (11 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /* Roovet Data main page design */
| |
| .rd-main {
| |
| --rd-red: #d71920;
| |
| --rd-red-dark: #a90f16;
| |
| --rd-blue: #3156a3;
| |
| --rd-green: #2f7d4f;
| |
| --rd-ink: #1f2937;
| |
| --rd-muted: #5f6b7a;
| |
| --rd-line: #d8dee8;
| |
| --rd-soft: #f6f8fb;
| |
| --rd-white: #fff;
| |
| max-width: 1160px;
| |
| margin: 0 auto;
| |
| padding: 12px 0 32px;
| |
| color: var(--rd-ink);
| |
| }
| |
|
| |
|
| .rd-main * {
| |
| box-sizing: border-box;
| |
| }
| |
|
| |
| .rd-hero {
| |
| position: relative;
| |
| overflow: hidden;
| |
| padding: 42px;
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 8px;
| |
| background:
| |
| radial-gradient(circle at top right, rgba(215, 25, 32, .14), transparent 34%),
| |
| linear-gradient(135deg, #ffffff 0%, #f5f7fb 58%, #eef2f8 100%);
| |
| box-shadow: 0 14px 40px rgba(31, 41, 55, .08);
| |
| }
| |
|
| |
| .rd-hero:before {
| |
| content: "";
| |
| position: absolute;
| |
| inset: auto -80px -130px auto;
| |
| width: 340px;
| |
| height: 340px;
| |
| border-radius: 999px;
| |
| background: rgba(49, 86, 163, .11);
| |
| }
| |
|
| |
| .rd-hero-kicker {
| |
| display: inline-flex;
| |
| align-items: center;
| |
| gap: 8px;
| |
| margin-bottom: 12px;
| |
| padding: 7px 12px;
| |
| border: 1px solid rgba(215, 25, 32, .24);
| |
| border-radius: 999px;
| |
| background: rgba(255, 255, 255, .82);
| |
| color: var(--rd-red-dark);
| |
| font-size: 13px;
| |
| font-weight: 700;
| |
| letter-spacing: .04em;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
| .rd-hero h1 {
| |
| margin: 0;
| |
| font-size: clamp(32px, 5vw, 58px);
| |
| line-height: 1.02;
| |
| letter-spacing: -.04em;
| |
| color: #111827;
| |
| border: 0;
| |
| }
| |
|
| |
| .rd-hero-lede {
| |
| max-width: 820px;
| |
| margin: 18px 0 24px;
| |
| color: var(--rd-muted);
| |
| font-size: 18px;
| |
| line-height: 1.62;
| |
| }
| |
|
| |
| .rd-search-card {
| |
| position: relative;
| |
| max-width: 760px;
| |
| padding: 10px;
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 8px;
| |
| background: rgba(255, 255, 255, .94);
| |
| box-shadow: 0 10px 30px rgba(31, 41, 55, .08);
| |
| }
| |
|
| |
| .rd-search-form {
| |
| display: flex;
| |
| gap: 10px;
| |
| }
| |
|
| |
| .rd-search-form input[type="search"] {
| |
| min-width: 0;
| |
| flex: 1;
| |
| padding: 14px 16px;
| |
| border: 1px solid #ccd4df;
| |
| border-radius: 6px;
| |
| color: #111827;
| |
| font-size: 16px;
| |
| background: #fff;
| |
| }
| |
|
| |
| .rd-search-form button {
| |
| padding: 13px 18px;
| |
| border: 0;
| |
| border-radius: 6px;
| |
| background: var(--rd-red);
| |
| color: #fff;
| |
| font-weight: 700;
| |
| cursor: pointer;
| |
| }
| |
|
| |
| .rd-search-form button:hover {
| |
| background: var(--rd-red-dark);
| |
| }
| |
|
| |
| .rd-hero-actions {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| gap: 8px;
| |
| margin-top: 18px;
| |
| }
| |
|
| |
| .rd-chip {
| |
| display: inline-flex;
| |
| padding: 7px 10px;
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 999px;
| |
| background: rgba(255, 255, 255, .78);
| |
| color: #334155;
| |
| font-size: 13px;
| |
| font-weight: 600;
| |
| }
| |
|
| |
| .rd-stat-row {
| |
| display: grid;
| |
| grid-template-columns: repeat(4, minmax(0, 1fr));
| |
| gap: 12px;
| |
| margin: 16px 0;
| |
| }
| |
|
| |
| .rd-stat {
| |
| padding: 20px;
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 8px;
| |
| background: var(--rd-white);
| |
| }
| |
|
| |
| .rd-stat strong {
| |
| display: block;
| |
| color: #111827;
| |
| font-size: 26px;
| |
| line-height: 1;
| |
| }
| |
|
| |
| .rd-stat span {
| |
| display: block;
| |
| margin-top: 7px;
| |
| color: var(--rd-muted);
| |
| font-size: 13px;
| |
| font-weight: 700;
| |
| text-transform: uppercase;
| |
| letter-spacing: .04em;
| |
| }
| |
|
| |
| .rd-grid {
| |
| display: grid;
| |
| gap: 16px;
| |
| margin-top: 16px;
| |
| }
| |
|
| |
| .rd-grid-3 {
| |
| grid-template-columns: repeat(3, minmax(0, 1fr));
| |
| }
| |
|
| |
| .rd-grid-2 {
| |
| grid-template-columns: repeat(2, minmax(0, 1fr));
| |
| }
| |
|
| |
| .rd-card,
| |
| .rd-panel,
| |
| .rd-bottom {
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 8px;
| |
| background: var(--rd-white);
| |
| box-shadow: 0 8px 24px rgba(31, 41, 55, .05);
| |
| }
| |
|
| |
| .rd-card {
| |
| padding: 24px;
| |
| border-top: 5px solid var(--rd-blue);
| |
| }
| |
|
| |
| .rd-card-red {
| |
| border-top-color: var(--rd-red);
| |
| }
| |
|
| |
| .rd-card-green {
| |
| border-top-color: var(--rd-green);
| |
| }
| |
|
| |
| .rd-card h2,
| |
| .rd-panel h3,
| |
| .rd-bottom h2,
| |
| .rd-section-title h2 {
| |
| margin-top: 0;
| |
| color: #111827;
| |
| border: 0;
| |
| }
| |
|
| |
| .rd-card p,
| |
| .rd-panel p,
| |
| .rd-bottom p,
| |
| .rd-section-title p {
| |
| color: var(--rd-muted);
| |
| line-height: 1.58;
| |
| }
| |
|
| |
| .rd-card ul {
| |
| margin: 18px 0 0;
| |
| padding: 0;
| |
| list-style: none;
| |
| }
| |
|
| |
| .rd-card li {
| |
| margin: 9px 0;
| |
| padding-left: 18px;
| |
| position: relative;
| |
| }
| |
|
| |
| .rd-card li:before {
| |
| content: "›";
| |
| position: absolute;
| |
| left: 0;
| |
| color: var(--rd-red);
| |
| font-weight: 800;
| |
| }
| |
|
| |
| .rd-main a {
| |
| color: #214f99;
| |
| font-weight: 650;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .rd-main a:hover {
| |
| text-decoration: underline;
| |
| }
| |
|
| |
| .rd-section-title {
| |
| margin: 30px 0 12px;
| |
| padding: 0 4px;
| |
| }
| |
|
| |
| .rd-section-title h2 {
| |
| font-size: 28px;
| |
| }
| |
|
| |
| .rd-panel {
| |
| padding: 22px;
| |
| background: linear-gradient(180deg, #fff, #fafbfe);
| |
| }
| |
|
| |
| .rd-bottom {
| |
| display: grid;
| |
| grid-template-columns: 1.3fr .7fr;
| |
| gap: 20px;
| |
| align-items: center;
| |
| margin-top: 18px;
| |
| padding: 26px;
| |
| background:
| |
| linear-gradient(135deg, rgba(215, 25, 32, .08), rgba(49, 86, 163, .08)),
| |
| #fff;
| |
| }
| |
|
| |
| .rd-bottom-links {
| |
| display: grid;
| |
| gap: 10px;
| |
| }
| |
|
| |
| .rd-bottom-links a {
| |
| display: block;
| |
| padding: 12px 14px;
| |
| border: 1px solid var(--rd-line);
| |
| border-radius: 6px;
| |
| background: #fff;
| |
| }
| |
|
| |
| @media (max-width: 900px) {
| |
| .rd-hero {
| |
| padding: 28px;
| |
| }
| |
|
| |
| .rd-stat-row,
| |
| .rd-grid-3,
| |
| .rd-grid-2,
| |
| .rd-bottom {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .rd-search-form {
| |
| flex-direction: column;
| |
| }
| |
|
| |
| .rd-search-form button {
| |
| width: 100%;
| |
| }
| |
| }
| |
|
| |
|
| |
|
| |
| /* Roovet Data CSS cache refresh: 1778360196 */
| |
|
| |
| /* RV_DATA_MAIN_PAGE_PREMIUM_V2_START */
| |
|
| |
| body.page-Main_Page .mw-page-title-main,
| |
| body.page-Main_Page .vector-page-titlebar,
| |
| body.page-Main_Page .vector-toc,
| |
| body.page-Main_Page #toc {
| |
| display: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-body-header {
| |
| min-height: 0;
| |
| margin: 0;
| |
| padding: 0;
| |
| border: 0;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-content-container {
| |
| max-width: 1480px;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-body-content {
| |
| font-size: 1rem;
| |
| }
| |
|
| |
| .rdx-home {
| |
| --bg: #f3f4f6;
| |
| --card: #ffffff;
| |
| --text: #18191c;
| |
| --muted: #656a73;
| |
| --line: #daddE3;
| |
| --red: #d8222c;
| |
| --dark: #0b0c0e;
| |
|
| |
| color: var(--text);
| |
| background: var(--bg);
| |
| border: 1px solid var(--line);
| |
| box-shadow: 0 18px 48px rgba(15, 18, 24, .08);
| |
| overflow: hidden;
| |
| }
| |
|
| |
| .rdx-home,
| |
| .rdx-home * {
| |
| box-sizing: border-box;
| |
| }
| |
|
| |
| .rdx-home a {
| |
| color: inherit;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .rdx-home a:hover {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| .rdx-hero {
| |
| display: grid;
| |
| grid-template-columns: 1.15fr .85fr;
| |
| gap: 4rem;
| |
| align-items: center;
| |
|
| |
| position: relative;
| |
| padding: clamp(2.2rem, 5vw, 5rem);
| |
|
| |
| color: #ffffff;
| |
|
| |
| background:
| |
| linear-gradient(
| |
| 115deg,
| |
| rgba(216, 34, 44, .24),
| |
| transparent 45%
| |
| ),
| |
| linear-gradient(
| |
| 180deg,
| |
| #17181b,
| |
| #08090a
| |
| );
| |
|
| |
| overflow: hidden;
| |
| }
| |
|
| |
| .rdx-hero::before {
| |
| content: "";
| |
| position: absolute;
| |
| inset: 0;
| |
|
| |
| opacity: .18;
| |
|
| |
| background-image:
| |
| linear-gradient(
| |
| rgba(255, 255, 255, .08) 1px,
| |
| transparent 1px
| |
| ),
| |
| linear-gradient(
| |
| 90deg,
| |
| rgba(255, 255, 255, .08) 1px,
| |
| transparent 1px
| |
| );
| |
|
| |
| background-size: 42px 42px;
| |
| }
| |
|
| |
| .rdx-hero-copy,
| |
| .rdx-graph {
| |
| position: relative;
| |
| z-index: 2;
| |
| }
| |
|
| |
| .rdx-eyebrow {
| |
| color: #ff6a72;
| |
|
| |
| font-size: .75rem;
| |
| font-weight: 900;
| |
| letter-spacing: .14em;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
| .rdx-eyebrow span {
| |
| display: inline-block;
| |
|
| |
| width: 8px;
| |
| height: 8px;
| |
| margin-right: .55rem;
| |
|
| |
| background: #ff3e49;
| |
| box-shadow: 0 0 0 6px rgba(255, 62, 73, .12);
| |
| }
| |
|
| |
| .rdx-hero h1 {
| |
| max-width: 780px;
| |
| margin: 1rem 0;
| |
|
| |
| color: #ffffff;
| |
|
| |
| font-size: clamp(2.5rem, 6vw, 5.6rem);
| |
| line-height: .95;
| |
| letter-spacing: -.055em;
| |
| }
| |
|
| |
| .rdx-hero-copy > p {
| |
| max-width: 760px;
| |
| margin: 0;
| |
|
| |
| color: #cbd0d7;
| |
|
| |
| font-size: clamp(1rem, 1.6vw, 1.2rem);
| |
| line-height: 1.7;
| |
| }
| |
|
| |
| .rdx-buttons {
| |
| display: flex;
| |
| flex-wrap: wrap;
| |
| gap: .7rem;
| |
|
| |
| margin-top: 1.5rem;
| |
| }
| |
|
| |
| .rdx-buttons b {
| |
| display: inline-flex;
| |
| }
| |
|
| |
| .rdx-buttons a {
| |
| padding: .78rem 1.1rem;
| |
|
| |
| border: 1px solid rgba(255, 255, 255, .22);
| |
| background: rgba(255, 255, 255, .06);
| |
| }
| |
|
| |
| .rdx-buttons b:first-child a {
| |
| border-color: var(--red);
| |
| background: var(--red);
| |
| }
| |
|
| |
| .rdx-buttons a:hover {
| |
| background: rgba(255, 255, 255, .14);
| |
| }
| |
|
| |
| .rdx-buttons b:first-child a:hover {
| |
| background: #ef303b;
| |
| }
| |
|
| |
| .rdx-small-links {
| |
| margin-top: 1rem;
| |
|
| |
| color: #aeb3bc;
| |
| font-size: .88rem;
| |
| }
| |
|
| |
| .rdx-small-links a:hover {
| |
| color: #ff626b;
| |
| }
| |
|
| |
| .rdx-graph {
| |
| min-height: 360px;
| |
|
| |
| border: 1px solid rgba(255, 255, 255, .16);
| |
| background: rgba(255, 255, 255, .055);
| |
|
| |
| box-shadow: 0 24px 60px rgba(0, 0, 0, .34);
| |
| }
| |
|
| |
| .rdx-graph-title {
| |
| display: flex;
| |
| justify-content: space-between;
| |
|
| |
| padding: 1rem;
| |
|
| |
| border-bottom: 1px solid rgba(255, 255, 255, .12);
| |
|
| |
| color: #9ca2ac;
| |
|
| |
| font-size: .7rem;
| |
| letter-spacing: .12em;
| |
| }
| |
|
| |
| .rdx-graph-title b {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| .rdx-node {
| |
| position: absolute;
| |
|
| |
| width: 158px;
| |
|
| |
| border-left: 3px solid var(--red);
| |
| background: #1c1e22;
| |
|
| |
| box-shadow: 0 12px 24px rgba(0, 0, 0, .3);
| |
| }
| |
|
| |
| .rdx-node a {
| |
| display: block;
| |
| padding: .72rem .82rem;
| |
| }
| |
|
| |
| .rdx-node b,
| |
| .rdx-node span {
| |
| display: block;
| |
| }
| |
|
| |
| .rdx-node b {
| |
| color: #ff626b;
| |
| font-size: .72rem;
| |
| }
| |
|
| |
| .rdx-node span {
| |
| margin-top: .2rem;
| |
|
| |
| color: #f0f1f3;
| |
|
| |
| font-size: .82rem;
| |
| line-height: 1.3;
| |
| }
| |
|
| |
| .rdx-q138 {
| |
| top: 70px;
| |
| left: 50%;
| |
| transform: translateX(-50%);
| |
| }
| |
|
| |
| .rdx-q9 {
| |
| left: 18px;
| |
| bottom: 52px;
| |
| }
| |
|
| |
| .rdx-q140 {
| |
| left: 50%;
| |
| bottom: 24px;
| |
| transform: translateX(-50%);
| |
| }
| |
|
| |
| .rdx-q142 {
| |
| right: 18px;
| |
| bottom: 52px;
| |
| }
| |
|
| |
| .rdx-stats {
| |
| display: grid;
| |
| grid-template-columns: repeat(4, 1fr);
| |
|
| |
| background: var(--card);
| |
| border-bottom: 1px solid var(--line);
| |
| }
| |
|
| |
| .rdx-stats > div {
| |
| padding: 1.25rem 1.4rem;
| |
| border-right: 1px solid var(--line);
| |
| }
| |
|
| |
| .rdx-stats > div:last-child {
| |
| border: 0;
| |
| }
| |
|
| |
| .rdx-stats b,
| |
| .rdx-stats span {
| |
| display: block;
| |
| }
| |
|
| |
| .rdx-stats b {
| |
| font-size: 1.35rem;
| |
| }
| |
|
| |
| .rdx-stats span {
| |
| margin-top: .2rem;
| |
|
| |
| color: var(--muted);
| |
|
| |
| font-size: .73rem;
| |
| letter-spacing: .08em;
| |
| text-transform: uppercase;
| |
| }
| |
|
| |
| .rdx-section {
| |
| padding: clamp(2rem, 4vw, 4.2rem);
| |
| border-bottom: 1px solid var(--line);
| |
| }
| |
|
| |
| .rdx-heading {
| |
| display: flex;
| |
| justify-content: space-between;
| |
| gap: 2rem;
| |
| align-items: end;
| |
|
| |
| margin-bottom: 1.6rem;
| |
| }
| |
|
| |
| .rdx-heading small,
| |
| .rdx-feature-grid small,
| |
| .rdx-trust small {
| |
| color: var(--red);
| |
|
| |
| font-weight: 900;
| |
| letter-spacing: .13em;
| |
| }
| |
|
| |
| .rdx-heading h2,
| |
| .rdx-trust h2 {
| |
| margin: .4rem 0 0;
| |
|
| |
| color: var(--text);
| |
|
| |
| font-size: clamp(1.75rem, 3vw, 2.65rem);
| |
| line-height: 1.05;
| |
| letter-spacing: -.04em;
| |
| }
| |
|
| |
| .rdx-heading > p {
| |
| max-width: 540px;
| |
| margin: 0;
| |
|
| |
| color: var(--muted);
| |
| line-height: 1.6;
| |
| }
| |
|
| |
| .rdx-action-grid,
| |
| .rdx-feature-grid {
| |
| display: grid;
| |
| gap: 1px;
| |
|
| |
| background: var(--line);
| |
| border: 1px solid var(--line);
| |
| }
| |
|
| |
| .rdx-action-grid {
| |
| grid-template-columns: repeat(4, 1fr);
| |
| }
| |
|
| |
| .rdx-feature-grid {
| |
| grid-template-columns: repeat(3, 1fr);
| |
| }
| |
|
| |
| .rdx-action-grid > div,
| |
| .rdx-feature-grid > div {
| |
| padding: 1.3rem;
| |
| background: var(--card);
| |
| }
| |
|
| |
| .rdx-action-grid > div {
| |
| min-height: 225px;
| |
| }
| |
|
| |
| .rdx-feature-grid > div {
| |
| min-height: 195px;
| |
| }
| |
|
| |
| .rdx-action-grid i {
| |
| color: var(--red);
| |
|
| |
| font-size: .72rem;
| |
| font-style: normal;
| |
| font-weight: 900;
| |
| letter-spacing: .12em;
| |
| }
| |
|
| |
| .rdx-action-grid h3,
| |
| .rdx-feature-grid h3 {
| |
| margin: .9rem 0 .55rem;
| |
|
| |
| color: var(--text);
| |
| font-size: 1.05rem;
| |
| }
| |
|
| |
| .rdx-action-grid p,
| |
| .rdx-feature-grid p,
| |
| .rdx-trust p {
| |
| color: var(--muted);
| |
| line-height: 1.58;
| |
| }
| |
|
| |
| .rdx-action-grid > div > b {
| |
| display: block;
| |
| margin-top: 1rem;
| |
|
| |
| color: #a7121b;
| |
| font-size: .84rem;
| |
| }
| |
|
| |
| .rdx-feature-grid > div > b {
| |
| display: inline-block;
| |
|
| |
| margin-top: .5rem;
| |
| padding: .2rem .4rem;
| |
|
| |
| color: var(--muted);
| |
| background: var(--bg);
| |
|
| |
| font-size: .7rem;
| |
| }
| |
|
| |
| .rdx-action-grid > div:hover,
| |
| .rdx-feature-grid > div:hover {
| |
| box-shadow: inset 0 -3px 0 var(--red);
| |
| }
| |
|
| |
| .rdx-trust {
| |
| display: grid;
| |
| grid-template-columns: .9fr 1.1fr;
| |
| gap: 4rem;
| |
|
| |
| padding: clamp(2rem, 4vw, 4.2rem);
| |
|
| |
| color: #ffffff;
| |
| background: var(--dark);
| |
| }
| |
|
| |
| .rdx-trust h2 {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| .rdx-trust p {
| |
| color: #b7bdc6;
| |
| }
| |
|
| |
| .rdx-trust > div:first-child > div {
| |
| color: #e3e5e8;
| |
| font-size: .88rem;
| |
| }
| |
|
| |
| .rdx-trust-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(2, 1fr);
| |
|
| |
| border: 1px solid #34373d;
| |
| }
| |
|
| |
| .rdx-trust-grid > div {
| |
| padding: 1.15rem;
| |
|
| |
| border-right: 1px solid #34373d;
| |
| border-bottom: 1px solid #34373d;
| |
| }
| |
|
| |
| .rdx-trust-grid > div:nth-child(2n) {
| |
| border-right: 0;
| |
| }
| |
|
| |
| .rdx-trust-grid > div:nth-last-child(-n+2) {
| |
| border-bottom: 0;
| |
| }
| |
|
| |
| .rdx-trust-grid b,
| |
| .rdx-trust-grid span {
| |
| display: block;
| |
| }
| |
|
| |
| .rdx-trust-grid span {
| |
| margin-top: .45rem;
| |
|
| |
| color: #9ca2ac;
| |
|
| |
| font-size: .86rem;
| |
| line-height: 1.5;
| |
| }
| |
|
| |
| .rdx-footer {
| |
| display: flex;
| |
| justify-content: space-between;
| |
| gap: 1rem;
| |
|
| |
| padding: 1rem clamp(1.2rem, 4vw, 4rem);
| |
|
| |
| color: #a2a7b0;
| |
| background: #121316;
| |
|
| |
| font-size: .8rem;
| |
| }
| |
|
| |
| .rdx-footer b {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| .rdx-footer a:hover {
| |
| color: #ff626b;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .rdx-home {
| |
| --bg: #111216;
| |
| --card: #191b20;
| |
| --text: #f1f2f4;
| |
| --muted: #aab0b9;
| |
| --line: #30333a;
| |
| }
| |
|
| |
| @media screen and (prefers-color-scheme: dark) {
| |
| html.skin-theme-clientpref-os .rdx-home {
| |
| --bg: #111216;
| |
| --card: #191b20;
| |
| --text: #f1f2f4;
| |
| --muted: #aab0b9;
| |
| --line: #30333a;
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 1000px) {
| |
| .rdx-hero,
| |
| .rdx-trust {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .rdx-action-grid {
| |
| grid-template-columns: repeat(2, 1fr);
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 700px) {
| |
| body.page-Main_Page .mw-content-container {
| |
| padding-left: 0;
| |
| padding-right: 0;
| |
| }
| |
|
| |
| .rdx-home {
| |
| border-left: 0;
| |
| border-right: 0;
| |
| }
| |
|
| |
| .rdx-hero,
| |
| .rdx-section,
| |
| .rdx-trust {
| |
| padding: 2rem 1rem;
| |
| }
| |
|
| |
| .rdx-hero h1 {
| |
| font-size: clamp(2.35rem, 13vw, 4rem);
| |
| }
| |
|
| |
| .rdx-graph {
| |
| min-height: 480px;
| |
| }
| |
|
| |
| .rdx-q138 {
| |
| top: 65px;
| |
| }
| |
|
| |
| .rdx-q9,
| |
| .rdx-q140,
| |
| .rdx-q142 {
| |
| left: 1rem;
| |
| right: 1rem;
| |
|
| |
| width: auto;
| |
|
| |
| transform: none;
| |
| }
| |
|
| |
| .rdx-q9 {
| |
| bottom: 194px;
| |
| }
| |
|
| |
| .rdx-q140 {
| |
| bottom: 121px;
| |
| }
| |
|
| |
| .rdx-q142 {
| |
| bottom: 48px;
| |
| }
| |
|
| |
| .rdx-stats,
| |
| .rdx-action-grid,
| |
| .rdx-feature-grid,
| |
| .rdx-trust-grid {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .rdx-stats > div,
| |
| .rdx-trust-grid > div,
| |
| .rdx-trust-grid > div:nth-child(2n),
| |
| .rdx-trust-grid > div:nth-last-child(-n+2) {
| |
| border-right: 0;
| |
| border-bottom: 1px solid var(--line);
| |
| }
| |
|
| |
| .rdx-heading,
| |
| .rdx-footer {
| |
| display: block;
| |
| }
| |
|
| |
| .rdx-heading > p,
| |
| .rdx-footer > div:last-child {
| |
| margin-top: .8rem;
| |
| }
| |
| }
| |
|
| |
| /* RV_DATA_MAIN_PAGE_PREMIUM_V2_END */
| |
|
| |
| /* RV_DATA_MAIN_PAGE_TRUE_CENTER_V2C_START */
| |
|
| |
| /*
| |
| * Main Page only:
| |
| * remove Vector's pinned Appearance column and make
| |
| * the outer page layout a true single centered column.
| |
| */
| |
| body.page-Main_Page {
| |
| overflow-x: hidden !important;
| |
| }
| |
|
| |
| /*
| |
| * The Appearance panel is what was reserving the
| |
| * large empty area on the right side of the homepage.
| |
| * It remains available normally on all other pages.
| |
| */
| |
| body.page-Main_Page .vector-column-end,
| |
| body.page-Main_Page .vector-appearance-landmark,
| |
| body.page-Main_Page #vector-appearance-pinned-container,
| |
| body.page-Main_Page .vector-pinned-container.vector-appearance-pinned-container {
| |
| display: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Break the Main Page out of Vector's multi-column
| |
| * content + Appearance grid.
| |
| */
| |
| body.page-Main_Page .mw-page-container {
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| padding-left: 0 !important;
| |
| padding-right: 0 !important;
| |
|
| |
| overflow-x: hidden !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-page-container-inner {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| padding-left: 0 !important;
| |
| padding-right: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * This is the actual centered homepage column.
| |
| */
| |
| body.page-Main_Page .mw-body {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: calc(100% - 48px) !important;
| |
| max-width: 1180px !important;
| |
| min-width: 0 !important;
| |
|
| |
| margin-left: auto !important;
| |
| margin-right: auto !important;
| |
|
| |
| padding-left: 0 !important;
| |
| padding-right: 0 !important;
| |
|
| |
| grid-column: auto !important;
| |
| grid-area: auto !important;
| |
|
| |
| transform: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Center the page tabs over the same column.
| |
| */
| |
| body.page-Main_Page .vector-page-toolbar-container,
| |
| body.page-Main_Page .vector-page-toolbar {
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
|
| |
| margin-left: auto !important;
| |
| margin-right: auto !important;
| |
|
| |
| padding-left: 0 !important;
| |
| padding-right: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * Remove inherited standard-width offsets.
| |
| */
| |
| body.page-Main_Page .mw-content-container,
| |
| body.page-Main_Page .mw-body-content,
| |
| body.page-Main_Page #bodyContent,
| |
| body.page-Main_Page .mw-parser-output {
| |
| position: relative !important;
| |
|
| |
| left: auto !important;
| |
| right: auto !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
| min-width: 0 !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| padding-left: 0 !important;
| |
| padding-right: 0 !important;
| |
|
| |
| transform: none !important;
| |
| }
| |
|
| |
| /*
| |
| * The redesigned homepage must stay completely inside
| |
| * the newly centered outer column.
| |
| */
| |
| body.page-Main_Page .rdx-home {
| |
| position: relative !important;
| |
|
| |
| left: auto !important;
| |
| right: auto !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
| min-width: 0 !important;
| |
|
| |
| margin: 2rem auto 0 !important;
| |
|
| |
| transform: none !important;
| |
| translate: none !important;
| |
|
| |
| overflow: hidden !important;
| |
| }
| |
|
| |
| /*
| |
| * Explicitly neutralize accidental horizontal movement
| |
| * inside the hero.
| |
| */
| |
| body.page-Main_Page .rdx-hero {
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
|
| |
| grid-template-columns:
| |
| minmax(0, 1.05fr)
| |
| minmax(380px, .95fr) !important;
| |
|
| |
| gap: clamp(2rem, 4vw, 3.5rem) !important;
| |
|
| |
| padding:
| |
| clamp(2.5rem, 5vw, 4.5rem) !important;
| |
|
| |
| margin: 0 !important;
| |
|
| |
| left: auto !important;
| |
| right: auto !important;
| |
|
| |
| transform: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero-copy,
| |
| body.page-Main_Page .rdx-graph {
| |
| position: relative !important;
| |
|
| |
| left: auto !important;
| |
| right: auto !important;
| |
|
| |
| min-width: 0 !important;
| |
| max-width: 100% !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| transform: none !important;
| |
| translate: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero-copy {
| |
| padding-left: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero-copy > * {
| |
| max-width: 100% !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero h1 {
| |
| width: auto !important;
| |
| max-width: 650px !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| font-size:
| |
| clamp(
| |
| 2.4rem,
| |
| 4.4vw,
| |
| 4.4rem
| |
| ) !important;
| |
|
| |
| line-height: .98 !important;
| |
|
| |
| white-space: normal !important;
| |
| overflow-wrap: normal !important;
| |
| word-break: normal !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero-copy > p {
| |
| width: auto !important;
| |
| max-width: 620px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-graph {
| |
| width: 100% !important;
| |
| max-width: 500px !important;
| |
|
| |
| margin-left: auto !important;
| |
| margin-right: auto !important;
| |
| }
| |
|
| |
| /*
| |
| * Keep every subsequent homepage section aligned to
| |
| * exactly the same left and right edges.
| |
| */
| |
| body.page-Main_Page .rdx-stats,
| |
| body.page-Main_Page .rdx-section,
| |
| body.page-Main_Page .rdx-trust,
| |
| body.page-Main_Page .rdx-footer {
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| left: auto !important;
| |
| right: auto !important;
| |
|
| |
| transform: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Tablet.
| |
| */
| |
| @media screen and (max-width: 1000px) {
| |
| body.page-Main_Page .mw-body {
| |
| width: calc(100% - 32px) !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero {
| |
| grid-template-columns: 1fr !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-graph {
| |
| max-width: 650px !important;
| |
| }
| |
| }
| |
|
| |
| /*
| |
| * Mobile.
| |
| */
| |
| @media screen and (max-width: 700px) {
| |
| body.page-Main_Page .mw-body {
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-home {
| |
| margin-top: 1rem !important;
| |
|
| |
| border-left: 0 !important;
| |
| border-right: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero,
| |
| body.page-Main_Page .rdx-section,
| |
| body.page-Main_Page .rdx-trust {
| |
| padding-left: 1.15rem !important;
| |
| padding-right: 1.15rem !important;
| |
| }
| |
| }
| |
|
| |
| /* RV_DATA_MAIN_PAGE_TRUE_CENTER_V2C_END */
| |
|
| |
| /* RV_DATA_MAIN_PAGE_VIEWPORT_CENTER_V2D_START */
| |
|
| |
| /*
| |
| * JavaScript performs the final viewport measurement.
| |
| * These rules remove any ancestor clipping that could
| |
| * prevent the measured correction from being visible.
| |
| */
| |
| body.page-Main_Page {
| |
| overflow-x: hidden !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-page-container,
| |
| body.page-Main_Page .mw-page-container-inner,
| |
| body.page-Main_Page .mw-body,
| |
| body.page-Main_Page .mw-content-container,
| |
| body.page-Main_Page .mw-body-content,
| |
| body.page-Main_Page #bodyContent,
| |
| body.page-Main_Page .mw-parser-output {
| |
| overflow-x: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-home {
| |
| box-sizing: border-box !important;
| |
|
| |
| left: 0 !important;
| |
| right: auto !important;
| |
|
| |
| margin-left: 0 !important;
| |
| margin-right: 0 !important;
| |
|
| |
| transform-origin: center top !important;
| |
| will-change: transform;
| |
| }
| |
|
| |
| /*
| |
| * Prevent the hero content from escaping the corrected
| |
| * viewport-centered homepage.
| |
| */
| |
| body.page-Main_Page .rdx-hero,
| |
| body.page-Main_Page .rdx-hero-copy,
| |
| body.page-Main_Page .rdx-graph,
| |
| body.page-Main_Page .rdx-stats,
| |
| body.page-Main_Page .rdx-section,
| |
| body.page-Main_Page .rdx-trust,
| |
| body.page-Main_Page .rdx-footer {
| |
| box-sizing: border-box !important;
| |
| min-width: 0 !important;
| |
| max-width: 100% !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-hero h1,
| |
| body.page-Main_Page .rdx-hero-copy > p {
| |
| width: auto !important;
| |
| white-space: normal !important;
| |
| overflow-wrap: normal !important;
| |
| word-break: normal !important;
| |
| }
| |
|
| |
| @media screen and (max-width: 700px) {
| |
| body.page-Main_Page .rdx-home {
| |
| border-left: 0 !important;
| |
| border-right: 0 !important;
| |
| }
| |
| }
| |
|
| |
| /* RV_DATA_MAIN_PAGE_VIEWPORT_CENTER_V2D_END */
| |
|
| |
| /* RV_DATA_NATIVE_HEADER_RESET_V2L_START */
| |
|
| |
| /*
| |
| * Header and page Tools now use Vector 2022's native
| |
| * responsive layout. Do not impose custom grid widths,
| |
| * fixed search cells, or fixed dropdown heights.
| |
| */
| |
|
| |
| body.page-Main_Page .vector-header-container,
| |
| body.page-Main_Page .vector-header,
| |
| body.page-Main_Page .vector-header-start,
| |
| body.page-Main_Page .vector-header-end,
| |
| body.page-Main_Page .vector-search-box,
| |
| body.page-Main_Page .vector-search-box-vue,
| |
| body.page-Main_Page .vector-page-toolbar-container,
| |
| body.page-Main_Page .vector-page-toolbar {
| |
| transform: none !important;
| |
| translate: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Preserve the intentionally hidden Main Page title,
| |
| * without changing the native header or search layout.
| |
| */
| |
| body.page-Main_Page .vector-page-titlebar,
| |
| body.page-Main_Page .mw-body-header {
| |
| display: none !important;
| |
| height: 0 !important;
| |
| min-height: 0 !important;
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| border: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * Remove the title area's leftover vertical spacing.
| |
| */
| |
| body.page-Main_Page .mw-body,
| |
| body.page-Main_Page .mw-content-container,
| |
| body.page-Main_Page .mw-body-content,
| |
| body.page-Main_Page #bodyContent,
| |
| body.page-Main_Page .mw-parser-output {
| |
| padding-top: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * Keep a small, deliberate gap before the homepage.
| |
| */
| |
| body.page-Main_Page .rdx-home {
| |
| margin-top: 16px !important;
| |
| }
| |
|
| |
| /* RV_DATA_NATIVE_HEADER_RESET_V2L_END */
| |
|
| |
| /* RV_DATA_TOOLBAR_CLUSTER_V2M_START */
| |
|
| |
| /*
| |
| * Keep the full-width divider, but center the actual
| |
| * Read/Edit/Edit source/View history/Tools controls
| |
| * as one compact group.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-container {
| |
| position: relative !important;
| |
| z-index: 300 !important;
| |
|
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
| justify-content: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| background: #ffffff !important;
| |
| border-bottom: 1px solid #c8ccd1 !important;
| |
| }
| |
|
| |
| /*
| |
| * Remove Vector's space-between layout.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
| justify-content: center !important;
| |
|
| |
| column-gap: 0 !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| max-width: calc(100% - 24px) !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 auto !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * The start and end groups must sit directly beside
| |
| * one another. The default end-group auto margin is
| |
| * what created the large empty gap.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start,
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-end {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
| justify-content: flex-start !important;
| |
|
| |
| flex: 0 0 auto !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| max-width: none !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-end {
| |
| margin-left: 2px !important;
| |
| }
| |
|
| |
| /*
| |
| * Keep only the top-level toolbar menu horizontal.
| |
| * Dropdown contents are deliberately not selected.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu,
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-end
| |
| > .vector-menu,
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-end
| |
| > .vector-page-tools-landmark {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
|
| |
| flex: 0 0 auto !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu
| |
| > .vector-menu-content
| |
| > .vector-menu-content-list {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
| flex-wrap: nowrap !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * Compact top-level action tabs.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu
| |
| > .vector-menu-content
| |
| > .vector-menu-content-list
| |
| > .mw-list-item {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
|
| |
| flex: 0 0 auto !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu
| |
| > .vector-menu-content
| |
| > .vector-menu-content-list
| |
| > .mw-list-item
| |
| > a {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: 48px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 14px !important;
| |
|
| |
| font-size: 16px !important;
| |
| line-height: 1 !important;
| |
|
| |
| white-space: nowrap !important;
| |
| }
| |
|
| |
| /*
| |
| * Tools button sits directly after View history.
| |
| * This does not modify the dropdown panel itself.
| |
| */
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown {
| |
| position: relative !important;
| |
|
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
|
| |
| flex: 0 0 auto !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| > .vector-dropdown-label {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
|
| |
| min-height: 48px !important;
| |
| height: 48px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 14px !important;
| |
|
| |
| font-size: 16px !important;
| |
| line-height: 1 !important;
| |
|
| |
| white-space: nowrap !important;
| |
| }
| |
|
| |
| /*
| |
| * Preserve the selected Read underline.
| |
| */
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu
| |
| > .vector-menu-content
| |
| > .vector-menu-content-list
| |
| > .selected
| |
| > a {
| |
| border-bottom: 3px solid #202122 !important;
| |
| }
| |
|
| |
| /*
| |
| * Narrow screens may scroll the toolbar rather than
| |
| * separating or wrapping its controls.
| |
| */
| |
| @media screen and (max-width: 620px) {
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-container {
| |
| justify-content: flex-start !important;
| |
|
| |
| overflow-x: auto !important;
| |
| overflow-y: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar {
| |
| max-width: none !important;
| |
|
| |
| margin-left: 8px !important;
| |
| margin-right: 8px !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-start
| |
| > .vector-menu
| |
| > .vector-menu-content
| |
| > .vector-menu-content-list
| |
| > .mw-list-item
| |
| > a,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| > .vector-dropdown-label {
| |
| padding-left: 11px !important;
| |
| padding-right: 11px !important;
| |
|
| |
| font-size: 15px !important;
| |
| }
| |
| }
| |
|
| |
| /*
| |
| * Dark appearance.
| |
| */
| |
| html.skin-theme-clientpref-night
| |
| body.page-Main_Page
| |
| .vector-page-toolbar-container {
| |
| background: #15171b !important;
| |
| border-color: #34373e !important;
| |
| }
| |
|
| |
| /* RV_DATA_TOOLBAR_CLUSTER_V2M_END */
| |
