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

/*************************************************************/
/*********************** GENERALES *****************************/
/*************************************************************/



html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,
dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {
  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
  outline:none;
   }

#wrapper {width: 100%; margin: 0 auto; overflow-x: hidden;}

.container{ margin:0px auto; /*border:1px solid #000;*/  }
 
.clear{ clear:both}

h1, h2, h3, h4, h5, h6
{font-family:"Montserrat",sans-serif;}

h1{width:100%; text-align:left;font-size:1em;letter-spacing:1px;color:#898F99;}

h2{ color:#898F99; text-transform: uppercase;font-size:1.6em;letter-spacing:1.5px;
text-align:center;margin:0 0 20px 0;font-weight:400}

h3{ color:#898F99;font-size:1.125em;letter-spacing:0.5px;font-weight:400}

h4{ margin: 20px 0; font-size:1em}

.margin{ margin:7px 0 }

.t_b{color:#fff}
.t_v{color:#0EC8CB;}
.t_r{color:#db5252;}
.t_n{color:#000; letter-spacing:0px}

.linea1{ width:100px; height:5px; margin:0 auto 40px auto}

.negro{ background-color:#000; }
.gris{ background-color:#eee;}
.gris_medio{ background-color:#e1e1e1;}
.gris_oscuro{ background-color:#999;}
.gris_oscuro2{ background-color:#3d3f41;}
.verde{ background-color:#0EC8CB;}
.verde2{ background-color:#036c6a}
.rojo{ background-color:#db5252;}
.bl_gr{background: linear-gradient(to top,#eee 70%,#fff 70%,#fff 100%)}
.bl_gr_os{background: linear-gradient(to top,#eee 55%,#999 55%,#999 100%)}
.rojo2{background-color:#af0700}
.celeste{background-color:#638eb9}
.marron{background-color:#836658}
.bl_azul{background: linear-gradient(to bottom,#262352 10%,#262352 10%,#262352 75%,#fff 75%,#fff 100%)}
.amarillo{background-color:#fd0}
.bl_verde{background: linear-gradient(to bottom,#699e28 10%,#699e28 10%,#699e28 75%,#fff 75%,#fff 100%)}
.amarillo2{background-color:#ffd602}








article{ width:100%; height:auto; padding:70px 0; float:left; }
.pad_art{padding:70px 0; }
.seccion{margin-top:130px}
.seccion2{ padding:0}
.seccion3{ margin-top:-100px; padding:0}
.seccion4{margin-top:0px ; background-color:#F00}
.seccion5{padding:70px 0 0 0;}

p{font-family: 'PT Sans', sans-serif; line-height:22px; position:relative; z-index:10000}
.centrado{ text-align:center}

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { display: table; content: ''; }
.clearfix:after { clear: both; }



/*************************************************************/
/*********************** HEADER *****************************/
/*************************************************************/

header {
  width: 100%;
  height: 130px;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10999;
 background: transparent;
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  -ms-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s; }
  
  header h6#logo {
    display: inline-block;
    height: 130px;
    line-height: 130px;
    float: left;
    font-size: 60px;
    color: white;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
	background-image:url(../img/iso.svg);
	width:130px; background-repeat:no-repeat;
	filter: invert(0%);}
	
	header h6#logo:hover {
   opacity: 1;
   filter: invert(100%);}
	
   header nav {
	font-family: 'PT Sans', sans-serif;
    display: inline-block;
    float: right;
	
 }
    header nav a {
      line-height: 130px;
      margin-left: 30px;
      color: #666;
      font-size: 16px;
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
	  text-decoration:none;
	  	font-weight:lighter;
		position:relative; z-index:10000
		}
		
      header nav a:hover {
        color: black;
		 }
		
  header.smaller {
    height: 90px;
	background-color:rgba(14,200,203,0.8); }
    header.smaller h6#logo {
      line-height: 80px;
      font-size: 30px;
	  background-image:url(../img/logo.svg);
	  background-repeat:no-repeat;
	width:280px; height:80px;
	filter: invert(0%);
	}
	 header.smaller h6#logo:hover {
   opacity: 1;
   filter: invert(100%);}
   
  header.smaller nav a {
      line-height: 88px;
	  color: white; }
	  
	  
nav a {
	position: relative;
	display: inline-block;
	outline: none;
	text-decoration: none;
	font-weight: 400;
	z-index:2000
	}

nav a:hover,
nav a:focus {
	outline: none;
}

/* Effect 12: circle */
.cl-effect-12 a::before,
.cl-effect-12 a::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 90px;
	height: 90px;
	border: 2px solid rgba(255,255,255,0.7);
	border-radius: 50%;
	content: '';
	opacity: 0;
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.2);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.2);
	transform: translateX(-50%) translateY(-50%) scale(0.2);
	z-index:50

}

.cl-effect-12 a::after {
	width: 80px;
	height: 80px;
	border-width: 6px;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(0.8);
	-moz-transform: translateX(-50%) translateY(-50%) scale(0.8);
	transform: translateX(-50%) translateY(-50%) scale(0.8);
	position: absolute;z-index:-50
	
}

.cl-effect-12 a:hover::before,
.cl-effect-12 a:hover::after,
.cl-effect-12 a:focus::before,
.cl-effect-12 a:focus::after {
	opacity: 0.8;
	-webkit-transform: translateX(-50%) translateY(-50%) scale(1);
	-moz-transform: translateX(-50%) translateY(-50%) scale(1);
	transform: translateX(-50%) translateY(-50%) scale(1);
position: absolute;z-index:-50
	
}

.on {
color:#db5252;
	
}


/*************************************************************/
/*********************** SLIDER HOME *****************************/
/*************************************************************/

#header{  
  position: relative;     
  text-align: center;
  padding: 0 !important;
    background-image: url(../img/header-bg.jpg);
  box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1)
}

.content-block{
  background:transparent no-repeat center center fixed;
  -webkit-background-size:100%;
  -moz-background-size:100%;
  -o-background-size:100%;
  background-size:100%;
  background-size:cover;
  -webkit-background-size:cover;
  -moz-background-size:cover;
  -o-background-size:cover;
  overflow:hidden;
}

      div#shell {
        display: block;
        position: relative;
        margin: 50px auto;
        width: 1078px;
        height: 887px;
		
}
   
      img#plax-01 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 2;
	
      }
      img#plax-02 {
        position: absolute;
        z-index: 3;
        top: 0px;
        left: 0px;
		
      }
      img#plax-03 {
        position: absolute;
        z-index: 4;
        top: 0px;
        left: 0px;
		
      }
      img#plax-04 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 5;
      }
	  
	      img#plax-05 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 6;
      }
	      img#plax-06 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 7;
      }
	  
	        img#plax-07 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 8;
      }
	  
	        img#plax-08 {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 9;
      }


/*************************************************************/
/*********************** TRABAJOS RECIENTES *****************************/
/*************************************************************/

.ch-grid {
	margin: 20px 0 0 0;
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
	}

.ch-grid:after,
.ch-item:before {
	content: '';
    display: table;
}

.ch-grid:after {
	clear: both;
}

.ch-grid li {
	width: 180px;
	height: 180px;
	display: inline-block;
	margin: 20px;
}

/* Common style */


.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 15px 15px;
	min-width: 300px;
	max-width: 360px;
	max-height: 360px;
	width: 48%;
	height: auto;
	background: #0EC8CB;
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h3 {
	font-weight: 300;
	color:#FFF;
	float:left;
	white-space: normal;
	text-align:left;
	line-height:30px;
}

.grid figure h3 span {
	font-weight: 800;
	margin-left:-10px;
}

.grid figure p {
	letter-spacing: 0.7px;
	font-size: 68.5%;
	line-height:18px;
	margin-right:-50px

}


/*-----------------*/
/***** Apollo *****/
/*-----------------*/

figure.effect-apollo {
	background: #0EC8CB;
}

figure.effect-apollo img {
	opacity: 0.95;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale3d(1.05,1.05,1);
	transform: scale3d(1.05,1.05,1);
}

figure.effect-apollo figcaption::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	content: '';
	-webkit-transition: -webkit-transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}

figure.effect-apollo p {
	position: absolute;
	right: 0px;
	bottom: 0;
	margin: 3em;
	padding: 0 1em;
	max-width: 350px;
	border-right: 4px solid #fff;
	text-align: right;
	opacity: 0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

figure.effect-apollo h2 {
	text-align: left;
}

figure.effect-apollo:hover img {
	opacity: 0.2;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

figure.effect-apollo:hover figcaption::before {
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}

figure.effect-apollo:hover p {
	opacity: 1;
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}



/*************************************************************/
/*********************** PONETE EN CONTACTO *****************************/
/*************************************************************/

#contactame{background:#db5252; color: white; border-top: 1px solid rgba(255, 255, 255, 0.24); margin-top:50px;}

#tit_contacto{ 
color: #fff;}

.linea_tit_contacto{ width:100px; height:5px; background-color:#000; margin:0 auto 20px auto}

.col_iz, .col_cen, .col_der {
float: left;
margin: 10px 0px ;
width: 394px;
height: 182px;
border-right:2px solid rgba(206, 43, 43, 0.40); border-style:groove;
}

.col_der{border-right:none}

.ch-contacto {
	margin: 0px ;
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
	}
	
.ch-contacto:after,{
	content: '';
    display: table;
}

.ch-contacto:after {
	clear: both;
}

.ch-contacto li {
	width: 180px;
	height: 180px;
	display: inline-block;
	margin: 0px;
	
}
  
.ch-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	cursor: pointer;
}

.ch-info-wrap, 
.ch-info{
	position: absolute;
	width: 150px;
	height: 150px;
	border-radius: 50%;
}

.ch-info-wrap {
	top: 15px;
	left: 15px;
	background: #f9f9f9 url(../images/bg.jpg);
	box-shadow: 
		0 0 0 15px rgba(255,255,255,0.2), 
		inset 0 0 3px rgba(0,0,0, 0.8);

}

.ch-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-position: center center;
	
	-webkit-backface-visibility: hidden; /*Just for webkit to have a smooth font*/
}

.ch-info .ch-info-front {
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	-o-transition: all 0.6s ease-in-out;
	-ms-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}

.ch-info .ch-info-back {
	opacity: 0;
	background: #000;
	pointer-events: none;
	
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	
	-webkit-transition: all 0.4s ease-in-out 0.2s;
	-moz-transition: all 0.4s ease-in-out 0.2s;
	-o-transition: all 0.4s ease-in-out 0.2s;
	-ms-transition: all 0.4s ease-in-out 0.2s;
	transition: all 0.4s ease-in-out 0.2s;
}

.ch-img-1 { 
	background-image: url(../img/mobile.jpg);
}

.ch-img-2 { 
	background-image: url(../img/mail.jpg);
}

.ch-img-3 { 
	background-image: url(../img/skype.jpg);
}

.ch-info h3 {
	color: #fff;
	font-size: 16px;
	height: 80px;
	line-height:150px

}

.ch-info p {
	color: #fff;
	padding: 10px 5px 0;
	font-style: italic;
	margin: 0 30px;
	font-size: 12px;

}

.mail:link, .mail:active, .mail:visited{
	color:#fff;
	font-size: 15px;
	height: 80px;
	line-height:150px;
	text-decoration:none}

.mail:hover{color:rgba(14,200,203,1);
	font-size: 15px;
	height: 80px;
	line-height:150px}



.ch-item:hover .ch-info-front {
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	
	opacity: 0;
} 

.ch-item:hover .ch-info-back {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	
	opacity: 1;
	pointer-events: auto;
}

.puntos{ width:15px; height:4px; background-image:url(../img/puntos.svg); margin:10px auto}



/*************************************************************/
/*********************** FOOTER *****************************/
/*************************************************************/

footer{ background: #000; color: white; border-top: 1px solid rgba(255, 255, 255, 0.24);  padding:50px 0; height:130px}


.copyright{ color:#FFF; font-size:14px; width:100%; float:left;line-height:40px; text-align:center}

.redes{ float:right; }

.contenedor_redes{ width:360px; height:auto; }

.red_social{ width:40px; height:40px; float:right; margin:0px 10px 0 10px  ;  line-height:30px}


/*************************************************************/
/*************************************************************/
/*********************** SOBRE MI *****************************/
/*************************************************************/
/*************************************************************/

.fondo_sobremi{ width:100%; max-height:auto; background-image:url(../img/fondo_sobre.jpg)}
.img_sobremi{ width:712px; height:700px; float:left; background:url(../img/sobre_mi.png)
}

.cont_sobremi{ width:490px; height:400px; float:left; margin-left:-20px; margin-top:-30px }

/* CURRICULUM VITAE */

 * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
 
.cv_titulo{font-family: "Montserrat",sans-serif; font-size:20px; color:#fff; margin-top:35px; text-align:center; }
 
.cv_subt{ width:400px; height:30px; margin:20px 0; float:left; position:relative; z-index:2000 }

.cv_txt{ width:460px;float:left }



.link {
	outline: none;
	text-decoration: none;
	position: relative;
	line-height: 1;
	color: #9e9ba4;
	display: inline-block;
	text-align:center;
	margin-top:170px;
	position:relative; z-index:2000;
	
}

.link2 {
	outline: none;
	text-decoration: none;
	position: relative;
	line-height: 1;
	color: #9e9ba4;
	display: inline-block;
	text-align:center;
	position:relative; z-index:2000;
	
}

/* Takiri */
.link--takiri {
	font-family: "Montserrat",sans-serif;
	font-weight: 700;
	font-size: 3em;
	padding: 0;
	-webkit-transition: color 0.5s;
	transition: color 0.5s;
	text-align:center;

}



.link--takiri:hover {
	color: #1e1a1b;
}

.link--takiri::before {
	content: '';
	position: absolute;
	height: 36px;
	width: 120%;
	top: 50%;
	margin-top: -18px;
	left: -10%;
	z-index: -1;
	background: #0EC8CB;
-webkit-transform: rotate3d(0,0,1,-25deg) scale3d(0,0.5,0.5);
	transform: rotate3d(0,0,1,-25deg) scale3d(0,0.5,0.5);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}



.link--takiri:hover::before {
	-webkit-transform: rotate3d(0,0,1,-25deg) scale3d(0.5,0.5,0.5);
	transform: rotate3d(0,0,1,-25deg) scale3d(0.8,0.2,0.5);
}

.link--takiri span {
	font-size: 20%;
	font-weight: 400;
	position: absolute;
	right: 15px;
	color: #e53369;
	bottom: 0;
	opacity: 0;
	-webkit-transform: translate3d(-10px,-10px,0);
	transform: translate3d(-10px,-10px,0);
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}


.link--takiri:hover span {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}


/* QUE HAGO */

.serv1, .serv2, .serv3{ width:295px; height:300px; float:left;  text-align:center; padding:10px ; border-right:2px solid rgba(206, 43, 43, 0.40); border-style:groove; margin:40px 0 10px 0; color:#fff}

.serv4{ width:295px; height:300px; float:left;  text-align:center; padding:10px ;  border-style:groove; margin:40px 0 10px 0; border-right:0px solid #000;color:#fff }


/* PAISES */

.contenedor_iz, .contenedor_der{ width:50%; float:left; margin:auto; text-align:center; min-height:400px}

.pais1{ width:270px; height:220px; float:left; margin:0 0 0 50px}
.pais2{ width:180px; height:180px; float:left; margin:40px 0 0 0}
.pais3{ width:130px; height:130px; float:left; margin:0 0 0 200px}
.pais4{ width:180px; height:250px; float:left; margin:70px 0 0 10px}
.pais5{ width:130px; height:130px; float:left; margin:-180px 0 0 80px}


.arg-grid {
	list-style: none;
	display: block;
	text-align: center;
	width: 220px;
	float:left
}

.arg-grid li {
	width: 220px;
	height: 220px;
	display: inline-block;
}

.arg-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	cursor:pointer
}

.arg-info-wrap, 
.arg-info{
	position: absolute;
	width: 180px;
	height: 180px;
	border-radius: 50%;
}

.arg-info-wrap {
	top: 20px;
	left: 20px;
	background: #f9f9f9 url(../images/bg.jpg);
	box-shadow: 
		0 0 0 20px rgba(68,97,116,1), 
		inset 0 0 3px rgba(0,0,0, 0.8);
}

.arg-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-position: center center;
   -webkit-backface-visibility: hidden; /*Just for webkit to have a smooth font*/
}

.arg-info .arg-info-front {
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	-o-transition: all 0.6s ease-in-out;
	-ms-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}

.arg-info .arg-info-back {
	opacity: 0;
	background-image:url(../img/86.jpg);
	pointer-events: none;
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	
	-webkit-transition: all 0.4s ease-in-out 0.2s;
	-moz-transition: all 0.4s ease-in-out 0.2s;
	-o-transition: all 0.4s ease-in-out 0.2s;
	-ms-transition: all 0.4s ease-in-out 0.2s;
	transition: all 0.4s ease-in-out 0.2s;
}

.arg-img-1 { 
	background-image: url(../img/argentina.jpg);
}

.arg-item:hover .arg-info-front {
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	opacity: 0;
} 

.arg-item:hover .arg-info-back {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	pointer-events: auto;
}

.chile-grid {
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 180px;
}


.usa-grid {
	list-style: none;
	display: block;
	text-align: center;
}


.usa-grid li, .chile-grid li {
	width: 180px;
	height: 180px;
	display: inline-block;
}


.usa-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	cursor:pointer
}

.usa-info-wrap, 
.usa-info{
	position: absolute;
	width: 140px;
	height: 140px;
	border-radius: 50%;
}

.usa-info-wrap {
	top: 20px;
	left: 20px;
	background: #f9f9f9 url(../images/bg.jpg);
	box-shadow: 
		0 0 0 20px rgba(255,255,255,0.2), 
		inset 0 0 3px rgba(0,0,0, 0.8);

}

.usa-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-position: center center;
-webkit-backface-visibility: hidden; /*Just for webkit to have a smooth font*/
}

.usa-info .usa-info-front {
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	-o-transition: all 0.6s ease-in-out;
	-ms-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}

.usa-info .usa-info-back {
	opacity: 0;
    background-image:url(../img/5.jpg);
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: all 0.4s ease-in-out 0.2s;
	-moz-transition: all 0.4s ease-in-out 0.2s;
	-o-transition: all 0.4s ease-in-out 0.2s;
	-ms-transition: all 0.4s ease-in-out 0.2s;
	transition: all 0.4s ease-in-out 0.2s;
}

.usa-img-1 { 
	background-image: url(../img/usa.jpg);
}

.usa-img-2 { 
	background-image: url(../img/chile.jpg);
}

.usa-item:hover .usa-info-front {
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	opacity: 0;
} 

.usa-item:hover .usa-info-back {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	pointer-events: auto;
}



/*--------------------------------------------*/



.mex-grid {
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
}

.otros-grid {
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
}

.otros-grid li,.mex-grid li {
	width: 130px;
	height: 130px;
	display: inline-block;
}

.otros-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.1);
	cursor:pointer
}

.otros-info-wrap, 
.otros-info{
	position: absolute;
	width: 90px;
	height: 90px;
	border-radius: 50%;
}

.otros-info-wrap {
	top: 20px;
	left: 20px;
	background: #f9f9f9;
	box-shadow: 
		0 0 0 20px rgba(38,170,182,0.8), 
		inset 0 0 3px rgba(0,0,0, 0.8);
}

.otros-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-position: center center;
	background-repeat:no-repeat
	-webkit-backface-visibility: hidden; /*Just for webkit to have a smooth font*/
}

.otros-info .otros-info-front {
	-webkit-transition: all 0.6s ease-in-out;
	-moz-transition: all 0.6s ease-in-out;
	-o-transition: all 0.6s ease-in-out;
	-ms-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}

.otros-info .otros-info-back {
	opacity: 0;
	background-image:url(../img/2.jpg);
	pointer-events: none;
	-webkit-transform: scale(1.5);
	-moz-transform: scale(1.5);
	-o-transform: scale(1.5);
	-ms-transform: scale(1.5);
	transform: scale(1.5);
	-webkit-transition: all 0.4s ease-in-out 0.2s;
	-moz-transition: all 0.4s ease-in-out 0.2s;
	-o-transition: all 0.4s ease-in-out 0.2s;
	-ms-transition: all 0.4s ease-in-out 0.2s;
	transition: all 0.4s ease-in-out 0.2s;
}

.otros-img-1 { 
	background-image: url(../img/inglaterra.jpg);;
}

.otros-img-2 { 
	background-image: url(../img/mexico.jpg);;
}

.otros-info h3 {
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 18px;
	margin: 0 15px;
	padding: 40px 0 0 0s;
	height: 80px;
	font-family: 'Open Sans', Arial, sans-serif;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.3);
}



.otros-item:hover .otros-info-front {
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	opacity: 0;
} 

.otros-item:hover .otros-info-back {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	pointer-events: auto;
}


/* HABILIDADES */

#skills{background:#fff; margin-top:0px;}

.skills {
float:left;
clear:both;
width:100%;
}

.skills ul,
.skills li {
display:block;
list-style:none;
margin:0;
padding:0;
}

.skills li {
float:right;
clear:both;
padding:0 15px;
height:35px;
line-height:35px;
color:#fff;
margin-bottom:1px;
font-size:18px;
}

.skills .jq {
background:#97BE0D;
}

.skills .css {
background:#D84F5F;
}

.skills .html {
background:#88B8E6;
}

.skills .php {
background:#BEDBE9;
}

.skills .sql {
background:#EDEBEE;
}



#diagram {
width:100%;
margin:20px auto 0

}

.get {
display:none; 
}



/* ESTUDIOS */

#estudios{ text-align:center; color:#FFF}

/*=========================================
	Some fun facts
==========================================*/

#facts {
	background-image: url("../img/estudios.jpg");
	background-attachment: fixed !important;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 70px 0;
	height:480px
}



.parallax-overlay {
	padding: 10px 0;
}

.logos_estudios{ width:100%; height:100px; margin:80px 0; }

#pragma, #dh, #wink, #litwink, #ash, #bmd, #mixtion, #babel  {
  position:relative;
  width:146px;
  height:90px;
  margin:0 auto;
  cursor:pointer;
  float:left; 
}


#dh img, #pragma img, #wink img, #litwink img, #ash img, #bmd img, #mixtion img, #babel img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}

#dh img.top:hover,#pragma img.top:hover,#wink img.top:hover,#litwink img.top:hover ,#ash img.top:hover,#bmd img.top:hover,#mixtion img.top:hover,#babel img.top:hover{
  opacity:0;
}


/* CLIENTES */



section{
  
}
section:before,
header:before,
section:after,
header:after {
  content: "";
  display: table;
}
section:after, header:after {
  clear: both;
}

.sectiongrey { background: #f5f6f7; }


#slide-wrapper {
  margin-top: 20px;
  *zoom: 1;
  overflow: hidden;
  display: inline;
  float: left;
  width: 97.02380952380952%;
  margin: 0 1.488095238095238%;
}
#slide-wrapper:before, #slide-wrapper:after {
  content: "";
  display: table;
}
#slide-wrapper:after {
  clear: both;
}
#slide-wrapper .testimonials {
  position: relative;
}
#slide-wrapper .testimonials li {
  width: 100px;
  display: block;
  float: left;
  height: 200px;
  padding: 50px 0;
  margin: 0 14px;
  text-align: center;
  
}
#slide-wrapper .testimonials li figure {
  margin: 0 auto;
  *zoom: 1;
}
#slide-wrapper .testimonials li figure:before, #slide-wrapper .testimonials li figure:after {
  content: "";
  display: table;
}
#slide-wrapper .testimonials li figure:after {
  clear: both;
}
.pagination {
  text-align: center;
}
.pagination a {
  width: 12px;
  height: 12px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  
  display: block;
  margin: 0 5px 0 0;
  display: inline-block;
  cursor: pointer;
  border:2px solid #0EC8CB
}
.pagination a.selected {
  background-color: #0EC8CB;
}
.pagination a span {
  display: none;
}


