#viewer{background:#fff;height:720px;position:relative;width:1240px}.layer{background-position:50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;position:absolute;top:0;width:100%}#controls{display:flex;gap:20px;justify-content:space-between;margin-bottom:20px}@media (max-width:1024px){#viewer{height:480px;width:100%}#controls{align-items:center;flex-direction:column;gap:10px}}@media (max-width:768px){#viewer{height:360px;width:100%}#controls{align-items:center;flex-direction:column;gap:10px}.layer{background-position:50%;background-repeat:no-repeat;background-size:contain}}.dropdown-menu{background-color:#fff;border-radius:.5rem;box-shadow:0 2px 10px rgba(0,0,0,.2);left:0;position:absolute;top:100%;z-index:100}.menu-button{background-color:#374151;color:#fff;font-weight:700}.menu-button,.menu-item{border-radius:.5rem;height:50px;width:192px}.menu-item{align-items:center;display:flex;justify-content:center;margin:2px;overflow:hidden;position:relative}.menu-item-bg{background-position:50%;background-size:cover;inset:0;position:absolute;z-index:1}.menu-item-gradient{border:2px solid #686e79;border-radius:.5rem;justify-items:center;z-index:2}.menu-item-gradient,.menu-item-overlay{inset:0;pointer-events:none;position:absolute}.menu-item-overlay{background-color:#000;border-radius:.5rem;opacity:0;transition:opacity .3s;z-index:3}.menu-item:hover .menu-item-overlay{opacity:.5}.menu-item-text{color:#fff;padding:0;position:relative;z-index:4}