@import url(https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap);.char,.cont,.tier-container .cont{background-repeat:no-repeat;background-position:center;user-select:none}.char,.firma,.title{font-family:Roboto,sans-serif;font-size:.8rem}.char,.cont,.rot-bt{user-select:none}.firma,.rot-bt:hover,.tier-container .cont:hover{cursor:pointer}:root{--background:#03305e;--border:#5c7292;--foreground:#0a4d8b}body,html{width:100svw;height:100svh;margin:0}.background{background-color:var(--background);width:100%;height:100%;display:flex;justify-content:center;align-items:center}.tier-container{position:absolute;right:2%;bottom:10px;display:flex;flex-direction:row;width:20vw;justify-content:space-between}.tier-container .cont{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:17px;width:80px;background-size:75%}.char,.main{flex-direction:column}.main{background-color:var(--foreground);width:95%;height:90%;border:1px solid var(--border);border-radius:3vh;display:flex;padding:0 10px 10px;gap:10px}.chars,.chars-container{width:100%;display:flex}.search-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}.search-bar>div:hover{transform:scale(90%);cursor:pointer}.chars-container{height:100%;background-color:var(--background);overflow-y:scroll;box-shadow:0 0 0 1px var(--border);border-radius:3vh;padding:1px}.chars-container::-webkit-scrollbar{width:1vw}.chars-container::-webkit-scrollbar-track{background:var(--background)}.chars-container::-webkit-scrollbar-thumb{background-color:var(--foreground);border-radius:3vh;border:3px solid var(--background)}.chars{height:fit-content;grid-template-columns:repeat(auto-fit,90px);padding:10px;gap:20px;margin-left:10px;justify-content:center;flex-wrap:wrap;flex-direction:row}.char{display:flex;align-items:center;color:#fff;height:110px;width:90px;background-size:contain;justify-content:flex-end}.cont{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:130px;width:110px;background-size:75%}#espadachin{background-image:url('../Img/count/Class/Espadachin.png')}#luchador{background-image:url('../Img/count/Class/Luchador.png')}#tirador{background-image:url('../Img/count/Class/Tirador.png')}#especialista{background-image:url('../Img/count/Class/Especialista.png')}#soporte{background-image:url('../Img/count/Class/Soporte.png')}#bruiser{background-image:url('../Img/count/Class/Bruiser.png')}#dps{background-image:url('../Img/count/Class/DPS.png')}#tanque{background-image:url('../Img/count/Class/Tanque.png')}#marine{background-image:url('../Img/count/Class/Marina.png')}#realeza{background-image:url('../Img/count/Class/Realeza.png')}#mugiwara{background-image:url('../Img/count/Class/Mugiwara.png')}#supernova{background-image:url('../Img/count/Class/Supernova.png')}#pelonegro{background-image:url('../Img/count/Hair/PeloNegro.png')}#pelorubio{background-image:url('../Img/count/Hair/PeloRubio.png')}#peloblanco{background-image:url('../Img/count/Hair/PeloBlanco.png')}#pelonaranja{background-image:url('../Img/count/Hair/PeloNaranja.png')}#peloverde{background-image:url('../Img/count/Hair/PeloVerde.png')}#pelorojo{background-image:url('../Img/count/Hair/PeloRojo.gif')}#blackcats{background-image:url('../Img/count/Crew/BlackCats.png')}#buggy{background-image:url('../Img/count/Crew/Buggy.png')}#armada{background-image:url('../Img/count/Crew/Armada.png')}#gyojin{background-image:url('../Img/count/Crew/Gyojin.png')}.title{color:#fff;margin:0;width:75px;text-align:center}.firma{position:fixed;color:#eb2929;bottom:0;width:5%;left:47%;text-align-last:center;font-weight:bolder}.rot-bt{position:absolute;left:0;top:.3%;margin:1.2%;background-color:#03305e;height:40px;width:40px;display:flex;align-items:center;justify-content:center;filter:brightness(1.2);border:2px solid #5c7292;border-radius:100%;flex-direction:column}.rot-bt span{font-weight:200;font-style:normal;font-size:207%;opacity:90%}.rot-bt:hover{filter:brightness(2)}.bordeCont{border:1px solid #fff;border-radius:1vw;background-color:#0d66b9}@media screen and (max-width:1366px){.cont{height:100px;width:84.62px}.tier-container{right:9%}}@media (max-width:768px){.firma,.main,.tier-container{position:absolute}.chars,.main{display:flex}.main{width:100%;height:95%;border:1px solid var(--border);border-radius:unset;flex-direction:column;padding:unset;padding-top:unset;gap:10px;top:0}.rot-bt{z-index:7;left:0;top:0}.search-bar{margin-top:11%}.cont{background-size:50%;height:10vh;width:17%;margin-top:-6%}.chars{padding:10px;margin-left:1px;width:100%;height:fit-content;grid-template-columns:repeat(auto-fit,90px);gap:5px;justify-content:center;flex-wrap:wrap;flex-direction:row}.char,.title{width:60px}.char{height:104px}.chars-container{padding:unset;border-radius:2vh}.chars-container::-webkit-scrollbar{width:inherit}.firma{color:#eb2929;font-family:Roboto,sans-serif;bottom:0;width:5%;left:4%;text-align-last:center;font-size:.8rem;font-weight:bolder;cursor:pointer}.tier-container{right:57%;bottom:-3.5%;display:flex;flex-direction:row;width:20vw;justify-content:space-between}body,html{height:100.3svh}}@media only screen and (min-width:1280px) and (max-width:1280px) and (min-height:1024px) and (max-height:1024px){.tier-container{right:13%;bottom:1.4%}}@media (min-width:2560px){.firma,.title{font-family:Roboto,sans-serif}.rot-bt span{font-size:2.5vw}.rot-bt{height:110px;width:110px}.cont{display:flex;flex-direction:column;align-items:center;background-repeat:no-repeat;background-position:center;justify-content:flex-end;user-select:none;height:250px;width:200px}.title{color:#fff;font-size:.75vw;margin:0;width:6vw;text-align:center}.char{height:280px;width:230px}.firma{position:fixed;color:#eb2929;bottom:0;width:5%;left:47%;text-align-last:center;font-size:.9vw;font-weight:900;cursor:pointer}.tier-container{position:absolute;right:3%;bottom:30px;display:flex;flex-direction:row;width:25vw;justify-content:space-between}.tier-container div p{font-size:.85vw}.tier-container .cont{height:45px;width:170px}}