* {
  font-family: 'Open Sans', sans-serif;
  margin: 0px;
  font-size: 14px;
}

html {
  background: #FAFAFB;
}

h1{
  font-size: 24px;
  line-height: 32px;
  color: #101E36;
}

.login-screen {
  display: flex;
  height: 100%;
  background-color: #FAFAFB;
}

.login-form {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
  margin-top: 74px;
  padding: 5px;
  width: 100%;
}

#top-image {
  height: 62px;
  user-select: none;
  display: flex;
  align-self: center;
  margin: 0;
  margin-bottom: 24px;
}

.forgot-password {
  padding-bottom: 32px;
}

.compliance-doc {
  font-size: 12px;
  user-select: none;
  color: #041295;
  text-align: center;
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 24px;
  margin-top :12px
}

#api {
  padding-top: 10px;
}

#api * {
  margin-bottom: 0px;
}

.options {
  display: flex;
  flex-direction: column;
}

#api #GoogleExchange {
  outline: none;
  color: white;
  background-color: rgb(80,134,236);
}

#api input:focus {
  outline:0;
}

.entry-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: auto;
  text-align: left;
}

#api .entry {
  padding-top:16px;
  padding-bottom:0px !important;
  display: flex;
  flex-direction: column;
  align-self: center;
}

#api .entry input {
  height: 38px;
  width: 285px;
  border: 1px solid #D5D5D5;
  z-index: 3;
  font-size: 14px;
  color: #313131;
  padding: 0px 16px;
  -moz-box-shadow: 0 0 0;
  -webkit-box-shadow: 0 0 0;
  box-shadow: 0 0 0;
  margin-bottom: 16px;
  border-radius: 4px;
  background-color: white;
}

#api .entry input:focus {
  border: 1px solid #D5D5D5;
}

#api .accountButton {
  border:1px solid #FFF;
  color:#FFF;
  margin-left:0;
  margin-right:2px;
  transition:background-color 1s ease 0s;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  border-radius:0;
  text-align:center;
  word-wrap:break-word;
  height:34px;
  width:200px;
  padding-left:30px;
  background-color:#505050;
  background-repeat:no-repeat;
  cursor: pointer;
}

#api .options div {
  display:inline-block;
  vertical-align:top;
  margin-top:7px;
}

#api #MicrosoftAccountExchange {
  background-image:url(data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAACpF6WWAAAACXBIWXMAAAsSAAALEgHS3X78AAAAVElEQVQ4jWP8//8/A7UBC8i8z4HKBE3mXX+XsWE3I0F1Da7/GZmo7kwGBoZRQ0cNpTKgXY5iXPqBoMn/owUYGXYRzlEMbqM5atTQoWEo9XMUAwMDAGSOGCOVddy/AAAAAElFTkSuQmCC);
  outline-offset: -2.5px;
  height: 48px;
  width: 288px;
  border-radius: 4px;
  outline: none;
  background-color: #2F2F2F;
  color: white;
  font-size: 16px;
  text-align: left;
  background-position: left;
  background-size: contain;
  padding-left: 60px;
  background-size: 30px;
  background-position: 8px;
}

#api #GoogleExchange {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAhCAMAAACP+FljAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAABOFBMVEX////62NXyi4Pual/rUEPqSz3tXlLyi4L5y8f86OfvcmjqQzXub2T85uT61dLrU0fvdWv86+nrT0LtX1PxgnnwgHfsXVHuaF398vHvdWnsWEv4xsL4wr7wenD+7sP0jRfqRjPsVkn85eT81mf7vAX3pQ7sUy/3ubT7xzH5uBj+/PyGsfjC1/v7vxP7yz9ChfSSuPiMtPj7xzDzwR78/fxel/VZlPWcv/n51GTVuBNOqki03r+vy/q60vv3672vtCI6qFA0qFNIsGTj8+jw9f5clvVDhfRrv4JLsWbC5cvY7t5gnt6Gsffp9exBrV5StGx4xY17xo9cuXU1pls9j8FNjPTo8P3S69lGr2JLoaPO3/zn9Opnvn5UtW7X7t3V7duCyZVeundCrl87q1lOs2l6xo+84sb9/v2qdWS0AAAAAWJLR0QAiAUdSAAAAAd0SU1FB+EIGQ4HDEDExrUAAADWSURBVDjLY2AYBZiAkYmZhZWNnQOHNCcXNxTw8GKT5+PnhgMBLPKCQiAZYRFRMW5ucQksCiSB0lLSIJaMLDZ5OXkFbkUlPB5QVlFVU8fnQw0VFU0tEEMbCnTQFOiqqOiBGfpQYEBIgSGaAiMVFWMTEMMUCMyACszRFFioWFpZwzg2QAW2aArs7B0cnZwhbBdXfX03F3RvuDs6Onp4glhe3kADfDD86esHVOHoHxAY5Bgcoh8ahhkS4RGOcBAZhS2somNg8rFxOIIzPiExKTklNS2dYaQBADviJWzWK7IJAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE3LTA4LTI1VDE0OjA3OjEyLTA0OjAwBQDEvwAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxNy0wOC0yNVQxNDowNzoxMi0wNDowMHRdfAMAAAAASUVORK5CYII=);
  outline-offset:-2.5px;
  height: 48px;
  width: 288px;
  border-radius: 4px;
  outline: none;
  background-color: #4285F4;
  color: white;
  font-size: 16px;
  text-align: left;
  background-position: left;
  background-size: contain;
  padding-left: 60px;
  background-size: 30px;
  background-position: 8px;
}

