diff --git a/static/styles.css b/static/styles.css
index 2852145..af862b1 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -1,7 +1,7 @@
 body {
 	/* main website background color*/
-background-image: url('img/bg.jpg');
-background-attachment: fixed;
+	background-image: url('img/bg.jpg');
+	background-attachment: fixed;
 	background-position: center;
 	background-repeat: no-repeat;
 	background-size: cover;
diff --git a/templates/aprox.html b/templates/aprox.html
index 49b6652..d2113cf 100644
--- a/templates/aprox.html
+++ b/templates/aprox.html
@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
 <font color="white" size="5">
     <span>Function you would like to Approximate:</span>
     <form action="/aprox" method="post">
@@ -18,9 +19,10 @@
             <input autocomplete="off" autofocus class="form-control" name="easy" placeholder="Easy Value a" type="text" id="easy">
             <input autocomplete="off" autofocus class="form-control" name="hard" placeholder="Difficult Value for x" type="text" id="hard">
         </div>
-        <button class="btn btn-primary" type="submit">Approximate</button>
+        <button class="btn btn-warning" type="submit">Approximate</button>
     </form>
 </font>
+</div>
 
     <script>
         let value = $("#function").val();
diff --git a/templates/aproxd.html b/templates/aproxd.html
index b2c60ca..1f1b92e 100644
--- a/templates/aproxd.html
+++ b/templates/aproxd.html
@@ -5,12 +5,14 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px">
 	<font color="white" size="5">
     <div>
         <p>Your function is $f(x) = {{ value }}$</p>
         <p>Your Linear Approximation of $f(x)$ at $x = {{ h }}$ is ${{ lh }}$</p>
     </div>
 	</font>
+</div>
 	<font color="white">
         <table class="table" action="optimized">
       <tbody>
diff --git a/templates/differentiated.html b/templates/differentiated.html
index b12ae20..685097c 100644
--- a/templates/differentiated.html
+++ b/templates/differentiated.html
@@ -5,10 +5,12 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
     <div>
 	<font color="white" size="5">
         <p>For $f(x) = {{ value }}$</p>
         <p>$f'(x) = {{ fprime }}$</p>
 	</font>
     </div>
+</div>
 {% endblock %}
diff --git a/templates/differentiation.html b/templates/differentiation.html
index 3ec51e0..651723f 100644
--- a/templates/differentiation.html
+++ b/templates/differentiation.html
@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
 	<font color="white" size="5">
     <p>Function you would like to Derive: </p>
     <form action="/differentiation" method="post">
@@ -12,9 +13,10 @@
             <input autocomplete="off" autofocus class="form-control" name="function" placeholder="Function" type="text" id="function">
         </div>
         <p id="jp">Your Input Will Appear Here</p>
-        <button class="btn btn-primary" type="submit">Differentiate</button>
+        <button class="btn btn-warning" type="submit">Differentiate</button>
     </form>
 	</font>
+</div>
 	
     <script>
         let value = $("#function").val();
diff --git a/templates/integrated.html b/templates/integrated.html
index c3ef35d..19e3078 100644
--- a/templates/integrated.html
+++ b/templates/integrated.html
@@ -5,10 +5,12 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
     <div>
 		<font color="white" size="5">
         <p>Your Equation is: ${{ value }}$</p>
         <p>Your integral is: ${{ fintegral }}$</p>
 		</font>
     </div>
+</div>
 {% endblock %}
\ No newline at end of file
diff --git a/templates/integration.html b/templates/integration.html
index cf9fe95..84a8390 100644
--- a/templates/integration.html
+++ b/templates/integration.html
@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
 <font color="white" size="5">
     <p>Function you would like to Integrate: </p>
     <form action="/integration" method="post">
@@ -12,9 +13,10 @@
             <input autocomplete="off" autofocus class="form-control" name="function" placeholder="Function" type="text" id="function">
         </div>
         <p id="jp">Your Input Will Appear Here</p>
-        <button class="btn btn-primary" type="submit">Integrate</button>
+        <button class="btn btn-warning" type="submit">Integrate</button>
     </form>
 </font>
+</div>
 
     <script>
         let value = $("#function").val();
diff --git a/templates/layout.html b/templates/layout.html
index 27905be..14553ba 100644
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -81,9 +81,9 @@
         </main>
 
         <footer class="small text-center text-muted">
-			<font color="#212121">
-				<b>© 2020 TayMath - Created by TSB and <a href="https://twitter.com/ruhphorte" style="color:black" target="_blank">Ruh</a> -
-				Huge thanks to the staff at Harvard's <a href="https://cs50.harvard.edu/college/" style="color:black" target="_blank">CS50</a>.</b>
+			<font color="#b9c3b8">
+				<b>© 2020 TayMath - Created by TSB and <a href="https://twitter.com/ruhphorte" style="color:#b9c3b8" target="_blank">Ruh</a> -
+				Huge thanks to the staff at Harvard's <a href="https://cs50.harvard.edu/college/" style="color:#b9c3b8" target="_blank">CS50</a>.</b>
 			</font>
         </footer>
 
diff --git a/templates/maxmin.html b/templates/maxmin.html
index 4f932ef..ba6a693 100644
--- a/templates/maxmin.html
+++ b/templates/maxmin.html
@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
 <font color="white" size="5">
     <span>Function you would like to Max/Min:</span>
     <form action="/maxmin" method="post">
@@ -16,9 +17,10 @@
             <input autocomplete="off" autofocus class="form-control" name="lowerbound" placeholder="Lowerbound" type="text" id="lowerbound">
             <input autocomplete="off" autofocus class="form-control" name="upperbound" placeholder="Upperbound" type="text" id="upperbound">
         </div>
-        <button class="btn btn-primary" type="submit">Optimize</button>
+        <button class="btn btn-warning" type="submit">Optimize</button>
     </form>
 </font>
+</div>
 
     <script>
         let value = $("#function").val();
diff --git a/templates/optimized.html b/templates/optimized.html
index 6b3a8a1..3f9f840 100644
--- a/templates/optimized.html
+++ b/templates/optimized.html
@@ -5,12 +5,14 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px">
 	<font color="white" size="5">
     <div>
         <p>Your function is $f(x) = {{ value }}$</p>
         <p>Your maximum value is ${{ maximum }}$ and your minimum value is ${{ newvar }}$</p>
     </div>
 	</font>
+</div>
 	<font color="white">
     <table class="table table-hover" action="optimized">
       <tbody>
diff --git a/templates/riemann.html b/templates/riemann.html
index 69fa244..2bda1b2 100644
--- a/templates/riemann.html
+++ b/templates/riemann.html
@@ -5,6 +5,7 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px; border-radius: 8px">
 <font color="white" size="5">
     <span>Function you would like to integrate:</span>
     <form action="/riemann" method="post">
@@ -12,7 +13,7 @@
             <input autocomplete="off" autofocus class="form-control" name="function" placeholder="Function" type="text" id="function">
         </div>
         <p id="jp">Your Input Will Appear Here</p>
-        <span>Range of values <i>(a,b)</i>:</span>
+        <span>Range of values <i><b>(a,b)</b></i>:</span>
         <div class = "form-group">
             <input autocomplete="off" autofocus class="form-control" name="lowerbound" placeholder="Lowerbound a" type="text" id="lowerbound">
             <input autocomplete="off" autofocus class="form-control" name="upperbound" placeholder="Upperbound b" type="text" id="upperbound">
@@ -30,9 +31,10 @@
           <label><input type="radio" name="sumtype" value="2"> Right Riemann Sum</label>
         </div>
 		</font>
-        <button class="btn btn-primary" type="submit">Summation</button>
+        <button class="btn btn-warning" type="submit">Summation</button>
     </form>
-
+</font>
+</div>
 
     <script>
         let value = $("#function").val();
diff --git a/templates/rightSummed.html b/templates/rightSummed.html
index d7ee3e2..d505856 100644
--- a/templates/rightSummed.html
+++ b/templates/rightSummed.html
@@ -5,9 +5,12 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px">
+	<font size="5" color="white">
     <span>Approximating the integral of $f(x) = {{ value }}$ from ${{ lb }}$ to ${{ ub }}$ using ${{ si }}$ subintervals</span>
-	<br>
-	<br>
+	</font>
+	</div>
+	<font color="white">
     <table class="table table-hover" action="optimized">
         <tbody>
             <tr class="bg-dark text-white">
@@ -48,4 +51,5 @@
             </tr>
         </tbody>
     </table>
+	</font>
 {% endblock %}
\ No newline at end of file
diff --git a/templates/summed.html b/templates/summed.html
index c7865b9..72f1fd0 100644
--- a/templates/summed.html
+++ b/templates/summed.html
@@ -5,11 +5,11 @@
 {% endblock %}
 
 {% block main %}
+<div class="col-sm-12" style="background-color: #0f11175c; padding: 20px">
 	<font size="5" color="white">
     <span>Approximating the integral of $f(x) = {{ value }}$ from ${{ lb }}$ to ${{ ub }}$ using ${{ si }}$ subintervals</span>
 	</font>
-	<br>
-	<br>
+	</div>
 	<font color="white">
     <table class="table table-hover" action="optimized">
         <tbody>