/* Template Name: MobApps Dashboard build with Bootstrap v3.0 Template Version: 1.0 Author: Tinne QQ: 1205450779 */ body { color: #333; background: #f1f2f7; font: 14px/1.42858 'microsoft yahei', sans-serif; padding: 0px !important; margin: 0px !important; } ul li { list-style: none; } a, a:hover, a:focus { text-decoration: none; outline: none; } ::selection { background: #FF6C60; color: #fff; } ::-moz-selection { background: #FF6C60; color: #fff; } #container { width: 100%; height: 100%; } /*reset defaultTheme style*/ .big-menu .panel .panel-collapse { background: #fff; border-left: none; width: 38px; } .list-group-item { border: none; padding-left: 25px; } .all-btns-style { width: 100%; border-color: #e7e7e7; background-color: #fff; border-radius: 5px; margin-bottom: 15px; } .all-btns-style .active,.all-btns-style .active a { background: #6ccac9 !important; color: #fff !important; } .all-btns-style .active:hover,.all-btns-style .active a:hover { background: #6ccac9 !important; color: #fff !important; } .big-menu .panel .panel-collapse { color: #667fa0; } a { color: #667fa0; } .list-group .list-group-item.active { background-color: #41cac0; color: #fff; border-color: #ddd; } .nav.nav-tabs { border-color: #ddd; margin-bottom: 0; } .welcome-container .shortcut a:hover { background-color: #f7f7f7; border: none; } .jumbotron { margin-top: 15px; margin-left: 15px; } .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary { background-color: #41cac0 !important; } .app .shop-preview { padding-left: 140px !important; } .app .app-region .app-add-filed a, .app .app-side .app-add-item .addItem-wrap .app-add-filed a { color: #797979 !important; } .menu .page-header { font-family: 'microsoft yahei', sans-serif; border: none; margin-bottom: 10px; font-size: 16px; } .page-header h4 { font-size: 16px; } .shortcut a { background-color: #fff !important; color: #41cac0 !important; border-radius: 5px !important; margin-bottom: 15px; } .shortcut a:hover { background-color: #41cac0 !important; color: #fff !important; } .shortcut a span { font-size: 12px; } .menu .tile { background-color: #fff !important; color: #41cac0 !important; border-radius: 5px !important; } .menu .tile:hover { background-color: #41cac0 !important; color: #fff !important; } .menu .tile > span, .welcome-container .shortcut a span { font-size: 12px; } .shopNav .app .app-preview, .app .modules, .app .panel { background: #fff !important; } .app-header-setting .nav.nav-tabs { padding-top: 10px !important; margin: 0 10px !important; } .app-header-setting .nav.nav-tabs li.active a { background: #f4f4f4 !important; } .nav-pills>li.active>a, .nav-pills>li.active>a:hover, .nav-pills>li.active>a:focus { background: #fff !important; color: #00A8B3; } .nav-pills>li a { color: #fff; } .nav-pills>li a:hover { color: #00A8B3; } .app-shape-edit .modal-header, .app-shape-edit .action { background-color: #00A8B3 !important; color: #fff !important; } .app-shape-edit .dialog-content .cate-list { padding-bottom: 10px !important; } .app-shape-edit .dialog-content .cate-list .tab-head { background-color: #fff !important; color: #333 !important; margin: 0 !important; padding: 0 10px; } .app-shape-edit .dialog-content .cate-list { height: 560px !important; } .app-shape-edit .dialog-content .bg-pagination .current_page, .app-shape-edit .dialog-content .bg-pagination .modal-cancle, .app-shape-edit .dialog-content .bg-pagination .btn-primary { margin: 20px 0 !important; } .navbar-default { background: #fff; } .nav.nav-tabs li { margin-bottom: 0; } .nav.nav-tabs li a, .nav.nav-tabs li a:hover { border: 0; } .list-unstyled.account { } .account .list-group-bottom { overflow: hidden; *zoom:1; padding-bottom: 15px; } .well { border: none; background: none; padding-right: 0; } .well .clearfix a.img-rounded { display: block; float: left; text-align: center; background: #fff; margin-right: 1.2em; padding: 8px 5px; width: 7em; height: 7em; overflow: hidden; color: #41cac0; } .well .clearfix a.img-rounded:hover { text-decoration: none; background: #41cac0; color: #fff; border-radius: 5px; padding: 7px 4px; } .well .clearfix a.img-rounded i { display: block; font-size: 3em; margin: .28em .2em; } .well .clearfix a.img-rounded img { display: block; height: 3em; margin: .85em auto; } .well .clearfix a.tile-2x span { display: block; font-size: 12px; ; overflow: hidden; white-space: nowrap; } #notice-container li a { padding: 5px 10px; } #notice-container li a div { width: 100%; } #notice-container li a .fa-circle, #notice-container li a .label-info { display: none; margin-top: 0; } #notice-container li a h3 { font-size: 12px; float: left; width: 110px; margin: 0; height: 18px; line-height: 18px; } #notice-container li a div { overflow: hidden; *zoom:1; } #notice-container li a div.date { width: 95px; float: right; text-align: right; height: 18px; line-height: 18px; } .col-sm-8 .form-horizontal, #demoSendBox { background: #fff; padding: 10px; border-radius: 5px; margin-top: 15px; } .well .form-horizontal { background: #fff; padding: 10px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } .page-header { border: none; } .welcome-container h4 i { font-size: 12px; } /*sidebar navigation*/ #sidebar { width: 120px; height: 100%; position: fixed; background: #2a3542; } .nav-collapse.collapse { display: inline; } ul.sidebar-menu, ul.sidebar-menu li ul.sub { margin: -2px 0 0; padding: 0; } ul.sidebar-menu { margin-top: 75px; } #sidebar > ul > li > ul.sub { display: none; } #sidebar > ul > li.active > ul.sub, #sidebar > ul > li > ul.sub > li > a { display: block; } ul.sidebar-menu li ul.sub li { background: #35404D; margin-bottom: 0; margin-left: 0; margin-right: 0; } ul.sidebar-menu li ul.sub li:last-child { border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; } ul.sidebar-menu li ul.sub li a { font-size: 12px; padding: 0 0 0 32px; line-height: 35px; height: 35px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; color: #737B83; } ul.sidebar-menu li ul.sub li a:hover, ul.sidebar-menu li ul.sub li.active a { color: #FF6C60; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; display: block; } ul.sidebar-menu li { line-height: 20px !important; margin-bottom: 5px; margin-left: 10px; margin-right: 10px; } ul.sidebar-menu li.sub-menu { line-height: 15px; } ul.sidebar-menu li a span { display: inline-block; } ul.sidebar-menu li a { color: #8b9199; text-decoration: none; display: block; padding: 15px 0 15px 10px; font-size: 12px; outline: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } ul.sidebar-menu li.active a, ul.sidebar-menu li a:hover, ul.sidebar-menu li a:focus { background: #35404d; color: #fff; display: block; border-radius: 4px; -webkit-border-radius: 4px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } ul.sidebar-menu li a i { font-size: 15px; padding-right: 6px; } ul.sidebar-menu li a:hover i, ul.sidebar-menu li a:focus i { color: #FF6C60; } ul.sidebar-menu li.active a i { color: #FF6C60; } #sidebar ul > li > a .arrow { border-bottom: 4px solid transparent; border-left: 4px solid #A0A0A0; border-top: 4px solid transparent; float: right; height: 0; margin-right: 10px; margin-top: 6px; width: 0; } #sidebar > ul > li > a .arrow.open { border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #A0A0A0; float: right; height: 0; margin-right: 10px; margin-top: 8px; width: 0; } #sidebar ul > li.active > a .arrow, #sidebar ul > li > a:hover .arrow, #sidebar ul > li > a:focus .arrow { float: right; margin-top: 6px; margin-right: 10px; width: 0; height: 0; border-left: 4px solid #fff; border-top: 4px solid transparent; border-bottom: 4px solid transparent; } #sidebar > ul > li.active > a .arrow.open, #sidebar > ul > li > a:hover .arrow.open, #sidebar > ul > li > a:focus .arrow.open { float: right; margin-top: 8px; margin-right: 10px; width: 0; height: 0; border-top: 5px solid #fff; border-left: 4px solid transparent; border-right: 4px solid transparent; } .mail-info, .mail-info:hover { margin: 0px 6px 0 0; font-size: 11px; } /*main content*/ #main-content { margin-left: 120px; } .header, .footer { min-height: 60px; padding: 0 15px; } .header { position: fixed; left: 0; right: 0; z-index: 1002; } .white-bg { background: #fff; border-bottom: 1px solid #ddd; } .wrapper { display: inline-block; margin-top: 60px; padding: 0px 15px 15px 0; width: 100%; } a.logo { font-size: 21px; color: #2e2e2e; float: left; margin-top: 15px; text-transform: uppercase; } a.logo:hover, a.logo:focus { text-decoration: none; outline: none; } a.logo span { color: #FF6C60; } /*notification*/ #top_menu .nav > li, ul.top-menu > li { float: left; } .notify-row { float: right; margin-top: 10px; margin-left: 15px; } ul.top-menu > li > a { color: #666666; font-size: 16px; border-radius: 4px; -webkit-border-radius: 4px; border: 1px solid #f0f0f8 !important; padding: 2px 6px; margin-right: 15px; } ul.top-menu > li > a:hover, ul.top-menu > li > a:focus { border: 1px solid #f0f0f8 !important; background-color: #fff!important; border-color: #f0f0f8 !important; text-decoration: none; border-radius: 4px; -webkit-border-radius: 4px; color: #2E2E2E !important; } .notify-row .badge { position: absolute; right: -10px; top: -10px; z-index: 100; } .dropdown-menu.extended { max-width: 300px !important; min-width: 160px !important; top: 42px; width: 235px !important; padding: 0; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.176) !important; border: none !important; border-radius: 4px; -webkit-border-radius: 4px; } @media screen and (-webkit-min-device-pixel-ratio:0) { /* Safari and Chrome */ .dropdown-menu.extended { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.176) !important; } ; } .dropdown-menu.extended li p { background-color: #F1F2F7; color: #666666; margin: 0; padding: 10px; border-radius: 4px 4px 0px 0px; -webkit-border-radius: 4px 4px 0px 0px; } .dropdown-menu.extended li p.green { background-color: #a9d86e; color: #fff; } .dropdown-menu.extended li p.red { background-color: #ff6c60; color: #fff; } .dropdown-menu.extended li p.yellow { background-color: #fcb322; color: #fff; } .dropdown-menu.extended li a { border-bottom: 1px solid #EBEBEB !important; font-size: 12px; list-style: none; } .dropdown-menu.extended li a { padding: 15px 10px !important; width: 100%; display: inline-block; } .dropdown-menu.extended li a:hover { background-color: #F7F8F9 !important; color: #2E2E2E; } .dropdown-menu.tasks-bar .task-info .desc { font-size: 13px; font-weight: normal; } .dropdown-menu.tasks-bar .task-info .percent { display: inline-block; float: right; font-size: 13px; font-weight: 600; padding-left: 10px; margin-top: -4px; } .dropdown-menu.extended .progress { margin-bottom: 0 !important; height: 10px; } .dropdown-menu.inbox li a .photo img { border-radius: 2px 2px 2px 2px; float: left; height: 40px; margin-right: 4px; width: 40px; } .dropdown-menu.inbox li a .subject { display: block; } .dropdown-menu.inbox li a .subject .from { font-size: 12px; font-weight: 600; } .dropdown-menu.inbox li a .subject .time { font-size: 11px; font-style: italic; font-weight: bold; position: absolute; right: 5px; } .dropdown-menu.inbox li a .message { display: block !important; font-size: 11px; } .top-nav { margin-top: 7px; } .top-nav ul.top-menu > li .dropdown-menu.logout { width: 268px !important; } .top-nav li.dropdown .dropdown-menu { float: right; right: 0; left: auto; } .dropdown-menu.extended.logout > li { float: left; text-align: center; width: 33.3%; } .dropdown-menu.extended.logout > li:last-child { float: left; text-align: center; width: 100%; background: #a9d96c; border-radius: 0 0 3px 3px; } .dropdown-menu.extended.logout > li:last-child > a, .dropdown-menu.extended.logout > li:last-child > a:hover { color: #fff; border-bottom: none !important; text-transform: uppercase; } .dropdown-menu.extended.logout > li:last-child > a:hover > i { color: #fff; } .dropdown-menu.extended.logout > li > a { color: #a4abbb; border-bottom: none !important; } .dropdown-menu.extended.logout > li > a:hover { background: none !important; color: #50c8ea; } .dropdown-menu.extended.logout > li > a:hover i { color: #50c8ea; } .dropdown-menu.extended.logout > li > a i { font-size: 17px; } .dropdown-menu.extended.logout > li > a > i { display: block; } .top-nav .username { font-size: 13px; color: #555555; } .top-nav ul.top-menu > li > a { border: 1px solid #eeeeee; border-radius: 4px; -webkit-border-radius: 4px; padding: 6px; background: none; margin-right: 0; } .top-nav ul.top-menu > li { margin-left: 10px; } .top-nav ul.top-menu > li > a:hover, .top-nav ul.top-menu > li > a:focus { border: 1px solid #F1F2F7; background: #F1F2F7; } .top-nav .dropdown-menu.extended.logout { top: 50px; } .top-nav .nav .caret { border-bottom-color: #A4AABA; border-top-color: #A4AABA; } .top-nav ul.top-menu > li > a:hover .caret { border-bottom-color: #000; border-top-color: #000; } .log-arrow-up { background: url("../images/arrow-up.png") no-repeat; width: 20px; height: 11px; position: absolute; right: 20px; top: -10px; } /*----*/ .notify-arrow { border-style: solid; border-width: 0 9px 9px; height: 0; margin-top: 0; opacity: 0; position: absolute; left: 7px; top: -18px; transition: all 0.25s ease 0s; width: 0; z-index: 10; margin-top: 10px; opacity: 1; } .notify-arrow-yellow { border-color: transparent transparent #FCB322; border-bottom-color: #FCB322 !important; border-top-color: #FCB322 !important; } .notify-arrow-red { border-color: transparent transparent #ff6c60; border-bottom-color: #ff6c60 !important; border-top-color: #ff6c60 !important; } .notify-arrow-green { border-color: transparent transparent #a9d86e; border-bottom-color: #a9d86e !important; border-top-color: #a9d86e !important; } /*--sidebar toggle---*/ .sidebar-toggle-box { float: left; padding-right: 15px; margin-top: 20px; } .sidebar-toggle-box .icon-reorder { cursor: pointer; display: inline-block; font-size: 20px; } .sidebar-closed > #sidebar > ul { display: none; } .sidebar-closed #main-content { margin-left: 0px; } .sidebar-closed #sidebar { margin-left: -120px; } /*state overview*/ .state-overview .symbol, .state-overview .value { display: inline-block; text-align: center; } .state-overview .value { float: right; } .state-overview .value h1, .state-overview .value p { margin: 0; padding: 0; color: #c6cad6; } .state-overview .value h1 { font-weight: 300; } .state-overview .symbol i { color: #fff; font-size: 80px; } .state-overview .symbol { width: 40%; padding: 25px 15px; -webkit-border-radius: 4px 0px 0px 4px; border-radius: 4px 0px 0px 4px; } .state-overview .value { width: 58%; padding-top: 36px; } .state-overview .terques { background: #6ccac9; } .state-overview .red { background: #ff6c60; } .state-overview .yellow { background: #f8d347; } .state-overview .blue { background: #57c8f2; } /*button*/ .btn-row { margin-bottom: 10px; } /*checkbox & radio style*/ .checkboxes label, .radios label { display: block; cursor: pointer; line-height: 20px; padding-bottom: 7px; font-weight: 300; } .radios { padding-top: 18px; } .label_check input, .label_radio input { margin-right: 5px; } .has-js .label_check, .has-js .label_radio { padding-left: 34px; } .has-js .label_radio { background: url(../img/checkbox/radio-off.png) no-repeat; } .has-js .label_check { background: url(../img/checkbox/check-off.png) no-repeat; } .has-js label.c_on { background: url(../img/checkbox/check-on.png) no-repeat; } .has-js label.r_on { background: url(../img/checkbox/radio-on.png) no-repeat; } .has-js .label_check input, .has-js .label_radio input { position: absolute; left: -9999px; }