@charset "UTF-8";

/* Element -------------------------------------------------------------
 */
html, body{font-size:13px;background-color:#fff;}

body{margin:0;}

/* a */
a{text-decoration:none;cursor:pointer;}
a:hover{text-decoration:underline;}

/* Color ---------------------------------------------------------------
 */
.-dark-red    {color:#ff0000;} .-red              {color:#ff7f7f;} .-light-red   {color:#ff7fbf;}
.-pink        {color:#ff7fff;} .-purple           {color:#bf7fff;}
.-deep-blue   {color:#7f7fff;} .-blue             {color:#7fbfff;} .-light-blue  {color:#7fffff;}
                               .-green            {color:#7fff7f;} .-light-green {color:#bfff7f;}
                               .-yellow           {color:#ffff7f;} .-orange      {color:#ffbf7f;}
.-dark-glay   {color:#666;}    .-glay, .-disabled {color:#aaa;}    .-light-glay  {color:#ccc;}

.-bg-glay     {background-color:#eee;}
.-bg-green    {background-color:#58c1aa;}
.-bg-blue     {background-color:#eef;}
.-bg-red      {background-color:#fee;}

/* Attribute -----------------------------------------------------------
 */
.-bold {font-weight: bold; }

.-s {font-size:.9em;}
.-ss {font-size:.8em;}

.-center { text-align: center; }
.-right  { text-align: right; }

.-float       { float:left; }
.-float-right { float:right; }

.pointer { cursor: pointer; }

.-hide {display: none; }

.quick-ref:hover {
  background-color:#dcf;
  cursor: help;
}

/* Border --------------------------------------------------------------
 */
hr.simple {border:0;border-top:1px solid #8c8b8b;}
hr.dash {border:0;border-top:1px dashed #8c8b8b;}
hr.grade {border:0;height:1px;background-image:-webkit-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-moz-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-ms-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,0),rgba(0,0,0,0.75),rgba(0,0,0,0));}
hr.wave {border:0;background-color:#fff;border-top:2px dotted #8c8b8b;}

/* Layout --------------------------------------------------------------
 */
#top_bar {
  background-color:#fff;
  border:solid;
  border-width: 0 0 1px 0;
  border-color: #666;
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  height: 36px;
  padding: 0 16px 0 16px;
  left: 0;
  right: 0;
  z-index: 2;
}

#top_bar > div {
  width: 100%;
  margin: auto 0 auto 0
}

#bottom_bar {
  align-items: center;
  background-color:#fff;
  border:solid;
  border-width: 1px 0 0 0;
  border-color: #666;
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  height: 36px;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}

#main {
  background-color:#fff;
  position: fixed;
  top: 36px;
  bottom: 36px;
  left: 0;
  overflow-y: auto;
  right: 0;
  z-index: 0;
}


/* 
 */
ul.wide {
  margin: 4px;
  padding: 0;
}

ul.wide>li {
  display: inline-block;
  line-height: 16px;
  list-style: none;
  margin: 0 1px -1px 0;
  padding: 0 6px;
  width: 80px;
}

/* ---------------------------------------------------------------------
 */
.logo {
  padding: 0 0 0 20px;
}

.logo:before{
  content:'';
  position:absolute;
  border:solid 1px;
  border-color:#666;
  top:12px;
  left:16px;
  height:10px;
  width:10px;
  -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}

.logo:after{
  content:'';
  position:absolute;
  background-color:#f66;
  top:12px;
  left:10px;
  height:12px;
  width:12px;
  -webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);}

/*-- Inline Unit -----------------------------------------------------*/
.icon:before {display: inline-block; margin: 2px 4px 0 2px; vertical-align: middle;}

.icon.setting:before { content: url('./../img/ico_settings.png'); }
.icon.twitter:before { content: url('./../img/ico_link_twitter.png'); }
.icon.x:before { content: url('./../img/ico_link_x.png'); }

/*-- Over Write ------------------------------------------------------*/
/* toastr.min.css */

.toast         {background-color:#030303}
.toast-info    {background-color:#666666}
.toast-success {background-color:#5577aa}
.toast-warning {background-color:#F89406}
.toast-error   {background-color:#BD362F}