#base {
  width: 500px;
  height: 500px;
  background-image: url(imgs/scheda/bg_scheda.png);
  background-repeat: no-repeat;
  position: fixed;
  top: 50%;
  margin-top: -250px;
  left: 50%;
  margin-left: -250px;
  }
  
  .skeda {
  font-family: Trebuchet MS;
  font-size: 11px;
  color: #3d3d3d;
  }
  
  
  
  .reduce {
  width: 15px;
  height: 20px;
  background-image: url(imgs/scheda/reduce.png);
  background-repeat: no-repeat;
  position: absolute;
  top: -2px;
  right: 42px;
  }
  
  .exit {
  width: 15px;
  height: 20px;
  background-image: url(imgs/scheda/exit.png);
  background-repeat: no-repeat;
  position: absolute;
  top: -2px;
  right: 20px;
  }
  
  .barre {
  width: 500px;
  height: 32px;
  background-color: #f3c400;
  position: absolute;
  top: 40px;
  left: 0px;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  }
  
  .salute {
  width: 126px;
  height: 15px;
  position: absolute;
  left: 10px;
  top: 4px;
  background-image: url(imgs/scheda/container_salute.png);
  background-repeat: no-repeat;
  background-size: 126px 15px;
  font-size: 7px;
  text-align: center;
  line-height: 6px;
  }
  
  .sbar {
  width: 100px;
  height: 5px;
  background-image: url(imgs/scheda/texture_salute.png);
  background-repeat: repeat-x;
  background-size: 1px 5px;
  position: absolute;
  left: 3px;
  top: 4px;
  }
  
  .energia {
  width: 126px;
  height: 15px;
  position: absolute;
  left: 181px;
  top: 4px;
  background-image: url(imgs/scheda/container_energia.png);
  background-repeat: no-repeat;
  background-size: 126px 15px;
  font-size: 7px;
  text-align: center;
  line-height: 6px;
  }
  
  .ebar {
  width: 100px;
  height: 5px;
  background-image: url(imgs/scheda/texture_energia.png);
  background-repeat: repeat-x;
  background-size: 1px 5px;
  position: absolute;
  left: 3px;
  top: 4px;

  }
  
  .ambizione {
  width: 138px;
  height: 19px;
  position: absolute;
  right: 8px;
  top: 4px;
  background-image: url(imgs/scheda/container_ambizione.png);
  background-repeat: no-repeat;
  background-size: 138px 19px;
  font-size: 7px;
  text-align: center;
  line-height: 6px;
  }
  
  .abar {
  width: 100px;
  height: 5px;
  background-image: url(imgs/scheda/texture_ambizione.png);
  background-repeat: repeat-x;
  background-size: 1px 5px;
  position: absolute;
  left: 3px;
  top: 4px;

  }
  
  .stats {
  width: 496px;
  height: 33px;
  position: absolute;
  top: 75px;
  left: 2px;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  }
  
  .forza {
  width: 75px;
  height: 28px;
  background-image: url(imgs/scheda/container_forza.png);
  background-repeat: no-repeat;
  background-size: 75px 28px;
  position: absolute;
  top: 2px;
  left: 14px;
  }
  
  .destrezza {
  width: 75px;
  height: 28px;
  background-image: url(imgs/scheda/container_destrezza.png);
  background-repeat: no-repeat;
  background-size: 75px 28px;
  position: absolute;
  top: 2px;
  left: 110px;
  }
  
  .resistenza {
  width: 75px;
  height: 28px;
  background-image: url(imgs/scheda/container_resistenza.png);
  background-repeat: no-repeat;
  background-size: 75px 28px;
  position: absolute;
  top: 2px;
  left: 209px;
  }
  
  .sensi {
  width: 75px;
  height: 28px;
  background-image: url(imgs/scheda/container_sensi.png);
  background-repeat: no-repeat;
  background-size: 75px 28px;
  position: absolute;
  top: 2px;
  left: 308px;
  }
  
  .spirito {
  width: 75px;
  height: 28px;
  background-image: url(imgs/scheda/container_spirito.png);
  background-repeat: no-repeat;
  background-size: 75px 28px;
  position: absolute;
  top: 2px;
  right: 17px;
  }
  
  .statsbox {
  width: 25px;
  height: 16px;
  position: absolute;
  bottom: 3px;
  left: 41px;
  font-size: 15px;
  line-height: 16px;
  font-family: Georgia;
  color: #fff;
  }
  
  .lvs {
  width: 496px;
  height: 33px;
  position: absolute;
  top: 112px;
  left: 2px;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  }
  
  .lvsbox {
  width: 11px;
  height: 13px;
  position: absolute;
  bottom: 2px;
  right: 4px;
  font-size: 12px;
  line-height: 13px;
  font-family: Georgia;
  color: #fff;
  }
  
  .medicina {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  left: 25px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .tecnica {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  left: 109px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .scienza {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  left: 191px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .cultura {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  left: 268px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .navigazione {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  left: 346px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .arte {
  width: 48px;
  height: 33px;
  position: absolute;
  top: 0;
  right: 28px;
  background-image: url(imgs/scheda/container_tecnica.png);
  background-repeat: no-repeat;
  background-size: 48px 33px;
  }
  
  .tbicons {
  width: 500px;
  height: 52px;
  position: absolute;
  top: 150px;
  left: 0px;
  background-color: #f3c400;
  text-align: center;
  }
  
  table.tbiconz {
  width: 500px;
  height: 48px;
  border: 0;
  padding: 0;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-crisp-edges;
    image-rendering: pixelated;
  }
  
  
  table.tbiconz thead th {
      max-height: 7px;
      padding: 0;
  }
  
  table.tbiconz tbody td {
      min-width: 27px;
      height: 27px;
      background-color: #3d3d3d;
      font-size: 4px;
      text-align: center;
      
  }
  
  
  .gifbox {
  width: 25px;
  height: 25px;
  position: relative;
  left: 50%;
  margin-left: -12px;
  }
  
  .avatarsk {
  width: 470px;
  height: 290px;
  background-color: #3d3d3d;
  border: 2px solid #3d3d3d;
  position: absolute;
  left: 13px;
  bottom: 31px;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  }

  .ritratto_avatar_immagine {
    width: 470px;
    height: 290px;
    position: absolute;
  }
  
  
  .navi {
    position: absolute;
    bottom: 0;
    width: 500px;
    height: 21px;
    background-color: #f3d400;
    text-align: center;
  }
  
  .navi1, .navi2, .navi3, .navi4, .navi5, .navi6, .navi7 {
      
      background-color: #f3d400;
      font-size: 8px;
      color: #fff;
      position: absolute;
      bottom: 0;
      font-family: '8BIT WONDER';
      text-transform: uppercase;
      line-height: 15px;
      letter-spacing: 1px;
      font-weight: 100;
      padding: 3px;
  }
  
  .navi1 {
      width: 65px;
      left: 0px;
      border-radius: 0px 0px 5px 5px;
  }
  
  .navi2 {
      width: 30px;
      left: 76px;
      border-radius: 0px 0px 5px 5px;
  }
  
  .navi3 {
      width: 57px;
      left: 117px;
      border-radius: 0px 0px 5px 5px;
  }
  
  .navi4 {
      width: 75px;
      left: 185px;
      border-radius: 0px 0px 5px 5px;
  }
  
  .navi5 {
      width: 71px;
      left: 271px;
      border-radius: 0px 0px 5px 5px;
  }
  
   .navi6 {
      width: 40px;
      right: 101px;
      border-radius: 0px 0px 5px 5px;
  }
  
   .navi7 {
      width: 90px;
      right: 0px;
      border-radius: 0px 0px 5px 5px;
  }
  
   .navi8 {
      width: 40px;
      right: 0;
      border-radius: 0px 0px 5px 5px;
  }
  
  
.navi1:hover, .navi2:hover, .navi3:hover, .navi4:hover, .navi5:hover, .navi6:hover, .navi7:hover {
  background: #f39d00;
}




.contavciurme {
  width: 480px;
  height: 300px;
  position: absolute;
  bottom: 134px;
  left: 10px;
  }
  
  .contavrogciurme {
  width: 390px;
  height: 230px;
  position: absolute;
  top: 33px;
  left: 42px;
  text-align: center;
  }
  
  .topframeciurme {
  width: 474px;
  height: 170px;
  background-image: url(imgs/ciurme/wooden.png);
  position: absolute;
  top: 12px;
  left: 13px;
  }
  
  .circciurme {
  width: 40px;
  height: 40px;
  background-color: #3d3d3d;
  border-radius: 20px;
  position: absolute;
  bottom: 17px;
  box-shadow: inset 0 0 2px 3px rgba(0,0,0,0.1);
  border: 1px solid #6b370b;
  }
  
  .circciurme img {
  position: absolute;
  top: 8px;
  left: 8px;
  }
  
  .pergamociurma {
  position: absolute;
  top: 7px;
  left: 7px;
  width: 484px;
  height: 60px;
  background-color: #cdcdcd;
  box-shadow: inset 0 0 2px 3px rgba(0,0,0,0.2);
  border: 1px solid #72330a;
  border-radius: 6px;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  background-image: url('imgs/ciurme/wood.png');
  background-repeat: repeat;
  }
  
    .pergamonameciurma {
  width: 470px;
  height: 46px;
  position: absolute;
  top: 3px;
  left: 14px;
  color: transparent;
  font-family: 'Futura';
  text-transform: uppercase;
  line-height: 46px;
  font-size: 32px;
  letter-spacing: 1px;
    -webkit-background-clip: text;
    background-clip: text;
  text-align: center;
  -webkit-text-stroke: 1px #000;
  font-weight: 1000;
  background-image: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
  background-image: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(1%, rgba(255,255,255,1)), color-stop(14%, rgba(255,246,194,1)), color-stop(40%, rgba(255,216,35,1)), color-stop(50%, rgba(208,115,1,1)), color-stop(100%, rgba(255,204,0,1)));
  background-image: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
  background-image: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
  background-image: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
  background-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,246,194,1) 14%, rgba(255,216,35,1) 40%, rgba(208,115,1,1) 50%, rgba(255,204,0,1) 100%);
  }
  
  .intciurme {
  color: #6f4b25;
  font-family: Georgia;
  font-size: 9px;
  position: absolute;
  top: 59px;
  right: 40px;
  text-align: right;
  }
  
  .surnameciurme {
  color: #930606;
  font-size: 10px;
  font-style: oblique;
  }
  
  .iconbarciurme {
  width: 500px;
  height: 35px;
  position: absolute;
  bottom: 12px;
  }
  
  .iconhomeciurme {
  background-image: url(imgs/ciurme/iconhome.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconhomeciurme:active {
  background-image: url(imgs/ciurme/iconhomepush.png);
  }
  
  .iconinfociurme {
  background-image: url(imgs/ciurme/iconinfo.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconinfociurme:active {
  background-image: url(imgs/ciurme/iconinfopush.png);
  }
  
  .iconbgciurme {
  background-image: url(imgs/ciurme/iconbg.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconbgciurme:active {
  background-image: url(imgs/ciurme/iconbgpush.png);
  }
  
  .iconskillciurme {
  background-image: url(imgs/ciurme/iconskill.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconskillciurme:active {
  background-image: url(imgs/ciurme/iconskillpush.png);
  }
  
  .iconoggetticiurme {
  background-image: url(imgs/ciurme/iconoggetti.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconoggetticiurme:active {
  background-image: url(imgs/ciurme/iconoggettipush.png);
  }
  .press-button:hover {
    box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.3);
    transform: translateY(1px);
  }
  
  .iconlogciurme {
  background-image: url(imgs/ciurme/iconlog.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconlogciurme:active {
  background-image: url(imgs/ciurme/iconlogpush.png);
  }
  
  .iconmodificaciurme {
  background-image: url(imgs/ciurme/iconmodifica.png);
  background-repeat: no-repeat;
  background-size: 35px 35px;
  width: 35px;
  height: 35px;
  }
  
  .iconmodificaciurme:active {
  background-image: url(imgs/ciurme/iconmodificapush.png);
  }
  
  .iconhomeciurme, .iconinfociurme, .iconbgciurme, .iconskillciurme, .iconoggetticiurme, .iconlogciurme, .iconmodificaciurme {
  position: absolute;
  top: 0;
  }
  
  .iconhomeciurme {left: 25px;}
  
  .iconinfociurme {left: 125px;}
  
  .iconbgciurme {left: 225px;}
  
  .iconlogciurme {left: 330px;}
  
  .iconmodificaciurme {left: 440px;}
  
  .riquadrobgciurme {
  width: 458px;
  height: 500px;
  padding: 10px;
  border-radius: 5px;
  background-color: #225979;
  position: absolute;
  bottom: 58px;
  left: 10px;
  box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
  overflow: auto;
  color: #fff;
  text-align: justify;
  font-size: 11px;
  line-height: 14px;
  font-family: Trebuchet;
  }
  
  .ciurmaint {
  width: 496px;
  height: 80px;
  position: absolute;
  image-rendering: -moz-crisp-edges;
  image-rendering: -webkit-crisp-edges;
  image-rendering: pixelated;
  left: 2px;
  top: 69px;
  }
  
  .ciurmaint1, .ciurmaint2, .ciurmaint3 {
  width: 34px;
  height: 34px;
  border-radius: 17px;
  background-color: #225979;
  position: absolute;
  top: 5px;
  box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
  }
  
  .ciurmaint1 img, .ciurmaint2 img, .ciurmaint3 img {
  position: absolute;
  top: 5px;
  left: 5px;
  }
  
  .ciurmaint1 { left: 90px; }
  .ciurmaint2 { left: 234px; }
  .ciurmaint3 { left: 374px; }
  
  
  
  .appeso, .appeso2, .appeso3 {
  width: 120px;
  height: 80px;
  position: absolute;
  text-align: center;
  color: #fff;
  font-family: Verdana;
  font-style: italic;
  font-size: 12px;
  }
  
  .appeso { left: 48px; }
  .appeso2 { left: 190px; }
  .appeso3 { left: 330px; }
  
  .appesint, .appesint2, .appesint3 {
  width: 114px;
  line-height: 18px;
  text-align: center;
  height: 18px;
  font-family: Verdana;
  font-size: 10px;
  font-style: italic;
  color: #fff;
  position: absolute;
  bottom: 3px;
  }
  
  .appesint { left: 51px; }
  .appesint2 { left: 193px; }
  .appesint3 { left: 333px; }
  
  .appesint img {
  position: relative; 
  top: 1px;
  }
  
  .armybox, .foodbox, .woodbox, .metalbox, .typebox {
  width: 150px;
  height: 25px;
  background-color: #225979;
  box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
  border-radius: 6px;
  position: absolute;
  }
  
  .armybox { top: 464px; left: 340px; }
  .foodbox { top: 502px; left: 175px; }
  .woodbox { top: 502px; left: 340px; }
  .metalbox { top: 502px; left: 10px; }
  .typebox { top: 464px; left: 10px; }
  
  
  
  .armybox img, .foodbox img, .woodbox img, .metalbox img, .typebox img {
  float: left;
  position: relative;
  top: -5px;
  left: 5px;
  }
  
  .basebox {
  width: 480px;
  height: 300px;
  background-color: #707070;
  position: absolute;
  top: 10px;
  left: 10px;
  box-shadow: inset 0 0 0 1px #000, inset 0 0 0 2px green, inset 0 0 0 3px blue;
  border-radius: 8px;
  }
  
  .baseimg {
  width: 330px;
  height: 120px;
  position: absolute;
  top: 38px;
  left: 10px;
  border: 1px solid #000;
  }
  
  .basehex {
  width: 135px;
  height: 120px;
  position: absolute;
  top: 38px;
  right: 10px;
  border: transparent solid #000;
  text-align: center;
  }
  
  .basedesc {
  width: 480px;
  height: 20px;
  line-height: 20px;
  font-family: Georgia;
  color: #fff;
  font-size: 13px;
  position: absolute;
  top: 10px;
  left: 10px;
  text-align: center;
  }
  
  .nomebase {
  font-style: oblique;
  color: #f2ca0b;
  }
  
  .membri {
  width: 480px;
  height: 360px;
  position: absolute;
  top: 170px;
  left: 10px;
  }
  
  
  .tabmembri {
  width: 100%;
  text-align: center;
  }
  
  .tabmembri th {
  color: #41a0d7;
  font-family: Georgia;
  font-variant: small-caps;
  font-size: 14px;
  }
  
  .tabimg {
  width: 27px;
  height: 27px;
  }
  
  .tabnm {
  width: 200px;
  height: 27px;
  }
  
  .tabimg, .tabnm {
  background-color: #225979;
  box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
  border-radius: 6px;
  font-family: Trebuchet MS;
  font-size: 11px;
  color: #fff;
  }
  
  .tabspacer {
  width: 30px;
  height: 27px;
  }
  
  .riquadrostatuto {
  width: 458px;
  height: 500px;
  padding: 10px;
  border-radius: 5px;
  background-color: #225979;
  position: absolute;
  bottom: 58px;
  left: 10px;
  box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
  overflow: auto;
  color: #fff;
  text-align: justify;
  font-size: 11px;
  line-height: 14px;
  font-family: Trebuchet MS;
  } 

.pagina_scheda_skill {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 5px;
    background-color: #225979;
    box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.1);
    align-items: center;
    margin-top: 10px;
    margin-inline: 10px;
    gap:5px;
    max-height: 530px;
}
  .riquadroskill {
      width: 478px;
      
  }

  .tabsk {
      width: 478px;
      height: 29px;
      text-align: center;
      border-collapse: collapse;
      image-rendering: -moz-crisp-edges;
      image-rendering: -webkit-crisp-edges;
      image-rendering: pixelated;
      display: flex;
      justify-content: center;
  }

  td.tabsk {
      text-align: center;
  }

  .sk1,
  .sk2,
  .sk3,
  .sk4 {
      width: 117px;
      height: 25px;
      cursor: pointer;
  }

  .sk1:hover,
  .sk2:hover,
  .sk3:hover,
  .sk4:hover {
      content: "";
      display: block;
      position: relative;
      top: 3px;
  }

  div#skill {
      height: 492px;
      overflow: auto;
      position: relative;
      width: 475px;
  }

            .skillcont {
            position: relative;
            left: 50%;
            margin-left: -250px;
            top: 30%;
            width: 500px;
            height: 700px;
            background-color: #f39d00;
            font-family: Trebuchet MS;
            font-size: 11px;
            color: #000;
            border: 1px solid black;
            box-shadow: 2px 2px 0 0 rgba(0,0,0,0.2);
            }
            
            .requisiti {
                display: block;
                width: 400px;
                min-height: 50px;
                background: #fa2323;
                top: 506px;
                left: 50px;
                border-radius: 8px;
                -moz-transform:rotate(0);
                -webkit-transform:rotate(0);
                -ms-transform:rotate(0);
                -o-transform:rotate(0);
                transform:rotate(0);
                -webkit-transform: perspective(1px) translateZ(0);
                  transform: perspective(1px) translateZ(0);
                box-shadow: 0 0 0 2px #c60b0b inset, 0 0 0 4px #e51919 inset;
                margin:auto;
                padding:2px;
                margin-bottom:10px;
            }
                .requisiti:before {
                    content:"";
                    width: 0;
                    height: 0;
                    position:absolute;
                    right:100%;
                    top: -15px;
                    left: 185px;
                    border-right: 15px solid transparent;
                    border-bottom: 15px solid #c60b0b;
                    border-left: 15px solid transparent;
                }
             
             .requisiti:hover,.requisiti:focus, .requisiti:active {
                  -webkit-animation-name: bob-float, bob;
                  animation-name: bob-float, bob;
                  -webkit-animation-duration: .3s, 1.5s;
                  animation-duration: .3s, 1.5s;
                  -webkit-animation-delay: 0s, .3s;
                  animation-delay: 0s, .3s;
                  -webkit-animation-timing-function: ease-out, ease-in-out;
                  animation-timing-function: ease-out, ease-in-out;
                  -webkit-animation-iteration-count: 1, infinite;
                  animation-iteration-count: 1, infinite;
                  -webkit-animation-fill-mode: forwards;
                  animation-fill-mode: forwards;
                  -webkit-animation-direction: normal, alternate;
                  animation-direction: normal, alternate;
                }
                
                
                @-webkit-keyframes bob {
                  0% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                  50% {
                    -webkit-transform: translateY(-4px);
                    transform: translateY(-4px);
                  }
                  100% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                }
                @keyframes bob {
                  0% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                  50% {
                    -webkit-transform: translateY(-4px);
                    transform: translateY(-4px);
                  }
                  100% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                }
                @-webkit-keyframes bob-float {
                  100% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                }
                @keyframes bob-float {
                  100% {
                    -webkit-transform: translateY(-8px);
                    transform: translateY(-8px);
                  }
                }
                
                
             .requisiti_testo {
             color: #fff;
             font-family: Verdana;
             line-height: 13px;
             font-size: 11px;
             text-align: center;
             margin: 5px;
             }
             
             .compraskill {
             bottom: 70px;
             margin: auto;
             width: 300px;
             height: 20px;
             border-radius: 8px;
             box-shadow: 0 0 0 2px #078324 inset, 0 0 0 4px #09af30 inset;
             background-color: #0ccf3a;
             padding: 5px;
             color: #fff;
             line-height: 20px;
             text-align: center;
             font-family: Verdana;
             font-size: 11px;
             cursor:pointer;
             }
             
             .upgradeskill {
             bottom: 30px;
             left: 50%;
             margin-left: -150px;
             width: 300px;
             height: 20px;
             border-radius: 8px;
             box-shadow: 0 0 0 2px #09749b inset, 0 0 0 4px #0b91c3 inset;
             background-color: #0ca7e1;
             padding: 5px;
             color: #fff;
             line-height: 20px;
             text-align: center;
             font-family: Verdana;
             font-size: 11px;
             margin:auto;
             cursor:pointer;
             }
             
/* INIZIO SKILL CSS*/

/* Variabili per i colori */
:root {
    --skillbox-bg-color-6: #147b20;
    --skillbox-bg-color-3: #137073;
    --skillbox-bg-color-4: #801515;
    --skillbox-bg-color-5: #0a587d;
    --skillbox-bg-color-2: #7e2267;
    --skillbox-bg-color-1: #625d62;
    --skillbox-bg-color-7: #0a587d;
    --skillbox-bg-color-8: #af731d;
    --nome-skill-bg-color-6: #31c944;
    --nome-skill-bg-color-3: #34b8bc;
    --nome-skill-bg-color-1: #625d62;
    --nome-skill-bg-color-2: #ae2e8e;
    --nome-skill-bg-color-4: #c33434;
    --nome-skill-bg-color-5: #1a79a7;
    --nome-skill-bg-color-7: #1a79a7;
    --nome-skill-bg-color-8: #d7891a;
    --desc-bg-color: #fbf6c3;
    --text-color-yellow: #ffe400;
    --text-color-green: #38d54b;
    --text-color-cyan: #30d6dc;
    --text-color-red: #d43636;
    --text-color-magenta: #d42aab;
    --text-color-light-blue: #2aa1db;
    --text-color-gray: #9b979a;
    --text-color-light-brown: #c5b695;
}

/* Stile generale per tutte le skillbox */
.skillbox {
    width: 400px;
    border: 1px solid black;
    border-radius: 8px;
    margin:20px auto;
}

/* Stile per il titolo della skill */
.nome_skill {
    position: relative;
    margin: 2px;
    width: calc(100% - 4px);
    height: 22px;
    text-align: center;
    font-family: Georgia;
    font-weight: 600;
    font-size: 13px;
    line-height: 22px;
    letter-spacing: 1px;
    border-radius: 6px;
    color: var(--text-color-yellow);
}

/* Descrizione comune */
.desc_skill {
    position: relative;
    margin: 2px;
    width: calc(100% - 30px);
    min-height: 20px;
    padding: 13px;
    line-height: 13px;
    text-align: justify;
    font-family: "Trebuchet MS";
    font-size: 11px;
    color: #000;
    background-color: var(--desc-bg-color);
}

/* Riga 1 generale */
.r1_skill {
    position: relative;
    margin: 2px;
    width: calc(100% - 4px);
    height: 35px;
    text-align: center;
    font-size: 11px;
}

.r1a,
.r2a,
.r3a,
.r4a {
    height: 100%;
    position: absolute;
}

.r1a {
    width: 60px;
}

.r2a {
    width: 111px;
    margin-left: 60px;
}

.r3a {
    width: 111px;
    margin-left: 171px;
}

.r4a {
    width: 114px;
    margin-left: 282px;
}

/* Elementi comuni alle righe top e bottom */
.rtop,
.rb {
    width: 100%;
    position: absolute;
    color: #fff;
}

.rtop {
    height: 15px;
    top: 0;
    text-transform: uppercase;
    line-height: 15px;
}

.rb {
    height: 20px;
    bottom: 0;
    background-color: var(--desc-bg-color);
    line-height: 20px;
    color: #000;
}

/* Riga 2 generale */
.r2_skill {
    position: relative;
    margin: 2px;
    margin-bottom: 0;
    width: calc(100% - 4px);
    min-height: 20px;
    line-height: 14px;
    text-align: center;
    font-style: italic;
    font-size: 11px;
    border-radius: 0 0 6px 6px;
}

/* Specifici per la skillbox 1 */
.skillbox1 {
    background-color: var(--skillbox-bg-color-1);
}

.nome_skill1 {
    background-color: var(--nome-skill-bg-color-1);
    background-image: url('imgs/bg_fru.png');
    background-repeat: no-repeat;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-crisp-edges;
    image-rendering: pixelated;
}

.r2_skill1 {
    background-color: var(--skillbox-bg-color-1);
    color: var(--text-color-gray);
}

/* Specifici per la skillbox 2 */
.skillbox2 {
    background-color: var(--skillbox-bg-color-2);
}

.nome_skill2 {
    background-color: var(--nome-skill-bg-color-2);
}

.r2_skill2 {
    background-color: var(--skillbox-bg-color-2);
    color: var(--text-color-magenta);
}

/* Specifici per la skillbox 3 */
.skillbox3 {
    background-color: var(--skillbox-bg-color-3);
}

.nome_skill3 {
    background-color: var(--nome-skill-bg-color-3);
}

.r2_skill3 {
    background-color: var(--skillbox-bg-color-3);
    color: var(--text-color-cyan);
}

/* Specifici per la skillbox 4 */
.skillbox4 {
    background-color: var(--skillbox-bg-color-4);
}

.nome_skill4 {
    background-color: var(--nome-skill-bg-color-4);
}

.r2_skill4 {
    background-color: var(--skillbox-bg-color-4);
    color: var(--text-color-red);
}


/* Specifici per la skillbox 5 */
.skillbox5 {
    background-color: var(--skillbox-bg-color-5);
}

.nome_skill5 {
    background-color: var(--nome-skill-bg-color-5);
}

.r2_skill5 {
    background-color: var(--skillbox-bg-color-5);
    color: var(--text-color-light-blue);
}

/* Specifici per la skillbox 6 */
.skillbox6 {
    background-color: var(--skillbox-bg-color-6);
}

.nome_skill6 {
    background-color: var(--nome-skill-bg-color-6);
}

.r2_skill6 {
    background-color: var(--skillbox-bg-color-6);
    color: var(--text-color-green);
}

/* Specifici per la skillbox 7 */
.skillbox7 {
    background-color: var(--skillbox-bg-color-7);
}

.nome_skill7 {
    background-color: var(--nome-skill-bg-color-7);
}

.r2_skill7 {
    background-color: var(--skillbox-bg-color-7);
    color: var(--text-color-light-blue);
}

/* Specifici per la skillbox 8 */
.skillbox8 {
    background-color: var(--skillbox-bg-color-8);
}

.nome_skill8 {
    background-color: var(--nome-skill-bg-color-8);
}

.r2_skill8 {
    background-color: var(--skillbox-bg-color-8);
    color: var(--text-color-light-brown);
}             

        .contav {
            width: 470px;
            height: 290px;
            border: 1px solid #000;
            background-color: #3d3d3d;
            position: absolute;
            bottom: 110px;
            left: 14px;
            }
            
            .bars {
            width: 474px;
            height: 35px;
            position: absolute;
            left: 14px;
            bottom: 64px;
            image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
            }
            
            .ambnum, .salnum, .enenum {
            font-family: Verdana;
            font-size: 8px;
            color: #fff;
            position: absolute;
            top: 17px;
            text-align: center;
            image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
            }
            
            .ambnum {
            left: 21px;
            text-align: center;
            width: 90px;
            }
            
            .salnum {
            left: 190px;
            text-align: center;
            width: 90px;
            }
            
            .enenum {
            left: 349px;
            text-align: center;
            width: 90px;
            }
            
            .salnumsf, .enenumsf, .ambnumsf {
            width: 90px;
            height: 20px;
            border-radius: 0 0 5px 5px;
            background-color: #225979;
            position: absolute;
            top: 14px;
            box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
            }
            
            .salnumsf {
            left: 190px;
            }
            
            .enenumsf {
            left: 348px;
            }
            
            .ambnumsf {
            left: 20px;
            }
            
            .topframe {
            width: 474px;
            height: 170px;
            background-image: url(imgs/new_sk/wooden.png);
            position: absolute;
            top: 12px;
            left: 13px;
            }
            
            .circ {
            width: 40px;
            height: 40px;
            background-color: #3d3d3d;
            border-radius: 20px;
            position: absolute;
            bottom: 17px;
            box-shadow: inset 0 0 2px 3px rgba(0,0,0,0.1);
            border: 1px solid #6b370b;
            }
            
            .circ img {
            position: absolute;
            top: 8px;
            left: 8px;
            }
            
            .circ.ciorc{    position: absolute;
    top: 97px;}
    
    .circ.ciorc.manichiciarc {
        
        width: initial;
            height: initial;
            background-color: initial;
            border-radius: initial;;
            position: absolute;
            border:0;
            box-shadow: initial;;
           
        
    }
            
            .pergamo {
            position: absolute;
            top: 20px;
            left: 1px;
            width: 498px;
            height: 60px;
            background-image: url(imgs/new_sk/pergamo.png);
            background-repeat: repeat;
            image-rendering: -moz-crisp-edges;
            image-rendering: -webkit-crisp-edges;
            image-rendering: pixelated;
            }
            
            
            
            .pergamoname {
            width: 470px;
            height: 46px;
            position: absolute;
            top: 3px;
            left: 14px;
            color: #3d3d3d;
            font-family: 'Targa';
            text-transform: uppercase;
            line-height: 46px;
            font-size: 26px;
            letter-spacing: 1px;
            text-align: center;
            }
            
            .int {
            color: #6f4b25;
            font-family: Georgia;
            font-size: 9px;
            position: absolute;
            top: 59px;
            right: 40px;
            text-align: right;
            }
            
            .surname {
            color: #930606;
            font-size: 10px;
            font-style: oblique;
            }
            
            .iconbar {
            width: 500px;
            height: 35px;
            position: absolute;
            bottom: 12px;
            }
            
            .iconhome {
            background-image: url(imgs/new_sk/iconhome.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconhome:active {
            background-image: url(imgs/new_sk/iconhomepush.png);
            }
            
            .iconinfo {
            background-image: url(imgs/new_sk/iconinfo.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconinfo:active {
            background-image: url(imgs/new_sk/iconinfopush.png);
            }
            
            .iconbg {
            background-image: url(imgs/new_sk/iconbg.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconbg:active {
            background-image: url(imgs/new_sk/iconbgpush.png);
            }
            
            .iconskill {
            background-image: url(imgs/new_sk/iconskill.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconskill:active {
            background-image: url(imgs/new_sk/iconskillpush.png);
            }
            
            .iconoggetti {
            background-image: url(imgs/new_sk/iconoggetti.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }

            .iconoggetti2 {
              background-image: url(imgs/new_sk/iconoggetti.png);
              background-repeat: no-repeat;
              background-size: 35px 35px;
              width: 35px;
              height: 35px;
              }
            
            .iconoggetti:active {
                background-image: url(imgs/new_sk/iconoggettipush.png);
            }
            
            .iconlog {
            background-image: url(imgs/new_sk/iconlog.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconlog:active {
            background-image: url(imgs/new_sk/iconlogpush.png);
            }
            
            .iconmodifica {
            background-image: url(imgs/new_sk/iconmodifica.png);
            background-repeat: no-repeat;
            background-size: 35px 35px;
            width: 35px;
            height: 35px;
            }
            
            .iconmodifica:active {
            background-image: url(imgs/new_sk/iconmodificapush.png);
            }
            
            .iconhome, .iconinfo, .iconbg, .iconskill, .iconoggetti, .iconoggetti2, .iconlog, .iconmodifica {
            position: absolute;
            top: 0;
            }
            
            .iconhome {left: 25px;}
            
            .iconinfo {left: 95px;}
            
            .iconbg {left: 165px;}
            
            .iconskill {left: 235px;}
            
            .iconoggetti {left: 300px;}

            .iconoggetti2{
              left: 345px;
            }
            
            .iconlog {left: 370px;}
            
            .iconmodifica {left: 440px;}
                        
            .riquadrobg {
            width: 459px;
            height: 500px;
            padding: 10px;
            border-radius: 5px;
            background-color: #225979;
            position: absolute;
            bottom: 58px;
            left: 11px;
            box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
            overflow: auto;
            color: #fff;
            text-align: justify;
            font-size: 14px;
            line-height: 14px;
            font-family: Trebuchet;
            image-rendering: -moz-crisp-edges;
            image-rendering: -webkit-crisp-edges;
            image-rendering: pixelated;
            }
            
           
            
            
            .riquadrostats {
            width: 478px;
            height: 200px;
            border-radius: 5px;
            position: absolute;
            left: 11px;
            top: 11px;
            image-rendering: -moz-crisp-edges;
            image-rendering: -webkit-crisp-edges;
            image-rendering: pixelated;
            }
            
            .boxstats {
            position: absolute;
            width: 252px;
            height: 153px;
            top: 10px;
            left: 15px;
            }
            
            .boxfrz, .boxagi, .boxres, .boxsns, .boxspi {
            width: 252px;
            height: 29px;
            position: absolute;
            left: 0;
            background-size: 252px 29px;
            }
            
            .boxfrz { top: 0; }
            .boxagi { top: 30px; }
            .boxres { top: 62px; }
            .boxsns { top: 91px; }
            .boxspi { top: 124px; }
            
            .statsbar {
            position: absolute;
            top: 17px;
            left: 28px;
            width: 200px;
            height: 5px;
            }
            
            .statsnum {
            position: absolute;
            right: 5px;
            top: 16px;
            width: 16px;
            height: 7px;
            background-color: #d57c02;
            }
            
            .statsnum img {
            position: relative;
            float: left;
            top: 1px;
            left: 1px;
            }
            
            .boxhaki {
            position: absolute;
            top: 10px;
            right: 15px;
            width: 160px;
            height: 185px;
            }
            
            .boxhakiint {
            position: absolute;
            top: 0;
            left: 0;
            width: 160px;
            height: 20px;
            color: #fff;
            font-family: 'Targa';
            letter-spacing: 3px;
            font-size: 18px;
            text-transform: uppercase;
            text-align: center;
            line-height: 20px;
            }
            
            .boxhakitipo {
            position: absolute;
            top: 24px;
            left: 0px;
            width: 120px;
            height: 120px;
            background-color: #225979;
            box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
            border-radius: 5px;
            }
            
            .boxhakitipo img {
            position: absolute;
            top: 2px;
            left: 3px;
            }
            
            .boxhakigif {
            position: absolute;
            top: 25px;
            right: 0px;
            width: 37px;
            height: 117px;
            text-align: center;
            }
            
            .riquadrotalenti {
            width: 478px;
            height: 70px;
            position: absolute;
            left: 11px;
            top: 198px;
            image-rendering: -moz-crisp-edges;
            image-rendering: -webkit-crisp-edges;
            image-rendering: pixelated;
            }
            
            .boxsci, .boxtec, .boxcul, .boxocc {
            position: absolute;
            top: 0;
            width: 50px;
            height: 50px;
            background-color: #225979;
            box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
            border-radius: 25px;
            }
            
            .lvsci, .lvtec, .lvcul, .lvocc {
            position: absolute;;
            bottom: 0px;
            width: 50px;
            height: 13px;
            }
            
            .boxsci, .lvsci { left: 45px; }
            .boxtec, .lvtec { left: 155px; }
            .boxcul, .lvcul { left: 265px; }
            .boxocc, .lvocc { left: 375px; }
            
            .riquadroinfo {
            width: 235px;
            height: 234px;
            position: absolute;
            bottom: 62px;
            left: 11px;
            }
            
            .riquadrosecondarie {
            width: 235px;
            height: 234px;
            position: absolute;
            bottom: 62px;
            right: 11px;
            }
            
            
            .infoline {
            width: 235px;
            height: 20px;
            line-height: 20px;
            position: relative;
            margin-top: 3px;
            border-bottom: 1px solid #1f506d;
            font-family: Georgia;
            font-size: 12px;
            font-style: oblique;
            color: #f3d400;
            }
            
            .infoarea {
            width: 120px;
            height: 16px;
            position: absolute;
            top: 0px;
            right: 0px;
            background-color: #225979;
            box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
            border-radius: 5px 5px 0 0;
            color: #fff;
            padding: 2px;
            line-height: 18px;
            text-align: center;
            font-family: Trebuchet MS;
            font-size: 10px;
            font-style: normal;
            }
            
            

            .topframeinventario {
              width: 480px;
              height: 35px;
              position: absolute;
              top: 8px;
              left: 10px;
              text-align: center;
              display: inline-flex;
              justify-content: space-around;
              }
              
              .pulsantearmi{
              background-image:url(imgs/new_sk/pulsantearmi.png);   
              width:90px;
              height:32px;
              background-repeat: no-repeat;
              }
              
              .pulsantearmi:active{
               background-image: url(imgs/new_sk/pulsantearmipush.png);   
              }
              
              .pulsanteoggetti{
              background-image:url(imgs/new_sk/pulsanteoggetti.png); 
              width:90px;
              height:32px;
              background-repeat: no-repeat;
              }
              
              .pulsanteoggetti:active{
              background-image:url(imgs/new_sk/pulsanteoggettipush.png);  
              }
              
              .pulsanteanimali{
              background-image:url(imgs/new_sk/pulsanteanimali.png);   
              width:90px;
              height:32px;
              background-repeat: no-repeat;
              }
              
              .pulsanteanimali:active{
              background-image:url(imgs/new_sk/pulsanteanimalipush.png);  
              }
              
              .pulsantemezzi{
              background-image:url(imgs/new_sk/pulsantemezzi.png); 
              width:90px;
              height:32px;
              background-repeat: no-repeat;
              }
              
              .pulsantemezzi:active{
              background-image:url(imgs/new_sk/pulsantemezzipush.png);
              }
              
              .pulsanterarita{
              background-image:url(imgs/new_sk/pulsanterarita.png);  
              width:90px;
              height:32px;
              background-repeat: no-repeat;
              }
              
              .pulsanterarita:active{
              background-image:url(imgs/new_sk/pulsanteraritapush.png);  
              }
              
              .containeroggetti {
              width: 465px;
              height: 306px;
              position: absolute;
              top: 46px;
              left: 20px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              text-align: center;
              overflow: auto;
              
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
              }
              
              .containeroggetti2 {
                height:206px;
                margin-top: 10px;
                left: 25px; 
                background-color:#225979; 
                box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
                border-radius: 5px;
                text-align: justify;
              }
              
              .mrcogdd {
                  border-radius:15px;
                  width:50px;
                  height:50px;
                  display:inline-block;
              }
              

              .imginventario {
              width: 50px;
              height: 50px;
              float: left;
              }
              
              .imginventario:hover {
              display: block;
              content: "";
              background-image: url(imgs/new_sk/selector.gif);
              }
              
              .imgmercato { /* mercato */
              width: 50px;
              height: 50px;
              float: left;
              position:inline-block;
              }
              
              .imgmercato:hover { /* mercato */
              display: block;
              content: "";
              background-image: url(imgs/new_sk/selector.gif);
              }
              
              .imgnumextra {
              min-width: 12px;
              height: 12px;
              border-radius: 6px;
              text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;

              color: #ffd200;
              line-height: 12px;
              font-size: 9px;
              font-family: 'Novinik';
              float: right;
              position: relative;
              top: -17px;
              right: 5px;
              }
              
              
              .imgoggetto { /*inventario scheda pg*/
              width: 150px;
              height: 150px;
              position: absolute;
              top: 358px;
              left: 21px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
              }
              
             .imgoggetto img { /*inventario scheda pg*/
                position: relative;
                top: 50px;
                left: 50px;
                
              }
              
               .imgoggetto2 {
              width: 150px;
              height: 150px;
              position: absolute;
              top: 258px;
              left: 26px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              }
              
               .imgoggetto2 img {
                  position: relative;
                  top: 50px;
                  left: 50px;
              }
              
              .qqoggetto { /*inventario scheda pg*/
              width: 150px;
              height: 20px;
              position: absolute;
              top: 512px;
              left: 21px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              line-height: 16px;
              text-align: center;
              
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
              }
              
              .qqoggetto img { /*inventario scheda pg*/
              position: relative;
              top: 1px;
              margin-right: 2px;
              }
              
               .qqoggetto2 { /*mercato*/
              width: 150px;
              height: 20px;
              position: absolute;
              top: 412px;
              left: 26px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              line-height: 16px;
              text-align: center;
              }
              
              .qqoggetto2 img { /*mercato*/
              position: relative;
              top: 1px;
              margin-right: 2px;
              }
              
              .descrizione_oggetto2 {
                  padding: 0;
              }
              
              .descoggetto { /*inventario scheda pg*/
              width: 280px;
              height: 130px;
              padding: 10px;
              position: absolute;
              top: 358px;
              right: 15px;
              line-height: 16px;
              font-size: 12px;
              color: #fff;
              font-family: "Trebuchet MS";
              font-weight: "Normal";
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              text-align: justify;
              overflow: auto;
              }
              
              .descoggetto2 { /*mercato*/
              width: 270px;
              height: 130px;
              padding: 10px;
              position: absolute;
              top: 258px;
              right: 26px;
              line-height: 13px;
              font-size: 12px;
              color: #fff;
              font-family: "Optima";
              font-weight: "Normal";
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              text-align: justify;
              overflow: auto;
              }
              
              .nomeoggetto {
              font-family: 'Trebuchet MS';
              font-size: 13px;
              color: #fff;
              font-weight: bold;
              text-shadow: 1px 1px rgba(0,0,0,0.4);
              }
              
              .suboggetto { /*inventario scheda pg*/
              width: 300px;
              height: 20px;
              position: absolute;
              top: 512px;
              right: 15px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              line-height: 18px;
              color: #41a0d7;
              font-family: Georgia;
              font-size: 12px;
              text-align: center;
              font-variant: small-caps;
              display: flex;
              flex-direction: row;
              justify-content: space-around;
              align-items: center;
              }
              
              .suboggetto2 {
              width: 290px;
              height: 20px;
              position: absolute;
              top: 412px;
              right: 26px;
              background-color: #225979;
              box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
              border-radius: 5px;
              line-height: 18px;
              color: #41a0d7;
              font-family: Georgia;
              font-size: 12px;
              text-align: center;
              font-variant: small-caps;
              }
              
              
              
    .upgradestat {
        margin: auto;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        /*--background-image: url(imgs/scheda/bgupgrade.png);--*/
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
           
    .upgradeblock {
            width: 450px;
            height: 70px;
            margin-left: 6px;
            background-image: url(imgs/scheda/upgrade_box.png);
            background-repeat: no-repeat;
        image-rendering: -moz-crisp-edges;
        image-rendering: -webkit-crisp-edges;
        image-rendering: pixelated;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            align-items: center;
            font-size: 13px;
    }       
    
    .upgradeblock:hover {
        position: relative;
        top: -3px;
    }
    
    .statslabel {
        font-family: 'Novinik';
        font-size: 8px;
        text-transform: uppercase;
        letter-spacing: 1px;
        height: 12px;
    }
    
    .statsval {
        font-family: 'Bebas Neue';
        font-size: 32px;
        letter-spacing: 1px;
        height: 32px;
        line-height: 32px;
    }
    
    input#Forza {
        background-image: url(imgs/scheda/button_frz_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
    #Forza:hover {
        background-image: url(imgs/scheda/button_frz_up.gif);
    }
    
    input#Destrezza {
        background-image: url(imgs/scheda/button_des_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
     #Destrezza:hover {
        background-image: url(imgs/scheda/button_des_up.gif);
    }
    
     input#Costituzione {
        background-image: url(imgs/scheda/button_cos_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
     #Costituzione:hover {
        background-image: url(imgs/scheda/button_cos_up.gif);
    }
    
    input#Sensi {
        background-image: url(imgs/scheda/button_sns_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
     #Sensi:hover {
        background-image: url(imgs/scheda/button_sns_up.gif);
    }
    
    input#Spirito {
        background-image: url(imgs/scheda/button_spi_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
     #Spirito:hover {
        background-image: url(imgs/scheda/button_spi_up.gif);
    }
    
    input#Scienza {
        background-image: url(imgs/scheda/button_sci_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
      #Scienza:hover {
        background-image: url(imgs/scheda/button_sci_up.gif);
    }
    
     input#Tecnica {
        background-image: url(imgs/scheda/button_tec_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
      #Tecnica:hover {
        background-image: url(imgs/scheda/button_tec_up.gif);
    }
    
     input#Cultura {
        background-image: url(imgs/scheda/button_cul_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
      #Cultura:hover {
        background-image: url(imgs/scheda/button_cul_up.gif);
    }
    
     input#Occulto {
        background-image: url(imgs/scheda/button_occ_up.png);
        background-color: none;
        border: 0;
        width: 55px;
        height: 55px;
        margin-right: 8px;
    }
    
      #Occulto:hover {
        background-image: url(imgs/scheda/button_occ_up.gif);
    }
    
    .expdisp {
        text-align: center;
        font-family: 'Georgia';
        font-size: 12px;
        margin-top: 4px;
    }
    
           
    .nomignoli {
        width: 37px;
        height: 16px;
        line-height: 16px;
        color: #fff;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        font-size: 18px;
        position: absolute;
        top: 80px;
        font-family: 'Bebas Neue';
        letter-spacing: 1px;
    }   
    
    
    .teststats {
        width: 260px;
        height: 260px;
        display: flex;
        flex-direction: column;
    }
    
    .teststat1 {
        width: 234px;
        height: 39px;
        background-image: url(imgs/scheda/box_frz.png);
        background-repeat: no-repeat;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
        .teststat2 {
        width: 234px;
        height: 39px;
        background-image: url(imgs/scheda/box_agi.png);
        background-repeat: no-repeat;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
    .teststat3 {
        width: 234px;
        height: 39px;
        background-image: url(imgs/scheda/box_sta.png);
        background-repeat: no-repeat;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
    
    .teststat4 {
        width: 234px;
        height: 39px;
        background-image: url(imgs/scheda/box_sns.png);
        background-repeat: no-repeat;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
    
    .teststat5 {
        width: 234px;
        height: 39px;
        background-image: url(imgs/scheda/box_spi.png);
        background-repeat: no-repeat;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
    
    .riquadroinfotest {
        width: 483px;
        height: 207px;
    background-color: #225979;
        border-radius: 5px;
        box-shadow: inset 0 0 2px 2px rgba(0,0,0,0.1);
    /**background-image: url(imgs/scheda/riquadro_info_test.png);**/
        background-repeat: no-repeat;
        margin-top: 330px;
        margin-left: 9px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
  
    
    .riquadroinfotestinner {
        width: 140px;
        height: 187px;
        margin: 5px;
        line-height: 8px;
        color: #ffd200;
        font-family: 'Novinik';
        font-size: 8px;
        text-align: left;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
    }
    
    
    .sbox {
        width: 120px;
        height: 25px;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        margin-right: 4px;
        
    }
    
    .sbox2 {
        height: 25px;
        width: 25px;
        float: left;
        margin-right: 4px;
    }
    
    .sbox3 {
        height: 25px;
        line-height: 9px;
        margin-top: 9px;
    }
    
    .riquadroinfotestinner img {
      
    }
    
    .bgstat {
        max-width: 206px;
        height: 31px;
        background-repeat: no-repeat;
        margin-top: 3px;
        margin-left: 25px;
    }
    
    .frz {
        background-image: url(imgs/scheda/bg_frz.png);
    }
    
     .agi {
        background-image: url(imgs/scheda/bg_agi.png);
    }
    
     .sta {
        background-image: url(imgs/scheda/bg_sta.png);
    }
    
     .sns {
        background-image: url(imgs/scheda/bg_sns.png);
    }
    
     .spi {
        background-image: url(imgs/scheda/bg_spi.png);
    }
    
    .hakiblock {
        width: 190px;
        height: 220px;
        position: absolute;
        top: 24px;
        right: 0;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    
    .armaturablock {
        width: 53px;
        height: 210px;
        background-image: url(imgs/scheda/button_busou_bloccato.png);
        background-repeat: no-repeat;
    }
    
    .armaturaselect:hover {
        background-image: url(imgs/scheda/busou_hover.gif);
    }
    
    .reblock {
        width: 78px;
        height: 218px;
        background-image: url(imgs/scheda/button_haou_bloccato.png);
        background-repeat: no-repeat;
    }
    
    
    .osservablock {
        width: 53px;
        height: 210px;
        background-image: url(imgs/scheda/button_kebun_bloccato.png);
        background-repeat: no-repeat;
    }
    
      .osservaselect:hover {
        background-image: url(imgs/scheda/kebun_hover.gif);
    }
    
    .hakire {
       width: 100%;
        height: 218px;
        background-image: url(imgs/scheda/haki_haou.gif);
        background-repeat: no-repeat;
        
    }
    
    .armaturahaki {
     width: 53px;
        height: 210px;
        background-image: url(imgs/scheda/button_busou_sbloccato.png);
        background-repeat: no-repeat;
        
    }
    
    .armaturahaki:hover {
        background-image: url(imgs/scheda/button_busou_sbloccato.png);
        
    }
    
     .osservahaki {
        width: 53px;
        height: 210px;
        background-image: url(imgs/scheda/button_kebun_sbloccato.png);
        background-repeat: no-repeat;
        
    }
    
    .osservahaki:hover {
        background-image: url(imgs/scheda/button_kebun_sbloccato.png);
    }
    
    .doublehaki {
        width: 190px;
        height: 220px;
        background-image: url(imgs/scheda/doppiohaki.gif);
        background-repeat: no-repeat;
    }
    
    .sblocchaki {
        width: 127px;
        height: 36px;
        background-image: url(imgs/scheda/button_haki_bloccato.png);
        background-repeat: no-repeat;
        position: absolute;
        bottom: 52px;
        left: 32px;
        z-index: 3;
    }
    
    .tag1 {
        width: 135px;
        height: 17px;
        background-image: url(imgs/scheda/etichetta_scheda.png);
        background-repeat: no-repeat;
        margin: auto;
    }
    
    .talentiline {
        width: 100%;
        height: 55px;
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        position: absolute;
        bottom: 275px;
        
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
    }
    
    .valorestat {
        font-family: 'Georgia';
        color: #fff;
        font-size: 12px;
        margin-top: -14px;
        margin-right: 12px;
        float: right;
        text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        
    }
    
    .talentostat1 {
        width: 41px;
        height: 43px;
        background-image: url(imgs/scheda/simbolo_scienza.png);
    }
    
    .talentostat2 {
        width: 41px;
        height: 43px;
        background-image: url(imgs/scheda/simbolo_tecnica.png);
    }
    
    .talentostat3 {
        width: 41px;
        height: 43px;
        background-image: url(imgs/scheda/simbolo_cultura.png);
    }
    
    .talentostat4 {
        width: 41px;
        height: 43px;
        background-image: url(imgs/scheda/simbolo_occulto.png);
    }
    
    .livellotalento {
        width: 15px;
        height: 41px;
          background-image: url(imgs/scheda/lv0.png);
          margin-left: -48px;
    }
    
    .infowhite {
       font-family: 'Trebuchet MS';
       color: #fff;
       font-size: 11px;
        text-transform: none;
    }
    
    .commentarrows {
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
}

    .bottoni_sub {
        color: #fff;
        width: 85px;
        height: 12px;
        border: 1px solid #000;
            line-height: 13px;
     font-size: 8px;
    background-color: #911010;
    box-shadow: inset 0 0 2px 2px rgba(255,255,255,0.1);
    font-family: 'Novinik';
    text-transform: uppercase;
    border-radius: 3px;
    }
    
    .bottoni_sub:active {
        margin-top: 2px;
    }
    
   .notefato {
       width: 468px;
       height: 225px;
       margin: auto;
       margin-top: 15px;
   }
   
   .notefatoinner {
       width: 428px;
       height: 185px;
       font-family: 'Georgia';
       color: #3d3d3d;
       font-size: 13px;
       text-align: justify;
       line-height: 20px;
       overflow-y: auto;
   }
   
   #fama_isole {
       background-image: url(imgs/scheda/box_fama_isole.png);
       background-repeat: no-repeat;
       width: 468px;
       height: 225px;
       margin: auto;
       margin-top: 15px;
       
        
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
   }
   
   .text_area_fama {
       text-align: justify;
       width: 400px;
       height: 130px;
       margin: auto;
       padding: 10px;
        padding-top: 0;
       font-size: 11px;
       line-height: 16px;
       color: #fff;
       overflow-y: auto;
   }
   
   .logclassifica {
       text-align: center;
       font-family: 'Georgia';
       color: #3d3d3d;
       font-size: 13px;
       line-height: 10px;
   }
   
   .dataclassifica {
       font-family: 'Novinik';
       font-size: 8px;
       color: #000;
       line-height: 5px;
   }
   
  .esitoduello {
      font-family: 'Bernard';
      text-transform: uppercase;
      font-size: 18px;
      line-height: 5px;
      letter-spacing: 2px;
      color: #5f6d38;
  }
  
  .sconfitta {
      color: #c33939;
  }
  
  .logbutton {
      width: 100px;
      height: 31px;
      
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
  }
  
  .logpx {
       background-image: url(imgs/scheda/bottone_logexp.png);
       background-repeat: no-repeat;
  }
  
    .logpx:active {
       background-image: url(imgs/scheda/bottone_logexp_active.png);
  }
  
  .logpvpe {
       background-image: url(imgs/scheda/bottone_logpvpe.png);
       background-repeat: no-repeat;
  }
  
   .logpvpe:active {
       background-image: url(imgs/scheda/bottone_logpvpe_active.png);
  }
  
  .logberry {
       background-image: url(imgs/scheda/bottone_logberry.png);
       background-repeat: no-repeat;
  }
  
  .logberry:active {
       background-image: url(imgs/scheda/bottone_logberry_active.png);
  }
  
  .logberry:active {
       background-image: url(imgs/scheda/bottone_logberry_active.png);
  }
  
  .logduelli  {
       background-image: url(imgs/scheda/bottone_logduelli.png);
       background-repeat: no-repeat;
  }
  
  .logduelli:active  {
       background-image: url(imgs/scheda/bottone_logduelli_active.png);
  }
  
  
  .bollino {
      width: 21px;
      height: 21px;
      background-image: url(imgs/scheda/bollino.png);
      background-repeat: no-repeat;
          float: right;
    margin-top: 155px;
    margin-right: -7px;
    
        image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: pixelated;
  }
  
  .tokiblessing {
    width: 21px;
    height: 21px;
    background-image: url("/themes/advanced/imgs/scheda/tokiblessing.png");
    background-repeat: no-repeat;
    float: left;
    margin-top: 155px;
    image-rendering: -moz-crisp-edges;
    image-rendering: -webkit-crisp-edges;
    image-rendering: pixelated;
}
  
  .famastar {
    max-width: 21px;
    max-height: 300px;
    min-height: 21px;
    position: absolute;
    left: 0;
    bottom: 0;
}