
    #FrmLogin {
      max-width: 365px;
      margin: auto;
      border: 1px solid #ddd;
      padding: 40px;
      border-radius: 6px;
      margin-top: 60px;
    }
    #FrmLogin h4 {
      font-size: 17px;
      font-weight: bold;
      margin-bottom: 20px;
      padding-bottom: 20px;
      border-bottom: 1px solid #ddd;
    }

    #loginFooter {
      position: fixed;
      bottom: 0;
      width: 100%;
      padding: 10px 0;
      text-align: center;
    }

    #wrapperRememberme {
      margin-top: 7px;
      margin-left: 5px;
    }

    #BtnSign {
      background-color: #DA291C;
    }

    #BtnSign:hover {
      background-color: #FF6A14;
    }

    .navbar-nav {
      flex-direction: row;
    }

    .nav-item {
      margin: 0 25px;
    }

    .nav-text {
      font-size: 1.3rem;
    }

    .auth-container {

      .text-gray {
        color: #777;
      }

      .left-side {
        position: absolute;
        right: 90px;
        left: -80px;

        width: 300%;
        max-width: 700px;
        height: auto;
      }


      @media only screen and (max-width: 1336px) {
        .left-side {
          visibility: hidden;
          position: absolute;
        }
      }
    }

    .container-main {
      padding-top: 5rem;
    }

    .container-main-text {
      padding-top: 2rem;
      padding-bottom: 1.5rem;
    }

    .form-button {
      padding-top: 1.3rem;
    }

    @media only screen and (max-width: 360px) {
      .container-main {
        padding-top: 2rem;
      }
    }

    @media only screen and (max-width: 375px) {
      .container-main-text {
        padding-top: 1rem;
        padding-bottom: 0px;
      }
    }

    @media only screen and (max-width: 540px) {
      .container-main {
        padding-top: 2rem;
      }
    }

    @media only screen and (max-width: 912px) {
      .container-main-text {
        font-size: 50px;
      }
    }

    .img-logo {
      width: 250px;
    }

    /*DONE - BEGIN*/
    @media only screen and (max-width: 280px) {
      .header-logo {
        width: 250px;
      }

      .img-logo {
        width: 250px;
      }

      .container-main {
        padding-top: 1rem;
      }

      .container-main-text {
        padding-top: 0px;
        padding-bottom: 0px;
      }

      #loginFooter {
        display: none;
      }

    }

    @media only screen and (max-width: 914px) and (max-height: 412px) {
      #loginFooter {
        position: unset;
        padding-top: 5%;
      }
    }

    @media only screen and (max-width: 412px) and (max-height: 914px) {
      #loginFooter {
        position: fixed;
      }
    }

    @media only screen and (max-width: 1024px) {
      .container-main {
        padding-top: 2rem;
      }

      .container-main-text {
        font-size: 1.5rem;
      }

      .container-main-2-form {
        width: 50%;
      }

    }

    @media only screen and (min-width: 1025px) {
      .container-main-2-form {
        width: 40%;
      }
    }

    /*DONE - END*/

    @media only screen and (max-width: 820px) {
      .container-main-2-welcome-text {
        font-size: 1.7rem;
      }

      .container-main * {
        font-size: 1.5rem;
      }

      .container-main-2 {
        height: 500px;
      }

      .container-main-2-form {
        width: 725px;
      }
    }

    @media only screen and (max-width:600px) {
      .navbar-toggler {
        display: block;
        width: 60px;
        height: 45px;
        margin-right: auto;
        position: absolute;
        top: 20px;
        right: 20px;
      }

      .navbar-nav {
        display: block;
        position: absolute;
        top: 50px;
        right: 0;
        background-color: #fff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        flex-direction: column;
        text-align: left;
        margin-top: 20px;
      }


    }

    @media (max-width: 990px) {
      .navbar-toggler {
        display: block;
        width: 60px;
        height: 45px;
        margin-right: auto;
        position: absolute;
        top: 20px;
        right: 20px;
      }

      .navbar-nav {
        display: block;
        position: absolute;
        top: 50px;
        right: 0;
        background-color: #fff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        flex-direction: column;
        text-align: left;
        margin-top: 20px;
      }
    }