@import url('https://fonts.googleapis.com/css?family=Monoton|Press+Start+2P|Titillium+Web|Merriweather+Sans');
/*slider*/
body {
	font-family: 'Titillium Web', sans-serif;
}
@keyframes slidy {
	0% { left: 0%; }
	20% { left: 0%; }
	25% { left: -100%; }
	45% { left: -100%; }
	50% { left: -200%; }
	70% { left: -200%; }
	75% { left: -300%; }
	95% { left: -300%; }
	100% { left: -400%; }
	}
	
	body { margin: 0; } 
	div#slider { overflow: hidden; }
	div#slider figure img {
		border-radius: 10px; 
		width: 20%; 
		float: left; }
	div#slider figure { 
		position: relative;
		width: 500%;
		margin: 0;
		left: 0;
		text-align: left;
		font-size: 0;
		animation: 10s slidy infinite; 
	}
	.row {
	margin-top: 25px;
}
/*lateral*/
.row {
	margin-top: 25px;
}
.fPerfil{
	margin: 0px 10px 0px 0px;
	max-width: 85%;
}
.logo h1 {
	text-align: center;
	font-family: 'Monoton', cursive, sans-serif;
	font-variant: small-caps;
	font-size: 550%;
	letter-spacing: 0.1em;
	
	border-radius: 15px;
	width: 50%;
  height: 100%;
  background-image: linear-gradient(-70deg, rgb(222, 255, 191), rgb(181, 255, 112));
  position :relative;
  animation: mymove 4s infinite alternate;
}
@keyframes mymove {
  from {left: 0px;}
	to {left: 200px;}
}
.logo2 h1 {
	text-align: center;
	font-family: 'Monoton', cursive, sans-serif;
	font-size: 550%;
	letter-spacing: 0.1em;
	
	border-radius: 15px;
	width: 50%;
  height: 100%;
  background-image: linear-gradient(-70deg, rgb(222, 255, 191), rgb(181, 255, 112));
  position :relative;
  animation: mymove2 4s infinite alternate;
}
@keyframes mymove2 {
  from {right: -50%;}
	to {right: 10%;}
}
.logo2 h1:hover {
	width: 100%;
	position: static;
	background-image: linear-gradient(-70deg, rgb(241, 255, 227), rgb(172, 230, 119));

}
.description h4 {
	font-size: 125%;
}
.contacto {
	text-align: center;
	margin-top: 5%;
}
.contacto a img:hover {
	background-color: whitesmoke;
	padding: 15px;
	border-radius: 15px;
	transition: 
}
.contacto img {
	margin-left: 15%;
	padding: 15px;
}
.email:hover {
	background-color: black;
	color: white;
}

/*secciones*/
.central {
	text-align: center;
}
section article #tituloProyectos {
	text-align: center;
}
#fotoMovie3000 {
	width: 45%;
	height: 45%;
}
#fotoPieProyecto {
	width: 15%;
	height: 15%;
	margin-right: 1%;
}
#imagenProyecto {
	float: right;
}
/*lenguajes*/
#lenguajes ul li {
	list-style: none;
	display: inline;
	margin: 5%;
}
#tituloFormacion, #tituloProyectos, #ambiciones, #tituloYo {
	font-family: 'Merriweather Sans', sans-serif;
}
#lenguajes ul li a:hover {
	color: aliceblue;
}
#lenguajes ul #java:hover {
	border: none;
	padding: 6%;
	transition: all 1s;
	margin: 6%;
	background-size: 100%;
	background-image: url(https://geekytheory.com//assets/images/icons/technologies/java.png);
	background-color: rgb(253, 253, 253)
}
#lenguajes ul #cSharp:hover {
	border: none;
	padding: 6%;
	transition: all 1s;
	margin: 6%;
	background-image: url(https://ih0.redbubble.net/image.416412087.0587/flat,550x550,075,f.jpg);
	background-size: 100%;
}
#lenguajes ul #js:hover {
	border: none;
	padding: 6%;
	transition: all 1s;
	margin: 6%;
	background-image: url(https://vignette.wikia.nocookie.net/programa/images/a/ad/Javascript-logo.png/revision/latest?cb=20161202015025&path-prefix=es);
	background-size: 100%;
}
#lenguajes ul #dWeb:hover {
	border: none;
	padding: 6%;
	transition: all 1s;
	margin: 6%;
	background-image: url(http://autoescuelalondon.com/wp-content/uploads/2016/01/html-css.jpg);
	background-size: 100%;
}
/*sobre mi*/
.tituloYo {
	font-size: 350%;
}
.izquierda, .tituloYo2 {
	text-align: left;
	margin-left: 5%;
	font-size: 150%;
}
article div img {
	margin: 5%;
}
.frase {
	font-size: 135%;
}
/*footer*/
footer {
	
}
.ojos1 {
	padding: 0%;
  position :relative;
  animation: ojos 3s infinite;
}
@keyframes ojos {
  from {left: 75%;}
	to {left: ;}
}
.ojos2 {
	padding: 0%;
	position : absolute;
	right: 15%;
  animation: ojos2 3s infinite;
}
@keyframes ojos2 {
  from {right: 100%;}
	to {right: 5%;}
}