.map-wrapper {
  position:relative;
  margin:0 auto;
}

.map-wrapper #map {
  float:left;
  clear:both;
  background-color: #EDEDED;
}

.map-text {
  width: 100%;
  float:left;
  overflow: hidden;
  margin-bottom: 1em;
  color: white;
  background-color: #B8B8B8;
}

.map-text h1 span{
	font-family: 'AG-Thin', Arial, Helvetica, sans-serif;
	font-size: 20px; 
	font-weight: normal;
	font-style: normal;
	font-stretch: normal;
	padding: 0.8em 0.4em 0.8em 0.4em;
	line-height: 0px;
	color: white;
}

.map-text img {
  float: left;
  padding-right: 5px;
  padding-top: 2px;
}

.map-text ul{
  margin-left: 30px;
}

.tooltip {
  font-family: 'AG-Thin', Arial, Helvetica, sans-serif;
  font-style: normal;
  font-stretch: normal;
  position:fixed;
  display:none;
  padding:10px 15px;
  background:white;
  font-size:14px;
  font-weight:bold;
  border:1px solid #262626;

  -moz-border-radius: 4px; /* FF1-3.6 */
  -webkit-border-radius: 4px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
   border-radius: 4px 4px 4px 4px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */    
  /* useful if you don't want a bg color from leaking outside the border: */        
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}

.mouse-position{
  position: fixed;
  top: 0;
  left: 0;
  background: #000;
  color: #fff;
  font-size: 14px;
  padding: 10px;
}



.map-container {
  width: 100%;
  margin:0.6em auto;
}


.map-container h1{ 
  font-size:26px; 
  line-height:1em; 
}

.map-container p, .map-container ul{
  margin-bottom:10px;
}



table.totals {
  width: 100%;
}

td.resultat{
  position: relative;
}

td.resultat:after {
  content: '';
  display: block;
  margin-top: 100%;
}

td.resultat div {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.55em;
}

td.separador{
	width: 0.3em;	
}


.totals h1{
	font-family: 'AG-Black', Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-style: normal;
	font-stretch: normal;
	font-size: 36px;
	color: white;
}

.totalDemocrates{
	background-color: #004BA0;
}
.totalRepublicans{
	background-color: #FF1414;
}


#democrates, 
#republicans{
	font-family: 'AG-Thin', Arial, Helvetica, sans-serif;
	font-size: 110px;
	font-weight: normal;
	display:block;
	bottom: 0px;
	position: absolute;
	line-height:1em; 
}


.estat{
	float: left;
}
.vots{
	float: right;
}


@media only screen and (max-width: 1024px) {
	.map-text h1 span{
		font-size: 14px; 
	}

	.totals h1{
		font-size: 24px;
	}

	#democrates, 
	#republicans{
		font-size: 80px;
	}
}

@media only screen and (max-width: 767px) {
	.map-text h1 span{
		font-size: 14px; 
	}

	.totals h1{
		font-size: 18px;
	}

	#democrates, 
	#republicans{
		font-size: 52px;
	}
}
@media only screen and (max-width: 480px) {
	.map-text h1 span{
		font-size: 14px; 
	}

	.totals h1{
		font-size: 24px;
	}

	#democrates, 
	#republicans{
		font-size: 72px;
	}
}




