orbit-basic/app/assets/stylesheets/desktop/desktop-main.css

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

#container input, #container textarea, #container select, #container input:focus, #container textarea:focus {
  border-radius: 0;
  box-shadow: none;
  font-family: inherit; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* basic setting */
body {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 12px;
  font-weight: 300;
  background-color: #000; }

a, a:hover {
  text-decoration: none;
  color: #666; }

a:focus {
  outline: none; }

.clear {
  clear: both; }

.clear:after {
  display: table;
  width: 100%;
  content: ''; }

.o-loading {
  font-size: 13px;
  font-weight: normal; }
  .o-loading i {
    font-size: 20px; }

#thmbackground {
  min-height: 100%;
  min-width: 980px;
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1; }

#bgover {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  width: 100%;
  height: 100%; }

/* box-sizing element */
.w1, .w2, .w4, .wh1, .wh2, .wh3, .w100, .pw,
.h1, .h2, .h4, .hh1, .hh2, .hh3, .ph,
.appholder,
.appname,
.tinycanvas {
  -webkit-box-sizing: border-box;
  /* webkit */
  -khtml-box-sizing: border-box;
  /* konqueror */
  -moz-box-sizing: border-box;
  /* firefox */
  -ms-box-sizing: border-box;
  /* ie */
  box-sizing: border-box;
  /* css3 */ }

/* Desktop Global Style */
.admbg {
  background-color: #fff; }

.admbg2 {
  background-color: #ddd; }

.admtxt {
  color: #666; }

.admtxt:hover {
  color: #666; }

.hfn {
  font-size: 15px;
  line-height: 36px;
  float: left;
  margin: 12px 12px 0 0;
  position: relative; }

.thmtxt {
  position: relative; }

.ini_input {
  margin: 0;
  padding: 0;
  border: 0; }

.ini_input:focus {
  outline: none; }

/* - Opacity */
.op00 {
  opacity: 0; }

.op01 {
  opacity: 0.1; }

.op02 {
  opacity: 0.2; }

.op03 {
  opacity: 0.3; }

.op04 {
  opacity: 0.4; }

.op05 {
  opacity: 0.5; }

.op06 {
  opacity: 0.6; }

.op07 {
  opacity: 0.7; }

.op08 {
  opacity: 0.8; }

.op09 {
  opacity: 0.9; }

.op10 {
  opacity: 1; }

/* - box set */
.w1 {
  width: 120px; }

.w2 {
  width: 252px; }

.w4 {
  width: 512px; }

.wh1 {
  width: 36px; }

.wh2 {
  width: 60px; }

.wh3 {
  width: 84px; }

.w100 {
  width: 100%; }

.pw {
  width: 540px; }

.h1 {
  height: 120px; }

.h2 {
  height: 252px; }

.h4 {
  height: 512px; }

.hh1 {
  height: 36px; }

.hh2 {
  height: 60px; }

.hh3 {
  height: 84px; }

.ph {
  height: 516px; }

.hp {
  padding-left: 12px;
  padding-right: 12px; }

.vp {
  padding-top: 12px;
  padding-bottom: 12px; }

.element {
  margin: 0 12px 12px 0;
  float: left;
  position: relative; }

.group {
  float: left;
  margin-right: 24px; }

/* desktop layout */
#container {
  padding: 48px 0 0 156px; }

#header {
  padding: 0 0 12px 0;
  min-width: 800px;
  height: 72px; }

#side {
  width: 60px;
  height: 516px;
  position: absolute;
  margin-right: 96px;
  top: 120px;
  left: 0;
  z-index: 11; }

#holder {
  height: 516px;
  width: auto;
  position: relative; }

#rwidget {
  height: 516px; }

.widget_fn {
  display: block;
  overflow: hidden; }

.widget_icon {
  display: block;
  width: 30px;
  height: 30px;
  margin: 15px 0 0 15px; }

.docklist .d_cate {
  position: relative; }
  .docklist .d_cate .dock_child {
    display: none;
    overflow: hidden;
    position: absolute;
    left: 60px;
    top: 0; }
    .docklist .d_cate .dock_child .dock_item {
      float: left; }
