@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,500;0,700;1,500;1,700&display=swap");
html, body { margin: 0; padding: 0; background-color: var(--cyber-dark-grey); color: #FFFFFF; --min-nav-inner-width: 8ch; --nav-width: calc(max(var(--min-nav-inner-width), 10%) + 2rem); --nav-footer-font-size: max(2.1vw, calc(0.21 * var(--min-nav-inner-width))); --nav-footer-line-height-multiplier: 1.32; --nav-footer-line-height: calc(var(--nav-footer-line-height-multiplier) * var(--nav-footer-font-size)); --cyber-yellow: #ca1928; --cyber-dark-grey: #2c2c2c; --arcimation: 400ms cubic-bezier(.23,1,.32,1); }

body, p, code { font-family: "IBM Plex Mono", "Consolas", "Lucida Console", monospace; }

body.no-scroll { overflow: hidden; }

a { text-decoration: underline #ca1928; color: white; }

a:hover { color: #ca1928; }

hr { margin: 2rem 0; }

h1, h2, h3 { color: #ca1928; }

h1 { font-size: 2.5rem; font-weight: bold; margin: 1rem 0rem; }

img { width: 100%; max-height: 60vh; object-fit: cover; }

blockquote { border-left: 5px solid #ca1928; padding-left: 1rem; margin-left: 0; }

strong { color: #ca1928; }

footer { width: 100%; height: calc(5 * var(--nav-footer-line-height)); color: #6B6B6B; font-size: var(--nav-footer-font-size); line-height: var(--nav-footer-line-height); text-align: center; border-color: #6B6B6B; border-top-style: dashed; }

footer .window-container { position: absolute; height: calc(5 * var(--nav-footer-line-height)); width: calc(100% - var(--nav-width)); clip: rect(0, auto, auto, 0); }

footer .window-container .window { position: fixed; width: calc(100% - var(--nav-width)); /** I couldn't figure out a way to do this without JS so here's a fallback that looks decently well */ /** top: calc(1rem + n * var(--nav-footer-line-height)); */ bottom: 4.75vh; }

footer .window-container .window .contacts { display: block; }

footer .window-container .window .contacts p { margin: 0px; display: inline-block; }

footer a { text-decoration: none; }

footer p { margin: 0px; }

nav:not(.open) { transform: translateX(-100%); }

.nav-toggle:not(.enabled) { display: none; }

.nav-toggle { position: fixed; display: flex; justify-content: center; align-items: center; border-radius: 50%; top: 0.25rem; left: 0.25rem; width: 2rem; height: 2rem; padding: 0.5rem; font-size: 2rem; }

.nav-toggle:hover { cursor: pointer; }

/* yes this hamburger code is stolen directly from myself @ lactf ~ andrew */
/* heehee i stole this hamburger code from andrew @ acmcyber.com ~ ronak */
.hamburger-button, .hamburger-button::before, .hamburger-button::after { display: block; position: absolute; height: 4px; width: 30px; background-color: white; border-radius: 2px; transition: transform var(--arcimation); }

.hamburger-button::before { content: ""; margin-top: -8px; }

.hamburger-button::after { content: ""; margin-top: 8px; }

body:has(nav.open) .hamburger-button::before { margin-top: 0px; transform: rotate(405deg); }

body:has(nav.open) .hamburger-button { background: transparent; }

body:has(nav.open) .hamburger-button::after { margin-top: 0px; transform: rotate(-405deg); }

nav { --nav-inner-width: 8ch; position: fixed; overflow: visible; top: 0; left: 0; bottom: 0; padding: 1rem 0rem 0rem 1.75ch; -webkit-padding-start: 0.4rem; width: calc(var(--nav-width) - 2rem); transition: var(--arcimation); }

nav div.hex { position: absolute; width: var(--nav-inner-width); padding-right: 1rem; user-select: none; pointer-events: none; font-size: var(--nav-footer-font-size); line-height: var(--nav-footer-line-height); color: #6B6B6B; }

nav div.hex ol { margin: 0; padding: 0; list-style: none; counter-reset: hex -16; isolation: isolate; }

nav div.hex ol li { position: relative; display: flow-root; counter-increment: hex 16; }

nav div.hex ol li::before { content: "00000000"; position: absolute; display: block; text-align: right; width: 100%; }

nav div.hex ol li::after { content: counter(hex, upper-hexadecimal); z-index: 1; position: relative; display: block; float: right; background-color: #2C2C2C; }

nav ul { position: absolute; display: flex; flex-direction: column; list-style-type: none; margin: 0; padding: 0; width: var(--nav-inner-width); font-size: var(--nav-footer-font-size); line-height: var(--nav-footer-line-height); }

nav ul li:first-child { opacity: 0%; user-select: none; pointer-events: none; }

nav ul li a { display: block; float: right; isolation: isolate; color: #FFFFFF; background-color: #2C2C2C; text-decoration: none; text-align: center; }

nav ul li a:not([highlighted]) { margin: 0 2ch; }

nav ul li a[highlighted], nav ul li a:hover { color: #ca1928; }

nav ul li a[highlighted]::before { content: ">>"; }

nav ul li a[highlighted]::after { content: "<<"; }

/* Safari doesn't support @counter-style but has upper-hexadecimal built-in, so using this name works for all browsers! */
@counter-style upper-hexadecimal { system: numeric;
  symbols: "0" "1" "2" "3" "4" "5" "6" "7" "8" "9" "A" "B" "C" "D" "E" "F"; }

ul.blog-cards { list-style: none; padding: 0; }

ul.blog-cards a { text-decoration: none; }

ul.blog-cards li { padding: 1.5rem 2rem 1rem 2rem; margin: 2rem 0; border-radius: 0.5rem; background-color: #565656; transition: box-shadow .2s; border: 1px solid #ca1928; }

ul.blog-cards li:hover { box-shadow: 0 0 10px #ca1928; }

ul.blog-cards li:hover .card-title { text-decoration: none; }

ul.blog-cards a:hover { color: white; }

.card-title { font-size: 1.3rem; font-weight: bold; color: #ca1928; }

.card-date-author { font-style: italic; }

.tags { margin-top: 0.5rem; }

.tags span { padding: 0.3rem; border: 2px solid #FFFFFF; background-color: #FFFFFF; border-radius: 0.3rem; font-size: 0.8rem; line-height: 2.2rem; }

.card-summary { padding-top: 0.5rem; }

.post-title { margin: 0; font-size: 2rem; }

.post-author-date { font-size: 1.4rem; }

body:has(nav.open) .content { margin-left: var(--nav-width); }

body:has(.nav-toggle.enabled) { padding-top: 1rem; }

.content { display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; }

.content main { padding: 2rem 7%; min-height: 65rem; /* for ctf writeup, do not hide parts of the image if it is too tall */ }

.content main img { width: 80%; margin: 20px auto; display: block; max-height: 60vh; /** object-fit: cover should probably not exist but keep it just to be sure we don't break anything */ object-fit: cover; }

.content main article img { object-fit: contain; }

ul.ctf-cards { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; }

ul.ctf-cards > li { width: 35%; padding: 1.5rem; margin: 2%; border: 1px solid #ca1928; border-radius: 0.5rem; background-color: #565656; transition: box-shadow .2s; }

ul.ctf-cards > li:hover { box-shadow: 0 0 10px #ca1928; }

.ctf-place { border-radius: 0.5rem; background-color: #FFFFFF; max-width: 75%; padding: 5px; text-align: center; color: white; font-size: 1rem; font-weight: bold; }

.ctf-organizers { border-radius: 0.5rem; background-color: #ca1928; max-width: 75%; padding: 5px; text-align: center; color: white; font-size: 1rem; font-weight: bold; }

.ctf-year { font-size: 2.5rem; }

.ctf-name { color: white; font-size: 2rem; font-weight: bold; }

.ctf-details { display: flex; flex-wrap: wrap; margin-bottom: 1rem; }

.ctf-time-link { padding-left: 0.75rem; padding-top: 0.25rem; display: inline; font-size: 1rem; color: #ca1928; }

.ctf-time-link a { color: #ca1928; }

.team-flex-container { display: flex; margin: 0 3%; flex-wrap: wrap; justify-content: center; }

.team-flex-container .member-flex-item { margin: 1.5% 4%; max-width: 25%; text-align: center; min-width: 150px; }

.team-flex-container .member-flex-item p { margin: 0.5rem 0; padding: 0; }

.team-flex-container .member-flex-item .member-name { font-size: 1.5rem; }

.team-flex-container .member-flex-item .member-role { font-size: 1rem; }

.team-flex-container .logo { max-width: 20%; margin-left: none; margin-right: none; display: inline-block; }

.team-flex-container a { text-decoration: none; }

.team-flex-container .profile-image { border: 2px solid #ca1928; border-radius: 50%; aspect-ratio: 1; }

.load { display: none; margin: 0; padding: 1rem; width: 100%; height: 200%; position: fixed; background-color: #2c2c2c; z-index: 1; opacity: 1; }

.load pre, .load body { padding: 0; margin: 0; }

.load .term { font-family: "IBM Plex Mono", "Consolas", "Lucida Console", monospace; color: #cdcdcd; font-size: 2vw; line-height: calc(var(--nav-footer-line-height-multiplier) * 2vw); opacity: 0.8; overflow: hidden hidden; }

.load .term:after { content: "_"; opacity: 1; animation: cursor 1s infinite; }

@keyframes cursor { 0% { opacity: 0; }
  40% { opacity: 0; }
  50% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; } }

@keyframes fade-out { from { opacity: 1; }
  to { opacity: 0; } }

/* Based on https://github.com/richleland/pygments-css/blob/master/monokai.css */
div.highlight { padding: 1px 15px; margin: 5px 0; }

.content article pre:not(.highlight) { padding: 10px 15px; }

div.highlight, .content article pre:not(.highlight) { background: #222; color: #f7f1ff; border-radius: 10px; overflow-x: auto; }

/* Inline code blocks */
code.highlighter-rouge { background: #222222; color: #f7f1ff; border-radius: 7px; padding: 2px 7px; }

.highlight .hll { background-color: #f7f1ff0c; }

.highlight { background: #222222; color: #f7f1ff; }

.highlight .c { color: #69676c; }

/* Comment */
.highlight .err { color: #960050; background-color: #1e0010; }

/* Error */
.highlight .k { color: #5ad4e6; }

/* Keyword */
.highlight .l { color: #948ae3; }

/* Literal */
.highlight .n { color: #f7f1ff; }

/* Name */
.highlight .o { color: #fc618d; }

/* Operator */
.highlight .p { color: #f7f1ff; }

/* Punctuation */
.highlight .ch { color: #69676c; }

/* Comment.Hashbang */
.highlight .cm { color: #69676c; }

/* Comment.Multiline */
.highlight .cp { color: #69676c; }

/* Comment.Preproc */
.highlight .cpf { color: #69676c; }

/* Comment.PreprocFile */
.highlight .c1 { color: #69676c; }

/* Comment.Single */
.highlight .cs { color: #69676c; }

/* Comment.Special */
.highlight .gd { color: #fc618d; }

/* Generic.Deleted */
.highlight .ge { font-style: italic; }

/* Generic.Emph */
.highlight .gi { color: #7bd88f; }

/* Generic.Inserted */
.highlight .gs { font-weight: bold; }

/* Generic.Strong */
.highlight .gu { color: #69676c; }

/* Generic.Subheading */
.highlight .kc { color: #5ad4e6; }

/* Keyword.Constant */
.highlight .kd { color: #5ad4e6; }

/* Keyword.Declaration */
.highlight .kn { color: #fc618d; }

/* Keyword.Namespace */
.highlight .kp { color: #5ad4e6; }

/* Keyword.Pseudo */
.highlight .kr { color: #5ad4e6; }

/* Keyword.Reserved */
.highlight .kt { color: #5ad4e6; }

/* Keyword.Type */
.highlight .ld { color: #fce566; }

/* Literal.Date */
.highlight .m { color: #948ae3; }

/* Literal.Number */
.highlight .s { color: #fce566; }

/* Literal.String */
.highlight .na { color: #7bd88f; }

/* Name.Attribute */
.highlight .nb { color: #f7f1ff; }

/* Name.Builtin */
.highlight .nc { color: #7bd88f; }

/* Name.Class */
.highlight .no { color: #5ad4e6; }

/* Name.Constant */
.highlight .nd { color: #7bd88f; }

/* Name.Decorator */
.highlight .ni { color: #f7f1ff; }

/* Name.Entity */
.highlight .ne { color: #7bd88f; }

/* Name.Exception */
.highlight .nf { color: #7bd88f; }

/* Name.Function */
.highlight .nl { color: #f7f1ff; }

/* Name.Label */
.highlight .nn { color: #f7f1ff; }

/* Name.Namespace */
.highlight .nx { color: #7bd88f; }

/* Name.Other */
.highlight .py { color: #f7f1ff; }

/* Name.Property */
.highlight .nt { color: #fc618d; }

/* Name.Tag */
.highlight .nv { color: #f7f1ff; }

/* Name.Variable */
.highlight .ow { color: #fc618d; }

/* Operator.Word */
.highlight .w { color: #f7f1ff; }

/* Text.Whitespace */
.highlight .mb { color: #948ae3; }

/* Literal.Number.Bin */
.highlight .mf { color: #948ae3; }

/* Literal.Number.Float */
.highlight .mh { color: #948ae3; }

/* Literal.Number.Hex */
.highlight .mi { color: #948ae3; }

/* Literal.Number.Integer */
.highlight .mo { color: #948ae3; }

/* Literal.Number.Oct */
.highlight .sa { color: #fce566; }

/* Literal.String.Affix */
.highlight .sb { color: #fce566; }

/* Literal.String.Backtick */
.highlight .sc { color: #fce566; }

/* Literal.String.Char */
.highlight .dl { color: #fce566; }

/* Literal.String.Delimiter */
.highlight .sd { color: #fce566; }

/* Literal.String.Doc */
.highlight .s2 { color: #fce566; }

/* Literal.String.Double */
.highlight .se { color: #948ae3; }

/* Literal.String.Escape */
.highlight .sh { color: #fce566; }

/* Literal.String.Heredoc */
.highlight .si { color: #fce566; }

/* Literal.String.Interpol */
.highlight .sx { color: #fce566; }

/* Literal.String.Other */
.highlight .sr { color: #fce566; }

/* Literal.String.Regex */
.highlight .s1 { color: #fce566; }

/* Literal.String.Single */
.highlight .ss { color: #fce566; }

/* Literal.String.Symbol */
.highlight .bp { color: #f7f1ff; }

/* Name.Builtin.Pseudo */
.highlight .fm { color: #7bd88f; }

/* Name.Function.Magic */
.highlight .vc { color: #f7f1ff; }

/* Name.Variable.Class */
.highlight .vg { color: #f7f1ff; }

/* Name.Variable.Global */
.highlight .vi { color: #f7f1ff; }

/* Name.Variable.Instance */
.highlight .vm { color: #f7f1ff; }

/* Name.Variable.Magic */
.highlight .il { color: #948ae3; }

/* Literal.Number.Integer.Long */
.carousel-container { position: relative; margin: 0 auto; max-width: 2000px; margin-bottom: 530px; }

.mySlides { display: none; margin: 0 10% !important; height: 500px; transition: opacity 0.5s ease-in-out; position: absolute; top: 0; }

/*# sourceMappingURL=global.css.map */