
body{
	margin:0;
	
	
}
@font-face{
	font-family:Coolvetica Rg;
	src:url("fuentes/Coolvetica Rg.otf");
}


.contenedor{
	display:flex;
	width:auto;
	height:auto;
	flex-direction:column;
	background-color:white;
	font-family:Coolvetica Rg;
}
main{
	background-color:#121212;
	display:flex;
	flex-direction:column;
	
	margin-right:;
	height:auto;
	width:auto;
}
section{
	background-color:#121212;
	width:70%;
	height:auto;
	display:flex;
	flex-direction:column;
	padding-left:2%;
	margin-bottom:2%;
	font-size:18px;
}

aside{
	margin-top:2%;
	background-color:#121212;
	width:31%;
	margin-left:;
	margin-right:2%;
	display:flex;
	flex-direction:column;
	padding:;
	height:85vh;
}

li{
	line-height:30px;
}


footer{
	background: rgb(0,112,50);
    background: radial-gradient(circle, rgba(0,112,50,0.9612219887955182) 0%, rgba(0,213,103,1) 100%);
	
	/*color 2*/
	background: rgb(1,88,46);
    background: linear-gradient(90deg, rgba(1,88,46,1) 0%, rgba(13,189,137,1) 51%, rgba(1,88,46,1) 100%);
	
	height:auto;
	width:100%;
	display:flex;
	align-items: center;
	flex-direction:row;
	justify-content: space-evenly;
}


nav{
    align-items: center;
    justify-content: space-around;
	height:15vh;
	width:85%;
	display:flex;
	flex-direction:row;
	font-family:coolvetica rg;
	
}

nav a:link, nav a:visited{
	display:flex;
	align-items: center;
	justify-content:center;
	color:black;
	text-transform:uppercase;
	letter-spacing:2px;
	border-radius:15px;
	text-decoration:none;/*sin subrayado*/
	width:15%;
	height:8vh;
	font-size:17px;
	
	transition:color 1s, background-color 1s, font-size 1s, border-color 1s;
	/*background-color:blue;*/
	
}


nav a:hover{
	color:;
	background-color:#4ef57e;
	font-size:18px;
	border-color:black;
}


header{
	background: rgb(0,112,50);
    background: radial-gradient(circle, rgba(0,112,50,0.7483368347338936) 0%, rgba(0,213,103,1) 100%); 
	/*color 2*/
	background: rgb(1,88,46);
    background: linear-gradient(90deg, rgba(1,88,46,1) 0%, rgba(13,189,137,1) 51%, rgba(1,88,46,1) 100%);
	
	height:15vh;
	align-items: center;
	display:flex;
	width:100%;
	
}



a{
color:#ffffff;
text-decoration:none;
}

a:hover{
color:#aefcc2;
}

em{
	color:#aefcc2;
}

.blanco{
 color:#c7fff1;
} 

.voz{
	color:#feffc7;
}

iframe{
	width:100%;
	height:100vh;
	padding:3%;
	margin-right:;
	display:flex;
	background-color:#121212;
	
}

h1{
	text-align:center;
	margin-top:3%;
	font-size:32px;
	color:#63ff8a;
	
}

h2{
	text-align:center;
	margin-top:3%;
	font-size:25px;
	color:#63ff8a;
	
}

h3{
	text-align:center;
	margin-top:1%;
	font-size:20px;
	color:#63ff8a;
	
}

li{
	color:white;
	font-size:17px;
	margin-left:1%;
}

.fundadores{
	display:flex;
	justify-content:center;
	
}

img{
	border-radius:7px;
}

p{
	text-align:justify;
	padding:1.5%;
	color:white;
	
}

.abio{
	margin-left:1.5%;
	margin-right:1.5%;
}

.abajo{
	
}

.nosotros{
	display:flex;
	flex-direction:row;
	width:50%;
	color:white;
	justify-content: center;
    align-items: center;
	
}

.info{
	display:flex;
	flex-direction:row;
}

.imagenes{
	display:flex;
	flex-direction:column;
}

.logo{
	display:flex;
	justify-content:center;
	margin-left:2%;
    align-items: center;
    height: 10vh;
    width: 18%;
	
}

.abajo{
	display:flex;

	margin-left:;
}

.byb{
	display:flex;
	flex-direction:column;
}

.yo{
	width:30%;
	
}
	
.ginna{
	width:30%;

	
}	

.ginnaa{
	
    display:flex;
	justify-content: center;
}	

.texto{
	
    display:flex;
	justify-content: center;
}	

.codigo{
	
    display:flex;
	justify-content: center;
}	

.todo{
	
    display:flex;
	flex-direction:row;
	align-items: center;
	
}	
 
.simbolo img{
    margin-top:0;
	margin-left:6%;
}


span{
   position:absolute;
   background:white;
   transform: translate(-50%,-50%);
   animation:animate 1s linear infinite;
}

.ir-arriba {
	display:none;
	padding:20px;
	background:#024959;
	font-size:20px;
	color:#fff;
	cursor:pointer;
	position: fixed;
	bottom:20px;
	right:20px;
	background-color:#0dbd89;
}

   
.gif{
	display:flex;
    align-items: center;
    justify-content: center;
	margin-top:%;
    height:50vh;
	width:100%;
	border-radius:8px;
}

.gif img{
	
    height:55vh;
	width:50%;

}

.video{
	width:600px;
	height:50vh;
}	

.video2{
	width:600px;
	height:50vh;
}	

.recital2{
	justify-content: center;
	
	align-items: center;
  
	display:flex;
	flex-direction:row;
	margin-left:%;
	margin-bottom:5%;
}	


.recital{
  justify-content: space-around;
	align-items: center;
  
	display:flex;
	flex-direction:row;
	margin-left:%;
	margin-bottom:5%;
}

