@import url('fonts.css');

/*
font-family: 'Adobe Clean', sans-serif;
font-family: 'Adobe Clean Serif', sans-serif;
font-family: 'Adobe Clean UX', sans-serif;
 */                                               

:root {
  --blue: rgb(4, 105, 227);
  --red: rgb(229, 54, 35);
  --blue-hover: rgb(0, 87, 190);
  --gray-800: rgb(40, 40, 40);
  --gray-600: rgb(111, 111, 111);
  --gray-500: rgb(143, 143, 143);
  --gray-400: rgb(198, 198, 198);
  --gray-300: rgb(213, 213, 213);
  --gray-200: rgb(230, 230, 230);
  --gray-175: rgb(234, 234, 234);
  --gray-150: rgb(242, 242, 242);
  --gray-100: rgb(248, 248, 248);
  --gray-120:rgb(245,245,245);
  --gray-90: rgb(247, 247, 247);
  --red-100:#B30B00;
  --text-color:rgb(34,34,34);
  --gray-700:rgb(70,70,70);
  --gray-750:rgb(42,42,42);
  --spectrum-indigo-200:rgb(4, 105, 227);
    --green-100:rgb(62, 141, 97);
}

#overlay {
  width:100%;
  height:100%;
  top:0;
  left:0;
  background:rgba(0,0,0,0.2);
  display:none;
  position:fixed;
  z-index:45;
}



.ac-modal {
  position:fixed;
  z-index:100;
  width:600px;
  min-height:150px;
  height:auto;
  background:var(--gray-150);
  border-radius:12px;
  margin-top:-50px;
  opacity:0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.12), 0 19px 38px rgba(0,0,0,0.10), 0 15px 12px rgba(0,0,0,0.08);
}

.ac-modal-header {
  position:relative;
  padding:15px 20px 7px 20px;
  color:var(--gray-700);
  font-size:20px;
}

.ac-modal-body {
  padding:15px 20px 10px 20px;
  min-height:150px;
  height:100%;
}

.close-modal {
  position:absolute;
  right:15px;
  top:12px;
  cursor:pointer;
  padding:0px 3px 0px 3px;
  border-radius:6px;
  
  font-size:24px;
}

.ac-modal-footer {
  padding:20px;
  text-align:right;
}

.close-modal:hover {
  background:var(--gray-200);
}

.password-correct {
  font-size:12px;
  color:var(--green-100);
}

.password-incorrect {
  font-size:12px;
  color:var(--red);
}

* {
  font-family: 'Adobe Clean', sans-serif !important;
}

html, body {
  font-family: 'Adobe Clean', sans-serif !important;
  height:100%;
  width:100%;
  background:var(--gray-120);
  color:var(--text-color) !important;
}

body {
  height:100%;
  width:100%;
}

.acrobat-logo {
  height:30px;
  width:auto;
  text-align:left;

  position:absolute;
  top:20px;
  left:25px;
}

.acrobat-logo-text {
  position:absolute;
  top:23px;
  font-weight:600;
  left:65px;
}

.center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.login-block {
  position:absolute;
  width:80%;
  height:80%;
  border-radius:20px;
  background:#fff;
}

.login-block.small {
  width:500px;
  padding:30px;
}

.login-block-left {
  -webkit-border-top-left-radius: 20px;
-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomleft: 20px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
  height:100%;
  background-color: #A9C9FF;
background-image: linear-gradient(45deg, #A9C9FF 0%, #FFBBEC 100%);

}

.so-login-block-left {
  background-image: radial-gradient( circle farthest-corner at 10.2% 55.8%,  rgba(252,37,103,1) 0%, rgba(250,38,151,1) 46.2%, rgba(186,8,181,1) 90.1% );
}

.login-block-right { 
  padding:40px !important;
  position:relative;
}

#login-holder {
  width:350px;
}

.adobe-input {
  width:100%;
  border-radius:6px;
  border:1px solid var(--gray-400);
  height:35px;
  padding-left:7px;
  transition:0.3s;
  outline:none;
  font-size:14px;
}

.adobe-input::placeholder {
  font-style:italic;
}

.adobe-input:not(:disabled):hover {
  border-color:var(--gray-700);
}

.adobe-input:focus {
  border-color:var(--blue) !important;
}

.adobe-input:disabled {
  background:var(--gray-150);
}

.adobe-label {
  font-size:14px;
  margin-top:30px;
  color:var(--gray-600);
  margin-bottom:5px;
}

