/* #bonus v7.2 · 出席礼包 ×3 / 没来，就没有。 The page's peak: a value stack built from what you get, never from money.
   Owner D2-D4: gift 02 is the Quant Strategy 指标 (a tool, never signals); no nights on gifts; no prices, never the word for "value".
   Skim: eyebrow → H2 (没来，就没有。 is the biggest type on the section) → the pack (3 product shots, the proof object)
         → 4 ✓ rows (问题 → 礼包) → 全部免费 → 4 份全拿 vs 只有 1 份 → button.
   Colour: dark ground, one warm glow behind the pack, paper-lit gifts. Yellow = the button only. No green/red on the indicator.
   Every rule is scoped to #bonus. Hidden-before-motion states hang on html.ds-motion (no JS / reduced motion = final state). */

#bonus { overflow: clip; }
#bonus .bn { padding: 0; border: 0; border-radius: 0; background: none; color: inherit; box-shadow: none; transition: none; transform: none; }
#bonus .bn:hover { transform: none; box-shadow: none; }
#bonus .bx-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#bonus .bx-grid { position: relative; }

/* ---------- head: 没来，就没有。 is the loudest line ---------- */
#bonus .bx-h .l { display: block; }
#bonus .bx-h .num { font-size: 1.1em; margin-left: .06em; }
#bonus .bx-h .l + .l { margin-top: 2px; font-size: calc(var(--ds-fs-h2) * 1.6); line-height: 1.12; letter-spacing: -.01em; color: #fff; }
#bonus .bx-lead { margin-top: var(--ds-s2); color: var(--ds-text-d2); }

/* ---------- (1) the pack: 3 product shots fanned like a box set ---------- */
#bonus .bx-pack { position: relative; margin: var(--ds-s5) 0 0; }
#bonus .bx-pk-stage { position: relative; aspect-ratio: 7 / 5.7; container-type: inline-size; }
#bonus .bx-glow { position: absolute; left: -12%; right: -12%; top: -14%; bottom: -10%; pointer-events: none;
  background: radial-gradient(50% 50% at 50% 52%, rgba(255,212,59,.26), rgba(255,212,59,.08) 50%, rgba(255,212,59,0) 75%); }
#bonus .bx-floor { position: absolute; left: 8%; right: 8%; bottom: -3%; height: 12%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0,0,0,.6), rgba(0,0,0,0)); }

#bonus .bx-pk { position: absolute; display: flex; flex-direction: column; overflow: hidden; border-radius: var(--ds-r-s);
  background: var(--ds-ink-2); color: var(--ds-text-d);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 30px 50px -24px rgba(0,0,0,.85);
  font-size: 11px; font-size: clamp(9px, 3.1cqw, 13px); line-height: 1.4;
  transform-origin: 50% 100%; }
#bonus .bx-pk--ai  { left: 3%;  top: 13%; width: 31%; height: 76%; transform: rotate(-5deg); transform-origin: 50% 60%; }
#bonus .bx-pk--vid { right: 3%; top: 13%; width: 31%; height: 76%; transform: rotate(5deg); transform-origin: 50% 60%; }
#bonus .bx-pk--ind { left: 28%; top: 0; width: 44%; height: 97%; z-index: 2; background: #191c23;
  box-shadow: inset 0 0 0 1px rgba(244,241,234,.28), 0 0 0 1px rgba(255,212,59,.08), 0 34px 60px -22px rgba(0,0,0,.9), 0 0 60px -10px rgba(255,212,59,.22); }

#bonus .bx-pk--ai, #bonus .bx-pk--vid { font-size: 10px; font-size: clamp(9px, 2.75cqw, 13px); }
#bonus .bx-pk-bar { display: flex; align-items: center; gap: .5em; padding: .7em .8em; border-bottom: 1px solid var(--ds-line-d); white-space: nowrap; }
#bonus .bx-pk-bar b { overflow: hidden; text-overflow: ellipsis; font-weight: 700; }
#bonus .bx-pk--vid .bx-pk-bar { padding-left: 18%; }
#bonus .bx-pk-no { flex: none; padding: .1em .4em; border-radius: 4px; background: var(--ds-paper); color: var(--ds-ink);
  font: 800 .9em/1.2 var(--ds-num); font-stretch: 88%; letter-spacing: .02em; }
