Añadido viewport y eliminada estructura de lista de la barra de navegación.

1 files changed, 25 insertions, 18 deletions

diff --git a/css/style.css b/css/style.css
index 5ca12a8..5be730e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -24,6 +24,11 @@ a:visited {
   outline: 2px solid white;
 }
 
+/* No outline cuando es por clic. */
+:focus:not(:focus-visible) {
+  outline: none;
+}
+
 h1 {
   padding: 1em 0;
 	font-variant: small-caps;
@@ -43,16 +48,9 @@ h1 {
   justify-content: space-around;
 }
 
-.navbar li {
+.navbar a {
   flex-basis: 10%;
   flex-grow: 1;
-}
-
-.navbar .liright {
-  float: right;
-}
-
-.navbar li a {
   display: block;
   color: #CBD7E1;
   padding: 20px 20px;
@@ -60,7 +58,7 @@ h1 {
   text-decoration: none;
 }
 
-.navbar li:hover a {
+.navbar a:hover {
   background-color: #C8E8FF;
   color: #17212B;
 }
@@ -105,6 +103,12 @@ ul ul {
   display: grid;
 }
 
+.odd, .even {
+  margin: 0 5% 5%;
+  max-width: 50%;
+  height: auto;
+}
+
 .odd {
   float: left;
   margin-left: 0;
@@ -115,20 +119,13 @@ ul ul {
   margin-right: 0;
 }
 
-.odd, .even {
-  margin: 0 10% 5%;
-  max-width: 50%;
-  height: auto;
-}
-
 .odd img, .even img {
-  display: block;
   max-width: 100%;
   height: auto;
   margin: 0;
 }
 
-img {
+img, video {
   max-width: 100%;
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
   border-radius: 15px;
@@ -167,11 +164,21 @@ img {
 
 @media only screen and (max-width: 600px) {
 
+  h1 {
+    font-size: 2em;
+  }
+
+  .navbar {
+    font-size: 1em;
+  }
+
   .odd, .even {
+    float: none;
     margin: 0 10% 20px;
     max-width: 100%;
     height: auto;
-    float: none;
+    display: block;
+    text-align: center;
   }
 
   ul {