@import"https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800&display=swap";*{margin:0;padding:0;font-family:Poppins,serif}nav{width:100%;height:40px;display:flex;justify-content:center;align-items:center;background-color:#eeac13;color:#fff;font-size:x-large}.container{width:100%;margin-top:20px}.container .box{width:100%;display:flex;justify-content:center;align-items:center;text-align:left;flex-wrap:wrap}.container .box a{width:30%;margin:10px;cursor:pointer;text-decoration:none;color:#000}.container .box a img{width:100%;height:350px;border-radius:10px;box-shadow:0 0 10px 1px gray}.container .box .categories img:hover{box-shadow:0 0 15px 2px wheat}.project{width:100%}.project .box{width:100%;display:flex;justify-content:center;align-items:center;text-align:left;flex-wrap:wrap}.project .box .pinfo{width:35%;margin:10px;box-shadow:0 0 10px 2px #41413c;border-radius:10px}.project .box .pinfo img{width:100%;border-radius:10px;cursor:pointer;height:250px}.truncated{overflow:hidden;text-overflow:ellipsis;color:#37b8eb;display:-webkit-box}.footer-a{color:#7fffd4}.project .back{margin:20px;display:inline-block;position:relative;width:73px;background-color:#070707}.project .back a{text-decoration:none;background-color:#3e3d3d9c;padding:10px 20px;border-radius:5px;transition:background-color .3s ease;box-shadow:0 2px 4px #0000001a;position:relative;z-index:1}.project .back a:before{content:"";position:absolute;top:50%;left:100%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;box-shadow:0 0 10px #0003;transition:left 1s ease,opacity 2s ease;opacity:0}.project .back a:after{content:"🏃‍♂️";position:absolute;top:50%;left:100%;transform:translateY(-50%);transition:left 2s ease;font-size:24px}.project .back a span{text-align:end}.project .back a span{opacity:0;transition:opacity 1s ease-in-out}.project .back a:hover:before{left:0;opacity:1}.project .back a:hover:after{left:0;transition-delay:.5s}.project .back a:hover span{opacity:1}.footer{background-color:#070707;color:#fff;padding:20px;text-align:center}.footer-logo{display:flex;align-items:center;justify-content:center;margin-bottom:20px}.footer-logo img{width:350px;height:50px;margin-right:10px}.footer-social a{font-size:x-large;color:#fff;margin:0 10px;text-decoration:none}.footer-policy a{color:#fff;margin:0 10px;text-decoration:none}.footer-social a:hover,.footer-policy a:hover{text-decoration:underline}.footer-copyright{margin-top:20px}@media screen and (max-width: 900px){.container .box,.project .box{flex-wrap:nowrap;flex-direction:column;width:100%}.project .box .pinfo,.container .box a{width:80%}}