/* reset css start */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, menu, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
  display: block; }

/* HTML5 hidden-attribute fix for newer browsers */
*[hidden] {
  display: none; }

body {
  line-height: 1; }

menu, ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }


/* end */


/*Roboto*/
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: local("Roboto Thin"), local("Roboto-Thin"), url(../font/Font_Roboto/Roboto-Thin.ttf) format("truetype"); }

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local("Roboto Light"), local("Roboto-Light"), url(../font/Font_Roboto/Roboto-Light.ttf) format("truetype"); }

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local("Roboto Regular"), local("Roboto-Regular"), url(../font/Font_Roboto/Roboto-Regular.ttf) format("truetype"); }

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: local("Roboto Medium"), local("Roboto-Medium"), url(../font/Font_Roboto/Roboto-Medium.ttf) format("truetype"); }

body, html {
    height: 100%;
}


.LoginPage {
  width: 100vw;
  display: grid;
  background-color: #F6F8FA;
  grid-template-columns: 1fr minmax(auto, 653px) 1fr;
  grid-template-rows: minmax(auto, 233px) minmax(534px, auto) minmax(10px, 1fr);
  /* Full height */
  height: 100%;
}

.LoginPage__procedure {
  padding-left: 50px;
  padding-right: 50px;
  line-height: 1.6;
  color: #333;
  font-size: 15px;
}

.img-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.mb-li {
  margin-bottom: 12px;
}

.my-li {
  margin-top: 12px;
  margin-bottom: 12px;
}

.otp-list-type {
  list-style-type: circle;
  margin-left: 20px;
  margin-top: 6px;
}

.mi-p {
  margin: 6px 0;
}

.fw-5 {
  font-weight: 500;
}

.otp-link {
  color: #00A0DF;
  text-decoration: none;
  font-weight: 500;
}

.otp-secret-key {
  margin: 6px 0; font-size: 16px; font-weight: bold; letter-spacing: 2px; color: #00A0DF;
}

.list.horizontal {
  display: grid;
  grid-template-columns: repeat(2, minmax(200px, 1fr));
  grid-column-gap: 20px;
  grid-row-gap: 10px;
}

.list.horizontal > li {
  display: inline-block;
}

#kc-social-providers ul li a {
  padding: 2px 0;
  display: block;
  font-size: 14px;
  background: #f5f5f5;
  text-align: center;
  color: #72767b;
  border: 0;
  box-shadow: none;
  text-shadow: none;
}

#kc-social-providers ul li a:before {
  color: inherit;
}

#kc-social-providers ul li a:hover {
  color: #0099d3;
}

.LoginPage__social {
  text-align: center;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #4D4D4D;
  font-family: 'Roboto';
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -0.17px;
  line-height: 30px;
}

.LoginPage__formWrapper {
  grid-row: 2/3;
  grid-column: 2/3;
  background-color: #F6F8FA;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 2fr;
  font-family: "Roboto";
  max-width: 1140px; }

.LoginPage__form {
  display: grid;
  grid-template-columns: 1fr;
  font-family: "Roboto";
  max-width: 1140px; }

#kc-passwd-update-form {
font-family: "Roboto";
max-width: 1140px;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(1fr, 3);
padding-left: 50px;
padding-right: 50px;
row-gap: 14px;
}

.LoginPage__brand {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr 40px;
  justify-items: center;
  align-items: center;
  justify-content: center;
  align-content: center; }

.LoginPage__logo {
  height: 83px;
  width: 175px;
  margin-top: 50px;
  background-image: url("../img/logo_ge.png");
  background-repeat: no-repeat;
  background-size: cover;
  align-self: flex-start; }

.LoginPage__description {
  margin-top: 16px;
  align-self: flex-start;
  color: #002F87;
  opacity: 90%;
  font-family: "Roboto";
  font-size: 18px;
  letter-spacing: -0.17px;
  line-height: 30px;
  font-weight: 400;
  text-align: center; }


.LoginPage__copyright {
  margin-top: 5px;
  color: #002F87;
  opacity: 90%;
  font-family: "Roboto";
  font-size: 15px;
  letter-spacing: -0.17px;
  line-height: 30px;
  font-weight: 400;
  text-align: center;
  padding-bottom: 20px;
}

.LoginPage__url {
  color: #00A0DF;
  text-decoration: none;
}

.LoginPage__formGroup {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(1fr, 3);
  padding-left: 50px;
  padding-right: 50px;
  row-gap: 14px; }