#bonus .bx-pk-av { flex: none; display: grid; place-items: center; width: 1.7em; height: 1.7em; border-radius: 50%; background: var(--ds-text-d); color: var(--ds-ink); font: 800 .75em/1 var(--ds-num); }

/* 02 · the indicator on your chart */
#bonus .bx-ind { display: block; width: 100%; height: auto; flex: 1; min-height: 0; padding: .6em .5em 0; }
#bonus .bx-ind .z { fill: rgba(244,241,234,.06); }
#bonus .bx-ind .g { fill: none; stroke: rgba(255,255,255,.06); stroke-width: .6; }
#bonus .bx-ind .wk { fill: none; stroke: var(--ds-mute-d); stroke-width: .8; }
#bonus .bx-ind .cu { fill: #191c23; stroke: var(--ds-text-d2); stroke-width: .8; }
#bonus .bx-ind .cd { fill: var(--ds-mute-d); }
#bonus .bx-ind .mk { fill: var(--ds-paper); }
#bonus .bx-ind .ex { fill: none; stroke: var(--ds-paper); stroke-width: 1.4; }
#bonus .bx-ind-s { margin: 0; padding: 0 .6em .8em; text-align: center; color: var(--ds-mute-d); font-size: .9em; }
#bonus .bx-leg { display: flex; flex-wrap: wrap; justify-content: center; gap: .2em .8em; margin: 0; padding: .5em .6em .3em; font-weight: 700; color: var(--ds-text-d2); white-space: nowrap; }
#bonus .bx-leg i { margin-right: .25em; font-style: normal; color: var(--ds-paper); }
#bonus .bx-leg i.o { display: inline-block; width: .7em; height: .7em; border-radius: 50%; box-shadow: inset 0 0 0 .16em var(--ds-paper); }

/* 03 · NyroBrain chat: you type, it writes code and tests on past prices */
#bonus .bx-pk-body { display: flex; flex-direction: column; gap: .5em; padding: .7em 18% .8em .7em; flex: 1; min-height: 0; overflow: hidden; }
#bonus .bx-bub { margin: 0; max-width: 92%; padding: .45em .65em; border-radius: .9em; }
#bonus .bx-bub--u { align-self: flex-end; border-bottom-right-radius: .25em; background: #2b3445; }
#bonus .bx-bub--a { align-self: flex-start; border-bottom-left-radius: .25em; background: var(--ds-ink-3); }
#bonus .bx-code { display: grid; gap: .45em; padding: .7em .6em; border-radius: .5em; background: var(--ds-ink); box-shadow: inset 0 0 0 1px var(--ds-line-d); }
#bonus .bx-code i { display: block; height: .42em; width: var(--w); margin-left: var(--x, 0); border-radius: 2px; background: rgba(201,205,212,.32); }
#bonus .bx-code i.bx-x { display: none; }
#bonus .bx-code i:first-child { background: rgba(244,241,234,.6); }
#bonus .bx-run { margin-top: auto; display: grid; gap: .35em; color: var(--ds-mute-d); font-size: .9em; }
#bonus .bx-run i { display: block; height: .3em; border-radius: 99px; background: linear-gradient(90deg, var(--ds-paper) 62%, rgba(255,255,255,.14) 62%); }

