/* =============================================================
     APRB Custom Styles - Migrated from inline styles
     CSP unsafe-inline remediation - SAFE scoped styles only
     ============================================================= */

  /* ---- Utility classes (from style="" attributes) ---- */
  .aprb-bg-white         { background-color: white; }
  .aprb-bg-white2        { background-color: #fff; }
  .aprb-bg-gradient      { background-image: linear-gradient(90deg, #f5f5f5, #348017); }
  .aprb-border-double    { border-style: double; border-color: #348017; }
  .aprb-border-0         { border: 0; }
  .aprb-border-right-white { border-right: 10px solid white; margin-top: 22px; }
  .aprb-img-thumb        { width: 50px; height: 25px; }
  .aprb-img-card-md      { border-radius: 5%; width: 350px; }
  .aprb-img-lg           { height: 200px; width: 500px; }
  .aprb-img-square       { height: 250px; width: 250px; border-radius: 5%; }
  .aprb-img-square-white { height: 250px; width: 250px; border-radius: 5%; background-color: white; }
  .aprb-img-300          { height: 300px; border-radius: 5%; }
  .aprb-img-300-white    { height: 300px; border-radius: 5%; background-color: white; }
  .aprb-card-shadow      { border-radius: 15px; box-shadow: 5px 5px #348017; height: 100%; width: 100%; }
  .aprb-align-center     { align-content: center; }
  .aprb-text-center      { text-align: center; }
  .aprb-text-left        { text-align: left; }
  .aprb-text-left-bold-green { text-align: left; font-weight: bold; color: #25a244; }
  .aprb-text-left-16     { text-align: left; font-weight: normal; font-size: 16px; }
  .aprb-text-left-20     { text-align: left; font-weight: normal; font-size: 20px; }
  .aprb-uppercase        { text-transform: uppercase; }
  .aprb-bold-black       { font-weight: bold; color: black; }
  .aprb-text-white       { color: #fff; }
  .aprb-color-white      { color: white; }
  .aprb-text-green       { color: #25a244; }
  .aprb-text-dark        { color: #2c3e50; }
  .aprb-text-orange      { color: #FFA500; }
  .aprb-text-red         { color: red; }
  .aprb-text-highlight   { color: #e3ff59; text-decoration: underline; font-weight: 400; }
  .aprb-text-15          { font-size: 15px; }
  .aprb-text-19          { font-size: 19px; }
  .aprb-text-20          { font-size: 20px; }
  .aprb-text-bold-16     { font-size: 16px; font-weight: bold; }
  .aprb-text-16-600      { font-size: 16px; font-weight: 600; }
  .aprb-text-18-underline { font-size: 18px; text-decoration: underline; }
  .aprb-text-600-black   { font-weight: 600; color: #000; }
  .aprb-section-header   { font-size: 20px; color: #505050; font-weight: bold; text-transform: uppercase; }
  .aprb-netbanking-label { font-size: 20px; padding: 22px; font-weight: bold; }
  .aprb-btn-green        { font-size: 20px; font-weight: bold; color: #fff; background-color: #25a244; padding: 12px; border-radius: 12px; }
  .aprb-box-green        { color: #fff; margin: 30px; background-color: #25a244; }
  .aprb-tab-active-green { color: white; background-color: #25a244; margin-bottom: -6px; }
  .aprb-h-95             { height: 95px; }
  .aprb-w-full           { width: 100%; }
  .aprb-w-h-full         { width: 100%; height: 100%; }
  .aprb-iframe-full      { width: 100%; height: 800px; }
  .aprb-w-42vw           { width: 42vw; }
  .aprb-w-50vw           { width: 50vw; }
  .aprb-w-80             { width: 80%; }
  .aprb-mt-0             { margin-top: 0; }
  .aprb-mt-22            { margin-top: 22px; }
  .aprb-mt-30            { margin-top: 30px; }
  .aprb-mb-20            { margin-bottom: 20px !important; }
  .aprb-m-5              { margin: 5px; }
  .aprb-pb-12            { padding-bottom: 12px; }
  .aprb-overflow-x-hidden { overflow-x: hidden; }

  /* ---- header.php ---- */
  .custm-pos { width: 100%; }

  /* ---- footer.php ---- */
  .float {
      position: fixed;
      height: 8vh;
      background-color: #25a244;
      bottom: 150px;
      right: -21.5px;
      padding: 10px;
      color: #fff;
      border-radius: 135px 0px 0px 135px;
      text-align: center;
      z-index: 100;
      transition: all 0.2s ease-in-out;
  }
  .float:hover { color: white; background-color: #2ac751; }
  .my-float { margin-top: 16px; }
  .skyline-footer {
      background-image: url("assets/img/logo/footer-skyline.png");
      height: 10vh;
      background-position: contain;
  }

  /* ---- index.php ---- */
  .section-services { padding-top: 0px; padding-bottom: 20px; font-family: "Poppins", sans-serif; color: #25a244; }
  .section-services .header-section { margin-bottom: 35px; }
  .section-services .header-section .title { position: relative; margin-bottom: 40px; padding-bottom: 25px; text-transform: uppercase; }
  .section-services .header-section .title:before { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 140px; height: 1px; background-color: #25a244; }
  .section-services .header-section .title:after { content: ""; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); width: 45px; height: 3px; background-color: #25a244; }
  .section-services .header-section .title span { color: black; }
  .section-services .header-section .description { color: #25a244; }
  .section-services .single-service { margin-top: 8px; height: 415px; }
  .section-services .single-service .part-1 { padding: 40px 40px 25px; border-bottom: 2px solid #25a244; }
  .section-services .single-service .part-1 i { margin-bottom: 25px; font-size: 50px; color: #25a244; }
  .section-services .single-service .part-1 .title { font-size: 17px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.8em; }
  .section-services .single-service .part-2 { padding: 30px 40px 40px; }
  .section-services .single-service .part-2 .description { margin-bottom: 22px; color: black; font-size: 14px; line-height: 1.8em; }
  .section-services .single-service .part-2 a { color: #25a244; font-size: 14px; text-decoration: none; }
  .section-services .single-service .part-2 a i { margin-right: 10px; color: #25a244; }
  .col-main-headmain { flex: 4; }
  .col-complementary-headmain { flex: 1; }
  @media only screen and (min-width: 640px) { .layout-headmain { display: flex; } }
  .nav-container-side-bann { transition: all 0.5s linear; }
  .nav-side-bann { list-style-type: none; margin: 0; padding: 0; }
  .nav-side-bann li { height: 55.20px; position: relative; }
  .nav-side-bann a { border-top: 1px solid rgb(129 129 129); border-bottom: 1px solid #8b8b8b; text-decoration: none; display: block; height: 90%; width: 98%; line-height: 50px; color: #323232; text-transform: uppercase; font-weight: bold; margin-top: 1px; text-align: center; margin-left: 4px; border-left: 5px solid #25a244; border-right: 5px solid #25a244; letter-spacing: 1px; transition: all 0.1s ease-out; }
  .nav-side-bann .text-side-bann { transition: all 0.1s ease-out; }
  .nav-side-bann li:hover .text { margin-left: 20px; }
  .nav-side-bann .active a { color: #fff; border-left: 5px solid #25a244; border-right: 5px solid #25a244; background-color: #2dc653; outline: 0; }
  .nav-side-bann li:not(.active):hover a { color: #eee; border-left: 5px solid #25a244; border-right: 5px solid #25a244; background-color: #2dc653; }
  .nav-side-bann span[class ^="icon"] { position: absolute; left: 20px; font-size: 1.5em; transition: all 0.3s linear; }
  @media only screen and (max-width: 768px) { .nav-container-side-bann { display: none; } .col-complementary-headmain { display: none; } }
  @media only screen and (max-width: 480px) { .nav-container-side-bann, .nav-side-bann a { width: 50px; } }
  .col-main-intro { flex: 2; text-align: left; font-size: 16px; }
  .col-complementary-intro { flex: 1; display: flex; align-items: center; }
  .layout-intro { display: flex; }
  .container-intro { max-width: 80em; margin-right: auto; margin-left: auto; }
  .col-intro { padding: 1em; margin: 0 2px 2px 0; }
  .bgmainser { background-image: url("assets/img/logo/servicebg.png"); height: auto; width: auto; background-size: contain; }
  .responsiveimg { width: 100%; height: auto; }
  .modal-full { min-width: 100% !important; }
  .modal-full .modal-content { min-height: 900px; }
  .modal { padding: 0px !important; }
  .modal-mid { min-width: 590px !important; }
  .flashnews { height: 100%; align-items: center; display: flex; flex-direction: column; margin: auto; }
  .marquee-list { padding-left: 0; list-style-type: none; }
  .marquee-list li { display: block; padding: 10px 0; opacity: 0; transition: opacity 1s ease-in-out; }
  .flashnews li { list-style: disc; }
  .flashnews .notice { text-align: center; font-weight: 600; color: #25a244; padding: 10px; margin-bottom: 20px; }
  @media (max-width: 900px) { .layout-intro { display: flex; flex-direction: column; margin: 0 20px; } .col-main-intro .read-more { text-align: center; } .responsiveimg { text-align: center; width: 50%; height: auto; } .col-complementary-intro { display: flex; justify-content: center; } }
  .carousel-inner { width: 80vw !important; height: 320px !important; overflow: hidden; }
  .carousel-item { width: 100%; height: 100%; }
  .carousel-item img { width: 100%; height: 100%; display: block; }
  .aprb-popup-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); display: none; align-items: center; justify-content: center; z-index: 10000; padding: 1rem; }
  .aprb-popup-overlay.active { display: flex; }
  .aprb-popup-box { background: #2dc553; color: white; width: 100%; max-width: 800px; border-radius: 8px; padding: 2rem; position: relative; box-shadow: 0 4px 20px rgba(0,0,0,0.3); max-height: 90vh; overflow-y: auto; }
  .aprb-popup-box.image-only { padding: 0; background: transparent; box-shadow: none; width: auto; height: auto; }
  .aprb-popup-box.image-only img { width: 496px; height: 620px; display: block; }
  .aprb-popup-box h2 { font-size: 1.4rem; color: #f0ff6d; margin-bottom: 1rem; }
  .aprb-popup-box p { font-size: 1rem; margin-bottom: 1rem; line-height: 1.6; }
  .aprb-popup-box a { color: #222; font-weight: 600; text-decoration: underline; word-break: break-word; }
  .aprb-highlight { font-weight: bold; color: #222; }
  .aprb-new-domain { color: #00ff7f; font-weight: bold; }
  .aprb-close-btn { position: absolute; top: 10px; right: 15px; background: rgba(255,255,255,0.11); border-radius: 10px; box-shadow: 0 4px 30px rgba(0,0,0,0.1); backdrop-filter: blur(2.3px); border: 1px solid #222; color: #222; font-size: 20px; cursor: pointer; width: 32px; height: 32px; line-height: 30px; text-align: center; }
  .aprb-content-box { padding: 1rem; background: #fff; color: #222; border-radius: 10px; }
  .content-link-block-box { border-radius: 50%; padding: 15px; border: 2px solid rgba(0,0,0,0.2); }
  @media (max-width: 992px) { .aprb-popup-box { padding: 1.5rem; } }
  @media (max-width: 600px) { .aprb-popup-box { padding: 1rem; } .aprb-popup-box h2 { font-size: 1.1rem; } .aprb-popup-box p { font-size: 0.9rem; } }

  /* ---- about.php ---- */
  .col-main-intro-about { flex: 3; text-align: left; font-size: 18px; }
  .col-complementary-intro-about { flex: 2; }
  @media only screen and (min-width: 640px) { .layout-intro { display: flex; } }

  /* ---- ckyc-faq.php ---- */
  .ckyc-section { padding: 40px 0 60px 0; }
  .ckyc-img-col { display: flex; align-items: flex-start; justify-content: center; }
  .ckyc-img-col img { width: 100%; height: auto; border-radius: 10px; box-shadow: 0px 4px 15px rgba(0,0,0,0.12); }
  .ckyc-faq-col .section-title h3 { font-size: 22px; font-weight: 700; color: #222; }
  .ckyc-faq-col .section-title h3 span { color: #28a745; }
  .faq-list { list-style: none; padding: 0; margin: 0; }
  .faq-list li { margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid #e8e8e8; }
  .faq-list li:last-child { border-bottom: none; }
  .faq-list li h6 { font-weight: 700; font-size: 14px; color: #1a1a2e; margin-bottom: 6px; }
  .faq-list li p, .faq-list li ul { font-size: 13.5px; color: #555; margin-bottom: 4px; line-height: 1.7; }
  .faq-list li ul { padding-left: 18px; }
  .faq-list li a { color: #28a745; text-decoration: underline; }
  .ckyc-img-sticky { position: sticky; top: 100px; }
  @media (max-width: 767px) { .ckyc-img-sticky { position: static; margin-bottom: 25px; } }

  /* ---- index.php VISUAL ENHANCEMENTS ---- */

  /* Carousel – taller, rounded, shadow */
  .carousel-inner {
    width: 80vw !important;
    height: 420px !important;
    border-radius: 14px;
    box-shadow: 0 10px 40px rgba(37,162,68,0.18), 0 2px 10px rgba(0,0,0,0.10);
    overflow: hidden;
  }
  .carousel-item img { object-fit: cover; }
  .carousel-control-prev, .carousel-control-next {
    width: 5%;
    opacity: 0.7;
    transition: opacity 0.2s;
  }
  .carousel-control-prev:hover, .carousel-control-next:hover { opacity: 1; }
  .carousel-indicators [data-bs-target] {
    width: 10px; height: 10px;
    border-radius: 50%;
    background-color: #25a244;
    opacity: 0.45;
    border: none;
    margin: 0 4px;
  }
  .carousel-indicators .active { opacity: 1; }

  /* Quick-link cards */
  .aprb-quicklink-card {
    border-radius: 16px;
    padding: 22px 16px 18px;
    min-height: 140px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-shadow: 0 4px 18px rgba(0,0,0,0.13);
    cursor: default;
    border: none;
    border-bottom: 4px solid rgba(0,0,0,0.15);
  }
  .aprb-quicklink-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 16px 36px rgba(0,0,0,0.18);
  }
  .aprb-quicklink-card .qlc-icon {
    font-size: 2.1rem;
    color: rgba(255,255,255,0.92);
    margin-bottom: 10px;
  }
  .aprb-quicklink-card h6 {
    font-size: 0.82rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 8px;
    text-align: center;
  }
  .aprb-quicklink-card .qlc-links {
    font-size: 0.8rem;
    text-align: center;
    line-height: 1.6;
  }
  .aprb-quicklink-card .qlc-links a {
    color: rgba(255,255,255,0.95);
    font-weight: 600;
    text-decoration: underline;
  }
  .aprb-quicklink-card .qlc-links a:hover { color: #fff; }
  @media (max-width: 768px) { .aprb-quicklink-card { min-height: 120px; margin-bottom: 16px; } }

  /* Stats bar */
  .aprb-stats-bar {
    background: linear-gradient(135deg, #166b2b 0%, #25a244 55%, #2dc653 100%);
    border-radius: 18px;
    padding: 40px 10px;
    margin: 10px 30px;
    box-shadow: 0 10px 40px rgba(37,162,68,0.28);
  }
  .aprb-stat-item {
    padding: 12px 8px;
    border-right: 2px solid rgba(255,255,255,0.22);
    text-align: center;
  }
  .aprb-stat-item:last-child { border-right: none; }
  .aprb-stat-item i {
    font-size: 2.4rem;
    color: rgba(255,255,255,0.80);
    display: block;
    margin-bottom: 14px;
  }
  .aprb-stat-item h2 {
    font-size: 2.1rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 0;
    letter-spacing: 1px;
    text-shadow: 0 2px 6px rgba(0,0,0,0.15);
  }
  @media (max-width: 576px) {
    .aprb-stat-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 20px; margin-bottom: 10px; }
    .aprb-stats-bar { margin: 10px 10px; }
  }

  /* Services cards – lift + top accent on hover */
  .section-services .single-service {
    border-radius: 12px;
    box-shadow: 0 3px 18px rgba(0,0,0,0.07);
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-top-color 0.25s;
    background: #fff;
    border-top: 4px solid #d4ead9;
  }
  .section-services .single-service:hover {
    transform: translateY(-9px);
    box-shadow: 0 18px 45px rgba(37,162,68,0.16);
    border-top-color: #25a244;
  }
  .section-services .single-service .part-1 {
    background: linear-gradient(160deg, #f6fff7 0%, #e9f8ed 100%);
  }

  /* Introduction heading accent */
  .aprb-intro-heading {
    position: relative;
    display: inline-block;
    padding-bottom: 12px;
    margin-bottom: 8px !important;
  }
  .aprb-intro-heading::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 55px; height: 3px;
    background: #25a244;
    border-radius: 2px;
  }

  /* Notice board */
  .flashnews {
    background: #fff;
    border: 2px solid #25a244;
    border-radius: 13px;
    overflow: hidden;
    box-shadow: 0 4px 18px rgba(37,162,68,0.12);
    min-width: 200px;
    max-width: 400px;
  }
  .flashnews .notice {
    background: linear-gradient(90deg,#25a244,#2dc653);
    color: #fff;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 10px 14px;
    margin: 0;
    border-bottom: none;
  }
  .flashnews .marquee-container { padding: 8px 10px; }
  .flashnews li a {
    color: #1b6e30;
    font-size: 12.5px;
    text-decoration: none;
    transition: color 0.2s;
  }
  .flashnews li a:hover { color: #25a244; text-decoration: underline; }
  .flashnews .badge { font-size: 0.6rem; margin-left: 4px; vertical-align: middle; }

  /* Section wrapper spacing */
  .content-link-block { padding: 0 10px; }

  /* ---- header.php ENHANCEMENTS ---- */

  /* Top bar — gradient strip */
  #topbar {
    background: linear-gradient(90deg, #166b2b 0%, #25a244 55%, #2dc653 100%) !important;
    height: auto !important;
    min-height: 36px;
    border-bottom: 1px solid rgba(0,0,0,0.10);
  }
  #topbar .social-links a {
    font-size: 13px;
    color: rgba(255,255,255,0.75);
    transition: color 0.2s;
  }
  #topbar .social-links a:hover { color: #fff; }
  .aprb-topbar-emp-btn {
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 20px;
    padding: 3px 12px !important;
    font-size: 12px;
    transition: background 0.2s;
  }
  .aprb-topbar-emp-btn:hover { background: rgba(255,255,255,0.28) !important; }

  /* Main header — green bottom accent, stronger shadow */
  #header {
    box-shadow: 0 3px 22px rgba(37,162,68,0.13), 0 1px 5px rgba(0,0,0,0.07) !important;
    border-bottom: 3px solid #25a244;
  }

  /* Nav hover/active — green instead of blue-purple */
  .navbar a:hover,
  .navbar .active,
  .navbar li:hover>a { color: #25a244 !important; }

  .navbar .dropdown ul a:hover,
  .navbar .dropdown ul .active:hover,
  .navbar .dropdown ul li:hover>a {
    color: #25a244 !important;
    background-color: #f2fbf4;
    padding-left: 24px;
  }

  /* Dropdown — left accent line on hover item */
  .navbar .dropdown ul {
    border-top: 3px solid #25a244;
    border-radius: 0 0 8px 8px;
  }

  /* ---- footer.php ENHANCEMENTS ---- */

  /* Footer body — richer gradient */
  #footer {
    background: linear-gradient(160deg, #0f4a1e 0%, #1a7030 45%, #25a244 100%) !important;
  }

  /* Footer-top padding & bottom separator */
  #footer .footer-top {
    padding: 50px 0 35px !important;
    border-bottom: 1px solid rgba(255,255,255,0.14);
  }

  /* Column headings */
  #footer .footer-top h3 {
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding-bottom: 10px;
    margin-bottom: 16px !important;
    border-bottom: 2px solid rgba(255,255,255,0.22);
    display: inline-block;
    width: 100%;
  }

  /* About column text */
  #footer .footer-top .footer-contact p,
  #footer .footer-top .social-links + p {
    color: rgba(255,255,255,0.78) !important;
    font-size: 13.5px !important;
    line-height: 1.75 !important;
  }

  /* Footer links */
  #footer .footer-top .footer-links ul li {
    padding: 6px 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
  }
  #footer .footer-top .footer-links ul li:last-child { border-bottom: none; }
  #footer .footer-top .footer-links ul a {
    color: rgba(255,255,255,0.82) !important;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 7px;
    transition: color 0.2s, padding-left 0.2s;
  }
  #footer .footer-top .footer-links ul a:hover {
    color: #fff !important;
    padding-left: 5px;
  }
  #footer .footer-top .footer-links ul a i {
    color: #2dc653;
    font-size: 11px;
    flex-shrink: 0;
  }

  /* Social icons — circle */
  #footer .footer-top .social-links a {
    border-radius: 50% !important;
    background: rgba(255,255,255,0.12) !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.28);
    transition: background 0.25s, color 0.25s, transform 0.2s;
    width: 38px !important;
    height: 38px !important;
    font-size: 16px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
  }
  #footer .footer-top .social-links a:hover {
    background: #fff !important;
    color: #25a244 !important;
    transform: translateY(-3px);
  }

  /* Copyright bar */
  #footer .copyright {
    padding: 14px 0;
    border-top: 1px solid rgba(255,255,255,0.13);
    font-size: 13px !important;
    color: rgba(255,255,255,0.72) !important;
  }
  #footer .copyright strong { color: #fff; }

  /* NetBanking float button polish */
  .float {
    background: linear-gradient(135deg, #0f4a1e 0%, #25a244 100%) !important;
    border-radius: 100px 0 0 100px !important;
    box-shadow: -4px 4px 18px rgba(37,162,68,0.45) !important;
    display: flex !important;
    align-items: center;
    padding: 8px 14px 8px 18px !important;
    transition: all 0.25s ease !important;
  }
  .float:hover {
    background: linear-gradient(135deg, #166b2b 0%, #2dc653 100%) !important;
    box-shadow: -6px 6px 24px rgba(37,162,68,0.55) !important;
    right: 0 !important;
  }
  .aprb-netbanking-label {
    font-size: 14px !important;
    padding: 0 !important;
    font-weight: 700;
    letter-spacing: 0.3px;
  }

  /* Skyline footer image — tighter */
  .skyline-footer {
    height: 8vh;
    background-size: cover;
    background-position: bottom;
  }

  /* ---- AuditBalS-0.php ---- */
  .table-responsive-40 { width: 40% !important; }

  /* ---- Advertisements / newBadge ---- */
  .newBadge { font-size: x-small; }

  /* ---- FLW.php (image slider) ---- */
  #image-container { width: 80%; margin: 0 auto; overflow: hidden; position: relative; }
  #image-slider { display: flex; transition: transform 0.5s ease; }
  .image { width: 100%; overflow: hidden; cursor: pointer; display: none; }
  .image.active { display: block; }
  .image img { width: 100%; transition: transform 0.5s ease; }
  .scroll-button { position: absolute; top: 50%; transform: translateY(-50%); background-color: rgba(0,0,0,0.5); color: #fff; padding: 8px; border: none; cursor: pointer; }
  #prev-button { left: 0; }
  #next-button { right: 0; }