html,body{height:100%;margin:0;padding:0;box-sizing:border-box}body{background-size:cover;background-repeat:no-repeat;background:#f1f5f9;display:flex;flex-direction:column}#root{flex:1;display:flex;flex-direction:column}#hero{font-weight:lighter;font-style:italic}.underline{text-decoration:underline;transition:transform .3s ease}.underline.prjectmove{transform:translateY(20px)}.anchors{display:flex;justify-content:space-around}h1{font-size:45px;font-family:Edu VIC WA NT Beginner,cursive}#hero{display:flex;justify-content:space-around;align-items:center;margin-bottom:35px;padding:30px 100px}#hero img{width:500px;height:400px;mix-blend-mode:multiply}p{width:300px;margin:20px auto}@media (max-width:839px){#hero{flex-direction:column-reverse}#hero img{width:350px;height:200px;mix-blend-mode:multiply}#hero{justify-content:center;align-items:center}#hero div{text-align:center}}@media (max-width:950px){#hero img{width:400px;height:300px;mix-blend-mode:multiply}#hero{padding:15px 5px}}@media (max-width:763px){#hero{flex-direction:column-reverse}#hero img{width:350px;height:200px;mix-blend-mode:multiply}#hero{justify-content:center;align-items:center}#hero div{text-align:center}}.button{border:none;color:#faf6f6;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;border-radius:1.5em;transition-duration:.2s}.button{background-image:repeating-linear-gradient(-45deg,#000,#2f4f4f);color:#0ff;border:1px solid #0074d9}footer{position:relative;bottom:0;width:100%;height:100px;display:grid;place-items:center;padding-bottom:25px}footer img{max-width:30px;max-height:30px;transform:translateY(-2px);border-radius:5px;transition:all .3s ease;box-shadow:0 2px 4px #0000001a;width:initial;opacity:.9}@media (max-width:270px){footer{position:inherit;flex-direction:column-reverse;width:auto;height:auto;right:fit-content;justify-content:space-between;display:inline-block;box-sizing:border-box}}@media (max-width:325px){footer{display:flex;flex-direction:row;justify-content:center;display:inline-block}footer img{transition:all .3s ease;box-shadow:0 2px 4px #0000001a}footer a{padding:10px}}footer a{padding:20px;font-size:30px;width:50px;text-align:center;text-decoration:none;margin:5px 2px}main{display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:30px}main p{font-size:1.5em;text-align:center;font-family:Cormorant SC,serif;font-family:Edu VIC WA NT Beginner,cursive}.sec{display:flex;flex-wrap:wrap;justify-content:space-around;align-items:stretch;padding:5px;box-sizing:border-box;width:100%;margin:0 auto}.pro img{width:100%;height:auto;display:block;padding-top:1em;object-fit:cover;border-radius:20px}.pro{flex:1 1 300px;max-width:350px;display:flex;flex-direction:column;justify-content:space-between;background-color:#e2e8f0;box-shadow:5px 5px 5px 1px gray;padding:10px;margin:10px;border-radius:1em;text-align:center;box-sizing:border-box;height:auto}.b2{background:brown;border:none;color:#faf6f6;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;width:max-content;border-radius:1em}.pro a,a:hover,a:focus,a:active{text-decoration:none;color:inherit}.sec:hover{transform:translateY(-5px)}.pro h5{color:#003c8a;font-size:1.3em;margin:10px 0}.b2:hover{background:#4e342e}.button-wrapper{display:flex;justify-content:center;margin-top:auto}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:10px;width:100%;max-width:1200px;margin:0 auto}@media (max-width: 1024px){.grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.grid{grid-template-columns:1fr;width:100vw;max-width:100vw;box-sizing:border-box;margin:0!important;padding:10px 0;justify-items:center}.pro{width:100vw!important;max-width:310px;margin:10px auto!important}.description{font-size:1em;word-wrap:break-word;overflow-wrap:break-word;white-space:normal}}@media (max-width: 480px){.pro{width:90%;margin:10px auto}}@media (max-width: 360px){.pro{width:90%;margin:10px auto}.sec p{font-size:.9em;padding:5px}}@media (max-width: 240px){.pro{width:90%}}.tech{font-weight:700;text-align:center;margin:0;padding:10px;border-radius:5px;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;width:100%;box-sizing:border-box}@media (max-width: 576px){.tech{padding:5px;font-size:.9em}}.description{font-size:1em;padding:10px;box-sizing:border-box;text-align:center}.img-skeleton{width:100%;height:140px;background:linear-gradient(90deg,#e0e0e0 25%,#f5f5f5,#e0e0e0 75%);border-radius:8px;animation:skeleton-loading 1.2s infinite linear;margin-bottom:8px;display:block}a{text-decoration:none;color:#07c;transition:all .3s ease}a:hover,a:focus{text-decoration:underline;box-shadow:0 2px 4px #0000001a}header{padding:0;margin:0;background:none}nav{display:flex;justify-content:space-between;align-items:center;padding:0 60px;height:75px;box-sizing:border-box;position:relative}nav img{width:50px;height:50px;mix-blend-mode:multiply}.links{display:flex;gap:30px;align-items:center;margin-left:auto}.links a{font-size:1.3rem;color:#000;padding:10px 14px;text-decoration:none;transition:color .3s ease,background-color .3s ease;border-radius:6px}.links a:hover{background-color:#f2f2f2;color:#07c;text-decoration:none;box-shadow:none}.links a:focus{text-decoration:none;box-shadow:none}.links a.active{color:green;font-weight:600;border-bottom:2px solid green}.sidebar{position:fixed;top:0;left:0;height:100%;width:240px;background-color:#222;transform:translate(-100%);transition:transform .3s ease-in-out;z-index:999;padding-top:60px;display:flex;flex-direction:column}.sidebar.showSidebar{transform:translate(0)}.sidebar a{padding:15px 25px;font-size:1.1rem;color:#fff;text-decoration:none;transition:background .3s}.sidebar a:hover{background-color:green;text-decoration:none;box-shadow:none}.sidebar a:focus{text-decoration:none;box-shadow:none}.sidebar a.active{background-color:green;color:#000}.menu-button{display:none;background-color:green;color:#fff;border:none;padding:10px 18px;font-size:1.1rem;border-radius:6px;cursor:pointer}@media (max-width: 768px){nav{padding:0 20px}.links{display:none}.menu-button{display:block;margin-left:auto}nav img{margin-right:auto}}.resume-buttons{display:flex;gap:15px;margin-top:20px}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid #eee}.close-button{background:none;border:none;font-size:24px;cursor:pointer;padding:5px 10px;color:#666;transition:color .3s ease}.close-button:hover{color:#333}.resume-preview{display:flex;justify-content:center;align-items:center;max-height:80vh;gap:20px;min-height:500px}.resume-preview canvas{max-width:100%;height:auto!important;box-shadow:0 2px 5px #0000001a}.button{padding:12px 24px;font-size:1em;background-color:#007bff;color:#fff;border:none;border-radius:5px;cursor:pointer;min-width:150px}.resume-image{width:auto;max-width:100%;height:auto;max-height:80vh;object-fit:contain;box-shadow:0 2px 5px #0000001a}@media (max-width: 768px){.resume-buttons{flex-direction:column;gap:10px}.resume-buttons .button{width:100%;padding:12px 24px}.resume-image{width:100%;max-height:60vh}.resume-preview{min-height:auto;padding:10px}.react-modal-content{width:95%;max-width:95%;height:auto;max-height:90vh}}.loading{display:flex;justify-content:center;align-items:center;height:100px;font-size:1.2em;color:#666}.page-controls{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:15px}.page-control-button{padding:8px 16px;background-color:#007bff;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.page-control-button:disabled{background-color:#ccc;cursor:not-allowed}.page-control-button:hover:not(:disabled){background-color:#0056b3}.hero-content{max-width:600px;padding:30px}.hero-description{font-size:1.2em;line-height:1.6;margin:20px 0;word-wrap:break-word;overflow-wrap:break-word;max-width:100%}@media (max-width: 768px){.hero-content{padding:15px}.hero-description{font-size:1.1em;line-height:1.5}}.animated-name{position:relative;animation:slideIn 1s ease-out}.name-highlight{background:green;background-clip:text;-webkit-background-clip:text;color:transparent;display:inline-block;position:relative;animation:gradientSlide 3s ease infinite;padding-bottom:4px;padding-right:3px;font-weight:700;text-shadow:2px 2px 4px rgba(0,0,0,.15)}.name-highlight:after{content:"";position:absolute;bottom:1px;left:0;width:100%;height:3px;border-radius:2px;animation:slideIn .8s ease-out .5s both}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes gradientSlide{0%{background-position:0% 50%;opacity:.9}50%{background-position:100% 50%;opacity:1}to{background-position:0% 50%;opacity:.9}}@keyframes underlineSlide{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.animated-name,.name-highlight{will-change:transform;backface-visibility:hidden}.name-highlight:hover{transform:scale(1.05);transition:transform .3s ease}@media (max-width: 768px){.animated-name{font-size:2em}}.about-container{max-width:800px;margin:0 auto;padding:20px;background-color:#f9f9f9;border-radius:10px;box-shadow:0 4px 8px #0000001a;text-align:center;transition:transform .3s ease}.about-container.move{transform:translateY(40px)}.about-container h1{font-size:2.5em;margin-bottom:20px;color:#333}.about-container p{font-size:1.2em;line-height:1.6;color:#666}.about-container h2{font-size:2em;margin-top:30px;color:#333}.skills-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:20px;margin-top:20px}.skill-card{background-color:#fff;border-radius:10px;box-shadow:0 4px 8px #0000001a;padding:20px;width:150px;text-align:center;transition:transform .3s}.skill-card:hover{transform:translateY(-10px)}.skill-icon{font-size:3em;color:#007bff;margin-bottom:10px}.skill-card h3{font-size:1.2em;color:#333}footer{width:100%;height:100px;display:grid;place-items:center;padding-bottom:25px;transition:transform .3s ease}footer.move{transform:translateY(15px)}body{background-size:cover;background-repeat:no-repeat;display:flex;flex-direction:column}.timeline-year{text-align:center;font-weight:700;font-size:1.2em}.timeline-icon{color:#fff;font-weight:700;font-size:.6em;text-align:center;padding-top:23px}@media (max-width: 664px){.timeline-item-content{width:100%;word-wrap:break-word;white-space:normal}.vertical-timeline-element-content>p{width:100%}.timeline-icon{color:#fff;font-weight:700;font-size:.5em;text-align:center;padding-top:15px}}.about-me{text-align:center;margin-bottom:40px}.about-me h2{font-size:2em;margin-bottom:20px}.about-me p{font-size:1.2em;line-height:1.7;width:100%;max-width:900px;box-sizing:border-box;margin:0 auto;text-align:left;padding:0 20px}.vertical-timeline *{box-sizing:border-box}.vertical-timeline{width:95%;max-width:1170px;margin:0 auto;position:relative;padding:2em 0}.vertical-timeline:after{content:"";display:table;clear:both}.vertical-timeline:before{content:"";position:absolute;top:0;left:18px;height:100%;width:4px;background:var(--line-color)}.vertical-timeline.vertical-timeline--one-column-right:before{right:18px;left:unset}@media only screen and (min-width:1170px){.vertical-timeline.vertical-timeline--two-columns{width:90%}.vertical-timeline.vertical-timeline--two-columns:before{left:50%;margin-left:-2px}}.vertical-timeline-element{position:relative;margin:2em 0}.vertical-timeline-element>div{min-height:1px}.vertical-timeline-element:after{content:"";display:table;clear:both}.vertical-timeline-element:first-child{margin-top:0}.vertical-timeline-element:last-child{margin-bottom:0}@media only screen and (min-width:1170px){.vertical-timeline-element{margin:4em 0}.vertical-timeline-element:first-child{margin-top:0}.vertical-timeline-element:last-child{margin-bottom:0}}.vertical-timeline-element-icon{position:absolute;top:0;left:0;width:40px;height:40px;border-radius:50%}.vertical-timeline-element-icon.shadow-size-small{box-shadow:0 0 0 2px #fff,inset 0 1px #00000014,0 2px 0 4px #0000000d}.vertical-timeline-element-icon.shadow-size-medium{box-shadow:0 0 0 3px #fff,inset 0 2px #00000014,0 3px 0 5px #0000000d}.vertical-timeline-element-icon.shadow-size-large{box-shadow:0 0 0 4px #fff,inset 0 2px #00000014,0 4px 0 6px #0000000d}.vertical-timeline--one-column-right .vertical-timeline-element-icon{right:0;left:unset}.vertical-timeline-element-icon svg{display:block;width:24px;height:24px;position:relative;left:50%;top:50%;margin-left:-12px;margin-top:-12px}@media only screen and (min-width:1170px){.vertical-timeline--two-columns .vertical-timeline-element-icon{width:60px;height:60px;left:50%;margin-left:-30px}}.vertical-timeline-element-icon{-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-icon.is-hidden{visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-icon.bounce-in{visibility:visible;-webkit-animation:cd-bounce-1 .6s;-moz-animation:cd-bounce-1 .6s;animation:cd-bounce-1 .6s}@-webkit-keyframes cd-bounce-1{0%{opacity:0;-webkit-transform:scale(.5)}60%{opacity:1;-webkit-transform:scale(1.2)}to{-webkit-transform:scale(1)}}@-moz-keyframes cd-bounce-1{0%{opacity:0;-moz-transform:scale(.5)}60%{opacity:1;-moz-transform:scale(1.2)}to{-moz-transform:scale(1)}}@keyframes cd-bounce-1{0%{opacity:0;-webkit-transform:scale(.5);-moz-transform:scale(.5);-ms-transform:scale(.5);-o-transform:scale(.5);transform:scale(.5)}60%{opacity:1;-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2)}to{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}.vertical-timeline-element-content{position:relative;margin-left:60px;background:#fff;border-radius:.25em;padding:1em;box-shadow:0 3px #ddd}.vertical-timeline--one-column-right .vertical-timeline-element-content{margin-right:60px;margin-left:unset}.vertical-timeline-element--no-children .vertical-timeline-element-content{background:0 0;box-shadow:none}.vertical-timeline-element-content:after{content:"";display:table;clear:both}.vertical-timeline-element-content h2{color:#303e49}.vertical-timeline-element-content .vertical-timeline-element-date,.vertical-timeline-element-content p{font-size:13px;font-size:.8125rem;font-weight:500}.vertical-timeline-element-content .vertical-timeline-element-date{display:inline-block}.vertical-timeline-element-content p{margin:1em 0 0;line-height:1.6}.vertical-timeline-element-title,.vertical-timeline-element-subtitle{margin:0}.vertical-timeline-element-content .vertical-timeline-element-date{float:left;padding:.8em 0;opacity:.7}.vertical-timeline-element-content-arrow{content:"";position:absolute;top:16px;right:100%;height:0;width:0;border:7px solid transparent;border-right:7px solid #fff}.vertical-timeline--one-column-right .vertical-timeline-element-content-arrow{content:"";position:absolute;top:16px;right:unset;left:100%;height:0;width:0;border:7px solid transparent;border-left:7px solid #fff}.vertical-timeline--one-column-right .vertical-timeline-element-content:before{left:100%;border-left:7px solid #fff;border-right:unset}.vertical-timeline-element--no-children .vertical-timeline-element-content:before{display:none}.vertical-timeline-element--no-children .vertical-timeline-element-content-arrow{display:none}@media only screen and (min-width:768px){.vertical-timeline-element-content h2{font-size:20px;font-size:1.25rem}.vertical-timeline-element-content p{font-size:16px;font-size:1rem}.vertical-timeline-element-content .vertical-timeline-element-date{font-size:14px;font-size:.875rem}}@media only screen and (min-width:1170px){.vertical-timeline--two-columns .vertical-timeline-element-content{margin-left:0;padding:1.5em;width:44%}.vertical-timeline--two-columns .vertical-timeline-element-content-arrow{top:24px;left:100%;transform:rotate(180deg)}.vertical-timeline--two-columns .vertical-timeline-element-content .vertical-timeline-element-date{position:absolute;width:100%;left:124%;top:6px;font-size:16px;font-size:1rem}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content{float:right}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content-arrow,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content-arrow{top:24px;left:auto;right:100%;transform:rotate(0)}.vertical-timeline--one-column-right .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content-arrow,.vertical-timeline--one-column-right .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content-arrow{top:24px;left:100%;right:auto;transform:rotate(0)}.vertical-timeline--two-columns .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content .vertical-timeline-element-date,.vertical-timeline--two-columns .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content .vertical-timeline-element-date{left:auto;right:124%;text-align:right}}.vertical-timeline--animate .vertical-timeline-element-content.is-hidden{visibility:hidden}.vertical-timeline--animate .vertical-timeline-element-content.bounce-in{visibility:visible;-webkit-animation:cd-bounce-2 .6s;-moz-animation:cd-bounce-2 .6s;animation:cd-bounce-2 .6s}@media only screen and (min-width:1170px){.vertical-timeline--two-columns.vertical-timeline--animate .vertical-timeline-element.vertical-timeline-element--right .vertical-timeline-element-content.bounce-in,.vertical-timeline--two-columns.vertical-timeline--animate .vertical-timeline-element:nth-child(2n):not(.vertical-timeline-element--left) .vertical-timeline-element-content.bounce-in{-webkit-animation:cd-bounce-2-inverse .6s;-moz-animation:cd-bounce-2-inverse .6s;animation:cd-bounce-2-inverse .6s}}@media only screen and (max-width:1169px){.vertical-timeline--animate .vertical-timeline-element-content.bounce-in{visibility:visible;-webkit-animation:cd-bounce-2-inverse .6s;-moz-animation:cd-bounce-2-inverse .6s;animation:cd-bounce-2-inverse .6s}}@-webkit-keyframes cd-bounce-2{0%{opacity:0;-webkit-transform:translateX(-100px)}60%{opacity:1;-webkit-transform:translateX(20px)}to{-webkit-transform:translateX(0)}}@-moz-keyframes cd-bounce-2{0%{opacity:0;-moz-transform:translateX(-100px)}60%{opacity:1;-moz-transform:translateX(20px)}to{-moz-transform:translateX(0)}}@keyframes cd-bounce-2{0%{opacity:0;-webkit-transform:translateX(-100px);-moz-transform:translateX(-100px);-ms-transform:translateX(-100px);-o-transform:translateX(-100px);transform:translate(-100px)}60%{opacity:1;-webkit-transform:translateX(20px);-moz-transform:translateX(20px);-ms-transform:translateX(20px);-o-transform:translateX(20px);transform:translate(20px)}to{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translate(0)}}@-webkit-keyframes cd-bounce-2-inverse{0%{opacity:0;-webkit-transform:translateX(100px)}60%{opacity:1;-webkit-transform:translateX(-20px)}to{-webkit-transform:translateX(0)}}@-moz-keyframes cd-bounce-2-inverse{0%{opacity:0;-moz-transform:translateX(100px)}60%{opacity:1;-moz-transform:translateX(-20px)}to{-moz-transform:translateX(0)}}@keyframes cd-bounce-2-inverse{0%{opacity:0;-webkit-transform:translateX(100px);-moz-transform:translateX(100px);-ms-transform:translateX(100px);-o-transform:translateX(100px);transform:translate(100px)}60%{opacity:1;-webkit-transform:translateX(-20px);-moz-transform:translateX(-20px);-ms-transform:translateX(-20px);-o-transform:translateX(-20px);transform:translate(-20px)}to{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translate(0)}}body,#root{background-size:cover;background-repeat:no-repeat}