/* 04 · videos: thumbnail + lesson list */
#bonus .bx-thumb { position: relative; margin: .7em .7em 0 18%; aspect-ratio: 16 / 10; border-radius: .5em; overflow: hidden; background: var(--ds-ink-3); }
#bonus .bx-thumb svg { position: absolute; inset: 0; width: 100%; height: 100%; }
#bonus .bx-thumb polyline { fill: none; stroke: rgba(255,255,255,.16); stroke-width: 2; vector-effect: non-scaling-stroke; }
#bonus .bx-play { position: absolute; left: 50%; top: 46%; width: 2.6em; height: 2.6em; margin: -1.3em 0 0 -1.3em; border-radius: 50%; background: var(--ds-paper); }
#bonus .bx-play::after { content: ""; position: absolute; left: 40%; top: 30%; border-style: solid; border-width: .55em 0 .55em .9em; border-color: transparent transparent transparent var(--ds-ink); }
#bonus .bx-scrub { position: absolute; left: 8%; right: 8%; bottom: 9%; height: .25em; border-radius: 99px; background: rgba(255,255,255,.2); }
#bonus .bx-scrub i { position: absolute; left: 0; top: 0; bottom: 0; width: 38%; border-radius: 99px; background: var(--ds-paper); }
#bonus .bx-les { list-style: none; margin: 0; padding: .5em .5em .7em 22%; display: grid; gap: .15em; counter-reset: les; }
#bonus .bx-les li { counter-increment: les; display: flex; align-items: center; gap: .5em; padding: .3em 0; font-size: .92em; color: var(--ds-mute-d); white-space: nowrap; overflow: hidden; }
#bonus .bx-les li::before { content: "0" counter(les); flex: none; font: 800 .85em/1 var(--ds-num); font-stretch: 88%; color: var(--ds-mute-d); }
#bonus .bx-les li.on { color: var(--ds-text-d); font-weight: 700; }
#bonus .bx-les li.on::before { color: var(--ds-paper); }

#bonus .bx-pk-cap { display: flex; align-items: center; justify-content: space-between; gap: var(--ds-s2); margin-top: var(--ds-s4);
  font: 700 var(--ds-fs-small)/1.4 var(--ds-zh); color: var(--ds-text-d); }
#bonus .bx-pk-cap > span { display: inline-flex; align-items: center; gap: 6px; }
#bonus .bx-pk-cap .ds-ico { width: 15px; height: 15px; color: var(--ds-mute-d); }

/* motion: the pack starts closed (cards stacked in the middle) and fans open once, 400ms */
.ds-motion #bonus .bx-pk { transition: transform var(--ds-t3) var(--ds-ease), opacity var(--ds-t3) var(--ds-ease); }
.ds-motion #bonus .bx-pack:not(.is-in) .bx-pk--ai  { transform: translateX(38%) rotate(0) scale(.92); opacity: .4; }
.ds-motion #bonus .bx-pack:not(.is-in) .bx-pk--vid { transform: translateX(-38%) rotate(0) scale(.92); opacity: .4; }
.ds-motion #bonus .bx-pack:not(.is-in) .bx-pk--ind { transform: translateY(5%) scale(.96); }
.ds-motion #bonus .bx-pack.is-in .bx-pk--ind { transition-delay: 0s; }
.ds-motion #bonus .bx-pack.is-in .bx-pk--ai, .ds-motion #bonus .bx-pack.is-in .bx-pk--vid { transition-delay: .06s; }

/* ---------- (2) the stack: 问题 → 礼包 ✓ ---------- */
#bonus .bx-stack { margin-top: var(--ds-s6); }
#bonus .bx-list { position: relative; list-style: none; margin: 0; padding: 0; }
#bonus .bx-row { position: relative; }
#bonus .bx-row:not(:last-child)::after { content: ""; position: absolute; left: 13px; top: calc(var(--ds-s4) + 34px); bottom: -18px; width: 2px; background: rgba(244,241,234,.14); }
#bonus .bx-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; grid-template-areas: "ck q tag" "ck name name" "ck s s";
  column-gap: var(--ds-s4); padding: var(--ds-s4) 0; border-top: 1px solid var(--ds-line-d); }
#bonus .bx-ck { grid-area: ck; display: grid; place-items: center; width: 28px; height: 28px; margin-top: 2px; border-radius: 50%;
  background: var(--ds-paper); color: var(--ds-ink); box-shadow: 0 6px 18px -6px rgba(255,212,59,.45); }
#bonus .bx-ck svg { width: 15px; height: 15px; }
#bonus .bx-q { grid-area: q; align-self: center; margin: 0; font: 400 var(--ds-fs-small)/1.45 var(--ds-zh); color: var(--ds-mute-d); }
#bonus .bx-tag { grid-area: tag; align-self: center; display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 99px;
  font: 700 var(--ds-fs-tag)/1.2 var(--ds-zh); color: var(--ds-text-d); box-shadow: inset 0 0 0 1px var(--ds-line-d-strong); white-space: nowrap; }
