.banner{display:flex;justify-content:center;position:relative;width:100%;height:100vh;padding:0 7%;flex-direction:column}.banner #list_prompt,.banner #name{color:#737373}.banner .name{font-size:clamp(.5rem,10vw,6rem);animation:fade-in-down 1s;animation-fill-mode:forwards;animation-delay:1s;opacity:0}.banner .description{animation:fade-in-down 1s;animation-fill-mode:forwards;animation-delay:1.5s;opacity:0}.banner .loop-prompt{flex:0 1 28%;font-size:clamp(.5rem,8vw,4rem);margin-top:20px;animation:fade-in-down 1s;animation-fill-mode:forwards;animation-delay:2s;opacity:0}@media screen and (max-width: 768px){.banner .loop-prompt{flex:0 1 30%}}@media screen and (max-width: 480px){.banner .loop-prompt{flex:0 1 25%}}.banner span{color:#f2f2f2;font-family:Staatliches,cursive;letter-spacing:.2rem;font-weight:700}.banner p{color:#f2f2f2;margin-top:10px;font-size:24px;max-width:600px}@media screen and (max-width: 768px){.banner p{font-size:20px;max-width:500px}}@media screen and (max-width: 480px){.banner p{font-size:16px;letter-spacing:0rem}}.banner__content{display:flex;flex-direction:column;justify-content:center;height:50vh}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.presentation{display:flex;flex-direction:column;align-items:center}*{box-sizing:border-box;margin:0;padding:0;font-family:IBM Plex Sans,sans-serif}body{position:relative}main{display:flex;flex-direction:column;align-items:center;justify-content:center}.container{display:flex;justify-content:center;width:85%;max-width:1100px;margin-top:50px;padding:50px;backdrop-filter:blur(3px);border-radius:20px;box-shadow:0 0 10px #0003;background-color:#f2f2f2}.container:not(:last-child){margin-bottom:100px}.container h1{font-family:Staatliches,cursive;font-size:3rem;color:#0d0d0d;font-size:clamp(.5rem,8vw,3rem)}.container p{margin-top:15px;color:#404040;font-size:22px}@media screen and (max-width: 768px){.container{width:95%;padding:30px}.container p{font-size:19px}}@media screen and (max-width: 480px){.container{width:100%;padding:20px}.container p{font-size:16px;letter-spacing:0rem}}#link{text-decoration:none;font-weight:700;font-size:1.1rem;color:#2540d9;transition:color .15s}#link:hover{color:#8995d9}.projects{display:flex;flex-direction:column;align-items:center;width:100%}.projects__container{display:grid;width:100%;grid-template-columns:repeat(auto-fit,300px);grid-gap:20px;justify-items:center;justify-content:space-evenly}.card{display:grid;grid-template-rows:60% 8% 32%;width:300px;height:300px;margin:10px;border-radius:10px;background-color:#f2f2f2;transition:all .2s ease-in-out}.card:hover{transform:scale(1.05);transition:all .2s ease-in-out;cursor:pointer}.card .card__title{grid-row:2/3;display:flex;justify-content:center}.card .card__title span{font-size:1.3rem;color:#000;font-weight:600}.card .card__description{grid-row:3/4}.card .card__description p{padding:10px;font-size:1rem;color:#000;margin-top:0}.card__img{grid-row:1/2;position:relative}.card__img img{width:300px;height:180px;object-fit:cover;border-radius:10px}.card__img span{position:absolute;bottom:12px;right:12px;color:#f2f2f2;background-color:#0d0d0d80;padding:5px;border-radius:5px;font-size:1rem}.contact{display:flex;justify-content:space-around;width:70%;margin-bottom:100px}.contact a{text-decoration:none}@media screen and (max-width: 768px){.contact{width:100%}}.contact__card{display:grid;width:80px;height:80px;background-color:transparent;border-radius:30px;transition:.2s ease-in-out}.contact__card svg{fill:#f2f2f2;overflow:hidden;position:relative;width:80%;height:80%;justify-self:center;align-self:center}.contact__card:hover{background-color:#f2f2f2}.contact__card:hover svg{fill:#0d0d0d}.experiences{display:flex;flex-direction:column;align-items:center;width:100%}.experiences__container{display:grid;width:100%;grid-auto-rows:auto;grid-gap:20px;margin-top:10px}.experience{display:flex;overflow:hidden;align-items:center;width:100%;font-size:1.5rem}.experience:hover{transform:scale(1.05);transition:all .2s ease-in-out;cursor:pointer}@media (max-width: 768px){.experience{flex-direction:column}}.experience__title{display:flex;align-items:center;font-weight:600;margin-bottom:10px}.experience__text{display:flex;flex-direction:column;margin-left:10px;min-height:180px}.experience__text #name{font-size:1.3rem;font-weight:600}.experience__text #type{font-size:1rem;margin-top:0;font-style:italic}.experience__text #dash{margin:0 5px}.experience__text p{font-size:1rem;margin-top:0}