@keyframes slidy {
0% { left: 0%; }
20% { left: 0%; }
25% { left: -100%; }
45% { left: -100%; }
50% { left: -200%; }
70% { left: -200%; }
75% { left: -300%; }
95% { left: -300%; }
100% { left: -400%; }
}

body { margin: 0; }

.slider {
	overflow: hidden;
        border-bottom: 1px solid #000;
}

.slider figure img {
	width: 20%;
	float: left;
}

.slider figure { 
  position: relative;
  width: 500%;
  margin: 0;
  left: 0;
  text-align: left;
  font-size: 0;
  animation: 30s slidy infinite;  
}








.box{
	position: static;
	width: 100%;
/*	visibility: hidden;*/
}
.box:target{
	visibility: visible;
}

#imagess {
    width: 400px;
    height: 250px;
    overflow: hidden;
    position: relative;

    margin: 20px auto;
	visibility: hidden;
}

#imagess {
	visibility: visible;
}

#imagess img {
    width: 400px;
    height: 250px;

    position: absolute;
    top: 0;
    left: -400px;
    z-index: 1;
    opacity: 0;

    transition: all linear 500ms;
    -o-transition: all linear 500ms;
    -moz-transition: all linear 500ms;
    -webkit-transition: all linear 500ms;
}
#imagess img:target {
    left: 0;
    z-index: 9;
    opacity: 1;
}
#imagess img:first-child {
    left: 0;
}
#sliders a {
    text-decoration: none;
    background: #E3F1FA;
    border: 1px solid #C6E4F2;
    padding: 4px 6px;
    color: #222;
}
#sliders a:hover {
    background: #C6E4F2;
}







.contenedorgaleria{/*Contenedor para cubrir de negro todo el fondo que no ocupe la imagen o las miniaturas*/
    width: 100%;
    height: 100%;
    display: block;
    position: fixed;
    visibility: hidden;
    top: 134px;
    left: 0px;
    z-index: 999;
    /*background: rgba(256,256,256,0.8);*/
    /*background: #000;*/
}

.galeria, .galeria * {box-sizing:border-box -moz-box-sizing border-box}
.galeria {
    width: auto;
    /*max-height: calc(50%-50px);*/
    height: 85%;
    display: block;
    position: relative;
    /*visibility: hidden;*/
    top: 20px;
    left: 0px;
    /*z-index: 1000;*/
    /*background: rgba(256,256,256,0.8);*/
    /*background: #000;*/
    
    /*
    display: inline-flex;
    position: fixed;
    top:120px;
    left:5%;
    width:90%;
    max-height: 100%;

    border: 1px solid #EAEAEA;  /* Borde de la galería */
    /*padding: 10px;
    padding-bottom: 0;
    background: white;  /* Fondo de la galería */
    /*width: 410px;  /* Ancho de la galería */
    /*visibility: hidden;
    z-index: 1000;
    background: rgba(256,256,256,0.8);*/
}

.galeria_imagen{
    display: inline-block;
    position: relative;
    /*float: left;*/
    /*width: auto;*/
    width: 100%;
    /*height: calc(80%-150px);*/
    height: -moz-calc(100% - 134px);
    height: -webkit-calc(100% - 134px);
    height: calc(100% - 134px);
    /*alignment-baseline: */
    margin-bottom: 10px;
}
.galeria_miniaturas {
    display: inline-block;
    position: relative;
    /*float: left;*/
    /*width: 100%;*/
    /*display: flex;*/
    alignment-baseline: central;
    /*float: left;
    margin: 0 auto;*/
}
.imgGaleria {
    display: inline-block;
    /*float: left;*/
    /*border: 1px solid #F2F2F2;*/  /* Borde de la imagen */
    padding: 0px;
    max-width: 100%; /* Ancho de la imagen */
    max-height: 100%; /* Alto de la imagen */
    border-bottom: 1px solid #000;
}
.miniatura {
width:  80px;  /* Ancho de las miniaturas */
height:  80px;  /* Alto de las miniaturas */
float: left;
cursor: pointer;
padding: 5px;
/*margin: 5px 5px;*/
}
.miniatura img{
    max-width: 80px;
    max-height: 80px;
}

.miniatura:hover {
opacity:.8;   /* Opacidad */
-moz-opacity:.8;
-khtml-opacity:.8;
filter:alpha(opacity=80);
}
.miniatura:active {
opacity:1;
-moz-opacity:1;
-khtml-opacity:1;
filter:alpha(opacity=80);
}

.cerrar {
	display: block;
	position: absolute;
	top: 5px;
	right: 20px;
        
	background: #fff;
	width: 25px;
	height: 25px;
	margin: 15px auto;
	text-align: center;
	text-decoration: none;
	font-size: 25px;
	color: #000;
	padding: 5px;
	border-radius: 50%;
	line-height: 25px;
	cursor: pointer;
}

.contenedorgalerias{
    width: 100%;
    height: 100%;
    display: block;
    /*position: fixed;*/
    /*visibility: hidden;*/
    /*top: 134px;*/
    /*left: 0px;*/
    /*z-index: 999;*/
    text-align: center;
    /*background: rgba(256,256,256,0.8);*/
    /*background: #000;*/
}