.show-password {
  position:absolute;
  font-size:18px;
  color:var(--gray-600);
  right:10px;
  top:188px;
  cursor:pointer;
  transition:0.3s;
}

.show-password:hover {
  color:var(--blue);
}

.login-animation {
  height:450px;
  width:410px;
  overflow:hidden;
  position:relative;
}

.adobe-btn {
  display:inline-block;
  border-radius:80px;
  font-size:14px;
  text-align:center;
  padding:5px 18px 5px 18px;
  font-weight:normal !important;
  cursor:pointer;
  transition:0.3s;
}

.adobe-btn.gray {
  border:2px solid var(--gray-200);
  background:var(--gray-200);
  color:var(--gray-800) !important;
  font-weight:500;
}

.adobe-btn.gray:hover {
  border:2px solid var(--gray-400);
  background:var(--gray-400);
}

.adobe-btn.dark {
  border:2px solid var(--gray-700);
  background:var(--gray-700);
  color:#fff !important;
  font-weight:500;
}

.adobe-btn.dark:hover {
  border:2px solid var(--gray-800);
  background:var(--gray-800);
  color:#fff !important;
  font-weight:500;
}

/*TOASTS */

.adobe-toast {
  top:30px;
  position:absolute;
  width:250px;
  left:calc(50% - 125px);
  text-align:left;
  border-radius:6px;
  padding: 10px 15px 10px 15px;
  font-size:14px;
  display: inline-block;
  z-index:100;
  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
  opacity:0;
  margin-top:-20px;
}

.adobe-toast.danger {
  background:var(--red-100);
  color:#fff;
}

.adobe-toast.green {
  background:var(--green-100);
  color:#fff;
}

.adobe-toast.alert {
  background:var(--yellow-100);
  color:#fff;
}

.close-toast {
  position:absolute;
  color:#fff;
  right:10px;
  cursor:pointer;
  top:6px;
  padding:1px 2px 1px 2px;
  border-radius:6px;
  transition:0.3s;
  font-size:18px;
}

.close-toast:hover {
  background:rgb(228,76,54);
}


/*LOADER */

.loader {
  border: 4px solid rgb(213,213,213); /* Light grey */
  border-top: 4px solid var(--blue); /* Blue */
  display:inline-block;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 1s cubic-bezier(0.27,0,0.18,1) infinite;
}

.loader-small {
  border: 3px solid rgb(213,213,213); /* Light grey */
  border-top: 3px solid var(--blue); /* Blue */
  display:inline-block;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s cubic-bezier(0.27,0,0.18,1) infinite;
}


.loader-white {
  border: 4px solid rgb(213,213,213); /* Light grey */
  border-top: 4px solid #fff; /* Blue */
  display:inline-block;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 1s cubic-bezier(0.27,0,0.18,1) infinite;
}

.loader-white-small {
  border: 3px solid rgba(255,255,255,0.5); /* Light grey */
  border-top: 3px solid #fff; /* Blue */
  display:inline-block;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s cubic-bezier(0.27,0,0.18,1) infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); 
  }

  100% { transform: rotate(360deg); }
}



.adobe-btn.primary {
  border:2px solid var(--blue);
  background:var(--blue);
  color:#fff !important;
  font-weight:500;
}

.adobe-btn.primary:hover {
  border:2px solid var(--blue-hover);
  background:var(--blue-hover);
  color:#fff !important;
  font-weight:500;
}

.acrobat-label {
  font-size:14px;
  font-weight:600;
}

.email-completer {
  position:absolute;
  background:var(--gray-200);
  -webkit-border-top-right-radius: 6px;
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-topright: 6px;
-moz-border-radius-bottomright: 6px;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
  width:200px;
  right:11px;
  height:35px;
  top:24px;
  border:1px solid var(--gray-400);
  padding:5px 0 5px 10px;
  color:var(--gray-700);
  font-size:14px;
}

.tfa_input {
  height:54px;
  width:40px;
  border-radius:6px;
  display:inline-block;
  outline:none;
  border:1px solid var(--gray-600);
  margin-right:5px;
  font-size:32px;
  text-align:center;
}

.tfa_input_holder {
  text-align:center;
}

.disclaimer {
  position:absolute;
  bottom:-50px !important;
  font-size:12px;
  color:var(--gray-600);
  width:100%;
}


.center-x {
  margin: 0;
  position: absolute;
  left: 50%;
  -ms-transform: translateX(-50%, -50%);
  transform: translateX(-50%, -50%);
}

