style merge

static/Style/Templates.css

@@ -6,7 +6,7 @@ h1,h3{
     text-align: center;
 }
 h1{
-    font-size: 35px;
+    font-size: 40px;
 }
 body{
     background-color: whitesmoke;
@@ -19,9 +19,10 @@ body{
     border-radius: 2px;
 }
 .TabTitle{
+    margin-bottom: 5%;
     font-size: 30px;
-    width: 100%;
-    text-align: center;
+    width: 94%;
+    text-align: left;
     border:none;
     border-bottom: 1px solid grey;
 }
@@ -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%;
+    }
+}