/* ===========================
   FUENTES NEON
   =========================== */

@font-face {
  font-family: adelia;
  src: url('/modules/custom/cotizador_productos/css/fuentes/adelia.ttf');
}

@font-face {
  font-family: ananda;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Ananda.ttf');
}

@font-face {
  font-family: arandelle;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Arandelle.otf');
}

@font-face {
  font-family: autography;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Autography.otf');
}

@font-face {
  font-family: bacalisties;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Bacalisties.ttf');
}

@font-face {
  font-family: better_grade;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Better_Grade.ttf');
}

@font-face {
  font-family: beyond_infinity;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Beyond-Infinity.ttf');
}

@font-face {
  font-family: brittany_signature;
  src: url('/modules/custom/cotizador_productos/css/fuentes/BrittanySignature.ttf');
}

@font-face {
  font-family: kimie_roselyne;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Kimie-Roselyne.ttf');
}

@font-face {
  font-family: leisha;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Leisha.ttf');
}

@font-face {
  font-family: may_lova;
  src: url('/modules/custom/cotizador_productos/css/fuentes/May-Lova.ttf');
}

@font-face {
  font-family: melody_southern_script;
  src: url('/modules/custom/cotizador_productos/css/fuentes/MelodySouthern-Script.otf');
}

@font-face {
  font-family: modernline;
  src: url('/modules/custom/cotizador_productos/css/fuentes/modernline.otf');
}

@font-face {
  font-family: mondeylla;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Mondeylla.otf');
}

@font-face {
  font-family: photograph_signature;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Photograph-Signature.ttf');
}

@font-face {
  font-family: rosellinda_alyamore;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Rosellinda-Alyamore.otf');
}

@font-face {
  font-family: rustling_sound;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Rustling-Sound.ttf');
}

@font-face {
  font-family: ruthligos;
  src: url('/modules/custom/cotizador_productos/css/fuentes/Ruthligos.ttf');
}

/* ===========================
   FUENTES DINÁMICAS
   =========================== */

[data-fuente="adelia"] {
  font-family: adelia;
  font-size: 5.6rem;
  line-height: 2em;
}

[data-fuente="ananda"] {
  font-family: ananda;
  font-size: 8.4rem;
  line-height: 10.08rem;
}

[data-fuente="arandelle"] {
  font-family: arandelle;
  font-size: 16.8rem;
  line-height: 11.76rem;
}

[data-fuente="autography"] {
  font-family: autography;
  font-size: 9.8rem;
  line-height: 9.8rem;
}

[data-fuente="bacalisties"] {
  font-family: bacalisties;
  font-size: 8.4rem;
  line-height: 10.92rem;
}

[data-fuente="better_grade"] {
  font-family: better_grade;
  font-size: 18.2rem;
  line-height: 14.56rem;
}

[data-fuente="beyond_infinity"] {
  font-family: beyond_infinity;
  font-size: 12.6rem;
  line-height: 10.08rem;
}

[data-fuente="brittany_signature"] {
  font-family: brittany_signature;
  font-size: 9.8rem;
  line-height: 16.66rem;
}

[data-fuente="kimie_roselyne"] {
  font-family: kimie_roselyne;
  font-size: 15.4rem;
  line-height: 12.32rem;
}

[data-fuente="leisha"] {
  font-family: leisha;
  font-size: 11.2rem;
  line-height: 11.2rem;
}

[data-fuente="may_lova"] {
  font-family: may_lova;
  font-size: 7rem;
  line-height: 10.5rem;
}

[data-fuente="melody_southern_script"] {
  font-family: melody_southern_script;
  font-size: 7rem;
}

[data-fuente="modernline"] {
  font-family: modernline;
  font-size: 7rem;
  line-height: 10.5rem;
}

[data-fuente="mondeylla"] {
  font-family: mondeylla;
  font-size: 11.2rem;
  line-height: 10.08rem;
}

[data-fuente="photograph_signature"] {
  font-family: photograph_signature;
  font-size: 11.2rem;
  line-height: 12.32rem;
}

[data-fuente="rosellinda_alyamore"] {
  font-family: rosellinda_alyamore;
  font-size: 15.4rem;
  line-height: 13.86rem;
}

[data-fuente="rustling_sound"] {
  font-family: rustling_sound;
  font-size: 8.4rem;
  line-height: 15.12rem;
}

[data-fuente="ruthligos"] {
  font-family: ruthligos;
  font-size: 7rem;
  line-height: 11.9rem;
}

/* ===========================
   CONTENEDOR NEON
   =========================== */

.flux {
  position: absolute;
  top: 38%;
  transform: translateY(-50%);
  right: 50px;
  left: 50px;
}

/* ===========================
   SELECTOR DE COLORES
   =========================== */

img.imgneon {
  cursor: pointer;
  transition: all 0.2s ease;
}

img.imgneon.colorsel {
  border: 2px solid #ffffff;
  transform: scale(1.3);
  box-shadow: 0 0 5px #555;
  position: relative;
}

/* ===========================
   EFECTOS DE COLOR NEON
   =========================== */

[data-color="Azul"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 7px #fff,
    0 0 10px #1041ff,
    0 0 20px #1041ff,
    0 0 30px #1041ff,
    0 0 40px #1041ff,
    0 0 70px #1041ff,
    0 0 100px #1041ff;
}

[data-color="Rojo"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 7px #fff,
    0 0 10px #ff0000,
    0 0 20px #ff0000,
    0 0 30px #ff0000,
    0 0 40px #ff0000,
    0 0 70px #ff0000,
    0 0 100px #ff0000;
}

[data-color="Naranja"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 7px #fff,
    0 0 10px #ff6d00,
    0 0 20px #ff6d00,
    0 0 30px #ff6d00,
    0 0 40px #ff6d00,
    0 0 70px #ff6d00,
    0 0 100px #ff6d00;
}

[data-color="Calido"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #f5ff7f,
    0 0 20px #f5ff7f,
    0 0 30px #f5ff7f,
    0 0 40px #f5ff7f,
    0 0 70px #f5ff7f;
}

[data-color="Blanco"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 30px #fff,
    0 0 40px #fff,
    0 0 70px #fff;
}

[data-color="Amarillo"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #eaff00,
    0 0 20px #eaff00,
    0 0 30px #eaff00,
    0 0 40px #eaff00,
    0 0 70px #eaff00;
}

[data-color="Verde"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #00ff12,
    0 0 20px #00ff12,
    0 0 30px #00ff12,
    0 0 40px #00ff12,
    0 0 70px #00ff12;
}

[data-color="Azul Claro"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #00ecef,
    0 0 20px #00ecef,
    0 0 30px #00ecef,
    0 0 40px #00ecef,
    0 0 70px #00ecef;
}

[data-color="Fucsia"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 7px #fff,
    0 0 10px #f000ff,
    0 0 20px #f000ff,
    0 0 30px #f000ff,
    0 0 40px #f000ff,
    0 0 70px #f000ff,
    0 0 100px #f000ff;
}

[data-color="Morado"] {
  color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 7px #fff,
    0 0 10px #9600ff,
    0 0 20px #9600ff,
    0 0 30px #9600ff,
    0 0 40px #9600ff,
    0 0 70px #9600ff,
    0 0 100px #9600ff;
}

.neon-colores {
  display: flex;
  width: 100%;
  padding: 0 20px
}

.neon-colores a {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.neon-colores a img {
  max-width: 95%;
  height: auto;
}

textarea.resize {
  box-sizing: border-box;
  overflow: hidden;
  resize: none;
}