:root{ --oi-polls-shell:1166px; --oi-polls-bg:#fafafa; --oi-polls-surface:#ffffff; --oi-polls-line:#D1D1D1; --oi-polls-line-soft:#eeeeeb; --oi-polls-ink:#000000; --oi-polls-ink-2:#000000; --oi-polls-ink-3:#767c84; --oi-polls-ink-4:#887C7C; --oi-polls-ink-5:#171717; --oi-polls-ink-6:#4E4E4E; --oi-polls-accent:#00443f; --oi-polls-accent-ink:#fff; --oi-polls-link:#2563EB; --oi-polls-bar:#EBEBEB; --oi-polls-dot:#9C9C9C; --oi-polls-rose:#FFF9F9; --oi-polls-rose-line:#FFD7D7; --oi-polls-rose-line-hi:#e9cccc; --oi-polls-footer-bg:#eef3f3; --oi-polls-footer-ink:#98a0a0; --oi-polls-legal-bg:#101113; --oi-polls-legal-ink:#b7bbbb; --oi-polls-radius-card:14px; --oi-polls-radius-opt:8px; --oi-polls-font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; --oi-polls-font-display:"Archivo","Arial Black","Helvetica Neue",Arial,sans-serif; } *,*::before,*::after{box-sizing:border-box} *{margin: 0;padding: 0;} html{-webkit-text-size-adjust:100%} body{margin:0;background:var(--oi-polls-bg);color:var(--oi-polls-ink); font:400 15px/1.5 var(--oi-polls-font-body);-webkit-font-smoothing:antialiased} img,svg{display:block} [hidden]{display:none!important} button{font-family:inherit} a {text-decoration: none;outline: none;} ul, ol {list-style-type: none;} /* ========================================================================== Oneindia Polls — Desktop header Prefix: oi-polls- Depends on the :root token block inlined in the page . ========================================================================== */ .oi-polls-header { position: fixed; top: 0; left: 0; right: 0; z-index: 60; background: var(--oi-polls-surface); border-bottom: 1px solid var(--oi-polls-line); } /* .oi-polls-header is position:fixed (removed from normal flow), so the #headerMain wrapper that contains it would otherwise collapse to 0 height, letting page content slide up underneath the fixed header. Reserve the header's exact rendered height (68px inner + 1px border) here so content starts right below it instead of being hidden behind it. */ #headerMain { height: 69px; } .oi-polls-header__inner { max-width: var(--oi-polls-shell); margin: 0 auto; padding: 0 24px; height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 24px; } /* --- Brand ---------------------------------------------------------------- */ .oi-polls-brand { display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; } .oi-polls-brand__mark { width: 150px; height: 42px; object-fit: contain; object-position: left center; } .oi-polls-brand__divider { width: 1px; height: 26px; background: var(--oi-polls-line); } .oi-polls-brand__section { font-size: 19px; font-weight: 400; letter-spacing: -0.01em; color: var(--oi-polls-ink-2); } /* --- Language selector --------------------------------------------------- */ .oi-polls-lang { position: relative; } .oi-polls-lang__toggle { display: flex; align-items: center; gap: 12px; height: 42px; padding: 0 14px 0 0; background: var(--oi-polls-surface); border: 1px solid var(--oi-polls-line); border-radius: 999px; font: inherit; color: var(--oi-polls-ink); cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease; } .oi-polls-lang__toggle:hover { border-color: var(--oi-polls-ink-4); } .oi-polls-lang__toggle:focus-visible { outline: 2px solid var(--oi-polls-accent); outline-offset: 2px; } .oi-polls-lang__tag { display: grid; place-items: center; align-self: stretch; padding: 0 12px; border-right: 1px solid var(--oi-polls-line); font-size: 10px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--oi-polls-ink-3); } .oi-polls-lang__current { font-size: 15px; line-height: 1; } .oi-polls-lang__chev { width: 16px; height: 16px; margin-left: 2px; color: var(--oi-polls-ink-3); transition: transform .18s ease; } .oi-polls-lang__toggle[aria-expanded="true"] .oi-polls-lang__chev { transform: rotate(180deg); } .oi-polls-lang__menu { position: absolute; top: calc(100% + 8px); right: 0; min-width: 210px; padding: 6px; margin: 0; list-style: none; background: var(--oi-polls-surface); border: 1px solid var(--oi-polls-line); border-radius: 12px; box-shadow: 0 16px 40px -12px rgb(16 20 24 / 22%); } .oi-polls-lang__menu[hidden] { display: none; } .oi-polls-lang__link { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; border-radius: 8px; font-size: 15px; color: var(--oi-polls-ink-2); text-decoration: none; } .oi-polls-lang__link:hover { background: var(--oi-polls-bg); color: var(--oi-polls-ink); } .oi-polls-lang__link[aria-current="true"] { color: var(--oi-polls-accent); font-weight: 500; } .oi-polls-lang__link[aria-current="true"]::after { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--oi-polls-accent); }