diff --git a/slaeforms/static/styles.css b/slaeforms/static/styles.css
index 0460c0d..3e1886a 100644
--- a/slaeforms/static/styles.css
+++ b/slaeforms/static/styles.css
@@ -2,6 +2,9 @@ body {
     width: 100%;
     height: 100vh;
     margin: 0;
+    display: flex;
+    justify-content: center;
+    /*align-items: center; this will make the content a square, with edges up and bottom*/ 
     background-color: #a4b5ff;
     color: #000000;
     font-family: Tahoma;
@@ -17,6 +20,38 @@ body {
     filter: invert(65%);
 }
 
+#submitbutton {
+    cursor: pointer;
+    padding: 10px 20px; /* Increased padding for a bigger button */
+    font-size: 20px; /* Increased font size */
+    border: none; /* Removes default border */
+    border-radius: 8px; /* Optional: rounds the corners of the button */
+}
+#submitbutton:hover {
+    background-color: #0056b3; /* Darker shade for hover effect */
+}
+.button-container {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 20px; /* Adjust as needed for spacing */
+}
+
+.textarea-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+.textarea-label{
+    align-self: flex-start; /* Aligns the label to the start of the container */
+}
+.container {
+    width: 80%; /* You can adjust this width as needed */
+    max-width: 1200px; /* Maximum width to keep it from getting too wide on large screens */
+    padding: 20px;
+    background-color: #7b8cdb; /* Just for visual differentiation */
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+}
+
 .videocontrols {
     width: 100px; /* Set a specific width for the buttons */
     height: 70px; /* Set a specific height for the buttons */
@@ -63,6 +98,11 @@ iframe {
 }
 
 
+
+form {
+    text-align: center;
+}
+
 .centertext {
     text-align: center;
 }
diff --git a/slaeforms/templates/standard_template.html b/slaeforms/templates/standard_template.html
index fbf7dcc..b138540 100644
--- a/slaeforms/templates/standard_template.html
+++ b/slaeforms/templates/standard_template.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html>
-{% macro single_video(video_url, embed="yt", title="",width="560", height="315", class="center", code="<p>No code given</p>") -%}
-    {% if (embed == "yt") %}
-        <div class={{center}}>
-            {% if (title != "") %}
-            <h3>{{title}}</h3>
-            {% endif %}
-            <iframe width={{width}} height={{height}} class="center" src="{{ video_url }}" title="YouTube video player"
-                frameborder="0"
-                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                allowfullscreen></iframe>
-        </div>
-    {% else %}
-        {{code}}
+{% macro single_video(video_url, embed="yt", title="",width="560", height="315", class="center", code="<p>No code given
+</p>") -%}
+{% if (embed == "yt") %}
+<div class={{center}}>
+    {% if (title != "") %}
+    <h3>{{title}}</h3>
     {% endif %}
+    <iframe width={{width}} height={{height}} class="center" src="{{ video_url }}" title="YouTube video player"
+        frameborder="0"
+        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+        allowfullscreen></iframe>
+</div>
+{% else %}
+{{code}}
+{% endif %}
 {%- endmacro %}
 
 {% macro required(question) -%}
@@ -23,51 +24,61 @@ required
 {%- endmacro %}
 
 {% macro input(name, value='', type='text', size=20) -%}
-    <input type="{{ type }}" name="{{ name }}" value="{{
+<input type="{{ type }}" name="{{ name }}" value="{{
         value|e }}" size="{{ size }}">
 {%- endmacro %}
+
 <head>
     <meta charset="utf-8" />
     <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css')}}"" /> <!--  styles.css  {{ url_for('static', filename='styles.css')}}-->
     <title>Testform</title>
-    <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
+    <link rel=" shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">
 </head>
 
 <body>
+    <div class="container">
+        <h2>Stimulus part</h2>
+        {% if (stimulus_type == "single_video") %}
+        {{ single_video(**stimulus_configuration) }}
+        {% elif (False) %}
 
-    <h2>Stimulus part</h2>
-    {% if (stimulus_type == "single_video") %}
-    {{ single_video(**stimulus_configuration) }}
-    {% elif (False) %}
-
-    {% else %}
-    <p>Error: Block {{ stimulus["type"] }} could not be loaded!</p>
-    {% endif %}
+        {% else %}
+        <p>Error: Block {{ stimulus["type"] }} could not be loaded!</p>
+        {% endif %}
 
 
 
-    <h2>Questions</h2>
-    <form action="http://localhost:5000/send_json" method="post">
-    {% for question in questions %}
-    {% if (questions[question]["type"] == "likert") %}
-    <div class="likercontainer">
-    <div class="likert">
-        {% for point in questions[question]["points"] %}
-            <label><input name="likertscale" type="radio" value="{{ questions[question]['points'][point]['value'] }}" {{required(questions[question])}}/><span>{{ questions[question]['points'][point]['text'] }}</span></label>
-        {% endfor %}
+        <h2>Questions</h2>
+        <form action="http://localhost:5000/send_json" method="post">
+            {% for question in questions %}
+            {% if (questions[question]["type"] == "likert") %}
+            <div class="likercontainer">
+                <div class="likert">
+                    {% for point in questions[question]["points"] %}
+                    <label><input name="likertscale" type="radio"
+                            value="{{ questions[question]['points'][point]['value'] }}"
+                            {{required(questions[question])}} /><span>{{ questions[question]['points'][point]['text']
+                            }}</span></label>
+                    {% endfor %}
+                </div>
+            </div>
+
+            {% elif (questions[question]["type"] == "textinput") %}
+            <div class="textarea-container">
+                <label class="textarea-label" for="{{ questions[question]['name'] }}">Additional Feedback: </label>
+                <textarea id="{{ questions[question]['name'] }}" name="{{ questions[question]['name'] }}" rows="6"
+                    cols="60" maxlength="{{ questions[question]['size'] }}"
+                    {{required(questions[question])}}></textarea>
+            </div>
+            {% else %}
+            <p>Error: Block {{config["question 1"]["blocks"][block]["type"]}} could not be loaded!</p>
+            {% endif %}
+            {% endfor %}
+            <div class="button-container">
+                <p><input id="submitbutton" type="submit" value="submit" ; /></p>
+            </div>
+        </form>
     </div>
-    </div>
-    
-    {% elif (questions[question]["type"] == "textinput") %}
-    <label for="{{ questions[question]['name'] }}">Additional Feedback: </label>
-        <textarea id="{{ questions[question]['name'] }}" name="{{ questions[question]['name'] }}" rows="3" cols="30" maxlength="{{ questions[question]['size'] }}" {{required(questions[question])}}></textarea>
-    {% else %}
-    <p>Error: Block {{config["question 1"]["blocks"][block]["type"]}} could not be loaded!</p>
-    {% endif %}
-    {% endfor %}
-    <p><input id="submitbutton" type = "submit" value = "submit";/></p>
-    </form>
-
 </body>
 
-</html>
+</html>
\ No newline at end of file
