@charset "UTF-8";




@font-face {

    font-family: 'Death'; /* Nombre que usar��s para la fuente */

    src: url('/fonts/death.ttf') format('truetype'); /* Ruta al archivo de fuente */

    font-weight: normal; /* Peso de la fuente */

    font-style: normal; /* Estilo de la fuente */

}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'outfit';
    src: url('/fonts/static/Outfit-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}



p, .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{

    margin-bottom:0px;

}





body {

    font-family: 'outfit', sans-serif !important;


}

.fw-extrabold{
    font-weight: 900;
}


.font_death{

    /* font-family: 'Death', sans-serif !important; */

    /* letter-spacing: 7px; */

}



.web_center{

    display: flex;

    justify-content: center;

    align-items: center;

}



.web-center-end{

    display:flex;

    justify-content:end;

    align-items:center;

}





.bg_main{

    background: var(--color_main_1) !important;  

    color:white !important;

}

.bg_main_base{
  background: var(--bg-main) !important;
  color:white !important;

}



.border_main{

  box-shadow: inset 0 0 0 1px var(--color_main_1);

}







.bg_main_3{

  background:linear-gradient(to right, var(--color_main_1), var(--color_main_2)) !important;

}



.bg_main_2{

    background: var(--color_main_2) !important; 

}



.color_main{

    color:var(--color_main_1) !important;

}



.maldad {

  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  animation: glitchEffect 3s infinite;
  opacity: 0;

}



/* @media (max-width: 990px) {



  .maldad{

    width:97% !important;

    object-position : 79.5% 50% !important;

  }

} */



/* Animaci��n de glitch */

@keyframes glitchEffect {

  0% {

    opacity: 0;
    transform: translate(0, 0);

  }

  2.5% {

    opacity: 0;
    transform: translate(5px, -5px) skew(1deg);

  }

  5% {

    opacity: 0;

    transform: translate(-5px, 5px) skew(-1.5deg);

  }

  7.5% {

    opacity: 1;

    transform: translate(3px, -3px) skew(0.5deg);

  }

  10% {

    opacity: 1;

    transform: translate(-3px, 3px) skew(-0.7deg);

  }

  12.5% {

    opacity: 1;

    transform: translate(0, 0);

  }

  15% {

    opacity: 0;

    transform: translate(4px, -4px) skew(1.2deg);

  }

  17.5% {

    opacity: 0;

    transform: translate(-4px, 4px) skew(-1.2deg);

  }

  20% {

    opacity: 0;

    transform: translate(2px, -2px) skew(0.8deg);

  }

  22.5% {

    opacity: 1;

    transform: translate(-2px, 2px) skew(-0.8deg);

  }

  25% {

    opacity: 1;

    transform: translate(0, 0);

  }

  27.5% {

    opacity: 1;

    transform: translate(3px, -3px) skew(0.5deg);

  }

  30% {

    opacity: 0;

    transform: translate(-3px, 3px) skew(-0.5deg);

  }

  32.5% {

    opacity: 1;

    transform: translate(0, 0);

  }

  35% {

    opacity: 1;

    transform: translate(2px, -2px) skew(0.8deg);

  }

  37.5% {

    opacity: 1;

    transform: translate(-2px, 2px) skew(-0.8deg);

  }

  40% {

    opacity: 1;

    transform: translate(0, 0);

  }

  42.5% {

    opacity: 0;

    transform: translate(5px, -5px) skew(1deg);

  }

  45% {

    opacity: 0;

    transform: translate(-5px, 5px) skew(-1deg);

  }

  47.5% {

    opacity: 0;

    transform: translate(0, 0);

  }

  50% {

    opacity: 0;

    transform: translate(-3px, 3px) skew(-0.7deg);

  }

  52.5% {

    opacity: 0;

    transform: translate(3px, -3px) skew(0.5deg);

  }

  55% {

    opacity: 0;

    transform: translate(0, 0);

  }

  57.5% {

    opacity: 0;

    transform: translate(4px, -4px) skew(1.2deg);

  }

  60% {

    opacity: 0;

    transform: translate(-4px, 4px) skew(-1.2deg);

  }

  62.5% {

    opacity: 0;

    transform: translate(0, 0);

  }

  65% {

    opacity: 0;

    transform: translate(2px, -2px) skew(0.8deg);

  }

  67.5% {

    opacity: 0;

    transform: translate(-2px, 2px) skew(-0.8deg);

  }

  70% {

    opacity: 0;

    transform: translate(0, 0);

  }

  72.5% {

    opacity: 0;

    transform: translate(5px, -5px) skew(1deg);

  }

  75% {

    opacity: 0;

    transform: translate(-5px, 5px) skew(-1deg);

  }

  77.5% {

    opacity: 0;

    transform: translate(0, 0);

  }

  80% {

    opacity: 0;

    transform: translate(-3px, 3px) skew(-0.7deg);

  }

  82.5% {

    opacity: 0;

    transform: translate(3px, -3px) skew(0.5deg);

  }

  85% {

    opacity: 0;

    transform: translate(0, 0);

  }

  87.5% {

    opacity: 0;

    transform: translate(4px, -4px) skew(1.2deg);

  }

  90% {

    opacity: 0;

    transform: translate(-4px, 4px) skew(-1.2deg);

  }

  92.5% {

    opacity: 0;

    transform: translate(0, 0);

  }

  95% {

    opacity: 0;

    transform: translate(2px, -2px) skew(0.8deg);

  }

  97.5% {

    opacity: 0;

    transform: translate(-2px, 2px) skew(-0.8deg);

  }

  100% {

    opacity: 0;

    transform: translate(0, 0);

  }

}


@media (max-width: 768px) {
  @keyframes glitchEffect {
    0% {
      opacity: 0;
      transform: translateY(0);
    }
    7.5% {
      opacity: 1;
      transform: translateY(-3px);
    }
    10% {
      opacity: 1;
      transform: translateY(3px);
    }
    12.5% {
      opacity: 1;
      transform: translateY(0);
    }
    22.5% {
      opacity: 1;
      transform: translateY(2px);
    }
    25% {
      opacity: 1;
      transform: translateY(0);
    }
    27.5% {
      opacity: 1;
      transform: translateY(-3px);
    }
    32.5% {
      opacity: 1;
      transform: translateY(0);
    }
    35% {
      opacity: 1;
      transform: translateY(-2px);
    }
    37.5% {
      opacity: 1;
      transform: translateY(2px);
    }
    40% {
      opacity: 1;
      transform: translateY(0);
    }
    /* Los demás keyframes mantienen opacity: 0 y transform: translateY(0) */
    2.5%, 5%, 15%, 17.5%, 20%, 30%, 42.5%, 45%, 47.5%, 50%, 52.5%, 55%, 
    57.5%, 60%, 62.5%, 65%, 67.5%, 70%, 72.5%, 75%, 77.5%, 80%, 82.5%, 
    85%, 87.5%, 90%, 92.5%, 95%, 97.5%, 100% {
      opacity: 0;
      transform: translateY(0);
    }
  }
}





.accordion .body {

    overflow: hidden; /* Oculta el contenido que se desborda */

    transition: height 0.3s ease; /* Transici��n para la altura */

    height: 0; /* Altura inicial cerrada */

}



.accordion .body.active {

    display:block !important;

}



.dropdown {

    position: relative;

    cursor: pointer;

}



.dropdown_list_container {

    position: absolute;

    background: var(--color_main_base); /* Cambia el fondo segn el dise09o */


    border: 1px solid #ccc; /* Cambia el borde seg��n el dise�0�9o */

    width: 100%;

    z-index: 10;

    top:56px;

}



.item {

    padding: 10px;

    color: #000; /* Cambia el color seg��n el dise�0�9o */

}



.item:hover {

    background: var(--color_main_2); /* Cambia el color de fondo al pasar el mouse */

}





/*EDICI�0�7N DE ESTILOS DE OTROS LUGARES*/



.progress-item.active{

    background-color: white !important;

    box-shadow: 0 0 6px 1px var(--color_main_1);

}



.pack_selector_container .pack_selector.active {

    background-color: var(--color_main_2);

    border: 1px solid var(--color_main_1);

}



.rank_picker.selected {

    background-color: var(--color_main_2);

}



.rank_picker.selected, .rank_picker:hover {

    border: 1px solid var(--color_main_1);

}



.picker_option.selected, .picker_option:hover, .hover_border:hover {

    box-shadow: inset 0 0 0 1px var(--color_main_1) !important;
    background: var(--color_main_2) ;

}



.t-blue{

    color: var(--color_main_1);

}





.main_layout{

  padding-top:0px;

}




@media(max-width:990px){

  .home_banner{

    margin-bottom: 0px !important;

    margin-top:230px !important;

  }

  .main_layout{

    /* padding-top:120px; */

  }



  .main_layout_bg{

    height: 100vh !important;

    max-height:none !important;

    object-fit:cover !important;

    object-position:81% 50%;



  }



  


  .layout_principal{

    padding-top:33vh !important;

  }

}

@media(max-width:570px){
  .main_layout{
    /* padding-top:50px; */
  }
}





.games_list_container {

  grid-template-columns: repeat(1,1fr) !important;

}



.reviews_banner{

  margin-top:150px !important;

}



@media(max-width: 990px){

  .reviews_banner{

    margin-top:15px !important;

  }

}



@media (min-width: 990px) {



    

    /* Para 1 juego */

    .games_list_container:has(.game_card_con:only-child) {

      grid-template-columns: repeat(1,1fr) !important;

    }

    

    /* Para 2-3 juegos */

    .games_list_container:has(.game_card_con:nth-child(2)):not(:has(.game_card_con:nth-child(4))) {

      grid-template-columns: repeat(4,1fr) !important;

    }

    

    /* Para 4 o más juegos */

    .games_list_container:has(.game_card_con:nth-child(4)):not(:has(.game_card_con:nth-child(8))) {

      grid-template-columns: repeat(2,1fr);

    }



    .games_list_container:has(.game_card_con:nth-child(8)) {

      grid-template-columns: repeat(4,1fr) !important;

    }

}





.status_checking{

  background-color: #ff76009c !important;

}



.status_in{

  background-color: #00ff006e !important;

}

.status_on{
  background-color: #fbff0154 !important;
}



.status_done{

  background-color: var(--color_main_1) !important;

}









.custom-range {

  -webkit-appearance: none;

  min-width: 80px;

  height: 22px;

  background: #0c0c0c;

  border-radius: 10px;

  outline: none;

  border: 1px solid #ffffff1f;

}





.custom-range::-webkit-slider-thumb {

  -webkit-appearance: none;

  width: 20px;

  height: 20px;

  background: var(--color_main_1);

  border-radius: 50%;

  cursor: pointer;

}



.custom-range::-moz-range-thumb {

  width: 20px;

  height: 20px;

  background: var(--color_main_1);

  border-radius: 50%;

  cursor: pointer;

  border: none;

}



.account_picker{

  background-color: var(--bg-main);

    border: 1px solid var(--stroke-dark);

    border-radius: 12px;

    justify-content: space-between !important;

    min-height: 260px;

    position: relative;

}



.account_width{

  width: 24%;
  min-width:250px;

}



@media(max-width: 990px){

  .account_width{

    width: 100% !important;

  }

}



.skin_mythic{

  box-shadow: 0 0 1rem 0px #0084ff;

  border: 2px solid #0084ff;

}



.skin_selected{

  box-shadow: 0 0 1rem 0.1rem gold;

  border: 2px solid gold;

}



.account_card{

  background-color: var(--bg-extra-dark);

    border-radius: 9px;

    cursor: pointer;

    flex-shrink: 0;

    min-height: 330px;

    min-width: 100%;

    overflow: hidden;

    padding: 20px;

    position: relative;

    width: 100%;

    z-index: 1;

}



.perk-list{

  list-style-image:url(/images/games/lol/marker.webp);

}



.game_pack_card:hover > :first-child {

    opacity: 1 !important;

}

/* UNRANKED */

.bg_base{
  background: #7289ff;
}


/* IRON */
.bg_1_webp, .bg_iron{
  filter: hue-rotate(121deg);
}

/* BRONCE */
.bg_2_webp, .bg_bronze{
  filter: hue-rotate(143deg);
}

/* SILVER */
.bg_3_webp, .bg_silver{
  filter: hue-rotate(339deg) grayscale(0.6);
}


/* ORO */
.bg_4_webp, .bg_gold{
  filter: hue-rotate(160deg);
}


/* PLATINO */
.bg_5_webp, .bg_platinum{
  filter: hue-rotate(304deg);
  color:black;
}

.bg_6_webp, .bg_emerald{
  filter: hue-rotate(240deg);
  color:black;
}

/* DIAMOND */
.bg_7_webp, .bg_diamond{
  filter: hue-rotate(330deg);
}

.bg_8_webp, .bg_master{
  filter: hue-rotate(60deg);
}

/* GRAN MASTER */
.bg_9_webp, .bg_grandmaster{
  filter: hue-rotate(119deg);
}

/* CHALLENGER */
.bg_10_webp, .bg_challenger{
  filter: hue-rotate(332deg);
}







.scroll_items .tooltip-container.top .tooltip-custom{

  left: 50% !important;

  top: 55px !important;

  transform: translate(-50%, -115%) !important;

}



.scroll_items .tooltip-container .tooltip-custom{

  max-width: 100px !important;

  min-width: 100px !important;

}




input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
input:-internal-autofill-selected {
    -webkit-box-shadow: 0 0 0 30px var(--bg-medium) inset !important; /* Fondo negro */
    -webkit-text-fill-color: white !important; /* Color del texto */
    transition: background-color 5000s ease-in-out 0s; /* Evita el flash de fondo blanco */
}



.border-dashed {
  border: 2px dashed var(--color_main_1);
}
.upload-area {
  transition: all 0.3s ease;
}
.upload-area:hover {
  background: var(--color_main_2);
}
.bg-dark {
  background: rgba(0, 0, 0, 0.2);
}




.text_yellow{
  color:rgb(255 181 7) !important;
}

textarea::placeholder {
  color: #ffffff48 !important;
}


@keyframes slideIn {
  from {
      opacity: 0;
      transform: translateY(-20px);
  }
  to {
      opacity: 1;
      transform: translateY(0);
  }
}

.message-enter {
  animation: slideIn 0.3s ease-out forwards;
}


.fade-in {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeIn 0.3s ease-out forwards;
}

.fade-in-delay-1 {
  opacity: 0;
  animation: fadeIn 0.3s ease-out forwards;
  animation-delay: 0.3s;
}

.fade-in-delay-2 {
  opacity: 0;
  animation: fadeIn 0.3s ease-out forwards;
  animation-delay: 0.6s;
}

.fade-in-delay-3 {
  opacity: 0;
  animation: fadeIn 0.3s ease-out forwards;
  animation-delay: 0.5s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0px);
  }
}

