Added style contact form

_includes/contact.html

@@ -3,8 +3,38 @@
 			<svg width="46" height="44" viewBox="0 0 46 44" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M21.0979 1.8541C21.6966 0.0114772 24.3034 0.0114801 24.9021 1.8541L28.8374 13.9656C29.1051 14.7896 29.873 15.3475 30.7395 15.3475H43.4742C45.4117 15.3475 46.2172 17.8268 44.6498 18.9656L34.3472 26.4509C33.6462 26.9601 33.3529 27.8629 33.6206 28.6869L37.5559 40.7984C38.1546 42.641 36.0456 44.1732 34.4782 43.0344L24.1756 35.5492C23.4746 35.0399 22.5254 35.0399 21.8244 35.5492L11.5218 43.0344C9.95438 44.1732 7.84542 42.641 8.44413 40.7984L12.3794 28.6869C12.6471 27.8629 12.3538 26.9601 11.6528 26.4509L1.35021 18.9656C-0.217217 17.8268 0.588336 15.3475 2.52578 15.3475H15.2605C16.127 15.3475 16.8949 14.7896 17.1626 13.9656L21.0979 1.8541Z" fill="black"/>
 </svg>
-<p>Get your custom logo</p>
+<p class="bold">Get your custom logo</p>
 <p class="mb-3">Get your own minimal logo with a turnaround which suits you.</p>
 <hr>
+
+<div class="pt-3 pb-2 align-left">
+        <form action="https://formspree.io/hello@ura.design" method="POST">
+              <p>What’s the <strong>Name</strong> of your project you need a logo for?<br />
+          <input class='required' name='Project Name' placeholder='Project Name' type='text'></p>
+           <div class="pt-2">
+              <p>What is your <strong>Email Address</strong>?<br />
+          <input class='required email' name='E-mail' placeholder='E-Mail' type='text'></p>
+      </div>
+      <div class="pt-2">
+              <p>Tell us more about your project. What type of logo are you looking for? What is the audience and what do you aim to accomplish with your project? Help us help you.<br />
+                    <textarea class='required' name='message' placeholder=''></textarea></p>
+                </div>
+                    <div class="pt-2">
+              <p>Name a <strong>Price</strong><br>
+                  <input class='required' name='budget' placeholder='0' type='number' min="0" max="9999999"></p>
+              </div>
+                  <div class="center pt-3">
+            <input class="button-submit" type="submit" value="Submit logo request">
+        </div>
+        </form>
+</div>
+<hr>
+
+<p class="pt-2">Every logo gets the fully fledged treatment from us. The higher your<br> bid is, the quicker we can get your logo up to speed. Not satisfied?</p>
+<p class="bold">We offer a 100% Money Back Guarantee.</p>
+
+<div class="pt-2 pb-2">
+	<p>Questions? <a href="mailto: hello@ura.design">Contact us</a>.</p>
+</div>
 		</div>
 	</div>

_sass/_layout.scss

@@ -62,6 +62,30 @@
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     }
+    }
+
+      .button-submit {
+    display: inline-block;
+    text-decoration: none !important;
+    color: #fff !important;
+    background-color: #000; 
+    font-size: 16px !important;
+    font-weight: 600;
+    text-transform: uppercase;
+    border: 3px solid #000;
+    box-sizing: border-box;
+    border-radius: 10px;
+    padding: 12px 20px;
+    margin-left: 15px;
+
+    &:hover {
+    background-color: transparent !important;
+    color: #000 !important;
+    border: 3px solid #000;
+    -webkit-transition: all 0.3s ease-in-out;
+    -moz-transition: all 0.3s ease-in-out;
+    transition: all 0.3s ease-in-out;
+    }
     }
 
     .button-premium {
@@ -262,6 +286,10 @@
        padding-top: 2rem;
     }
 
+    .pt-3 {
+        padding-top: 3rem;
+    }
+
     .pb-2 {
        padding-bottom: 2rem;
     }
@@ -275,7 +303,7 @@
     min-height: 500px;
     margin-top: 2rem;
     padding-top: 4rem;
-    font-size: 24px;
+    font-size: 20px;
     }
 
     .bg-mute hr {
@@ -332,3 +360,33 @@
 .non-justify {
     text-align: initial;
 }
+
+.align-left {
+    text-align: left;
+}
+
+input {
+      font-size: 16px;
+}
+
+form textarea {
+  width: 100%;
+  max-width: 100%;
+  min-width: 100%;
+  padding: 14px 24px;
+  box-sizing: border-box;
+  color: #000;
+  background: #FFFFFF;
+  border: 2px solid #D8D8D8;
+  border-radius: 4px;
+}
+
+input[type=text], input[type=textarea], input[type=number] {
+  width: 100%;
+  padding: 14px 24px;
+  box-sizing: border-box;
+  color: #000;
+  background: #FFFFFF;
+  border: 2px solid #D8D8D8;
+  border-radius: 4px;
+}