change-password-style.css

.main-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100%; }

.change-password {
  padding: 5rem 4%;
  user-select: none; }
  .change-password form {
    width: 50%;
    position: relative; }
    .change-password form .col-2-span .form-group {
      flex: 0 0 50%;
      max-width: 50%; }
      .change-password form .col-2-span .form-group:nth-child(even) {
        padding-right: 15px; }
      .change-password form .col-2-span .form-group:nth-child(odd) {
        padding-left: 15px; }
    .change-password form .o-row {
      display: flex;
      margin-bottom: 15px;
      flex-wrap: wrap;
      position: relative; }
      .change-password form .o-row .form-group {
        flex-grow: 1;
        position: relative; }
        .change-password form .o-row .form-group label {
          margin-bottom: 10px;
          color: black;
          font-size: 15px; }
        .change-password form .o-row .form-group input {
          display: block;
          width: 100%;
          height: 40px;
          padding: 6px 8px;
          font-size: 14px;
          line-height: 1.5;
          color: black;
          border: 1px solid #c7c7c7;
          border-radius: 5px;
          background-color: #fff; }
        .change-password form .o-row .form-group small {
          color: #ff4e4e;
          margin-top: 3px;
          font-size: 13px;
          display: none; }
      .change-password form .o-row .require label::after {
        content: " *";
        color: #dc3545; }
    .change-password form button[type=submit] {
      outline: none;
      text-decoration: none;
      margin-top: 5rem;
      display: block;
      margin-right: auto;
      border-radius: 5px;
      font-size: 15px;
      padding: 1em 3em;
      box-shadow: 0 3px 10px -3px #00000038;
      color: #2c2c2c;
      background-color: #efc501;
      transition: background-color .3s; }
      .change-password form button[type=submit]:hover {
        background-color: #e2b904; }

@media (max-width: 992px) {
  .change-password form, .change-password form button[type=submit] {
    width: 100%; } }

@media (max-width: 576px) {
  .change-password form .o-row .form-group label {
    margin-bottom: 5px;
    font-size: 13px; }
  .change-password form .col-2-span .form-group {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 !important;
    margin-bottom: 15px; }
  .change-password form .o-row .form-group small {
    font-size: 12px; }
  .change-password form button[type=submit] {
    font-size: 14px;
    margin-top: 4rem; } }