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

.img-container-GALERIA{
	position: relative;
	width: 100%;
	height: auto;
	overflow: hidden;
  
 }
.caption-GALERIA{
 position: absolute;
	width: 92%;
	height: 92%;
	background: rgba(255, 255, 255, 0.9);
	transition: all 0.4s ease-in-out;
	top: 100%;
	left: 4%;
}	

.img-container-GALERIA:hover .caption-GALERIA{
	top: 4%;
	transition: all 0.4s ease-in-out;
	left: 4%;
}

.caption-GALERIA h2 {
	margin: 3em auto;
	color:#fd8a17;
	font-size: 3em;
	font-weight: 400;
	margin-bottom: 3px;
	font-family: OSWALD;
	text-align: CENTER;
	line-height: 1.2em;
  }

.caption-GALERIA p {
	font-size: 1.2em;
	font-weight: 300;
	line-height: 1.2em;
	font-family: 'Raleway', sans-serif;
	text-align: CENTER;
	color:#666666;
 }
 
 
   .BOTONLOADMORE {
	width:50%;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	margin-top: 2em;
	margin-bottom: 2em;
 }


#loadMore {
	font-family: 'Raleway', sans-serif;
	text-align: center;
	color: #FD8A17;
	border-width: 2px 2px 2px 2px;
	border-style: solid;
	border-color: #FD8A17;
	border-radius:6px;
	box-shadow: 0 4px 4px #ccc;
	transition: all 400ms ease-in-out;
	-webkit-transition: all 400ms ease-in-out;
	-moz-transition: all 400ms ease-in-out;
	-o-transition: all 400ms ease-in-out;
	font-size: 2,5ex;
	text-transform: uppercase;
	padding-top: 0.3em;
	padding-right: 3em;
	padding-bottom: 0.3em;
	padding-left: 3em;
	margin-top: 1em;
	font-weight: normal;
	text-decoration: none;
}
#loadMore:hover {
	background-color: #CCCCCC;
	color: #666666;
	border-width: 2px 2px 2px 2px;
	border-style: solid;
	border-color: #333333;
}
 
 @media screen and (max-width:1500px) {
 
  .caption-GALERIA h2 {
	font-size: 2.5em;	
}


}
@media screen and (max-width:1226px) {

.caption-GALERIA h2 {
	margin: 1em auto;
	font-size: 2em;	
	line-height: 1em;
}
  .caption-GALERIA p {
	font-size: 1em;
	 }

}


@media screen and (max-width:900px) {
 
  .caption-GALERIA h2 {
	font-size: 1em;	
	line-height: 1em;
}
  .caption-GALERIA p {
	font-size: 0.9em;
	 }

}



@media screen and (max-width:600px) {
.caption-GALERIA h2 {
	margin: 3em auto;
	font-size: 2.5em;
	line-height: 1.2em;
  }

.caption-GALERIA p {
	font-size: 1.1em;
	line-height: 1.2em;
	
 }

}


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

.CAJA-GALERIA-MOVIL {
	width:95%;
	max-width: 2000px;
	margin: 1em auto;
	padding:0.1em;
	text-align: center;
 }

h4{
	padding: 10px;
	margin: 0 auto 25px;
	font-family: Arial;

}

.toggles{
	display: block;
	clear: both;
	overflow: hidden;
	width:95%;
	max-width:990%;
	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: 0.1em;
	display: none;
	width:24.7%;
	float:left;
   }

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

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

  }



@media screen and (max-width:868px) {
  
  
 .toggles{ 
  width: 80%;
  margin: 2%;
 }
   
  
  boton{
   width: 30%;  
}
.posts div{
   width: 48%;
    }
 
  }
  
@media screen and (max-width:750px) {

 
.BOTONLOADMORE {
	width:100%;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	margin-top: 1em;
	margin-bottom: 1em;
 }

#loadMore {
	font-family: 'Raleway', sans-serif;
	text-align: center;
	color: #FD8A17;
	border-width: 1px 1px 1px 1px;
	border-style: solid;
	border-color: #FD8A17;
	box-shadow: 0 2px 2px #ccc;
	transition: all 600ms ease-in-out;
	-webkit-transition: all 600ms ease-in-out;
	-moz-transition: all 600ms ease-in-out;
	-o-transition: all 600ms ease-in-out;
	font-size: 2ex;
	text-transform: uppercase;
	padding-top: 0.5em;
	padding-right: 2em;
	padding-bottom: 0.5em;
	padding-left: 2em;
	margin-top: 1em;
	font-weight: bold;
}

