body {
    background-color: rgb(1, 59, 78);
    background-image: url('/img/bg.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100vw auto;

    height: 100vh;
    width: 100vw;
    position: absolute;
    padding: 0;
    margin: 0;
  }

  #mfa-code {

    width: 90%;
    height: 50px;
    margin: 5%;

  }
  #m365login{
    position: absolute;
    cursor: pointer;
    right:15px;
    top:15px;
    height:50px;
    width:50px;
  }
  #language ul {
    display: block;
    padding: 0;
    width: 160px;
    height: 50px;
    margin: auto;
    list-style: none;

  }

  #language ul li {

    width: 50px;
    list-style: none;
    height: 50px;
    text-align: center;
    padding: 10px 0;
    margin: auto;
    line-height: 50px;
    color: transparent;
    position: relative;
    display: inline-block;
  }

  #language ul li a {
    display: block;
    height: inherit;
    padding: 0;
    margin: 0;
    background-size: 30px auto;
    color: transparent;
    text-decoration: none;
    opacity: .5;
    width: 50px;
    background-position: center center;
    background-repeat: no-repeat;
  }

  #language ul li a.active {
    opacity: 1;
  }

  a#l-de {
    background-image: url('../img/icons/de.png');
  }

  a#l-it {
    background-image: url('../img/icons/it.png');
  }

  a#l-en {
    background-image: url('../img/icons/en.png');
  }


  #mfa-container,
  #mfa-image {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 10000;
    top: 0;
    left: 0;
  }

  #mfa-container span,
  #mfa-image span {
    width: 100%;
    display: block;
    text-align: center;
    color: #003a4f;
    margin-top: 25px;
  }

  #mfa-container span#g-mfa-image {
    height: 90px;
    display: block;
    width: 90px;
    margin: auto;
    background-image: url('data:image/jpeg;base64,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');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 90px auto;
  }

  #mfa-image img {
    margin: auto;
    display: block;
    height: 242px;
  }

  #mfa-container #mfa-button,
  #mfa-image #mfa-button {
    width: 200px;
    margin: auto;
    position: static;
    display: block;
    padding: 15px;
    margin-top:25px;
  }

  section#main {
    margin: 0;
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
  }

  #mfa-container input {

  width: 50px;
  height: 50px;
  margin: 5px;
  appearance: textfield;
  text-align: center;
  max-width:12.5%;
}
#mfa-container input:nth-child(1) {
margin-left:15px;
}

  section#header {
    background: linear-gradient(0deg, rgba(0, 212, 255, 0) 0%, rgba(2, 0, 36, 1) 100%);
    height: 95px;
    width: 100vw;
    position: fixed;
  }

  #logo {
    position: absolute;
    height: 70px;
    width: 150px;
    display: block;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    background-image: url('../img/pareus-resorts-logo-transparent.png');
    top: 25px;
    left: 50px;
  }

  section#footer {
    background: linear-gradient(180deg, rgba(0, 212, 255, 0) 0%, rgba(2, 0, 36, 1) 100%);

  }

  .form-container {
    border-radius: 8px;
    border: 1px solid #ccc;
    width: 95%;
    height: auto;
    display: inline-block;
    margin: 2.5%;
    padding: 2.5%;
    position: relative;
    background: #fff;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" fill="rgb(222, 226, 230)" viewBox="0 0 32 32"><path d="M 16 3 C 12.15625 3 9 6.15625 9 10 L 9 13 L 6 13 L 6 29 L 26 29 L 26 13 L 23 13 L 23 10 C 23 6.15625 19.84375 3 16 3 Z M 16 5 C 18.753906 5 21 7.246094 21 10 L 21 13 L 11 13 L 11 10 C 11 7.246094 13.246094 5 16 5 Z M 8 15 L 24 15 L 24 27 L 8 27 Z"/></svg>');
    background-size:30px auto;
    background-repeat: no-repeat;
    background-position: center 25px;


  }

  .form-inline label {
    padding: 15px 30px;

    text-transform: uppercase;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

  }
  #usn label,
  #pw label,
  .form-inline input[name="username"]{
    background-repeat:no-repeat;
    background-size:25px auto;

  }
  #usn label,
  #pw label{
    background-position: left center;
  }

  #usn label{
    background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M 16 5 C 12.144531 5 9 8.144531 9 12 C 9 14.410156 10.230469 16.550781 12.09375 17.8125 C 8.527344 19.34375 6 22.882813 6 27 L 8 27 C 8 22.570313 11.570313 19 16 19 C 20.429688 19 24 22.570313 24 27 L 26 27 C 26 22.882813 23.472656 19.34375 19.90625 17.8125 C 21.769531 16.550781 23 14.410156 23 12 C 23 8.144531 19.855469 5 16 5 Z M 16 7 C 18.773438 7 21 9.226563 21 12 C 21 14.773438 18.773438 17 16 17 C 13.226563 17 11 14.773438 11 12 C 11 9.226563 13.226563 7 16 7 Z"/></svg>');
  }

  #pw label{
    background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M 20 3 C 15.054688 3 11 7.054688 11 12 C 11 12.519531 11.085938 12.976563 11.15625 13.4375 L 3.28125 21.28125 L 3 21.59375 L 3 29 L 10 29 L 10 26 L 13 26 L 13 23 L 16 23 L 16 20.03125 C 17.179688 20.609375 18.554688 21 20 21 C 24.945313 21 29 16.945313 29 12 C 29 7.054688 24.945313 3 20 3 Z M 20 5 C 23.855469 5 27 8.144531 27 12 C 27 15.855469 23.855469 19 20 19 C 18.789063 19 17.542969 18.644531 16.59375 18.125 L 16.34375 18 L 14 18 L 14 21 L 11 21 L 11 24 L 8 24 L 8 27 L 5 27 L 5 22.4375 L 12.90625 14.5 L 13.28125 14.15625 L 13.1875 13.625 C 13.085938 13.023438 13 12.488281 13 12 C 13 8.144531 16.144531 5 20 5 Z M 22 8 C 20.894531 8 20 8.894531 20 10 C 20 11.105469 20.894531 12 22 12 C 23.105469 12 24 11.105469 24 10 C 24 8.894531 23.105469 8 22 8 Z"/></svg>');
  }
  .form-inline input[name="username"]{
    background-image:url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" fill="rgb(222, 226, 230)" viewBox="0 0 32 32"><path d="M 16 5 C 12.144531 5 9 8.144531 9 12 C 9 14.410156 10.230469 16.550781 12.09375 17.8125 C 8.527344 19.34375 6 22.882813 6 27 L 8 27 C 8 22.570313 11.570313 19 16 19 C 20.429688 19 24 22.570313 24 27 L 26 27 C 26 22.882813 23.472656 19.34375 19.90625 17.8125 C 21.769531 16.550781 23 14.410156 23 12 C 23 8.144531 19.855469 5 16 5 Z M 16 7 C 18.773438 7 21 9.226563 21 12 C 21 14.773438 18.773438 17 16 17 C 13.226563 17 11 14.773438 11 12 C 11 9.226563 13.226563 7 16 7 Z"/></svg>');
    background-position:328px center;
  }

  #FormContainer {
    width: 400px;
    height: auto;
    left: 50%;
    margin-left: -200px;
    top: 50%;
    border-radius: 8px;
    position: absolute;
    opacity: 0;
    transition-property: opacity;
    transition-duration: .5s;
  }