.docklist .d_cate:hover .dock_child {
  display: block; }

.fn_des.admtxt {
  line-height: 60px;
  padding: 0 6px;
  font-size: 15px;
  position: absolute;
  z-index: 9;
  min-width: 48px;
  text-align: center;
  white-space: nowrap;
  display: none; }

#search_app {
  position: relative;
  background-color: #fff; }
  #search_app .form {
    position: absolute;
    left: 0;
    top: 2px;
    padding: 2px 12px;
    width: 192px;
    height: 28px;
    line-height: 28px;
    background: none;
    border: 0; }
  #search_app .submit {
    position: absolute;
    right: 2px;
    top: 2px;
    width: 32px;
    height: 32px;
    overflow: hidden;
    text-indent: -999px;
    cursor: pointer; }

.section_label {
  float: left;
  width: 132px;
  height: 516px; }
  .section_label li {
    font-size: 15px; }
  .section_label li:first-child {
    font-size: 18px;
    font-weight: normal; }

/* panel */
#panel_l {
  background-color: #f0f0f0;
  float: left; }

#panel_r {
  margin-left: 252px;
  position: relative; }

/* Desktop Notification */
#orbitnote {
  position: fixed;
  top: 0;
  left: 50%;
  margin-left: -206px;
  z-index: 99999;
  width: 400px;
  padding: 0 6px 6px 6px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.6); }
  #orbitnote .note_holder {
    background-color: #f3f3f3;
    border: solid 1px white;
    border-top: none;
    overflow: hidden;
    padding: 24px 24px; }
    #orbitnote .note_holder .note_type {
      float: left; }
      #orbitnote .note_holder .note_type img {
        display: block; }
    #orbitnote .note_holder .note_message {
      color: #333;
      margin: 10px 0 0 48px;
      font-size: 15px;
      font-weight: normal; }

/* Desktop Dialogue */
#orbitdiag {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 12; }
  #orbitdiag .tile {
    background-color: #000; }
  #orbitdiag .diag_holder {
    background-color: #000; }
    #orbitdiag .diag_holder .diag_holder_inner {
      width: 600px;
      margin: 200px auto 0 auto;
      position: relative;
      padding: 30px 0; }
      #orbitdiag .diag_holder .diag_holder_inner .diag_message {
        color: #fff;
        font-size: 18px;
        padding: 30px 0; }
      #orbitdiag .diag_holder .diag_holder_inner .diag_action {
        clear: both;
        text-align: right; }
      #orbitdiag .diag_holder .diag_holder_inner .diag_btn {
        display: inline-block;
        margin: 0 6px;
        text-align: center;
        font-size: 15px;
        font-weight: normal;
        line-height: 36px; }
        #orbitdiag .diag_holder .diag_holder_inner .diag_btn:hover {
          outline: solid 2px white; }

/* Tile */
.appname {
  font-size: 13px;
  line-height: 30px;
  width: 100%;
  height: 30px;
  padding: 0 12px;
  overflow: hidden;
  cursor: default;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 3; }
  [data-sizex="1"] .appname, .w1.h1 .appname {
    text-align: center; }
  [data-sizey="2"] .appname {
    font-size: 21px;
    font-weight: normal; }
  .hh2 .appname {
    position: relative;
    width: auto;
    padding: 0; }
  .fullsize .appname {
    display: none; }

.appicon {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto;
  position: relative; }
  [data-sizex="1"] .appicon {
    margin-top: 24px; }
  #sections .appicon {
    width: 30px;
    height: 30px;
    float: left;
    margin-right: 6px; }

.appholder {
  position: relative;
  z-index: 2;
  padding: 12px;
  padding-bottom: 30px;
  width: 100%;
  height: 100%;
  overflow: hidden; }
  .fullsize .appholder {
    position: absolute;
    padding: 0;
    left: 0;
    top: 0; }

.dtitle {
  font-size: 30px;
  line-height: 60px;
  float: left;
  margin: 0 12px 0 0;
  position: relative;
  z-index: 9; }

.tile {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0; }

.widget.gs_w {
  cursor: move; }

