html,body {
    height:100%;
    margin:0;
  }
  
  body {
    background-color:#000000;
    background-image:url(../img/bg.jpg);
    background-size:100%;
    background-position:top center;
    background-repeat:no-repeat;
    color:#aba6a6;
    line-height:1.5;
    font-size:11pt;
    font-family:'Roboto',sans-serif;
    font-weight:400;
    padding:0;
    margin:0;
  }
  
  img {
    display:block;
  }
  
  a {
    color:#ff0000;
    text-decoration:none;
  }
  
  a:hover {
    color:#f2f2f2;
  }
  
  a:active {
    color:#ff0000;
  }
  
  a:visited {
    color:#d60000;
  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin:0;
    color:#ff0000;
    line-height:1.25;
    font-family:'Roboto',sans-serif;
    margin-bottom:1%;
  }
  
  h2 {}
  
  h1 {
    font-size:32pt;
  }
  
  h2 {
    font-size:27pt;
  }
  
  h3 {
    font-size:22pt;
  }
  
  h4 {
    font-size:17pt;
  }
  
  h5 {
    font-size:12pt;
  }
  
  h6 {
    font-size:11pt;
  }
  
  br {
    content:" ";
    display:block;
    margin:10px 0;
    line-height:22px;
  }
  
  p {
    margin:0;
    padding:0;
  }
  
  ul,
  ol,
  li {
    list-style:none;
    margin:0;
    padding:0;
  }
  
  hr {
    margin:15px 0;
    border-color:#ddd;
  }
  
  * {
    box-sizing:border-box;
  }
  
  td {
    padding:5px 5px;
    line-height:1;
  }
  
  table {
    width:100%;
    text-align:center;
  }
  
  .flex {
    align-items:center;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
  }
  
  .header {
    margin-bottom:20px;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
  }
  
  .header-bottom {
    background:#121518;
    width:100%;
  }
  
  .header-top {
    padding:15px 15px;
    width:100%;
  }
  
  .header-top-right {
    width:70%;
  }
  
  .logo {
    width:30%;
  }
  
  .logo img {
    width:100%;
  }
  
  .head-right {
    width:65%;
  }
  
  .wrapper {
    width:1100px;
    margin:0 auto;
    min-height:100%;
    position:relative;
    padding-bottom:60px;
  }
  
  .scrolltext {
    color:#b5b5b5;
    font-size:14px;
    line-height:1;
  }
  
  marquee {
    width:100%;
  }
  
  a.livechat {
    width:15%;
    text-align:center;
    padding:5px 0;
    font-size:16pt;
    cursor:pointer;
  }
  
  .livechat:hover {
    background:#810000;
  }
  
  .content {
    margin-top:20px;
    padding:25px 30px;
    border-radius:15px;
  }
  
  .footer {
    margin-top:15px;
    border-top-left-radius:15px;
    border-top-right-radius:15px;
    text-align:center;
    padding:10px 0;
    position:absolute;
    width:100%;
    bottom:0;
  }
  
  .form-item {
    margin:0;
    font-size:16px;
    text-transform:uppercase;
    padding:0;
    border:none;
    line-height:2;
    vertical-align:middle;
    text-align:center;
  }
  
  div#CaptchaDiv {
    border-radius:5px;
    overflow:hidden;
    color:#1c1c1c;
  }
  
  #txtCode,
  #CaptchaDiv {
    background:#ddd;
    width:40%;
    text-align:center;
    color:#000000;
  }
  
  .username,
  .password {
    width:30%;
    background:#cfcfcf;
    color:#4e4e4e;
    box-shadow:#fff 0 0 10px inset;
  }
  
  .username,
  .password,
  .login,
  .daftar,
  #txtCode,
  #CaptchaDiv {
    border-radius:5px;
    margin-left:1%;
  }
  
  .login,
  .daftar {
    width:15%;
    color:#fff;
    font-weight:bold !important;
    cursor:pointer;
    font-size:14pt;
    line-height:1.75;
  }
  
  .daftar {
    color:#ff0000;
  }
  
  .daftar:hover,
  .login:hover {
    background:#000 !important;
  }
  
  i.fas.fa-user,
  i.fas.fa-lock,
  i.fas.fa-key {
    margin-left:15px;
  }
  
  textarea:focus,
  input:focus {
    outline:none;
  }
  
  .button,
  input[type=password],
  input[type=text] {
    padding:0;
    display:block;
    border:none;
    font-size:inherit;
    line-height:inherit;
    flex:1;
  }
  
  input[type=password],
  input[type=text] {
    width:100px;
    background:none;
    text-align:left;
    color:#4e4e4e;
  }
  
  ::placeholder {
    /* Chrome,Firefox,Opera,Safari 10.1+ */
  
    color:#4e4e4e;
  }
  
  form.flex.form {
    flex-wrap:nowrap;
    width:100%;
    margin-left:auto;
  }
  
  .button {
    text-transform:uppercase;
    background:none;
    color:inherit;
    font-weight:bold;
  }
  
  .fas {
    margin-right:5px;
  }
  
  /*color*/
  
  .color {
    background:#e80000;
    background:-moz-linear-gradient(top,#e80000 0%,#aa0000 100%);
    background:-webkit-linear-gradient(top,#e80000 0%,#aa0000 100%);
    background:linear-gradient(to bottom,#e80000 0%,#aa0000 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#e80000',endColorstr='#aa0000',GradientType=0 );
  }
  
  .color-2,
  .contact a {
    background:#1c1c1c;
    box-shadow:#282828 0 0 15px inset;
  }
  
  .color-3 {
    background:#ffffff;
    background:-moz-linear-gradient(top,#ffffff 0%,#cecece 100%);
    background:-webkit-linear-gradient(top,#ffffff 0%,#cecece 100%);
    background:linear-gradient(to bottom,#ffffff 0%,#cecece 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#cecece',GradientType=0 );
  }
  
  /*colour*/
  
  .nav-block {
    width:100%;
  }
  
  .nav {
    border:none;
  }
  
  .navbar a {
    font-size:20px;
    color:#ffffff;
    text-align:center;
    text-transform:uppercase;
    text-decoration:none;
    transition:0.3s;
    padding:5px 0;
    flex-grow:1;
  }
  
  .navbar a:hover,
  .active {
    color:#ff0000 !important;
    background:#333333;
    background:-moz-linear-gradient(top,#333333 0%,#000000 100%);
    background:-webkit-linear-gradient(top,#333333 0%,#000000 100%);
    background:linear-gradient(to bottom,#333333 0%,#000000 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333',endColorstr='#000000',GradientType=0 );
    box-shadow:#000 0 0 15px inset;
  }
  
  .toggle,
  label.lbl-toggle {
    display:none;
  }
  
  /*social*/
  
  .contact {
    position:relative;
    z-index:1;
  }
  
  .contact a {
    box-shadow:#000 0 0 15px;
    position:relative;
    padding:5px 0 5px 65px;
    margin:0;
    line-height:1.25;
    flex:1;
    font-size:17px;
    font-weight:400;
    color:#ff0000;
  }
  
  .contact a:hover {
    background:#c90000;
    color:#ffffff !important;
  }
  
  .contact i {
    font-size:40px;
    position:absolute;
    left:15px;
    top:50%;
    transform:translateY(-50%);
  }
  
  .contact h4 {
    color:#ebebeb;
    font-size:22px;
    font-weight:400;
    line-height:1.25;
  }
  
  .promo {
    margin-top:15px;
    border-radius:10px;
    overflow:hidden;
  }
  
  .slider-body {
    border-radius:15px;
    overflow:hidden;
  }
  
  .bottom {
    border-radius:10px;
    overflow:hidden;
    flex:1;
    text-align:center;
    margin-left:1%;
    position:relative;
    display:flex;
  }
  
  .bottom-block {
    margin-top:15px;
    align-items:inherit;
  }
  
  .bottom img {
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    z-index:0;
  }
  
  .bottom:first-child {
    text-align:left;
    margin:0;
  }
  
  .bottom h3 {
    background:linear-gradient(to bottom,#e80000 0%,#aa0000 100%);
    margin-top:auto;
    margin-bottom:0;
    width:100%;
    color:#cecece;
    padding:10px 0;
    font-size:18pt;
    text-transform:uppercase;
    z-index:1;
    box-shadow:#000 0 0 15px 5px;
  }
  