.game_card:hover .bg_card {
  opacity: 0.7 !important;
}

.rank-transition {
  transition: filter 0.3s ease-in-out;
}

.line-height-1{
  line-height: 1.1 !important;
}

.drop_down_max_h_auto{
  max-height:none !important;
}

.font_size_responsive{
  font-size: 110px;
}

@media (max-width: 900px) {
  .font_size_responsive {
    font-size: 50px;
  }
}


    .floating-cart-button {
        font-size:1.5rem;
        display: none;
        position: fixed;
        bottom: 105px;
        right: 15px;
        background: var(--color_main_2);
        color: white;
        border-radius: 50%;
        width: 60px;
        height: 60px;
        justify-content: center;
        align-items: center;
        z-index: 1000;
    }

    .floating-cart-button .arrow {
        position: absolute;
        bottom: -15px;
        animation: bounceArrow 1s infinite;
    }

    @keyframes bounceArrow {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(5px); }
    }

    @media (max-width: 768px) {
        .floating-cart-button {
            display: flex;
        }
    }


    .degradado_title {
      /* Fallback para navegadores antiguos */
      color: var(--color_main_1);
      
      /* Versión con degradado para navegadores modernos */
      background: linear-gradient(to right, var(--color_main_1), color-mix(in srgb, var(--color_main_1) 50%, white));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      
      /* Soporte para Firefox */
      background-clip: text;
    }
    
    @supports not (color: color-mix(in srgb, red, blue)) {
      .degradado_title {
        background: none;
        -webkit-text-fill-color: initial;
        color: var(--color_main_1);
      }
    }


    @media (min-width: 768px) {

      button, .agrandar_05, .agrandar_1, .agrandar_2, .agrandar_3, .agrandar{
        transition: 0.3s;
      }
      
      button:hover, .agrandar_1:hover, .agrandar:hover{
        transform: scale(1.05);
      }

      .agrandar_05:hover{
        transform: scale(1.015);
      }

  
  

      .agrandar_2:hover{
        transform: scale(1.1);
  
  
      }
  
      .agrandar_3:hover{
        transform: scale(1.2);
      }
    }




    .terms-section {
        margin-bottom: 2rem;
    }
    
    .section-title {
        font-size: 1.5rem;
        margin-bottom: 1rem;
        padding-bottom: 0.5rem;
        border-bottom: 2px solid #eee;
    }
    
    .content {
        font-size: 0.9rem;
        line-height: 1.6;
    }
    
    .content ol {
        padding-left: 1.5rem;
    }
    
    .content li {
        margin-bottom: 0.5rem;
    }
    
    .modal-body {
        padding: 2rem;
    }
    
    .modal-footer {
        border-top: 1px solid #eee;
        padding: 1rem 2rem;
    }
    
    .btn-primary {
        background-color: #0056b3;
        border-color: #0056b3;
    }
    
    .btn-primary:hover {
        background-color: #004494;
        border-color: #004494;
    }

    .faqs-container {
      position: relative;
      max-height: 550px;
      overflow: hidden;
  }

  .faqs-scroll {
      max-height: 550px;
      overflow-y: auto;
      padding-right: 0; /* Valor base cuando no hay scrollbar */
      transition: 0.3s;
  }

  @media (max-width: 768px) {
    .faqs-scroll {
      max-height: 250px;
    }
  }

  /* Estilos para el scrollbar */
  .faqs-scroll::-webkit-scrollbar {
      width: 5px;
  }

  /* Aplicar padding cuando hay scrollbar */
  .faqs-scroll.has-scrollbar {
      padding-right: 15px; /* Padding cuando hay scrollbar */
  }

  /* Para Firefox y otros navegadores */
  @media (hover: hover) {
      .faqs-scroll {
          scrollbar-gutter: stable;
          padding-right: 15px; /* Padding para Firefox */
      }
  }



  .faqs-fade {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      height: 200px;
      background: linear-gradient(to bottom, transparent, var(--color_main_base) 90%);
      pointer-events: none;
  }

  @media (max-width: 768px) {
    .faqs-fade {
      height: 100px;
    }
  }

  .faqs-fade-top {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 200px;
    background: linear-gradient(to top, transparent, var(--color_main_base) 90%);
    pointer-events: none;
  }
  
  @media (max-width: 768px) {
    .faqs-fade-top {
      height: 100px;
    }
  }
  






  .w_h_img_payment{
    width:120px;
    height:44px;
}

