info {
	color: #cacaca;
}
png {
	color: #2f8ecd;
}
ms {
	color: #fff;
}
grey {
	color: #b9b9b9;
}
assa {
	color: #fe409e;
}
dervo {
	color: #63729a;
}
ele {
	color: #fd515c;
}
esplo {
	color: #a5d579;
}
war {
	color: #ffd565;	
}
ipno {
	color: #c099d5;
}
monk {
	color: #50bdfe;
}
necro {
	color: #31c957;
}
para {
	color: #fe9316;
}
ritu {
	color: #00aaaa;	
}
nero {
	color: #000;
}
vrd {
	color: #0bcf01;
}
/*============*/
.container {
  position: relative;
  text-align: center;
  width: 900px; 
  color: white; 
  margin:0px; 
}
.ele-left {
 position: absolute;
 top: 440px;
 left: 240px;
 z-index: 66;
}
.ele1-left {
 position: absolute;
 top: 435px;
 left: 740px;
 z-index: 66;
}
.monk-left {
 position: absolute;
 top: 390px;
 left: 210px;
 z-index: 66;
}
.monk1-left {
 position: absolute;
 top: 530px;
 left: 450px;
 z-index: 66;
}
.war-left {
 position: absolute;
 top: 310px;
 left: 330px;
 z-index: 66;
}
.war1-left {
 position: absolute;
 top: 120px;
 left: 750px;
 z-index: 66;
}
.esplo-left {
 position: absolute;
 top: 260px;
 left: 405px;
 z-index: 66;
}
.esplo1-left {
 position: absolute;
 top: 760px;
 left: 385px;
 z-index: 66;
}
.ipno-left {
 position: absolute;
 top: 110px;
 left: 640px;
 z-index: 66;
}
.ipno1-left {
 position: absolute;
 top: 475px;
 left: 505px;
 z-index: 66;
}
.necro-left {
  position: absolute;
  top: 120px;
  left: 420px;
  z-index: 66;
}
.necro1-left {
  position: absolute;
  top: 415px;
  left: 680px;
  z-index: 66;
}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.pop {
  position: absolute;
  top: 904px;
  left: 96px;
  z-index: 999999;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
#popup a:hover	{
	color: #f00; 
	background-color: #e9e9e2;
	text-indent: 0; 
	z-index: 99;
}

#popup a:hover span {
	display: block;
	position: absolute;
	top: 0px;
	left: 170px;
	width: 320px;
	margin: 0px;
	padding: 10px;
	color: #335500;
	font-weight: normal;
	background: #e5e5e5;
	text-align: left;
	border: 1px solid #666;
}


/*THUMBNAIL HOVERPOPUPS*/

.thumbnail  {
	position: relative;
	float: left;
	padding: 5px;
	z-index: 99;
}

.thumbnail:hover {
	background-color: none;
	z-index: 99;
	color: #335500;
	text-decoration: none;
}

.thumbnail span { 
	position: absolute;
	/*background-color: #000;*/
	background-color: rgba(0, 0, 0, .7);
	padding: 5px;	
	border: 1px solid #000;
	visibility: hidden;
	color: white;
	text-decoration: none;
}
.thumbnail1 span {
	position: absolute;	
	background-color: rgba(0, 0, 0, .7);
	padding: 5px;	
	border: 1px solid #000;
	visibility: hidden;
	color: white;
	text-decoration: none;
}
.thumbnail3 span {
	position: absolute;	
	background-color: rgba(0, 0, 0, .7);
	padding: 5px;	
	border: 1px solid #000;
	visibility: hidden;
	color: white;
	text-decoration: none;
}
.noElite span { 
	position: absolute;	
	background-color: rgba(0, 0, 0, .7);
	padding: 5px;	
	border: 1px solid #000;
	visibility: hidden;
	color: white;
	text-decoration: none;
}
.condiviso span {
	position: absolute;	
	background-color: rgba(0, 0, 0, .7);
	padding: 5px;	
	border: 1px solid #000;
	visibility: hidden;
	color: white;
	text-decoration: none;
}
.thumbnail span img { 
	border-width: 0px; 
	/*padding: 2px;*/
}

