/* 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; } .valign:before { content: ''; height: 100%; display: inline-block; vertical-align: middle; } .o-loading { font-size: 13px; } .fullsize .o-loading { padding: 12px; } .o-loading i { font-size: 20px; } #thmbackground { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -1; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #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; } .text_ofl { overflow: hidden; } .text_ofl span { display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; } /* - 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; cursor: pointer; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } .element:active { -webkit-transform: scale(0.92); -moz-transform: scale(0.92); transform: scale(0.92); } .group { float: left; margin-right: 24px; } /* desktop layout */ #container { padding: 48px 0 0 156px; min-width: 800px; } #header { padding: 0 0 12px 0; height: 72px; position: relative; z-index: 2; } #side { width: 60px; height: 516px; position: absolute; margin-right: 96px; top: 120px; left: 0; z-index: 13; } #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; } .disable { opacity: .3; } .disable a { cursor: not-allowed; } .private { position: relative; padding-right: 10px; width: 300px; opacity: .3 !important; } .private:after { content: "\e073"; display: inline-block; font-family: 'entypo'; font-size: 1.5em; position: absolute; right: 0; text-align: center; text-decoration: inherit; top: 5px; } .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: #f7f7f7; float: left; } #panel_r { background-color: #fff; margin-left: 252px; position: relative; width: calc(100% - 272px); } /* 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 #fff; } /* 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, .w1.h1 .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 #fff; 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 #eee; } .s_action .setting_btn { margin-left: 12px; } .setting_btn { display: block; float: right; font-size: 15px; line-height: 36px; text-align: center; border: 0; } /* Apps Manager */ #app_info { float: left; width: 420px; height: 516px; margin-right: 36px; display: none; } #app_info .app_info_header { height: 120px; margin: -12px -12px 12px -12px; position: relative; background-color: #f7f7f7; -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 */ } #app_info .app_info_header > * { height: 100%; } #app_info .app_info_header .app_info_icon { display: block; margin: 0 auto; margin-top: 30px; -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 */ } #app_info .app_info_header .app_info_name { display: inline-block; vertical-align: middle; font-size: 2em; width: 300px; word-wrap: break-word; } #app_info .app_info_header .panel_close { position: absolute; right: 12px; top: 12px; font-size: 20px; } #app_info .app_info_list { line-height: 1.5em; overflow: hidden; } #app_info .app_info_list label { color: #aaaaaa; } #app_list { float: left; } #app_list .element > * { cursor: pointer; } .search_result { float: left; overflow: hidden; } .search_result .message { font-size: 15px; word-wrap: break-word; } .search_result .message b { font-size: 20px; display: block; margin-top: 12px; } .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; height: 100px; } .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, .list_t_item:hover .list_item_function { bottom: 0; } /* App */ .app_frame { margin: 60px 0 48px 156px; min-width: 800px; min-height: 576px; 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 .app_holder iframe { width: 100%; } .app_frame .app_frame_header { height: 60px; } /* Minimize Section */ #minimizebar { position: fixed; width: 100%; left: 0; bottom: 0; z-index: 14; } #minimizebar .minimize { cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 36px; font-size: 15px; float: left; } .app_frame .app_frame_header .icon-remove, .app_frame .app_frame_header .icon-minus { display: block; float: right; line-height: 60px; font-size: 20px; cursor: pointer; } #minimizebar .minimize .icon-remove { display: block; float: right; line-height: 36px;} /*Tooltip popup */ .desktop_toolpopup { position: absolute; z-index: 10; display: none; padding: 12px; cursor: default; background-color: #fff; } .desktop_toolpopup span { margin: 3px 0 3px 0; } .color-red{ color : red; } .remove_existing_record.color-red:hover { color: red; };