#FacebookExchange{
	background-image: linear-gradient(#0dccea, #0d70ea);
	border: 0;
	border-radius: 4px;
	box-shadow: rgba(0, 0, 0, .3) 0 5px 15px;
	box-sizing: border-box;
	color: #fff;
	cursor: pointer;
	font-family: Montserrat,sans-serif;
	font-size: .9em;
	margin: 5px;
	padding: 10px 15px;
	text-align: center;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
}
#GoogleExchange{
	background-image: linear-gradient(135deg, #f34079 40%, #fc894d);
	border: 0;
	border-radius: 4px;
	box-shadow: rgba(0, 0, 0, .3) 0 5px 15px;
	box-sizing: border-box;
	color: #fff;
	cursor: pointer;
	font-family: Montserrat,sans-serif;
	font-size: .9em;
	margin: 5px;
	padding: 10px 15px;
	text-align: center;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
}
input[type="email"], input[type="password"], input[type="text"]{
	width: 100%;
	border: 0;
	border-bottom: 2px solid #9b9b9b;
	outline: 0;
	padding: 7px 0;
	background: transparent;
	transition: border-color 0.2s;
}
input[type="email"]::placeholder {
  color: transparent;
}
input[type="password"]::placeholder {
  color: transparent;
}
input[type="text"]::placeholder {
  color: transparent;
}
input[type="email"]:focus {
  padding-bottom: 6px;
  font-weight: 700;
  border-width: 3px;
  border-image: linear-gradient(to right, #3d57ca, #57bff0);
  border-image-slice: 1;
}
input[type="password"]:focus {
  padding-bottom: 6px;
  font-weight: 700;
  border-width: 3px;
  border-image: linear-gradient(to right, #3d57ca, #57bff0);
  border-image-slice: 1;
}
input[type="text"]:focus {
  padding-bottom: 6px;
  font-weight: 700;
  border-width: 3px;
  border-image: linear-gradient(to right, #3d57ca, #57bff0);
  border-image-slice: 1;
}
label[for=email], label[for=password], label[for=displayName], label[for=surname],
label[for=extension_DUI]
{
	transition: 0.2s;
	font-size: 1rem;
	color: #9b9b9b;
}

/* BUTTON */
#next, #continue, #cancel, #emailVerificationControl_but_send_code, #emailVerificationControl_but_verify_code, #emailVerificationControl_but_send_new_code, #emailVerificationControl_but_change_claims {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    border: none;
    border-radius: 4px;
    padding: 0 16px;
    min-width: 64px;
    width: 250px;
    height: 45px;
    vertical-align: middle;
    text-align: center;
    text-overflow: ellipsis;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #00aec7 !important;
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    font-family: var(--pure-material-font, "Roboto", "Segoe UI", BlinkMacSystemFont, system-ui, -apple-system);
    font-size: 12px;
    font-weight: 500;
    line-height: 36px;
    overflow: hidden;
    outline: none;
    cursor: pointer;
    transition: box-shadow 0.2s;
}

#next::-moz-focus-inner {
    border: none;
}

/* Overlay */
#next::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #00aec7 !important;
    opacity: 0;
    transition: opacity 0.2s;
}

/* Ripple */
#next::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    padding: 50%;
    width: 150px; /* Safari */
    height: 45px; /* Safari */
    background-color: #00aec7 !important;
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
    transition: opacity 1s, transform 0.5s;
}
i,
span.material-icons {
   color: #0032a1;
    margin-left: -20px;
    margin-top: 8px;
    cursor: pointer;
}

input::-ms-reveal,
input::-ms-clear {
  display: none;
}

/* Hover, Focus */
#next:hover, #continue:hover, #cancel:hover, #emailVerificationControl_but_send_code:hover, #emailVerificationControl_but_verify_code:hover,
#emailVerificationControl_but_send_new_code:hover, #emailVerificationControl_but_change_claims:hover,
#next:focus, #continue:focus, #cancel:focus, #emailVerificationControl_but_send_code:focus, #emailVerificationControl_but_verify_code:focus,
#emailVerificationControl_but_send_new_code:focus, #emailVerificationControl_but_change_claims:focus {
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
}

#next:hover::before, #continue:hover::before, #cancel:hover::before, #emailVerificationControl_but_send_code:hover::before, #emailVerificationControl_but_verify_code:hover::before,
#emailVerificationControl_but_send_new_code:hover::before, #emailVerificationControl_but_change_claims:hover::before {
    opacity: 0.08;
}

#next:focus::before, #continue:focus::before, #cancel:focus::before, #emailVerificationControl_but_send_code:focus::before, #emailVerificationControl_but_verify_code:focus::before,
#emailVerificationControl_but_send_new_code:focus::before, #emailVerificationControl_but_change_claims:focus::before {
    opacity: 0.24;
}

#next:hover:focus::before, #continue:hover:focus::before, #cancel:hover:focus::before, #emailVerificationControl_but_send_code:hover:focus::before,
#emailVerificationControl_but_verify_code:hover:focus::before,
#emailVerificationControl_but_send_new_code:hover:focus::before, #emailVerificationControl_but_change_claims:hover:focus::before {
    opacity: 0.3;
}

/* Active */
#next:active, #continue:active, #cancel:active, #emailVerificationControl_but_send_code:active, #emailVerificationControl_but_verify_code:active,
#emailVerificationControl_but_send_new_code:active, #emailVerificationControl_but_change_claims:active {
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
}

#next:active::after, #continue:active::after, #cancel:active::after, #emailVerificationControl_but_send_code:active::after,
#emailVerificationControl_but_verify_code:active::after,
#emailVerificationControl_but_send_new_code:active::after, #emailVerificationControl_but_change_claims:active::after {
    opacity: 0.32;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0s;
}

/* Disabled */
#next:disabled, #continue:disabled, #cancel:disabled, #emailVerificationControl_but_send_code:disabled, #emailVerificationControl_but_verify_code:disabled,
#emailVerificationControl_but_send_new_code:disabled, #emailVerificationControl_but_change_claims:disabled {
    color: #ffffff;
    background-color: #949393 !important;
    box-shadow: none;
    cursor: initial;
}

#next:disabled::before, #continue:disabled::before, #cancel:disabled::before, #emailVerificationControl_but_send_code:disabled::before,
#emailVerificationControl_but_verify_code:disabled::before,
#emailVerificationControl_but_send_new_code:disabled::before, #emailVerificationControl_but_change_claims:disabled::before  {
    opacity: 0;
}

#next:disabled::after, #continue:disabled::after, #cancel:disabled::after, #emailVerificationControl_but_send_code:disabled::after,
#emailVerificationControl_but_verify_code:disabled::after,
#emailVerificationControl_but_send_new_code:disabled::after, #emailVerificationControl_but_change_claims:disabled::after {
    opacity: 0;}

    .main{
      height: 100dvh;
    }

    .mdl-layout{
      height: 100dvh;
    }


    @media (min-width: 480px) and (max-width: 839px) {
      .mdl-cell--6-col, .mdl-cell--6-col-tablet.mdl-cell--6-col-tablet {
          width: calc(100% - 16px);
      }
  }

  @media  (max-width: 839px) {
    footer nav{
      text-align: center;
      margin-top: 7px;
    }
  }