:root{
    --neon3: #FFC85F;
    --glow1: #C65723;
    --glow2: #BE5E29;
    --bg: black;
    --hue: 0;
    --prova:hsla(295, 82%, 68%, 0.8);

}


.AIR_300{
    --neon3: #bf37fd;
    --glow1: #ce07ce;
    --glow2: #801aaf;
    --hue: 295;
    --bg: black;

}
.AIR_200{
    --neon3: #bf37fd;
    --glow1: #ce07ce;
    --glow2: #801aaf;
    --hue: 295;
    --bg: black;

}
.AIR_100{
    --neon3: #bf37fd;
    --glow1: #ce07ce;
    --glow2: #801aaf;
    --hue: 295;
    --bg: black;

}
.AIR_30{
    --neon3: #bf37fd;
    --glow1: #ce07ce;
    --glow2: #801aaf;
    --hue: 295;
    --bg: black;

}
.AIR5G_300{
    --neon3: #f77205;
    --glow1: #ad4306;
    --glow2: #c02d08;
    --hue: 14;
    --bg: black;

}
.FWA_300{
    --neon3: #f77205;
    --glow1: #ad4306;
    --glow2: #c02d08;
    --hue: 14;
    --bg: black;

}
.AIR5G_100{
    --neon3: #f77205;
    --glow1: #ad4306;
    --glow2: #c02d08;
    --hue: 14;
    --bg: black;

}
.AIR5GLTE_100{
    --neon3: #f77205;
    --glow1: #ad4306;
    --glow2: #c02d08;
    --hue: 14;
    --bg: black;

}
.FTTC_200{
    --neon3: #2687d6;
    --glow1: #1855da;
    --glow2: #2471ff;
    --hue: 204;
    --bg: black;

}
.FTTC_100{
    --neon3: #2687d6;
    --glow1: #1855da;
    --glow2: #2471ff;
    --hue: 204;
    --bg: black;

}
.FTTH_1000{
    --neon3: #2687d6;
    --glow1: #1855da;
    --glow2: #2471ff;
    --hue: 204;
    --bg: rgb(0 56 141 / 73%);

}
.FTTH_2500{
    --neon3: #aaff22;
    --glow1: #11d684;
    --glow2: #30dd2a;
    --hue: 125;
    --bg: rgb(74 143 42 / 81%);

}
.FTTH_6000{
    --neon3: #00ac1d;
    --glow1: #137c05;
    --glow2: #377200;
    --hue: 125;
    --bg: rgb(60 139 36 / 75%);

}

.card{
    margin-top: 150px;
    min-width: 260px;
    background-color: #222;
    color:white;
    border-radius: 25px;
    h5{
        color: white !important;
    }
}

.card1{
    --neon3: #7bff00;
    --glow1: #0dad6a;
    --glow2: #2ebe29;
    --hue: 125;
    --bg: black;
}
.card2{
    --neon3: #2687d6;
    --glow1: #1855da;
    --glow2: #2471ff;
    --hue: 204;
    --bg: black;
}
.card3{
    --neon3: #f77205;
    --glow1: #ad4306;
    --glow2: #c02d08;
    --hue: 14;
    --bg: black;
}
.card4{
    --neon3: #bf37fd;
    --glow1: #ce07ce;
    --glow2: #801aaf;
    --hue: 295;
    --bg: black;
}
.card5{
    --neon3: #5416ff;
    --glow1: #5600b8;
    --glow2: #3e107a;
    --hue: 295;
    --bg: black;
}
.card5{
    --neon3: #5416ff;
    --glow1: #5600b8;
    --glow2: #3e107a;
    --hue: 295;
    --bg: black;
}

.neon{
    transform: translate(21%, 0);
}


.new-neon {
  position: relative;
  height: 200px;
  width: 200px;
}

.neon-circle {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 7px solid #fff;
  z-index: 5;
  filter: blur(1px);
  opacity: .8;
}

.neon-circle-2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 101.5%;
  height: 101.5%;
  border-radius: 50%;
  border: 14px solid #F5EBDF;
  z-index: 4;
  filter: blur(1px);
  opacity: .6;
}

.neon-circle-3 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 103.25%;
  height: 103.25%;
  border-radius: 50%;
  border: 21px solid var(--neon3);
  z-index: 3;

}

.neon-glow {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 109%;
  height: 109%;
  border-radius: 50%;
  border: 20px solid var(--glow1);
  filter: blur(8px);
  z-index: 2;
  opacity: .7;

}

.neon-glow-2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 122%;
  height: 122%;
  border-radius: 50%;
  border: 35px solid var(--glow2);
  filter: blur(36px);
  z-index: 1;
  opacity: .8;
}

.neon-inner-bg {
  height: 100%;
  width: 100%;
  background: var(--bg);
  border-radius: 50%;
  z-index: 0;
}




.tony{
    -webkit-text-fill-color: hsl(var(--hue), 50%, 95%);
    -webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: hsl(var(--hue), 50%, 95%);
    text-shadow:
    0 0 15px hsl(var(--hue), 60%, 90%, .80),
    0 0 20px hsl(var(--hue), 70%, 80%, .85),
    0 0 40px hsl(var(--hue), 80%, 70%, .90),
    0 0 60px hsl(var(--hue), 90%, 60%, .95),
    0 0 80px hsl(var(--hue), 100%, 50%, 1);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -120%);
    font-size: 40px;
    letter-spacing: 3px;
    font-family: arial;
}

/* .tony:before{
    content: var(--text1);
}

.pipi:before{
    content: var(--text2);
} */

.pipi{
    top: 50%;
    left: 50%;
    transform: translate(-50%, 50%);
    font-size: 34px;
    letter-spacing: 5px;
    -webkit-text-stroke-width: 2px;
    -webkit-text-fill-color: transparent;
}