@media(min-width:1200px){
    .w_h_img_payment{
        width:186px;
        height:77px;
    }
}

.fs-7{
    font-size:0.9rem;
    line-height:1.1;
}

.fs-8{
    font-size:0.8rem;
    line-height:1.1;
}

.text-wrap-balance{
    text-wrap:balance;
}

.fs-9{
    font-size:0.6rem;
    line-height:1.1;
}

@media (max-width: 992px) {
  .fs-xs-7{
    font-size:0.8rem !important;
  }

  .p_r_responsive{
    padding-right:30px !important;
  }
}








  .showcase-slider {
    position: relative;
}

.showcase-slide {
    display: none;
    transition: opacity 0.3s ease;
}

.showcase-slide.active {
    display: block;
}

.business-selector.active {
    background-color: var(--color_main_1) !important;
}

.slide-selector {
    transition: all 0.3s ease;
}

.slide-selector:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
    opacity: 1 !important;
}

.slide-selector.active {
    background-color: rgba(255, 255, 255, 0.2) !important;
    opacity: 1 !important;
}

.content-expandable {
    position: relative;
    transition: max-height 0.5s ease-in-out;
    max-height: 200px;
    overflow: hidden;
}

.content-expandable.expanded {
    max-height: 2000px; /* Valor alto para asegurar que todo el contenido sea visible */
}

