@charset 'utf-8';
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img,
object,
embed,
video { max-width: 100%; }
/* IE 6 does not support max-width so default to width 100% */
.ie6 img { width: 100%; }
/*
  Dreamweaver Fluid Grid Properties
  ----------------------------------
  dw-num-cols-mobile:		4;
  dw-num-cols-tablet:		8;
  dw-num-cols-desktop:	12;
  dw-gutter-percentage:	25;
  
  Inspiration from "Responsive Web Design" by Ethan Marcotte 
  http://www.alistapart.com/articles/responsive-web-design
  
  and Golden Grid System by Joni Korpi
  http://goldengridsystem.com/
*/

.fluid {
  display: block;
  float: left;
  clear: both;
  width: 100%;
  margin-left: 0;
}
.fluidList {
  margin: 0;
  padding: 0;
  list-style: none;
  list-style-image: none;
}
/* Mobile Layout: 480px and below. */

.gridContainer {
  float: none;
  clear: none;
  box-sizing: border-box;
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2.275%;
  padding-left: 2.275%;
}
.col6 { width: 100%; }
.col3 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.freelanceBloque01 { width: 100%; }
.freelanceBloque02 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.blogTecnico { width: 100%; }
.floatFleft img {
  display: block;
  margin: 0 auto;
}
.nosGustaEnsenar h2 { text-align: center; }
.contactoBloque01 { width: 100%; }
.contactoBloque02 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.contactoBloque03 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.logo { margin: 62px auto 0; }
.menuPrincipal { display: none; }
.menuHamburguesa { display: block; }
.contenedorProyectos > h2 {
  margin-top: 1.1em;
  margin-bottom: 1em;
  text-align: center;
}
.zeroMargin_mobile { margin-left: 0; }
.hide_mobile { display: none; }
/**** CLASES DE IHOVER *****/
.contenedorProyectos .info {
  margin-top: 0;
  margin-bottom: 0;
  background-color: #333;
}
.info h3 {
  margin-top: -2px;
  padding: .3em;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  background-color: #111;
}
.info p {
  margin-top: -15px;
  padding-right: 5px;
  padding-bottom: 13px;
  padding-left: 5px;
  text-align: center;
  color: #fff;
}
.img img {
  width: 100%;
  height: 100%;
}
.fluid.proyectos > hr { display: none; }

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 652px) {
.gridContainer {
  float: none;
  clear: none;
  width: 100%;
  margin: auto;
  margin-left: auto;
  padding-right: 0;
  padding-left: 0;
}
.contenedorProyectos,
 .freelance,
 .blogTecnico,
 .contacto {
  max-width: 1300px;
  margin: 0 auto;
}
.col6 {
  float: left;
  width: 49.1525%;
}
.col3 {
  clear: none;
  width: 23.7288%;
  margin-left: 1.6949%;
}
.zeroMargin_desktop { margin-left: 0; }
.hide_desktop { display: none; }
.icoTitularProyectos { display: inline-block; }
article.contenedorProyectos {
  overflow: hidden;
  margin-bottom: 20px;
  padding-right: 20px;
  padding-left: 20px;
}
.margenSeparadorImg { margin-bottom: 7%; }
.freelanceBloque01 { width: 48.7179%; }
.freelanceBloque02 {
  clear: none;
  width: 48.7179%;
  margin-left: 2.5641%;
}
.blogTecnico { width: 100%; }
.floatFleft { float: left; }
.blogTecnico img { margin-right: 30px; }
.nosGustaEnsenar h2 { text-align: left; }
.contactoBloque01 { width: 100%; }
.contactoBloque02 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.contactoBloque03 {
  clear: both;
  width: 100%;
  margin-left: 0;
}
.freelance,
 .contacto {
  padding-right: 20px;
  padding-left: 20px;
}
article .info,
 article .img { margin-bottom: auto; }
.contenedorProyectos > h2 {
  float: left;
  text-align: left;
}
.noMarginArriba { margin-top: 0; }
.fluid.proyectos > hr {
  display: block;
  margin-top: 3em;
  margin-bottom: 3em;
}
.hide_tablet { display: none; }
.zeroMargin_tablet { margin-left: 0; }
/***** CLASES DE IHOVER *****/
.info p { display: none; }
.ih-item {
  position: relative;
  -webkit-transition: all .35s ease-in-out;
  -moz-transition: all .35s ease-in-out;
  transition: all .35s ease-in-out;
}
.ih-item,
 .ih-item * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.ih-item a { color: #333; }
.ih-item a:hover { text-decoration: none; }
.ih-item img {
  width: 100%;
  height: 100%;
}
.ih-item.square { position: relative; }
.ih-item.square .info {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
/* ********************** */
.ih-item.square.effect10 { overflow: hidden; }
.ih-item.square.effect10.colored .info { background: #1a4a72; }
.ih-item.square.effect10.colored .info h3 { background: rgba(12, 34, 52, .6); }
.ih-item.square.effect10 .info {
  visibility: hidden;
  -webkit-transition: opacity .6s ease-in-out;
  -moz-transition: opacity .6s ease-in-out;
  transition: opacity .6s ease-in-out;
  opacity: 0;
  background: #333;
}
.ih-item.square.effect10 .info h3 {
  font-size: 19px;
  margin: 0;
  padding: 10px;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  background: #111;
}
.ih-item.square.effect10 .info p {
  position: relative;
  padding: 20px 20px 0 20px;
  text-align: center;
  color: #bbb;
}
.ih-item.square.effect10 a:hover .info {
  visibility: visible;
  opacity: 1;
}
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 1024px) {
.freelanceBloque01 { width: 23.7288%; }
.freelanceBloque02 {
  clear: none;
  width: 23.7288%;
  margin-left: 1.6949%;
}
.blogTecnico { width: 83.0508%; }
.contactoBloque01 { width: 23.7288%; }
.contactoBloque02 {
  clear: none;
  width: 23.7288%;
  margin-left: 1.6949%;
}
.contactoBloque03 {
  clear: none;
  width: 49.1525%;
  margin-left: 1.6949%;
}
.logo { margin: 42px auto 0; }
.menuPrincipal { display: block; }
.menuHamburguesa { display: none; }
.zeroMargin_desktop { margin-left: 0; }
.hide_desktop { display: none; }
.info p { display: block; }
}

@media (max-width: 1023px) {
.animateme {
  transform: none !important;
  opacity: 1 !important;
}
}