#bonus .bx-tag .ds-ico { width: 12px; height: 12px; }
#bonus .bx-tag--now { color: var(--ds-mute-d); box-shadow: inset 0 0 0 1px var(--ds-line-d); }
#bonus .bx-name { grid-area: name; margin: 4px 0 0; font: 900 17px/1.35 var(--ds-zh); color: #fff; word-break: keep-all; overflow-wrap: anywhere; }
#bonus .bx-no { display: inline-block; margin-right: 8px; font: 800 13px/1 var(--ds-num); font-stretch: 88%; letter-spacing: .04em; color: var(--ds-mute-d); vertical-align: 1px; }
#bonus .bx-s { grid-area: s; margin: 2px 0 0; font: 400 var(--ds-fs-fine)/1.5 var(--ds-zh); color: var(--ds-text-d2); }

/* the total line, like the bottom of a receipt, without money */
#bonus .bx-total { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--ds-s4); row-gap: 2px; margin: 0; padding: var(--ds-s4) 0 0;
  border-top: 2px solid var(--ds-text-d); }
#bonus .bx-total b { font: 900 calc(var(--ds-fs-h3) * 1.45)/1.15 var(--ds-zh); color: #fff; }
#bonus .bx-total span { font: 700 var(--ds-fs-body)/1.4 var(--ds-zh); color: var(--ds-text-d2); }

/* ---------- (3) the loss punch: 4 份全拿 vs 只有 1 份 ---------- */
#bonus .bx-vs { margin-top: var(--ds-s6); }
#bonus .bx-vs-k { margin: 0 0 var(--ds-s2); font: 700 var(--ds-fs-fine)/1.4 var(--ds-zh); letter-spacing: .04em; color: var(--ds-mute-d); }
#bonus .bx-vs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ds-s2); }
#bonus .bx-vs-col { display: grid; align-content: start; gap: var(--ds-s2); padding: var(--ds-s4); border-radius: var(--ds-r); }
#bonus .is-yes { background: var(--ds-ink-2); box-shadow: inset 0 0 0 1px rgba(244,241,234,.34), 0 20px 50px -24px rgba(255,212,59,.35); }
#bonus .is-no { box-shadow: inset 0 0 0 1px var(--ds-line-d); }
#bonus .bx-vs-who { font: 900 var(--ds-fs-h3)/1.3 var(--ds-zh); color: var(--ds-text-d); white-space: nowrap; }
#bonus .is-no .bx-vs-who { color: var(--ds-mute-d); }
#bonus .bx-vs-tiles { display: flex; gap: 4px; }
#bonus .bx-vs-big { font: 700 var(--ds-fs-small)/1 var(--ds-zh); color: #fff; white-space: nowrap; }
#bonus .bx-vs-big .n { font: 800 56px/.9 var(--ds-num); font-stretch: 88%; letter-spacing: -.01em; vertical-align: -6px; margin-right: 2px; }
#bonus .is-no .bx-vs-big { color: var(--ds-mute-d); }
#bonus .is-no .bx-vs-big .n { margin: 0 2px; }

