/* Wiki layout shared by the guide hub and all articles. */
:root {
    color-scheme:light;
    --bg:#fff;
    --header:#f6f7fb;
    --panel:#f8f9fc;
    --text:#191d2a;
    --muted:#60687b;
    --border:#dce0e9;
    --accent:#4166df;
    --accent-hover:#294dca;
    --soft:#eef2ff;
    --note:#edf1ff;
    --code:#f1f3f8;
    --shadow:0 20px 80px #15244826
}
:root[data-theme=dark] {
    color-scheme:dark;
    --bg:#101115;
    --header:#17181e;
    --panel:#191b22;
    --text:#eceef5;
    --muted:#a5abba;
    --border:#30333f;
    --accent:#99b2ff;
    --accent-hover:#c4d2ff;
    --soft:#242e48;
    --note:#1e2944;
    --code:#20232d;
    --shadow:0 20px 80px #0008
}
@media(prefers-color-scheme:dark) {
    :root:not([data-theme=light]) {
        color-scheme:dark;
        --bg:#101115;
        --header:#17181e;
        --panel:#191b22;
        --text:#eceef5;
        --muted:#a5abba;
        --border:#30333f;
        --accent:#99b2ff;
        --accent-hover:#c4d2ff;
        --soft:#242e48;
        --note:#1e2944;
        --code:#20232d;
        --shadow:0 20px 80px #0008
    }
}
* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:90px
}
body {
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    font-size:16px;
    line-height:1.75
}
button,input,select {
    font:inherit
}
button,a,input,select,summary {
    -webkit-tap-highlight-color:transparent
}
a {
    color:var(--accent);
    text-underline-offset:3px
}
a:hover {
    color:var(--accent-hover)
}
button,summary,select {
    cursor:pointer
}
button {
    color:inherit
}
h1,h2,h3,h4 {
    line-height:1.25;
    letter-spacing:-.025em;
    color:var(--text)
}
h1 {
    font-size:2.7rem;
    margin:0 0 20px;
    font-weight:750
}
h2 {
    font-size:1.75rem;
    font-weight:650;
    margin:36px 0 18px
}
h3 {
    font-size:1.2rem;
    margin:28px 0 12px
}
h4 {
    font-size:1rem;
    margin:0 0 12px
}
p {
    margin:0 0 18px
}
img {
    max-width:100%;
    height:auto
}
svg {
    width:20px;
    height:20px;
    flex-shrink:0
}
[hidden] {
    display:none!important
}
:focus-visible {
    outline:3px solid var(--accent);
    outline-offset:4px
}
main:focus {
    outline:none
}
.sr-only {
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0
}
.skip-link {
    position:fixed;
    left:16px;
    top:-80px;
    z-index:100;
    padding:10px 20px;
    background:var(--bg);
    border:2px solid var(--accent);
    border-radius:6px
}
.skip-link:focus {
    top:10px
}
/* Fixed documentation header */
.wiki-header {
    height:65px;
    position:fixed;
    inset:0 0 auto;
    display:flex;
    align-items:center;
    gap:28px;
    padding:0 26px;
    border-bottom:1px solid var(--border);
    background:var(--header);
    z-index:40
}
.wiki-brand {
    min-width:202px;
    font-size:1.4rem;
    font-weight:750;
    letter-spacing:-.045em;
    text-decoration:none;
    color:var(--accent);
    white-space:nowrap
}
.wiki-brand span {
    font-weight:450;
    letter-spacing:-.03em
}
.search-trigger {
    display:flex;
    align-items:center;
    gap:10px;
    width:350px;
    border:1px solid var(--border);
    border-radius:7px;
    padding:8px 12px;
    background:var(--bg);
    color:var(--muted);
    font-size:.82rem;
    text-align:left
}
.search-trigger:hover {
    border-color:var(--accent)
}
.search-trigger kbd {
    margin-left:auto;
    font-size:.68rem;
    background:var(--soft);
    padding:1px 6px;
    border-radius:3px;
    color:var(--muted)
}
.header-actions {
    display:flex;
    align-items:center;
    gap:20px;
    margin-left:auto
}
.site-link {
    text-decoration:none;
    font-size:.8rem;
    color:var(--muted)
}
.theme-control {
    border-left:1px solid var(--border);
    padding-left:18px
}
.theme-control select {
    border:0;
    color:var(--text);
    background:var(--header);
    font-size:.8rem;
    padding:6px
}
.menu-toggle {
    display:none;
    border:1px solid var(--border);
    background:var(--bg);
    border-radius:6px;
    padding:5px 10px;
    font-size:.8rem
}
/* Wiki landing page */
.wiki-home-main {
    max-width:1120px;
    margin:65px auto 0;
    padding:0 30px
}
.wiki-home .wiki-sidebar {
    display:none
}
.wiki-hero {
    display:grid;
    grid-template-columns:1.65fr 1fr;
    gap:70px;
    align-items:center;
    padding:132px 0 120px
}
.eyebrow {
    display:block;
    font-size:.68rem;
    letter-spacing:.14em;
    font-weight:650;
    color:var(--muted);
    margin-bottom:20px
}
.wiki-hero h1 {
    font-size:clamp(3rem,5vw,4.2rem);
    color:var(--accent);
    letter-spacing:-.045em;
    margin-bottom:20px
}
.wiki-hero p {
    font-size:1.2rem;
    line-height:1.8;
    max-width:570px;
    color:var(--muted)
}
.hero-actions {
    display:flex;
    align-items:center;
    gap:28px;
    margin-top:30px
}
.hero-actions a {
    display:flex;
    align-items:center;
    gap:14px;
    font-size:.9rem;
    text-decoration:none
}
.primary-button {
    background:#4166df;
    color:#fff!important;
    border-radius:30px;
    padding:13px 23px
}
.primary-button:hover {
    background:#294dca
}
.hero-logo {
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative
}
.hero-logo img {
    width:230px;
    height:230px;
    object-fit:contain;
    filter:none
}
.wiki-note {
    background:var(--note);
    border-left:4px solid var(--accent);
    padding:20px 24px;
    margin-bottom:36px;
    font-size:.94rem
}
.wiki-note strong {
    display:block;
    color:var(--accent);
    font-size:1.06rem;
    margin-bottom:8px
}
.wiki-note p {
    margin:0
}
.hub-section {
    margin:36px 0 48px;
    scroll-margin-top:0
}
.hub-section h2 {
    margin:0 0 20px;
    font-size:1.85rem
}
.section-intro {
    color:var(--muted);
    margin-top:-8px
}
.topic-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px
}
.topic-card {
    position:relative;
    display:block;
    border:1px solid var(--border);
    border-radius:7px;
    padding:22px 24px;
    text-decoration:none;
    transition:border-color .15s,background .15s
}
.topic-card:hover {
    border-color:var(--accent);
    background:var(--panel)
}
.topic-card h3 {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:20px;
    font-size:1.08rem;
    line-height:1.5;
    margin:0 0 8px
}
.topic-card h3 span {
    color:var(--muted);
    font-weight:400
}
.topic-card p {
    font-size:.91rem;
    color:var(--muted);
    margin:0 0 10px
}
.topic-card>span {
    font-size:.73rem;
    color:var(--muted)
}
.home-faq details {
    border-bottom:1px solid var(--border);
    padding:17px 0
}
.home-faq summary {
    font-weight:600
}
.home-faq p {
    margin:14px 0 0;
    color:var(--muted)
}
/* Persistent navigation and article contents */
.wiki-sidebar {
    position:fixed;
    top:65px;
    bottom:0;
    left:0;
    width:260px;
    overflow-y:auto;
    border-right:1px solid var(--border);
    padding:28px 20px 40px;
    background:var(--bg);
    z-index:30;
    scrollbar-width:thin
}
.wiki-sidebar a {
    display:block;
    font-size:.81rem;
    color:var(--muted);
    text-decoration:none;
    line-height:1.6;
    padding:6px 12px;
    border-radius:5px
}
.wiki-sidebar a:hover {
    background:var(--panel);
    color:var(--text)
}
.wiki-sidebar .sidebar-home {
    margin-bottom:22px;
    color:var(--text);
    font-weight:600
}
.wiki-sidebar details {
    margin-bottom:12px
}
.wiki-sidebar summary {
    font-size:.85rem;
    font-weight:650;
    padding:5px 0;
    list-style:none;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px
}
.wiki-sidebar summary::after {
    content:'›';
    font-size:1.2rem;
    line-height:1;
    transform:rotate(0deg)
}
.wiki-sidebar details[open]>summary::after {
    transform:rotate(90deg)
}
.wiki-sidebar details>a {
    margin-left:8px;
    border-left:1px solid var(--border);
    border-radius:0
}
.wiki-sidebar a.current,.wiki-sidebar a[aria-current=location] {
    background:var(--soft);
    color:var(--accent);
    border-radius:4px;
    border-left-color:var(--accent)
}
.sidebar-resources {
    border-top:1px solid var(--border);
    margin-top:24px;
    padding-top:20px
}
.sidebar-resources>span {
    display:block;
    font-size:.72rem;
    color:var(--muted);
    padding:0 12px 8px
}
.article-layout {
    margin:65px 0 0 260px;
    display:grid;
    grid-template-columns:minmax(0,800px) 210px;
    justify-content:center;
    gap:50px;
    padding:42px 44px 0
}
.article-layout>main {
    min-width:0
}
.breadcrumbs {
    display:flex;
    align-items:center;
    gap:10px;
    color:var(--muted);
    font-size:.77rem;
    margin-bottom:24px
}
.breadcrumbs a {
    text-decoration:none
}
.article-intro {
    font-size:1.05rem;
    color:var(--muted);
    margin-bottom:32px
}
.wiki-toc {
    position:sticky;
    top:106px;
    align-self:start;
    max-height:calc(100vh - 130px);
    overflow-y:auto;
    border-left:1px solid var(--border);
    padding-left:18px;
    font-size:.78rem;
    scrollbar-width:thin
}
.wiki-toc strong {
    display:block;
    font-weight:600;
    margin:0 0 12px
}
.wiki-toc a {
    display:block;
    line-height:1.6;
    padding:6px 0;
    color:var(--muted);
    text-decoration:none
}
.wiki-toc a:hover,.wiki-toc a[aria-current=location] {
    color:var(--accent)
}
.mobile-toc {
    display:none
}
.guide-card {
    padding:0;
    margin:38px 0 48px;
    scroll-margin-top:0;
    overflow-wrap:anywhere
}
.guide-card h2 {
    border-top:1px solid var(--border);
    padding-top:30px
}
.guide-card h3 {
    scroll-margin-top:0
}
.guide-card p,.guide-card li {
    font-size:.96rem;
    line-height:1.85
}
.guide-card ul,.guide-card ol {
    padding-left:25px;
    margin:16px 0 24px
}
.guide-card li {
    padding-left:4px;
    margin-bottom:9px
}
.guide-card ul ul,.guide-card ol ol {
    margin:10px 0
}
.guide-card code,.guide-card .path,.faq-path {
    background:var(--code);
    border:1px solid var(--border);
    border-radius:4px;
    padding:2px 6px;
    font-size:.85em;
    overflow-wrap:anywhere
}
.guide-card pre {
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    background:var(--code);
    padding:16px;
    border-radius:6px
}
.warning-banner,.requirements-box,.error-card {
    padding:18px 22px;
    margin:24px 0;
    background:var(--note);
    border-left:3px solid var(--accent);
    font-size:.9rem
}
.warning-banner {
    color:var(--muted);
    background:var(--panel);
    border-color:var(--border)
}
.requirements-box h4 {
    color:var(--accent)
}
.requirements-box a {
    display:block;
    overflow-wrap:anywhere
}
.error-card {
    background:var(--panel);
    border-color:#d09858
}
.error-card h4 {
    color:var(--text)
}
.error-card p:last-child,.requirements-box p:last-child {
    margin-bottom:0
}
.guide-image {
    display:block;
    border:1px solid var(--border);
    border-radius:7px;
    margin:24px 0
}
.image-row {
    display:flex;
    gap:16px;
    flex-wrap:wrap
}
.image-row img {
    min-width:0;
    max-width:100%;
    object-fit:contain
}
.video-guides-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
    gap:20px
}
.video-wrapper {
    position:relative;
    aspect-ratio:16/9
}
.video-wrapper iframe {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    border:0
}
.video-info {
    padding:16px
}
.faq {
    border-bottom:1px solid var(--border);
    padding:16px 0
}
.faq summary {
    font-weight:600;
    line-height:1.6
}
.faq-a-inner {
    margin-top:18px
}
.article-help {
    border-top:1px solid var(--border);
    padding-top:12px;
    color:var(--muted);
    font-size:.87rem
}
.article-help h2 {
    font-size:1.12rem;
    margin:20px 0 12px
}
.article-pagination {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
    margin:36px 0
}
.article-pagination a {
    display:flex;
    flex-direction:column;
    text-decoration:none;
    border:1px solid var(--border);
    border-radius:7px;
    padding:16px 20px
}
.article-pagination a:hover {
    border-color:var(--accent)
}
.article-pagination a:last-child {
    text-align:right
}
.article-pagination span {
    font-size:.72rem;
    color:var(--muted)
}
.article-pagination strong {
    font-weight:550;
    font-size:.95rem
}
.wiki-footer {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border-top:1px solid var(--border);
    padding:28px 0 35px;
    margin-top:40px;
    font-size:.73rem;
    color:var(--muted)
}
.wiki-footer div {
    display:flex;
    gap:18px
}
.wiki-footer a {
    color:var(--muted);
    text-decoration:none
}
.heading-link {
    font-size:.7em;
    font-weight:400;
    margin-left:10px;
    opacity:0;
    text-decoration:none
}
.guide-card h2:hover .heading-link,.heading-link:focus-visible {
    opacity:1
}
/* Keyboard-accessible site search */
.search-dialog {
    position:fixed;
    top:12vh;
    margin:0 auto;
    width:min(640px,calc(100% - 32px));
    max-height:76vh;
    padding:0;
    border:1px solid var(--border);
    border-radius:12px;
    background:var(--bg);
    color:var(--text);
    box-shadow:var(--shadow)
}
.search-dialog::backdrop {
    background:#090e2280;
    backdrop-filter:blur(4px)
}
.search-dialog-top {
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 20px;
    border-bottom:1px solid var(--border)
}
.search-dialog-top svg {
    color:var(--accent)
}
.search-dialog-top input {
    min-width:0;
    width:100%;
    border:0;
    background:none;
    outline:0;
    color:var(--text);
    font-size:.95rem
}
.search-dialog-top button {
    border:1px solid var(--border);
    border-radius:4px;
    background:var(--panel);
    font-size:.7rem;
    padding:4px 7px
}
#search-status {
    padding:12px 20px;
    margin:0;
    color:var(--muted);
    font-size:.8rem
}
.search-results {
    max-height:46vh;
    overflow-y:auto;
    padding:0 10px 10px
}
.search-results:empty {
    display:none
}
.search-results a {
    display:flex;
    flex-direction:column;
    gap:3px;
    padding:12px;
    border-radius:6px;
    text-decoration:none;
    color:var(--text)
}
.search-results a:hover,.search-results a:focus {
    background:var(--soft)
}
.search-results span {
    font-size:.7rem;
    color:var(--accent)
}
.search-results strong {
    font-size:.92rem;
    font-weight:600
}
.search-hint {
    padding:10px 20px;
    border-top:1px solid var(--border);
    font-size:.7rem;
    color:var(--muted)
}
@media(min-width:1600px) {
    .article-layout {
        gap:64px;
        padding-left:60px;
        padding-right:60px
    }
}
@media(max-width:1200px) {
    .wiki-toc {
        display:none
    }
    .article-layout {
        grid-template-columns:minmax(0,800px);
        padding:36px 36px 0
    }
    .mobile-toc {
        display:block;
        border:1px solid var(--border);
        border-radius:6px;
        padding:12px 16px;
        margin:24px 0
    }
    .mobile-toc summary {
        font-size:.85rem;
        font-weight:600
    }
    .mobile-toc a {
        display:block;
        padding:5px 0;
        font-size:.82rem;
        text-decoration:none
    }
    .wiki-footer {
        flex-wrap:wrap
    }
    .wiki-hero {
        padding:95px 0
    }
}
@media(max-width:900px) {
    .wiki-header {
        padding:0 20px;
        gap:20px
    }
    .wiki-brand {
        min-width:auto
    }
    .search-trigger {
        width:240px
    }
    .site-link {
        display:none
    }
    .header-actions {
        gap:12px
    }
    .menu-toggle {
        display:block
    }
    .wiki-sidebar {
        display:none!important;
        width:min(320px,100%);
        box-shadow:var(--shadow)
    }
    body.menu-open .wiki-sidebar {
        display:block!important
    }
    .article-layout {
        margin-left:0;
        display:block;
        max-width:820px;
        margin-right:auto;
        padding:32px 28px 0
    }
    .wiki-home-main {
        padding:0 28px
    }
    .wiki-hero {
        gap:30px;
        padding:80px 0
    }
    .hero-logo img {
        width:190px;
        height:190px
    }
    .wiki-hero p {
        font-size:1.05rem
    }
    .wiki-hero h1 {
        font-size:3.2rem
    }
    .wiki-toc {
        display:none
    }
    .hero-actions {
        gap:20px
    }
}
@media(max-width:600px) {
    .wiki-header {
        height:61px;
        padding:0 16px;
        gap:12px
    }
    .wiki-brand {
        font-size:1.15rem
    }
    .search-trigger {
        width:36px;
        height:36px;
        padding:7px;
        justify-content:center;
        margin-left:auto
    }
    .search-trigger span,.search-trigger kbd {
        display:none
    }
    .header-actions {
        margin-left:0;
        gap:8px
    }
    .theme-control {
        padding-left:0;
        border:0
    }
    .theme-control select {
        font-size:.75rem;
        max-width:72px;
        padding:5px 0
    }
    .menu-toggle {
        font-size:.73rem;
        padding:5px 8px
    }
    .wiki-sidebar {
        top:61px
    }
    .wiki-home-main {
        margin-top:61px;
        padding:0 20px
    }
    .wiki-hero {
        grid-template-columns:1fr;
        padding:52px 0 42px;
        gap:0
    }
    .wiki-hero h1 {
        font-size:3rem
    }
    .wiki-hero p {
        font-size:1.03rem
    }
    .hero-logo {
        display:none
    }
    .hero-actions {
        flex-wrap:wrap;
        margin-top:24px
    }
    .hero-actions a {
        font-size:.82rem
    }
    .eyebrow {
        font-size:.63rem
    }
    .wiki-note {
        padding:16px 18px;
        font-size:.85rem
    }
    .hub-section h2 {
        font-size:1.5rem
    }
    .topic-grid {
        grid-template-columns:1fr;
        gap:12px
    }
    .topic-card {
        padding:18px 20px
    }
    .topic-card h3 {
        font-size:1rem
    }
    .article-layout {
        margin-top:61px;
        padding:28px 20px 0
    }
    h1 {
        font-size:2.1rem
    }
    h2 {
        font-size:1.5rem
    }
    .article-intro {
        font-size:.97rem
    }
    .guide-card p,.guide-card li {
        font-size:.91rem
    }
    .warning-banner,.requirements-box,.error-card {
        padding:16px
    }
    .article-pagination {
        gap:10px
    }
    .article-pagination a {
        padding:12px
    }
    .article-pagination strong {
        font-size:.8rem
    }
    .wiki-footer {
        display:block
    }
    .wiki-footer div {
        margin-top:12px;
        flex-wrap:wrap;
        gap:16px
    }
    .search-hint {
        font-size:.62rem
    }
    .search-dialog-top {
        padding:14px
    }
    .search-dialog-top input {
        font-size:.85rem
    }
}
@media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    * {
        transition:none!important;
        animation:none!important
    }
}
@media print {
    .wiki-header,.wiki-sidebar,.wiki-toc,.mobile-toc,.article-pagination,.wiki-footer,.search-dialog,.heading-link {
        display:none!important
    }
    :root {
        --bg:#fff;
        --text:#000;
        --muted:#333;
        --panel:#fff;
        --border:#ccc;
        --accent:#222;
        --note:#eee
    }
    body {
        font-size:11pt
    }
    .article-layout,.wiki-home-main {
        display:block;
        margin:0;
        padding:0;
        max-width:none
    }
    .guide-card {
        break-inside:auto
    }
    .guide-card h2,.guide-card h3 {
        break-after:avoid
    }
    a {
        color:#000
    }
    .faq:not([open])>* {
        display:block
    }
}