.content-gradient {
    display: block;
    position: absolute;
    bottom: -5px; /* Ajustado para cubrir el borde inferior */
    left: -5px; /* Ajustado para cubrir el borde izquierdo */
    width: calc(100% + 10px); /* Ajustado para cubrir ambos bordes laterales */
    height: 100px;
    background: linear-gradient(to bottom, transparent 0%, var(--color_main_base) 95%);
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 3;

}

.content-expandable.expanded .content-gradient {
    opacity: 0;
}

.expand-button {
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 4;
    transition: all 0.3s ease;
    border: 1px solid var(--border_main);
}

.expand-button:hover {
    background-color: var(--color_main_1) !important;
}

.expand-button .expand-icon {
    transition: transform 0.3s ease;
}

.content-expandable.expanded .expand-icon {
    transform: rotate(180deg);
}

.expandable-content {
    transition: opacity 0.3s ease;
}


.text_wrap_responsive{
  text-wrap: balance;
}


@media (min-width: 600px) {
  .text_wrap_responsive{
    text-wrap: nowrap;
  }
}

.text-wrap-balance{
  text-wrap: balance !important;
}

.table_bxxster {
  --bs-table-color: #fff;
  --bs-table-bg: var(--color_main_2);
  --bs-table-border-color: var(--color_main_1);
  --bs-table-striped-bg: var(--color_main_2);
  --bs-table-striped-color: #fff;
  --bs-table-active-bg: var(--color_main_2);
  --bs-table-active-color: #fff;
  --bs-table-hover-bg: var(--color_main_2);
  --bs-table-hover-color: #fff;
  color: var(--bs-table-color);
  border-color: var(--color_main_1);
}


