diff --git a/Readme.md b/Readme.md
index e69de29..1cc7763 100644
--- a/Readme.md
+++ b/Readme.md
@@ -0,0 +1 @@
+AngularJS Training
\ No newline at end of file
diff --git a/css/styles.css b/css/styles.css
new file mode 100644
index 0000000..5146183
--- /dev/null
+++ b/css/styles.css
@@ -0,0 +1,166 @@
+body{
+  font-family: Calibri;
+}
+
+u{
+  padding-bottom: 30px;
+}
+
+header {
+  color: forestgreen;
+  font-size: 2em;
+  font-weight: bold;
+  display: flex;
+  flex-flow: row wrap;
+}
+
+section {
+  border: solid 0.5px #95c9bc;
+}
+
+section > header {
+  background-color: #95c9bc;
+  width: 100%;
+}
+
+section > footer {
+  background-color: lightgray;
+  width: 100%;
+  display: flex;
+  flex-flow: row wrap;
+  justify-content: center;
+}
+
+article{
+  padding: 8px;
+}
+
+button {
+  margin: 5px;
+  background-color: #95c9bc;
+  color: #ffffff;
+  padding: 5px;
+  display: inline-block;
+  font-weight: normal;
+  text-align: center;
+  vertical-align: middle;
+  cursor: pointer;
+  border: 1px solid transparent;
+  white-space: nowrap;
+  font-size: 14px;
+}
+
+header > h1 {
+  margin: 5px;
+  color: black;
+  font-size: 24px;
+}
+
+form{
+  display: flex;
+  flex-flow: row wrap;
+  justify-content: space-between;
+}
+
+.form-side{
+  margin-top: 20px;
+}
+
+.form-item{
+  display: flex;
+  vertical-align: middle;
+  width: 100%;
+  margin-bottom: 25px;
+  margin-top: 10px;
+}
+
+label{
+  font-weight: bold;
+  display: inline-block;
+  width: 200px;
+  float:left;
+  position: relative;
+  align-self: center;
+}
+
+label > span{
+ color: red;
+}
+
+
+input, textarea, select {
+  width : 350px;
+  margin: 0;
+
+  -webkit-box-sizing: border-box; /* For legacy WebKit based browsers */
+  -moz-box-sizing: border-box; /* For legacy (Firefox <29) Gecko based browsers */
+  box-sizing: border-box;
+}
+
+input[type='checkbox']{
+  width: 30px;
+}
+
+textarea{
+  height: 90px;
+  resize: none;
+}
+
+.checkboxes{
+  display: inline-block;
+  margin-bottom: 0;
+  vertical-align: middle;
+}
+
+.checkbox {
+  position: relative;
+  display: block;
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+
+.mainmenubtn {
+  color: black;
+  border: none;
+  cursor: pointer;
+}
+
+.mainmenubtn:hover {
+  font-weight: bold;
+}
+
+.dropdown {
+  position: relative;
+  display: inline-block;
+}
+.dropdown-child {
+  display: none;
+  background-color: #abe1d4;
+  min-width: 110px;
+}
+.dropdown-child a {
+  color: black;
+  font-size: 13px;
+  padding: 10px;
+  padding-top: 5px;
+  text-decoration: none;
+  display: block;
+}
+
+.dropdown-child a:hover {
+  font-weight: bold;
+  cursor: pointer;
+  background-color: #95c9bc;
+}
+
+.dropdown:hover .dropdown-child {
+  display: block;
+  z-index: 9999;
+  position: absolute;
+}
+
+@media (max-width: 768px) {
+  input, textarea, select {
+    width : 100%;
+  }
+}
\ No newline at end of file
diff --git a/html/formulario.html b/html/formulario.html
new file mode 100644
index 0000000..5db9797
--- /dev/null
+++ b/html/formulario.html
@@ -0,0 +1,149 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="description" content="AngularJS Training">
+  <meta name="author" content="JAG">
+  <title>AngularJS Training</title>
+  <link rel="stylesheet" href="../css/styles.css">
+</head>
+<body>
+<header>
+  Formulario
+</header>
+<section>
+  <header>
+    <h1>Workshop Registration</h1>
+    <div class="dropdown">
+      <button class="mainmenubtn">More Actions <span>&#65516;</span></button>
+      <div class="dropdown-child">
+        <a >English</a>
+        <a >Español</a>
+      </div>
+    </div>
+  </header>
+  <article>
+    <u>Register now while seats are available!</u>
+    <form>
+      <div class="form-side">
+        <div class="form-item">
+          <label>
+            First name <span>*</span>
+          </label>
+          <input type="text" title="First name" name="first_name">
+        </div>
+        <div class="form-item">
+          <label>
+            Last name <span>*</span>
+          </label>
+          <input type="text" title="Last name" name="last_name">
+        </div>
+        <div class="form-item">
+          <label>
+            Company Institution <span>*</span>
+          </label>
+          <input type="text" title="Company Institution" name="company">
+        </div>
+        <div class="form-item">
+          <label>
+            Addres <span>*</span>
+          </label>
+          <textarea title="Addres" name="address"></textarea>
+        </div>
+        <div class="form-item">
+          <label>
+            City
+          </label>
+          <input type="text" title="City" name="city">
+        </div>
+        <div class="form-item">
+          <label>
+            State /Province /Region
+          </label>
+          <select name="state">
+            <option value="">-Select-</option>
+          </select>
+        </div>
+        <div class="form-item">
+          <label>
+            Country
+          </label>
+          <select name="country">
+            <option value="">-Select-</option>
+          </select>
+        </div>
+        <div class="form-item">
+          <label>
+            Email <span>*</span>
+          </label>
+          <input type="email" title="E-mail" name="email">
+        </div>
+        <div class="form-item">
+          <label>
+            Phone number <span>*</span>
+          </label>
+          <input type="number" title="Phone number" name="phone">
+        </div>
+      </div>
+      <div class="form-side">
+        <u>Lunch</u>
+        <div class="form-item">
+          <label>
+            Meal preference
+          </label>
+          <select name="meal">
+            <option value="">Vegetarian</option>
+          </select>
+        </div>
+
+        <u>Payment Details</u>
+        <div class="form-item">
+          <label>
+            Payment mode
+          </label>
+          <div class="checkboxes">
+            <div class="checkbox">
+              <span><input type="checkbox" name="payment">Cash</span>
+            </div>
+            <div class="checkbox">
+              <span><input type="checkbox" name="payment">Cheque</span>
+            </div>
+            <div class="checkbox">
+              <span><input type="checkbox" name="payment">Demand draft</span>
+            </div>
+          </div>
+
+          <!--<input type="checkbox" name="payment"><span>dsdhsdhsdh</span>-->
+        </div>
+        <div class="form-item">
+          <label>
+            DD/Cheque No.
+          </label>
+          <input type="text" title="DD/Cheque No." name="cheque_no">
+        </div>
+        <div class="form-item">
+          <label>
+            Drawn On (Bank Name)
+          </label>
+          <input type="text" title="Drawn On (Bank Name)" name="drawn">
+        </div>
+        <div class="form-item">
+          <label>
+           Payable at
+          </label>
+          <input type="text" title="Payable at" name="payable">
+        </div>
+      </div>
+
+    </form>
+  </article>
+  <footer>
+    <button type="submit" value="Sumbit">Submit</button>
+    <button type="reset" value="Reset">Reset</button>
+  </footer>
+</section>
+<footer>
+
+</footer>
+</body>
+</html>
\ No newline at end of file
