body {
	background-color: #ddd;	
	overflow: hidden;
}

.containerPrincipal {
	display: grid;
	grid-template-rows: 8vh 86vh 6vh;
	grid-template-columns: auto;
	min-height: 100%;
}

.cabecalhoAvaliacao {
	top: 0;
	z-index: 99;
	width: 100%;
	padding: .5rem;
	background-color: #FFFFFF;
	color: #11275B;
	box-shadow: 0 1px 5px -2px;
	display: flex;
    align-items: center;
	justify-content: space-between;
}

.cabecalhoAvaliacao .logoCabecalho {
	width: 8rem;
}

.cabecalhoAvaliacao .avatarUsuario {
	width: 2.5rem;	
}

.corpoAvaliacao {
	background-color: #ddd;
	backdrop-filter: blur(3px);
	overflow-y: auto;
}

.rodapeAvaliacao {
	/*position: fixed;*/
	bottom: 0;
	z-index: 99;
	width: 100%;
	/*height: 5rem;*/
	padding: .5rem;
	background-color: #11275B;
	color: #FFFFFF;
	box-shadow: 0 -1px 5px -2px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px; 
}

.bg-verde {
	background-color: #17A2B8;
	color: #FFFFFF;
}

.bg-amarelo {
	background-color: #FFC107;
	color: #000000;
}

.bg-preto {
	background-color: #343A40;
	color: #FFFFFF;
}

.corAmarela {
	color: #FFC107;
}
.bg-cinza {
	background-color: #CCC;
	color: #000000;
}

/* Responsividade */

@media screen and (max-width: 768px) {
	.ocultaMobile {
		visibility: hidden;
		clear: both;
		float: left;
		display: none !important;
	}
	
	.cabecalhoAvaliacao .logoCabecalho {
		width: 6rem;
	}
	
	.cabecalhoAvaliacao .avatarUsuario {
		width: 2.25rem;	
	}

	.rodapeAvaliacao {
		font-size: 8px;
	}
	
	.rodapeAvaliacao br {
		display: none;
	}
	
}

@media (min-width: 768px) {
	.mostraMobile{
		visibility: hidden;
		clear: both;
		float: left;
		display: none !important;
	}
}