/*body{
	margin:0;
	padding:0;
}*/
h1 { text-align: center; color: #fff; }

#main{
	background:#333;
	width:100%;
	height:100%;
	position:fixed;
	padding-top:150px;
}

#pictures{
  width: 100%;
  height: 900px;
	max-width:600px;
	max-height:1000px;
	margin:0px auto;
	border-radius:3px;
}

#gallery_img{
  width: 100%;
  height: 100%;
	max-width:600px;
	max-height:800px;
	float:left;
	position:relative;
  overflow: hidden;
}

#lefty{
	width:23px;
	position:absolute;
	top:235px;
	left:10px;
}

#righty{
	width:23px;
	position:absolute;
	top:235px;
	right:10px;
}

#play, #pause{
	width:12px;
	position:absolute;
	top:239px;
	right:40px;
}

#pause{
	display:none;
}

#expand{
	width:18px;
	position:absolute;
	top:478px;
	right:6px;
}

#thumbs{
	height:100px;
	width:600px;
	float:left;
	overflow:auto;
	margin-top:10px;
	white-space:nowrap;
}

.thumbs_style{
	display:inline-block;
}

.thumbs_style img{
	width:105px;
	height:80px;
	border-radius:3px;
	border:3px solid rgba(0,0,0,0.4);
}

.gallery_img_style{
  /*width: 100%;
  height: auto;
	max-width:600px;*/
	max-height:800px;
	border-radius:3px;
	position:absolute;
  object-fit:cover;
  overflow: hidden;
}

#image {
  width: 100%;
  height: 100%; /* Asegura que el contenedor ocupe todo el área disponible */
}

#image img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Hace que la imagen cubra toda el área del contenedor */
  object-position: center; /* Centra la imagen para que los recortes sean equilibrados */
}