/* * Skin: sysimple-soft (AdminLTE 2) * -------------------------------- * Based on AdminLTE 2 "skin-black" structure. * Load AFTER: AdminLTE.min.css and _all-skins.min.css * * Usage: * */ /* ========= Brand tokens ========= Primary: #2f5f96 (navbar top) Primary2: #254c7a (navbar bottom / logo) Accent: #1aa3ff (Sysimple accent) Sidebar: #eaf1f7 (pale blue-gray) Sidebar2: #dde8f2 (sidebar header strip) Tree: #e3edf6 (submenu bg) Hover: #d6e6f5 (hover/active bg) Text: #223042 (sidebar text) ================================= */ .skin-sysimple-soft .main-header { -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.10); box-shadow: 0 1px 1px rgba(0,0,0,0.10); } .skin-sysimple-soft .main-header .navbar-toggle { color: #fff; } .skin-sysimple-soft .main-header .navbar-brand { color: #fff; border-right: 1px solid rgba(255,255,255,0.18); } .skin-sysimple-soft .main-header .navbar { background: linear-gradient(180deg, #2f5f96 0%, #254c7a 100%); } .skin-sysimple-soft .main-header .navbar .nav > li > a { color: #fff; } .skin-sysimple-soft .main-header .navbar .nav > li > a:hover, .skin-sysimple-soft .main-header .navbar .nav > li > a:active, .skin-sysimple-soft .main-header .navbar .nav > li > a:focus, .skin-sysimple-soft .main-header .navbar .nav .open > a, .skin-sysimple-soft .main-header .navbar .nav .open > a:hover, .skin-sysimple-soft .main-header .navbar .nav .open > a:focus, .skin-sysimple-soft .main-header .navbar .nav > .active > a { background: rgba(255,255,255,0.12); color: #fff; } .skin-sysimple-soft .main-header .navbar .sidebar-toggle { color: #fff; } .skin-sysimple-soft .main-header .navbar .sidebar-toggle:hover { color: #fff; background: rgba(255,255,255,0.12); } .skin-sysimple-soft .main-header .navbar > .sidebar-toggle { color: #fff; border-right: 1px solid rgba(255,255,255,0.18); } .skin-sysimple-soft .main-header .navbar .navbar-nav > li > a { border-right: 1px solid rgba(255,255,255,0.14); } .skin-sysimple-soft .main-header .navbar .navbar-custom-menu .navbar-nav > li > a, .skin-sysimple-soft .main-header .navbar .navbar-right > li > a { border-left: 1px solid rgba(255,255,255,0.14); border-right-width: 0; } .skin-sysimple-soft .main-header > .logo { background-color: #254c7a; color: #fff; border-bottom: 0 solid transparent; border-right: 1px solid rgba(255,255,255,0.18); } .skin-sysimple-soft .main-header > .logo:hover { background-color: rgba(0,0,0,0.10); color: #fff; } @media (max-width: 767px) { .skin-sysimple-soft .main-header > .logo { background-color: #254c7a; color: #fff; border-bottom: 0 solid transparent; border-right: none; } } /* User dropdown header */ .skin-sysimple-soft .main-header li.user-header { background: linear-gradient(180deg, #254c7a 0%, #1d3d63 100%); } .skin-sysimple-soft .content-header { background: transparent; box-shadow: none; } /* ==== Pale layout ==== */ .skin-sysimple-soft .wrapper, .skin-sysimple-soft .main-sidebar, .skin-sysimple-soft .left-side { background-color: #eaf1f7; } /* Make content area pale too (not white) */ .skin-sysimple-soft .content-wrapper, .skin-sysimple-soft .right-side { background-color: #f2f6fb; } /* Sidebar text */ .skin-sysimple-soft .user-panel > .info, .skin-sysimple-soft .user-panel > .info > a { color: #223042; } .skin-sysimple-soft .sidebar-menu > li.header { color: #5b6f86; background: #dde8f2; letter-spacing: .2px; } /* Sidebar links */ .skin-sysimple-soft .sidebar-menu > li > a { border-left: 3px solid transparent; } .skin-sysimple-soft .sidebar a { color: #223042; } .skin-sysimple-soft .sidebar a:hover { text-decoration: none; } /* Hover + active */ .skin-sysimple-soft .sidebar-menu > li:hover > a, .skin-sysimple-soft .sidebar-menu > li.active > a { color: #0f2238; background: #d6e6f5; border-left-color: #1aa3ff; } /* Submenus */ .skin-sysimple-soft .sidebar-menu > li > .treeview-menu { margin: 0 1px; background: #e3edf6; } .skin-sysimple-soft .treeview-menu > li > a { color: #3e546c; } .skin-sysimple-soft .treeview-menu > li.active > a, .skin-sysimple-soft .treeview-menu > li > a:hover { color: #0f2238; } /* Pace */ .skin-sysimple-soft .pace .pace-progress { background: #1aa3ff; } .skin-sysimple-soft .pace .pace-activity { border-top-color: #1aa3ff; border-left-color: #1aa3ff; } /* Optional polish */ .skin-sysimple-soft .dropdown-menu { border-radius: 10px; } /* Buttons */ .skin-sysimple-soft .btn-primary { background: #1aa3ff; border-color: #1aa3ff; color: #fff; } .skin-sysimple-soft .btn-primary:hover, .skin-sysimple-soft .btn-primary:focus { background: #1496ea; border-color: #1496ea; color: #fff; }