* {margin:none;
  padding: none;
  box-sizing: border-box;}
  
  html {
    height: auto;
    min-height: 100%;
  }
  
  body {
    height:100%;
  width: 100%;
   background-image: linear-gradient(45deg, rgba(0, 97, 253, 0.7), rgba(0, 97, 253, 0.7)), url(../img/monetizer-registration/office-background.jpg);
  background-size: cover;
  background-repeat: none;
}
  
  
  
  .heading-main {color: rgb(255, 255, 255);
  font-family: 'Montserrat';
  font-size: 3.7em;
  font-weight: 700;
  margin-top: 16%;
  margin-left: 2%;
  display: inline-block;
  animation: backInLeft;
  animation-duration: 2s;}
  
  .register-box {
    position: fixed;
    right: 0;
    top: 0;
    overflow-y: auto;
  display: block;
  float:right;
  height: 100% !important;
  width: 25%;
  background-color: white;
  float: top;
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}
  .img-logo {
    height: 127px;
    width: 100%;
    background-color: #004fba;
    display: flex;
    align-items: center;
  }
  
  .logo{width: 100%;}
  
  .register-heading {display: block;
  margin-top: 2em;
  font-family: 'Montserrat';
  font-size: 1.5em;
  font-weight: 500;
  color: black;
  text-align: start;
  padding: 5px 10px;
}
  .username {
  margin-top: 1.5em;
  margin-right: auto;
  margin-left: auto;
  display: block;
  width: 95%;}
  
  .input {margin-top: 2em;}
  
  .error-box {
  width: 95%;
  padding: 0.25em;
  text-align: center;
  display: block;
  border:1px solid #ff0000;
  border-radius: 10px;
  margin-right: auto;
  margin-left: auto;
}
  .alert {text-align: center;
          font-family: 'Montserrat';}  
  .pass {margin: 1em auto;}

  .text-form {width: 95%;
  margin: auto auto; }
  
  .invalid-feedback{
    display: none !important;
  }
  .form-control{
    border-radius: 0 !important;
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: gray !important;
    outline: none !important;
    border-width: 2px;
    margin: 10px 0px !important;
  }
  .form-control:focus{
    box-shadow: none !important;
    border-color: #146fee !important;
    box-shadow: 0 4px 2px -2px #146fee;
  }
  .password-input, .fa-input{
    margin: 0;
  }
  .needs-validation{
    margin-top: 3px;
  }
 .btn-log{
   width: 100%;
   border-radius: 1px;
   margin-top: 10px;
   margin-bottom: 20px;
 }
 textarea{
   margin-right: 0px !important;
   width: 100% !important;
 }
  @media all and (max-width:1200px)
      
  {.heading-main{font-size: 3.75em;}
      .register-box {width: 45%;
      margin-left: 5%;}}
  
  
  
  @media all and (max-width:955px)
      
  {.heading-main{font-size: 3.5em;}
     }
  
  @media all and (max-width:882px)
      
  {.heading-main{font-size: 3.25em;}
     }
  
  @media all and (max-width:810px)
      
  {.heading-main{font-size: 3em;}
     }
  
  @media all and (max-width:750px)
      
  {body{height: 100%;}
      .register-box {width: 100%;
      height: 100vh;}
      .logo {width: 50%;
      text-align: center;
      margin:auto auto;
      display: block;}
      .login-btn {margin: auto auto;}
  .login-btn:link {margin: auto auto;}
  .login-btn:hover {margin: auto auto;}
      .heading-main {
      text-align: center;
      margin: auto auto;
      display: block;
      margin-top:20%;
      margin-bottom: 20%;}}
  
  @media all and (max-width:450px)
  { .heading-main{font-size: 2em;}
     }
  
  @media all and (max-width:350px)
  { .heading-main{font-size: 1.75em;
        margin-top:25%;
      margin-bottom: 25%;}  
  }
    @media (max-width:300px){
    .heading-main{font-size: 1.5em;
        margin-top:25%;
      margin-bottom: 25%;}
     
    }