/*
    ============================================================
    Loading State  --  SIZING AND STRUCTURE
    ============================================================
*/
.loadingState {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: column-reverse;
  flex-direction: column-reverse;
  overflow: hidden;
  min-height: 100px;
}
.loadingState p {
  -ms-user-select: none !important;
  -moz-user-select: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: column-reverse;
  flex-direction: column-reverse;
  text-align: center;
  font-size: 18px;
  color: #4d4f53;
  flex: 1 1 45%;
  cursor: default;
}
.loadingState i {
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: column;
  flex-direction: column;
  flex: 1 1 55%;
  cursor: default;
  width: 100%;
}
.loadingState i:before {
  display: block;
  align-self: center;
  content: "";
  border-radius: 50%;
  width: 30px;
  height: 30px;
  border: 4px solid #ccc;
  border-top-color: #f6632d;
  animation: spin .8s infinite ease;
  margin-top: 10px;
}
.spinCircle {
  display: block;
  align-self: center;
  content: "";
  border-radius: 50%;
  width: 30px;
  height: 30px;
  border: 4px solid #ccc;
  border-top-color: #f6632d;
  animation: spin .8s infinite ease;
  margin-top: 10px;
}
/*
    ============================================================
    Loading State  --  ICON AND TEXT COLOR DEFINITIONS
    ============================================================
*/
.loadingState p {
  color: #4d4f53;
}
.loadingState i:before {
  border: 4px solid #ccc;
  border-top-color: #f6632d;
}
/*
    ============================================================
    Loading State SMALL  --  SIZING AND STRUCTURE
    ============================================================
*/
.loadingState-small {
  position: relative;
  width: 10px;
  height: 10px;
  animation: colorPulse 1s infinite;
  animation-delay: .33s;
  border-radius: 50%;
}
.loadingState-small:before,
.loadingState-small:after {
  content: '';
  position: absolute;
  display: block;
  height: 10px;
  width: 10px;
  top: 50%;
  transform: translateY(-50%);
  animation: colorPulse 1s infinite;
  border-radius: 50%;
}
.loadingState-small:before {
  left: -15px;
}
.loadingState-small:after {
  left: 15px;
  animation-delay: .66s;
}
/*
    ============================================================
    Loading State Small --  ICON AND TEXT COLOR DEFINITIONS
    ============================================================
*/
.loadingState-small {
  background: #ccc;
}
.loadingState-small:before,
.loadingState-small:after {
  background: #ccc;
}
.loadingState-badge {
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: row;
  flex-direction: row;
  align-items: center;
}
.loadingState-badge div {
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: row;
  flex-direction: row;
  height: 45px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.43);
  background-color: #fff;
  flex: 0 0 auto;
  margin: auto;
  position: relative;
  align-items: center;
  top: -25px;
}
.loadingState-badge i {
  height: 45px;
  width: 45px;
  background-color: #f6632d;
  flex: 0 0 auto;
  justify-content: center;
}
.loadingState-badge i:before {
  border: 3px solid #fff;
  border-top-color: #f6632d;
  flex: 0 0 auto;
  margin: 0;
  height: 15px;
  width: 15px;
  animation: spin 1s infinite ease;
}
.loadingState-badge p {
  display: -webkit-flex;
  /* NEW - Chrome */
  display: flex;
  /* NEW, Spec - Opera 12.1, Firefox 20+ */
  -webkit-flex-direction: column;
  flex-direction: column;
  height: 45px;
  color: #4d4f53;
  justify-content: center;
  flex: 1 1 auto;
  padding: 0 20px;
}
/*
    ============================================================
    ANIMATIONS AND HIGH CONTRAST SUPPORT
    ============================================================
*/
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes colorPulse {
  50% {
    background: #f6632d;
  }
}
@media screen and (-ms-high-contrast: active) {
  .loadingState i {
    border: none;
  }
  .loadingState i:before {
    border: none;
    content: "\231B";
    width: auto;
    font-family: sans-serif;
    height: 55px;
    font-size: 34px;
    font-style: normal;
    animation: none;
  }
}
/*!**************************Confidential and Proprietary*****************************
* File Name: LoginCtrl.css
********************Copyright (c) Hyland Software, Inc. 1991-2018********************/
.loginCtrlStyleWrapper form {
  height: 100%;
  width: 100%;
  overflow: hidden;
}
.loginCtrlStyleWrapper input::-webkit-input-placeholder {
  text-transform: none !important;
}
.loginCtrlStyleWrapper input::-moz-placeholder {
  text-transform: none !important;
}
.loginCtrlStyleWrapper input:-ms-input-placeholder {
  text-transform: none !important;
}
.loginCtrlStyleWrapper input::placeholder {
  text-transform: none !important;
}
.loginCtrlStyleWrapper .loginpanel td,
.loginCtrlStyleWrapper .errorbox td {
  vertical-align: middle;
}
.loginCtrlStyleWrapper .loginErrorIcon {
  position: relative;
  left: -10px;
}
[dir=rtl] .loginCtrlStyleWrapper .loginErrorIcon {
  left: auto;
  right: -10px;
}
.loginCtrlStyleWrapper .infoFooterText {
  position: fixed;
  bottom: 10px;
  right: 10px;
  left: 10px;
  font-size: 12px;
  color: #757575;
  direction: ltr;
  text-align: left;
}
[dir=rtl] .loginCtrlStyleWrapper .infoFooterText {
  text-align: right;
}
.loginCtrlStyleWrapper .loginButton {
  padding: 0 40px;
}
.loginIcon {
  vertical-align: middle;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: center;
  margin: 0 10px 0 0;
  display: inline-block;
}
[dir=rtl] .loginIcon {
  margin: 0 0 0 10px;
}
.loginLoadingState {
  background-color: #757575;
}
.loginLoadingState i:before {
  animation: loginSpin 1s infinite ease;
}
@keyframes loginSpin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
