body {
  font-family: "Segoe UI", "Roboto", sans-serif, tahoma, Verdana;
  font-size: 14px;
  position: relative;
  color: #163f74;
  background: #F2F7FF;
}

#img-univhassan2 {
  padding-left: 18px;
}

.input-group-text {
  padding: 0.65rem 0.75rem !important;
}

@media screen and (min-width: 1200px) {
  .login-container .form-container {
    width: 100%;
  }
}

@media screen and (min-width: 800px) {

  .header-login-mobile {
    display: none;
  }

  .login-container .form-container .wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #163f74;
    opacity: 0.3;
    width: 100%;
    height: 100%;
  }

  .login-container .form-container .form {
    background: white;
    min-width: 600px;
    position: absolute;
    right: 0;
    top: 45px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2rem;
    margin-right: 100px;
  }

  .header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    height: 60px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background: white;
    box-shadow: 1px 1px 2px #44444440;
  }

  .login-container {
    position: relative;
    top: 60px;
    width: 100%;
  }

    .login-container .form-container {
      position: relative;
      background: transparent;
      min-height: calc(100vh - 110px);
      width: 100%;
      box-shadow: 10px 2px 10px #ccc;
      background-image: url("../img/arriere-plan-appli.jpg");
      background-repeat: no-repeat;
      background-size: cover;
      overflow: auto;
    }

      .login-container .form-container .form {
        min-width: 450px;
      }
}
/* .login-container .form-container .form .title {
  margin-bottom: 25px;
} */
.login-container .form-container .form .title h1::before, .login-container .form-container .form .title .h1::before {
  content: "";
  height: 100%;
  border: 6px solid #f5a80e;
  margin-right: 10px;
}

.login-container .form-container .form .input-container,
.login-container .form-container .form .submit-container {
  margin: 0.75rem auto;
}

.login-container .form-container .form button[type=submit] {
  outline: none;
  border: none;
  background-image: linear-gradient(to right, #109b5a, #15c975, #109b5a);
  padding: 1.5rem auto;
  cursor: pointer;
  color: #fff;
  background-size: 200%;
  transition: 0.5s;
  text-transform: uppercase;
}

  .login-container .form-container .form button[type=submit]:hover {
    background-position: right;
  }

.ft {
  margin-top: 60px;
  padding: 10px;
  display: flex;
  justify-content: center;
  width: 100%;
  background: white;
  font-weight: 600;
}

.dropdown-menu-arrow::before {
  content: "";
  width: 13px;
  height: 13px;
  background: #fff;
  position: absolute;
  top: -7px;
  right: 20px;
  transform: rotate(45deg);
  border-top: 1px solid #00000040;
  border-left: 1px solid #00000040;
}

.btn-check:focus + .btn,
.btn:focus {
  outline: 0;
  box-shadow: none;
}


.header-login {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 20;
  height: 95px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background: #f8f9fa;
  box-shadow: 1px 1px 2px #44444440;
}

/*# sourceMappingURL=style.css.map */
@media screen and (max-width: 800px) {

  body {
    background: #ffffff;
  }

  #img-royaume {
    display: none;
  }

  .header-login {
    position: static;
  }

  .header-login-mobile {
    background-image: url("../img/FEG-gate.png");
  }

  .login-containe {
  }

  .form-container {
  }

  .btn-check:focus + .btn,
  .btn:focus {
    outline: 0;
    box-shadow: none;
  }

  .login-container .form-container .wrapper {
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #163f74;
    opacity: 0.3;
    width: 100%;
    height: 100%;
  }


  .ft {
    margin-top: 60px;
    padding: 20px;
    display: none;
    justify-content: center;
    width: 100%;
    background: white;
    font-weight: 600;
  }

  .dropdown-menu-arrow::before {
    content: "";
    width: 13px;
    height: 13px;
    background: #fff;
    position: absolute;
    top: -7px;
    right: 20px;
    transform: rotate(45deg);
    border-top: 1px solid #00000040;
    border-left: 1px solid #00000040;
  }


  /*  .login-container .form-container {
    background: transparent;
    min-height: calc(100vh - 140px);
    width: 100%;
    box-shadow: 10px 2px 10px #ccc;
    background-image: url("../img/FEG-gate.png");
    background-repeat: no-repeat;
    background-size: cover;
    overflow: auto;
  }*/


  .login-container .form-container .form {
    background: white;
    right: 0;
    top: 45px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 2rem;
  }

    .login-container .form-container .form .title h1::before, .login-container .form-container .form .title .h1::before {
      content: "";
      height: 100%;
      border: 6px solid #f5a80e;
      margin-right: 10px;
    }

    .login-container .form-container .form .input-container,
    .login-container .form-container .form .submit-container {
      margin: 1.5rem auto;
    }

    .login-container .form-container .form button[type=submit] {
      outline: none;
      border: none;
      background-image: linear-gradient(to right, #109b5a, #15c975, #109b5a);
      padding: 1.5rem auto;
      cursor: pointer;
      color: #fff;
      background-size: 200%;
      transition: 0.5s;
      text-transform: uppercase;
    }

      .login-container .form-container .form button[type=submit]:hover {
        background-position: right;
      }
}


@media screen and (max-width: 490px) {
  #img-univhassan2 {
    display: none;
  }

  .header-login {
    justify-content: center;
    height: 60px;
  }
}