.thumbnail:hover span { 
	visibility: visible; 
	width: 400px;
	top: -170px; 
	left: -170px;
}
.thumbnail1:hover span {
	visibility: visible; 
	width: 400px;
	top: -180px; 
	left: -280px;
}
.thumbnail3:hover span { 
	visibility: visible; 
	width: 400px;
	top: -170px; 
	left: -50px;
}
.noElite:hover span { 
	visibility: visible; 
	width: 220px;
	top: -60px; 
	left: -100px;
}
.condiviso:hover span {
	visibility: visible; 
	width: 420px;
	top: -198px; 
	left: 120px;
}

.thumbnail2 {
	position: relative;
	float: left;
	padding: 5px;
	/*z-index: 0;*/
}

.thumbnail2:hover { 
	background-color: #e9e9e2;
	/*z-index: 50;*/
	color: #335500;
	text-decoration: none;
}

.thumbnail2 span { /*CSS for enlarged image*/
	position: absolute;
	background-color: #e5e5e5;
	padding: 5px;
	/*left: -1000px;*/
	border: 1px solid #666;
	visibility: hidden;
	color: black;
	text-decoration: none;
}

.thumbnail2 span img { /*CSS for enlarged image*/
	border-width: 0px;
	/*padding: 2px;*/
}

.thumbnail2:hover span { /*CSS for enlarged image on hover*/
	visibility: visible; width: 208px;
	top: 5px; /* use IF IE6 style to correct IE6 positions of larger image relative to thumb */
	left: 300px;/*position where enlarged image should offset horizontally */
}

a.thumbnail2 img { 
	text-decoration:none;
	z-index: 50; 
}
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
.hide {
   left: -10000px;
   position: absolute;
}
.hooover { left: 80px; }
tr { position: relative; }
.a1 {
   border: 1px solid Black;
   width: 300px;
}
.a2 { padding: 20px 0 0 120px; }
.a3 { padding: 20px 0 0 200px; }
/*------------------------------------------*/
.containerTip {
  position: relative;
  text-align: center; 
  width: auto; 
  z-index: 999999;
}
	
