@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Comfortaa:wght@300..700&family=Denk+One&family=Karla:ital,wght@0,200..800;1,200..800&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Bebas Neue,sans-serif}header{height:60px;width:100%;border-bottom:1px solid black;display:flex;align-items:center;padding:0 24px;justify-content:space-between}header .logo_and_name{display:flex;justify-content:center;align-items:center;gap:24px;font-family:Denk One,sans-serif;font-size:20px}header .logo__container{width:50px;height:50px;border-radius:50%;overflow:hidden;border:1px solid black}header .logo__container img{width:100%;display:block;object-fit:cover}header nav ul{font-family:karla,sans-serif;list-style:none;display:flex;gap:8px}header nav ul li{border:2px solid black;background:orange;padding:6px;border-radius:12px;text-transform:uppercase;font-weight:700}.container{width:80%;margin:0 auto;border-left:1px solid black;border-right:1px solid black;background:beige;padding:24px 0}.hero__section{font-size:50px;padding:100px 150px}.hero__section .greeting{display:flex}.hero__section .greeting__location{font-size:16px;width:150px;height:70px;background:#74b9ff;display:flex;justify-content:center;align-items:center;border-radius:8px;margin-left:16px;transform:rotate(5deg);position:relative}.hero__section .greeting__location:before{content:"";left:10px;top:10px;height:10px;width:10px;background:#fff;position:absolute;border-radius:50%}.experience__section{padding-top:12px;text-align:center;margin:48px 0}.experience__section .experience__logos{margin-top:24px;display:flex;justify-content:center;gap:24px}.experience__section .exp__logo__container{width:100px;height:100px;overflow:hidden;border-radius:50%}.experience__section .exp__logo__container img{width:100%;height:100%;object-fit:cover}.skills__section .skills__slider{background:orange;position:relative;border:1px solid;height:56px;overflow:hidden}.skills__section .skill{width:50px;height:50px;position:absolute;top:0;left:100%;animation:scroll-to-left 20s linear infinite}.skills__section .skill-1{animation-delay:-18.3333333333s}.skills__section .skill-2{animation-delay:-16.6666666667s}.skills__section .skill-3{animation-delay:-15s}.skills__section .skill-4{animation-delay:-13.3333333333s}.skills__section .skill-5{animation-delay:-11.6666666667s}.skills__section .skill-6{animation-delay:-10s}.skills__section .skill-7{animation-delay:-8.3333333333s}.skills__section .skill-8{animation-delay:-6.6666666667s}.skills__section .skill-9{animation-delay:-5s}.skills__section .skill-10{animation-delay:-3.3333333333s}.skills__section .skill-11,.skills__section .skill-12{animation-delay:-1.6666666667s}.about__section{display:grid;grid-template-columns:30% 1fr;font-family:karla,sans-serif;font-size:18px;gap:24px}.about__image{overflow:hidden;height:270px}.about__image img{width:100%;object-fit:cover}@keyframes scroll-to-left{0%{left:100%}to{left:-50px}}@media (max-width: 700px){.container{width:95%}header nav{display:none}.hero__section{font-size:20px;padding:100px 20px}.hero__section .greeting__location{font-size:14px}.hero__section .greeting__location:before{top:4px;left:4px}.skills__section .skills__slider{height:34px}.skills__section .skill{width:25px;height:30px}.experience__section{padding-top:12px;text-align:center;margin:48px 0}.experience__section .experience__logos{margin-top:24px;display:flex;justify-content:center;gap:24px}.experience__section .exp__logo__container{width:50px;height:50px;overflow:hidden;border-radius:50%}.experience__section .exp__logo__container img{width:100%;height:100%;object-fit:cover}.about__section{display:grid;grid-template-columns:1fr;padding:8px}}
