:root{--primary-bg-color: #d5cca4;--text-color: #252525;--secondary-text-color: grey;--hover-color: #fdfdfd;--hover-bg-color: black;--link-color: lightgrey}body{background-color:var(--primary-bg-color);font-family:sans-serif;margin:0;padding:0}#mainBody{height:100vh;width:100vw;display:flex;justify-content:center}.homepage{display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:40px}.homepage svg{width:45vw;min-width:380px;max-width:700px;height:auto}.homepage a{z-index:2}.homepage a img{width:45vw;min-width:380px;max-width:700px}.aboutContainer{display:flex;flex-direction:column;justify-content:center;margin-top:min(25vw,180px);gap:25px;padding:30px;background-color:#fff;border:3px solid rgba(0,0,0,.8);border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);width:min(70vw,700px);height:auto}header{position:fixed;top:0;display:flex;justify-content:space-between;width:100%;z-index:0}header a{color:var(--text-color);text-decoration:none}.site-name{color:var(--text-color);font-family:Helvetica;font-size:min(7vw,70px);font-weight:700;margin:20px 30px;width:50vw;max-width:400px}.nav-link-container{color:var(--text-color);display:flex;flex-direction:column;align-items:flex-end;justify-content:center;font-size:min(4vw,40px);gap:2px;margin:20px 30px}footer{position:fixed;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;width:100%;z-index:-1}.site-slogan{color:var(--text-color);font-size:12px;text-align:right;margin:10px 30px;width:40vw;max-width:500px;min-width:250px;font-style:italic}@media (max-width: 600px){.site-slogan{display:none}}.copyright-column{color:var(--secondary-text-color);font-size:12px;text-align:left;margin:10px 30px;min-width:250px}#rotatingText{position:fixed;animation-name:rotate-circle;animation-duration:60s;animation-timing-function:linear;animation-iteration-count:infinite}.click-me-text{font-size:26px;letter-spacing:2.4px;font-weight:900;padding-bottom:10px;fill:#5554542d}@keyframes rotate-circle{to{transform:rotate(1turn)}}.coming-soon{font-size:40px;margin-top:380px;gap:20px;padding:50px;background-color:#ffffff4d;border:3px solid rgba(0,0,0,.8);border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);height:40px}.adminPanel{margin-top:200px;width:80%}.submitNewCassette{background:#90ee90;color:#006400;font-size:20px;margin-bottom:10px;padding:10px;border-radius:4px;align-items:center}.deleteButton{background:pink;color:red}.cassetteTable{margin-top:20px}table{width:100%;border-collapse:collapse}th,td{padding:8px;border-bottom:1px solid #ddd}th{background-color:#f2f2f2;text-align:left}.cropContainer{margin:20px;display:flex;flex-direction:column;align-items:start;justify-content:center}.cropper{position:relative;width:25vw;height:400px;display:flex;align-items:flex-end;justify-content:center;border-radius:8px;overflow:hidden;box-shadow:0 10px 9px #00000017}.controls{margin:20px;padding:16;display:flex;z-index:3;flex-direction:column;width:200px}.sliderContainer{display:flex;z-index:3;align-items:center}.croppedImage{height:200px}.addCassetteContainer{display:flex;flex-direction:row;margin-bottom:10px;gap:30px;padding:20px;border-radius:8px;background-color:#fff}.imgPreviewContainer{display:flex;flex-direction:row;justify-content:space-between;margin:20px}.releaseInformation,.input-field{display:flex;flex-direction:column;gap:5px}.tapeShelf{display:flex;flex-direction:row;flex-wrap:wrap;gap:30px;margin-top:225px;width:70vw;padding-bottom:70px}.displayTapeContainer{background:#fff3;border-radius:4px;box-shadow:0 4px 10px #0000004d;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);border:8px solid rgba(255,255,255,.5);transition:transform .3s ease,box-shadow .3s ease}.displayTapeContainer:hover{transform:scale(1.04);box-shadow:0 0 10px #000c}.displaySpine{width:auto;height:500px;border-radius:4px;display:block;cursor:pointer}.detailCassetteView{display:flex;position:fixed;left:50%;transform:translate(-50%,-80px);margin-top:23vh;width:min(600px,80%);background-color:var(--primary-bg-color);border:3px solid rgba(0,0,0,.8);border-radius:20px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);z-index:2;padding:15px 30px;flex-direction:column;justify-content:center;align-items:center;z-index:3}.dimBackground{position:fixed;top:0;left:0;width:100%;height:100%;background:#0006;z-index:2}.tapeInfo{display:flex;flex-direction:column;width:90%}.tapeInfoHead{display:flex;justify-content:center;align-self:center}.tapeInfoTitle{font-weight:700;font-style:italic;font-size:40px;text-align:center}.tapeInfoTitle a{text-decoration:none;color:#000}.tapeInfoArtist{font-size:24px;text-align:center}.tapeInfoSub{width:90%;display:flex;align-self:center;justify-content:center;align-content:center;font-size:16px;margin-top:10px}.detailTerm{letter-spacing:2px;font-size:13px;text-decoration:none;text-transform:uppercase;color:#000;border:3px solid;background-color:#fff;border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);-webkit-user-select:none;padding:5px 10px;margin:5px;font-weight:700;align-content:center;text-align:center}.tapeInfoSub span{display:inline-block;padding:5px 10px;background-color:#333;border-radius:10px;text-align:center;line-height:20px;background-color:#fff;color:var(--text-color);margin-right:5px;margin-left:5px}.detailBlurb{border:3px solid;background-color:#fff;border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;padding:8px 10px;margin-bottom:15px}.editorsNotes{font-style:italic;text-align:center;font-size:13px}.stockNotes{color:var(--secondary-text-color);font-style:italic;font-size:13px;width:360px;text-align:center}.covers{margin:20px;cursor:pointer}.jCard img{height:min(50vh,380px)}.button-54{position:fixed;top:10px;right:15px;font-family:Open Sans,sans-serif;font-size:16px;letter-spacing:2px;text-decoration:none;font-weight:700;text-transform:uppercase;color:#000;cursor:pointer;border:3px solid;border-radius:8px;padding:.25em .5em;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;user-select:none;-webkit-user-select:none;touch-action:manipulation}.detailTape{height:380px;border-radius:4px;box-shadow:0 4px 8px #0003}.cube{transform-style:preserve-3d;width:380px;height:400px;transform:rotate3d(1,1,0,30deg) translate(70px)}.face{border:10px solid rgba(255,255,255,.2);background-color:#fffc;outline:1px solid rgba(0,0,0,.2);outline-offset:0px;border-radius:8px;position:absolute;display:flex;align-items:center;justify-content:center}.front{height:380px;width:245.156px;transform:translateZ(31px)}.left{height:380px;width:49.031px;transform:translate(-30px) rotateY(-90deg)}.bottom{height:48px;width:245px;transform:translateY(363px) rotateX(-90deg);background:linear-gradient(to right,#fffc,#fff3 32%,#fffc 35%,#fff3 36%,#fffc)}.search-container{position:fixed;top:60px;left:50%;transform:translate(-50%,-50%);z-index:3;letter-spacing:2px;text-decoration:none;text-transform:uppercase;color:#000;cursor:pointer;border:3px solid;background-color:#fff;border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);-webkit-user-select:none;touch-action:manipulation;width:310px}.searchText{background-color:#ffffff80;border:0px;text-decoration:none;padding:10px 20px;margin-left:30px;height:40px;width:200px;font-size:30px;font-weight:700;outline:none}.searchButton{position:fixed;border:0;background:none;top:50%;right:10%;transform:translate(50%,-50%);cursor:pointer}.filterList{position:fixed;display:flex;flex-direction:row;top:90%;left:50%;transform:translate(-50%,-50%);z-index:3}.filterTerm{letter-spacing:2px;text-decoration:none;text-transform:uppercase;color:#000;cursor:pointer;border:3px solid;background-color:#fff;border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;user-select:none;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);-webkit-user-select:none;padding:5px 10px;margin:5px;font-weight:700}.clearButton{border:0;background:none;transform:translateY(10%);margin:0;padding-right:0;cursor:pointer}.sort-section{position:fixed;top:15%;left:50%;transform:translate(-50%,-50%);z-index:3}.toggleSortView{position:fixed;border:0;background:none;top:50%;left:9%;transform:translate(-50%,-50%);cursor:pointer}.sortButton{letter-spacing:2px;text-decoration:none;text-transform:uppercase;color:#000;cursor:pointer;border:3px solid;background-color:#fff;border-radius:8px;box-shadow:1px 1px,2px 2px,3px 3px,4px 4px,5px 5px;user-select:none;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);-webkit-user-select:none;padding:5px 10px;margin:5px;font-weight:700}.shopContainer{margin-top:200px;width:70vw}.loading-indicator{display:flex;justify-content:center;align-items:center;height:100vh}.spinner{animation:spin 2s linear infinite;width:300px;height:300px}.path{stroke:#0003;stroke-linecap:round;animation:dash 2s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}