@font-face{font-family:Poppins;src:url(../fonts/Poppins-Regular.woff2)format('woff2'),url(../fonts/Poppins-Regular.woff)format('woff');font-display:swap}body{font-family:Poppins;background-color:#0a0b0b;color:#e8e6e3;overflow-x:hidden;font-size:20px}#topnav,#topnav div,.card-container{display:flex;justify-content:space-between;align-items:center}@media(min-width:600px){#topnav,.card-container,.fold-container{margin:1.5em 15%}}#topnav a{margin:.25em;text-align:center}a{text-decoration:none;font-weight:700;color:#fff}a:hover,.fold h2>label:hover{color:#ee893a;cursor:pointer}#splash{margin-top:30vh;text-align:center}#splash-image{position:absolute;top:0;left:50%;z-index:-1}#splash-image img{position:relative;max-height:100vh;max-width:100vw;display:block;left:-50%}#splash-image:after{display:block;content:'';position:absolute;width:100%;height:100%;top:0;left:-50%;box-shadow:0 0 15vh 15vh #0a0b0b inset}#body{position:absolute;top:100vh;width:100%}.section{text-align:center}.card-container{flex-wrap:wrap;justify-content:center}.card{min-height:290px;width:240px;border-radius:.5em;background-color:#1c1e1f;border:#ee893a solid;border-width:3px;padding:15px;text-align:center;transition:width .5s,min-height .5s,padding-left .5s,padding-right .5s,margin .5s;margin:25px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.card:hover{min-height:300px;width:250px;padding-left:20px;padding-right:20px;margin:20px}.card svg{fill:#ee893a}.card-title{color:#ee893a}.fold-container{border-radius:.5em;background-color:#1c1e1f;border:#ee893a solid;border-width:3px;padding:15px}.fold-container>hr{border-color:#ee893a;background-color:#ee893a;color:#ee893a}.fold>input{opacity:0;position:absolute}.fold>input:checked+h2+div{display:block}.fold>div{display:none;overflow-y:hidden}.fold>.fold-container{margin:0}code{border-radius:.3rem;background-color:#414558;border:1px solid #252525;padding-left:.2rem;padding-right:.2rem;white-space:nowrap}

img {
    max-width: 100%;
    max-height: 100%;
	object-fit: contain;
}

.portrait {
    height: 80px;
    width: 30px;
}

.landscape {
    height: 30px;
    width: 80px;
}

.square {
   max-height:100%; max-width:100%;
}