diff --git a/css/estilo.css b/css/estilo.css
index ab3d2c4..8d06323 100644
--- a/css/estilo.css
+++ b/css/estilo.css
@@ -1,11 +1,19 @@
 body{
-    background-color: rgba(8, 8, 8, 0.856);
+    background-color: rgba(82, 82, 82, 0.856);
+}
+
+/*Botões de aumentar e diminuir fonte*/
+.btn-container button{
+    width: 50px;
+    height: 50px;
+    margin: 15px 0px 0px 10px;
 }
 
 h1{
+    font-size: 65px;
     text-align: center;
-    color: yellow;
-    margin-top: 70px;
+    color: #FDFF0F;
+    margin-top: 10px;
 }
 
 /*INÍCIO Estilo: editor de texto*/
@@ -52,7 +60,8 @@ input.btn{
     width: 150px;
     height: 150px;
     margin: 1.5em;
-    background-color: white;
+    background-color: #FDFF0F;
     border-radius: 50%;
 }
+
 /*FIM Estilo dos botões: limpar, upload, download e falar*/
diff --git a/imagem/icon-download.png b/imagem/icon-download.png
new file mode 100644
index 0000000..0e85fd7
Binary files /dev/null and b/imagem/icon-download.png differ
diff --git a/imagem/icon-upload.png b/imagem/icon-upload.png
index 3acb126..f4a43c9 100644
Binary files a/imagem/icon-upload.png and b/imagem/icon-upload.png differ
diff --git a/imagem/icon-voice.png b/imagem/icon-voice.png
index 99bcaa2..2c0bef5 100644
Binary files a/imagem/icon-voice.png and b/imagem/icon-voice.png differ
diff --git a/index.html b/index.html
index 7fabf34..2bbb489 100644
--- a/index.html
+++ b/index.html
@@ -9,36 +9,40 @@
     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
     <link rel="stylesheet" href="summernote-bs4.css">
     <link rel="stylesheet" href="css/estilo.css">
+     <script src="https://kit.fontawesome.com/304c41c7f8.js" crossorigin="anonymous"></script>
 
-    <title>Editor Summer Note</title>
-
+    <title>Matraca Web</title>
+  
   </head>
   <body>
 
+    <div class="btn-container">
+            <button name="aumentar-fonte" id="aumentar-fonte" title="Aumentar fonte">A +</button>
+            <button name="diminuir-fonte" id="diminuir-fonte" title="Diminuir fonte">A -</button>
+    </div>
+
     <h1>MATRACA WEB</h1>
-    <!--INÍCIO EDITOR DE TEXTO-->
+
     <div class="matraca">
           <div class="container mt-5 mb-5">
               <textarea id="summernote" class="texto"></textarea>
           </div>
     </div>
-    <!--FIM EDITOR DE TEXTO-->
 
-        <!--INÍCIO SELETOR DE VOZ-->
+      
         <div id="seletor-voz">
           Seletor de voz: <select id='voiceList'></select>
         </div class>
-        <!--FIM SELETOR DE VOZ-->
       
-        <!--INÍCIO BOTÕES DE FUNCIONALIDADE-->
+
       <div class="botoes">
-        <input class="btn" type="image" src="imagem/icon-eraser.png" alt="" id="btn-limpar"> <!--Apaga o texto digitado-->
-        <input class="btn" type="image" src="imagem/icon-upload.png" alt="" id="btn-abrir"> <!--Abri um arquivo do computador no editor de texto-->
-        <input class="btn" type="image" src="imagem/icon-download.jpg" alt="" id="btn-salvar">
-        <input class="btn" type="image" src="imagem/icon-voice.png" alt="" id="btn-falar"> <!--Fala o texto digitado no editor-->
+        <input class="btn" type="image" src="imagem/icon-eraser.png" id="btn-limpar" alt="Botão para apagar texto"> <!--Apaga o texto digitado-->
+        <input class="btn" type="image" src="imagem/icon-upload.png" id="btn-abrir" alt="Botão para abirr arquivo do computador"> <!--Abri um arquivo do computador no editor de texto-->
+        <input class="btn" type="image" src="imagem/icon-download.png" id="btn-salvar" alt="Botão para salvar arquivo">
+        <input class="btn" type="image" src="imagem/icon-voice.png" id="btn-falar" alt="Botão para ativador o sintetizador de voz"> <!--Fala o texto digitado no editor-->
       </div>
-       <!--FIM BOTÕES DE FUNCIONALIDADE-->
-    
+
+  
       <!-- JavaScript (Opcional) -->
     <!-- jQuery primeiro, depois Popper.js, depois Bootstrap JS -->
     <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
@@ -49,7 +53,21 @@ <h1>MATRACA WEB</h1>
     <script src="js/funcionalidade.js"></script>
     <script src="js/FileSaver.js"></script>
     <script src="js/speak.js"></script>
+    <script src="js/aumentarDiminuir.js"></script>
+    
+    
+    <!--Integração do VLibras Widget-->
+    <div vw class="enabled">
+      <div vw-access-button class="active"></div>
+      <div vw-plugin-wrapper>
+        <div class="vw-plugin-top-wrapper"></div>
+      </div>
+    </div>
+    <script src="https://vlibras.gov.br/app/vlibras-plugin.js"></script>
+    <script>
+      new window.VLibras.Widget('https://vlibras.gov.br/app');
+    </script>
 
   
   </body>
-</html>
\ No newline at end of file
+</html>
