diff --git a/index .html b/index .html
index 71307bb..ac45a7e 100644
--- a/index .html	
+++ b/index .html	
@@ -25,7 +25,7 @@
 </head>
 
 <body>
-  <h1 style="color: yellowgreen;">CURSO DE HTML</h1>
+  <h1 style="color: blueviolet;">CURSO DE HTML</h1>
   <h2 id="inicio">Listado del curso</h2>
   <ul>
     <li><a href="#etiquetas-basicas">Etiquetas basicas</a></li><br />
@@ -176,6 +176,9 @@ <h2 id="enlaces">Enlaces</h2>
   
   <a href="https://api.whatsapp.com/send?phone=52467372">Mi whatsapp</a><br /><br />
   <a href="https://htmlreference.io" target="_blank " rel="nofollow">Referencia HTML</a><br /><br />
+    <a href="https://cssreference.io" target="_blank " rel="nofollow">Referencia CSS</a><br /><br />
+
+  
   <a href="https://github.com/lapzdev" target="_blank " rel="nofollow">Mi repositorio</a><br /><br />
   
   
@@ -312,12 +315,31 @@ <h2 id="data-atribute">Data atribute</h2><br />
     
   </ul><br><br>
   <h2 id="meta-seo">Metaetiquetas para seo</h2>
-  <h2 id="css" class="css-curso">CURSO CSS</h2>
-  <div id="box">
-    ffjffjfjfjfjfxj
-  </div>
-  <script type="text/javascript" src='prog.js'>
-  
-  </script>
-  
+  <h2 id="inicio-css">CURSO CSS</h2>
+  <<h3 id="listado-css">Listado del curso</h3>
+    <ul>
+      <li><a href="#etiquetas-basicas">Etiquetas basicas</a></li>
+      <li></li>
+      <li></li>
+      <li></li>
+      <li></li>
+      <li></li>
+      <li></li>
+      
+    </ul>
+    <br /><br />
+    <hr />
+    <br />
+    <<article id="etiquetas-basicas">
+      <p>Este es un párrafo especial ya que no tiene este programa lorem Ipsum</p>
+      <p id="texto">Este es un párrafo especial ya que no tiene este programa lorem Ipsum</p>
+      <p class="texto32">Este es un párrafo especial ya que no tiene este programa lorem Ipsum</p>
+      <p class="otro">Este es un párrafo especial ya que no tiene este programa lorem Ipsum</p>
+      </article>>
+      <h2></h2>
+      </article>
+      <script type="text/javascript" src='prog.js'>
+      
+      </script>
+      
 </html>
\ No newline at end of file
diff --git a/otra-nota.md b/otra-nota.md
new file mode 100644
index 0000000..951a846
--- /dev/null
+++ b/otra-nota.md
@@ -0,0 +1 @@
+# Notas al margen
\ No newline at end of file
diff --git a/otro-style.css b/otro-style.css
new file mode 100644
index 0000000..6e9f59c
--- /dev/null
+++ b/otro-style.css
@@ -0,0 +1 @@
+h1{text-align: center;}
\ No newline at end of file
diff --git a/style.css b/style.css
index f5323f4..2b8cfd4 100644
--- a/style.css
+++ b/style.css
@@ -2,21 +2,25 @@
 1) el selector
 2) el bloque de declaraciones 
 atributo:valor*/
+/* el @import url() es mala práctica porque es bloqueante a la hora que el navegador lee los documentos*/
+@import url('otro-style.css');
+
 html {
     scroll-behavior: smooth;;
 }
 body {
     
-    background-color:#f005;
-    margin: 0;
+    background-color:white;
+    margin-left: 10px;
 }
+
 a {
     margin: 3px;
 }
-h2:target{color: #005;}
+h2:target{color: #f00;}
 .css-curso {color:#00f;}
-/*    */
-h1{color: orangered; 
+/*  El estilo (style) en línea es el que predomina; le sigue el estilo interno, y el final es el externo  */
+h1{color: red; 
     border: 3px;
     border-color: red;
     border-style: solid;
@@ -28,5 +32,6 @@ border-color: blue;
 width: 200px;
 height: 200px;
 }
-h2{color: #f00;}
+h2{color: #0f0;}
+#texto{color: #00f;}
 /*  */
\ No newline at end of file