/* header drop menu */
.sdm_mdr .sdm_o {
  top: 36px; }

/* Setting Page */
.theme_list .ssl_item, .stock_wallpaper .ssl_item {
  display: inline-block;
  vertical-align: top;
  margin: 0 0 12px 0;
  padding: 6px 0px;
  width: 132px;
  text-align: center;
  cursor: pointer; }

.theme_thumb, .stock_wallpaper img {
  border: solid 1px white;
  width: 120px;
  margin: 0 auto; }

.theme_thumb img, .stock_wallpaper img {
  display: block; }

.theme_name {
  font-size: 15px;
  padding: 8px 6px;
  display: block; }

.theme_preview {
  width: 528px;
  height: 150px;
  line-height: 36px;
  font-size: 15px; }

.theme_plate {
  overflow: hidden; }
  .theme_plate > div {
    float: left;
    margin-right: 12px; }
  .theme_plate > div:first-child {
    margin-right: 48px; }

.stock_wallpaper .ssl_item {
  margin-bottom: 6px; }

.s_title {
  font-size: 21px;
  font-weight: normal;
  line-height: 60px;
  text-align: left; }

.s_subtitle {
  font-size: 15px;
  line-height: 1.5em;
  color: #ccc;
  padding: 12px 0 24px 0; }

.s_action {
  padding: 24px 0;
  margin-top: 12px;
  overflow: hidden;
  border-top: solid 1px #eeeeee;
  background-color: #fff; }

.setting_btn {
  display: block;
  float: right;
  font-size: 15px;
  font-weight: normal;
  line-height: 36px;
  text-align: center;
  border: 0; }

.group_search {
  float: left;
  margin-right: 36px; }

.search_result {
  float: left;
  margin-right: 24px;
  max-width: 340px; }

.g_sep {
  width: 11px;
  border-left: solid 1px white; }

.grp {
  height: 528px;
  float: left; }

.appgroup {
  float: left; }

.g_col {
  height: 516px;
  float: left; }

.g_col_w1 {
  width: 132px; }

.g_col_w2 {
  width: 264px; }

.ui-sortable-placeholder {
  background-color: rgba(0, 0, 0, 0.2);
  visibility: visible !important; }

/* list item */
.list_t_item {
  /*padding: 2px;*/
  overflow: hidden; }

.list_t_title {
  margin-bottom: 6px;
  color: #333;
  font-size: 15px;
  font-weight: normal; }

.list_t_des {
  line-height: 1.5em;
  color: #999;
  margin-bottom: 4px;
  font-size: 13px; }

.list_item_function a {
  display: inline-block;
  padding: 4px;
  font-size: 11px;
  -webkit-text-size-adjust: none; }

/* Connection Page */
#connection_setting {
  height: 492px; }

#connection_setting .s_form {
  float: left;
  margin: 0 12px 0 0;
  padding-left: 24px;
  height: 100%;
  border-left: solid 1px #dddddd; }

#connection_setting .s_form:first-child {
  padding-left: 0;
  border: none; }

#connection_setting .s_form label {
  line-height: 30px; }

#connection_setting .s_form .c_icon, #connection_setting .s_form .c_name {
  display: inline-block;
  vertical-align: middle; }

#connection_setting .s_form .c_name {
  padding: 0 12px;
  font-size: 18px; }

#connection_setting .s_form input[type=text], #connection_setting .s_form input[type=password] {
  width: 202px; }

#connection_setting .setting_btn {
  margin-left: 12px; }

#connection_setting .setting_btn.disable {
  background-color: #ddd;
  cursor: default; }

#connection_setting .c_status {
  float: right;
  padding: 6px;
  background-color: #eee;
  color: #ccc;
  font-size: 9px;
  font-weight: normal;
  -webkit-text-size-adjust: none;
  -webkit-transition: background-color 0.5s ease;
  -moz-transition: background-color 0.5s ease;
  transition: background-color 0.5s ease; }

#connection_setting .c_status_on {
  background-color: #51A351;
  color: #fff; }

#connection_setting .c_info {
  padding: 7px 6px;
  background-color: #fcfcfc;
  cursor: default;
  font-size: 18px;
  font-weight: normal; }

