
<style>

    body {
        background-color    : #212124 ;
    }

    ::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }
    ::-webkit-scrollbar-thumb {
      background: hsl(0deg 0% 17%);
      _border: 2px outset #e6a1ab;
    }

    table {
        border-collapse     : collapse ;
        border-spacing      : 0 ;
        margin-bottom       : 15px ;
    }
    .title {
        margin              : 5px 5px 5px 5px ;
        padding             : 5px 5px 5px 5px ;
        color               : #9c9c9c ;
    }
    .error_message {
        margin              : 5px 5px 5px 5px ;
        padding             : 5px 5px 5px 5px ;
        color               : #aa0000 ;
    }
    .content {
       _margin              : 5px 5px 5px 5px ;
       _padding             : 5px 5px 5px 5px ;

       _border              : 1px solid #808080;
       _padding             : 20px 20px 10px 19px;
       _margin              : 10px 10px 0 30px;

        _border              : 1px solid #3a3a3a;
        border              : 1px solid #0b566e ;
        padding             : 20px 0px 10px 29px;
        margin              : 40px 10px 0 60px;
        width               : 649px;
        background-color    : #262626;
        color               : #9c9c9c;
        box-shadow          : 0px 0px 4px 4px rgb(0 0 0 / 20%);
        line-height         : 1.6em;
    }
    .content-trade {
        _border              : 1px solid #8c8100 ;
        _padding             : 20px 0px 10px 29px;
        margin              : 10px 0px 5px 10px;
        _width               : 649px;
        _background-color    : #262626;
        _color               : #9c9c9c;
        _box-shadow          : 0px 0px 4px 4px rgb(0 0 0 / 20%);
        _line-height         : 1.6em;
    }
    .panel {
        _border              : 1px solid #524b00 ;
        border              : 1px solid #464646 ;
        margin              : 0 2px 2px 0;
        padding             : 0 ;
        background-color    : #262626;
        color               : #9c9c9c;
        _box-shadow          : 0px 0px 4px 4px rgb(0 0 0 / 20%);
        line-height         : 1.6em;
        float               : left ;
        _display: flex;
    }
    .panel-title {
        _border              : 1px solid #8c8100 ;
        padding             : 5px 5px 3px 5px;
        margin              : 2px 0px 0 3px;
        _background-color    : #262626;
        background-color    : hsl(0deg 0% 13%);
        color               : #9c9c9c;
        text-shadow: 1px 1px 2px #000000;
        _box-shadow          : 0px 0px 4px 4px rgb(0 0 0 / 20%);
        line-height         : 1.6em;
        font-size           : 10px ;
    }
    .panel-body {
        height              : 272px ;
        _border              : 1px solid #8c8100 ;
        padding             : 5px 5px 5px 5px;
        _margin              : 40px 10px 0 60px;
        _background-color    : #1d1d20;
        background-color    : #1b1b1d;
        color               : #9c9c9c;
        _box-shadow          : 0px 0px 4px 4px rgb(0 0 0 / 20%);
        line-height         : 1.6em;
        font-size           : 10px ;
    }
    .button {
         cursor            : pointer ;
         width             : 160px ;
         margin-bottom     : 10px;
         padding-top       : 7px ;
         padding-bottom    : 5px ;
         border-radius     : 5px ;
         font-size         : 15px ;
         _font-weight       : 600 ;
         background-color  : #333333 ;
         text-align        : center ;
         color             : #b8b8b8 ;
         text-shadow       : #000000 1px 0 10px ;
         margin            : 1px 1px 1px 1px ;
         border            : 1px solid #686868 ;
         box-shadow        : 0px 0px 3px 3px rgb(18 18 18 / 40%);

         transition         : 0.5s;
    }
    .button:hover {
         background-color   : #262626;
        _text-shadow        : #fe37e6 1px 0 10px ;
         text-shadow        : #fee737 1px 0 10px ;

         _background-color: royalblue;
    }
    .input {
         width              : 300px ;
         border             : 1px solid hsl(0deg 0% 25%) ;
         padding            : 5px 5px 5px 15px ;
         color              : #ffffff ;
         background-color   : #202020 ;
    }
    .input:active {
         border             : 1px solid hsl(0deg 0% 53%) ;
    }
    .order-input {
         width              : 150px ;
         margin-left        : 20px ;
         background-color   : #141414 ;
    }
    .order-tab {
        height              : 20px;
        width               : 70px ;
        float               : left ;
        _margin-left         : 10px ;
        padding-top         : 2px ;
        text-align          : center ;
        cursor              : pointer ;
    }
    .order-tab-on {
        border              : 1px solid #0b5972 ;
        border-bottom       : none ;
        color               : #ffffff ;
        background-color    : hsl(200deg 52% 9%) ;
    }
    .order-tab-off {
        border              : 1px solid hsl(0 0% 37% / 1) ;
        border-bottom       : 1px solid #0b5972 ;
        color               : hsl(0 0% 61% / 1) ;
        background-color    : #000000 ;
    }

    .display_block {
        display             : block ;
    }
    .display_hide  {
        display             : none ;
    }

    .buysell-idx {
        float               : left ;
        width               : 60px ;
    }
    .buysell-col {
        float               : left ;
    }
    .buysell-text-error {
        height              : 20px ;
    }
    .buysell-text {
         margin-left        : 20px ;
    }
    .buysell-text-error {
         margin             : 10px 0px 0 20px ;
         color              : #aa0000 ;
    }
    .buysell-button {
        width               : 100px ;
        float               : left ;
    }

    .order_list_idx
    {
        color               : #b8b8b8 ;
        font-size           : 9px ;
        padding             : 2px 5px 1px 5px ;
        background-color    : #262626 ;
        background-color    : #102a36 ;
        background-color    : hsl(199deg 54% 9%);
        border-right        : 1px solid #000000 ;
        border-bottom       : 1px solid #0b5972;
    }

      .order_list_id 
    , .order_list_ymd
    , .order_list_currency
    , .order_list_buysell
    , .order_list_volume
    , .order_list_price
    , .order_list_tax
    , .order_list_status
    {
        color               : #ffffff ;
        font-size           : 9px ;
        padding             : 1px 5px 0 5px ;
    }

    .idx {
         border             : 1px solid #3d3d3d ;
         border-right       : none ;
         padding            : 12px 20px 0px 20px ;
         _background-color   : #f0f0f0 ;
         background-color   : #202020 ;
         color              : #b0b0b0 ;
    }
    .dat {
         border             : 1px solid #3d3d3d ;
         border-left        : none ;
         padding            : 4px 6px 4px 2px ;
         background-color   : #000000 ;
         _background-color   : #202020 ;
    }

    .color_buy {
        color               : #68bcd6 ;
    }

    .color_sell {
        color               : #ff6000 ;
    }

      .ranking_list_rank
    , .ranking_list_hn
    , .ranking_list_yen-y
    {
        color               : #d6d6d6 ;
        font-size           : 9px ;
        padding             : 1px 5px 0 5px ;
    }
    .ranking_list_yen-y
    {
        text-align          : right ;
    }

    .asset_idx {
        width               : 35px;
        margin              : 6px 10px 2px 6px ;
        float               : left ;
    }
    .asset_jpy_delim {
        width               : 20px ;
        margin              : 6px 0 2px 0px ;
        float               : left ;
        text-align          : center ;
        color               : #808080 ;
    }
    .asset_jpy_z , .asset_jpy , .asset_jpy_y{
        width               : 80px ;
        padding             : 6px 7px 2px 4px ;
        float               : left ;
        _font-weight         : 600 ;
        background-color    : #181818 ;
        border-radius       : 4px ;
        border              : 1px solid #2c2c2c ;
        text-align          : right ;
        color               : #ffffff ;
    }
    .asset_jpy_z {
        margin              : 0 0 2px 0px ;
    }
    .asset_jpy_y {
        width               : 180px ;
        margin-bottom       : 10px ;
    }
    .clear {
        clear               : both ;
    }

    .chat-msg {
        color               : #ffffff ;
    }


.loader {
  font-size: 10px;
  margin: 50px auto;
  text-indent: -9999em;
  width: 11em;
  height: 11em;
  border-radius: 50%;
  background: #ffffff;
  background: -moz-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
  background: -webkit-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
  background: -o-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
  background: -ms-linear-gradient(left, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
  background: linear-gradient(to right, #ffffff 10%, rgba(255, 255, 255, 0) 42%);
  position: relative;
  -webkit-animation: load3 1.4s infinite linear;
  animation: load3 1.4s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.loader:before {
  width: 50%;
  height: 50%;
  _width: 30%;
  _height: 30%;
  background: #ffffff;
  border-radius: 100% 0 0 0;
  position: absolute;
  top: 0;
  left: 0;
  content: '';
}
.loader:after {
  _background: #0dc5c1;
  background: #1b1b1d;
  width: 75%;
  height: 75%;
  _width: 40%;
  _height: 40%;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
@-webkit-keyframes load3 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load3 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

</style>

