:root{--galleryHeight: 600px;--popupDuration: 2s}body{text-align:center;background-color:#ee6c4d;padding-bottom:200px}.gallery{margin:0 auto;border:2px solid black;border-radius:10px;width:90%;height:var(--galleryHeight);display:flex;align-items:center;overflow-x:auto;background-color:#3d5a80;padding-left:10px;padding-right:10px}.image-container{height:calc(var(--galleryHeight)*.9);min-width:fit-content;max-width:fit-content;border-radius:15px;overflow:hidden;margin-left:20px;background-color:#98c1d9;transition:.1s}.image-name{display:block;width:90%;margin:0 auto;text-align:center;border-radius:10px}img{height:calc(var(--galleryHeight)*.5);border-bottom:3px solid black;transition:.1s}input{outline:none;border:1px solid black;background-color:#7997be}textarea{resize:none;outline:none;width:90%;height:35%;font-size:16px;font-family:Times New Roman;text-align:center;margin-top:10px;border-radius:10px;border:none;background-color:#98c1d9;z-index:2}button{position:relative;border:3px solid black;border-radius:15px;box-shadow:3px 5px #000;width:fit-content;height:fit-content;padding:10px;margin:10px;font-size:24px;transition:.1s}button:hover{border:3px solid gray;box-shadow:3px 5px gray}button:active{transform:translate(3px,5px);box-shadow:0 0}div::-webkit-scrollbar{height:25px}div::-webkit-scrollbar-thumb{background:#293241;border:5px solid #3d5a80;border-radius:15px}.popupText{border:1px solid black;border-radius:10px;position:absolute;top:125%;left:0%;z-index:1;width:calc(100% - 20px);padding:10px;font-size:14px;background-color:#d3d3d3;opacity:0}.popupText-animation{animation:popup var(--popupDuration)}@keyframes popup{0%{opacity:1}80%{opacity:1}to{opacity:0}}.instructions{width:50%;margin:20px auto;font-size:20px}
