/* ============================================== blue-boy — DECK COPY Copied from themes/blue-boy/blue-boy.css Font paths adjusted for deck/ location. DO NOT edit base styles here — edit in themes/ and copy back. ============================================== */ @font-face { font-family: 'Cartridge'; src: url('themes/blue-boy/fonts/Cartridge-Regular.otf') format('opentype'); } @font-face { font-family: 'Cartridge Bold'; src: url('themes/blue-boy/fonts/Cartridge-Bold.otf') format('opentype'); } @font-face { font-family: 'Cartridge Rough'; src: url('themes/blue-boy/fonts/Cartridge-Rough.otf') format('opentype'); } @font-face { font-family: 'Cartridge BoldRough'; src: url('themes/blue-boy/fonts/Cartridge-BoldRough.otf') format('opentype'); } :root { --cote-blue: #0091DA; --tanzu-green: #00C7B7; } /* Default all slides to blue-boy blue */ .reveal .slide-background { background-color: var(--cote-blue); } /* Section title — big Cartridge Rough for divider slides */ .section-title { font-family: 'Cartridge Rough', 'Cartridge', sans-serif !important; font-size: 1.6em; } /* Font + alignment overrides on stock white theme */ .reveal .slides section { font-family: 'Cartridge', sans-serif; text-align: left; font-feature-settings: "calt" 0, "liga" 0, "clig" 0; } .reveal .slides section h1, .reveal .slides section h2, .reveal .slides section h3 { font-family: 'Cartridge Bold', 'Cartridge', sans-serif; text-align: left; text-transform: none; color: inherit; } .reveal .slides section h2 { font-size: 1.1em; } .rough-title { font-family: 'Cartridge Rough', 'Cartridge', sans-serif !important; } /* Reveal adds .has-dark-background to when current slide has dark bg */ .has-dark-background .reveal .slides section h1, .has-dark-background .reveal .slides section h2, .has-dark-background .reveal .slides section h3, .has-dark-background .reveal .slides section p, .has-dark-background .reveal .slides section li { color: #fff; } /* Global list style — hyphen instead of bullet, with hanging indent */ .reveal ul { list-style: none; } .reveal ul li { padding-left: 0.7em; text-indent: -0.7em; } .reveal ul li::before { content: '- '; } /* Layout utilities */ .two-col { display: flex; gap: 2em; align-items: flex-start; } .two-col .col { flex: 1; } .two-col h3 { font-size: 0.75em; margin-bottom: 0.5em; } .three-col { display: flex; gap: 1.5em; } .three-col .col { flex: 1; } .three-col h3 { font-size: 0.7em; margin-bottom: 0.4em; } .three-col ul { font-size: 0.65em; padding-left: 1.2em; } .three-col li { margin-bottom: 0.2em; line-height: 1.3; } /* Quote slide — full-bleed decorative block quote layout */ .quote-layout { position: relative; padding-left: 2.2em; } .quote-layout::before { content: '\201C'; position: absolute; left: 0; top: -0.25em; font-size: 3em; font-family: 'Cartridge Bold', 'Cartridge', sans-serif; color: #fff; line-height: 1; } .pull-quote { max-width: 60%; font-size: 0.75em; line-height: 1.5; color: #fff; margin: 0; padding: 0; } .pull-quote p:first-child { margin-top: 0; } .pull-quote p { margin-bottom: 0.6em; } .attribution { font-size: 0.64em; color: #fff; margin-top: 0.8em; text-align: right; } /* Slide footer — small citation/source text */ .slide-footer { font-size: 0.28em; color: #fff; margin-top: 0.3em; text-align: left; } /* Working/todo vertical slides */ .todo-slide h3 { font-size: 0.6em; color: #333; font-family: 'Cartridge Bold', sans-serif; } .todo-slide ul { font-size: 0.6em; } .todo-slide a { color: var(--cote-blue); } /* Links — always white, always underlined */ .reveal a { color: #fff; text-decoration: underline; } .reveal a:hover { color: #fff; text-decoration: underline; } /* Card columns — three-column layout with gradient cards and white pills */ .card-cols { display: flex; gap: 0.6em; align-items: stretch; } .card { flex: 1; border-radius: 0.4em; padding: 0.5em; display: flex; flex-direction: column; gap: 0.25em; } .card .card-header { font-family: 'Cartridge Bold', 'Cartridge', sans-serif; font-size: 0.55em; color: #fff; margin-bottom: 0.2em; padding-bottom: 0.15em; } .card .card-item { background: #fff; border-radius: 0.25em; padding: 0.2em 0.4em; font-size: 0.4em; color: #333; line-height: 1.3; } /* Override global list styles inside cards */ .card-cols ul { list-style: none; margin: 0; padding: 0; } .card-cols li { padding-left: 0; text-indent: 0; } .card-cols li::before { content: none; } /* Four-up image grid — 2x2, centered, fits slide */ .four-up { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px; margin: auto; } .four-up img { width: 48%; max-height: 320px; object-fit: contain; } /* AI Timeline — alternating top/bottom zigzag */ .ai-timeline { position: relative; width: 90%; margin: 0.8em auto 0; height: 280px; } .tl-line { position: absolute; top: 50%; left: 5%; right: 5%; height: 3px; background: rgba(255,255,255,0.4); transform: translateY(-50%); } .tl-dot { position: absolute; top: 50%; width: 14px; height: 14px; background: #fff; border-radius: 50%; transform: translate(-50%, -50%); } .tl-item { position: absolute; width: 18%; text-align: center; } .tl-label { display: flex; flex-direction: column; align-items: center; gap: 0.1em; } .tl-icon { font-size: 1.4em; line-height: 1; } .tl-title { font-family: 'Cartridge Bold', 'Cartridge', sans-serif; font-size: 0.55em; color: #fff; line-height: 1.2; } .tl-date { font-size: 0.4em; color: #fff; } .tl-top { bottom: 55%; } .tl-bottom { top: 55%; } /* Connector lines from dots to labels */ .tl-top::after, .tl-bottom::before { content: ''; position: absolute; left: 50%; width: 2px; height: 20px; background: rgba(255,255,255,0.4); } .tl-top::after { bottom: -20px; } .tl-bottom::before { top: -20px; } /* Thanks slide — text upper-left, QR lower-right */ .thanks-layout { position: relative; width: 100%; min-height: 580px; } .thanks-left { position: absolute; top: 0; left: 0; } .thanks-qr-area { position: absolute; bottom: 0; right: 0; display: flex; flex-direction: column; align-items: center; } .thanks-qr { width: 340px; height: 340px; } .thanks-qr-label { font-family: 'Cartridge Rough', 'Cartridge', sans-serif; font-size: 0.55em; color: #fff; margin: 0 0 0.15em 0; } .thanks-qr-label a { color: #fff; text-decoration: none; } /* Service/feature grid — 5x2 icon boxes (Spring AI style) */ .sai-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.4em; margin-top: 0.4em; } .sai-box { border: 2px solid #6BA539; border-radius: 0.3em; padding: 0.3em 0.25em; text-align: center; background: #fff; } .sai-icon { font-size: 1.4em; color: #6BA539; margin-bottom: 0.15em; } .sai-title { font-family: 'Cartridge Bold', 'Cartridge', sans-serif; font-size: 0.42em; color: #333; margin-bottom: 0.15em; line-height: 1.2; } .sai-desc { font-size: 0.32em; color: #666; line-height: 1.3; } /* Text selection — highlighter yellow so it's visible on blue slides */ ::selection { background-color: #FFE000; color: #000; } ::-webkit-selection { background-color: #FFE000; color: #000; } .reveal ::selection { background-color: #FFE000; color: #000; } .reveal ::-webkit-selection { background-color: #FFE000; color: #000; }