@keyframes fade-in-from-left{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes fade-in-from-right{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes fade-in-from-top{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-from-top{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes right-inclide-down{0%{opacity:1;transform-origin:0 0;transform:rotate(0)}to{opacity:1;transform-origin:0 0;transform:translateY(3px)translate(1px)rotate(45deg)}}@keyframes right-inclide-down-reverse{0%{opacity:1;transform-origin:0 0;transform:translateY(3px)rotate(45deg)}to{opacity:1;transform-origin:0 0;transform:rotate(0)}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes right-inclide-up{0%{opacity:1;transform-origin:0 0;transform:rotate(0)}to{opacity:1;transform-origin:0 0;transform:translateY(5px)translate(-1px)rotate(-45deg)}}@keyframes right-inclide-up-reverse{0%{opacity:1;transform-origin:0 0;transform:translateY(5px)translate(-1px)rotate(-45deg)}to{opacity:1;transform-origin:0 0;transform:rotate(0)}}@media screen and (max-width:767px){.about{flex-direction:column;justify-content:center;align-items:center;width:100%;padding-bottom:50px;display:flex}.about h1{opacity:0;color:#333;justify-content:center;align-items:center;width:100%;height:100px;font-size:3rem;animation:1.5s ease-in-out forwards fade-in-from-top;display:flex}.about .about__profile{flex-direction:column;align-items:center;padding:0 50px;display:flex}.about .about__profile .about__profile-image-container{opacity:0;opacity:0;width:100%;height:200px;margin:20px 0;animation:1.5s ease-in-out .5s forwards fade-in-from-left;position:relative}.about .about__profile .about__profile-details{opacity:0;flex-direction:column;justify-content:center;animation:1.5s ease-in-out 1s forwards fade-in-from-right;display:flex}.about .about__profile .about__profile-details .about__profile-name{color:#333;font-size:2.5rem}.about .about__profile .about__profile-details .about__profile-title{color:#333;font-size:1.25rem}.about .about__profile .about__profile-details .about__profile-social{flex-direction:row;padding:20px 50px;display:flex}.about .about__profile .about__profile-details .about__profile-social-x,.about .about__profile .about__profile-details .about__profile-social-github{width:100%;height:30px;position:relative}.about .about__profile .about__profile-details .about__profile-bio{color:#333;font-size:1rem}.about .about__profile .about__profile-details .about__profile-resume{color:#333;border:1px solid #333;justify-content:center;align-items:center;margin:20px 70px;font-size:1.25rem;display:flex}}@media screen and (min-width:768px){.about{flex-direction:column;align-items:center;width:100%;padding:0 100px;display:flex}.about h1{opacity:0;color:#333;justify-content:center;align-items:center;height:150px;font-size:4rem;animation:1.5s ease-in-out forwards fade-in-from-top;display:flex}.about .about__profile{grid-template-columns:1fr 1fr;align-items:center;gap:50px;display:grid}.about .about__profile .about__profile-image-container{opacity:0;width:100%;height:300px;animation:1.5s ease-in-out .5s forwards fade-in-from-left;position:relative}.about .about__profile .about__profile-image{justify-content:end;display:flex}.about .about__profile .about__profile-details{opacity:0;flex-direction:column;justify-content:start;gap:20px;animation:1.5s ease-in-out 1s forwards fade-in-from-right;display:flex}.about .about__profile .about__profile-details .about__profile-name{color:#333;font-size:3rem}.about .about__profile .about__profile-details .about__profile-title{color:#333;font-size:1.25rem}.about .about__profile .about__profile-details .about__profile-social{flex-direction:row;display:flex}.about .about__profile .about__profile-details .about__profile-social-x,.about .about__profile .about__profile-details .about__profile-social-github{width:100%;height:50px;position:relative}.about .about__profile .about__profile-details .about__profile-bio{color:#333;font-size:1rem}.about .about__profile .about__profile-details .about__profile-resume{color:#333;border:1px solid #333;justify-content:center;align-items:center;margin:20px 100px;font-size:1.25rem;display:flex}.about .about__profile .about__profile-details .about__profile-resume:hover{color:#fff;background-color:#333;transition:background-color .3s,color .3s}}
