.contenitore-progresso {
	position: absolute;
	width: 320px;
	margin-top: 0px;
}

.contenitore
{
	width:320px;
	height:600px;
	border-left:solid;
	border-right:solid;
	border-bottom:solid;
	border-width:1px;
	border-color:#CCC;
	margin: 0 auto;
	background: white;
}

.avvertenze {
	position: absolute;
	margin-top: 400px;
	margin-left: 5px;
	margin-right: 5px;
	text-align: center;
	font-size: 10px;
	width: 310px;
}

.vs
{
position: absolute;
width: 80px;
height: 80px;
margin-left: 115px;
margin-top: 215px;
background: url("vs.png");
background-size: 80;
z-index: 1;
}

.intestazione
{
	height:120px;
	width:320px;
	background:url(-Logo-Ballottaggio-2014.png);
	position: absolute;
	margin-left:auto;
	margin-right:auto;
}

.logo
{
	position: absolute;
	margin-left: 120px;
	top: 10px;
}

.immagine-logo-comune
{
width: 80px;
}


.titolo
{
	font-size:30px;
	margin-top: 110px;
	text-align: center;
}

.sottoTitolo
{
	position:absolute;
	margin-left: 188px;
	font-size:9px;
	text-align: center;
	top: 145px;
}

.sezioni{
	position: absolute;
	margin-left: 105;
	top: 170px;
	font-size: 9px;
}

.contenitore-de-luca
{
position:absolute;
height:200px;
width:150px;
top: 180px;
margin-left: 163px;
}

.de-luca
{
height:150px;
width:150px;
position:absolute;
}

.percentuale-de-luca {
font-size:12px;
position:absolute;
text-align:center;
width: 60px;
height: 30px;
top: 22px;
color: white;
z-index: 1;
}

.cerchietto-de-luca {
width: 60px;
height: 60px;
position: absolute;
right: 0px;
bottom: 0px;
background:url(cerchietto.png);
background-size: 60px;
z-index: 0;
}

.nome-de-luca {
width:150px;
height:auto;
font-size:16px;
top:155px;
position:absolute;
text-align:center;
}

.preferenze-de-luca {
width:150px;
height:auto;
font-size:11px;
top:180px;
position:absolute;
text-align:center;
}

.contenitore-grafico-de-luca
{
	height:283px;
	width:100px;
	position:absolute;
	top:-30px;
	left:-80px;
}

.immagini-candidati{
	width: 150px;
	height: 150px;
}

.contenitore-petrone
{
	position:absolute;
	height:200px;
	width:150px;
	top: 180px;
	margin-left: 4px;
}

.petrone
{
	height:150px;
	width:150px;
	position:absolute;
}

.percentuale-petrone {
font-size:12px;
position:absolute;
text-align:center;
width: 60px;
height: 30px;
top: 22px;
color: white;
z-index: 1;
}

.cerchietto-petrone {
width: 60px;
height: 60px;
position: absolute;
left: 0px;
bottom: 0px;
background:url(cerchietto.png);
background-size: 60px;
z-index: 0;
}

.nome-petrone {
	width:150px;
	height:auto;
	font-size:16px;
	top:155px;
	position:absolute;
	text-align:center;
}

.preferenze-petrone {
	width:150px;
	height:auto;
	font-size:11px;
	top:180px;
	position:absolute;
	text-align:center;
}

.contenitore-grafico-petrone
{
	height:283px;
	width:100px;
	position:absolute;
	top:0px;
	left:230px;
}

.chart {
  display: table;
  table-layout: fixed;
  width: 60%;
  max-width: 50px;
  height: 283px;
  margin: 0 auto;
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.1) 2%, rgba(0, 0, 0, 0) 2%);
  background-size: 100% 50px;
  background-position: left top;
}
.chart li {
  position: relative;
  display: table-cell;
  vertical-align: bottom;
  height: 50px;
}
.chart span {
  margin: 0 1em;
  display: block;
  background: rgba(26, 63, 127, 0.8);
/*    background: rgba(209, 236, 250, 0.75);
*/
  -webkit-animation: draw 1s ease-in-out;
}
.chart span:before {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  padding: 5px 1em 0;
  display: block;
  text-align: center;
  content: attr(title);
  word-wrap: break-word;
}

@-webkit-keyframes draw {
  0% {
    height: 0;
  }
}