Finalizada a página download.html

css/style.css

@@ -39,6 +39,9 @@ h1 {
 .row.thumbs-ivprog {
 	margin-top: 1em;
 }
+.row.thumbs-ivprog-download .item {
+	background-color: #5a6570;
+}
 .col-md-3.item:hover {
     background-color: #03396c;
 }
@@ -59,4 +62,19 @@ h1 {
 .div-button .span-version {
 	display: block;
 	font-size: 98%;
+}
+.my-3 .octicon-history {
+	font-size: 1em;
+}
+.history-ivprog-version {
+	display: block;
+	font-size: 1em;
+	font-weight: bold;
+	margin-top: -.5em;
+	margin-bottom: .5em;
+}
+.history-ivprog-time {
+    background-color: gray;
+    padding: .4em;
+    border-radius: .4em;
 }

download.html

@@ -67,7 +67,7 @@
       <div class="container" style="margin-top:50px;" >
 
       <!-- Portfolio Item Heading -->
-      <h1 class="my-4">Download</h1>
+      <h3 class="my-4">Download</h3>
 
       <!-- Portfolio Item Row -->
       <div class="row">
@@ -90,47 +90,49 @@
           
           <div class="div-button">
             <a class="btn btn-primary download-ivprog" href="#" role="button" title=""> <span class="octicon octicon-desktop-download"></span> Download</a>
-            <span class="span-version">Versão 2018/12/18</span>
+            <span class="span-version">Atualização 2018/12/18</span>
           </div>
         </div>
       </div>
 
-      <h3 class="my-4" style="margin-top: 5px">Versões anteriores do iVProg</h3>
+      <hr>
+
+      <h3 class="my-3" style="margin-top: 5px"> <span class="octicon octicon-history"></span> Versões anteriores do iVProg</h3>
 
       <div class="row">
         <div class="col-md-12">
-          <p>Ao longo do tempo, o iVProg passou por melhorias e modificações, permitindo total compatibilidade com os navegadores atuais. Inicialmente foi desenvolvido em Java no formato de applet (Versão I - Java e Versão II - Java), precisou ser reescrito após o bloqueio da execução de applets pelos principais navegadores do mercado, resultando na Versão I - HTML.</p>
+          <p>Ao longo do tempo, o iVProg passou por melhorias e modificações, mantendo total compatibilidade com os navegadores atuais. Inicialmente foi desenvolvido em Java no formato de applet (Versão I - Java e Versão II - Java), precisou ser reescrito após o bloqueio da execução de applets pelos principais navegadores do mercado, resultando na Versão I - HTML.</p>
           
-          <p>A Versão I - HTML continua funcionando nos navegadores e integradas a ambientes virtuais. Contudo, novos recursos foram implementados, como vetores, matriz e funções (Versão II - HTML, que é a mais recente).</p>
+          <p>A Versão III - HTML continua funcionando nos navegadores e integradas a ambientes virtuais. Contudo, novos recursos foram implementados, como vetores, matriz e funções (Versão IV - HTML, que é a mais recente).</p>
 
           <p>Abaixo, você encontra as versões anteriores, que podem ser baixadas e utilizadas livremente.</p>
         </div>
-        <div class="col-md-2"></div>
+      </div>
+      <div class="row">
 
-        <div class="col-md-3 col-sm-6 mb-4">
-          <a href="versao-java.html">
+      <div class="container">
+        <div class="row thumbs-ivprog-download">
+          <div class="col-md-1"></div>
+          <div class="col-md-3 item">
             <img class="img-fluid" src="img/ivjava.png" alt="">
-              <p class="legenda-versoes">Versão Java I</p>
-          </a>
-        </div>
-
-        <div class="col-md-3 col-sm-6 mb-4">
-          <a href="versao-java.html">
+            <hr>
+            <span class="history-ivprog-version">Versão I - Java</span>
+            <span class="history-ivprog-time">2009 - 2012</span>
+          </div>
+          <div class="col-md-3 item">
             <img class="img-fluid" src="img/ivjava.png" alt="">
-              <p class="legenda-versoes">Versão Java II</p>
-          </a>
-         
-        </div>
-
-        <div class="col-md-3 col-sm-6 mb-4">
-          <a href="ivprog-html.html">
+            <hr>
+            <span class="history-ivprog-version">Versão II - Java</span>
+            <span class="history-ivprog-time">2013 - 2015</span>
+          </div>
+          <div class="col-md-3 item">
             <img class="img-fluid" src="img/ivprog-html.png" alt="">
-            <p class="legenda-versoes">Versão HTML</p>
-          </a>
-        </div>
-
+            <hr>
+            <span class="history-ivprog-version">Versão III - HTML</span>
+            <span class="history-ivprog-time">2016 - 2018</span>
+          </div>
         </div>
-
+       </div>
       </div>
 
     </div>