/**
 * This file is part of ramsey/website
 *
 * Copyright (c) Ben Ramsey <ben@ramsey.dev>
 *
 * ramsey/website is free software: you can redistribute it and/or modify it
 * under the terms of the GNU Affero General Public License as published by the
 * Free Software Foundation, either version 3 of the License, or (at your
 * option) any later version.
 *
 * ramsey/website is distributed in the hope that it will be useful, but WITHOUT
 * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
 * FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
 * details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with ramsey/website. If not, see <https://www.gnu.org/licenses/>.
 */
@font-face {
  font-family: "Archivo Black";
  font-style: normal;
  font-weight: 400;
  src: url("../media/fonts/ArchivoBlack/ArchivoBlack-Regular-zycQYl_.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 100;
  src: url("../media/fonts/Bitter/Bitter-Thin-nBoUw-n.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 100;
  src: url("../media/fonts/Bitter/Bitter-ThinItalic-qjEYVIv.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 200;
  src: url("../media/fonts/Bitter/Bitter-ExtraLight-CjKuiRe.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 200;
  src: url("../media/fonts/Bitter/Bitter-ExtraLightItalic-XXnTrde.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 300;
  src: url("../media/fonts/Bitter/Bitter-Light--RwoN-H.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 300;
  src: url("../media/fonts/Bitter/Bitter-LightItalic-AyyiXcc.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 400;
  src: url("../media/fonts/Bitter/Bitter-Regular-seFILit.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 400;
  src: url("../media/fonts/Bitter/Bitter-Italic-6s3DCV5.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 500;
  src: url("../media/fonts/Bitter/Bitter-Medium-cA6AUQ2.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 500;
  src: url("../media/fonts/Bitter/Bitter-MediumItalic-V6Q3kpT.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 600;
  src: url("../media/fonts/Bitter/Bitter-SemiBold-ZpG3_o7.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 600;
  src: url("../media/fonts/Bitter/Bitter-SemiBoldItalic-rOtSce5.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 700;
  src: url("../media/fonts/Bitter/Bitter-Bold-zYwKY8k.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 700;
  src: url("../media/fonts/Bitter/Bitter-BoldItalic-X1MnKBz.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 800;
  src: url("../media/fonts/Bitter/Bitter-ExtraBold-tHWQPjx.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 800;
  src: url("../media/fonts/Bitter/Bitter-ExtraBoldItalic-xaL8-Dz.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: normal;
  font-weight: 900;
  src: url("../media/fonts/Bitter/Bitter-Black-fasYhiv.woff2") format("woff2");
}
@font-face {
  font-family: "Bitter";
  font-style: italic;
  font-weight: 900;
  src: url("../media/fonts/Bitter/Bitter-BlackItalic-IaYfZgV.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 100;
  src: url("../media/fonts/Saira/Saira-Thin-VnCyDzU.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 100;
  src: url("../media/fonts/Saira/Saira-ThinItalic-pZSSwb1.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 200;
  src: url("../media/fonts/Saira/Saira-ExtraLight-siwtdtB.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 200;
  src: url("../media/fonts/Saira/Saira-ExtraLightItalic-eqH4oZh.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 300;
  src: url("../media/fonts/Saira/Saira-Light-lmcmypi.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 300;
  src: url("../media/fonts/Saira/Saira-LightItalic-KsDBYQC.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 400;
  src: url("../media/fonts/Saira/Saira-Regular-MfH-GDT.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 400;
  src: url("../media/fonts/Saira/Saira-Italic-xgxWLB9.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 500;
  src: url("../media/fonts/Saira/Saira-Medium-1kqOAqX.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 500;
  src: url("../media/fonts/Saira/Saira-MediumItalic-OP622LX.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 600;
  src: url("../media/fonts/Saira/Saira-SemiBold-K1v0P4t.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 600;
  src: url("../media/fonts/Saira/Saira-SemiBoldItalic-CNURI1R.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 700;
  src: url("../media/fonts/Saira/Saira-Bold-vWXojJL.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 700;
  src: url("../media/fonts/Saira/Saira-BoldItalic-eNkG156.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 800;
  src: url("../media/fonts/Saira/Saira-ExtraBold-GqcUO0s.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 800;
  src: url("../media/fonts/Saira/Saira-ExtraBoldItalic--uFJjUI.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: normal;
  font-weight: 900;
  src: url("../media/fonts/Saira/Saira-Black-gr2EbGj.woff2") format("woff2");
}
@font-face {
  font-family: "Saira";
  font-style: italic;
  font-weight: 900;
  src: url("../media/fonts/Saira/Saira-BlackItalic-An9H0Wt.woff2") format("woff2");
}
@font-face {
  font-family: "Sarabun";
  font-style: italic;
  font-weight: 500;
  src: url("../media/fonts/Sarabun/Sarabun-MediumItalic-sVt0Oa5.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 100;
  src: url("../media/fonts/Urbanist/Urbanist-Thin-DCdqzzV.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 100;
  src: url("../media/fonts/Urbanist/Urbanist-ThinItalic-fU5fvlI.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 200;
  src: url("../media/fonts/Urbanist/Urbanist-ExtraLight-OV_nmmM.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 200;
  src: url("../media/fonts/Urbanist/Urbanist-ExtraLightItalic-PaC_yMJ.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 300;
  src: url("../media/fonts/Urbanist/Urbanist-Light-FccxB40.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 300;
  src: url("../media/fonts/Urbanist/Urbanist-LightItalic-emZO_yb.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 400;
  src: url("../media/fonts/Urbanist/Urbanist-Regular-Qp_U-_R.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 400;
  src: url("../media/fonts/Urbanist/Urbanist-Italic-Gj_1Zj8.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 500;
  src: url("../media/fonts/Urbanist/Urbanist-Medium-QDyngBI.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 500;
  src: url("../media/fonts/Urbanist/Urbanist-MediumItalic-PqaXNJU.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 600;
  src: url("../media/fonts/Urbanist/Urbanist-SemiBold-TVBBVyK.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 600;
  src: url("../media/fonts/Urbanist/Urbanist-SemiBoldItalic-IUODfzi.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 700;
  src: url("../media/fonts/Urbanist/Urbanist-Bold-bgRO3Sx.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 700;
  src: url("../media/fonts/Urbanist/Urbanist-BoldItalic-UwYEYNv.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 800;
  src: url("../media/fonts/Urbanist/Urbanist-ExtraBold-HSJXVc2.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 800;
  src: url("../media/fonts/Urbanist/Urbanist-ExtraBoldItalic-gKijZIX.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: normal;
  font-weight: 900;
  src: url("../media/fonts/Urbanist/Urbanist-Black-j_EokYP.woff2") format("woff2");
}
@font-face {
  font-family: "Urbanist";
  font-style: italic;
  font-weight: 900;
  src: url("../media/fonts/Urbanist/Urbanist-BlackItalic-8bwoyyY.woff2") format("woff2");
}
:root {
  --red: #ff2975;
  --orange: #ff901f;
  --goldenrod: #ffb21c;
  --yellow: #ffd319;
  --green: #3be528;
  --cyan: #03fff0;
  --pink: #ff19e8;
  --purple-black: #1a0017;
  --purple-dark: #4d0045;
  --white: #ffffff;
  --gray-light: #999999;
  --gray-dark: #666666;
  --black: #151515;
  --color-accent: var(--pink);
  --color-background-grad1: var(--purple-dark);
  --color-background-grad2: var(--purple-black);
  --color-background: var(--purple-black);
  --color-bold: var(--yellow);
  --color-icon-base: var(--gray-light);
  --color-icon-hover: var(--yellow);
  --color-link: var(--cyan);
  --color-text: var(--white);
}

@media screen {
  body.br nav {
    font-size: clamp(0.7em, 0.4868811881em + 0.5940594059vw, 1em);
  }
  body.br nav .icon {
    background-color: var(--color-icon-base);
    display: inline-block;
  }
  body.br nav .icon:hover {
    background-color: var(--color-icon-hover);
  }
  body.br nav .icon.github {
    height: 4.045em;
    width: 3.7921875em;
    -webkit-mask: url("../media/svg/github-MfzZYNF.svg") no-repeat center/contain;
    mask: url("../media/svg/github-MfzZYNF.svg") no-repeat center/contain;
  }
  body.br nav .icon.home {
    height: 3.68em;
    margin-top: -0.1em;
    width: 4.14em;
    -webkit-mask: url("../media/svg/house-_ijNas4.svg") no-repeat center/contain;
    mask: url("../media/svg/house-_ijNas4.svg") no-repeat center/contain;
  }
  body.br nav .icon.linkedin {
    height: 4.682125em;
    margin-top: -0.55em;
    width: 4.096875em;
    -webkit-mask: url("../media/svg/linkedin-Smgs_m1.svg") no-repeat center/contain;
    mask: url("../media/svg/linkedin-Smgs_m1.svg") no-repeat center/contain;
  }
  body.br nav .icon.mastodon {
    height: 4.2106875em;
    margin-top: 0.5em;
    width: 3.684375em;
    -webkit-mask: url("../media/svg/mastodon-Rs_X6DH.svg") no-repeat center/contain;
    mask: url("../media/svg/mastodon-Rs_X6DH.svg") no-repeat center/contain;
  }
  body.br nav .icon.paper-plane {
    height: 3.2765625em;
    margin-top: 0.5em;
    width: 3.2765625em;
    -webkit-mask: url("../media/svg/paper-plane-TJpndI_.svg") no-repeat center/contain;
    mask: url("../media/svg/paper-plane-TJpndI_.svg") no-repeat center/contain;
  }
  body.br nav .icon.speaker-deck {
    height: 4.375em;
    width: 4.375em;
    -webkit-mask: url("../media/svg/speaker-deck-LMFW1tR.svg") no-repeat center/contain;
    mask: url("../media/svg/speaker-deck-LMFW1tR.svg") no-repeat center/contain;
  }
}
html {
  font-size: 100%;
}

@media screen {
  body.br {
    background-color: var(--color-background);
    background-image: linear-gradient(to bottom, var(--color-background-grad1), var(--color-background-grad2) 60%);
    background-repeat: no-repeat;
    color: var(--color-text);
    font-family: Saira, sans-serif;
    margin: 0;
    overflow-x: clip;
    padding-top: 4em;
    width: 100%;
  }
  body.br ::selection {
    background: var(--yellow);
    color: var(--black);
  }
}
@media screen and (max-width: 800px) {
  body.br {
    padding-top: 2em;
  }
}
@media screen {
  body.br div#container {
    margin: auto;
    width: 80%;
  }
}
@media screen and (min-width: 1382px) {
  body.br div#container {
    width: 1106px;
  }
}
@media screen {
  body.br a {
    color: var(--color-link);
  }
  body.br strong {
    color: var(--color-bold);
    font-weight: 700;
    font-style: normal;
  }
  body.br .sr {
    border: 0;
    clip-path: inset(50%);
    height: 1px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    white-space: nowrap;
    width: 1px;
  }
  body.br .pr {
    display: none;
  }
  body.br footer {
    font-weight: 100;
    margin: 3.125rem 0;
    text-align: center;
  }
  body.br footer p {
    margin: 0;
  }
  body.br footer p.logo svg {
    fill: transparent;
    height: 39px;
    padding: 5px;
    stroke-width: 5px;
    stroke: var(--color-accent);
    width: 66.5px;
  }
}
@media print {
  body.br .pr {
    display: inline;
  }
  body.br footer p.logo {
    display: none;
  }
}
@media screen {
  body.br.home {
    padding-top: 6.875em;
  }
}
@media screen and (min-width: 800px) {
  body.br.home {
    padding-top: 8em;
  }
}
@media screen and (max-width: 414px) {
  body.br.home {
    padding-top: 12em;
  }
}
@media screen {
  body.br.home header hgroup {
    display: block;
    font-size: 1rem;
    float: left;
    text-transform: uppercase;
    width: 100%;
  }
  body.br.home header hgroup h1 {
    display: block;
    font-family: "Archivo Black", sans-serif;
    font-size: clamp(3.8em, 0.3725842697em + 11.1460674157vw, 10em);
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 0.706em;
    margin: 0;
    transform-origin: left top;
    transform: scaleX(1.06);
    width: 100%;
    -webkit-text-stroke: 2px var(--color-text);
    text-stroke: 2px var(--color-text);
  }
}
@media screen and (max-width: 414px) {
  body.br.home header hgroup h1 {
    font-size: clamp(1em, 0.4505494505em + 17.5824175824vw, 5em);
  }
}
@media screen {
  body.br.home header hgroup h1 .ben {
    display: inline-block;
    width: auto;
  }
  body.br.home header hgroup h1 .ben .b, body.br.home header hgroup h1 .ben .e, body.br.home header hgroup h1 .ben .n {
    display: inline-block;
    transform: scale(-1, 1);
  }
  body.br.home header hgroup h1 .ben .b {
    -webkit-text-fill-color: transparent;
  }
  body.br.home header hgroup h1 .ben .n {
    -webkit-text-stroke-color: var(--color-accent);
    -webkit-text-fill-color: var(--color-accent);
  }
  body.br.home header hgroup h1 .ramsey {
    display: inline-block;
    margin-left: 2.047em;
  }
}
@media screen and (max-width: 492px) {
  body.br.home header hgroup h1 .ramsey {
    margin: 1px auto 0 auto;
    text-align: right;
    width: 100%;
  }
}
@media screen and (max-width: 414px) {
  body.br.home header hgroup h1 .ramsey {
    margin-left: 1.1em;
    text-align: left;
    width: fit-content;
  }
  body.br.home header hgroup h1 .ramsey .sey {
    display: block;
    margin-left: -1.1em;
    width: fit-content;
  }
}
@media screen {
  body.br.home header hgroup h1 .ramsey .r {
    -webkit-text-fill-color: transparent;
  }
  body.br.home header hgroup h1 + p {
    font-size: clamp(0.6em, 0.3158415842em + 0.7920792079vw, 1em);
    line-height: 1.45em;
    margin-top: -4.55em;
  }
}
@media screen and (max-width: 800px) {
  body.br.home header hgroup h1 + p {
    margin-top: 2.5em;
  }
}
@media screen {
  body.br.home header hgroup h1 + p span.descriptor {
    display: block;
    font-family: Sarabun, sans-serif;
    font-size: 2em;
    font-style: italic;
    font-weight: 500;
    margin: 0;
    padding: 0;
  }
}
@media screen and (max-width: 800px) {
  body.br.home header hgroup h1 + p span.descriptor {
    display: inline-block;
    padding-right: 0.5em;
  }
  body.br.home header hgroup h1 + p span.descriptor::before {
    content: " \\ ";
  }
}
@media screen {
  body.br.home header nav {
    float: right;
    margin-top: -25%;
  }
}
@media screen and (max-width: 800px) {
  body.br.home header nav {
    left: auto;
    margin-top: 3em;
    position: absolute;
    top: 0;
    width: 80%;
  }
}
@media screen and (max-width: 492px) {
  body.br.home header nav {
    left: 20%;
    width: 60%;
  }
}
@media screen {
  body.br.home header nav ul {
    display: flex;
    gap: 1.25em;
    justify-content: space-evenly;
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
}
@media screen and (max-width: 414px) {
  body.br.home header nav ul {
    flex-wrap: wrap;
  }
  body.br.home header nav ul li {
    flex-basis: 25%;
  }
}
@media screen {
  body.br.home main {
    clear: left;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 4em;
  }
}
@media screen and (max-width: 800px) {
  body.br.home main {
    padding-top: 2em;
  }
}
@media screen {
  body.br.home main p {
    font-size: 1.45rem;
    font-weight: 100;
    line-height: 1.1em;
    margin: 0 0 0.75em 0;
    padding: 0 0.25em;
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}
@media screen and (max-width: 492px) {
  body.br.home main p {
    text-align: left;
  }
}
@media print {
  body.br.home header hgroup h1 {
    margin-bottom: 0;
  }
  body.br.home header hgroup p {
    font-size: 1.25em;
    font-style: italic;
    font-weight: bold;
    margin-top: 0;
  }
  body.br.home nav img {
    display: none;
  }
}
@media screen {
  body.br.page div#container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  body.br.page nav {
    width: 20%;
  }
}
@media screen and (max-width: 492px) {
  body.br.page nav {
    width: 100%;
  }
}
@media screen {
  body.br.page main {
    padding: 0;
    width: 70%;
  }
}
@media screen and (max-width: 492px) {
  body.br.page main {
    width: 100%;
  }
}
@media screen {
  body.br.page main article {
    font-size: 1.45rem;
    font-weight: 200;
    line-height: 1.1em;
    margin: 0 0 0.75em 0;
    padding: 0;
    text-align: justify;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
}
@media screen and (max-width: 492px) {
  body.br.page main article {
    text-align: left;
  }
}
@media screen {
  body.br.page footer {
    width: 100%;
  }
}
@media print {
  body.br.page nav {
    display: none;
  }
}

/*# sourceMappingURL=app.output.css.map */