@media (max-width: 768px) {
  .font_responsive_size{
    font-size: 0.8rem;
  }

  .title_font_responsive{
    font-size: 0.9rem;
  }
}


.grid_game_list{
  min-height:240px;
  grid-template-columns: repeat(3, 1fr) !important;
}

.max_w_game_list{
  max-width:50%;
}

@media (max-width: 992px) {
  .grid_game_list{
    min-height:240px;
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .max_w_game_list{
    max-width:60%;
  }
}


.speech-bubble{
  position: relative;
  background: white;
  border-radius: 10px;
  padding: 15px;
  margin-left: 15px;
  color: var(--color_main);
}

.speech-bubble::before{
  content: '';
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 10px;
  border-style: solid;
  border-color: transparent white transparent transparent;
}

@media(max-width: 992px){
  .speech-bubble::before{
    top: 70% !important;
  }
}


.min_w_liss_container{
  min-width:300px;
}

.min_w_w_img_liss{
  min-width: 250px;
  width:250px
}

.min_w_w_img_liss_content_support{
  min-width: 180px;
  width:180px;
  top:0px;
  bottom: auto;
}

.p_l_support_content{
  padding-left:190px !important;
}

.mt_support_msg{
  margin-top:-10px;
}

@media (max-width: 992px) {
  .min_w_liss_container{
    min-width:120px;
  }
  .p_l_support_content{
    padding-left:120px !important;
  }
  .min_w_w_img_liss{
    min-width: 139px;
    width:139px
  }
  .min_w_w_img_liss_content_support{
    min-width: 100px;
    width:100px;
    bottom:0px !important;
    top: auto !important;
  }
  .mt_support_msg{
    margin-top:-7px;
  }
}









@media(min-width: 992px) {
  .fs-lg-7{
    font-size:0.9rem !important;
  }
  .fs-lg-8{
    font-size:0.8rem !important;
  }
  .fs-lg-9{
    font-size:0.6rem !important;
  }

  .fs-lg-3{
    font-size:calc(1.3rem + .6vw)!important;
  }

  .fs-lg-5{
    font-size:1.25rem !important;
  }

  .fs-lg-6{
    font-size:1rem !important;
  }
}



.bg_base_z{
    background:rgba(49, 59, 124, 0.5);
}


/* con esto quito el navbar antes de la pagina */
.top_navbar:before{
    content: none !important;
}




/* ESTILOS DE ZETHACRAFT */

.bottom_menu_submenu{
  bottom:-37px;
}

@media (min-width: 992px) {
  .position-lg-absolute{
    position:absolute !important;
  }
}

.w_h_hexa_right_menu{
  width:69px;
  height:69px;
}

@media (min-width: 992px) {
  .w_h_hexa_right_menu{
    width:69px;
    height:69px;
  }
  .fs-lg-4{
    font-size:1.5rem !important;
  }
  .fs-lg-3{
    font-size:calc(1.3rem + .6vw)!important;
  }
  .fs-lg-6{
    font-size:1rem !important;
  }
}

.h_display_global{
  height:798px !important;
}

.h_display_global_lightbox{
  height:798px !important;
}

@media (max-width: 992px) {
  .h_display_global{
    height:1380px !important;
  }
  .h_display_global_lightbox{
    height:1050px !important;
  }
}

.mt-6{
  margin-top:4rem !important;
}
.mt-7{
  margin-top:6rem !important;
}

@media (min-width: 992px) {
  .mt-lg-6{
    margin-top:4rem !important;
  }
  .mt-lg-7{
    margin-top:6rem !important;
  }
}

@media(min-width: 570px){

  .mt-sm-7{
    margin-top:6rem !important;
  }
}

@media (max-width: 992px) {
  .w_h_hexa_custom_menu{
    width:33px !important;
    height:33px !important;
  }

  .w_h_hexa_custom_menu img{
    width:20px !important;
    height:20px !important;
  }

  .mt_custom_menu{
    margin-top:-7px !important;
  }
}

.w_h_hexa_custom_buttons{
  width:69px !important;
  height:69px !important;
}

.h_grid_custom{
  max-height:320px !important;
}

.mt_custom_buttons{
  /* margin-top:-12px !important; */
}

@media (max-width: 992px) {
  .w_h_hexa_custom_buttons{
    width:50px !important;
    height:50px !important;
  }
  .h_grid_custom{
    max-height:206px !important;
  }
  .mt_custom_buttons{
    /* margin-top:-6px !important; */
  }
}

.fs_title_extra_content_1{
  font-size:2rem !important;
}

.fs_title_extra_content_2{
  font-size:4rem !important;
}

@media (min-width: 992px) {
  .fs-lg-5{
    font-size:1.25rem !important;
  }
}



@media (max-width: 992px) {
  .fs_title_extra_content_1{
    font-size:1.2rem !important;
  }
  .fs_title_extra_content_2{
    font-size:3rem !important;
  }


}




/* Estilos para el menú móvil */
@media (max-width: 991.98px) {
  .menu_right_container .mobile_menu_options {
      position: absolute;
      right: -320px; /* Inicialmente oculto */
      transition: transform 0.3s ease;
      display: flex;
      gap: 0.5rem;
  }

  .menu_right_container.menu_open .mobile_menu_options {
      transform: translateX(-400px); /* Mostrar los botones */
  }

  /* Rotación del ícono de opciones */
  .menu_right_container .options_icon {
      transition: transform 0.3s ease;
  }

  .menu_right_container.menu_open .options_icon {
      transform: rotate(180deg);
  }
}



.menu_divisor{
  width: 2px;
  min-width: 2px;
  height: 70%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, var(--color_main_1) 50%, rgba(255, 255, 255, 0) 100%);
  border-radius: 5px;
  opacity: 0.7;
}


