@font-face {
  font-family: "Montserrat-Black";
  font-display: swap;
  src: url("./fonts/Montserrat/static/Montserrat-Black.ttf");
}
@font-face {
  font-family: "Montserrat-ExtraBold";
  font-display: swap;
  src: url("./fonts/Montserrat/static/Montserrat-ExtraBold.ttf");
}
@font-face {
  font-family: "Montserrat-Bold";
  font-display: swap;
  src: url("./fonts/Montserrat/static/Montserrat-Bold.ttf");
}
@font-face {
  font-family: "Montserrat-SemiBold";
  font-display: swap;
  src: url("./fonts/Montserrat/static/Montserrat-SemiBold.ttf");
}
@font-face {
  font-family: "Montserrat-Light";
  font-display: swap;
  src: url("./fonts/Montserrat/static/Montserrat-Light.ttf");
}
@font-face {
  font-family: "CrimsonPro-Medium";
  font-display: swap;
  src: url("./fonts/Crimson/static/CrimsonPro-Medium.ttf");
}
/*ANIMATIONS*/
@keyframes pulse-bkg_login {
  from {
    background-size: 150% 150%;
  }
  to {
    background-size: 100% 100%;
  }
}
@keyframes animate_burn {
  0% {
    opacity: 0;
    filter: brightness(1) blur(10px) grayscale(1);
  }
  90% {
    opacity: 1;
    filter: brightness(5) blur(0px) grayscale(0);
  }
  100% {
    filter: brightness(1);
  }
  /*70% {
        filter: brightness(1)
    }

    90% {
        opacity: 1;
        filter: brightness(5) blur(0) grayscale(0);
    }

    100% {
        filter: brightness(1)
    }*/
}
.animate_burn {
  animation: animate_burn 1s ease-in-out forwards;
}

.animate_burn {
  animation: animate_burn 1s ease-in-out forwards;
}

#fase_select-player {
  background-image: url("../img/fs/bkg.webp");
  background-size: cover;
}
#fase_select-player #logo {
  position: absolute;
  max-width: 8%;
  left: 2%;
  top: 2%;
}
#fase_select-player #wrap_avatars_left {
  position: absolute;
  left: 15%;
  width: 25%;
  top: calc(50% + 1vh);
  transform: translateY(-50%);
}
#fase_select-player #wrap_avatars_left .wrap_avatar:nth-child(even) {
  margin: 2.4vh 15% 2.4vh 5%;
}
#fase_select-player #wrap_avatars_left .wrap_avatar:nth-child(odd) {
  margin: 2.4vh 5% 2.4vh 15%;
}
#fase_select-player #wrap_avatars_right {
  position: absolute;
  right: 15%;
  width: 25%;
  top: calc(50% + 1vh);
  transform: translateY(-50%);
}
#fase_select-player #wrap_avatars_right .wrap_avatar:nth-child(even) {
  margin: 2.4vh 15% 2.4vh 5%;
}
#fase_select-player #wrap_avatars_right .wrap_avatar:nth-child(odd) {
  margin: 2.4vh 5% 2.4vh 15%;
}
#fase_select-player .wrap_avatar {
  position: relative;
  width: 30%;
  height: 30%;
  float: left;
}
#fase_select-player .wrap_avatar .wrap_avatar_circle {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  z-index: 3;
}
#fase_select-player .wrap_avatar .wrap_tv {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  padding: 0.75vw;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}
#fase_select-player .wrap_avatar .wrap_avatar_img {
  position: relative;
  width: 100%;
  padding: 0.75vw;
  top: -0.25vw;
  left: -0.25vw;
  z-index: 2;
  filter: grayscale(0.7);
  transition: filter 0.2s ease-in-out;
}
#fase_select-player .wrap_avatar:not(.disabled) .wrap_avatar_circle {
  cursor: url("../img/general/cursors/cursor_pointer.webp") 16 5, pointer;
}
#fase_select-player .wrap_avatar.active .wrap_avatar_img {
  filter: grayscale(0);
}
#fase_select-player .wrap_avatar.disabled .wrap_avatar_img {
  filter: grayscale(1) blur(3px) brightness(0.3);
}
#fase_select-player #wrap_player_img {
  width: 20vw;
  height: 26.0141176vw;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#fase_select-player #wrap_player_img #wrap_player_name {
  font-size: 1.5vw;
  top: -2.5vw;
  font-family: "Montserrat-ExtraBold", Arial;
  color: #000;
  opacity: 0.8;
  position: relative;
}
#fase_select-player #wrap_player_img #wrap_player_place {
  position: absolute;
  width: 100%;
  font-size: 1.5vw;
  text-align: center;
  left: 0;
  bottom: -2.5vw;
  font-family: "Montserrat-ExtraBold", Arial;
  color: #000;
  opacity: 0.8;
}
#fase_select-player #wrap_player_img #wrap_border {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}
#fase_select-player #wrap_player_img #wrap_tv,
#fase_select-player #wrap_player_img .wrap_avatar_big {
  position: absolute;
  width: calc(100% - 2vw);
  height: calc(100% - 2vw);
  top: 1vw;
  left: 1vw;
  z-index: 2;
}
#fase_select-player #wrap_player_img .wrap_avatar_big {
  opacity: 0;
  transition: 0.75s;
}
#fase_select-player #wrap_player_img .wrap_avatar_big.active {
  opacity: 1;
}
#fase_select-player h1 {
  position: absolute;
  left: 50%;
  bottom: 7.5%;
  transform: translateX(-50%);
  font-size: 2.5vw;
  font-family: "Montserrat-ExtraBold", Arial;
  color: #000;
  opacity: 0.8;
}
#fase_select-player #next {
  display: none;
  position: absolute;
  left: 50%;
  bottom: 5%;
  transform: translateX(-50%);
}

/*# sourceMappingURL=fase_select-player.css.map */
