:root{--color-surface:#000;--color-surface-transparent:#00000080;--color-body:#c8c8c8;--color-body-transparent:#c8c8c880;--color-clear:#0000;--color-theme:#e756a6;--color-theme-transparent:#e756a680;--color-theme-dark:#0f0a14;--color-theme-dark-transparent:#0f0a1480;--color-shadow:#00000080;--color-artstation-logo-white-path:#fff;--color-artstation-logo-blue-path:#13aff0;--color-pinterest-logo-red-path:#bd081c;--font-serif:"Forum", serif;--font-sans-serif:"Roboto", sans-serif}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-surface);text-align:center;margin:0;padding:0}main{flex-direction:column;align-items:center;display:flex;overflow:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);color:var(--color-body);margin:0}h1{text-transform:uppercase;flex-direction:column;justify-content:center;display:flex}p,a{color:var(--color-body);font-family:var(--font-sans-serif);text-decoration:none}a:hover{color:var(--color-theme);text-decoration:underline}a:focus{color:var(--color-theme);outline:none;text-decoration:underline}h2{font-size:2.5rem}h3{font-size:2rem}header{border:1px solid var(--color-body-transparent);-webkit-backdrop-filter:blur(25px);backdrop-filter:blur(25px);background-color:var(--color-theme-dark-transparent);width:calc(100vw - 40px);height:55px;box-shadow:0 5px 5px var(--color-shadow);z-index:3;text-shadow:0 2px 2px var(--color-shadow);border-radius:40px;flex-direction:row;justify-content:space-evenly;align-items:center;margin-left:20px;margin-right:20px;display:flex;position:fixed;bottom:20px}header nav{display:inherit;justify-content:inherit;align-items:inherit;min-width:100%;height:100%}header nav .midnatt-lanern-logo{aspect-ratio:1;width:60px;fill:var(--color-body)}header nav a{align-items:center;height:100%;display:flex}header nav a:hover .midnatt-lanern-logo,header nav a:focus .midnatt-lanern-logo{fill:var(--color-theme)}@media screen and (width>=768px){header{width:700px;height:75px;margin-left:calc(50vw - 350px);margin-right:calc(50vw - 350px);top:20px;bottom:0}header a{font-size:1.2rem}}.landing-banner{background-image:linear-gradient(0deg, var(--color-surface) 10%, var(--color-clear) 60%), url(/portfolio/assets/floral-wallpaper-9kvBUWSy.webp);background-size:cover;flex-direction:column;align-items:center;width:100%;padding:0 20px 20px;display:flex;position:relative}.landing-banner>h1{text-shadow:0 3px 5px var(--color-shadow);text-transform:uppercase;white-space:nowrap;flex-direction:column;font-size:2.4rem;display:flex;position:absolute;top:180px}.landing-banner>h2{text-shadow:0 3px 5px var(--color-shadow);font-size:2.2rem}.landing-banner_break-heading{flex-direction:row;justify-content:center;gap:1rem;display:flex}.landing-banner_avatar{border:1px solid var(--color-body);width:150px;height:150px;box-shadow:0 5px 10px var(--color-surface);border-radius:50%;margin-top:20px;margin-bottom:100px;transition:all .3s}.landing-banner_text-alignment{text-align:justify;flex-direction:column;align-items:center;display:flex}.landing-navigation{width:100%}.landing-navigation>nav{border-radius:20px;flex-direction:column;margin:20px;display:flex;overflow:hidden}.landing-navigation_frontend-banner,.landing-navigation_illustration-banner{width:100%;height:300px;text-shadow:0 1px 2px var(--color-surface);background-size:cover;justify-content:center;align-items:center;font-size:2rem;font-weight:600;transition:all .3s;display:flex}.landing-navigation_frontend-banner{background-image:url(/portfolio/assets/code-stock-image-B4tpoVDh.webp)}.landing-navigation_illustration-banner{background-image:url(/portfolio/assets/art-collage-slanted-BrzvkV66.webp)}.landing-navigation_frontend-banner:hover,.landing-navigation_frontend-banner:focus,.landing-navigation_illustration-banner:hover,.landing-navigation_illustration-banner:focus{filter:none;z-index:1;box-shadow:0px 0px 50px var(--color-shadow);transform:scale(1.02)}.frontend-preview{border-top:2px dashed var(--color-theme-transparent);flex-direction:column;align-items:center;gap:20px;width:100%;padding:100px 20px 20px;display:flex;position:relative}.illustration-preview{border-top:2px dashed var(--color-theme-transparent);flex-direction:column;align-items:center;padding-top:100px;display:flex;position:relative;overflow:hidden}footer{background-color:var(--color-theme-transparent);flex-direction:column;justify-content:space-around;align-items:center;width:100%;height:fit-content;min-height:100px;display:flex}.discord-username{cursor:pointer}.discord-username:focus,.discord-username:hover{color:var(--color-theme);text-decoration:underline}.read-more-link{background-color:var(--color-theme-dark);justify-content:center;align-items:center;width:100%;height:60px;display:flex}.read-more-link:hover{outline:1px solid var(--color-theme-transparent)}@media screen and (width>=768px){h2{font-size:3rem}h3{font-size:2.5rem}.landing-banner{padding-top:100px}.landing-banner>h1{flex-direction:row;gap:300px;font-size:3rem;top:200px}.landing-banner_break-heading{flex-direction:column}.landing-banner_avatar{width:250px;height:250px;margin-bottom:10px}.landing-banner_text-alignment{flex-direction:row}.landing-banner_text-alignment p{width:50%;padding-left:50px;padding-right:50px}.landing-navigation>nav{border-radius:0;flex-direction:row;overflow:visible}.landing-navigation_frontend-banner,.landing-navigation_illustration-banner{filter:grayscale();height:500px}.frontend-preview_web-project-snapshot{filter:blur()}}@media screen and (width>=1170px){.landing-banner_text-alignment{width:1100px}.landing-banner>h1{grid-template-columns:1fr 1fr;gap:350px;display:grid;top:220px}.landing-banner_break-heading{justify-content:baseline;flex-direction:row}.landing-banner_break-heading:first-child{justify-content:end}footer{flex-direction:row}}.illustration-intro-text{width:calc(100vw - 50px)}.illustration-intro-text_alignment{text-align:justify;flex-direction:column;justify-content:center;display:flex}@media screen and (width>=768px){.illustration-intro-text_alignment{flex-direction:row;gap:2rem}.illustration-intro-text_alignment p{width:50%}}@media screen and (width>=1170px){.illustration-intro-text{width:1100px}}.scrolling-art-gallery{flex-direction:row;max-width:100vw;margin-bottom:50px;display:flex;overflow:hidden}.scrolling-art-gallery_track{animation:60s linear infinite scroll;display:flex}.scrolling-art-gallery img{object-fit:cover;width:20vw;height:40vw;box-shadow:-5px 0 15px var(--color-shadow)}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.align-artstation-and-pinterest{box-sizing:border-box;gap:20px;width:100%;height:fit-content;margin:0;padding:20px;display:grid}.align-artstation-and-pinterest a{border:1px solid var(--color-clear);background-color:var(--color-theme-dark);flex-direction:column;width:100%;height:fit-content;padding-bottom:1rem;display:flex}.align-artstation-and-pinterest a:hover{border-color:var(--color-theme)}.align-artstation-and-pinterest a:hover path{fill:var(--color-theme)}.align-artstation-and-pinterest_artstation-logo path{fill:var(--color-artstation-logo-blue-path)}.align-artstation-and-pinterest_artstation-logo path:first-child{fill:var(--color-artstation-logo-white-path)}.align-artstation-and-pinterest_pinterest-logo{width:100%}.align-artstation-and-pinterest_pinterest-logo path{fill:var(--color-pinterest-logo-red-path)}@media screen and (width>=768px){.align-artstation-and-pinterest{grid-template-columns:1fr 1fr}.align-artstation-and-pinterest a{height:100%}}.code-stack{-webkit-user-select:none;user-select:none;flex-flow:wrap;justify-content:center;gap:10px;margin-top:20px;display:flex}.code-stack li{background-color:var(--color-theme-dark);border:1px solid var(--color-theme-transparent);border-radius:10px;width:130px;height:220px;padding:10px;list-style:none;position:relative}.code-stack li img{aspect-ratio:1;width:100%}.code-stack li figcaption{width:100%;color:var(--color-body);font-family:var(--font-serif);width:calc(100% - 20px);position:absolute;bottom:10px}.code-stack__extension{grid-template-columns:1fr 1fr;display:grid;transform:scale(.7)}.code-stack__extension span{color:var(--color-body);font-size:2.5rem;font-family:var(--font-sans-serif);justify-content:center;align-items:center;display:flex}.code-stack__self-taught span{background-color:var(--color-theme-transparent);border-radius:5px;display:block}.frontend-intro-text_alignment{text-align:justify;flex-direction:column;display:flex}@media screen and (width>=768px){.frontend-intro-text_alignment{flex-direction:row;gap:5rem}}@media screen and (width>=1170px){.frontend-intro-text{width:1100px}}.web-projects_card{border:1px solid var(--color-clear);border:1px solid var(--color-theme-transparent);border-radius:20px;flex-direction:row;width:100%;height:350px;display:flex;position:relative;overflow:hidden}.web-projects_project-info{z-index:1;background:linear-gradient(90deg, var(--color-surface) 0%, var(--color-surface-transparent) 100%);width:100%;height:inherit;flex-direction:column;justify-content:space-between;align-items:baseline;padding:30px;display:flex;position:absolute}.web-projects_project-info p,.web-projects_project-info ul,.web-projects_project-info h3,.web-projects_project-info span{text-align:left;padding-left:2rem}.web-projects_card:focus .web-projects_project-info h3,.web-projects_card:focus .web-projects_project-info p{color:var(--color-shadow);outline:none;transition:all .2s;animation:3s infinite pulse-focus}.web-projects_card:hover .web-projects_project-info h3,.web-projects_card:hover .web-projects_project-info p{color:var(--color-theme);outline:none;transition:all .2s}.web-projects_card:focus .web-projects_project-info span,.web-projects_card:hover .web-projects_project-info span{text-decoration:underline}.web-projects_project-info h3,.web-projects_project-info p{text-shadow:0 2px 2px var(--color-shadow)}.web-projects_snapshot{width:100%;height:inherit;object-fit:cover;object-position:top;filter:blur(1px);position:relative}.web-projects_zag{flex-direction:row-reverse}@media screen and (width>=768px){.web-projects_card{border:1px solid var(--color-clear);border-radius:0;width:100%}.web-projects_card:hover,.web-projects_card:focus{border-color:var(--color-theme-transparent);transition:all .2s}.web-projects_project-info{background:0 0;background-color:var(--color-theme-dark);border-radius:0;width:66%;position:relative}.web-projects_snapshot{filter:blur()}}.illustration-page{flex-direction:column;justify-content:center;align-items:center;display:flex}.illustration-landing-banner{background-image:linear-gradient(0deg, var(--color-surface) 10%, var(--color-clear) 60%), url(/portfolio/assets/art-collage-slanted-BrzvkV66.webp);background-size:cover;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:200px;display:flex}.illustration-landing-banner h1{text-shadow:0 3px 5px var(--color-shadow);text-transform:uppercase;white-space:nowrap;flex-direction:column;font-size:2.4rem;display:flex}@media screen and (width>=768px){.illustration-landing-banner{justify-content:end;padding-top:120px;padding-bottom:80px}.illustration-landing-banner h1{font-size:3rem}}.commissioned-art-projects ul{margin:0;padding:0}.commissioned-art-projects li{margin-top:100px;margin-bottom:100px}.commissioned-art-projects img{width:300px;height:auto}.art-stack{-webkit-user-select:none;user-select:none;flex-flow:wrap;justify-content:center;gap:10px;margin-top:20px;display:flex}.art-stack li{background-color:var(--color-theme-dark);border:1px solid var(--color-theme-transparent);border-radius:10px;width:130px;height:220px;padding:10px;list-style:none;position:relative}.art-stack li img{aspect-ratio:1;width:100%}.art-stack li figcaption{width:100%;color:var(--color-body);font-family:var(--font-serif);width:calc(100% - 20px);position:absolute;bottom:10px}.art-stack__extension{grid-template-columns:1fr 1fr;display:grid;transform:scale(.7)}.art-stack__extension span{color:var(--color-body);font-size:2.5rem;font-family:var(--font-sans-serif);justify-content:center;align-items:center;display:flex}.art-stack__self-taught span{background-color:var(--color-theme-transparent);border-radius:5px;display:block}.frontend-page{flex-direction:column;align-items:center;gap:20px;width:100%;padding:20px;display:flex}.frontend-landing-banner{background-image:linear-gradient(0deg, var(--color-surface) 10%, var(--color-clear) 60%), url(/portfolio/assets/code-stock-image-B4tpoVDh.webp);background-size:cover;flex-direction:column;justify-content:center;align-items:center;width:100%;min-height:200px;display:flex}.frontend-landing-banner h1{text-shadow:0 3px 5px var(--color-shadow);text-transform:uppercase;white-space:nowrap;flex-direction:column;font-size:2.4rem;display:flex}@media screen and (width>=768px){.frontend-landing-banner{justify-content:end;padding-top:120px;padding-bottom:80px}.frontend-landing-banner h1{font-size:3rem}}