@keyframes disc-bounce{0%{transform:translateY(0)}90%{transform:translateY(-4em)}to{transform:translateY(-4em)}}@keyframes disc-rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes shadow-grow{0%{scale:3}90%{scale:1}to{scale:1}}*,:before,:after{margin:0;padding:0;color:#fff;box-sizing:border-box}body{margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100vh;background-color:#000;background:url(https://toops61.github.io/Toops-discography/assets/discs_960-Car_QIlm.webp) fixed no-repeat;background-size:cover}@media (orientation: portrait){body{background:url(https://toops61.github.io/Toops-discography/assets/discot_portrait3-C2NAUEB6.webp) fixed no-repeat;background-size:cover}}#root{height:100%;margin:0;padding:0}.App{margin:0;padding:0;min-height:100%;transition:.8s;height:100%;display:flex;justify-content:center;align-items:center;font-size:1.5vw}@media (orientation: portrait){.App{font-size:2vw}}ul,li{list-style-type:none;margin:0;padding:0}a{text-decoration:none}@font-face{font-family:"Font Awesome 6";font-style:normal;font-weight:900;font-display:block;src:url(https://toops61.github.io/Toops-discography/assets/fa-solid-900-BkfGhAqU.woff2) format("woff2"),url(https://toops61.github.io/Toops-discography/assets/fa-solid-900-Dh3uiilt.ttf) format("truetype")}@font-face{font-family:"Font Awesome 6 empty";font-style:normal;font-weight:400;font-display:block;src:url(https://toops61.github.io/Toops-discography/assets/fa-regular-400-BGtFtKtS.woff2) format("woff2"),url(https://toops61.github.io/Toops-discography/assets/fa-regular-400-BE4Mwq0Z.ttf) format("truetype")}@font-face{font-family:"Font Awesome 6 brands";font-style:normal;font-weight:400;font-display:block;src:url(https://toops61.github.io/Toops-discography/assets/fa-brands-400-D71YAK4a.woff2) format("woff2"),url(https://toops61.github.io/Toops-discography/assets/fa-brands-400-DqxoY_6e.ttf) format("truetype")}button{background-color:#000;color:#fff;border:solid;border-radius:1em;padding:.5em 1em;font-size:1em}.back{z-index:5;position:absolute;top:.5em;left:.5em}.back:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:2em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.back.hide{display:none}.arrow-up{cursor:pointer;position:absolute;right:1vw;height:100%;display:flex;justify-content:center;align-items:center}.arrow-up:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.pages-updown{display:flex;justify-content:center;align-items:center;border:none;padding:0 .5em}.pages-updown:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.pages-updown.up:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.modify-disc{position:relative;display:flex;align-items:center}.modify-disc:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.modify-disc:hover .disc-label{opacity:1;z-index:50}.show-disc{cursor:pointer;display:flex;align-items:center;position:relative;margin-right:1em}.show-disc:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.show-disc:hover .disc-label{opacity:1;z-index:50}.close-disc{cursor:pointer;position:absolute;display:flex;justify-content:center;align-items:center;top:2em;right:2em;color:#fff;border:solid .2em;border-radius:50%;width:2em;height:2em;font-weight:700}.modify-icon{position:absolute;top:-.5em;left:-.5em}.modify-icon:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1.5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.delete-icon{position:absolute;top:-.5em;right:-.5em;background-color:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center}.delete-icon:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1.5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;color:#af0000}.alert-window{position:fixed;left:0;top:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:10;width:100vw;height:100vh;background-color:#000}.alert-message-container{border:solid #fff;border-radius:2em;width:80%;height:60%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2em}.alert-message-container p{font-size:3em}.alert-message-container .valid:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;color:#19ad19}.alert-message-container .error:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;color:#c00e0e}.alert-message-container .modify:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;color:#f48713}.disc-full{z-index:99;position:absolute;width:100%;height:100%;background-color:#000;display:flex;align-items:center;justify-content:space-around}.cover{width:25em;height:25em;position:relative;transition:.5s;transform-style:preserve-3d}.cover.flip{transform:rotateY(180deg)}.cover-back,.cover-front{position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden}.cover-previous{cursor:pointer}.cover-previous:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.cover-next{cursor:pointer}.cover-next:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:5em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.unclick{opacity:0}.cover-front img{width:100%;height:100%;object-fit:contain}.cover-back{transform:rotateY(180deg);border:solid .2em;padding:1em}.cover-back p{font-size:2em;margin-bottom:.5em}.loader{z-index:50;position:fixed;left:0;top:0;width:100vw;height:100vh;background-color:#000;display:flex;justify-content:center;align-items:center}.loader__disc-container{display:flex;flex-direction:column;align-items:center}.loader__disc{animation:disc-rotate .8s linear infinite}.loader__disc:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:3em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1;color:#fff}.loader__disc-inside{animation:disc-bounce .8s ease-out infinite alternate;margin:0 .5em}.loader .disc-shadow{height:.1em;width:.4em;border-radius:50%;background-color:#fff;animation:shadow-grow .8s ease-out infinite alternate;filter:blur(.05em)}.loader__disc-container:nth-child(2) .loader__disc-inside,.loader__disc-container:nth-child(2) .disc-shadow{animation-delay:.2s}.loader__disc-container:nth-child(3) .loader__disc-inside,.loader__disc-container:nth-child(3) .disc-shadow{animation-delay:.4s}.menu-container nav{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.menu-container nav ul{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.menu-container nav ul li{font-size:3em}.menu-container nav ul a{margin:1em 3em}.forms-container{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;width:80%}.forms-container label{margin-right:.3em;white-space:nowrap}.forms-container .filter-field{margin-right:1em;display:flex;align-items:center}.forms-container .input-container{position:relative;display:flex;align-items:center;font-size:.8em;min-width:3em;max-width:20em;padding:.1em .5em}.forms-container .input-container span{opacity:0;white-space:nowrap}.forms-container .input-container input{position:absolute;left:0;top:0;width:100%;border:none;outline:none}.forms-container .input-container input,.forms-container .input-container span{font-size:inherit;line-height:inherit;padding:inherit}.forms-container select{font-size:.8em}@media (orientation: portrait){.forms-container{font-size:1.8em;margin-top:2em}}input{color:#000}select{color:#000;cursor:pointer}.filter-nav{display:flex;align-items:center;margin-top:.5em}.filter-selected{display:flex;justify-content:center;align-items:center}.footer-marge{position:relative;width:100%;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:.5em 0 .5em 1em}.footer-marge .page-displayed{display:flex;align-items:center;flex-wrap:wrap;margin-right:4vw}.footer-marge .page-displayed p{cursor:pointer;margin:0 .5vw}.footer-marge .page-displayed .dots{cursor:default}.footer-marge .pages-container,.footer-marge .pages-updown-container{display:flex;align-items:center}.footer-marge #select-page{margin:0 1em 0 .5em}.footer-marge .page-selected{background-color:#fff;color:#000;font-weight:700;width:1.2em;height:1.2em;border-radius:50%;display:flex;justify-content:center;align-items:center}@media (orientation: portrait){.footer-marge{font-size:1.8em;flex-direction:column;align-items:flex-start}.footer-marge .legend{margin-bottom:1em}.footer-marge .page-displayed{width:94%;justify-content:space-between}}.menu-container{width:60%;height:50%;background-color:#000;border:solid;border-radius:1em}.menu-container .connect-page{position:absolute;top:.5em;right:.5em;font-size:.6em}.menu-container .connect-page p{font-size:3em;margin:.3em;cursor:pointer}@media (orientation: portrait){.menu-container{width:90%;font-size:2em}.menu-container ul{flex-direction:column}}.form-page{position:relative;width:80%;background-color:#000;border:solid;border-radius:1em;display:flex;flex-direction:column;align-items:center}.form-page h1{font-size:2em;margin:.5em 0}.form-page .nav-pages{position:absolute;top:.5em;right:.5em;display:flex;justify-content:center;align-items:center}.form-page .discs{font-size:1.5em;margin:0 .5em}.form-page form{display:flex;flex-direction:column;align-items:center;width:100%;margin-bottom:2em}.form-page .disc-inputs{width:90%;display:flex;justify-content:space-between;margin-bottom:.5em;align-items:flex-end}.form-page .disc-inputs.checkbox{justify-content:flex-start;align-items:center}.form-page .disc-inputs.checkbox input{width:initial}.form-page .disc-inputs.discog{justify-content:flex-start}.form-page .disc-inputs.discog input{min-width:20%;width:fit-content}.form-page .disc-inputs.discog .valid-arrow{margin:0 1em;display:flex;justify-content:center;align-items:center}.form-page .disc-inputs.discog .valid-arrow:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:2em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.form-page label{margin-right:.5em;font-size:1.4em}.form-page input,.form-page select{width:90%;color:#000;padding:.1em .2em;font-size:1.2em}.form-page .buttons-container{margin-top:1em;display:flex}.form-page .buttons-container button{margin:0 .5em}.disco-main{position:relative;width:95%;height:90%;background-color:#000;border:solid;border-radius:1em;display:flex;flex-direction:column;align-items:center;overflow:hidden}.disco-main .total-filtered{position:absolute;left:1vw;top:2em}.disco-main .new-disc{position:absolute;top:.5em;right:.5em;font-size:1.5em}.disco-main .title-container{width:100%;display:flex;justify-content:center;align-items:center;position:relative}.disco-main h1{margin:.5em 0;font-size:2em}.disco-main .max{position:absolute;right:2vw}.disco-main .discs-container{width:95%;flex:1;display:flex;flex-direction:column;align-items:center;overflow:hidden}.disco-main tbody,.disco-main tr,.disco-main thead{width:99%}.disco-main tbody{margin-top:.5em;overflow:auto;display:flex;flex-direction:column}.disco-main tr{display:flex;align-items:center;justify-content:flex-end;position:relative}.disco-main th{font-size:1.1em;display:flex;justify-content:center;align-items:center;cursor:pointer}.disco-main .selected{margin-left:.5em}.disco-main .selected.hide{display:none}.disco-main .selected.up:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.disco-main .selected.down:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:1em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.disco-main td{display:flex;justify-content:center;align-items:center;margin:.2em 0;font-size:1.2em;overflow:hidden}.disco-main td p{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.disco-main .light-row{background-color:#292929}.disco-main .album-column,.disco-main .artist-column{width:26vw}.disco-main .artist-column{margin:0 1em 0 3.5em}.disco-main .year-column{width:8vw}.disco-main .genre-column{width:10vw}.disco-main .format-column{width:9vw}.disco-main .disc-actions{display:flex;position:absolute;left:0;overflow:initial}.disco-main .collector{position:absolute;font-size:2em;right:0}.disco-main .disc-label{z-index:-1;position:absolute;background-color:#fff;color:#000;right:-4em;font-size:.6em;opacity:0;transition:opacity .8s;padding:.2em;border-radius:.2em}.disco-main .hide{display:none}.wantlist-main{width:90%;height:90%;background-color:#000;color:#fff;display:flex;flex-direction:column;align-items:center;overflow-y:scroll}.wantlist-main h1{margin:1em 0}.wantlist-main .categorie{margin:1em 2em;display:flex;flex-direction:column;align-items:center}.wantlist-main .image-discs{width:10em;height:10em;cursor:pointer}.wantlist-main .image-discs img{width:100%;height:100%;object-fit:contain}.wantlist-main .categories-container{display:flex;flex-wrap:wrap;justify-content:center}.wantlist-main .shown-discs{display:flex;flex-wrap:wrap;align-items:center;position:relative;justify-content:center}.wantlist-main .disc-container{position:relative;display:flex;flex-direction:column;align-items:center;margin:1em;width:12em;min-height:15em;border:solid .1em;border-radius:1em;padding:1em}.wantlist-main .disc-container p{font-size:1em}.wantlist-main .cover-container{width:10em;height:10em;display:flex;justify-content:center;align-items:center}.wantlist-main .cover-container img{width:100%;height:100%;object-fit:contain}.wantlist-main .close-window{position:absolute;right:1em;top:-3em;display:flex;justify-content:center;align-items:center;padding:0;border:none}.wantlist-main .close-window:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:2em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.wantlist-main .links-container{display:flex;justify-content:center;align-items:center}.wantlist-main .add-new,.wantlist-main .disco-link{border:solid .2em;padding:.5em;margin:1em;border-radius:.5em}.wantlist-main .add-new p,.wantlist-main .disco-link p{font-size:1.5em}.wantlist-main .arrow-up{position:fixed;bottom:.5em;right:.5em;display:flex;justify-content:center;align-items:center}.wantlist-main .arrow-up:before{content:"";font-family:"Font Awesome 6";font-weight:900;font-size:2em;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}@media (orientation: portrait){.wantlist-main{font-size:3em}.wantlist-main .close-window{right:1em}.wantlist-main .arrow-up{bottom:3em;right:2em}}.connect-container{background-color:#000;padding:2em;border:solid;border-radius:1em;display:flex;flex-direction:column;align-items:center}.connect-container .user-inputs{margin-bottom:2em;width:50vw;display:flex;justify-content:space-between}.connect-container label{font-size:1.5em}.connect-container input{width:70%;color:#000}.connect-container .buttons-container{width:50%;display:flex;justify-content:space-between}