Corrections and new about

Assets/css/main.css

@@ -20,7 +20,7 @@
      --secondary-text-color: var(--verde-salvia);
      --shandow-color: var(--onyx);
 
-    
+     --line-color: var(--azul-nevoeiro);
      
      --error-color: var(--coral);
      --success-color: var(--emerald);
@@ -69,6 +69,14 @@ body{
     width: 80px;
     height: auto;
 } 
+
+.top-bar .branding a{
+    display: flex;
+    flex-direction: row;
+
+    text-decoration: none;
+    color: var(--background-color);
+}
 top-bar .branding h1{
    font: var(--font-family);
    font-weight: bold;
@@ -214,7 +222,7 @@ top-bar .branding h1{
 }
 
 .box{
-    height: 200px;
+    min-height: 200px;
     width: 40%;
     margin: 15px;
 
@@ -267,7 +275,6 @@ top-bar .branding h1{
 /*              */
 
 .pessoal-page{
-    height: 100%;
     width: 81%;
     color: var(--primary-color);
 
@@ -277,9 +284,9 @@ top-bar .branding h1{
 }
 
 .pessoal-page .box{
-    min-height: 550px;
+   
     width: 40%;
-    margin: 15px;
+    margin: 0;
 
     box-shadow: 0px 5px 5px var(--shandow-color);
     background-color: var(--primary-color);
@@ -297,15 +304,27 @@ top-bar .branding h1{
 }
 
 .pessoal-page .box .box-info {
-    height: 100%;
-    width: 93%;
+    width: 100%;
 
     text-align: justify;
-    margin: 5px;
+    margin: 0;
 
-    background-color: #23CE6B;
+    display: flex;
+    flex-direction: column;
+
+    justify-content: start;
+    align-items: center;
+
+
+    /* background-color: #23CE6B; */
 }
 
+.pessoal-page .box .box-info hr{
+    border: 1px solid var(--line-color); 
+    width: 99%; 
+}
+
+
 .pessoal-page .box .box-info h1{
     font-size: 24px;
     text-align: center;
@@ -354,8 +373,9 @@ top-bar .branding h1{
     height: 100%;
 }
 
-/* ================================================================================================================================== */
-/* PUBLICATION */
+/*             */
+/*      PUB    */
+/*             */
 
 .publication{
     margin: 5%;
@@ -390,4 +410,120 @@ top-bar .branding h1{
     font-family: var(--font-family);
     font-weight: 900;
     color: var(--charcoal-blue);
-  }
+  }
+
+/*              */
+/*     Sobre    */
+/*              */
+
+.sobre{
+    width: 80%;
+    text-align: justify;
+}
+
+.sobre p{
+    line-height: 1.8;
+}
+
+
+  /* RESPONSIVEL */
+
+  @media (max-width: 768px) {
+    /* Ajustar a top-bar */
+    .top-bar {
+        flex-direction: column;
+        height: auto;
+    }
+    .top-bar .branding {
+        margin-left: 20px;
+    }
+    .top-bar .menu {
+        margin-right: 20px;
+        justify-content: center;
+    }
+
+    /* Ajustar hero section */
+    .hero {
+        flex-direction: column;
+        height: auto;
+    }
+    .hero .hero-section img {
+        width: 90%;
+    }
+
+    /* Ajustar a seção de pessoas */
+    .peoples {
+        flex-direction: column;
+    }
+    .box {
+        width: 90%;
+        margin: 10px 0;
+    }
+
+    /* Ajustar página pessoal */
+    .pessoal-page {
+        flex-direction: column;
+        width: 100%;
+    }
+    .pessoal-page .box {
+        width: 90%;
+        margin: 10px auto;
+    }
+
+    /* Ajustar publicação */
+    .publication {
+        margin: 10%;
+    }
+    .publication .pub-header {
+        flex-direction: column;
+        text-align: center;
+    }
+    .publication .pub-header h1 {
+        font-size: 24px;
+    }
+}
+
+@media (min-width: 769px) and (max-width: 1024px) {
+    /* Ajustar a top-bar */
+    .top-bar {
+        flex-direction: row;
+        height: auto;
+    }
+    .top-bar .branding {
+        margin-left: 50px;
+    }
+    .top-bar .menu {
+        margin-right: 50px;
+    }
+
+    /* Ajustar hero section */
+    .hero {
+        flex-direction: column;
+        height: 70vh;
+    }
+    .hero .hero-section img {
+        width: 80%;
+    }
+
+    /* Ajustar a seção de pessoas */
+    .box {
+        width: 48%;
+    }
+
+    /* Ajustar página pessoal */
+    .pessoal-page {
+        flex-direction: column;
+    }
+    .pessoal-page .box {
+        width: 90%;
+        margin: 20px auto;
+    }
+
+    /* Ajustar publicação */
+    .publication {
+        margin: 8%;
+    }
+    .publication .pub-header h1 {
+        font-size: 26px;
+    }
+}