.duki img{
	margin-top:1%;
	margin-right:;
	width:300px;
	
}


.louta img{
	margin-top:1%;
	
	width:70%;
	
}

.biza img{
    margin-top:;
	margin-bottom:6%;
	width:70%;
	
}	

.tobi img{
        width:90%;
}

.aside{
	display:flex;
	flex-direction:column;
	margin-top:9%;
}


/*---------Media queries-------*/

@media screen and (max-width:800px)
{
	
	body{
	margin:0;
    }
	
	
	.contenedor{
		height:auto;
		flex-direction:column;
		width:auto;
		
			
	}
	header{
		display:flex;
		flex-direction:column;
		text-align:center;
		height:auto;
		width:100%;
 		}
	
	main,footer{
		display:flex;
		height:auto;
		flex-direction:column;
		width:100%;
		align-items:center;
		text-align:center;
		}
	
	
	iframe{
		margin-left:2%;
		height:40vh;
		align-items: center;
		width:90%;
		
	}
	aside{
		height:25vh;
		align-items: center;
		width:90%;
		
	}
	
	section{
	width:100%;
	height:auto;
	display:flex;
	flex-direction:column;
	align-items: center;
	
     }
	
	img{
	width:98%;
	margin-right:2%;
    }
	
	.info{
		display:flex;
		
		flex-direction:column;
		align-items: center;
		padding:2%;
			
		width:auto;
		height:auto;
		
	}
	

	
	.foto img{
		margin-top:5%;
	
	    border-radius:8%;
		padding:4%;
		display:flex;
	    flex-direction:column;
		height:auto;
		align-items:center;
		width:90%;
	}	
	
    .ficha{
		display:flex;
		flex-direction:column;
		border-radius:6px;
		width:100%;
	    
	}
	nav a:link, nav a:visited{
	display:flex;
	align-items: center;
	justify-content:center;
	color:black;
	text-transform:uppercase;
	letter-spacing:2px;
	border-radius:15px;
	text-decoration:none;/*sin subrayado*/
	width:15%;
	height:8vh;
	font-size:17px;
	
	transition:color 1s, background-color 1s, font-size 1s, border-color 1s;
	/*background-color:blue;*/
	
}


nav a:hover{
	color:;
	background-color:#4ef57e;
	font-size:18px;
	border-color:black;
}
	
	
	nav{
		padding-bottom:2%;
		margin-top:5%;
		margin-bottom:5%;
		width:auto;
		display:flex;
		flex-direction:column;
		justify-content: space-evenly;
		align-items: center;
	}	
	
	.logo{
		display:flex;
		flex-direction:column;
	    width:auto;
	    justify-content: space-evenly;
		height:auto;
	}
		
	
	.imagenes{
	
	display:flex;
	flex-direction:column;
	align-items: center;
	
	}
	
	.nosotros{
	display:flex;
	flex-direction:row;
	align-items: center;
	text-align:center;
	justify-content: space-evenly;
	}
	
	.simbolo{
	margin-right:20%;
    }

    .abajo{
	display:flex;
	flex-direction:column;
	align-items: center;
    }
	
	
   

	.contenedor1 .card
	{
		width:40%;
		
		align-items:flex-start;
	}
   .contenedor1 .card:hover
   {
  

   }

  .contenedor1 .card:hover img
  {
  	width:55%;
  	height:60px;
  }
  .contenedor1 .card .contenido {
  	width:100%;
  	left:0;
    height:40vh;
  }
  
   .video {
  	width:50%;
  	height:250px;
  }
   	 .recital2 {
  	width:100%;
  	height:250px;
  }
  
 
 .duki img {
  	 width:90%;
  }
   .nicki img {
  	 width:90%;
  }
  .tobi img{
  	 width:90%;
  }
  .tiago img{
  	 width:100%;
  }
  
  
  .gif img {
  	 width:60%;
	 height:35vh;
  }
  

}	
/*cartitas*/

.contenedor1{
	display:flex;
	flex-wrap:wrap;
	padding-top:8%;
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
	
}	

.contenedor1 .card{
    margin-top:%;
	display:flex;
	transition:0.5s;
	position:relative;
	width:600px;
	height:300px;
	margin:20px;
	justify-content:flex-start;
	align-items:center;
	background: rgb(1,88,46);
    background: linear-gradient(90deg, rgba(1,88,46,1) 0%, rgba(13,189,137,1) 51%, rgba(1,88,46,1) 100%);
}

.contenedor1 .card img{

	position:absolute;
	bottom:0;
	left:50%;
	height:400px;
	transform:translateX(-50%);
	transition:0.5s;
	display:flex;
	flex-direction:row;
}	

.contenedor1 .card:hover img{
	left:74%;
	height:400px;
}

.contenedor1 .card .contenido{
    position:relative;
	width:50%;
	left:20%;
	padding:20px 20px 20px 40px;
	transition:0.5s;
	opacity:0;
	visibility:hidden;
}	

.contenedor1 .card:hover .contenido{
	left:0;
	opacity:1;
	visibility:visible;
}

.contenedor1 .card .contenido h2{
	color:#fff;
	text-transform:uppercase;
	font-size:2.2em;
	line-height:1em;
}

.contenedor1 .card .contenido p{
	color:#fff;
	width:83%;
}	

.contenedor1 .card .contenido a{
	position:relative;
	color:#111;
	background:#fff;
	display:inline-block;
	padding:10px 20px;
	margin-top:10px;
	text-decoration:none;
	font-weight:700;
}



@media (max-width:767px)
{
  .contenedor1{
  	flex-direction:column;
  }
  .contenedor1 .card{
      width: 90%;
    height: 45vh;
  }
  .contenedor1 .card:hover img
  {
  	height:300px;
}


