@charset "UTF-8";
/* CSS DOCUMENTS */

/* Versión vertical */
.content {
	width: 100vw;
	height: 100vh;
}
.arriba {
	width: 95%;
	height: 50%;
	margin-top: 0;
  margin-left: auto;
  margin-right: auto;
}
.arriba h1 {
	font-size: 42px;
	color: #fff;
	font-family: "Gruppo", "Muli", "Verdana", "Geneva", "DejaVu Sans", sans-serif;
	text-align: center;
  margin-top: 24px;
}
.arriba h2 {
	font-size: 28px;
	color: #fff;
	font-family: "Gruppo", "Muli", "Verdana", "Geneva", "DejaVu Sans", sans-serif;
  margin-top: 32px;
}
.arriba p {
  	font-size: 18px;
}
.end {
  width: 100%;
  height: 120%;
}
.abajo {
	width: 100%;
	height: 50%;
	top: 50%;
	position: fixed;
}
@media (min-width: 1200px) {
	.columns {
		width: 100%;
		-webkit-column-count: 3;
		-moz-column-count: 3;
		-o-column-count: 3;
		column-count: 3;
		-webkit-column-gap: 20px;
		-moz-column-gap: 20px;
		-o-column-gap: 20px;
		column-gap: 20px;
		-webkit-column-gap: 2em;
		-moz-column-gap: 2em;
		-o-column-gap: 2em;
		column-gap: 2em;
	}
  .arriba ul, li {
  	font-size: 16px;
  }
  .album {
    width: 400px;
    float: left;
  }
  .a-1, .a-2, .a-3 {
    height: 760px;
  }
  .a-4, .a-5, .a-6 {
    height: 740px;
  }
  .a-7, .a-8, .a-9 {
    height: 960px;
  }
  .a-10, .a-11, .a-12 {
    height: 760px;
  }
  .a-13, .a-14, .a-15 {
    height: 800px;
  }
  .a-16, .a-17, .a-18 {
    height: 780px;
  }
  .a-19, .a-20, .a-21 {
    height: 880px;
  }
  .a-22, .a-23, .a-24 {
    height: 740px;
  }
  .a-25, .a-26, .a-27 {
    height: 820px;
  }
  .a-28, .a-29, .a-30 {
    height: 780px;
  }
}
@media (min-width: 800px) and (max-width: 1199px) {
	.columns {
		max-width: 1199px;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		-o-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 20px;
		-moz-column-gap: 20px;
		-o-column-gap: 20px;
		column-gap: 20px;
		-webkit-column-gap: 2em;
		-moz-column-gap: 2em;
		-o-column-gap: 2em;
		column-gap: 2em;
	}
  .arriba ul, li {
  	font-size: 18px;
  }
  .albumenes {
    width: 800px;
    margin-left: auto;
    margin-right: auto;
  }
  .album {
    width: 400px;
    float: left;
  }
  .a-1, .a-2 {
    height: 800px;
  }
  .a-3, .a-4 {
    height: 760px;
  }
  .a-5, .a-6 {
    height: 780px;
  }
  .a-7, .a-8 {
    height: 1020px;
  }
   .a-9, .a-10 {
    height: 740px;
  }
  .a-11, .a-12 {
   height: 780px;
  }
  .a-13, .a-14 {
    height: 860px;
  }
  .a-15, .a-16 {
    height: 840px;
  }
  .a-17, .a-18 {
    height: 740px;
  }
  .a-19, .a-20 {
    height: 940px;
  }
  .a-21, .a-22 {
    height: 720px;
  }
  .a-23, .a-24 {
    height: 800px;
  }
  .a-25, .a-26 {
    height: 880px;
  }
  .a-27, .a-28 {
    height: 820px;
  }
  .a-29, .a-30 {
    height: 780px;
  }
}
@media (min-width: 400px) and (max-width: 799px) {
	.columns {
		max-width: 799px;
		-webkit-column-count: 2;
		-moz-column-count: 2;
		-o-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 20px;
		-moz-column-gap: 20px;
		-o-column-gap: 20px;
		column-gap: 20px;
		-webkit-column-gap: 2em;
		-moz-column-gap: 2em;
		-o-column-gap: 2em;
		column-gap: 2em;
	}
  .arriba ul, li {
  	font-size: 18px;
  }
  .albumenes {
    width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
/* Popup */
  .custom-popup .leaflet-popup-content-wrapper {
    width: 192px;
    }
  .popup-img {
    width: 150px;
  }
  h2 a {
    font-size: 14px;
  }
}
@media (max-width: 399px) {
	.columns {
		max-width: 399px;
		-webkit-column-count: 1;
		-moz-column-count: 1;
		-o-column-count: 1;
		column-count: 1;
		-webkit-column-gap: 20px;
		-moz-column-gap: 20px;
		-o-column-gap: 20px;
		column-gap: 20px;
		-webkit-column-gap: 2em;
		-moz-column-gap: 2em;
		-o-column-gap: 2em;
		column-gap: 2em;
	}
  .arriba ul, li {
  	font-size: 18px;
  }
  .albumenes {
    width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
  .album {
    width: 400px;
  }
/* Popup */
  .custom-popup .leaflet-popup-content-wrapper {
    width: 192px;
    }
  .popup-img {
    width: 150px;
  }
  h2 a {
    font-size: 14px;
  }
}
.cabeza {
}
.a-31 {
  height: 540px;
}
.portada {
	width: 300px;
  margin-left: auto;
  margin-right: auto;
}
.selection {
	text-align: left;
  margin-top: 16px;
}
