update info campo, scroll

licenciaturas/assets/css/licenciaturas.css

@@ -19,7 +19,6 @@ main
   right: 0;
 }
 #main .header {
-  min-height: 90vh;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -28,7 +27,6 @@ main
 #main .container {
   display: flex;
   justify-content: center;
-  align-content: center;
   position: relative;
   text-align: start;
   gap: 40px;
@@ -175,7 +173,7 @@ main
 .list-plan > li{
   color: #bb8800;
   font-weight: bold;
-  min-width: 40vw;
+  min-width: 50vw;
 }
 .nav-campo-plan ul{
   margin: 0;
@@ -190,6 +188,9 @@ main
   font-size: 20px;
 }
 @media (max-width: 991px) {
+  #main{
+    padding-top: 100px;
+  }
   #main .container {
     flex-wrap: wrap;
   }
@@ -208,6 +209,14 @@ main
   }
   .col-3 .ul-points{
     flex-direction: row !important;
+    overflow-x: auto;
+    scroll-snap-type: x mandatory;
+    height: 40px;
+    scrollbar-color: #bb8800 #b0b0b9;
+  }
+  .col-3 .ul-points li {
+    flex: 0 0 auto;
+    padding: 0 10px;
   }
   .campo-plan-opcion::after{
     width: 100%;
@@ -222,13 +231,3 @@ main
     right: 0;
   }
 }
-@media(max-width:487px){
-  .campo-plan-opcion::after{
-    top: 50px;
-    right: 0;
-  }
-  .select::after{
-    top: 50px;
-    right: 0;
-  }
-}

licenciaturas/index.html

@@ -224,9 +224,9 @@
         </div>
 
         <!-- Info - Campo laboral / Plan de estudios -->
-        <div class="d-flex mt-5 mb-5 container">
+        <div class="d-flex mb-5 container">
           <div class="col-3 nav-campo-plan">
-            <ul class="ul-points d-flex flex-column justify-content-center gap-4">
+            <ul class="ul-points d-flex flex-column gap-4">
               <li id="opcionCampo" class="select campo-plan-opcion">Campo laboral</li>
               <li id="opcionPlan06" class="campo-plan-opcion">Plan de Estudios 2006</li>
               <li id="opcionPlan14" class="campo-plan-opcion">Plan de Estudios 2014</li>