/* 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; 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: ''; clear: both; } .o-loading { font-size: 13px; } .fullsize .o-loading { padding: 12px; } .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: #dddddd; } .admtxt { color: #666; } a.admtxt.admbg2:hover { color: #fff; background-color: #aaaaaa; } .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; position: relative; z-index: 2; } #side { width: 60px; height: 516px; position: absolute; margin-right: 96px; top: 120px; left: 0; z-index: 11; } #holder { height: 516px; width: auto; position: relative; z-index: 1; } #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 12px; 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; } /* panel */ #panel_l { background-color: #fff; float: left; } #panel_r { background-color: #f7f7f7; margin-left: 252px; position: relative; width: auto; } /* Desktop Notification */ #orbitnote { position: fixed; top: 0; left: 50%; margin-left: -200px; z-index: 99999; width: 400px; -webkit-transition: height 2s ease; -moz-transition: height 2s ease; transition: height 2s ease; } #orbitnote .note_holder { overflow: hidden; padding: 36px; border: solid 2px #dddddd; border-top: 0; display: none; } #orbitnote .note_holder .note_type { display: inline-block; vertical-align: middle; width: 60px; height: 60px; color: #fff; } #orbitnote .note_holder .note_type .sign { display: block; font-size: 40px; width: 40px; height: 40px; padding: 10px; border-radius: 30px; text-align: center; } #orbitnote .note_holder .note_type .sign.icon-ok { background-color: #5BB75B; } #orbitnote .note_holder .note_type .sign.icon-exclamation-sign { background-color: #DA4F49; } #orbitnote .note_holder .note_type .sign.icon-warning-sign { background-color: #FAA732; } #orbitnote .note_holder .note_message { color: #333; display: inline-block; vertical-align: middle; word-wrap: break-word; width: 240px; margin: 0 0 0 20px; font-size: 15px; } /* Desktop Dialogue */ #orbitdiag { position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 12; display: none; } #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; 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; white-space: nowrap; } [data-sizex="1"] .appname, .w1.h1 .appname { text-align: center; } [data-sizey="2"] .appname { font-size: 21px; } .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; } .gridster ul { margin: -6px 0 0 -6px; } .widget.gs_w { cursor: move; overflow: hidden; } .gs_w.dragging { -webkit-transform: scale(0.92); -moz-transform: scale(0.92); transform: scale(0.92); } /* 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; 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; } .theme_plate .g_sep { margin-right: 0; } #color_input th { vertical-align: bottom; } .stock_wallpaper .ssl_item { margin-bottom: 6px; } .s_title { font-size: 21px; line-height: 60px; text-align: left; } .s_title.size_large { font-size: 36px; } .s_title.size_small { font-size: 15px; line-height: 2em; } .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; } .setting_btn { display: block; float: right; font-size: 15px; 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: 12px; border-left: solid 1px white; -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 */ } .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 { overflow: hidden; } .list_t_title { padding-bottom: 6px; color: #000; font-size: 15px; line-height: 1.3em; } .list_t_des { line-height: 1.5em; color: #999; margin-bottom: 4px; font-size: 13px; } .list_item_function { position: absolute; right: 0; bottom: -30px; width: 100%; height: 30px; line-height: 30px; text-align: right; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } .list_item_function a { display: inline-block; vertical-align: top; margin-left: 4px; padding: 0 6px; font-size: 11px; -webkit-text-size-adjust: none; } .list_item_function a :first-child { margin-left: 0; } .datalist_item:hover .list_item_function { bottom: 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; }