Change the Position of Validation Summary Error Message in Nintex Form

Issue

By default, Nintex seems to display error messages (required data missing, validation error messages, etc.) above the Nintex form.  Since the top of many forms scroll off the screen before the user reaches the "Submit" button (typically at the bottom of the form), the error message is not visible to the user.  It would seem to make much more sense to display these messages below the form, where the user can see them when he/she clicks Save/Submit. 

Solution:

Add in the following CSS code in the Cusom CSS area and Check it

@keyframes fadeIn { from {opacity: 0;} to {opacity: 1;}}  
.nf-validation-summary  
{   
  position: fixed;   
  z-index : 1000;   
  top: 150px;   
  width: 280px;   
  left: 15px;   
  background-color: white;   
  border: 2px solid red;   
  border-radius:3px;   
  box-shadow: 3px 3px 3px 3px rgba(50, 50, 50, 0.6);   
  animation: fadeIn 1s;  
  margin-top : 20px;  

}