#messages li { padding: 5px 10px; }
   #messages li:nth-child(odd) { background: #eee; }

/*
   #ChatArea {
      margin: 0 auto;
      padding: 10px;
      background: #2f2f2f;
      color: white;
   }
*/

   .chatHeading {
      padding: 10px;
   }

   .chatName {
      float: left;
   }

   .chatTime {
      padding-left: 10px;
      padding-right: 10px;
      font-size: 13px;
      line-height: 19px;
      float: left;
      color: #4A4A4A;
   }

   .chat .text {
      padding: 10px;
      background: #232931;
      border-radius: 10px;
      color: #F3F3F3;
   }

   .flex {
      display: flex;
   }

   .fi {
      flex: 1;
   }

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

   .clears, .clears:before, .clears:after {
      clear: both;
   }

/*
   .chatName {
      color: #6D80E4;
   }
*/

/*
   @font-face {
      font-family: "xirod";
      src: url("/style/xirod.ttf");
   }
*/

   #ChatArea {
      width: 100%;
      max-width: 900px;
      margin: 0px auto;
      min-height: 200px;
      height: 100%;
   }

   #HeadingIcon {
      width: 100%;
      max-width: 900px;
      margin: 0 auto;
      text-align: right;
      margin-top: -20px;
      padding: 5px;
   }

   #HeadingIcon img {
      width: 50px;
   }

   .msgs {
      height: calc(100% - 100px);
      overflow: auto;
      margin-bottom: 10px;
   }

   input, button {
      padding: 0 10px;
      margin: 0;
      width: 150px;
      font-size: 14px;
      background: #d8d8d8;
      border: none;
      box-sizing: border-box;
      font-size: 100%;
   }

   button {
      cursor: pointer;
   }

   .pointer {
      cursor: pointer;
   }

   .maxWidth {
      width: 100%;
   }
   .maxHeight {
      height: 100%;
   }
   .max {
      width: 100%;
      height: 100%;
   }
   .hide {
      display: none;
   }

   .error {
      color: #cc4361;
      font-weight: bold;
   }

   .blue {
      background: #326abf;
      color: #232323;
   }

   #SendChat, #VerifyName {
      height: 40px;
   }

   button {
      background: #326abf;
      color: #232323;
   }

   button:hover {
      background: #234c8a;
   }

   .chatYellow {
      padding: 7px;
      background: #eae998;
      border-radius: 3px;
      color: #383838;
      margin-top: 10px;
   }

   .color-1 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #1F3EE3; }
   .color-2 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #126210; }
   .color-3 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #1FD5E3; }
   .color-4 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #E31F3B; }
   .color-5 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #9537ED; }
   .color-6 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #EDE437; }
   .color-7 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #969696; }
   .color-8 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #3f3f3f; }
   .color-9 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #6D80E4; }
   .color-0 { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #000000; }
   .color-a { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #50e64c; }
   .color-b { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #21ffe0; }
   .color-c { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #ff2525; }
   .color-d { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #f06ce0; }
   .color-e { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff871; }
   .color-f { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #ffffff; }
   .color-m { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff; }
   .color-n { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff; }
   .color-l { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff; }
   .color-k { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff; }
   .color-o { font-weight: bold; text-shadow: #000 0px 0px 1px; color: #fff; }

   * { margin: 0; padding: 0; box-sizing: border-box; }
   html {
      background: #3c7fde;
      height:100%;
      font-size: 1em;
   }
   body {
      font: 15px 'Montserrat', Helvetica, Arial;
      height:100%;
   }

   @font-face {
      font-family: Xirod;
      src: url("/style/xirod.ttf");
   }

   /*
   header {
      font-family: Xirod;
      font-size: 500%;
      color: #fff;
      line-height: .9em;
    text-align: center;
   }
   */

   .flex {
      display: flex;
   }

   .col {
      flex-direction: column;
   }

   .fi {
      flex: 1;
   }

   .max {
      height: 100%;
      width: 100%;
   }

   .ip {
      color: #ccc;
      font-size: .5em;
      font-family: "Courier New", Courier, monospace;
   }

   .leftTriangle {
      width: 50%;
      height: 100%;
      background-color: #232931;
      background-size: cover;
      -webkit-clip-path: polygon(0% 100%, 100% 100%, 0% 0%);
      clip-path: polygon(0% 100%, 100% 100%, 0% 0%);
   }

   .rightTriangle {
      width: 50%;
      height: 100%;
      background-color: #232931;
      background-size: cover;
      -webkit-clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
      clip-path: polygon(100% 0%, 0% 100%, 100% 100%);
   }

   .triBox {
      height: 2000px;
      position: absolute;
      bottom: 0;
      width: 10000px;
   }

   .bigLogo {
      height: 125%;
      width: 100%;
      position: absolute;
      background: url('/imgs/ACElogo.svg') no-repeat 50% 35%;
      background-size: 75%;
      background-attachment: fixed;
      overflow: hidden;
   }

   .logo {
      height: 100px;
      width: 100px;
      position: absolute;
      background: url('/imgs/ACElogo.svg') no-repeat 50% 35%;
      background-size: 75%;
      background-attachment: fixed;
      overflow: hidden;
   }

   .topV {
      height: 50px;
      width: 100%;
      background: url('/imgs/v.svg') no-repeat center calc(100% -  -1px);
      position: relative;
      overflow: hidden;
   }

   .bottomV {
      height: calc(100% - 170px);
      width: 100%;
      background: url('/imgs/uv.svg') no-repeat center top;
      position: absolute;
      overflow: hidden;
      background-color: #8cb2de;
      bottom: 0;
   }

   .info {
      margin: 0 auto;
      height: 100%;
   }

   .infoTitle {
      text-align: center;
   }

   .faqTitle {
      color: #3c7fde;
      font-size: 1.25em;
      padding-bottom: 10px;
   }

   .faqText {
      color: #eeeeee;
   }

   .faqDate {
      text-align:right;
      color: #e2f790;
   }

   .bold {
      font-weight: bold;
   }

   #scrollBtn {
      cursor: pointer;
   }

   #scrollBtn:hover:before {
      content: " ";
      background: rgba(150, 199, 255, 0.36);
      border-radius: 50px;
      width: 48px;
      height: 48px;
      position: absolute;
      pointer-events: none;
      top: 1px;
      left: 1px;
   }

   #scrollBtn:active:before {
      content: " ";
      background: rgba(255, 255, 255, .5);
      border-radius: 50px;
      width: 48px;
      height: 48px;
      position: absolute;
      pointer-events: none;
      top: 1px;
      left: 1px;
   }

   #SmallLogo, .preTextBlock, .bottomV, .topV, #Nav, #Content {
      transition-property: height max-height margin margin-top;
      transition-duration: .5s;
      transition-delay: 0s;
      transition-timing-function: linear;
   }

   #Nav {
      height: auto;
      max-height: 0px;
      width: 100%;
      background: #393e46;
      z-index: 100;
      position: relative;
      overflow: hidden;
   }

   .preTextBlock {
      z-index: 10;
      position: relative;
      margin-top: 50px;
      height: calc(100% - 60px);
   }

   .textBlock {
      background: #393e46;
      margin: 0 auto;
      padding: 20px 20px;
   }

   .marTop {
      margin-top: 25px;
   }

   .small {
      font-size: .75em;
   }

   .inherit {
      background: inherit;
      color: inherit;
      width: inherit;
      border: inherit;
      font-weight: inherit;
      font-size: inherit;
      font: inherit;
      text-align: center;
   }

   #AusImg {
      display: none;
      height: 100%;
   }

   #PluginButtons {
      flex-wrap: wrap;
   }
   #PluginInfo {
      padding: 20px 10px;
   }
   .pluginButton {
      padding: 10px;
      margin: 5px 10px;
      text-align: center;
      cursor: pointer;
   }
   .green {
      background: #4ecca3;
      color: #232931;
   }

   .blue {
      background: #3c7fde;
      color: #eeeeee;
   }

   .red {
      background: #e44848;
      color: #eee;
   }

   .sp {
      padding: 0 5px;
   }


   .preTextBlock {
      z-index: 10;
      position: relative;
      margin-top: 50px;
   }

   .textBlock {
      background: #393e46;
      margin: 0 auto;
      padding: 20px 20px;
   }

   .small {
      font-size: .75em;
   }

   .inherit {
      background: inherit;
      color: inherit;
      width: inherit;
      border: inherit;
      font-weight: inherit;
      font-size: inherit;
      font: inherit;
      text-align: center;
   }

   .preTextBlock {
      margin-top: 25px;
      height: calc(100% - 50px);
   }

   @media screen and (min-width: 400px) {
      .bigLogo {
         background-size: 45%;
      }
   }

   @media screen and (min-width: 800px) {
      .bigLogo {
         background-size: 45%;
      }

      #AusImg {
         display: initial;
      }

      .ausImgFi {
         display: none;
      }

      .info {
         width: 700px;
      }

      .infoTitle {
         text-align: left;
      }

      .textBlock {
         max-width: 900px;
         background: #393e46;
         margin: 0 auto;
         padding: 20px 50px;
      }
   }

   @media screen and (min-width: 1000px) {
      .bigLogo {
         background-size: 35%;
      }
   }

   @media screen and (min-width: 1500px) {
      .bigLogo {
         background-size: 25%;
      }
   }

   .marTop {
      margin-top: 25px;
   }


