|
|
| (13 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_TOOLS_LIST_UNCLIP_V2I_START */
| |
|
| |
| /*
| |
| * The earlier header stylesheet sets every toolbar
| |
| * .vector-menu-content-list to 43px tall.
| |
| *
| |
| * Override that rule only inside the Tools dropdown.
| |
| */
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content {
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 300px !important;
| |
| min-width: 300px !important;
| |
| max-width: calc(100vw - 24px) !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 0 !important;
| |
| max-height: calc(100vh - 150px) !important;
| |
|
| |
| overflow-x: hidden !important;
| |
| overflow-y: auto !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .vector-pinnable-container,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .vector-menu,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .vector-menu-content,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .vector-menu-content-list {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
| max-width: 100% !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 0 !important;
| |
| max-height: none !important;
| |
|
| |
| margin: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| float: none !important;
| |
| position: static !important;
| |
|
| |
| transform: none !important;
| |
| translate: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Restore every General and Actions list item.
| |
| */
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .mw-list-item,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| li {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 0 !important;
| |
| max-height: none !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| float: none !important;
| |
| position: static !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * Restore readable menu links.
| |
| */
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .mw-list-item
| |
| > a,
| |
|
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| li
| |
| > a {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 40px !important;
| |
| max-height: none !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 9px 16px !important;
| |
|
| |
| font-size: 15px !important;
| |
| line-height: 1.4 !important;
| |
|
| |
| white-space: normal !important;
| |
| overflow-wrap: anywhere !important;
| |
| }
| |
|
| |
| /*
| |
| * Keep section headings compact.
| |
| */
| |
| body.page-Main_Page
| |
| #vector-page-tools-dropdown
| |
| .vector-dropdown-content
| |
| .vector-menu-heading {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 0 !important;
| |
| max-height: none !important;
| |
|
| |
| margin: 0 16px !important;
| |
| padding: 14px 0 8px !important;
| |
|
| |
| font-size: 14px !important;
| |
| line-height: 1.3 !important;
| |
|
| |
| position: static !important;
| |
| }
| |
|
| |
| /* RV_DATA_TOOLS_LIST_UNCLIP_V2I_END */
| |
|
| |
| /* RV_DATA_HEADER_FINAL_V2K_START */
| |
|
| |
| /*
| |
| * ==================================================
| |
| * MAIN PAGE HEADER
| |
| * ==================================================
| |
| *
| |
| * Three equal structural areas:
| |
| *
| |
| * Left: Roovet Data logo
| |
| * Center: search
| |
| * Right: account controls
| |
| *
| |
| * Equal flexible side columns keep search truly
| |
| * centered in the viewport.
| |
| */
| |
|
| |
| body.page-Main_Page .vector-header-container {
| |
| position: relative !important;
| |
| z-index: 500 !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| height: 78px !important;
| |
| min-height: 78px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| background: #ffffff !important;
| |
| border-bottom: 1px solid #d9dde5 !important;
| |
|
| |
| box-shadow:
| |
| 0 2px 10px
| |
| rgba(16, 24, 40, .04) !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-header {
| |
| display: grid !important;
| |
|
| |
| grid-template-columns:
| |
| minmax(300px, 1fr)
| |
| minmax(460px, 620px)
| |
| minmax(300px, 1fr) !important;
| |
|
| |
| grid-template-rows: 78px !important;
| |
|
| |
| align-items: center !important;
| |
|
| |
| column-gap: 24px !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: calc(100% - 64px) !important;
| |
| max-width: none !important;
| |
| min-width: 0 !important;
| |
|
| |
| height: 78px !important;
| |
| min-height: 78px !important;
| |
|
| |
| margin: 0 auto !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * Reset inherited Vector positioning.
| |
| */
| |
|
| |
| body.page-Main_Page .vector-header-start,
| |
| body.page-Main_Page .vector-search-box,
| |
| body.page-Main_Page .vector-search-box-vue,
| |
| body.page-Main_Page .vector-header-end {
| |
| position: static !important;
| |
|
| |
| top: auto !important;
| |
| right: auto !important;
| |
| bottom: auto !important;
| |
| left: auto !important;
| |
|
| |
| float: none !important;
| |
|
| |
| transform: none !important;
| |
| translate: none !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * ==================================================
| |
| * LEFT: LOGO AND MENU
| |
| * ==================================================
| |
| */
| |
|
| |
| body.page-Main_Page .vector-header-start {
| |
| grid-column: 1 !important;
| |
| grid-row: 1 !important;
| |
|
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: flex-start !important;
| |
|
| |
| gap: 12px !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
| max-width: none !important;
| |
|
| |
| height: 78px !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-main-menu-landmark,
| |
| body.page-Main_Page .vector-main-menu-dropdown {
| |
| position: relative !important;
| |
|
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: center !important;
| |
|
| |
| flex: 0 0 40px !important;
| |
|
| |
| width: 40px !important;
| |
| height: 40px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-main-menu-landmark
| |
| .vector-dropdown-label,
| |
|
| |
| body.page-Main_Page .vector-main-menu-dropdown
| |
| .vector-dropdown-label {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 40px !important;
| |
| height: 40px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
| max-width: 310px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo-icon {
| |
| flex: 0 0 48px !important;
| |
|
| |
| width: 48px !important;
| |
| height: 48px !important;
| |
|
| |
| margin: 0 12px 0 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo-container {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| min-width: 0 !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo-wordmark {
| |
| display: block !important;
| |
|
| |
| width: auto !important;
| |
| max-width: 220px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * ==================================================
| |
| * CENTER: SEARCH
| |
| * ==================================================
| |
| */
| |
|
| |
| body.page-Main_Page .vector-search-box,
| |
| body.page-Main_Page .vector-search-box-vue {
| |
| grid-column: 2 !important;
| |
| grid-row: 1 !important;
| |
|
| |
| align-self: center !important;
| |
| justify-self: stretch !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: 620px !important;
| |
| min-width: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| z-index: 2 !important;
| |
| }
| |
|
| |
| /*
| |
| * Every outer search wrapper receives the same width.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box
| |
| .vector-typeahead-search-container,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-vue
| |
| .vector-typeahead-search-container,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box
| |
| .cdx-typeahead-search,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-vue
| |
| .cdx-typeahead-search {
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: 100% !important;
| |
| min-width: 0 !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * The search form has exactly two children:
| |
| *
| |
| * 1. Input wrapper
| |
| * 2. Search button
| |
| */
| |
|
| |
| body.page-Main_Page .cdx-search-input,
| |
| body.page-Main_Page .vector-search-box form,
| |
| body.page-Main_Page .vector-search-box-vue form {
| |
| display: flex !important;
| |
| align-items: stretch !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: 100% !important;
| |
| min-width: 0 !important;
| |
|
| |
| height: 46px !important;
| |
| min-height: 46px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| gap: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * This wrapper caused the empty middle section.
| |
| *
| |
| * It must flex as one complete unit and must not
| |
| * behave like a second visible search cell.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__input-wrapper {
| |
| display: block !important;
| |
|
| |
| position: relative !important;
| |
|
| |
| flex: 1 1 auto !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| max-width: none !important;
| |
| min-width: 0 !important;
| |
|
| |
| height: 46px !important;
| |
| min-height: 46px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * The Codex text-input must fill the entire wrapper.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__input-wrapper
| |
| .cdx-text-input {
| |
| display: block !important;
| |
|
| |
| position: relative !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: 100% !important;
| |
| min-width: 0 !important;
| |
|
| |
| height: 46px !important;
| |
| min-height: 46px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| }
| |
|
| |
| /*
| |
| * Actual text field.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__input-wrapper
| |
| .cdx-text-input__input,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-input,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box
| |
| input[type="search"],
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-vue
| |
| input[type="search"] {
| |
| display: block !important;
| |
|
| |
| position: relative !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: 100% !important;
| |
| min-width: 0 !important;
| |
|
| |
| height: 46px !important;
| |
| min-height: 46px !important;
| |
|
| |
| margin: 0 !important;
| |
|
| |
| padding-top: 0 !important;
| |
| padding-right: 16px !important;
| |
| padding-bottom: 0 !important;
| |
| padding-left: 48px !important;
| |
|
| |
| color: #54595d !important;
| |
| background: #ffffff !important;
| |
|
| |
| border: 1px solid #a2a9b1 !important;
| |
| border-right: 0 !important;
| |
| border-radius: 4px 0 0 4px !important;
| |
|
| |
| font-size: 16px !important;
| |
| line-height: 44px !important;
| |
|
| |
| box-shadow: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Search icon stays inside the text field.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__input-wrapper
| |
| .cdx-text-input__start-icon,
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__input-wrapper
| |
| .cdx-text-input__icon {
| |
| position: absolute !important;
| |
|
| |
| top: 50% !important;
| |
| left: 15px !important;
| |
|
| |
| z-index: 4 !important;
| |
|
| |
| width: 22px !important;
| |
| height: 22px !important;
| |
|
| |
| margin: 0 !important;
| |
|
| |
| transform:
| |
| translateY(-50%) !important;
| |
|
| |
| pointer-events: none !important;
| |
| }
| |
|
| |
| /*
| |
| * Search button is one fixed right-hand cell.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .cdx-search-input__end-button,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-button,
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box
| |
| button[type="submit"],
| |
|
| |
| body.page-Main_Page
| |
| .vector-search-box-vue
| |
| button[type="submit"] {
| |
| position: static !important;
| |
|
| |
| flex: 0 0 108px !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 108px !important;
| |
| min-width: 108px !important;
| |
| max-width: 108px !important;
| |
|
| |
| height: 46px !important;
| |
| min-height: 46px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 16px !important;
| |
|
| |
| color: #202122 !important;
| |
| background: #f8f9fa !important;
| |
|
| |
| border: 1px solid #72777d !important;
| |
| border-radius: 0 4px 4px 0 !important;
| |
|
| |
| font-size: 16px !important;
| |
| font-weight: 700 !important;
| |
| line-height: 44px !important;
| |
|
| |
| white-space: nowrap !important;
| |
|
| |
| transform: none !important;
| |
| }
| |
|
| |
| /*
| |
| * ==================================================
| |
| * RIGHT: ACCOUNT CONTROLS
| |
| * ==================================================
| |
| */
| |
|
| |
| body.page-Main_Page .vector-header-end {
| |
| grid-column: 3 !important;
| |
| grid-row: 1 !important;
| |
|
| |
| align-self: center !important;
| |
| justify-self: stretch !important;
| |
|
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: flex-end !important;
| |
|
| |
| gap: 12px !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-width: 0 !important;
| |
| max-width: none !important;
| |
|
| |
| height: 78px !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| z-index: 3 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-user-links,
| |
| body.page-Main_Page .vector-user-links-main,
| |
| body.page-Main_Page .vector-user-links-overflow {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| flex-wrap: nowrap !important;
| |
|
| |
| gap: 10px !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
| max-width: none !important;
| |
|
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-header-end
| |
| .mw-list-item,
| |
|
| |
| body.page-Main_Page
| |
| .vector-header-end
| |
| .vector-dropdown {
| |
| position: relative !important;
| |
|
| |
| display: block !important;
| |
|
| |
| flex: 0 0 auto !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
| max-width: none !important;
| |
|
| |
| height: auto !important;
| |
| min-height: 0 !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-header-end
| |
| .mw-list-item
| |
| > a,
| |
|
| |
| body.page-Main_Page
| |
| .vector-header-end
| |
| .vector-dropdown-label {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: auto !important;
| |
| min-width: 0 !important;
| |
| max-width: none !important;
| |
|
| |
| height: 40px !important;
| |
| min-height: 40px !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 5px !important;
| |
|
| |
| white-space: nowrap !important;
| |
|
| |
| overflow: visible !important;
| |
| text-overflow: clip !important;
| |
| }
| |
|
| |
| /*
| |
| * ==================================================
| |
| * REMOVE THE LARGE EMPTY BAND
| |
| * ==================================================
| |
| */
| |
|
| |
| body.page-Main_Page .vector-page-titlebar,
| |
| body.page-Main_Page .mw-body-header {
| |
| display: none !important;
| |
|
| |
| width: 0 !important;
| |
| height: 0 !important;
| |
| min-height: 0 !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| border: 0 !important;
| |
|
| |
| overflow: hidden !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-body {
| |
| padding-top: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-content-container {
| |
| padding-top: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-page-toolbar-container {
| |
| position: relative !important;
| |
| z-index: 300 !important;
| |
|
| |
| display: block !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: 100% !important;
| |
| min-height: 46px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
|
| |
| background: #ffffff !important;
| |
| border-bottom: 1px solid #d9dde5 !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-page-toolbar {
| |
| display: flex !important;
| |
| align-items: center !important;
| |
| justify-content: flex-end !important;
| |
|
| |
| box-sizing: border-box !important;
| |
|
| |
| width: calc(100% - 64px) !important;
| |
| max-width: 1180px !important;
| |
| min-height: 46px !important;
| |
| height: auto !important;
| |
|
| |
| margin: 0 auto !important;
| |
| padding: 0 !important;
| |
|
| |
| overflow: visible !important;
| |
| }
| |
|
| |
| /*
| |
| * Only direct toolbar items receive compact spacing.
| |
| * Dropdown descendants are left alone.
| |
| */
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar
| |
| > .vector-page-toolbar-container,
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar
| |
| > .vector-page-toolbar-start,
| |
|
| |
| body.page-Main_Page
| |
| .vector-page-toolbar
| |
| > .vector-page-toolbar-end {
| |
| min-height: 46px !important;
| |
| height: auto !important;
| |
| }
| |
|
| |
| body.page-Main_Page .rdx-home {
| |
| margin-top: 18px !important;
| |
| }
| |
|
| |
| /*
| |
| * ==================================================
| |
| * RESPONSIVE HEADER
| |
| * ==================================================
| |
| */
| |
|
| |
| @media screen and (max-width: 1150px) {
| |
| body.page-Main_Page .vector-header {
| |
| grid-template-columns:
| |
| minmax(220px, 1fr)
| |
| minmax(360px, 540px)
| |
| minmax(220px, 1fr) !important;
| |
|
| |
| width: calc(100% - 32px) !important;
| |
| column-gap: 16px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo {
| |
| max-width: 235px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo-wordmark {
| |
| max-width: 170px !important;
| |
| }
| |
| }
| |
|
| |
| @media screen and (max-width: 900px) {
| |
| body.page-Main_Page .vector-header-container {
| |
| height: auto !important;
| |
| min-height: 126px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-header {
| |
| grid-template-columns:
| |
| minmax(100px, 1fr)
| |
| minmax(100px, 1fr) !important;
| |
|
| |
| grid-template-rows:
| |
| 68px
| |
| 58px !important;
| |
|
| |
| width: calc(100% - 24px) !important;
| |
| height: auto !important;
| |
| min-height: 126px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-header-start {
| |
| grid-column: 1 !important;
| |
| grid-row: 1 !important;
| |
|
| |
| height: 68px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-header-end {
| |
| grid-column: 2 !important;
| |
| grid-row: 1 !important;
| |
|
| |
| height: 68px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-search-box,
| |
| body.page-Main_Page .vector-search-box-vue {
| |
| grid-column: 1 / -1 !important;
| |
| grid-row: 2 !important;
| |
|
| |
| width: 100% !important;
| |
| max-width: none !important;
| |
| }
| |
| }
| |
|
| |
| @media screen and (max-width: 620px) {
| |
| body.page-Main_Page .mw-logo-wordmark,
| |
| body.page-Main_Page .mw-logo-tagline {
| |
| display: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo {
| |
| width: 48px !important;
| |
| max-width: 48px !important;
| |
| }
| |
|
| |
| body.page-Main_Page .mw-logo-icon {
| |
| margin-right: 0 !important;
| |
| }
| |
|
| |
| body.page-Main_Page
| |
| .vector-header-end
| |
| .user-links-collapsible-item {
| |
| display: none !important;
| |
| }
| |
|
| |
| body.page-Main_Page .vector-page-toolbar {
| |
| width: calc(100% - 20px) !important;
| |
|
| |
| justify-content: flex-start !important;
| |
|
| |
| overflow-x: auto !important;
| |
| }
| |
| }
| |
|
| |
| /*
| |
| * Dark appearance.
| |
| */
| |
|
| |
| html.skin-theme-clientpref-night
| |
| body.page-Main_Page .vector-header-container,
| |
|
| |
| html.skin-theme-clientpref-night
| |
| body.page-Main_Page .vector-page-toolbar-container {
| |
| background: #15171b !important;
| |
| border-color: #34373e !important;
| |
| }
| |
|
| |
| /* RV_DATA_HEADER_FINAL_V2K_END */
| |