/*************************************************************/
/*************************************************************/
/*********************** PORTFOLIO *****************************/
/*************************************************************/
/*************************************************************/


.port_txt{ width:100%; text-align:center; margin:20px 0 50px }


/* Para Safari */
::selection {
color:#fff;
background: #0EC8CB;
}

/* Para Firefox */
::-moz-selection {

color:#fff;
background: #0EC8CB;

}

#seccion_proy{margin-top:20px; height:auto;background:#eee;z-index: 1;	position: relative; }

.proyecto{ width:75%; height:auto; float:left; padding:60px 50px 0px 0}
.tareas{ width:25%; height:auto; float:left; padding:60px 0 0px 0}

.linea2{width:50px; height:4px; float:left;margin:10px auto 15px; }

.linea3{width:50px; height:4px; float:left;margin:10px auto 15px; }

ul.a {
    list-style-image: url(../img/bullet.png); padding:0 0 0 14px; margin:0 0 24px 0; font-family: 'PT Sans', sans-serif;}


.agencia:link, .agencia:active, .agencia:visited{
	font-family: 'PT Sans', sans-serif;
	color:#666;
	font-size: 16px;
	line-height:16px;
	text-decoration:none;
	padding-top:20px
}

.agencia:hover{color:#db5252;
	font-size: 16px;
}


/*************************************************************/
/*************************************************************/
/*********************** CONTACTO *****************************/
/*************************************************************/
/*************************************************************/

.datos{ width:25%; height:auto; float:left; padding:20px 0 0px 0}
.formulario{ width:75%; height:auto; float:left; padding:20px 50px 0px 0}

.item_datos{ width:100%; height:40px; line-height:40px; clear:both; margin-bottom:10px}
.icono_datos{ width:40px; height:40px; margin-right:10px; float:left}
.txt_datos{ width:auto; height:40px; line-height:40px; float:left;font-family: 'PT Sans', sans-serif; }


.mail2:link, .mail2:active, .mail2:visited{
	font-family: 'PT Sans', sans-serif;
	color:#000; 
	font-size: 16px;
	text-decoration:none}

.mail2:hover{color:rgba(14,200,203,1);
	font-size: 16px;
	color:#db5252
}

.campo{font-family: 'PT Sans', sans-serif; margin-bottom:10px}