@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(/fonts/JTUSjIg1_i6t8kCHKm459WRhyyTh89ZNpQ.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(/fonts/JTUSjIg1_i6t8kCHKm459W1hyyTh89ZNpQ.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* vietnamese */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(/fonts/JTUSjIg1_i6t8kCHKm459WZhyyTh89ZNpQ.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(/fonts/JTUSjIg1_i6t8kCHKm459WdhyyTh89ZNpQ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Montserrat Regular'), local('Montserrat-Regular'), url(/fonts/JTUSjIg1_i6t8kCHKm459WlhyyTh89Y.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}



.activeBlock span {
    background: #00000073;
}

.blockHeading {
   color: #002d80;
   padding-bottom: 0;
   text-shadow: none;
}

.blue {
   background: #3976cd;
}

.grey {
   background: #c5c5c5;
   color: #1d1d1d;
}

.yellowish {
   background: #d8ddb9;
   color: #1d1d1d;
}

.popup {
   position: fixed;
   background: rgba(0, 0, 0, 0.3);
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   z-index: 100;
}

.innerPopup
{
   position: fixed;
   background: #393e46;
   padding-bottom: 5px;
   z-index: 110;
   box-shadow: #000 0px 0px 3px 1px;
   color: #ccc;
}

.popupText {
   padding: 10px;
}

code {
   background: #ccc;
   color: #333;
   padding: 2px 5px;
   border-radius: 2px;
}