#api #LinkedInExchange {
  background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAb1BMVEUAe7b///8AdrMklscAc7EAeLUAcbB5ttifzeMqmckAdLIAaqz7+/6PxeAShr0CgLkAba4nmMctksTv9Puw1eij0OWGvNtfrNJNo80YjMAeib/D4vGt3Oy82+yfzOOCvtyJvdx3tddirtI/ncoxmMj9KsrQAAAAw0lEQVQ4y9WSVw7DIAxAG8CkjJDVzO5x/zMWk0RNJaB/kfo+sGUeCMvstgI4J7F9aS5NxSLnTWLpZVDgexTqIiycUNBhgTxRyCKPYJ3dl7sITCkO+FyLXaWU310DscASOesf3ahWChGJ5cb4ASO5Joiu2EegWEmZa1c3yUwOHmHNuQgJup4CgF8YlKpcMhKvkNmb1REz6hdetsyziIBldv8lpH8ouGm28zQFCu2SOSAXlJYGYCgpFThEMFPm/zCryja8Acy7CRfMrcKPAAAAAElFTkSuQmCC);
  height: 48px;
  width: 288px;
  border-radius: 4px;
  outline: none;
  background-color: #0077B5;
  color: white;
  font-size: 16px;
  text-align: left;
  background-position: left;
  background-size: contain;
  padding-left: 60px;
  background-size: 30px;
  background-position: 8px;
}


#api .divider {
  width: 288px;
  margin: 20px auto;
  margin-top:20px;
  margin-bottom:10px;
}

#api .divider h2 {
  display:table;
  white-space:nowrap;
  font-weight: 700;
}

#api .divider h2:after,
#api .divider h2:before {
  border-top:1px solid #B8B8B8;
  content:'';
  display:table-cell;
  position:relative;
  top:.7em;
  width:50%;
}

#api .divider h2:before {
  right:1.8%;
}

#api .divider h2:after {
  left:1.8%;
}

#api #createAccount {
  margin-left:5px;
  font-size: 14px;
  color: #00BCDD;
  outline-style: none;
  text-decoration: none;
}

#api #createAccount:hover {
  text-decoration: underline;
}

#api #next {
  user-select: none;
  cursor: pointer;
  width: auto;
  padding: 0px 16px;
  height: 40px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background: #041295;
  border: 1px solid #FFF;
  color: #fff;
  transition: background 1s ease 0s;
  font-size: 16px;
  font-weight: bold;
  outline-style: none;
  margin-bottom: 32px;
  margin-top: 24px;
}

#api #next:hover {
  background:#6871BF;
  border:1px solid #FFF;
  box-shadow:0 0 0;
  -moz-box-shadow:0 0 0;
  -webkit-box-shadow:0 0 0;
  box-shadow:0 0 0;
}

#api .password-label label {
  vertical-align:baseline;
  float: left;
}

#api .intro {
  display: none;
}

#api .intro p {
  padding-bottom:7px;
}

#api ::-webkit-input-placeholder {
  color:#6d6d6d;
}

#api :-moz-placeholder {
  color:#6d6d6d;
}

#api ::-moz-placeholder {
  color:#6d6d6d;
}

#api :-ms-input-placeholder {
  color:#6d6d6d!important;
}

#api #forgotPassword {
  display: none;
}

.hyperlink {
  color: #00BCDD;
  user-select: none;
  outline-style: none;
  text-decoration: none;
  font-size: 14px;
  line-height: 20px;
}

.hyperlink:hover {
  text-decoration: underline;
}

.help {
  padding: 16px 0px 32px 0px;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

#footer-image {
  height: 52px;
}

#api .error {
  color:#E1261D;
}