@import "https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&family=Fuzzy+Bubbles:wght@400;700&family=Jolly+Lodger&family=Luckiest+Guy&display=swap";
.container{background-image:url(/portfoilio/public/images/homepagestarted.png);background-position:50%;background-size:cover;width:100vw;height:100vh;position:relative;overflow:hidden}.title{-webkit-text-stroke:4px #b05e27;color:#faec00;letter-spacing:3px;opacity:0;z-index:10;font-family:Cherry Bomb One,system-ui;font-size:160px;animation:1.5s ease-out forwards fadeIn,4s ease-in-out infinite float;position:absolute;top:10px;left:780px;transform:translate(-50%)}.title.from-duck{left:280px}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}@keyframes float{0%{transform:translate(-50%)}50%{transform:translate(-50%,-6px)}to{transform:translate(-50%)}}.frog{z-index:5;width:25%;position:absolute;top:220px;left:38%}.koi{z-index:4;width:7%;position:absolute;bottom:15px;left:500px}.swan{z-index:3;width:25%;position:absolute;bottom:65px;right:300px}@media (max-width:1200px){.title{-webkit-text-stroke:3.5px #b05e27;font-size:135px;top:25px}.title.from-duck{left:240px}.frog{width:30%;top:240px;left:36%}.koi{width:8.5%;left:380px}.swan{width:28%;right:220px}}@media (max-width:1278px){.title{-webkit-text-stroke:3px #b05e27;font-size:120px;top:20px}.title.from-duck{left:220px}.frog{width:32%;top:250px;left:35%}.koi{width:10%;left:200px}.swan{width:30%;right:100px}}@keyframes swanFloat{0%{transform:translate(0)}50%{transform:translate(-10px,-4px)}to{transform:translate(0)}}@media (max-width:1024px){.title{font-size:110px;top:40px}.title.from-duck{left:200px}.frog{width:35%;top:260px;left:32%}.koi{width:10%;left:200px}.swan{width:30%;right:100px}}@media (max-width:768px){.title{-webkit-text-stroke:2px #b05e27;text-align:center;font-size:70px;top:30px;transform:translate(-50%);left:50%!important}.title.from-duck{left:50%!important}.frog{width:45%;top:250px;left:50%;transform:translate(-50%)}.koi{width:14%;bottom:10px;left:20px}.swan{width:40%;bottom:40px;right:20px}}@media (max-width:480px){.title{letter-spacing:1px;font-size:52px;top:20px}.frog{width:55%;top:360px}.koi{width:18%}.swan{width:50%}}