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

body 
{
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

.BotaoMenu
{
	background-color: #000; 
	height: 35px;
	width: 110px;
	border-radius: 0px 15px 0px 15px;
	color: #FFF;
	position: relative;
}

.TextoBotao
{
	position: absolute;
 	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}

.BotaoMenu:hover
{
	background-color: #FC3; 
	color: #000;
}

.Topo001
{
	display: none;
}

.Topo002
{
	display: block;
}


.Rodape001
{
	display: block;
}

.Rodape002
{
	display: none;
}




/* Imagem do Folder de cima */
@keyframes folderEnt 
{
  0%   { opacity: 0; }
  25%  { opacity: 0.3; }
  50%  { opacity: 0.6; }
  100% { opacity: 1; }
}

.folder
{
	width: 100%; 
	height: 100%; 
	background-image: url('../imagens/folders/folder1.jpg');
	z-index: 5;
	opacity: 3;
	
	animation-name: folderEnt;
  	animation-duration: 2s;
	
	/*filter: brightness(40%);*/
}

.folder1
{
	width: 100%; 
	height: 100%; 
	background-image: url('../imagens/folders/folder2.jpg');
	z-index: 5;
	opacity: 3;
	
	animation-name: folderEnt;
  	animation-duration: 2s;
	
	/*filter: brightness(40%);*/
}

.folder2
{
	width: 100%; 
	height: 100%; 
	background-image: url('../imagens/folders/folder3.jpg');
	z-index: 5;
	opacity: 3;
	
	animation-name: folderEnt;
  	animation-duration: 2s;
	
	/*filter: brightness(40%);*/
}


/* Mensagem de entrada dentro do Folder */
@keyframes MensagensEnt 
{
  0%   { opacity: 0; }
  25%  { opacity: 0.3; }
  50%  { opacity: 0.6; }
  100% { opacity: 1; }
}

.Mensagens
{
	animation-name: MensagensEnt;
  	animation-duration: 5s;
}


/* Caixas de Informação */
.CaixaDeObjetos
{
	width: 300px;
	height:  200px;
	margin: 20px;
	border: 1px #999 solid;
	text-align: left;
    display: inline-table;
    vertical-align: text-top;
	/*border-radius: 15px;*/
	cursor: pointer;
	vertical-align:top
}

.CaixaDeObjetos:hover
{
	box-shadow: inset 0px 0px 10px #888888;
}







/*
320 pixel – Smartphones no formato retrato com tela pequena
480 pixel – Smartphones no formato paisagem com tela pequena
768 pixel – Tablets no formato retrato, como o iPad
960 pixel – Tablets no formato paisagem e alguns monitores mais antigos
1200 pixel – Desktops, notebooks com monitores widescreen
*/

@media (max-width: 900px)
{
	.Topo001
	{
		display: block;
	}
	
	.Topo002
	{
		display: none;
	}
	
		
	
	.Rodape001
	{
		display: none;
	}
	
	.Rodape002
	{
		display: block;
	}
}

@media (max-device-width: 400px)
{
	.Topo001
	{
		display: block;
	}
	
	.Topo002
	{
		display: none;
	}
	
	
	
	.Rodape001
	{
		display: none;
	}
	
	.Rodape002
	{
		display: block;
	}
}