/* Extracted page CSS from rebreather-training.html | v7.1.5 | 2026-04-28 */

:root {
        --bg-top: #e1e4e8;
        --bg-mid: #e5e8ec;
        --bg-bottom: #ebedef;
        --paper: #ffffff;
        --ink: #17212b;
        --muted: #566473;
        --line: #aebbc6;
        --accent: #5a646e;
        --accent-dark: #3f4952;
        --accent-soft: #f4f6f8;
        --action: #3e5567;
        --action-dark: #2d4354;
        --action-soft: #f5f6f7;
        --shadow: 0 8px 24px rgba(0,0,0,.08);
      }

      * { box-sizing: border-box; }
      html { scroll-behavior: smooth; }

      body {
        font-family: Arial, Helvetica, sans-serif;
        line-height: 1.7;
        color: #121a22;
        margin: 0;
        background: linear-gradient(180deg, var(--bg-top) 0%, var(--bg-mid) 100%);
      }

      main {
        padding: 24px 16px 40px;
      }

      .container {
        width: 1000px;
        max-width: 96%;
        margin: 0 auto 48px;
        padding: 0;
        background: var(--paper);
        border: 1px solid #aebbc6;
        border-radius: 18px;
        box-shadow: var(--shadow);
        overflow: hidden;
      }

      .container > h1 {
        margin: 0;
        padding: 34px 56px 20px;
        font-size: 2.3rem;
        line-height: 1.15;
        letter-spacing: -0.02em;
        color: #13202d;
        text-align: center;
        border-bottom: 1px solid var(--line);
        background: linear-gradient(180deg, #fbfcfd 0%, #f2f4f6 100%);
      }

      .container > blockquote {
        margin: 0;
        padding: 30px 56px 44px;
        border: 0;
      }

      p, li { font-size: 1.04rem; }
      p { margin: 0 0 0.75em; }
      ul { margin: 0 0 0.8em 1.2em; padding: 0; }
      li { margin: 0 0 0.35em; }
      li:last-child { margin-bottom: 0; }

      h2 {
        margin: 0 0 14px;
        font-size: 1.28rem;
        line-height: 1.3;
        color: #16324d;
      }

      h3 {
        margin: 34px 0 14px;
        font-size: 1.42rem;
        line-height: 1.3;
        letter-spacing: -0.01em;
        color: #10283f;
      }

      .container > blockquote > h3[style*="text-align: center;"] {
        position: relative;
        text-align: left !important;
        padding-top: 8px;
        margin-top: 40px;
      }

      .container > blockquote > h3[style*="text-align: center;"]::before {
        content: "";
        display: block;
        width: 64px;
        height: 3px;
        margin: 0 0 14px;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--accent) 0%, #7f95a8 100%);
      }

      a {
        color: var(--accent);
        text-decoration-thickness: 1px;
        text-underline-offset: 2px;
      }

      a:hover { color: var(--accent-dark); }

      img {
        max-width: 100%;
        height: auto;
        border-radius: 14px;
      }

      .container > blockquote > img:first-of-type {
        width: 38%;
        max-width: 420px;
        border-radius: 18px;
        box-shadow: 0 12px 28px rgba(0,0,0,.12);
        border: 1px solid rgba(44,90,160,.10);
      }

      .container > blockquote > h3:first-of-type {
        margin-top: 0;
        font-size: 1.02rem;
        font-weight: 700;
        color: var(--muted);
        text-transform: uppercase;
        letter-spacing: 0.08em;
      }

      .container > blockquote > p:first-of-type {
        font-size: 1.06rem;
        color: #22374a;
      }

      .container > blockquote > blockquote {
        margin: 22px 0 8px;
        padding: 24px 26px;
        background: #f7fafc;
        border: 1px solid #c7d3dc;
        border-left: 5px solid var(--accent);
        border-radius: 14px;
        box-shadow: 0 2px 8px rgba(0,0,0,.04);
      }

      .container > blockquote > blockquote h2 {
        margin-top: 4px;
      }

      span[id] {
        display: block;
        position: relative;
        top: -110px;
        visibility: hidden;
      }

      div[style*="text-align:center; margin:50px 0 30px 0;"] {
        margin: 46px 0 10px 0 !important;
        padding: 24px 24px 12px;
        text-align: center;
        background: linear-gradient(180deg, #fafbfc 0%, var(--action-soft) 100%);
        border: 1px solid #d6e7dc;
        border-radius: 18px;
      }

      div[style*="text-align:center; margin:50px 0 30px 0;"] a[href^="mailto:"] {
        display: inline-block !important;
        margin-top: 4px;
        padding: 11px 18px !important;
        background: var(--action) !important;
        color: #fff !important;
        border-radius: 999px !important;
        text-decoration: none !important;
        font-weight: 700 !important;
        letter-spacing: 0 !important;
        box-shadow: none !important;
      }

      div[style*="text-align:center; margin:50px 0 30px 0;"] a[href^="mailto:"]:hover {
        background: var(--action-dark) !important;
      }

      div[style*="text-align:center; margin:50px 0 30px 0;"] p {
        color: var(--muted) !important;
        max-width: 720px !important;
      }

      div[style*="float: right; padding-left: 10px; width:350px"] {
        background: #fff;
        padding: 10px 0 0 14px !important;
      }

      .signal-note {
        margin: 1.2em 0 1.35em;
        padding: 14px 16px 14px 18px;
        background: #fff4b3;
        border: 1px solid #e6c200;
        border-left: 5px solid #ffd200;
        border-radius: 12px;
        box-shadow: 0 1px 4px rgba(0,0,0,.03);
      }

      .signal-note strong:first-child {
        color: #4f4200;
      }

      @media (max-width: 920px) {
        .container {
          margin: 0 auto 32px;
          border-radius: 16px;
        }

        .container > h1 {
          padding: 28px 24px 18px;
          font-size: 1.9rem;
        }

        .container > blockquote {
          padding: 22px 24px 34px;
        }

        .container > blockquote > img:first-of-type,
        img[style*="float: right"] {
          float: none !important;
          display: block;
          width: 100% !important;
          max-width: 100% !important;
          margin: 0 0 18px 0 !important;
          padding-left: 0 !important;
          padding-bottom: 0 !important;
          height: auto !important;
        }

        div[style*="float: right; padding-left: 10px; width:350px"] {
          float: none !important;
          width: 100% !important;
          padding: 0 !important;
          margin: 0 0 18px 0 !important;
          background: transparent;
        }

        div[style*="float: right; padding-left: 10px; width:350px"] img {
          width: 100% !important;
          max-width: 420px;
          margin: 0 auto 14px;
          display: block;
        }
      }

      .tech-box h2 {
        color: #111111;
        margin-top: 6px;
      }

      .container > blockquote > blockquote.tech-box {
        background: #ffffff;
        border: 2px solid #000000;
        border-radius: 6px;
        box-shadow: none;
      }

      .container > blockquote > blockquote.tech-box ul {
        margin-left: 1.2em;
      }

      .course-accordion {
        margin: 0.8em 0 1.2em;
      }

      .course-accordion details {
        margin: 0 0 10px 0;
        padding: 0;
        background: #ffffff;
        border: 1px solid #c7d3dc;
        border-radius: 10px;
        overflow: hidden;
      }

      .course-accordion summary {
        cursor: pointer;
        padding: 12px 14px;
        font-size: 1.02rem;
        font-weight: 700;
        background: #f7fafc;
        list-style: none;
      }

      .course-accordion summary::-webkit-details-marker {
        display: none;
      }

      .course-accordion .course-body {
        padding: 14px 16px 6px;
      }

      .course-accordion .course-body p:last-child,
      .course-accordion .course-body ul:last-child {
        margin-bottom: 0.6em;
      }

      .course-accordion summary::after {
        content: "+";
        float: right;
        font-weight: 700;
      }
      .course-accordion details[open] > summary::after {
        content: "−";
      }



/* Former inline style attributes from rebreather-training.html | v7.1.5 | 2026-04-28 */

.n2-rebreather-training-style-001 { max-width:720px;margin:18px auto 18px auto;padding:14px 16px;background:#f7fafc;border:1px solid #c7d3dc;border-left:4px solid #5a646e;border-radius:10px; }

.n2-rebreather-training-style-002 { margin:0 0 6px 0; }

.n2-rebreather-training-style-003 { font-style:normal; }

.n2-rebreather-training-style-004 { float: right; margin-left: 18px; margin-bottom: 10px; }

.n2-rebreather-training-style-005 { margin-top:0; }

.n2-rebreather-training-style-006 { text-align: center; }

.n2-rebreather-training-style-007 { float: right; margin-left: 10px; margin-top: 14px; }

.n2-rebreather-training-style-008 { float: right; margin-left: 10px; margin-top: 6px; }

.n2-rebreather-training-style-009 { display:block;position:relative;top:-120px;visibility:hidden; }

.n2-rebreather-training-style-010 { text-align:left; max-width:720px; margin:30px auto 14px auto; }

.n2-rebreather-training-style-011 { font-weight:600; text-decoration:none; }

.n2-rebreather-training-style-012 { margin:0 auto; font-size:1.02em; color:#566473; max-width:760px; line-height:1.55; font-weight:500; }

.n2-rebreather-training-style-013 { float: right; padding-left: 10px; width:350px; }

.n2-rebreather-training-style-014 { max-width:720px;margin:30px auto 10px auto;font-size:0.95rem;color:#444; }

.n2-rebreather-training-style-015 { max-width:720px;margin:40px auto 20px auto;font-size:0.95rem;color:#444; }