.re {
  position: absolute;
  top: 150px;
  left: 164px; 
}
.grenth {
  position: absolute;
  top: 134px;
  left: 312px;
}
.labirinto {
  position: absolute;
  top: 220px;
  left: 220px;
}
.cavalieri {
  position: absolute;
  top: 744px;
  left: 522px;
}
.flag1 {
  position: absolute;
  top: 660px;
  left: 550px;  
}
.flag2 {
  position: absolute;
  top: 600px;
  left: 590px;  
}
.flag3 {
  position: absolute;
  top: 680px;
  left: 500px;  
}
.flag4 {
  position: absolute;
  top: 690px;
  left: 460px;  
}
.regina {
  position: absolute;
  top: 760px;
  left: 216px;
}
.demone {
  position: absolute;
  top: 528px;
  left: 168px;
}
.anima {
  position: absolute;
  top: 404px;
  left: 292px;
}
.adirati {
  position: absolute;
  top: 346px;
  left: 80px;
}
.imprigionati {
  position: absolute;
  top: 330px;
  left: 440px;  
}
.jalis {
  position: absolute;
  top: 128px;
  left: 150px;
}
.orozar {
  position: absolute;
  top: 134px;
  left: 174px;  
}
.alkar {
  position: absolute;
  top: 146px;
  left: 136px;  
}
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black;
  /*font-weight: bold;
  color: gold;*/
}
.forgiatore {
  position: absolute;
  top: 434px;
  left: 564px; 
}
.fabbro {
  position: absolute;
  top: 200px;
  left: 370px;
}
.miko {
  position: absolute;
  top: 290px;
  left: 808px;  
}
.taeres {
  position: absolute;
  top: 488px;
  left: 546px;
}
.nimros {
  position: absolute;
  top: 752px;
  left: 554px;
}
.rastigan2 {
  position: absolute;
  top: 464px;
  left: 220px;
}
.rastigan {
  position: absolute;
  top: 470px;
  left: 78px;
}
.lord {
  position: absolute;
  top: 104px;
  left: 74px;
}
.lupo1 {
  position: absolute;
  top: 650px;
  left: 590px;  
}
.lupo2 {
  position: absolute;
  top: 760px;
  left: 260px;
}
.lupo3 {
  position: absolute;
  top: 142px;
  left: 960px;
}
.lupo4 {
  position: absolute;
  top: 142px;
  left: 560px;
}
.lupo5 {
  position: absolute;
  top: 212px;
  left: 260px;
}
.lupo6 {
  position: absolute;
  top: 430px;
  left: 858px;  
}
.lupo7 {
  position: absolute;
  top: 530px;
  left: 230px;  
}
.khobay {
  position: absolute;
  top: 750px;
  left: 970px;
  color: white;  
}
.menzies {
  position: absolute;
  top: 116px;
  left: 596px;
  color: white;  
}
.schiavi {
  position: absolute;
  top: 64px;
  left: 1030px;
  color: white;  
}
.grifoni {
  position: absolute;
  top: 214px;
  left: 84px;
  color: white;
}
.ombra {
  position: absolute;
  top: 470px;
  left: 900px;  
  color: white;
}
.TempioDellaGuerra {
  position: absolute;
  top: 640px;
  left: 400px;  
  color: white;
}
.flannuss {
  position: absolute;
  top: 320px;
  left: 362px;
  color: white;  
}
.alitta {
  position: absolute;
  top: 450px;
  left: 220px;
  color: white;  
}
.asterius {
  position: absolute;
  top: 330px;
  left: 72px;
  color: white;  
}
.nifling {
  position: absolute;
  top: 160px;
  left: 560px;
  color: white;  
}
.dazehl {
  position: absolute;
  top: 230px;
  left: 180px;
  color: white;  
}
.olrun {
  position: absolute;
  top: 184px;
  left: 244px;
  color: white;  
}
.ipnoT {
  position: absolute;
  top: 908px;
  left: 706px;  
}
.necroT {
  position: absolute;
  top: 900px;
  left: 572px;  
}
.eleT {
  position: absolute;
  top: 880px;
  left: 852px;  
}
.monkT {
  position: absolute;
  top: 670px;
  left: 908px;  
}
.dervoT {
  position: absolute;
  top: 550px;
  left: 790px;  
}
.esploT {
  position: absolute;
  top: 810px;
  left: 520px;  
}
.ipnoT2 {
  position: absolute;
  top: 104px;
  left: 570px;  
}
.jerazh {
  position: absolute;
  top: 180px;
  left: 200px; 
}
.voce {
  position: absolute;
  top: 440px;
  left: 788px; 
}
.GdS {
  position: absolute;
  top: 466px;
  left: 548px; 
}
.sulahresh {
  position: absolute;
  top: 650px;
  left: 58px; 
}
.tekliss {
  position: absolute;
  top: 300px;
  left: 168px;
}
.AdS {
  position: absolute;
  top: 658px;
  left: 590px;
}
.turep {
  position: absolute;
  top: 680px;
  left: 420px;
}
.shaunur {
  position: absolute;
  top: 710px;
  left: 420px;
}
.jadoth {
  position: absolute;
  top: 708px;
  left: 500px;
}
.bestia-nera {
  position: absolute;
  top: 528px;
  left: 120px;
}
.furia {
  position: absolute;
  top: 498px;
  left: 170px;
}
.effetto1M {
  position: absolute;
  top: 490px;
  left: 404px;
}
.effetto2M {
  position: absolute;
  top: 490px;
  left: 440px;
}
.effetto3M {
  position: absolute;
  top: 490px;
  left: 476px;
}
.effetto4M {
  position: absolute;
  top: 490px;
  left: 512px;
}
.effettoC {
  position: absolute;
  top: 658px;
  left: 340px;
}
.effettoVS {
  position: absolute;
  top: 600px;
  left: 610px;
}
.effettoF {
  position: absolute;
  top: 328px;
  left: 80px;
}
.effettoCC {
  position: absolute;
  top: 248px;
  left: 580px;
}
.dum {
  position: absolute;
  top: 425px;
  left: 396px;
}

