html,body,h1,h2,p,blockquote,a,img,ol,ul,header,footer,nav{box-sizing:border-box;border:0;margin:0;padding:0;font-family:monospace;font-size:100%}ul{list-style:none}:root{--green:#afbc98;--light:#14110f;--dark:#fff;--shadow:#0b090c;width:100%}@keyframes fadein{0%{opacity:0}to{opacity:1}}@keyframes picslide{0%{opacity:0;margin-left:800px}to{opacity:1;margin-left:40px}}body{background-color:var(--light);flex-direction:column;display:flex}h1{font-size:40px;font-weight:bolder}h2{color:var(--green);margin:60px;font-size:30px}h3{color:var(--dark)}p{margin:20px;font-size:16px}header{text-align:center;background-color:var(--green);color:var(--light);border-color:var(--dark);box-sizing:border-box;border-bottom-right-radius:90% 10%;border-bottom-left-radius:90% 10%;flex-wrap:wrap;justify-content:space-between;align-items:baseline;width:100%;padding:50px;text-decoration:underline;animation-name:fadein;animation-duration:3s;display:flex}nav{color:var(--light);display:flex}.nav{margin-left:0;padding:40px;font-size:30px}.nav-item{color:var(--light);margin:10px;text-decoration:underline}nav a:hover{color:var(--dark)}div{position:relative}div img{border:5px solid var(--light);width:25%;max-width:350px;margin-left:40px;position:absolute;top:-40px}#header-img{animation-name:picslide;animation-duration:2s}Footer{background-color:var(--green);width:100%;color:var(--light);padding:10px;animation-name:fadein;animation-duration:3s;bottom:0}.links{justify-content:center;margin:5vw;display:flex}.links a{color:var(--green);margin:5vw;font-size:30px;text-decoration:underline}.links a:hover{color:var(--dark)}#hello{-webkit-text-decoration:underline var(--green);text-decoration:underline var(--green);flex-flow:column wrap;align-items:flex-end;padding:40px;display:flex}.small{color:var(--dark);margin-top:100px;font-size:20px}#About aside{flex-direction:column;align-items:flex-end;display:flex}#About aside p{color:var(--dark);border:solid 5px var(--green);width:70%;box-shadow:10px 5px 5px var(--shadow);margin-right:5vw;padding:20px}#Works aside{background-color:var(--green);flex-direction:column;justify-content:space-evenly;width:100%;margin-bottom:5vw;padding:5vw 0;animation-name:fadein;animation-duration:3s;display:flex}.works-label{color:var(--dark);font-size:23px}#Works aside div{flex-wrap:wrap;justify-content:space-evenly;display:flex}.card{border-style:solid var(--dark);width:auto;height:auto;box-shadow:10px 5px 5px var(--dark);background-color:var(--light);border-width:1px;border-radius:5px;flex:0 0 300px;margin:20px 40px;padding:10px;display:flex}.card div{flex-direction:column;align-items:center;display:flex}.title{text-align:center;width:200px}.card p{color:var(--dark);justify-content:center;margin:20px}.card img{background-color:var(--light);border:5px solid var(--light);width:140px;height:140px;margin:0;position:relative;top:auto}.card button{color:var(--dark);background-color:var(--green);border:none;border-radius:10px;height:auto;padding:10px}#contact-div{margin:20px}#contactme{background-color:var(--green);flex-direction:column;align-items:center;width:100%;margin-bottom:5vw;padding:5vw 0;animation-name:fadein;animation-duration:3s;display:flex}#contactme input,#contactme textarea{background-color:var(--light);color:var(--dark);text-align:center;border:none;width:80vw;margin:10px;padding:10px}#contactme button{background-color:var(--dark);color:var(--light)}#contactme button:hover{color:var(--shadow);border-color:none}#Contact ul{flex-wrap:wrap;justify-content:space-evenly;margin-bottom:60px;display:flex}#Contact ul li{margin:30px}#Contact a{color:var(--light);background-color:var(--dark);border-radius:5px;padding:10px;font-size:20px;text-decoration:none}#resume{background-color:var(--green);flex-flow:wrap;justify-content:space-around;align-items:baseline;width:100%;height:auto;margin:0 0 5vw;padding:0;animation-name:fadein;animation-duration:3s;display:flex}#resume-preview{border:solid 5px var(--light);width:500px;height:600px;box-shadow:10px 5px 5px var(--shadow);margin:20px}iframe{position:absolute;top:0}.download{background-color:var(--dark);color:var(--light);border-radius:10px;margin:10px;padding:15px}.download:hover{color:var(--shadow)}.download:active{color:var(--green)}.resumep{text-align:center;width:80vw}::-webkit-scrollbar{width:20px;height:20px}::-webkit-scrollbar-track{background:var(--light)}::-webkit-scrollbar-thumb{background:var(--green);border:solid var(--light) 5px;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--dark)}@media screen and (width<=800px){.card,#About{width:100%}header{text-align:center;flex-direction:column;align-items:center;margin:0;display:flex}header nav{flex-direction:column}#header-img-container{justify-content:center;width:100%;display:flex}#header-img{width:50%;margin:0;position:relative}section h2{text-align:center}#About aside{align-items:center}}@media screen and (width<=400px){header{width:100vw}div img{width:60vw}#hello{justify-content:flex-start;margin-top:30px;margin-left:0;padding-left:0;font-size:18px}h2{color:var(--green);margin:60px;font-size:25px}.card{flex-flow:column;flex-shrink:2;justify-content:center;align-items:center;width:300px;display:flex}.card h3{margin:10px}.card p{text-align:center;margin:10px}.card button{margin:6px}.card img{width:60vw;height:25vh}}