body {
  overflow: hidden;
  padding: 0px;
  color: var(--login-text);
  font-size: 14px;
}
.login-section {
    overflow-x: hidden;
}
.card, .login-card {
    width: 90%;
}
.form-label, .card-title {
    color:#555;
    font-weight: bold;
}
.divider:after,
.divider:before {
  content: "";
  flex: 1;
  height: 1px;
  background: #eee;
}
.h-custom {
    /* item align vertical*/
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    height: 100vh;
}

.error {
    color: red;
}


.footer {
    margin-left: -30px;
    margin-right: -30px;
}

.text-primary {
     color: var(--background-color) !important;
}
input[type="password"] {
    border-right-color: transparent;
}
.btn-outline-secondary:hover {
    color: #6c757d;
    background-color: transparent;
    border-left-color: transparent;
    border-top-color: rgb(206, 212, 218);
    border-bottom-color: rgb(206, 212, 218);
    border-right-color: rgb(206, 212, 218);
}
.btn-outline-secondary {
    border-left-color: transparent;
    border-top-color: rgb(206, 212, 218);
    border-bottom-color: rgb(206, 212, 218);
    border-right-color: rgb(206, 212, 218);

}
 .btn-primary, .alert-primary, .fc-button-primary {
     color: #fff;
     background-color: var(--background-color) !important;
     border-color: var(--background-color);
}
 .btn-primary:hover, .fc-button-primary:hover {
     box-shadow: inset 0 0 0 20rem var(--darken-1);
     border-color: var(--background-color);
}
 .btn-primary:active, .fc-button-primary:active {
     box-shadow: inset 0 0 0 20rem var(--darken-2), inset 0 3px 4px 0 var(--darken-3), 0 0 1px var(--darken-2);
     border-color: var(--background-color);
}
 .btn-primary:disabled, .btn-primary.is-disabled {
     opacity: .5;
}
.bg {
  width: 100%;
  height: calc(100%);
  height: -webkit-calc(100%);  /* cross browser compatibility*/
  display: flex;
  z-index: -2;
  position: fixed !important;
  top:0px;
  left:0px;
  align-items: center;
  justify-content: center;
  background-size: 250% 250%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: var(--background-color);
  /*background-image: linear-gradient(-45deg, var(--background-color-alt) 0%, var(--background-color) 40%, var(--background-color) 55%, var(--background-color-alt) 100%);
  -webkit-animation: AnimateBG 15s ease infinite;
          animation: AnimateBG 15s ease infinite;*/

}

.bg-filter {
  width: 100%;
  height: calc (100%);
  height: -webkit-calc(100%);  /* cross browser compatibility*/
  display: flex;
  position: fixed;
  top:0px;
  left:0px;
  align-items: center;
  justify-content: center;
  background-size: 100% 100%;
  background-color: var(--background-color-75);
}

@-webkit-keyframes AnimateBG {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes AnimateBG {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.login-side-bg {

    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 50%;
    height: 100%;


    z-index: -1;
}
.text-title {
    font-size: 24px;
    margin: 10px 0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /*text-shadow: -1px 1px 0 #333,
                  1px 1px 0 #333,
                  1px -1px 0 #333,
                 -1px -1px 0 #333;*/
}
.text-title-small {
    font-size: 18px;
    margin: 10px 0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
#app_credit {
    position:fixed;
    bottom:0px;
    left:0px;
    width:100dvw;
    font-size: 0.8em;
    padding: 6px;

}

.btn-top {
    display: none;
    width: 54px;
    height: 54px;
    border: #fff 2px solid;
    line-height:51px;
    padding-top:5px
}
.bootbox {
    color: #000;
}
/* Move reCAPTCHA v3 badge to the left */

.grecaptcha-badge {
  width: 70px !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
  right: 4px !important;
  bottom: 40px !important;
  z-index: 9999 !important;
}
.grecaptcha-badge:hover {
  width: 256px !important;
}

.azure-login-button {
    min-width: 220px;
    height: 42px;
    max-width: 90%;
    margin-bottom: 30px
    border-radius: 4px;
    overflow:hidden
}

.btn-login-user-toggle {
    min-width: 220px;
    height: 42px;
    max-width: 90%;
    color: var(--login-text);
    background-color: transparent;
    border-color: var(--login-text);
}
.btn-lang {
    width: auto;
    height: 50px;
    color: var(--login-text);
    background-color: transparent;
    border: 0px;
    position: absolute;
    right: 10px;
    top: 10px;
}
.user-manual a {
    width: auto;
    height: 50px;
    color: var(--login-text);
    background-color: transparent;
    border: 0px;
    position: absolute;
    right: 100px;
    top: 25px;
    text-decoration: none;
}
.inner-footer span {
    padding: 0px 10px;
    background: rgba(0,0,0,0.75);
    border-radius: 5px;
}