/* Journal Papers */
[page-name="journal_p_list"] .list_t_item .inner {
  padding-left: 30px; }

[page-name="journal_p_list"] .list_item_action {
  font-size: 12px;
  float: left;
  margin-left: -30px; }

[page-name="journal_p_list"] .list_item_action a {
  display: block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 1px 1px 6px 1px; }

[page-name="journal_p_list"] .list_item_action .icon-star-empty {
  color: #999;
  font-size: 20px; }

[page-name="journal_p_list"] .list_item_action .icon-star {
  color: #faa732;
  font-size: 20px; }

[page-name="journal_p_list"] .list_item_action .icon-check-empty {
  color: #999;
  font-size: 20px; }

[page-name="journal_p_list"] .list_item_action .icon-check {
  color: #333;
  font-size: 20px; }

[page-name="journal_p_list"] .list_t_item.file_view {
  height: 148px; }

[page-name="journal_p_list"] .file_view .file {
  display: inline-block;
  width: 62px;
  height: 50px;
  text-align: center; }

[page-name="journal_p_list"] .file_view .file:hover {
  background-color: #ddd; }

[page-name="journal_p_list"] .file_view .file img {
  width: 24px;
  display: block;
  margin: 0 auto;
  margin-top: 4px; }

[page-name="journal_p_list"] .file_view .filetitle {
  font-size: 11px;
  -webkit-text-size-adjust: none; }

/* Journal Paper Add */
#paper_add .s_grid_con {
  float: left;
  height: 456px;
  margin-left: 12px;
  padding-left: 12px;
  border-left: solid 1px #eeeeee; }

#paper_add .s_grid_con:first-child {
  margin-left: 0;
  padding-left: 0;
  border: none; }

#paper_add .f_w {
  width: 336px; }

#paper_add label {
  margin-right: 0; }

/* Journal Journal list */
[page-name="journal_p_journal"] .datalist_item .inner {
  padding-left: 30px; }

[page-name="journal_p_journal"] .list_item_action {
  font-size: 12px;
  float: left;
  margin-left: -30px; }

[page-name="journal_p_journal"] .list_item_action i {
  color: #999;
  font-size: 20px;
  display: block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  margin: 1px 1px 6px 1px; }

[page-name="journal_p_journal"] .list_t_desc {
  font-family: Arial, sans-serif;
  font-size: 12px;
  color: #999; }

/* Journal Co-Author */
[page-name="journal_p_coauthor"] .list_t_item {
  height: 110px; }

[page-name="journal_p_coauthor"] .list_item_function a {
  display: inline-block;
  padding: 4px;
  font-family: Arial, sans-serif;
  font-size: 11px;
  -webkit-text-size-adjust: none; }

[page-name="journal_p_coauthor"] .info {
  font-family: Arial, sans-serif; }

[page-name="journal_p_coauthor"] .info li {
  margin-bottom: 8px;
  color: #999; }

[page-name="journal_p_coauthor"] .info .name {
  font-size: 18px;
  line-height: 24px;
  color: #333; }

/* Journal Co-Author Relationship*/
[page-name="journal_p_coauthor_relation"] .edit_co_author_relation {
  /*margin-left: -10px;*/ }

[page-name="journal_p_coauthor_relation"] .form_space {
  margin-bottom: 10px;
  font-size: 18px;
  font-family: Arial, sans-serif; }

/* Journal New Co-Author */
#new_co_author label {
  margin-right: 0; }

/* App */
.app_frame {
  margin: 48px 96px 48px 156px;
  min-width: 800px;
  min-height: 588px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 12; }

.app_frame .app_holder {
  background-color: #fff;
  position: absolute;
  width: 100%; }

.app_frame #header .icon-remove {
  display: block;
  float: right;
  line-height: 60px;
  font-size: 20px;
  cursor: pointer; }

/*Tooltip popup */
.desktop_toolpopup {
  position: absolute;
  z-index: 10px;
  display: none;
  padding: 12px;
  cursor: default;
  background-color: #fff; }
  .desktop_toolpopup span {
    margin: 3px 0 3px 0; }