html, body, #map {
        height: 100%;
        padding: 0;
        margin: 0;
      }	   
	  
	  .leaflet-container {
    background: #FFF !important;
    outline: 0;
}
	
     #slider {
    position: absolute;
    width: 90.2%;
    margin: 0 auto;
    bottom: 60px;
    right: 40px;
    left: 55px;
    border-radius: 0px;
    cursor: pointer;
}
  
button:focus {outline:0;}

.ui-slider-handle{
    
    border-radius: 0px !important;
    background: none !important;
    background-color: #888888 !important;  
	border: none !important;
    height: 15px !important;
    width: 15px !important;
    margin-top: 4px;
	    margin-left: 0px !important;
}
      #legend {
        
        font-size: 27px;
        position: absolute;
        bottom: 80px;
        left: 40px;
		    font-family: arial;
    color: #636363;
    text-transform: uppercase;
    background-color: rgba(255, 255, 255, 0.84);
    padding: 5px;
      }
	  #tool-tip {
  position: absolute;
  width: 520px;
  height: auto;
  background-color: white;
  opacity: .9;
  z-index: 150;
  text-align: left;
  color: #3E7BB6;
  vertical-align: bottom;
  font-family: Helvetica, sans-serif;
  font-weight: 400;
  font-size: 12px;
  padding: 8px;
}

#tool-tip .title {
     display: block;
    text-transform: uppercase;
    font: normal 10px "Helvetica Neue","Helvetica",Arial;
    color: #AAA;
    word-wrap: break-word;
}

#tool-tip .value{
    display: block;
    margin: 0;
    padding: 0 0 7px;
    font: normal 12px "Helvetica Neue", "Helvetica", Arial;
    color: #333333;
    word-wrap: break-word;}
	
	#tool-tip p {margin-top:5px}
	
	div.cartodb-legend {
   
    bottom: 85px !important;
    right: 4.5% !important; 
    box-shadow: none !important;
	webkit-box-shadow: none !important;
	border-radius: 0px !important; 


	}
	
	
#play {
       position: absolute;
          bottom: 56px;
       left: 3%;
    width: 24px;
    height: 24px;
    margin: -4px 0 0 0;
	border-radius: 0px !important;
    background: none !important;
    background-color: white !important;
    
}

.ui-slider-line{
margin-left:7px;
}
.ui-slider-label {    
    width: 100px !important;
    margin-left: -40px !important;
}

.ui-slider-pips [class*=ui-slider-pip-initial] {
    font-weight: normal !important;
    color: #AAAAAA !important;
}

.banner{    z-index: 999999;
    position: absolute;
    left: 50px;
    top: 30px;
    background-color: rgba(255, 255, 255, 0.8);}
	
	
	.logo{    position: absolute;
       top: -20px;
    right: 40px;
    opacity: 0.6;}
	
.links{ 
    position: absolute;
    bottom: 180px;
    right: 5%;
    z-index: 9999;
    width: 230px;
    height: 45px;
    background-color: rgba(255, 255, 255, 0.82);
}
.links a i {
    font-size: 26px;
    padding: 10px;
    color: #888888;
}

.chart{
    position: absolute;
    right: 30px;
    top: 14%;
    }

@media only screen and (max-width: 768px) {
.banner img{
	width:90%;
	margin-top: -30px;
}
.banner{
	top: 7px;
	width: 80%;
	height: 60px;
}

.logo{
	display:none;
}
.links{
	display:none;}
.ui-slider-label{display:none !important
	
}
.ui-slider-pip-selected .ui-slider-label{
	display:block !important;
	font-size:8pt
}
#slider{
	width:78%;
}
div.cartodb-legend{
	height:50px
}
div.cartodb-legend.choropleth li.graph{
	height:15px
}
div.cartodb-legend .legend-title{
	font-size:10px
}
#tool-tip{
	width: 240px;
	top: 70px !important;
	left: 50px !important;
	display:none !important
}
.chart{
	position:relative;
	width: 50px !important;
	right:0px
}
.chart img{
	
width: 240px !important;
}
}

.leaflet-bottom .leaflet-control-scale {
    bottom: 220px;
    right: 160px;
}