diff --git a/server/documents/collections/form.html.eco b/server/documents/collections/form.html.eco
index 5bce6a111..df5b7813a 100755
--- a/server/documents/collections/form.html.eco
+++ b/server/documents/collections/form.html.eco
@@ -209,6 +209,18 @@ type        : 'UI Collection'
           <input placeholder="Last Name" type="text">
         </div>
       </div>
+      <div class="field">
+        <label>Gender</label>
+        <div class="ui fluid selection dropdown">
+          <div class="text">Select</div>
+          <i class="dropdown icon"></i>
+          <input type="hidden" name="gender">
+          <div class="menu">
+            <div class="item" data-value="male">Male</div>
+            <div class="item" data-value="female">Female</div>
+          </div>
+        </div>
+      </div>
       <div class="field">
         <label>Username</label>
         <input placeholder="Username" type="text">
@@ -245,6 +257,18 @@ type        : 'UI Collection'
           <input placeholder="Last Name" type="text">
         </div>
       </div>
+      <div class="field">
+        <label>Gender</label>
+        <div class="ui fluid selection dropdown">
+          <div class="text">Select</div>
+          <i class="dropdown icon"></i>
+          <input type="hidden" name="gender">
+          <div class="menu">
+            <div class="item" data-value="male">Male</div>
+            <div class="item" data-value="female">Female</div>
+          </div>
+        </div>
+      </div>
       <div class="field">
         <label>Username</label>
         <input placeholder="Username" type="text">
@@ -322,6 +346,18 @@ type        : 'UI Collection'
           <input placeholder="Last Name" type="text">
         </div>
       </div>
+      <div class="field error">
+        <label>Gender</label>
+        <div class="ui fluid selection dropdown">
+          <div class="text">Select</div>
+          <i class="dropdown icon"></i>
+          <input type="hidden" name="gender">
+          <div class="menu">
+            <div class="item" data-value="male">Male</div>
+            <div class="item" data-value="female">Female</div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 
diff --git a/src/collections/form.less b/src/collections/form.less
index 4b42a6717..9a599d610 100755
--- a/src/collections/form.less
+++ b/src/collections/form.less
@@ -310,38 +310,38 @@
   Dropdown Selection Warning
 -----------------------------*/
 
-.ui.form .fields.error .field .ui.selection.dropdown,
-.ui.form .fields.error .field .ui.selection.dropdown .item,
-.ui.form .field.error .ui.selection.dropdown,
-.ui.form .field.error .ui.selection.dropdown .item {
+.ui.form .fields.error .field .ui.dropdown,
+.ui.form .fields.error .field .ui.dropdown .item,
+.ui.form .field.error .ui.dropdown,
+.ui.form .field.error .ui.dropdown .item {
   background-color: #FFFAFA;
   color: #D95C5C;
 }
 
-.ui.form .fields.error .field .ui.selection.dropdown,
-.ui.form .field.error .ui.selection.dropdown {
+.ui.form .fields.error .field .ui.dropdown,
+.ui.form .field.error .ui.dropdown {
   -webkit-box-shadow: 0px 0px 0px 1px #E7BEBE !important;
   box-shadow: 0px 0px 0px 1px #E7BEBE !important;
 }
 
-.ui.form .fields.error .field .ui.selection.dropdown:hover,
-.ui.form .field.error .ui.selection.dropdown:hover {
+.ui.form .fields.error .field .ui.dropdown:hover,
+.ui.form .field.error .ui.dropdown:hover {
   -webkit-box-shadow: 0px 0px 0px 1px #E7BEBE !important;
   box-shadow: 0px 0px 0px 1px #E7BEBE !important;
 }
-.ui.form .fields.error .field .ui.selection.dropdown:hover .menu,
-.ui.form .field.error .ui.selection.dropdown:hover .menu {
+.ui.form .fields.error .field .ui.dropdown:hover .menu,
+.ui.form .field.error .ui.dropdown:hover .menu {
   -webkit-box-shadow: 0px 1px 0px 1px #E7BEBE;
   -moz-box-shadow: 0px 1px 0px 1px #E7BEBE;
   box-shadow: 0px 1px 0px 1px #E7BEBE;
 }
-.ui.form .fields.error .field .ui.selection.dropdown .menu .item:hover,
-.ui.form .field.error .ui.selection.dropdown .menu .item:hover {
+.ui.form .fields.error .field .ui.dropdown .menu .item:hover,
+.ui.form .field.error .ui.dropdown .menu .item:hover {
   background-color: #FFF2F2;
 }
 
-.ui.form .fields.error .field .ui.selection.dropdown .menu .active.item,
-.ui.form .field.error .ui.selection.dropdown .menu .active.item {
+.ui.form .fields.error .field .ui.dropdown .menu .active.item,
+.ui.form .field.error .ui.dropdown .menu .active.item {
   background-color: #FDCFCF !important;
 }
 
diff --git a/src/modules/dropdown.less b/src/modules/dropdown.less
index b08c310f3..d6909b601 100755
--- a/src/modules/dropdown.less
+++ b/src/modules/dropdown.less
@@ -258,9 +258,9 @@
 }
 
 .ui.dropdown.error .menu {
-  -webkit-box-shadow: 0px 1px 0px 1px #E7BEBE !important;
-  -moz-box-shadow: 0px 1px 0px 1px #E7BEBE !important;
-  box-shadow: 0px 1px 0px 1px #E7BEBE !important;
+  -webkit-box-shadow: 0px 0px 1px 1px #E7BEBE !important;
+  -moz-box-shadow: 0px 0px 1px 1px #E7BEBE !important;
+  box-shadow: 0px 0px 1px 1px #E7BEBE !important;
 }
 
 /* Item Hover */