/*
0 - 600:        Phone
600 - 900px:    Tablete portrait
900 - 1200px:   Tablete landscape
1200 - 1800px:  Normal Desktop
1800px +:    Big Desktop
*/
/*breakpoint :
-phone
-tab-land
-tab-port
-big-desktop
*/
@import url("https://fonts.googleapis.com/css?family=Roboto&display=swap");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
/*
0 - 600:        Phone
600 - 900px:    Tablete portrait
900 - 1200px:   Tablete landscape
1200 - 1800px:  Normal Desktop
1800px +:    Big Desktop
*/
/*breakpoint :
-phone
-tab-land
-tab-port
-big-desktop
*/
@media (max-width: 48em) {
  html {
    font-size: 55%; } }

body {
  font-family: "Roboto" !important;
  font-size: 0.9rem !important;
  overflow-x: hidden;
  overflow-y: auto;
  height: 100%; }

h1 {
  font-size: 2rem !important; }

h2 {
  font-size: 1.5rem !important; }

h3 {
  font-size: 1rem !important; }

h4 {
  font-size: 0.9rem !important; }

@media (max-width: 112.5em) {
  html {
    font-size: 90%; } }

.loginbg {
  background-color: #f9fafc;
  position: absolute;
  width: 100%;
  height: 100%; }
  .loginbg .login {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 480px; }
    .loginbg .login .loginform {
      background-color: #fff;
      box-shadow: 0px 2px 10px #778ca2;
      padding: 2rem 5rem 3rem;
      margin-top: 2rem;
      border-radius: 5px; }
      .loginbg .login .loginform .textsub {
        color: #778ca2;
        font-size: 14px; }
      .loginbg .login .loginform input {
        font-size: 16px;
        color: #98a9bc; }
      .loginbg .login .loginform .btnlog {
        background-color: #ec6536;
        border-radius: 5px;
        border: none;
        padding: 0.5rem;
        color: #fff; 
        cursor:pointer;
    }

input[type=text].form-control.valid + label:after,
input[type=text].form-control:focus.valid + label:after,
input[type=text].form-control.invalid + label:after,
input[type=text].form-control:focus.invalid + label:after,
input[type=password].form-control.valid + label:after,
input[type=password].form-control:focus.valid + label:after,
input[type=password].form-control.invalid + label:after,
input[type=password].form-control:focus.invalid + label:after {
  top: 3.75rem !important; }

span.field-icon {
  position: absolute;
  display: inline-block;
  cursor: pointer;
  right: 0.5rem;
  top: 0.7rem;
  color: red;
  z-index: 2; }

/************************************Login Page End*****************************************/