Adaptado a mobile

Style/Templates.css

@@ -19,6 +19,7 @@ body{
     border-radius: 2px;
 }
 .TabTitle{
+    margin-bottom: 5%;
     font-size: 30px;
     width: 94%;
     text-align: left;
@@ -35,7 +36,7 @@ body{
     width: 25%;
     margin: 1%;
 }
-.NewTabButton, .NewInputButton, .RemoveInputButton{
+.NewTabButton, .NewInputButton, .RemoveInputButton, .RemoveTabButton{
     text-align: center;
     margin: auto;
     color: whitesmoke;
@@ -57,15 +58,18 @@ body{
     border: 3px solid rgb(1, 194, 120);
     background-color: rgb(14, 211, 135);
 }
-.RemoveInputButton{
-    width: 40px;
-    height: 40px;
+.RemoveInputButton, .RemoveTabButton{
+    width: 35px;
+    height: 35px;
     margin: 1%;
     font-size: 20px;
     border: 3px solid rgb(230, 25, 25);
     background-color: rgba(211, 14, 14, 0.788);
 }
-
+.RemoveTabButton{
+    width: 40px;
+    height: 40px;
+}  
 #ContinuarText, #ContinuarButton{
     display: none;
 }
@@ -81,3 +85,29 @@ body{
     height: 2.5em;
     border-radius: 5px;
 }
+
+@media  ( max-width: 900px) {
+
+    .TabTitle{
+        width: 90%;
+    }
+
+}
+@media  (max-width: 600px) {
+    .TabTitle{
+        width: 85%;
+    }
+    .RemoveInputButton{
+        width: 30px;
+        height: 30px;
+    }
+    
+    .RemoveTabButton{
+        width: 35px;
+        height: 35px;
+    }
+    .Input{
+        width: 20%;
+        margin: 1%;
+    }
+}

generate.html

@@ -28,7 +28,7 @@
 <template id="tabTemplate">
     <div class="TabCards">
         <input class="TabTitle" placeholder="Titulo del Tab" type="text">
-        <button class="RemoveInputButton" onclick="removeTab(this)">
+        <button class="RemoveTabButton" onclick="removeTab(this)">
                 X
     </button>
         <br>