/*não ha mais o uso de animation no codigo, subistituido por transition*/

/*INICIO DA ANIMAÇÃO DO CABEÇALHO*/

/*classe original*/
.cabecalho
{

 width:100%;
 height:49%;
 
 background-color:rgb(0,128,128);
 
 border-bottom:1%; border-bottom:solid white; 
 /*Posiçoes, alterar elas podem comprometer a animação*/
 position:relative;
 top:0%;
 
 z-index: 10;/*Prioridade de sobreposição, retirar essa linha pode bugar a logo*/
 
 transition: top, 0.5s;/*novas propriedades da animação*/
  transition-delay:0.5s;
}
/*classe de troca*/
.cabecalho2
{

 width:100%;
 height:49%;
 
 background-color:rgb(0,128,128);
 
 border-bottom:1%; border-bottom:solid white; 
 /*Posiçoes, alterar elas podem comprometer a animação*/
 position:relative;
 top:-30%;
 
 z-index: 10;/*Prioridade de sobreposição, retirar essa linha pode bugar a logo*/
 
  transition: top, 0.5s,ease;/*novas propriedades da animação*/
}

/*FIM DA ANIMAÇÃO DO CABEÇALHO*/


/*INICIO DA ANIMAÇÃO DO RODAPE*/

/*classe original*/
.rodape
{
	
 width:100%;
 height:50%; 
 
 border-top:1%; border-top:solid white;
 
 background-color:rgb(42,54,59);
 /*Posiçoes, alterar elas podem comprometer a animação*/
 position:relative;
 top:0%;
 
 
 transition: top, 0.5s;/*novas propriedades da animação*/
 transition-delay:0.5s;
}
/*classe de troca*/
.rodape2{
	width:100%;
 height:50%; 
 
 border-top:1%; border-top:solid white;
 
 background-color:rgb(42,54,59);
 /*Posiçoes, alterar elas podem comprometer a animação*/
 position:relative;
 top:70%;
 
 transition: top, 0.5s, ease;/*novas propriedades da animação*/
 }
 
 /*FIM DA ANIMAÇÃO DO RODAPE*/
 
 
 
 
 /*INICIO DA ANIMAÇÃO DA LOGO*/
 
 /*classe original*/
.logo
{
	/*Posiçoes, alterar elas podem comprometer a animação*/
	position:relative;
	left:41%;
	
	border-color:white;
 
 
	margin-top:15%;
	
	transition: top, 0.5s;/*novas propriedades da animação*/

}
/*classe de troca*/
.logo2
{
	/*Posiçoes, alterar elas podem comprometer a animação*/
	position:relative;
	left:2%;
	
	border-color:white;
 
 
	margin-top:17%;
	
	transition: top, 0.5s;/*novas propriedades da animação*/
	transition-delay:0.5s;
}

/*FIM DA ANIMAÇÃO DA LOGO*/