#bonus .bx-t { position: relative; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 7px; background: var(--ds-paper); color: var(--ds-ink); }
#bonus .bx-t svg { width: 16px; height: 16px; }
#bonus .is-no .bx-t { background: var(--ds-ink-3); color: var(--ds-text-d2); }
#bonus .bx-t.off { background: transparent; color: var(--ds-mute-d); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.2); }
#bonus .bx-t.off svg { position: absolute; }
#bonus .bx-t.off .g { opacity: 0; }
#bonus .bx-t.off .k { width: 14px; height: 14px; }
/* motion: the no-show side starts "full", then its 3 gifts lock away with a short thunk, once (sec-bonus.js adds .is-in) */
.ds-motion #bonus .bx-t.off { transition: background-color var(--ds-t2) var(--ds-ease), box-shadow var(--ds-t2) var(--ds-ease); }
.ds-motion #bonus .bx-t.off svg { transition: opacity var(--ds-t1) var(--ds-ease), transform var(--ds-t2) var(--ds-ease-thunk); }
.ds-motion #bonus .bx-vs:not(.is-in) .bx-t.off { background: var(--ds-ink-3); color: var(--ds-text-d2); box-shadow: none; }
.ds-motion #bonus .bx-vs:not(.is-in) .bx-t.off .g { opacity: 1; }
.ds-motion #bonus .bx-vs:not(.is-in) .bx-t.off .k { opacity: 0; transform: scale(1.8); }
.ds-motion #bonus .bx-vs.is-in .bx-t.off:nth-child(3), .ds-motion #bonus .bx-vs.is-in .bx-t.off:nth-child(3) svg { transition-delay: .08s; }
.ds-motion #bonus .bx-vs.is-in .bx-t.off:nth-child(4), .ds-motion #bonus .bx-vs.is-in .bx-t.off:nth-child(4) svg { transition-delay: .16s; }

/* ---------- claim path (报名 → 准时进 Zoom → 等 Anson 公布) + the button ---------- */
#bonus .bx-act { margin-top: var(--ds-s5); }
#bonus .bx-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ds-s2); counter-reset: st; }
#bonus .bx-steps li { position: relative; counter-increment: st; display: grid; align-content: start; gap: 2px; padding-top: 28px;
  font: 400 var(--ds-fs-fine)/1.4 var(--ds-zh); color: var(--ds-mute-d); }
#bonus .bx-steps li::before { content: counter(st); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%;
  box-shadow: inset 0 0 0 1.5px var(--ds-text-d); font: 800 11px/1 var(--ds-num); color: var(--ds-text-d); background: var(--ds-ink); z-index: 1; }
#bonus .bx-steps li:not(:last-child)::after { content: ""; position: absolute; left: 24px; right: -4px; top: 9px; height: 2px; background: rgba(255,255,255,.16); }
#bonus .bx-steps b { font: 700 var(--ds-fs-small)/1.4 var(--ds-zh); color: var(--ds-text-d); }
#bonus .bx-cta { margin-top: var(--ds-s5); }

/* phones: the pack bleeds to the screen edges (it is a picture, not text) */
@media (max-width: 639px) { #bonus .bx-pk-stage { margin: 0 calc(-1 * var(--ds-gutter)); } }

/* ---------- small phones ---------- */
@media (max-width: 370px) {
  #bonus .bx-vs-col { padding: 12px; }
  #bonus .bx-t { width: 26px; height: 26px; }
  #bonus .bx-vs-big .n { font-size: 50px; }
  #bonus .bx-row { column-gap: 12px; }
}

/* ---------- tablet ---------- */
@media (min-width: 640px) and (max-width: 959px) {
  #bonus .bx-pack { max-width: 560px; margin-left: auto; margin-right: auto; }
}

/* ---------- desktop: headline + the 4-vs-1 punch on one row; pack left, value stack right; path + button as one band ---------- */
@media (min-width: 960px) {
  #bonus .bx-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--ds-s8);
    grid-template-areas: "head vs" "pack stack" "act act"; align-items: start; }
  #bonus .bx-head { grid-area: head; align-self: end; }
  #bonus .bx-vs { grid-area: vs; align-self: end; margin: 0; }
  #bonus .bx-pack { grid-area: pack; align-self: center; margin-top: var(--ds-s8); }
  #bonus .bx-stack { grid-area: stack; margin-top: var(--ds-s8); }
  #bonus .bx-act { grid-area: act; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--ds-s8); align-items: center;
    margin-top: var(--ds-s8); padding-top: var(--ds-s6); border-top: 1px solid var(--ds-line-d); }
  #bonus .bx-steps { max-width: 560px; }
  #bonus .bx-cta { margin: 0; }
  #bonus .bx-cta .btn { width: 100%; min-width: 0; }

  #bonus .bx-h .l + .l { font-size: calc(var(--ds-fs-h2) * 1.55); }
  #bonus .bx-pk-stage { aspect-ratio: 7 / 4.6; }
  #bonus .bx-pk--ai, #bonus .bx-pk--vid { width: 33%; height: 74%; top: 13%; }
  #bonus .bx-pk--ai { left: 1%; } #bonus .bx-pk--vid { right: 1%; }
  #bonus .bx-pk--ind { left: 30.5%; width: 39%; height: 97%; }
  #bonus .bx-code i.bx-x { display: block; }
  #bonus .bx-pk { font-size: clamp(9px, 2.5cqw, 14px); }
  #bonus .bx-pk-cap { justify-content: center; gap: var(--ds-s4); }
  #bonus .bx-row { padding: var(--ds-s5) 0; }
  #bonus .bx-row:not(:last-child)::after { top: calc(var(--ds-s5) + 34px); bottom: -26px; }
  #bonus .bx-name { font-size: 19px; }

  #bonus .bx-vs-grid { gap: var(--ds-s4); }
  #bonus .bx-vs-col { padding: var(--ds-s5); }
  #bonus .bx-t { width: 36px; height: 36px; border-radius: var(--ds-r-s); }
  #bonus .bx-t svg { width: 18px; height: 18px; }
  #bonus .bx-t.off .k { width: 16px; height: 16px; }
  #bonus .bx-vs-tiles { gap: 6px; }
  #bonus .bx-vs-big { font-size: var(--ds-fs-body); }
  #bonus .bx-vs-big .n { font-size: 72px; vertical-align: -8px; }
}

