*{margin:0;padding:0;box-sizing:border-box;font-family:lucida sans,lucida sans regular,lucida grande,lucida sans unicode,Geneva,Verdana,sans-serif}html{scroll-behavior:smooth}body{background:var(--bg-color)}.single-main{padding:50px;justify-content:center;align-items:center}header{position:sticky;top:0;z-index:1}div.nav{display:flex;flex-direction:row;justify-content:space-between;align-items:center;background:#000;height:100px;border-bottom:solid 6px #ffd046;position:sticky;top:0%;z-index:3}#hamburger{color:#fff;font-size:2rem;font-weight:800;padding:30px;display:none}#nav-items{color:#fff;display:flex;flex-direction:row;justify-content:center;align-items:center}#nav-items li{list-style:none;padding-left:50px;padding-right:40px;line-height:50px;text-transform:uppercase;font-weight:600;letter-spacing:1px}#nav-items li a{font-size:1.1rem;text-transform:uppercase;text-decoration:none;color:#fff}.hero{background-image:url(sunset2.jpeg);height:90vh;background-size:cover;z-index:-2}.hero .overlay{background:#b69637;width:100%;height:100%;opacity:.4;z-index:-2}.hero-text{position:absolute;margin:0;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;padding:5px;display:inline-block}.hero-text p{color:#38372b;font-size:1rem;padding-bottom:10px;z-index:1}.hero-text h1{color:#000;font-size:3rem;margin-bottom:20px}.hero-text .button a{text-decoration:none;text-transform:uppercase;margin:16px}.hero-text .button a.about-button{color:#000;font-weight:550;padding:1rem 1.8rem;border:2px solid #ffd046;border-radius:3px}.hero-text .button a.about-button:hover{background:#ffd046;border-radius:50px;transition:1.3s}.hero-text .button a.contact-button{color:#000;font-weight:550;padding:1rem 1.8rem;border:2px solid #ffd046;border-radius:3px}.hero-text .button a.contact-button:hover{background:#ffd046;border-radius:50px;transition:1.3s}#aboutme{display:flex;flex-direction:column;min-height:105vh;padding-top:80px;background-color:#0d0e0d;color:#f7f6f6}#aboutme h3{margin-top:10px;margin-bottom:10px;padding:10px;text-align:center;border-top:6px solid #ffd046;font-size:larger}.aboutme{display:flex;flex-direction:row;margin:20px;padding-left:20px;letter-spacing:1.5;color:#fff}.myportrait{max-width:780;height:auto;padding:20px;border-radius:300px}.aboutme p{padding-bottom:10px}.home-summary{color:#7a7575;padding-left:20px}footer{min-height:30vh;background:#000;color:#fff;text-align:center}footer h2{padding:20px}footer p{padding-bottom:40px}ion-icon{color:#fff;width:50px}.icons a{text-decoration:none;color:#fff;padding:18px;padding-left:2px}.icons a:hover{background-color:#ffd046;border-radius:50px;transition:1s}.errorpage{background-color:#0d0e0d;width:100%;height:100vh}.errorcontent{position:relative;top:100px;left:10px}h4{padding-top:10px;padding-bottom:10px}.list-content{padding:20px}.list-background{background:#fff9e5;margin:0}.list-background h2,h4{text-shadow:2px 2px 5px #91908c}.list-content ul{margin:10px;padding:10px}.list-content ul li{list-style-type:none;margin-right:10px;padding-bottom:10px}.list-content ul li a{text-decoration:none;padding:10px}.list-content ul li a:hover{text-decoration:underline}.timeline-body{display:flex;flex-direction:row;justify-content:center}.portfolio-section{position:relative;margin:20px;padding-top:20px}.portfolio-section h2{margin-bottom:60px}.timeline-marker-div{border-left:2px solid #000}.portfolio-section ul li{list-style-type:none}.portfolio-section ul li div a{display:flex;flex-direction:column}.portfolio-section #education{flex-grow:1}.portfolio-section #experience{flex-grow:1}.summary{margin:20px;margin-bottom:50px;background:#ffffffb3;box-shadow:2px 2px 5px rgba(141,137,137,.6);border-radius:10px;padding:20px;height:fit-content;width:40vw;overflow:hidden}.summary ul li{list-style-type:none;margin-bottom:20px;list-style-position:inside}.summary ul li a{text-decoration:none}.summary:hover{box-shadow:2px 2px 10px rgba(141,137,137,.6);background:#fff}.timeline-dot{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#ffd046;border:2px solid #000;right:calc(100% - 10px);margin-top:50px;z-index:0}#Projects div.list-content{margin:40px;margin-bottom:0;padding:20px;width:auto;justify-content:center;align-items:center}@media screen and (max-width:1000px){.aboutme{display:flex;flex-direction:column}.timeline-body{display:flex;flex-direction:column}.summary{width:82vw}}@media screen and (min-width:771px){div.nav{display:flex;flex-direction:row;justify-content:space-between;align-items:center;background:#000;height:100px;border-bottom:solid 6px #ffd046;position:sticky;top:0%;z-index:3}div.animation{position:absolute;height:100%;top:0;left:0;z-index:-1;background:#ffd046;width:900px;border-top-right-radius:15px;border-top-left-radius:15px;transition:all 1.5s ease .1s}div .start-home{width:760px;left:0}div.nav li:nth-child(1):hover~.animation{width:160px;left:0}div.nav li:nth-child(2):hover~.animation{width:200px;left:158px}div.nav li:nth-child(3):hover~.animation{width:180px;left:378px}div.nav li:nth-child(4):hover~.animation{width:180px;left:572px}}@media screen and (max-width:770px){.hero-text .button a{display:flex;flex-direction:column;left:50px}#nav-items{color:#fff;display:flex;flex-direction:column;text-align:center;width:250px;height:60vh;background:#000;position:fixed;top:70px;left:-250px;z-index:2;transition:1s;opacity:.85}#hamburger{position:absolute;display:initial;cursor:pointer;left:30px}div.nav{border-bottom:solid 0 #ffd046;display:flex;flex-direction:column}#nav-items li{list-style:none;padding-left:50px;padding-right:40px;line-height:50px;text-transform:uppercase;font-weight:600;letter-spacing:1px}#nav-items li:hover{background:#ffd046;width:100%;transition:1.3s}#nav-items li a{font-size:1.1rem;text-transform:uppercase;text-decoration:none;color:#fff}#education div .summary{height:60vh}}@media screen and (max-width:770px){.myportrait{width:520px;padding:0;padding-bottom:20px}}@media screen and (max-width:560px){.myportrait{width:300px;height:auto;padding:0;padding-bottom:20px}.icons{display:flex;flex-direction:column;align-items:center}}@media screen and (max-width:350px){.myportrait{width:200px;height:auto;padding:0;padding-bottom:20px}}.summary{opacity:0;transform:translateY(10%);transition:opacity 1.5s linear,transform 400ms linear}.summary.appear{opacity:1;transform:translateY(0)}