#loginForm{
  margin-top:50px;
}
  #FormContainer.visible {
    opacity: 1;
  }

  #submitButton {
    padding: 25px 50px;
    line-height: 1;
    margin: 0;
  }

  .form-group {
    margin-top: 25px;


  }

  #back {
    position: absolute;
    height: 30px;
    width: 30px;
    color: white;
    font-weight: bold;
    text-align: center;
    line-height: 30px;
    border-radius: 50%;
    text-align: center;
    background: #0d6efd;
    right: 15px;
    top: 15px;
    cursor: pointer;
  }

  #footer {
    position: fixed;
    width: 100%;
    bottom: 0px;
    left: 0px;
    height: 50px;
    background: #fff;


  }

  #hint {
    text-align: center;
    color: #003a4f;
    margin: 2.5%;
    margin-top: 50px;
    width: 95%;
  }

  #footer #copyright,
  #footer #links a,
  #footer #links span {
    color: #fff;
    text-decoration: none;
    display: block;
    line-height: 50px;
  }

  #footer #copyright {
    position: absolute;
    left: 50px;
    height: 70px;
    line-height: 70px;
  }

  #footer #links {
    position: absolute;
    width: 300px;
    left: 50%;
    margin-left: -150px;
    height: 70px;
    line-height: 70px;
    bottom: 0;
    overflow: visible;
  }

  #footer #links a,
  #footer #links span {
    float: left;
    padding: 0 2.5%;
    text-align: center;
    margin: 0;
    height: inherit;
    width: 42.5%;
    position: relative;
    display: inline-blocK;
    white-space: nowrap;
    overflow:hidden;
    line-height: 70px;
  }

  #footer #links span {
    width: 10%;
  }

  .full-width-btn {
    width: 100%;
  }

  #loading {

    position: fixed;
    z-index: 999999;
    background-color: #003a4f;
    background-image: url('/img/pareus-resorts-logo-transparent.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 150px auto;
    height: 100vh;
    width: 100vw;
  }

  .input-error {
    color: red;
    border-color: red;
  }
  .login-error{
    color:red;
  }

