Error message style changes, Focus on first field with error

cmsWebApp/webroot/css/common.css

@@ -3604,13 +3604,13 @@ span.right-img {
 
 
 /*error message*/
-.message-common{padding: 24px 38px 24px 33px;margin: 15px -1.5%;position: fixed;width: 76.75%;bottom: -100px;transition:0.3s;z-index: 15;}
+.message-common{padding: 24px 38px 24px 33px;margin: 15px -1.5%;}
 .bottom-zero{bottom:0;transition:0.3s;}
 .success-message{background-color: #67b413;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);}
 .error-message{background-color: #f9513d;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);}
 .status-message{background-color: #03a0e7;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);}
 .notification-message{background-color: #fdb641;box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.15);}
-.message-txt{color: #ffffff;font-size: 20px;margin-left: 19px;float: left;width: 90%;}
+.message-txt{color: #ffffff;font-size: 20px;margin-left: 19px;width: 90%;}
 img.alert-icon {float: left;}
 .close-alert {float: right;margin-top: 3px;cursor: pointer;}
 .appli-status-short{width: 170px;}
@@ -4263,4 +4263,34 @@ img.alert-icon {float: left;}
     bottom: 0;
     left: 0;
     height: 59px;
-}
+}
\ No newline at end of file
+
+div.errorField > label,
+div.errorField .help-block,
+div.errorField .help-inline {
+  color: #b94a48;
+}
+div.errorField .checkbox,
+div.errorField .radio,
+div.errorField input,
+div.errorField select,
+div.errorField textarea {
+  color: #b94a48;
+  border-color: #b94a48;
+}
+div.errorField .checkbox:focus,
+div.errorField .radio:focus,
+div.errorField input:focus,
+div.errorField select:focus,
+div.errorField textarea:focus {
+  border-color: #953b39;
+  -webkit-box-shadow: 0 0 6px #d59392;
+  -moz-box-shadow: 0 0 6px #d59392;
+  box-shadow: 0 0 6px #d59392;
+}
+div.errorField .input-prepend .add-on,
+div.errorField .input-append .add-on {
+  color: #b94a48;
+  background-color: #f2dede;
+  border-color: #b94a48;
+}

cmsWebApp/webroot/extensions/adminportal/CustomServlets_adminPortal.xml

@@ -48,4 +48,11 @@
         </FORM>
     </NODE>
     
+    <NODE name="ORMErrorConfig::ADMIN_PORTAL" factory="Participant" class="oneit.servlets.forms.ErrorReportConfig">
+        <format item="field.*.error.pageHeader_performa_errorPrefix">
+            <![CDATA[<div class="error-message message-common"><img src="${contextRoot}/images/error-alert.png" class="alert-icon" /><span class="message-txt" style="font-weight: bold">${translateLabel:Errors_Occurred:Errors occurred, please correct them and try again}</span><br/>]]>
+        </format>
+        <format item="field.*.error.pageHeader_performa_errorText"><![CDATA[<br/><span class="message-txt">?</span>]]></format>
+        <format item="field.*.error.pageHeader_performa_errorSuffix"><![CDATA[</div>]]></format>
+    </NODE>
 </OBJECTS>

cmsWebApp/webroot/extensions/applicantportal/inc/multifieldtext.jsp

@@ -9,13 +9,10 @@
         if (fi != null && fi.hasErrors ())
         {
     %>
-            <div class="alert alert-danger">
-                <oneit:multifieldtext   prefixTextName="pageHeader_errorPrefix"
-                                        suffixTextName="pageHeader_errorSuffix"
-                                        fieldTextName="pageHeader_errorText"
-                                        fieldDelimiterTextName="pageHeader_errorDelimiter"
-                                        deriveAllFields="true"/>
-            </div>
+            <oneit:multifieldtext   prefixTextName="pageHeader_performa_errorPrefix"
+                                    suffixTextName="pageHeader_performa_errorSuffix"
+                                    fieldTextName="pageHeader_performa_errorText"
+                                    deriveAllFields="true"/>
     <%
         }
     %>

cmsWebApp/webroot/scripts/common.js

@@ -19,6 +19,8 @@ $(document).ready(function () {
         $('.section-btn .box-btn').attr('value', 'Proceed');
         $(".app-out-btn .box-btn").text('Verify and proceed')
     }
+    
+    $('.errorField input, .errorField select, .errorField textarea, .errorField .assocObjDesc').eq(0).focus();
 });
 
 function addUserPic(opt) {