diff --git a/src/_style.scss b/src/_style.scss
index 8c5af8f2..085a0fa1 100644
--- a/src/_style.scss
+++ b/src/_style.scss
@@ -296,8 +296,10 @@ select.form-control {
 .tooltip-shadow {
   box-shadow: 0px 5px 15px 0px rgba(0,0,0,0.3) !important;
 }
+
 #password-requirement-left {
   opacity: 1;
+  @extend .x-small;
   .tooltip-inner {
     @extend .tooltip-shadow;
     background: white;
@@ -315,6 +317,7 @@ select.form-control {
   opacity: 1;
   width: 90%;
   margin-bottom: 10px;
+  @extend .x-small;
   .tooltip-inner {
     max-width: inherit;
     background: white;
diff --git a/src/common-components/PasswordField.jsx b/src/common-components/PasswordField.jsx
index ae32d258..e2406d27 100644
--- a/src/common-components/PasswordField.jsx
+++ b/src/common-components/PasswordField.jsx
@@ -39,15 +39,15 @@ const PasswordField = (props) => {
   const placement = window.innerWidth < 768 ? 'top' : 'left';
   const tooltip = (
     <Tooltip id={`password-requirement-${placement}`}>
-      <span id="letter-check" className="d-flex position-relative align-content-start">
+      <span id="letter-check" className="d-flex align-items-center">
         {LETTER_REGEX.test(props.value) ? <Icon className="text-success mr-1" src={Check} /> : <Icon className="mr-1 text-light-700" src={Remove} />}
         {formatMessage(messages['one.letter'])}
       </span>
-      <span id="number-check" className="d-flex position-relative align-content-start">
+      <span id="number-check" className="d-flex align-items-center">
         {NUMBER_REGEX.test(props.value) ? <Icon className="text-success mr-1" src={Check} /> : <Icon className="mr-1 text-light-700" src={Remove} />}
         {formatMessage(messages['one.number'])}
       </span>
-      <span id="characters-check" className="d-flex position-relative align-content-start">
+      <span id="characters-check" className="d-flex align-items-center">
         {props.value.length >= 8 ? <Icon className="text-success mr-1" src={Check} /> : <Icon className="mr-1 text-light-700" src={Remove} />}
         {formatMessage(messages['eight.characters'])}
       </span>