diff --git a/src/main/webapp/WEB-INF/jsp/avaliacao/avaliar.jsp b/src/main/webapp/WEB-INF/jsp/avaliacao/avaliar.jsp
index b79be8e..b0f6539 100644
--- a/src/main/webapp/WEB-INF/jsp/avaliacao/avaliar.jsp
+++ b/src/main/webapp/WEB-INF/jsp/avaliacao/avaliar.jsp
@@ -65,16 +65,16 @@
 				</div>
 				
 			</div>
-			<!--
+			
 			<div id="legenda" class="${sem_nota}">
 				<label>Legenda</label><br>
 				<ul>
-					<li class="legenda" aria-label="verde"><div id="bom"></div> >= 95%</li>
-					<li class="legenda"><div id="razoavel"></div> >= 85% e &#60; 95%</li>
-					<li class="legenda"><div id="ruim"></div> >= 70% e &#60; 85%</li>
-					<li class="legenda"><div id="pessimo"></div> &#60; 70%</li>
+					<li class="legenda"><img id="bom" alt="farol verde, nota maior ou igual a 95%" src="inicial_arquivos/imagens/verde.png"></li>
+					<li class="legenda"><img id="razoavel" alt="farol amarela, nota maior ou igual a 85% e menor que 95%" src="inicial_arquivos/imagens/amarelo.png"></li>
+					<li class="legenda"><img id="ruim" alt="farol laranja, nota maior ou igual a 70% e menor que 85%" src="inicial_arquivos/imagens/laranja.png"></li>
+					<li class="legenda"><img id="pessimo" alt="farol vermelho, nota menor que 70%" src="inicial_arquivos/imagens/vermelho.png"></li>
 				</ul>
-			</div>  -->
+			</div> 
 			<div class="cell width-7 position-6">
 			<table id="tabelaErros${sem_nota}">
 				<caption class="tabelaErros">Resumo de Acessibilidade por Seção eMAG</caption>
diff --git a/src/main/webapp/WEB-INF/jsp/index/index.jsp b/src/main/webapp/WEB-INF/jsp/index/index.jsp
index e2fe037..724afee 100644
--- a/src/main/webapp/WEB-INF/jsp/index/index.jsp
+++ b/src/main/webapp/WEB-INF/jsp/index/index.jsp
@@ -5,15 +5,7 @@
 
 <t:baseLayout>
 	<jsp:body>
-<div style="background: yellow;">
-	<map name="Map" id="Map"><area shape="rect" coords="60,17,165,41" href="index.html" />
-<area shape="rect"  href="oqueebric.html" />
-<area shape="rect" coords="304,16,467,43" href="radiografia_paises.html" />
-<area shape="rect" coords="484,17,630,40" href="cronologia_grupo.html" />
-<area shape="rect" coords="652,14,738,42" href="a_1_cupula.html" />
-<area shape="rect" coords="762,18,859,39" href="fale_conosco.html" />
-</map>
-	</div>
+
 <div class="container">
 
 	<div class="tile --NOVALUE--">
diff --git a/src/main/webapp/inicial_arquivos/css/avaliar.css b/src/main/webapp/inicial_arquivos/css/avaliar.css
index f8bbbe2..ee2a87b 100644
--- a/src/main/webapp/inicial_arquivos/css/avaliar.css
+++ b/src/main/webapp/inicial_arquivos/css/avaliar.css
@@ -1,37 +1,26 @@
 @media only screen and (min-width : 768px) {
 
 	
-#bom
-	{
-	width: 15px;
-	height: 15px;
-	float: left;
-	background: #0d0;
-	border: 1px solid #090;
+	#bom
+	{	
+	width: 80px;
+	height: 20px;
+	
 	}
 	#razoavel
 	{
-	width: 15px;
-	height: 15px;
-	float: left;
-	background: #ffff00;
-	border: 1px solid #f2f200;
+	width: 125px;
+	height: 20px;;
 	}
 	#ruim
 	{
-	width: 15px;
-	height: 15px;
-	float: left;
-	background: #ff8000;
-	border: 1px solid #e17100;
+	width: 127px;
+	height: 20px;;
 	}
 	#pessimo
 	{
-	width: 15px;
-	height: 15px;
-	float: left;
-	background: #ff0000;
-	border: 1px solid #ea0000;
+	width: 70px;
+	height: 20px;
 	}
 	
 	#legenda{
@@ -387,13 +376,13 @@
 /*-----Fim (min-width : 768px)------ */
 @media only screen and (max-width : 768px) {
 	
-	#bom
+	.imgLegenda
 	{
-	width: 15px;
+	width: 30px;
 	height: 15px;
 	float: left;
-	background: #0d0;
-	border: 1px solid #090;
+	background: #28be28;
+	border: 1px solid #008000;
 	}
 	#razoavel
 	{
--
libgit2 0.21.2