@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400&display=swap');* {margin: 0;padding: 0;box-sizing: border-box;}body {display: flex;flex-direction: column;justify-content: center;align-items: center;min-height: 100vh;background: #1a252c;font-family: 'Lato', sans-serif;}.nav-bar {position: fixed;top: 0;left: 0;width: 100%;background: #131313;color: white;padding: 10px;box-shadow: 0 2px 4px rgba(0,0,0,0.5);z-index: 1000;}.nav-toggle {background: none;border: none;color: white;font-size: 24px;cursor: pointer;}.nav-menu {display: none;text-align: center;padding-top: 15px;}.nav-menu a {color: white;text-decoration: none;padding: 10px;display: block;}.nav-menu a:hover {background-color: #555;}.header {color: white;font-size: 24px;font-family: 'Roboto', sans-serif;text-align: center;margin-bottom: 60px;}.container {position: relative;display: flex;justify-content: center;align-items: center;transform-style: preserve-3d;margin-bottom: 20px;}.container .box {position: relative;width: 120px;height: 120px;transition: 0.5s;transform-origin: bottom center;-webkit-box-reflect: below 1px linear-gradient(transparent, #0002);}.container:hover > :not(:hover) {margin: 0 -20px;transform: perspective(500px) rotateY(45deg) scale(.95);filter: drop-shadow(0 0 25px #000) drop-shadow(0 0 45px #000);}.container .box:hover {transform: perspective(500px) rotateY(0deg) scale(1.5);z-index: 1000;}.container .box:hover ~ .box {transform: perspective(500px) rotateY(-45deg) scale(.95);}.container .box img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}footer {width: 100%;text-align: center;}.footer-content {display: flex;justify-content: center;align-items: center;padding: 20px;}.footer-content a {margin: 0 10px;color: white;}.footer-content i {font-size: 24px;}.container .box {background: #ccc;display: flex;justify-content: center;align-items: center;}.container .box img {width: 100%;height: 100%;object-fit: cover;display: block;opacity: 0;transition: opacity 0.5s ease-in-out;}.container .box img.loaded {opacity: 1;}