/* -------------------------------------------------------------------*/

/* -------------------------------------------------------------------*/
.tooltip .tooltiptext {
  visibility: hidden;
  width: auto;
  /*background-color: red;*/
  background-color: rgba(0, 0, 0, 0.9);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  
  /* Position the tooltip */
  width: auto;
  bottom: 100%;
  left: -100px;   
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}
.tooltip1 .tooltiptext1 {
  visibility: hidden;
  width: auto;
  /*background-color: red;*/
  background-color: rgba(0, 0, 0, 0.9);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  
  /* Position the tooltip */
  width: auto;
  /* top: 50px; */
  bottom: -164px;
  left: -72px;   
  position: absolute;
  z-index: 1;
}

.tooltip1:hover .tooltiptext1 {
  visibility: visible;
}
a:visited {
  color: #fff; /*rgb(252,201,79); /*pink;*/
}
table {
  border-collapse: collapse;
}

 table, td {
 border: 1px solid white;
 border-color: #777;
}  
th {
	text-align: center;
}
  table.tb { border-collapse: collapse; width:100%; }
  .tb th, .tb td { padding: 5px; border: solid 1px #777; }
  .tb th { background-color: none;}
 
table.fo { border-collapse: collapse; width:900px; height: 934px; background: black; }
table.fo td { text-align: left;}
table.fo th  { 
padding: 5px; border: solid 1px #777; text-align: center; font-weight: normal;
}
px:before {
    content: ' \2714';	
	font-size:24px;
	font-weight: bold;
	color: green;
}
xx:before {
    content: ' \2716';
	color:#777;
	font-size:24px;
	font-weight: bold;	
}
.vl {
  border-left: 2px solid gray;
  height: 700px;
  position: absolute;
  left: 320px;
  margin-left: -3px;
  top: 0;
}
/* tr {
	background-color: #900021;
} */
.in { display: inline; }


.xdiv { 
  width: 25%;
  background-color: #a42526;
  position: absolute;
  right: 0px;
}
xtable , td{
  border-collapse: collapse;
  /*border: 1px solid white;*/
  color: #fec53e;
  /*text-align: center;*/
  vertical-align: middle;
  padding: 5px;
}
textarea {
  width: 232px;
  height: 16px;
  resize: none;
}
em.bullet {
	width: 9px;
	height: 9px;
	margin: 0 5px;
	background: #a7ee50;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bullet1 {
	width: 9px;
	height: 9px;
	margin: 0 5px;
	background: #f5af1c;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bullet2 {
	width: 9px;
	height: 9px;
	margin: 0 5px;
	background: #06a0d6;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bulletR {
	width: 9px;
	height: 9px;
	margin: 0 5px;
	background: #d10809;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bulletB {
	width: 9px;
	height: 9px;
	margin: 0 5px;
	background: #0827d0;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bulletG {
	width: 18px;
	height: 18px;
	margin: 0 5px;
	background: #dfd643;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bulletVI {
	width: 18px;
	height: 18px;
	margin: 0 5px;
	background: #5966f5;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
em.bulletELE {
	width: 18px;
	height: 18px;
	margin: 0 5px;
	background: #d46a6a;
	display: inline-block;
	-webkit-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	-moz-box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);
	box-shadow: inset 1px 1px 1px rgba(255,255,255, 0.4);

	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
.c {text-align: center;}