/* Here are the styles that makes the template responsive */

@media only screen and (max-width: 768px) {
  .map {
    position: inherit;
    height: 500px;
    width: 100%;
    display: block;
  }
  .sidepanel {
    position: inherit;
    width: 100%;
  }
  #cartologo {
  position: absolute;
  top: 430px;
}
	#cartocss {
	  position: absolute;
	  top: 20px;
	  right: 10px;
	}
	.layer_selector li {
		  width: 70px;
		  padding: 5px 10px;
		  font-size: 10px;
	}
	.layer_selector li:not(:last-child) {
	  padding: 5px 10px;
	  margin: 0px;
	}
	.layer_selector li.origin {
		  font-size: 10px;
		  padding: 5px 10px;	
		  width: 70px;
		  text-align:left;	
	}
	#about_panel {
	  position:relative;
	  max-width:100%;
	  font-size: 13px;
	  margin: 10px; 
	  border-radius: 3px;
	  background: rgba(125, 125, 125, 0.9);
	  visibility: visible;
	  display:block;
	}
	#about_panel .content {
	  padding: 0 20px;
	  max-height: 460px;
	  visibility: visible;
	  display:block;
	}
	#about_panel span {
	  visibility: hidden;

	}
@media only screen and (max-width: 480px) {
  .map {
    height: 300px;
  }
  #cartologo {
  position: absolute;
  top: 230px;
}
	#cartocss {
	  position: absolute;
	  top: 20px;
	  right: 10px;
	}
	#about_panel .content {
	  max-height: 1000px;
	}
}
