* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	background: url('../img/diomio.jpg');
	background-size: cover;
	background-attachment: fixed;
	font-family:'Open Sans',Sans-serif, Arial, Helvetica;
}

a {	text-decoration: none; }

.contenedor {
	width: 90%;
	max-width: 700px;
	margin: auto;
	height: 100%;
	display: flex;
	align-items:center;
}
.absu{
	z-index: 3000;
	position: relative;
		top: -25px;
		height: 150px;
		width: 180px;
}
@keyframes aumento{
	0%{
		transform: scale(1);
	}
	100%{
		transform: scale(1.1);
		
	}
}


.tarjeta {
	position: relative;
	margin:40px 0;
	width: 100%;
	background:rgb(255, 255, 255);
	border-radius: 5rem;
	overflow: hidden;
	z-index: 1000;
}
.imagen{
	width: 120px;
	border-radius: 5%;
	transition: 0.8s all;
	margin-top: 10px;
	margin-bottom: 5px;
}
.imagen:hover{
transform: scale(1.1);

}

/* --------------------------------------- */
/* ----------- Slider banner ------------- */
/* --------------------------------------- */
.slider_banner {
	overflow: hidden;
	z-index: 1000;
	position: relative;
}

.slider_banner .banner {
	position: relative;
	width: 100%;
}

.slider_banner .banner img {
	vertical-align: top;
	width: 100%;
	position: absolute;
	top: 0;
	left: 100%;
}

.slider_banner .flecha-banner {
	font-size: 35px;
	line-height: 35px;
	color: rgba(0,0,0,.2);
	position: absolute;
	top:50%;
	z-index: 1100;
}

.slider_banner .flecha-banner:hover {
	color: rgba(0,0,0,.5);
}

.slider_banner .flecha-banner.anterior {left: 20px;}
.slider_banner .flecha-banner.siguiente {right: 20px;}


/* --------------------------------------- */
/* ----------- Slider information---------- */
/* --------------------------------------- */
.slider_info {
	text-align: center;
	overflow: hidden;
	padding: 20px 0;
	z-index: 1000;
	position: relative;
}

/* --------------------------------------- */
/* -------- Section information ---------- */
/* --------------------------------------- */
.slider_info .informacion {
	width: 100%;
}

.slider_info .informacion article {
	width: 100%;
	overflow: hidden;
	position: relative;
}

.slider_info .informacion article .slide{
	background:  rgb(255, 255, 255);
	width: 100%;
	left: 100%;
	padding: 20px 0px;
	position: absolute;
}

/* --------------------------------------- */
/* ------------ Section arrows ----------- */
/* --------------------------------------- */
.slider_info .flecha-info {
	font-size: 35px;
	line-height: 35px;
	color: #0d0358;
	position: absolute;
	top:50%;
	z-index: 1000;
}

.slider_info .flecha-info:hover {
	color:#0b0060;
}

.slider_info .flecha-info.anterior {
	left: 20px;
}

.slider_info .flecha-info.siguiente {
	right: 20px;
}


/* --------------------------------------- */
/* -------- styles for the slide --------- */
/* --------------------------------------- */
.slider_info .informacion .nombre {
	color: #180a5f;
	font-size: 49px;
	line-height: 38px;
	font-weight:600;
	margin-bottom: 16px;
	animation: aumento 2s  alternate-reverse;
		transition: 1s all ;
}


.slider_info .informacion .trabajo {
	color: #296eda;
	font-weight: 600;
	font-size: 40px;
	line-height: 18px;
	margin-bottom: 16px;
	animation: aumento 2s  alternate-reverse;
		transition: 1s all ;
}
.centrar{
	display: flex;
	justify-content: center
}

.slider_info .informacion .pais {
    margin-top: 10px;
	width: 200px;
	text-align: center;
    border-radius: 8px;
	background-color:  #0c0769;
	padding: 12px;
	color: #f7f7f7;
	font-size: 14px;
	line-height: 14px;
	transition: 0.5s all;
}


.slider_info .informacion .pais:hover{
	cursor: pointer;
	background-color:#d5ac23;
	
	transform: scale(1.1);


}

.slider_info .informacion .pais img {
	position: relative;
	top:2px;
	margin-right: 10px;
}

.slider_info .informacion .texto {
	color: #55acee;
	font-size: 18px;
	line-height: 24px;
	margin: 0px 45px;
}

.slider_info .informacion .subtitulo {
	color: #2912c1;
	font-size: 18px;
	line-height: 24px;
	margin-bottom: 7px;
}

/* --------------------------------------- */
/* -------------- Buttons ---------------- */
/* --------------------------------------- */

.slider_info .informacion .botones {
	width: 100%;
}
	
.slider_info .informacion .botones span {
	width: 14px;
	height: 14px;
	display: inline-block;
	margin: 0 10px;
	border-radius: 50%;
	background:#4f70f1;
}

.slider_info .informacion .botones .active {
	background: #030b60;
}


/* --------------------------------------- */
/* ----------- Social networks ----------- */
/* --------------------------------------- */
.redes-sociales {
	text-align: center;
	padding: 20px 0;
}

.redes-sociales a {
	display: inline-block;
	font-style:20px;
	width: 50px;
	height: 50px;
	font-line:20px;
	padding: 14px 0;
	border-radius: 50%;
	color: #fff;
	margin: 0 10px;
}

.redes-sociales .github { background: rgb(24, 10, 95) }
.redes-sociales .github:hover { background: rgb(24, 10, 95) }
.redes-sociales .facebook { background:rgb(24, 10, 95) }
.redes-sociales .facebook:hover { background:rgb(24, 10, 95) }
.redes-sociales .youtube { background: rgb(24, 10, 95) }
.redes-sociales .youtube:hover { background: rgb(24, 10, 95) }

@media (max-width:500px){
	.absu{
		width: 140px;
	}
	.slider_info .informacion .nombre {
     font-size: 28px;

	}
	.slider_info .informacion .trabajo {
		
		font-size: 22px;
		
	}
	.slider_info .flecha-info {
		
		top: 68%;
		
	}
}