/* Illustrated game library and article covers. */
.game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 18px; }
.topic-card.game-card { display: flex; flex-direction: column; overflow: hidden; padding: 0; border-radius: 10px; background: var(--bg); }
.game-card-art { aspect-ratio: 16 / 9; overflow: hidden; background: var(--panel); border-bottom: 1px solid var(--border); }
.game-card-art img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.game-card:hover .game-card-art img, .game-card:focus-visible .game-card-art img { transform: scale(1.035); }
.game-card-copy { display: flex; flex: 1; flex-direction: column; padding: 20px; }
.game-card-copy > span { margin-top: auto; padding-top: 8px; color: var(--muted); font-size: .73rem; }
.support-art { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--accent); background: radial-gradient(ellipse at center, var(--soft), var(--panel)); }
.support-art svg { width: 66px; height: 66px; }
.support-art span { font-size: .62rem; letter-spacing: .2em; font-weight: 600; }
.game-article-art { aspect-ratio: 2 / 1; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; margin: 28px 0 36px; background: var(--panel); }
.game-article-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
@media (max-width: 900px) { .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .game-grid { grid-template-columns: 1fr; } .game-article-art { aspect-ratio: 16 / 9; margin: 24px 0; } }
@media print { .game-article-art { display: none; } }
/* Individual guide topics use one reading column and the shared sidebar. */
.wiki-topic-page .article-layout { grid-template-columns:minmax(0,1fr); max-width:1120px; }
.wiki-topic-page .article-layout>main { width:100%; max-width:900px; }
.wiki-topic-page .guide-card { border-top:0; padding-top:0; margin-top:24px; }
.wiki-topic-page .topic-index-intro { color:var(--muted); margin:24px 0; }
.wiki-topic-page .topic-card { scroll-margin-top:100px; }
.wiki-topic-page .topic-grid { margin-bottom:48px; }
.wiki-topic-page .wiki-sidebar a[aria-current=page] { color:var(--accent); background:var(--soft); border-radius:6px; }

/* Keep guide artwork consistent with the homepage game cards. */
.guide-logo-art { position:relative; isolation:isolate; background:#101319; }
.guide-logo-art::before { content:""; position:absolute; inset:-12px; z-index:-1; background-position:center; background-size:cover; filter:blur(5px) brightness(.6); }
.guide-logo-art--gta5::before { background-image:url('/assets/images/games/gta5.webp'); }
.guide-logo-art--rdr2::before { background-image:url('/assets/images/games/rdr2.webp'); }
.guide-logo-art img { object-fit:contain; padding:8% 18%; filter:drop-shadow(0 3px 8px #0008); }
.guide-logo-art--rdr2 img { padding:12% 10%; }