:root {
  --core-colour: #0b575a;
  --core-colour-rgb: 11, 87, 90;
}

div.organisationLogo {
  background-image: url(../image/logo_acsaa.png);
}

body.pageLogin .pageDecoration1 {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 100px;
  background-color: var(--core-colour);
  z-index: -1;
}

body.pageLogin .pageDecoration2 {
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 100px;
  background-color: var(--core-colour);
  z-index: -1;
  box-shadow: 0px 0px 0px 5px #050708;  
}

body.pageLogin .pageDecoration3 {
  position: absolute;
  bottom: -70px;
  left: -100px;
  height: 300px;
  width: 300px;
  background-color: #d5624e;
  border-radius: 50%;
  z-index: -2;
  border: solid 26px #eaddd8;
  box-shadow: 0px 0px 0px 6px #050708;
}

body.pageLogin {
  padding-top: 100px;
  padding-bottom: 100px;
}

body.pageMemberLogin main {
  position: relative;
  z-index: 1;
}

body.pageMemberLogin main::before {
  content: '';
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  z-index: -1;
  background-image: url('/image/logo_acsaa_large_icon.png');
  background-size: contain;
  background-position: 70% center;
  background-repeat: no-repeat;
  opacity: 0.04;
}

@media screen and (max-height: 800px) {
  body.pageLogin {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  body.pageLogin main {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  body.pageLogin .pageDecoration1,
  body.pageLogin .pageDecoration2 {
    height: 50px;
  }

  body.pageLogin .pageDecoration3 {
    bottom: -140px;
  }

  body.pageLogin form#frmLogin table.fields {
    border-radius: 6px;
    background-color: rgba(255,255,255,0.8);
  }
}