@charset "utf-8";
/* CSS Document */

.img-container-GALERIA{
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
	background-color: #333333;
  
 }
/********GALERIA MOVIL***************/

.CAJA-GALERIA-MOVIL {
	width:95%;
	max-width: 1100px;
	margin: 0.1em auto;
	overflow:hidden;
	padding:0.1em;
	text-align: center;

 }


h4{ 
  text-align: center;
  color: #fd8a17;
  font: bold 50px Arial;
  padding: 10px;
  width: 250px;
  margin: 0 auto 25px;
}

.toggles{
	display: block;
	clear: both;
	overflow: hidden;
	width:100%;
	max-width:1090px;
	margin: 0.1em auto;
	  
}

boton{
  color: #fd8a17;
  display:inline-block;
  margin: auto;
  padding: 18px;
  width: 10%;
  cursor: pointer;
  font-size: 15px; 
  margin: 0.4%;
  padding:1%;
  border:none;
  font-family: 'Oswald', sans-serif; 
 -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  background:transparent;
  
}
boton:hover {
	background: rgba(0,0,0,0);
	color:#444444;

}


.posts div{
	height: auto;
	margin: 2%;
	display: block;
	color: #fff;
	width:100%;
	float:left;
  
   }

.posts img{
  width:100%;
  float:left;     
}

@media screen and (max-width:1226px) {
  
.toggles{ 
  width: 90%;
  margin: 2%;
 }
 boton{
   width: 20%;  
}
 
  }

@media screen and (max-width:1134px) {
  
.toggles{ 
  width: 85%;
  margin: 2%;
 }
 boton{
   width: 20%;  
}
  }
@media screen and (max-width:868px) {
  
  
 .toggles{ 
  width: 100%;
  margin: 2%;
 }
   
  
  boton{
   width: 30%;  
}
.posts{
   width: 100%;
    }
 
  }

@media screen and (max-width:500px) {
  
 .toggles{ 
  width: 100%;
  } 
  
   boton{
   width: 100%;  
}
 .posts{
   width: 100%;
   }
 
 .posts div{
    width: 100%; 
 
  }


  }
@media screen and (max-width:400px) {
  
 .toggles{ 
  width: 100%;
  } 
  
   boton{
   width: 100%;  
}
 .posts{
   width: 100%;
   }
 
 .posts div{
    width: 100%;     
  
  }
  
   

}


/********FIN GALERIA MOVIL***************/