[data-css-preset] .container_width { width: 45% /*!content_center*/; } [data-css-preset] .container { margin-left: auto /*!content_center*/; margin-right: auto /*!content_center*/; } [data-css-preset] body { background-color: rgb(255, 255, 255) /*!body_bgcolor*/; } [data-css-preset] .content_padding { padding-top: 4rem /*!main_margin*/; padding-bottom: 4rem /*!main_margin*/; padding-left: 4rem /*!main_margin*/; padding-right: 4rem /*!main_margin*/; } /* === Roboto Mono + Orange Accent Theme === */ /* 1. Load font (put this in the Custom HTML field, not CSS): */ /* 2. Define color variables for easy tweaking */ :root { --accent: #ff6a00; /* Bright orange */ --accent-hover: #e65b00; /* Slightly deeper orange */ --text: #000000; } /* 3. Apply font sitewide */ body { font-family: "Roboto Mono", monospace !important; color: var(--text); background-color: rgb(255, 255, 255); } /* 4. Link + button accents */ a, .link, button, .button { color: var(--accent); text-decoration: none; transition: color 0.2s ease, background-color 0.2s ease; } a:hover, .link:hover { color: var(--accent-hover); } /* Buttons */ button, .button, input[type="submit"] { background-color: var(--accent); color: #fff !important; border: none; border-radius: 6px; padding: 8px 16px; font-weight: 500; cursor: pointer; } button:hover, .button:hover, input[type="submit"]:hover { background-color: var(--accent-hover); } /* 5. Code / pre styling */ pre, code { font-family: "Roboto Mono", monospace !important; background: rgba(0,0,0,0.05); color: #222; padding: 4px 8px; border-radius: 4px; } /* 6. Optional subtle content width tweak (keeps 45% but centers nicely) */ .container_width { width: 45%; margin-left: auto; margin-right: auto; } /* 7. Responsive fix for mobile */ @media (max-width: 768px) { .container_width { width: 85%; } .content_padding { padding-left: 2rem; padding-right: 2rem; } }