body {
  font-family: "Saira Semi Condensed", sans-serif;
  background-color: #34425b;
  color: whitesmoke;
  margin: 0;
  height: 100vh;
  overflow: hidden; /* Evita scrolling a causa delle macchioline */
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.picProfile {
  width: 125px;
  height: 125px;
  border-radius: 3px 7px 37% 11px;
  border: 1px solid whitesmoke;
  vertical-align: middle;
  margin: 3%;
}

h5 {
  font-size: 1em;
  margin: 0;
}

h4 {
  font-size: 1.5em;
  margin: 1% 5%;
}

li{
  list-style-type: "-";
  padding: 2px;
}

a{ text-decoration-line: underline; color: whitesmoke; }
a:visited { color: whitesmoke; }
a:hover { color: rgb(209, 175, 115); }

.text-focus{ color: rgb(209, 175, 115) }

.code-focus{
  border: 1px solid rgba(245, 245, 245, 0.234);
  padding: 0px 4px;
  border-radius: 7px;
  margin-left: 2px;
}

.spot {
  position: absolute;
  border-radius: 50%;
  animation: moveUp linear infinite;
}

/*VISUALIZZAZIONE DA MOBILE*/ /*quando è minore di 1169px*/
@media (max-width: 1169px) {
  .spot {
    display: none;
  }
}

@keyframes moveUp {
  0% {
    transform: translateY(0);
  }
  20% {
    transform: translateY(-20vh); /* macchioline piu veloci a inizio pagina*/
  }
  100% {
    transform: translateY(-100vh);
  }
}

.card-container {
  position: relative;
  z-index: 1; /* Assicura che le card siano sopra le macchioline */
  display: flex;
  flex-direction: column;
  gap: 20px;
  height: 80vh; /* Limita l'altezza per abilitare lo scroll */
  overflow-y: scroll; /* Abilita lo scroll verticale */
  padding: 20px;
  background: rgba(255, 255, 255, 0); /* card semi-trasparenti */
  border-radius: 10px;
}

.card {
  background: rgba(255, 255, 255, 0); /* Sfondo semi-trasparente */
  padding: 20px;
  text-align: left;
  max-width: 500px;
}

.card h3 {
  margin-top: 0;
}

.card p {
  color: #333;
  margin: 10px 0;
}

/* SOCIAL ICON BTNS */
.social { text-decoration: none;}
.twitter:hover { color: #00abee; }
.linkedin:hover { color: #0a66c2; }
.mastodon:hover { color: #563acc; }
.github:hover { color: #575c61; }
.telegram:hover { color: #0088cc; }
.gmail:hover { color: #c71610; }


/* Flickering animation */
.flickering {
  animation: flicker 3s infinite alternate;
  color: rgb(255, 136, 17);
}

@keyframes flicker {
  0%,
  18%,
  22%,
  25%,
  53%,
  57%,
  100% {
    text-shadow: 0 0 4px #fff, 0 0 11px #fff, 0 0 19px #fff,
      0 0 40px rgb(255, 136, 17), 0 0 80px rgb(255, 136, 17),
      0 0 90px rgb(255, 136, 17), 0 0 100px rgb(255, 136, 17),
      0 0 150px rgb(255, 136, 17);
  }
  20%,
  24%,
  55% {
    text-shadow: none;
  }
}

/* Censured text */
.text-decript span::before {
  content: '';
  animation-name: decript-txt;
  animation-iteration-count: infinite;
  animation-duration: 7s;
  animation-timing-function: ease-in;
  color: #e8f6ff;
}
  
@keyframes decript-txt {
    0% {content: 'ᛡ ᛒ ᛝ ᛠ ᛚ ᚨ ᛗ ᛉ ᚷ ᚦ ᛃ ᛏ ᛠ ᛆ ᚳ ᚩ';}
    2% {content: 'ᛏ ᛒ ᚥ ᛉ ᛋ ᛁ ᚨ ᚱ ᚠ ᛂ ᛒ ᚺ ᛟ ᚷ ᛉ ᚦ';}
    4% {content: 'ᚢ ᛒ ᚻ ᛇ ᚦ ᚡ ᚭ ᛃ ᚬ ᚴ ᚾ ᚹ ᛝ ᛏ ᚢ ᚨ';}
    6% {content: 'ᛚ ᛒ ᛁ ᛡ ᛠ ᛦ ᚨ ᚲ ᛠ ᚢ ᚨ ᚩ ᛟ ᚾ ᛉ ᚦ';}
    8% {content: 'ᛁ ᛒ ᛇ ᛘ ᛋ ᛣ ᛚ ᚩ ᛞ ᛟ ᚷ ᚷ ᛁ ᛋ ᛠ ᛂ ᛁ';}
   10% {content: 'ᛝ ᛒ ᛡ ᛋ ᛃ ᛇ ᚦ ᚲ ᛡ ᚠ ᚨ ᚩ ᛟ ᛠ ᚦ ᚹ';}
   12% {content: 'ᚨ ᛒ ᚬ ᛋ ᛠ ᛡ ᚨ ᛁ ᛟ ᚺ ᛗ ᛋ ᛇ ᛁ ᛚ ᚳ';}
   14% {content: 'ᛏ ᛝ ᛒ ᛞ ᛚ ᛋ ᛝ ᚥ ᚩ ᛉ ᛗ ᚷ ᛋ ᛝ ᛠ ᛂ';}
   16% {content: 'ᛋ ᚨ ᛒ ᚳ ᚾ ᛁ ᛡ ᛡ ᛚ ᚲ ᚷ ᚺ ᛉ ᚢ ᚴ ᚨ';}
   18% {content: 'ᚢ ᛡ ᛒ ᛉ ᚻ ᛂ ᚷ ᛠ ᛋ ᛁ ᛏ ᛇ ᛂ ᛁ ᛚ ᚳ';}
   20% {content: 'ᛞ ᛉ ᛠ ᛒ ᛗ ᚳ ᛁ ᛠ ᛡ ᛡ ᛇ ᛠ ᛉ ᛋ ᛏ ᛠ';}
   22% {content: 'ᚥ ᛠ ᛞ ᛒ ᛉ ᛠ ᚦ ᛡ ᛇ ᚦ ᛠ ᚢ ᛋ ᚩ ᛠ ᚳ';}
   24% {content: 'ᛉ ᛠ ᛉ ᛒ ᛝ ᚨ ᚾ ᛡ ᚳ ᛠ ᚨ ᛏ ᚦ ᛋ ᚨ ᛠ';}
   26% {content: 'ᚨ ᚳ ᛡ ᛒ ᚦ ᛠ ᚢ ᚳ ᚢ ᛠ ᛞ ᚨ ᚳ ᛋ ᛡ';}
   28% {content: 'ᛉ ᛡ ᛋ ᛒ ᛠ ᚢ ᚳ ᛡ ᛠ ᛋ ᚢ ᛡ ᚳ ᛉ ᛡ';}
   30% {content: 'ᛡ ᛋ ᛇ ᚳ ᛒ ᛝ ᛏ ᛡ ᛡ ᚢ ᚳ ᛋ ᛡ ᛇ ᛠ ᚳ';}
   32% {content: 'ᛇ ᛡ ᚦ ᛡ ᛒ ᛠ ᚳ ᛝ ᚦ ᛠ ᚳ ᛋ ᛡ ᛡ ᛋ ᚳ';}
   34% {content: 'ᚨ ᛠ ᚳ ᛡ ᛒ ᛉ ᚢ ᚨ ᚢ ᚨ ᚳ ᛡ ᛠ ᚢ ᚨ ᚳ';}
   36% {content: 'ᛋ ᛡ ᛡ ᚦ ᛒ ᚨ ᚦ ᛠ ᛋ ᛡ ᛡ ᛋ ᚨ ᛠ ᚳ ᛡ';}
   38% {content: 'ᛠ ᚳ ᛡ ᚢ ᛒ ᚳ ᛋ ᛡ ᛋ ᛠ ᚢ ᚨ ᛡ ᛠ ᚳ ᚨ';}
   40% {content: 'ᚢ ᚳ ᛡ ᚦ ᛒ ᚨ ᚢ ᚳ ᚦ ᛠ ᚳ ᚨ ᚢ ᛡ ᛠ ᚳ';}
   42% {content: 'ᚢ ᚳ ᚳ ᛡ ᛒ ᛉ ᚢ ᚨ ᚢ ᚨ ᚳ ᛡ ᛠ ᚢ ᚨ ᚳ';}
   44% {content: 'ᚢ ᛡ ᚦ ᛠ ᛒ ∇ ᚨ ᚢ ᚳ ᛡ ᚦ ᛠ ᚨ ᚢ ᚳ ᛡ';}
   46% {content: 'ᚳ ᚢ ᛡ ᚦ ᛒ ∇ ᚳ ᚨ ᚢ ᚳ ᛡ ᚦ ᛠ ᚨ ᚢ ᚳ';}
   48% {content: 'ᛡ ᛡ ᚦ ᚢ ᛡ ∇ ᛒ ᛋ ᛋ ᚳ ᚢ ᚳ ᛡ ᚦ ᛋ ᚢ';}
   50% {content: 'ᚳ ᛡ ᚦ ᚳ ᚢ ∇ ᛒ ᚦ ᛡ ᛋ ᚳ ᚢ ᚳ ᛡ ᚦ ᛋ';}
   58% {content: 'ᚨ ᚢ ᚳ ᛡ ᚳ ∇ ᚢ ᛒ ᚹ ᚳ ᚳ ᚢ ᚳ ᛡ ᚦ ᛋ';}
   66% {content: 'ᚨ ᚢ ᚳ ᛡ ᛋ ᛡ ᚦ ᛒ ᛡ ᚳ ᚢ ᚳ ᛡ ᚦ ᚦ ᛠ';}
   70% {content: 'ᚨ ᚢ ᚦ ᛠ ᚳ ᚨ ᚢ ᚳ ᛡ ᛡ ᛋ ᚦ ᚳ ᛡ ᚦ ᛠ';}
   74% {content: 'ᛡ ᛋ ᛇ ᚳ ᛠ ᛝ ᛏ ᛡ ᛡ ᚢ ᚳ ᛋ ᛡ ᛇ ᛠ ᚳ';}
   78% {content: 'ᛇ ᛡ ᚦ ᛡ ᚨ ᛠ ᚳ ᛝ ᚦ ᛠ ᚳ ᛋ ᛡ ᛡ ᛋ ᚳ';}
   83% {content: 'ᚨ ᛠ ᚳ ᛡ ᚢ ᛉ ᚢ ᚨ ᚢ ᚨ ᚳ ᛡ ᛠ ᚢ ᚨ ᚳ';}
   88% {content: 'ᛋ ᛡ ᛡ ᚦ ᛠ ᚨ ᚦ ᛠ ᛋ ᛡ ᛡ ᛋ ᚨ ᛠ ᚳ ᛡ';}
   92% {content: 'ᛠ ᚳ ᛡ ᚢ ᚨ ᚳ ᛋ ᛡ ᛋ ᛠ ᚢ ᚨ ᛡ ᛠ ᚳ ᚨ';}
   94% {content: 'ᚨ ᛃ ᚬ ᛋ ᛠ ᛡ ᚨ ᛁ ᛒ ᚺ ᛗ ᛋ ᛇ ᛁ ᛚ ᚳ';}
   97% {content: 'ᛏ ᛝ ᚷ ᛞ ᛚ ᛋ ᛝ ᚥ ᚩ ᛒ ᛗ ᚷ ᛋ ᛝ ᛠ ᛂ';}
  100% {content: 'ᚨ ᛠ ᚳ ᛡ ᛠ ᚢ ᛠ ᚦ ᛡ ᛡ ᛒ ᚢ ᚳ ᛡ ᚦ ᛠ';}
}
/* @keyframes decript-txt {
  0% {content: 'йопвъгыдлмрщозкомзачуфъ';}
  2% {content: 'ыящмзчбцсющпшшшдыцгмрщл';}
  4% {content: 'хцзщшьядчщщсрсаитсурнкг';}
  6% {content: 'пежюпшлйфбщврцьхзоеьлоч';}
  8% {content: 'тхсахлоднркйвпдшафсрщжх';}
  10% {content: 'эвъфгъхгфигёж срнббяэйт';}
  12% {content: 'яшцгкьуношэок чдштлхёпб';}
  14% {content: 'ыншычюмкёчтхгб дцрефгкв';}
  16% {content: 'чрвъодхжвтззамь йдэтелё';}
  18% {content: 'пптччзохсрдзляй птоуаьр';}
  20% {content: 'пропбъашощхвйсм пщукщея';}
  22% {content: 'прокрпняфвйэящхз дылпъз';}
  24% {content: 'профэлпвециущхдаъв уэвя';}
  26% {content: 'профещёкплчзпзипп кщреш';}
  28% {content: 'професуыжвшёфъжх хйисэр';}
  30% {content: 'професслрщбдыиуу цюхигъ';}
  32% {content: 'профессимвэнцбмл аккмхщ';}
  34% {content: 'профессиодобищяг йижзкъ';}
  36% {content: 'профессисдкощьр этюёохг';}
  38% {content: 'профессиьцескц йцжцфоыю';}
  40% {content: 'профессиочфмця ймртоэцн';}
  42% {content: 'профессидцйдд вакказвот';}
  44% {content: 'профессинйвгв ъдшлпгльд';}
  46% {content: 'профессиныщзю убрьудмбж';}
  48% {content: 'профессиныеъ щлйкбныяяе';}
  50% {content: 'профессиные еклчгтеизьэ';}
  52% {content: 'профессиные бркйщчзатдс';}
  54% {content: 'профессиные эивгнтсгрщэ';}
  56% {content: 'профессиные ммшзфиаштыи';}
  58% {content: 'профессиные ммяавбхчвсе';}
  60% {content: 'профессиные ммуникаююеж';}
  100% {content: 'профессиные ммуникаююеж';}
} */

/*scrollbar*/
/* width */
::-webkit-scrollbar {
  width: 3px;
}

/* bg */
::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.1); 
}
 
/* block */
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb:hover {
  background: rgb(247, 247, 247); 
}

/* selection text */

::-moz-selection {
  /* for Firefox  */
  background: #495a79;
}
::selection {
  background: #495a79;
}