:root {
  --color: #eceff1;
  --color2: #f3f3f3;
  --color3: #f5f5f5;
  --color4: #37474f;
  --color5: #4774a7;
  --border: #b0bec5;
}

*,*:before,*:after{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;}
body{background:var(--color);color:var(--color4);font-size:16px;font-family:-apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";line-height:1.3em;position:relative;}
body.no-scroll{overflow:hidden;}
a,a:link,a:visited{color:var(--color5);text-decoration:none;}
a.newtab:after{content:'\02197';position:relative;top:-5px;display:inline-block;margin-left:5px;font-size:10px;line-height:1;text-align:center;width:12px;height:12px;background-color:var(--border);color:var(--color3);border-radius:2px;}
ol,ul{list-style:none;}
h1{font-size:150%;}
h2{font-size:120%;}
input[type=text],input[type=number],input[type=search],textarea,select{padding:7px 10px;background:#fbfbfb;outline:none;border-radius:2px;border:1px solid var(--border);}
input[type=number].no_arrow::-webkit-outer-spin-button,input[type=number].no_arrow::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input[type=number].no_arrow{-moz-appearance:textfield;}
.bg3 input[type=text],.bg3 input[type=number],.bg3 input[type=search],.bg3 textarea,.bg3 select{background-color:var(--color);color:var(--color4);}
input[readonly],.bg3 input[readonly]{background:rgba(176,190,197,.5);cursor:default;}
.bg3 input[readonly]{background-color:var(--border);}
textarea{overflow:auto;resize:vertical;}
select{padding-right:25px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,gray 50%),linear-gradient(135deg,gray 50%,transparent 50%);background-position:calc(100% - 13px) calc(.8em + 2px),calc(100% - 8px) calc(.8em + 2px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;} /* https://codepen.io/vkjgr/pen/VYMeXp */
svg{fill:currentColor;}
hr{border-color:var(--border);}

table{border-collapse:collapse;}
table tr th,table tr td{padding:.25em .5em;background:var(--color);border:1px solid var(--border);}

/* Flexbox */
.flex{display:-webkit-flex;display:flex;}
.flex_wrap{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.f_perfect{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.7);}/* Perfect Centering: parent */
.f_perfect .fp_content{margin:auto;}/* Perfect Centering: content */
.f_column{flex-direction:column;}
.f_top{-webkit-align-items:flex-start;align-items:flex-start;-webkit-align-content:flex-start;align-content:flex-start;}
.f_middle{-webkit-align-items:center;align-items:center;-webkit-align-content:center;align-content:center;}
.f_bottom{-webkit-align-items:flex-end;align-items:flex-end;-webkit-align-content:flex-end;align-content:flex-end;}
.f_center{-webkit-justify-content:center;justify-content:center;}
.f_left{-webkit-justify-content:flex-start;justify-content:flex-start;}
.f_right{-webkit-justify-content:flex-end;justify-content:flex-end;}
.f_grow{-webkit-flex-grow:1;flex-grow:1;}
.f_grow.f_clamp{max-height:1.3em;overflow:hidden;width:min-content;margin-right:10px;}
.f_between{-webkit-justify-content:space-between;justify-content:space-between;}

.t_perfect{display:table;margin:auto;}
.t_perfect .tp_content{display:table-cell;vertical-align:middle;}
.t_center{text-align:center;}
.t_left{text-align:left;}
.t_right{text-align:right;}
.t_justify{text-align:justify;}

/* CSS Control */
.bg2{background:var(--color2);border:1px solid var(--border);}
.bg3{background:var(--color5);color:var(--color3);}
.btn{padding:6px 10px;cursor:pointer;background:var(--color5);color:var(--color3);font-size:100%;font-family:Arial;border:1px solid var(--color5);border-radius:2px;}
.btn-icon{padding:3px 5px;}
.btn:hover,.btn.selected{background-color:#3b5998;}
.btn[type=submit]{text-transform:uppercase;}
/* .mobile .btn:not(.red):not(.green):not(.no_hover):hover{background-color:var(--color5);} */
.btn.red,.btn.red:hover,.red{background-color:#dd584f;color:var(--color3);border-color:#dd584f;}
.btn.green,.btn.green:hover,.green{background-color:#238636;color:var(--color3);border-color:#238636;}
.bg3 .btn.green,.bg3 .btn.green:hover,.bg3 .green{border-color:var(--border);}
.btn.bgrey,.btn.bgrey:hover,.bgrey{background-color:#cfd8dc;color:#37474f;border-color:#b0bec5;}
button.btn{font-size:90%;}
a.btn{color:var(--color3);}
.max{max-width:1100px;margin:0 auto;}
.full,.w100{width:100%;}
.w70{width:70%;}
.w50{width:50%;}
.w30{width:30%;}
.full_page{width:100% !important;}
.full_img{background:var(--color3)/* url(./images/loading-message-blue.svg) center/40% 40% no-repeat*/;width:100%;height:100%;display:block;padding:2px;border:1px solid var(--border);}
.layer{padding:15px;}
.layer_x{padding:0 15px;}
.layer_y{padding:15px 0;}
.post_layer{padding:15px 0;}
.radius{overflow:hidden;-webkit-border-radius:5px;border-radius:5px;}
.block{display:block;}
.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} /* if no "space", add "&#160;&#173;" or "&#12644;" */
.clamp.lc1{-webkit-line-clamp:1}
.wrap{inline-size:max-content;word-break:break-all;}
.nowrap{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.line{height:2px;border-top:1px solid #d9dde0;border-bottom:1px solid #f9fbfa;}
.new_line{height:12px;}
.pulse{animation:pulse 1s ease infinite alternate;outline:1px solid var(--color);}
.highlighted{background:rgba(0,123,255,.25);}
.cs_pointer{cursor:pointer;}
.cs_default{cursor:default;}
.no_scroll{overflow:hidden;}
.no_select{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}

.loading:before,.no-image:before{content:'';position:absolute;top:0;bottom:0;right:0;left:0;text-indent:-9999px;}
.loading.lody{position:absolute;width:100%;height:100%;overflow:hidden;}
.loading.lody:before{background:var(--color2) url(./images/loading-typing.svg) center/150px no-repeat;z-index:9998;position:fixed;}
.loading.loge{position:relative;}
.loading.loge:before{background:rgba(243,243,243,.7) url(./images/loading-message-blue.svg) center/40% 40% no-repeat;}
.loading.loge:not(img):before{background-color:rgba(176,190,197,.7);}
.loading.loge.nd:before{background-size:100% 100%;}

.no-image{font-size:80%;line-height:100%;}
.no-image:before{background-color:var(--color3);}
.no-image:after{content:'no-image';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}

.la2yloading:before{background-image:none !important;}
.la2yloading:after{content:'Loading...';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.lazyload3d{opacity:0;}
.lazyload3d.lazyshow{opacity:1;transition:opacity .5s ease;}
.lazyload3d.no-image{display:inline-block;margin-bottom:2px;}

.hd-title{font-size:85%;font-weight:bold;}

[disabled],.disabled{pointer-events:none;cursor:not-allowed !important;-webkit-user-select:none;user-select:none;}
.btn[disabled],.btn[disabled]:hover,.btn.disabled,.btn.disabled:hover,input[disabled],input[disabled]:hover,input.disabled,input.disabled:hover{background:var(--border) !important;color:var(--color) !important;border-color:var(--border) !important;}
.bg3 input[disabled],.bg3 input[disabled]:hover,.bg3 input.disabled,.bg3 input.disabled:hover{background:#8fa1ab !important;color:var(--color) !important;border-color:#8fa1ab !important;}

.no_items{display:none;}
.hidden_items{visibility:hidden;opacity:0;margin:0;padding:0;max-height:0;max-width:0;overflow:hidden;text-indent:-9999px;}

/* noscript */
.no-js{position:absolute;top:0;background:var(--color5);color:var(--color3);padding:5px 20px;width:100%;z-index:9999;}
.no-js a{color:#fbeab5;font-weight:700;}

/* Main */
.main{margin:15px auto;margin-top:30px;position:relative;}
.main .source{position:absolute;top:0;right:0;line-height:0;padding-right:15px;}
.main .source[target="_blank"]::after{content:'\2197';}
.table-container{overflow-x:auto;}
.footer{margin-bottom:20px;}
/* .footer a{color:var(--color4);} */
.footer .message{margin:0 0 20px;}

/* Form Group */
.form-group{margin-bottom:15px;}
.form-group.fg-left{margin-right:25px;}
.form-group .label {font-weight:bold;display:inline-block;}
.form-group .label.lbl-top{margin-bottom:10px;}
.form-group .label.lbl-left{margin-right:5px;}

/* Post Wrapper */
.post-wrapper {margin-top: 15px;}
.post-wrapper .post-header{margin:0 0 30px;}

/* Results */
.result{padding-top:25px;margin-top:15px;border-top: 1px solid var(--border);}

@keyframes pulse {
  0%{box-shadow:0 0 0 0px #dc3545;}
  100%{box-shadow:0 0 0 5px #dc3545;}
}

/* #===========================================================================================#  */

/* Dark Mode */
@media (prefers-color-scheme: dark) {
  body {
    --color: #222;
    --color2: #2a2a2a;
    --color4: #bbb;
    --color6: #333;
    --border: #444;
  }

  /* Scrollbar */
  ::-webkit-scrollbar{width:15px;}
  ::-webkit-scrollbar-track{background:#111;}
  .bg2 ::-webkit-scrollbar-track{background:#1f1f1f;}
  ::-webkit-scrollbar-thumb{background:#333;}

  input[type=text],input[type=number],input[type=search],textarea,select{background-color:#2d2d2d;color:var(--color4);}
  .bg2 input[type=text],.bg2 input[type=number],.bg2 input[type=search],.bg2 textarea,.bg2 select{background-color:var(--color);}
  .bg3 input[type=text],.bg3 input[type=number],.bg3 input[type=search],.bg3 textarea,.bg3 select{background-color:rgba(0,0,0,.5);color:var(--color3);border-color:/*rgba(0,0,0,.5)*/#233a53;}
  input[type=search]::-webkit-search-cancel-button{filter:invert(1);}

  input[readonly],.bg2 input[readonly]{background-color:var(--border);}
  .bg3 input[readonly]{background-color:rgba(255,255,255,.15);border-color:/*rgba(255,255,255,.15)*/#6289b4;}

  .bg3 .btn:not(.red):not(.green):not(.bgrey){background-color:#406896;border-color:#406896;}
  .btn:hover,.btn.selected{background-color:#395c84;}
  .btn.red:hover,.btn.red.selected{background-color:#dd584f;}
  .btn.green:hover,.btn.green.selected{background-color:#238636;}
  .btn.bgrey,.btn.bgrey:hover,.btn.bgrey.selected,.bgrey{background-color:var(--color6);color:var(--color4);border-color:var(--border);}
  .full_img{background-color:var(--color2);color:var(--color4);border-color:var(--border);}
  .line{border-top-color:#17151b;border-bottom-color:var(--color6);}
  .loading.loge:not(img):before{background-color:rgba(0,0,0,.7);}
  .no-image:before{background-color:var(--color2);}

  .btn[disabled],.btn[disabled]:hover,.btn.disabled,.btn.disabled:hover,input[disabled],input[disabled]:hover,input.disabled,input.disabled:hover{background-color:var(--color2) !important;color:var(--border)!important;border-color:var(--color2) !important;}
  .bg2 .btn[disabled],.bg2 .btn[disabled]:hover,.bg2 input[disabled],.bg2 input[disabled]:hover{background-color:var(--color) !important;border-color:var(--color) !important;}
  .bg3 .btn[disabled],.bg3 .btn[disabled]:hover,.bg3 input[disabled],.bg3 input[disabled]:hover{background-color:#395c84 !important;color:#6289b4 !important;border-color:#395c84 !important;}
}

/* #===========================================================================================#  */

/* Desktop */
@media screen and (min-width:481px) {
}

/* Mobile */
@media screen and (max-width:768px) {
  body{font-size:18px;line-height:1.5em;}
  h1{font-size:110%;}
  h2{font-size:100%;}
  /* .layer{padding:20px 25px;} */
  /* .layer_x{padding:0 25px;} */

  .main{padding:20px 25px;}
}

@media screen and (max-width:480px) {
}