.OtpPage__formGroup {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  padding-left: 50px;
  padding-right: 50px;}

.LoginPage__label {
  display: block;
  color: #4D4D4D;
  font-family: 'Roboto';
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -0.17px;
  line-height: 30px;
  margin-bottom: 4px; }


.wrapper-labelinput {
  display: block;
  color: #4D4D4D;
  font-family: 'Roboto';
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -0.17px;
  line-height: 30px;
  margin-bottom: 4px; }

.LoginPage__input {
  box-sizing: border-box;
  width: 100%;
  height: 59px;
  font-size: 18px;
  letter-spacing: -0.17px;
  line-height: 30px;
  font-family: "Roboto", sans-serif;
  padding-left: 10px;
  color: #999999;
  background-color: #FFFFFF;
  border: solid 1px #CED4DA;
  border-radius: 10px;
  font-weight: 400; }

.entando-input {
  box-sizing: border-box;
  width: 100%;
  height: 59px;
  font-size: 18px;
  letter-spacing: -0.17px;
  line-height: 30px;
  font-family: "Roboto", sans-serif;
  padding-left: 10px;
  color: #999999;
  background-color: #F2F4F8;
  border: 0px;
  font-weight: 400; }

.entando-input:focus {
  outline: none;
  color: #002F87;
  background-color: white;
  border: 1px solid #002F87; }


.LoginPage__input:focus {
  outline: none;
  color: #002F87;
  background-color: white;
  border: 1px solid #002F87; }

.LoginPage__select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 50px;
  width: 100%;
  border-radius: 0;
  border: 2px solid #002F87;
  color: #002F87;
  font-family: "Roboto";
  font-size: 18px;
  letter-spacing: -0.17px;
  line-height: 30px;
  padding-left: 15px;
  -ms-word-break: normal;
  word-break: normal;
  background: url("../img/caret-down.svg") 96%/15% no-repeat #fff;
  cursor: pointer; }

/*To remove button from IE11 */
.LoginPage__select::-ms-expand {
  display: none; }

.LoginPage__button {
  justify-self: flex-end;
  height: 50px;
  width: 171px;
  border: 0;
  border-radius: 10px;
  background-color: #45A2F8;
  color: #FFFFFF;
  font-family: "Roboto";
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.17px;
  line-height: 21px;
  text-align: center;
  text-transform: uppercase;
  font-weight: 500;
  cursor: pointer; }

.login-buttons {
  display: flex;
  justify-content: flex-end;
}

.login-buttons input {
  justify-self: flex-end;
  height: 50px;
  width: 171px;
  border-radius: 10px;
  border: 0;
  background-color: #45A2F8;
  color: #FFFFFF;
  font-size: 18px;
  font-weight: bold;
  letter-spacing: -0.17px;
  line-height: 21px;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer; }

.login-buttons input:hover {
  opacity: 80%; }


.LoginPage__button:hover {
  opacity: 80%; }

.LoginPage__actionGroup {
  display: flex;
  justify-content: center;
  margin-top: 25px;
  align-items: center;
}

.LoginPage__spinner {
  justify-self: center;
  align-self: center;
  box-sizing: border-box;
  width: 40px;
  height: 40px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border-top: 2px solid #07d;
  border-right: 2px solid transparent;
  animation: spinner .6s linear infinite; }

.LoginPage__loading {
  display: none;
  justify-self: flex-end;
  width: 171px; }

@media (max-width: 375px) {
  .LoginPage__formWrapper {
    grid-row: 1/3; }
  .LoginPage__actionGroup {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    justify-content: center;
    align-items: center;
    justify-items: center;
    row-gap: 10px;
    margin-top: 0; }
  .LoginPage__button {
    justify-self: center; }
  .login-buttons input {
    justify-self: center; }
  .LoginPage__error {
    text-align: center; }
  .LoginPage__loading {
    justify-self: center; } }

@media(max-width: 500px) {
  .LoginPage {
    grid-template-rows: minmax(auto, 233px) minmax(534px, auto) auto;
  }
  .list.horizontal {
    grid-template-columns: 1fr;
  }
}

.LoginPage__selectBox {
  position: relative;
  width: 171px; }

.extra-margin {
  margin-top: 6px; }

.LoginPage__error {
  font-family: "Roboto";
  font-size: 18px;
  color: #c00; }

@keyframes spinner {
  to {
    transform: rotate(360deg); } }