#loadMore:hover {
	background-color: #FD8A17;
	color: #FFFFFF;
} 
  }
  
  
  @media screen and (max-width:600px) {
  
 .toggles{ 
  width: 100%;
  } 
  
   boton{
   width: 100%;  
}
 .posts{
   width: 100%;
   }
 
 .posts div{
    width: 100%; 
  
  }

  }



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



/********HOW WE WORK***************/


.we-work {
	float:left;
	background-color: #ADADAD;
	margin: 0.2em;
	padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 2em;
	padding-left: 2em;
}

.we-work img {
	float:left;
	padding:1.2em;
	margin-top: 1em;
	margin-left: 1em;
}

.we-work p {
	min-height:3em;
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	margin-left: 3em;
	margin-right: 1em;
	margin-bottom: 2em;
	color: #000000;
}

.we-work h1 {
	min-height:1.2em;
	font-size:2em;
	text-align:left;
	COLOR:#FFFFFF;
	font-family: 'Oswald', sans-serif;
	padding-top: 0.5em;
	margin-right: 2em;
}

.we-work span {
	min-height:3em;
	text-align:left;
	font-family: 'Raleway', sans-serif;
	font-size:0.9em;
    COLOR:#F38120;
}


.we-work2 {
	float:left;
	background-color: #888888;
	margin: 0.2em;
	padding-top: 1em;
	padding-right: 2em;
	padding-bottom: 2em;
	padding-left: 2em;}

.we-work2 img {
	float:left;
	padding:1.2em;
	margin-top: 1em;
	margin-left: 1em;
}

.we-work2 p {
	min-height:3em;
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	margin-left: 3em;
	margin-right: 1em;
	margin-bottom: 2em;
	color: #000000;
	
}

.we-work2 h1 {
	min-height:1.2em;
	font-size:2em;
	text-align:left;
	COLOR:#FFFFFF;
	font-family: 'Oswald', sans-serif;
	padding-top: 0.5em;
	margin-right: 2em;
}

.we-work2 span {
	min-height:3em;
	text-align:left;
	font-family: 'Raleway', sans-serif;
	font-size:0.9em;
    COLOR:#F38120;
}

@media screen and (max-width:990px) {
.we-work {
	float:left;
	background-color: #ADADAD;
	margin: 0.2em;
	padding: 1em;
}
.we-work2 {
	float:left;
	background-color: #888888;
	margin: 0.2em;
	padding: 1em;
}

.we-work img {
	float:left;
	padding:1em;
	margin-top: 1em;
	margin-left: 2em;
	width: 8em;
}

.we-work2 img {
	float:left;
	padding:1em;
	margin-top: 1em;
	margin-left: 2em;
	width: 8em;
}

.we-work p {
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	padding:1em;
	margin-left:1em;
	margin-right:2em;
	margin-bottom:2em;
	color: #000000;
}

.we-work2 p {
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	padding:1em;
	margin-left:1em;
	margin-right:2em;
	margin-bottom:2em;
	color: #000000;
}
 }

  @media screen and (max-width:600px) {

.we-work {
	float:left;
	background-color: #ADADAD;
	margin: 0.2em;
	padding-right: 0.4em;
}
.we-work2 {
	float:left;
	background-color: #888888;
	margin: 0.2em;
	padding-right: 0.4em;
}
.we-work img {
	float:left;
	padding:1em;
	margin-top: 1em;
	margin-left: 1em;
	width: 5em;
}

.we-work2 img {
	float:left;
	padding:1em;
	margin-top: 1em;
	margin-left: 1em;
	width: 5em;
}
.we-work h1 {
	min-height:1em;
	font-size:2em;
	text-align:left;
	COLOR:#FFFFFF;
	font-family: 'Oswald', sans-serif;
	margin-right: 1em;
	margin-left: 2em;
}
.we-work2 h1 {
	min-height:1em;
	font-size:2em;
	text-align:left;
	COLOR:#FFFFFF;
	font-family: 'Oswald', sans-serif;
	margin-right: 1em;
	margin-left: 2em;
}

.we-work p {
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	padding:1em;
	margin-left: 3em;
	margin-right: 3em;
	margin-bottom: 2em;
	color: #000000;
	
}
.we-work2 p {
	font-size:1em;
	text-align:left;
	line-height:1.5em;
	font-family: 'Raleway', sans-serif;
	padding:1em;
	margin-left: 2em;
	margin-right: 2em;
	margin-bottom: 2em;
	color: #000000;
	
}

 }