.login-error {
	color: red;
	position: absolute;
	height: 100%;
	width: inherit;
	background: rgba(255,255,255,0.7);
	top: 0;
}
.login-error p{
  padding:5%;
  margin:auto;
  width: 90%;
  margin-top:150px;
  color: red;
  text-align: center;
  background: rgba(255,255,255,0.7);
}

.login-error a.closePrompt {
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #003a4f;
  text-align: center;
  text-decoration: none;
  color: #fff;
  line-height: 50px;
  text-transform: uppercase;
  padding: 0;
  margin: 15px;
  float: left;

}

.login-error a.closePrompt {

  top: 5px;
  position:absolute;
  right: 5px;
  z-index: 1005;
}

  @media screen and (max-width:1350px) {
    body {
      background-size: auto 100vh;
    }

  }
  @media screen and (max-width: 500px) {
    #footer #copyright {
      display: none;
          }
  }

  @media screen and (max-width: 400px) {

    #FormContainer {
      width: 95vw;
      left: 2.5vw;
      margin-left: 0vw;
    }

    #logo,
    #footer #copyright {
      left: 2.5vw;
      font-size: 8px;
    }

    #footer #copyright {
      height: 8px;
      top: unset;
      bottom: 20px;
      left: 50%;
      margin-left: -55px;
    }
  }

  .lds-spinner {
    color: official;
    display: inline-block;
    position: absolute;
    width: 80px;
    height: 80px;
    left: 50vw;
    margin-left: -40px;
    top: 50vh;
    margin-top: 40px;
    transform: scale(0.5);
  }

  .lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
  }

  .lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: #fff;
  }

  .lds-spinner div:nth-child(1) {
    transform: rotate(0deg);
    animation-delay: -1.1s;
  }

  .lds-spinner div:nth-child(2) {
    transform: rotate(30deg);
    animation-delay: -1s;
  }

  .lds-spinner div:nth-child(3) {
    transform: rotate(60deg);
    animation-delay: -0.9s;
  }

  .lds-spinner div:nth-child(4) {
    transform: rotate(90deg);
    animation-delay: -0.8s;
  }

  .lds-spinner div:nth-child(5) {
    transform: rotate(120deg);
    animation-delay: -0.7s;
  }

  .lds-spinner div:nth-child(6) {
    transform: rotate(150deg);
    animation-delay: -0.6s;
  }

  .lds-spinner div:nth-child(7) {
    transform: rotate(180deg);
    animation-delay: -0.5s;
  }

  .lds-spinner div:nth-child(8) {
    transform: rotate(210deg);
    animation-delay: -0.4s;
  }

  .lds-spinner div:nth-child(9) {
    transform: rotate(240deg);
    animation-delay: -0.3s;
  }

  .lds-spinner div:nth-child(10) {
    transform: rotate(270deg);
    animation-delay: -0.2s;
  }

  .lds-spinner div:nth-child(11) {
    transform: rotate(300deg);
    animation-delay: -0.1s;
  }

  .lds-spinner div:nth-child(12) {
    transform: rotate(330deg);
    animation-delay: 0s;
  }

  @keyframes lds-spinner {
    0% {
      opacity: 1;
    }

    100% {
      opacity: 0;
    }
  }

  #for-cr {
    height: 66px;
    width: 50%;
    position: relative;

  }

  #for-cr a {
    line-height: 66px;
    display: block;
    height: 66px;
    padding: 0;
    position: relative;
    width: 100%;
  }

  #sh-pw {
    position: absolute;
    height: 36px;
    width: 36px;
    margin: -36px;
    cursor: pointer;
    right: 50px;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" fill="rgb(222, 226, 230)" viewBox="0 0 32 32"><path d="M 16 8 C 7.664063 8 1.25 15.34375 1.25 15.34375 L 0.65625 16 L 1.25 16.65625 C 1.25 16.65625 7.097656 23.324219 14.875 23.9375 C 15.246094 23.984375 15.617188 24 16 24 C 16.382813 24 16.753906 23.984375 17.125 23.9375 C 24.902344 23.324219 30.75 16.65625 30.75 16.65625 L 31.34375 16 L 30.75 15.34375 C 30.75 15.34375 24.335938 8 16 8 Z M 16 10 C 18.203125 10 20.234375 10.601563 22 11.40625 C 22.636719 12.460938 23 13.675781 23 15 C 23 18.613281 20.289063 21.582031 16.78125 21.96875 C 16.761719 21.972656 16.738281 21.964844 16.71875 21.96875 C 16.480469 21.980469 16.242188 22 16 22 C 15.734375 22 15.476563 21.984375 15.21875 21.96875 C 11.710938 21.582031 9 18.613281 9 15 C 9 13.695313 9.351563 12.480469 9.96875 11.4375 L 9.9375 11.4375 C 11.71875 10.617188 13.773438 10 16 10 Z M 16 12 C 14.34375 12 13 13.34375 13 15 C 13 16.65625 14.34375 18 16 18 C 17.65625 18 19 16.65625 19 15 C 19 13.34375 17.65625 12 16 12 Z M 7.25 12.9375 C 7.09375 13.609375 7 14.285156 7 15 C 7 16.753906 7.5 18.394531 8.375 19.78125 C 5.855469 18.324219 4.105469 16.585938 3.53125 16 C 4.011719 15.507813 5.351563 14.203125 7.25 12.9375 Z M 24.75 12.9375 C 26.648438 14.203125 27.988281 15.507813 28.46875 16 C 27.894531 16.585938 26.144531 18.324219 23.625 19.78125 C 24.5 18.394531 25 16.753906 25 15 C 25 14.285156 24.90625 13.601563 24.75 12.9375 Z"/></svg>');
    background-size: 25px 25px;
    background-position: center center;
    background-repeat: no-repeat;
  }

  

  input[type="password"] {
    background: #fff;
  }

  ::placeholder {
    /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #ccc;
    opacity: 1;
    /* Firefox */
  }

  :-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #ccc;
  }

  ::-ms-input-placeholder {
    /* Microsoft Edge */
    color: #ccc;
  }


  @media screen and (min-width:1350px) and (orientation:landscape) {
    body {

      background-size: 100vw auto;

    }
  }
  @media screen and (min-width:1350px) and (min-height:900px) {
    body {

      background-size: auto 100vh;

    }
  }
  @media screen and (min-width:1700px) and (min-height:1350px) {
    body {

      background-size: 100vw auto;

    }
  }
  @media screen and (min-width:1800px) {
    body {

      background-size: 100vw auto;

    }
  }