/* phones end the section on 40 instead of 64; desktop keeps --ds-sec-y */
@media (max-width: 959px) { #bonus.ds-sec { padding-bottom: var(--ds-s6); } }

/* ---------- v9 mobile polish (12 Nov 2026): phones only, desktop rules above untouched ---------- */
@media (max-width: 639px) {
  /* the pack: the glow still bleeds edge to edge, but the 3 cards now sit inside the gutters
     (the side cards used to graze the screen edge) and the front card is bigger, so its text is 13px+ */
  #bonus .bx-pk--ai  { left: 4.5%; width: 31%; }
  #bonus .bx-pk--vid { right: 4.5%; width: 31%; }
  #bonus .bx-pk--ind { left: 27%; width: 46%; font-size: clamp(13px, 3.35cqw, 14px); }
  #bonus .bx-pk--ind .bx-pk-bar { padding: .7em .65em; gap: .4em; }
  #bonus .bx-pk--ai .bx-pk-bar { padding-left: .6em; padding-right: .6em; gap: .4em; }
  #bonus .bx-pk--vid .bx-pk-bar { gap: .4em; padding-left: 28%; }
  #bonus .bx-pk-body { padding-right: 26%; padding-left: .6em; }
  #bonus .bx-thumb { margin-left: 28%; }
  #bonus .bx-les { padding-left: 30%; }
  #bonus .bx-pk--ind .bx-ind-s, #bonus .bx-pk--ind .bx-pk-no { font-size: 1em; }
  #bonus .bx-run span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  /* caption → list: one 40px step instead of 56 */
  #bonus .bx-stack { margin-top: var(--ds-s5); }
  /* nothing under 13px on a phone */
  #bonus .bx-pk-cap .ds-tag, #bonus .bx-tag { font-size: var(--ds-fs-fine); }
  #bonus .bx-steps li { padding-top: 30px; }
  #bonus .bx-steps li::before { width: 22px; height: 22px; font-size: var(--ds-fs-fine); }
  #bonus .bx-steps li:not(:last-child)::after { left: 26px; top: 10px; }
}
@media (max-width: 370px) {
  #bonus .bx-pk--ai  { left: 5.5%; }
  #bonus .bx-pk--vid { right: 5.5%; }
  #bonus .bx-pk--ind { left: 25.5%; width: 49%; }
  #bonus .bx-pk-body { padding-right: 33%; }
  #bonus .bx-pk--vid .bx-pk-bar { padding-left: 34%; }
  #bonus .bx-thumb { margin-left: 34%; }
  #bonus .bx-les { padding-left: 36%; }
}