@font-face {
  font-family: "RoninWorks";
  src: url("/css/font/Poppins-Regular.ttf");
}
@font-face {
  font-family: "RoninWorks";
  src: url("/css/font/Poppins-SemiBold.ttf");
  font-weight: 1;
}
@font-face {
  font-family: "RoninWorks";
  src: url("/css/font/Poppins-Bold.ttf");
  font-weight: 2;
}
@font-face {
  font-family: "Number";
  src: url("/css/font/Roboto-Regular.ttf");
}

:root{
  --black_100: rgba(0, 0, 0, 1.00);
    --black_010: rgba(0, 0, 0, 0.10);
  --white_100: rgba(255, 255, 255, 1.00);
    --white_025: rgba(255, 255, 255, 0.25);
  --yellow_100: rgba(255, 204, 0, 1.00);
    --yellow_025: rgba(255, 204, 0, 0.25);

  --color_1_100: rgba(52, 70, 118, 1.00);
    --color_1_075: rgba(52, 70, 118, 0.75);
    --color_1_050: rgba(52, 70, 118, 0.50);
    --color_1_035: rgba(52, 70, 118, 0.35);
    --color_1_025: rgba(52, 70, 118, 0.25);
    --color_1_020: rgba(52, 70, 118, 0.20);
    --color_1_015: rgba(52, 70, 118, 0.15);
    --color_1_010: rgba(52, 70, 118, 0.10);
    --color_1_005: rgba(52, 70, 118, 0.05);
    --color_1_000: rgba(52, 70, 118, 0.00);

  --color_button_biru: rgba(8, 98, 150, 1.00);
    --color_button_biru_075: rgba(8, 98, 150, 0.75);
    --color_button_biru_050: rgba(8, 98, 150, 0.50);
    --color_button_biru_010: rgba(8, 98, 150, 0.25);
  --color_button_hijau: rgba(35, 184, 51, 1.00);
    --color_button_hijau_015: rgba(35, 184, 51, 0.15);
  --color_button_hijau_gelap: rgba(6, 112, 16, 1.00);
  --color_button_merah: rgba(245, 66, 66, 1.00);
  --color_button_abu: rgba(117, 117, 117, 1.00);
}

html{color:var(--color_1_100);background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
     box-sizing: border-box;
     scrollbar-width: thin;
     scrollbar-color: var(--color_1_050) var(--color_1_025);
}

body {font-family: 'RoninWorks', sans-serif; font-size: 14px; letter-spacing: 0.5px; line-height: 1.3; margin: 0px; min-width: 100%; min-height: 100vh;
      color: var(--color_1_100); background-color: var(--color_1_015);}/*-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;*/
a {color: var(--color_1_100); text-decoration: none;}
a:hover {color: var(--color_1_100); text-decoration: none; border-bottom: 1px dashed var(--color_1_100);}

form {border: 0px; padding: 0px; margin: 0px;}

input,
select,
textarea,
button {
    color: var(--color_1_100);
    background-color: var(--white_100);
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
    background-color: #ffffff;
}
*:focus {
    outline: none;
    background-color: #ffffff;
}
/* input:invalid {border: 1px solid #ff0000 !important;} */

input[type='number'] {
    -moz-appearance:textfield;
    text-align: left;
    outline-width: 0;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    text-align: right;
}

input::placeholder {color: var(--color_1_050);}
input:-ms-input-placeholder {color: var(--color_1_050);}
input::-ms-input-placeholder {color: var(--color_1_050);}

blink {
  animation: blinker 1s linear infinite;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}
.css_hide {display: none;}