@media(min-width: 992px){
  .main_menu_option:hover {
    background: rgb(90 109 235 / 50%);
    color: white !important;
    opacity: 1 !important;
    transform: scale(1.05);
  }
}


/* 
   Efecto cíclico infinito de opacidad entre 0 y 0.75 para .fa-fade-75 
   Ideal para iconos o elementos que requieran un efecto de "parpadeo suave"
*/
.fa-fade-75 {
  opacity: 0.75;
  animation: fadeInOut-75 2.5s ease-in-out infinite;
}

@keyframes fadeInOut-75 {
  0% {
    opacity: 0.2;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 0.2;
  }
}


.h_logo_menu{
  height:80px;
}

@media (max-width: 992px) {
  .h_logo_menu{
    height:40px;
  }
}








/* Estilos para el menú móvil */
@media (max-width: 991.98px) {
  .menu_right_container .mobile_menu_options {
      position: absolute;
      right: -320px; /* Inicialmente oculto */
      transition: transform 0.3s ease;
      display: flex;
      gap: 0.5rem;
  }

  .menu_right_container.menu_open .mobile_menu_options {
      transform: translateX(-400px); /* Mostrar los botones */
  }

  /* Rotación del ícono de opciones */
  .menu_right_container .options_icon {
      transition: transform 0.3s ease;
  }

  .menu_right_container.menu_open .options_icon {
      transform: rotate(180deg);
  }

}


@media(max-width: 992px){
  .w_responsive_checkout_orders{
    width:100% !important;
  }
}


.amo-button-holder.amo-horisontal{
  z-index: 7 !important;
}


@media(max-width: 992px){
  .font_size_r_title{
    font-size: 2.5rem !important;
  }
}


.mt_lang_select{
  margin-top:4px
}

@media(max-width: 992px){
  .mt_lang_select{
    margin-top:0px
  }

  .margin_blog_0_r{
    margin:0px !important;
  }
}