layout.css 42 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134
  1. /* ------------------------------------------------------------------------------
  2. *
  3. * # Core layout
  4. *
  5. * Content area, sidebar, page header and boxed layout styles
  6. *
  7. * ---------------------------------------------------------------------------- */
  8. /* ------------------------------------------------------------------------------
  9. *
  10. * # Global configuration
  11. *
  12. * Here you can change main theme, enable or disable certain components and
  13. * optional styles. This allows you to include only components that you need.
  14. *
  15. * 'true' - enables component and includes it to main CSS file.
  16. * 'false' - disables component and excludes it from main CSS file.
  17. *
  18. * Layout helper: @if $layout == 'base' {...}
  19. * Theme helper: @if $theme == 'material' {...}
  20. * Component helper: @if $enable-* {...}
  21. *
  22. * ---------------------------------------------------------------------------- */
  23. /* ------------------------------------------------------------------------------
  24. *
  25. * # Custom Limitless functions
  26. *
  27. * Utility mixins and functions for evalutating source code across our variables, maps, and mixins.
  28. *
  29. * ---------------------------------------------------------------------------- */
  30. /* ------------------------------------------------------------------------------
  31. *
  32. * # Custom template mixins
  33. *
  34. * All custom mixins are prefixed with "ll-" to avoid conflicts
  35. *
  36. * ---------------------------------------------------------------------------- */
  37. /* ------------------------------------------------------------------------------
  38. *
  39. * # Main colors
  40. *
  41. * List of the template main color palettes
  42. *
  43. * ---------------------------------------------------------------------------- */
  44. /* ------------------------------------------------------------------------------
  45. *
  46. * # Default Bootstrap variable overrides
  47. *
  48. * Variables should follow the `$component-state-property-size` formula for
  49. * consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
  50. * Also includes custom variables, all marked with "!default" flag.
  51. *
  52. * ---------------------------------------------------------------------------- */
  53. /* ------------------------------------------------------------------------------
  54. *
  55. * # Additional variables
  56. *
  57. * Mainly 3rd party libraries and additional variables for default
  58. * Bootstrap components.
  59. *
  60. * ---------------------------------------------------------------------------- */
  61. /* ------------------------------------------------------------------------------
  62. *
  63. * # Mixins
  64. *
  65. * Import Bootstrap mixins with overrides
  66. *
  67. * ---------------------------------------------------------------------------- */
  68. /* ------------------------------------------------------------------------------
  69. *
  70. * # Badge mixin
  71. *
  72. * Override and extend default badge mixin.
  73. *
  74. * ---------------------------------------------------------------------------- */
  75. /* ------------------------------------------------------------------------------
  76. *
  77. * # Buttons mixin
  78. *
  79. * Override and extend default buttons mixin.
  80. *
  81. * ---------------------------------------------------------------------------- */
  82. /* ------------------------------------------------------------------------------
  83. *
  84. * # Caret mixin
  85. *
  86. * Override and extend default cared mixin.
  87. *
  88. * ---------------------------------------------------------------------------- */
  89. /* ------------------------------------------------------------------------------
  90. *
  91. * # Forms mixin
  92. *
  93. * Override and extend default forms mixin.
  94. *
  95. * ---------------------------------------------------------------------------- */
  96. /* ------------------------------------------------------------------------------
  97. *
  98. * # Background mixin
  99. *
  100. * Override and extend default background mixin.
  101. *
  102. * ---------------------------------------------------------------------------- */
  103. /* ------------------------------------------------------------------------------
  104. *
  105. * # Main content layout
  106. *
  107. * Styles for main structure of content area
  108. *
  109. * ---------------------------------------------------------------------------- */
  110. html {
  111. display: -ms-flexbox;
  112. display: flex;
  113. -ms-flex-direction: column;
  114. flex-direction: column; }
  115. body {
  116. min-height: 100vh;
  117. display: -ms-flexbox;
  118. display: flex;
  119. -ms-flex-direction: column;
  120. flex-direction: column;
  121. -ms-flex: 1;
  122. flex: 1; }
  123. .page-content {
  124. display: -ms-flexbox;
  125. display: flex;
  126. -ms-flex-positive: 1;
  127. flex-grow: 1; }
  128. .content-wrapper {
  129. display: -ms-flexbox;
  130. display: flex;
  131. -ms-flex-direction: column;
  132. flex-direction: column;
  133. -ms-flex: 1;
  134. flex: 1;
  135. overflow: auto; }
  136. .content {
  137. padding: 1.25rem 1.25rem;
  138. -ms-flex-positive: 1;
  139. flex-grow: 1; }
  140. .content::after {
  141. display: block;
  142. clear: both;
  143. content: ""; }
  144. /* ------------------------------------------------------------------------------
  145. *
  146. * # Page header
  147. *
  148. * Page header components and color options
  149. *
  150. * ---------------------------------------------------------------------------- */
  151. .page-title {
  152. padding: 2rem 0;
  153. position: relative; }
  154. .page-title small {
  155. display: inline-block;
  156. margin-left: 0.625rem; }
  157. .page-title small:before {
  158. content: '/';
  159. margin-right: 0.875rem; }
  160. .page-title small.d-block {
  161. margin-left: 0; }
  162. .page-title small.d-block:before {
  163. content: none; }
  164. .page-title small.d-block,
  165. .page-title .breadcrumb {
  166. margin-left: 1.875rem; }
  167. .page-title h1, .page-title h2, .page-title h3, .page-title h4, .page-title h5, .page-title h6 {
  168. margin: 0; }
  169. .page-header-content {
  170. position: relative;
  171. padding: 0 1.25rem; }
  172. .page-header-content[class*=border-bottom-] + .breadcrumb-line {
  173. border-top: 0; }
  174. .page-header-light {
  175. background-color: #fff; }
  176. .page-header-light.has-cover {
  177. background: url(../../../../../../global_assets/images/backgrounds/seamless.png); }
  178. .page-header-dark {
  179. background-color: #273246;
  180. color: #fff;
  181. margin-bottom: 1.25rem; }
  182. .page-header-dark > .breadcrumb > li > a,
  183. .page-header-dark > .breadcrumb > li + li:before,
  184. .page-header-dark .page-header-content .breadcrumb > li > a,
  185. .page-header-dark .page-header-content .breadcrumb > li + li:before {
  186. color: rgba(255, 255, 255, 0.9); }
  187. .page-header-dark > .breadcrumb > li > a:hover, .page-header-dark > .breadcrumb > li > a:focus,
  188. .page-header-dark .page-header-content .breadcrumb > li > a:hover,
  189. .page-header-dark .page-header-content .breadcrumb > li > a:focus {
  190. color: #fff;
  191. opacity: 1; }
  192. .page-header-dark > .breadcrumb > .active,
  193. .page-header-dark .page-header-content .breadcrumb > .active {
  194. color: rgba(255, 255, 255, 0.5); }
  195. .page-header-dark.has-cover {
  196. background: url(../../../../../../global_assets/images/login_cover.jpg);
  197. background-size: cover; }
  198. .page-header-light,
  199. .page-header-dark {
  200. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  201. .page-header-light .breadcrumb-line:not(.breadcrumb-line-component):last-child,
  202. .page-header-dark .breadcrumb-line:not(.breadcrumb-line-component):last-child {
  203. box-shadow: none; }
  204. /* ------------------------------------------------------------------------------
  205. *
  206. * # Sidebar layouts
  207. *
  208. * Sidebar components, main navigation and sidebar itself
  209. *
  210. * ---------------------------------------------------------------------------- */
  211. .sidebar {
  212. -ms-flex: 0 0 auto;
  213. flex: 0 0 auto;
  214. width: 16.875rem;
  215. z-index: 1040; }
  216. .sidebar:not(.sidebar-component) {
  217. position: fixed;
  218. top: 0;
  219. bottom: 0;
  220. box-sizing: content-box;
  221. transition: all ease-in-out 0.15s; }
  222. @media screen and (prefers-reduced-motion: reduce) {
  223. .sidebar:not(.sidebar-component) {
  224. transition: none; } }
  225. .sidebar-main,
  226. .sidebar-main .sidebar-content, .sidebar-secondary,
  227. .sidebar-secondary .sidebar-content {
  228. left: -18.5625rem; }
  229. .sidebar-right,
  230. .sidebar-right .sidebar-content {
  231. right: -18.5625rem; }
  232. .sidebar.sidebar-fullscreen {
  233. width: 100%; }
  234. .sidebar:not(.sidebar-component) .sidebar-content {
  235. position: fixed;
  236. top: 3.00003rem;
  237. bottom: 0;
  238. width: inherit;
  239. overflow-y: scroll;
  240. -webkit-overflow-scrolling: touch;
  241. transition: left ease-in-out 0.15s, right ease-in-out 0.15s; }
  242. @media screen and (prefers-reduced-motion: reduce) {
  243. .sidebar:not(.sidebar-component) .sidebar-content {
  244. transition: none; } }
  245. .navbar-lg:first-child ~ .page-content .sidebar:not(.sidebar-component) .sidebar-content {
  246. top: 3.25003rem; }
  247. .navbar-sm:first-child ~ .page-content .sidebar:not(.sidebar-component) .sidebar-content {
  248. top: 2.75003rem; }
  249. .sidebar-mobile-main .sidebar-main {
  250. box-shadow: 0.25rem 0 1rem rgba(0, 0, 0, 0.35); }
  251. .sidebar-mobile-main .sidebar-main,
  252. .sidebar-mobile-main .sidebar-main .sidebar-content {
  253. left: 0; }
  254. .sidebar-mobile-secondary .sidebar-secondary {
  255. box-shadow: 0.25rem 0 1rem rgba(0, 0, 0, 0.35); }
  256. .sidebar-mobile-secondary .sidebar-secondary,
  257. .sidebar-mobile-secondary .sidebar-secondary .sidebar-content {
  258. left: 0; }
  259. .sidebar-mobile-right .sidebar-right {
  260. display: block;
  261. box-shadow: -0.25rem 0 1rem rgba(0, 0, 0, 0.35); }
  262. .sidebar-mobile-right .sidebar-right,
  263. .sidebar-mobile-right .sidebar-right .sidebar-content {
  264. right: 0; }
  265. .sidebar-mobile-component .sidebar-component {
  266. display: block; }
  267. .nav-sidebar {
  268. -ms-flex-direction: column;
  269. flex-direction: column; }
  270. .nav-sidebar .nav-item:not(.nav-item-header):first-child {
  271. padding-top: 0.5rem; }
  272. .nav-sidebar .nav-item:not(.nav-item-header):last-child {
  273. padding-bottom: 0.5rem; }
  274. .nav-sidebar .nav-item:not(.nav-item-divider) {
  275. margin-bottom: 1px; }
  276. .nav-sidebar .nav-item:not(.nav-item-divider):last-child {
  277. margin-bottom: 0; }
  278. .nav-sidebar > .nav-item > .nav-link {
  279. font-weight: 500; }
  280. .nav-sidebar .nav-link {
  281. position: relative;
  282. display: -ms-flexbox;
  283. display: flex;
  284. -ms-flex-align: start;
  285. align-items: flex-start;
  286. padding: 0.75rem 1.25rem;
  287. transition: background-color ease-in-out 0.15s, color ease-in-out 0.15s; }
  288. @media screen and (prefers-reduced-motion: reduce) {
  289. .nav-sidebar .nav-link {
  290. transition: none; } }
  291. .nav-sidebar .nav-link i {
  292. margin-right: 1.25rem;
  293. margin-top: 0.12502rem;
  294. margin-bottom: 0.12502rem;
  295. top: 0; }
  296. .nav-sidebar .nav-link .badge {
  297. transition: background-color ease-in-out 0.15s, border-color ease-in-out 0.15s; }
  298. @media screen and (prefers-reduced-motion: reduce) {
  299. .nav-sidebar .nav-link .badge {
  300. transition: none; } }
  301. .nav-sidebar .nav-link.disabled, .nav-sidebar .nav-link.disabled:hover, .nav-sidebar .nav-link.disabled:focus {
  302. background-color: transparent;
  303. opacity: 0.5; }
  304. .nav-sidebar .nav-item-header {
  305. padding: 0.75rem 1.25rem;
  306. margin-top: 0.5rem; }
  307. .nav-sidebar .nav-item-header > i {
  308. display: none; }
  309. .nav-sidebar .nav-item-divider {
  310. margin: 0.5rem 0;
  311. height: 1px; }
  312. .nav-item-submenu > .nav-link {
  313. padding-right: 2.75rem; }
  314. .nav-item-submenu > .nav-link:after {
  315. content: '\e9c7';
  316. font-family: "icomoon";
  317. display: inline-block;
  318. font-size: 1rem;
  319. vertical-align: middle;
  320. line-height: 1;
  321. position: absolute;
  322. top: 0.75rem;
  323. margin-top: 0.12502rem;
  324. right: 1.25rem;
  325. transition: -webkit-transform 0.25s ease-in-out;
  326. transition: transform 0.25s ease-in-out;
  327. transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
  328. -webkit-font-smoothing: antialiased;
  329. -moz-osx-font-smoothing: grayscale; }
  330. @media screen and (prefers-reduced-motion: reduce) {
  331. .nav-item-submenu > .nav-link:after {
  332. transition: none; } }
  333. .nav-item-submenu.nav-item-open > .nav-link:after {
  334. -webkit-transform: rotate(90deg);
  335. transform: rotate(90deg); }
  336. .nav-group-sub {
  337. display: none; }
  338. .nav-group-sub .nav-link {
  339. padding: 0.625rem 1.25rem 0.625rem 3.5rem; }
  340. .nav-group-sub .nav-group-sub .nav-link {
  341. padding-left: 4.75rem; }
  342. .nav-group-sub .nav-group-sub .nav-group-sub .nav-link {
  343. padding-left: 6rem; }
  344. .nav-group-sub .nav-item-submenu > .nav-link:after {
  345. top: 0.625rem; }
  346. .nav-item-expanded > .nav-group-sub {
  347. display: block; }
  348. .nav-scrollspy .nav-link.active + .nav,
  349. .nav-scrollspy .nav-item-open .nav-link:not(.active) + .nav {
  350. display: block; }
  351. .nav-scrollspy .nav-link.active:after {
  352. -webkit-transform: rotate(90deg);
  353. transform: rotate(90deg); }
  354. .nav-sidebar-icons-reverse .nav-link {
  355. padding-right: 3.5rem; }
  356. .nav-sidebar-icons-reverse .nav-link i {
  357. position: absolute;
  358. top: 0.75rem;
  359. right: 1.25rem;
  360. margin-right: 0; }
  361. .nav-sidebar-icons-reverse .nav-item-submenu .nav-link {
  362. padding-right: 4.5rem; }
  363. .nav-sidebar-icons-reverse .nav-item-submenu .nav-link:after {
  364. right: 3.25rem; }
  365. .nav-sidebar-icons-reverse .nav-group-sub .nav-link {
  366. padding-left: 2.5rem; }
  367. .nav-sidebar-icons-reverse .nav-group-sub .nav-link i {
  368. top: 0.625rem; }
  369. .nav-sidebar-icons-reverse .nav-group-sub .nav-group-sub .nav-link {
  370. padding-left: 3.75rem; }
  371. .nav-sidebar-icons-reverse .nav-group-sub .nav-group-sub .nav-group-sub .nav-link {
  372. padding-left: 5rem; }
  373. .nav-sidebar-bordered > .nav-item + .nav-item:not(.nav-item-divider) {
  374. margin-bottom: 0; }
  375. .sidebar .card:first-child .nav-sidebar-bordered {
  376. padding-top: 0; }
  377. .sidebar .card:first-child .nav-sidebar-bordered > .nav-item:first-child,
  378. .sidebar .card:first-child .nav-sidebar-bordered > .nav-item-header:first-child {
  379. border-top: 0; }
  380. .sidebar .card:last-child .nav-sidebar-bordered {
  381. padding-bottom: 0; }
  382. .sidebar .card:last-child .nav-sidebar-bordered > .nav-item:last-child,
  383. .sidebar .card:last-child .nav-sidebar-bordered > .nav-item-header:last-child {
  384. border-bottom: 0; }
  385. .sidebar-dark .nav-sidebar-bordered > .nav-item {
  386. border-top: 1px solid rgba(255, 255, 255, 0.1); }
  387. .sidebar-dark .nav-sidebar-bordered > .nav-item:last-child {
  388. border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
  389. .sidebar-dark .nav-sidebar-bordered > .nav-item-header {
  390. background-color: rgba(0, 0, 0, 0.1);
  391. border-top: 1px solid rgba(255, 255, 255, 0.1);
  392. margin: 0; }
  393. .sidebar-light .nav-sidebar-bordered > .nav-item {
  394. border-top: 1px solid #ddd; }
  395. .sidebar-light .nav-sidebar-bordered > .nav-item:last-child {
  396. border-bottom: 1px solid #ddd; }
  397. .sidebar-light .nav-sidebar-bordered > .nav-item-header {
  398. background-color: #fafafa;
  399. border-top: 1px solid #ddd;
  400. margin: 0; }
  401. .sidebar-mobile-toggler {
  402. display: -ms-flexbox;
  403. display: flex;
  404. -ms-flex-pack: justify;
  405. justify-content: space-between;
  406. -ms-flex-align: center;
  407. align-items: center; }
  408. .sidebar-mobile-toggler a {
  409. padding: 0.875rem 1.25rem;
  410. transition: all ease-in-out 0.15s; }
  411. @media screen and (prefers-reduced-motion: reduce) {
  412. .sidebar-mobile-toggler a {
  413. transition: none; } }
  414. .navbar-lg:first-child ~ .page-content .sidebar-mobile-toggler a {
  415. padding: 1rem 1.25rem; }
  416. .navbar-sm:first-child ~ .page-content .sidebar-mobile-toggler a {
  417. padding: 0.75rem 1.25rem; }
  418. .sidebar-mobile-expand i:last-child:not(:first-child) {
  419. display: none; }
  420. .sidebar-fullscreen .sidebar-mobile-expand i:first-child {
  421. display: none; }
  422. .sidebar-fullscreen .sidebar-mobile-expand i:last-child {
  423. display: inline-block; }
  424. .sidebar-dark {
  425. background-color: #263238;
  426. color: #fff; }
  427. .sidebar-dark .sidebar-mobile-toggler {
  428. color: rgba(255, 255, 255, 0.9);
  429. border-bottom-color: rgba(255, 255, 255, 0.1); }
  430. .sidebar-dark .sidebar-mobile-toggler:not([class*=bg-]) {
  431. background-color: #1e272c; }
  432. .sidebar-dark .sidebar-mobile-toggler a {
  433. color: rgba(255, 255, 255, 0.9); }
  434. .sidebar-dark .sidebar-mobile-toggler a:hover {
  435. color: #fff;
  436. background-color: transparent; }
  437. .sidebar-dark .card-header {
  438. border-color: rgba(255, 255, 255, 0.1); }
  439. .sidebar-dark .nav-sidebar .nav-link,
  440. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-link {
  441. color: rgba(255, 255, 255, 0.9); }
  442. .sidebar-dark .nav-sidebar .nav-link:not(.disabled):hover,
  443. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-link:not(.disabled):hover {
  444. color: #fff;
  445. background-color: rgba(0, 0, 0, 0.15); }
  446. .sidebar-dark .nav-sidebar .nav-item > .nav-link.active,
  447. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-item > .nav-link.active {
  448. background-color: rgba(0, 0, 0, 0.15);
  449. color: #fff; }
  450. .sidebar-dark .nav-sidebar .nav-item-open > .nav-link:not(.disabled),
  451. .sidebar-dark .nav-sidebar > .nav-item-expanded:not(.nav-item-open) > .nav-link,
  452. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-item-open > .nav-link:not(.disabled),
  453. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item-expanded:not(.nav-item-open) > .nav-link {
  454. background-color: rgba(0, 0, 0, 0.15);
  455. color: #fff; }
  456. .sidebar-dark .nav-sidebar > .nav-item-open > .nav-link:not(.disabled),
  457. .sidebar-dark .nav-sidebar > .nav-item > .nav-link.active,
  458. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item-open > .nav-link:not(.disabled),
  459. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item > .nav-link.active {
  460. background-color: #26A69A;
  461. color: #fff; }
  462. .sidebar-dark .nav-sidebar .nav-item-header,
  463. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-item-header {
  464. color: rgba(255, 255, 255, 0.5); }
  465. .sidebar-dark .nav-sidebar .nav-item-divider,
  466. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar .nav-item-divider {
  467. background-color: rgba(255, 255, 255, 0.1); }
  468. .sidebar-dark .nav-sidebar > .nav-item-submenu > .nav-group-sub,
  469. .sidebar-light .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item-submenu > .nav-group-sub {
  470. background-color: rgba(0, 0, 0, 0.15); }
  471. .sidebar-dark[class*=bg-] .nav-sidebar > .nav-item-open > .nav-link:not(.disabled),
  472. .sidebar-dark[class*=bg-] .nav-sidebar > .nav-item > .nav-link.active,
  473. .sidebar .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item-open > .nav-link:not(.disabled),
  474. .sidebar .card[class*=bg-]:not(.bg-light):not(.bg-white):not(.bg-transparent) .nav-sidebar > .nav-item > .nav-link.active {
  475. background-color: rgba(0, 0, 0, 0.3); }
  476. .sidebar-light {
  477. background-color: #fff;
  478. color: #333;
  479. border-right: 0 solid rgba(0, 0, 0, 0.125);
  480. background-clip: content-box; }
  481. .sidebar-light.sidebar-right {
  482. border-right: 0;
  483. border-left: 0 solid rgba(0, 0, 0, 0.125); }
  484. .sidebar-light .nav-sidebar .nav-link {
  485. color: rgba(51, 51, 51, 0.85); }
  486. .sidebar-light .nav-sidebar .nav-link:not(.disabled):hover {
  487. color: #333;
  488. background-color: #f5f5f5; }
  489. .sidebar-light .nav-sidebar .nav-item > .nav-link.active {
  490. background-color: #f5f5f5;
  491. color: #333; }
  492. .sidebar-light .nav-sidebar .nav-item-open > .nav-link:not(.disabled),
  493. .sidebar-light .nav-sidebar > .nav-item-expanded:not(.nav-item-open) > .nav-link {
  494. background-color: #f5f5f5;
  495. color: #333; }
  496. .sidebar-light .nav-sidebar > .nav-item-open > .nav-link:not(.disabled),
  497. .sidebar-light .nav-sidebar > .nav-item > .nav-link.active {
  498. background-color: #f5f5f5;
  499. color: #333; }
  500. .sidebar-light .nav-sidebar .nav-item-header {
  501. color: rgba(51, 51, 51, 0.5); }
  502. .sidebar-light .nav-sidebar .nav-item-divider {
  503. background-color: rgba(0, 0, 0, 0.125); }
  504. .sidebar-light .nav-sidebar > .nav-item-submenu > .nav-group-sub {
  505. background-color: transparent; }
  506. .sidebar-light .sidebar-mobile-toggler {
  507. color: rgba(51, 51, 51, 0.8);
  508. border-bottom-color: rgba(0, 0, 0, 0.125); }
  509. .sidebar-light .sidebar-mobile-toggler:not([class*=bg-]) {
  510. background-color: whitesmoke; }
  511. .sidebar-light .sidebar-mobile-toggler a {
  512. color: rgba(51, 51, 51, 0.8); }
  513. .sidebar-light .sidebar-mobile-toggler a:hover {
  514. color: #333;
  515. background-color: transparent; }
  516. .sidebar-light .sidebar-mobile-toggler[class*=bg-]:not(.bg-white):not(.bg-light):not(.bg-transparent) {
  517. color: rgba(255, 255, 255, 0.9);
  518. border-bottom-color: rgba(255, 255, 255, 0.1); }
  519. .sidebar-light .sidebar-mobile-toggler[class*=bg-]:not(.bg-white):not(.bg-light):not(.bg-transparent) a {
  520. color: rgba(255, 255, 255, 0.9); }
  521. .sidebar-light .sidebar-mobile-toggler[class*=bg-]:not(.bg-white):not(.bg-light):not(.bg-transparent) a:hover {
  522. color: #fff;
  523. background-color: transparent; }
  524. .sidebar-component {
  525. display: none;
  526. width: 100%;
  527. border-radius: 0.1875rem;
  528. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  529. .sidebar-fixed .sidebar-content {
  530. z-index: 1041; }
  531. @media (min-width: 768px) {
  532. .sidebar-xs .sidebar-main {
  533. width: 3.5rem; }
  534. .sidebar-xs .sidebar-main .sidebar-content::-webkit-scrollbar {
  535. width: 0 !important; }
  536. .sidebar-xs .sidebar-main .card:not(.card-sidebar-mobile),
  537. .sidebar-xs .sidebar-main .card-title {
  538. display: none; }
  539. .sidebar-xs .sidebar-main .card-header h6 + .header-elements {
  540. padding-top: 0.22117rem;
  541. padding-bottom: 0.22117rem; }
  542. .sidebar-xs .sidebar-main .card-header h5 + .header-elements {
  543. padding-top: 0.31733rem;
  544. padding-bottom: 0.31733rem; }
  545. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item {
  546. position: relative;
  547. margin: 0; }
  548. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item > .nav-link {
  549. -ms-flex-pack: center;
  550. justify-content: center;
  551. padding-left: 0;
  552. padding-right: 0; }
  553. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item > .nav-link > i {
  554. position: static;
  555. margin-left: 0;
  556. margin-right: 0;
  557. display: block;
  558. padding-bottom: 1px; }
  559. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item > .nav-link > span {
  560. display: none; }
  561. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu:hover > .nav-group-sub, .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu:focus > .nav-group-sub {
  562. display: block !important; }
  563. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu > .nav-group-sub {
  564. position: absolute;
  565. top: -0.5rem;
  566. right: -16.875rem;
  567. width: 16.875rem;
  568. display: none;
  569. z-index: 1000;
  570. box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  571. border-top-right-radius: 0.1875rem;
  572. border-bottom-right-radius: 0.1875rem; }
  573. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu > .nav-group-sub[data-submenu-title]:before {
  574. content: attr(data-submenu-title);
  575. display: block;
  576. padding: 0.75rem 1.25rem;
  577. padding-bottom: 0;
  578. margin-top: 0.5rem;
  579. opacity: 0.5; }
  580. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-submenu > .nav-link:after {
  581. content: none; }
  582. .sidebar-xs .sidebar-main .nav-sidebar .nav-group-sub .nav-link {
  583. padding-left: 1.25rem; }
  584. .sidebar-xs .sidebar-main .nav-sidebar .nav-group-sub .nav-group-sub .nav-link {
  585. padding-left: 2.25rem; }
  586. .sidebar-xs .sidebar-main .nav-sidebar .nav-group-sub .nav-group-sub .nav-group-sub .nav-link {
  587. padding-left: 3.5rem; }
  588. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-header {
  589. padding: 0;
  590. text-align: center; }
  591. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-header > i {
  592. display: block;
  593. top: 0;
  594. padding: 0.75rem 1.25rem;
  595. margin-top: 0.12502rem;
  596. margin-bottom: 0.12502rem; }
  597. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-header > div {
  598. display: none; }
  599. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item-open > .nav-group-sub {
  600. display: none !important; }
  601. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item:hover > .nav-link.disabled + .nav-group-sub,
  602. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item:hover > .nav-link.disabled > span, .sidebar-xs .sidebar-main .nav-sidebar > .nav-item:focus > .nav-link.disabled + .nav-group-sub,
  603. .sidebar-xs .sidebar-main .nav-sidebar > .nav-item:focus > .nav-link.disabled > span {
  604. display: none !important; }
  605. .sidebar-xs .sidebar-main .nav-item-submenu-reversed .nav-group-sub {
  606. top: auto !important;
  607. bottom: 0; }
  608. .sidebar-xs .sidebar-main.sidebar-dark .nav-sidebar > .nav-item:not(.nav-item-open):hover > .nav-link:not(.active):not(.disabled) {
  609. color: #fff;
  610. background-color: rgba(0, 0, 0, 0.15); }
  611. .sidebar-xs .sidebar-main.sidebar-dark .nav-sidebar > .nav-item-submenu > .nav-group-sub {
  612. background-color: #304047;
  613. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  614. .sidebar-xs .sidebar-main.sidebar-light .nav-sidebar > .nav-item:not(.nav-item-open):hover > .nav-link:not(.active):not(.disabled) {
  615. color: #333;
  616. background-color: #f5f5f5; }
  617. .sidebar-xs .sidebar-main.sidebar-light .nav-sidebar > .nav-item-submenu > .nav-group-sub {
  618. background-color: #fcfcfc;
  619. border: 0 solid rgba(0, 0, 0, 0.125); }
  620. .sidebar-xs .sidebar-main.sidebar-fixed .nav-sidebar > .nav-item-submenu:hover > .nav-group-sub, .sidebar-xs .sidebar-main.sidebar-fixed .nav-sidebar > .nav-item-submenu:focus > .nav-group-sub {
  621. position: fixed;
  622. left: 3.5rem;
  623. top: 3.12503rem;
  624. bottom: 0;
  625. width: 16.875rem;
  626. overflow-y: auto;
  627. border-radius: 0; }
  628. .sidebar-xs .navbar-lg:first-child ~ .page-content .sidebar-fixed.sidebar-main .nav-sidebar > .nav-item-submenu:hover > .nav-group-sub, .sidebar-xs .navbar-lg:first-child ~ .page-content .sidebar-fixed.sidebar-main .nav-sidebar > .nav-item-submenu:focus > .nav-group-sub {
  629. top: 3.37503rem; }
  630. .sidebar-xs .navbar-sm:first-child ~ .page-content .sidebar-fixed.sidebar-main .nav-sidebar > .nav-item-submenu:hover > .nav-group-sub, .sidebar-xs .navbar-sm:first-child ~ .page-content .sidebar-fixed.sidebar-main .nav-sidebar > .nav-item-submenu:focus > .nav-group-sub {
  631. top: 2.87503rem; } }
  632. @media (min-width: 576px) {
  633. .sidebar-expand-sm.sidebar-main {
  634. z-index: 99;
  635. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  636. .sidebar-expand-sm.sidebar-main .sidebar-content {
  637. left: 0; }
  638. .sidebar-expand-sm.sidebar-secondary {
  639. z-index: 98;
  640. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  641. .sidebar-expand-sm.sidebar-secondary .sidebar-content {
  642. left: 0; }
  643. .sidebar-expand-sm.sidebar-right {
  644. z-index: 97;
  645. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  646. .sidebar-expand-sm.sidebar-right .sidebar-content {
  647. right: 0; }
  648. .sidebar-expand-sm.sidebar-component {
  649. z-index: 96; }
  650. .sidebar-expand-sm:not(.sidebar-component) {
  651. position: static;
  652. transition: none; } }
  653. @media screen and (min-width: 576px) and (prefers-reduced-motion: reduce) {
  654. .sidebar-expand-sm:not(.sidebar-component) {
  655. transition: none; } }
  656. @media (min-width: 576px) {
  657. .sidebar-expand-sm:not(.sidebar-component):not(.sidebar-fixed) .sidebar-content {
  658. position: static;
  659. overflow: visible;
  660. width: auto; }
  661. .sidebar-expand-sm.sidebar-dark:not(.sidebar-component) + .sidebar-dark:not(.sidebar-component) {
  662. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  663. .sidebar-expand-sm .sidebar-mobile-toggler {
  664. display: none; }
  665. .sidebar-expand-sm.sidebar-fullscreen {
  666. width: 16.875rem; }
  667. .sidebar-main-hidden .sidebar-expand-sm.sidebar-main,
  668. .sidebar-component-hidden .sidebar-expand-sm.sidebar-component,
  669. .sidebar-secondary-hidden .sidebar-expand-sm.sidebar-secondary,
  670. .sidebar-mobile-right .sidebar-expand-sm.sidebar-right {
  671. display: none; }
  672. .sidebar-expand-sm.sidebar-right {
  673. display: none; }
  674. .sidebar-right-visible .sidebar-expand-sm.sidebar-right {
  675. display: block; }
  676. .sidebar-expand-sm.sidebar-component {
  677. display: block;
  678. width: 16.875rem; }
  679. .sidebar-expand-sm.sidebar-component-left {
  680. margin-right: 1.25rem; }
  681. .sidebar-expand-sm.sidebar-component-right {
  682. margin-left: 1.25rem; } }
  683. @media (max-width: 575.98px) {
  684. .sidebar-expand-sm:not(.sidebar-component) {
  685. border: 0; } }
  686. @media (min-width: 768px) {
  687. .sidebar-expand-md.sidebar-main {
  688. z-index: 99;
  689. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  690. .sidebar-expand-md.sidebar-main .sidebar-content {
  691. left: 0; }
  692. .sidebar-expand-md.sidebar-secondary {
  693. z-index: 98;
  694. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  695. .sidebar-expand-md.sidebar-secondary .sidebar-content {
  696. left: 0; }
  697. .sidebar-expand-md.sidebar-right {
  698. z-index: 97;
  699. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  700. .sidebar-expand-md.sidebar-right .sidebar-content {
  701. right: 0; }
  702. .sidebar-expand-md.sidebar-component {
  703. z-index: 96; }
  704. .sidebar-expand-md:not(.sidebar-component) {
  705. position: static;
  706. transition: none; } }
  707. @media screen and (min-width: 768px) and (prefers-reduced-motion: reduce) {
  708. .sidebar-expand-md:not(.sidebar-component) {
  709. transition: none; } }
  710. @media (min-width: 768px) {
  711. .sidebar-expand-md:not(.sidebar-component):not(.sidebar-fixed) .sidebar-content {
  712. position: static;
  713. overflow: visible;
  714. width: auto; }
  715. .sidebar-expand-md.sidebar-dark:not(.sidebar-component) + .sidebar-dark:not(.sidebar-component) {
  716. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  717. .sidebar-expand-md .sidebar-mobile-toggler {
  718. display: none; }
  719. .sidebar-expand-md.sidebar-fullscreen {
  720. width: 16.875rem; }
  721. .sidebar-main-hidden .sidebar-expand-md.sidebar-main,
  722. .sidebar-component-hidden .sidebar-expand-md.sidebar-component,
  723. .sidebar-secondary-hidden .sidebar-expand-md.sidebar-secondary,
  724. .sidebar-mobile-right .sidebar-expand-md.sidebar-right {
  725. display: none; }
  726. .sidebar-expand-md.sidebar-right {
  727. display: none; }
  728. .sidebar-right-visible .sidebar-expand-md.sidebar-right {
  729. display: block; }
  730. .sidebar-expand-md.sidebar-component {
  731. display: block;
  732. width: 16.875rem; }
  733. .sidebar-expand-md.sidebar-component-left {
  734. margin-right: 1.25rem; }
  735. .sidebar-expand-md.sidebar-component-right {
  736. margin-left: 1.25rem; } }
  737. @media (max-width: 767.98px) {
  738. .sidebar-expand-md:not(.sidebar-component) {
  739. border: 0; } }
  740. @media (min-width: 992px) {
  741. .sidebar-expand-lg.sidebar-main {
  742. z-index: 99;
  743. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  744. .sidebar-expand-lg.sidebar-main .sidebar-content {
  745. left: 0; }
  746. .sidebar-expand-lg.sidebar-secondary {
  747. z-index: 98;
  748. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  749. .sidebar-expand-lg.sidebar-secondary .sidebar-content {
  750. left: 0; }
  751. .sidebar-expand-lg.sidebar-right {
  752. z-index: 97;
  753. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  754. .sidebar-expand-lg.sidebar-right .sidebar-content {
  755. right: 0; }
  756. .sidebar-expand-lg.sidebar-component {
  757. z-index: 96; }
  758. .sidebar-expand-lg:not(.sidebar-component) {
  759. position: static;
  760. transition: none; } }
  761. @media screen and (min-width: 992px) and (prefers-reduced-motion: reduce) {
  762. .sidebar-expand-lg:not(.sidebar-component) {
  763. transition: none; } }
  764. @media (min-width: 992px) {
  765. .sidebar-expand-lg:not(.sidebar-component):not(.sidebar-fixed) .sidebar-content {
  766. position: static;
  767. overflow: visible;
  768. width: auto; }
  769. .sidebar-expand-lg.sidebar-dark:not(.sidebar-component) + .sidebar-dark:not(.sidebar-component) {
  770. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  771. .sidebar-expand-lg .sidebar-mobile-toggler {
  772. display: none; }
  773. .sidebar-expand-lg.sidebar-fullscreen {
  774. width: 16.875rem; }
  775. .sidebar-main-hidden .sidebar-expand-lg.sidebar-main,
  776. .sidebar-component-hidden .sidebar-expand-lg.sidebar-component,
  777. .sidebar-secondary-hidden .sidebar-expand-lg.sidebar-secondary,
  778. .sidebar-mobile-right .sidebar-expand-lg.sidebar-right {
  779. display: none; }
  780. .sidebar-expand-lg.sidebar-right {
  781. display: none; }
  782. .sidebar-right-visible .sidebar-expand-lg.sidebar-right {
  783. display: block; }
  784. .sidebar-expand-lg.sidebar-component {
  785. display: block;
  786. width: 16.875rem; }
  787. .sidebar-expand-lg.sidebar-component-left {
  788. margin-right: 1.25rem; }
  789. .sidebar-expand-lg.sidebar-component-right {
  790. margin-left: 1.25rem; } }
  791. @media (max-width: 991.98px) {
  792. .sidebar-expand-lg:not(.sidebar-component) {
  793. border: 0; } }
  794. @media (min-width: 1200px) {
  795. .sidebar-expand-xl.sidebar-main {
  796. z-index: 99;
  797. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  798. .sidebar-expand-xl.sidebar-main .sidebar-content {
  799. left: 0; }
  800. .sidebar-expand-xl.sidebar-secondary {
  801. z-index: 98;
  802. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  803. .sidebar-expand-xl.sidebar-secondary .sidebar-content {
  804. left: 0; }
  805. .sidebar-expand-xl.sidebar-right {
  806. z-index: 97;
  807. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  808. .sidebar-expand-xl.sidebar-right .sidebar-content {
  809. right: 0; }
  810. .sidebar-expand-xl.sidebar-component {
  811. z-index: 96; }
  812. .sidebar-expand-xl:not(.sidebar-component) {
  813. position: static;
  814. transition: none; } }
  815. @media screen and (min-width: 1200px) and (prefers-reduced-motion: reduce) {
  816. .sidebar-expand-xl:not(.sidebar-component) {
  817. transition: none; } }
  818. @media (min-width: 1200px) {
  819. .sidebar-expand-xl:not(.sidebar-component):not(.sidebar-fixed) .sidebar-content {
  820. position: static;
  821. overflow: visible;
  822. width: auto; }
  823. .sidebar-expand-xl.sidebar-dark:not(.sidebar-component) + .sidebar-dark:not(.sidebar-component) {
  824. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  825. .sidebar-expand-xl .sidebar-mobile-toggler {
  826. display: none; }
  827. .sidebar-expand-xl.sidebar-fullscreen {
  828. width: 16.875rem; }
  829. .sidebar-main-hidden .sidebar-expand-xl.sidebar-main,
  830. .sidebar-component-hidden .sidebar-expand-xl.sidebar-component,
  831. .sidebar-secondary-hidden .sidebar-expand-xl.sidebar-secondary,
  832. .sidebar-mobile-right .sidebar-expand-xl.sidebar-right {
  833. display: none; }
  834. .sidebar-expand-xl.sidebar-right {
  835. display: none; }
  836. .sidebar-right-visible .sidebar-expand-xl.sidebar-right {
  837. display: block; }
  838. .sidebar-expand-xl.sidebar-component {
  839. display: block;
  840. width: 16.875rem; }
  841. .sidebar-expand-xl.sidebar-component-left {
  842. margin-right: 1.25rem; }
  843. .sidebar-expand-xl.sidebar-component-right {
  844. margin-left: 1.25rem; } }
  845. @media (max-width: 1199.98px) {
  846. .sidebar-expand-xl:not(.sidebar-component) {
  847. border: 0; } }
  848. .sidebar-expand.sidebar-main {
  849. z-index: 99;
  850. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  851. .sidebar-expand.sidebar-main .sidebar-content {
  852. left: 0; }
  853. .sidebar-expand.sidebar-secondary {
  854. z-index: 98;
  855. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  856. .sidebar-expand.sidebar-secondary .sidebar-content {
  857. left: 0; }
  858. .sidebar-expand.sidebar-right {
  859. z-index: 97;
  860. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  861. .sidebar-expand.sidebar-right .sidebar-content {
  862. right: 0; }
  863. .sidebar-expand.sidebar-component {
  864. z-index: 96; }
  865. .sidebar-expand:not(.sidebar-component) {
  866. position: static;
  867. transition: none; }
  868. @media screen and (prefers-reduced-motion: reduce) {
  869. .sidebar-expand:not(.sidebar-component) {
  870. transition: none; } }
  871. .sidebar-expand:not(.sidebar-component):not(.sidebar-fixed) .sidebar-content {
  872. position: static;
  873. overflow: visible;
  874. width: auto; }
  875. .sidebar-expand.sidebar-dark:not(.sidebar-component) + .sidebar-dark:not(.sidebar-component) {
  876. border-left: 1px solid rgba(255, 255, 255, 0.1); }
  877. .sidebar-expand .sidebar-mobile-toggler {
  878. display: none; }
  879. .sidebar-expand.sidebar-fullscreen {
  880. width: 16.875rem; }
  881. .sidebar-main-hidden .sidebar-expand.sidebar-main,
  882. .sidebar-component-hidden .sidebar-expand.sidebar-component,
  883. .sidebar-secondary-hidden .sidebar-expand.sidebar-secondary,
  884. .sidebar-mobile-right .sidebar-expand.sidebar-right {
  885. display: none; }
  886. .sidebar-expand.sidebar-right {
  887. display: none; }
  888. .sidebar-right-visible .sidebar-expand.sidebar-right {
  889. display: block; }
  890. .sidebar-expand.sidebar-component {
  891. display: block;
  892. width: 16.875rem; }
  893. .sidebar-expand.sidebar-component-left {
  894. margin-right: 1.25rem; }
  895. .sidebar-expand.sidebar-component-right {
  896. margin-left: 1.25rem; }
  897. .sidebar-expand:not(.sidebar-component) {
  898. border: 0; }
  899. .sidebar:not(.bg-transparent) .card {
  900. border-width: 0;
  901. margin-bottom: 0;
  902. border-radius: 0;
  903. box-shadow: none; }
  904. .sidebar:not(.bg-transparent) .card .card {
  905. border-width: 1px; }
  906. .sidebar:not(.bg-transparent) .card:not([class*=bg-]):not(.fixed-top) {
  907. background-color: transparent; }
  908. .sidebar .card-footer {
  909. border-bottom: 1px solid rgba(0, 0, 0, 0.125); }
  910. .sidebar .row:not(.no-gutters) {
  911. margin-left: -0.3125rem;
  912. margin-right: -0.3125rem; }
  913. .sidebar .row:not(.no-gutters) [class*=col] {
  914. padding-left: 0.3125rem;
  915. padding-right: 0.3125rem; }
  916. .sidebar .form-group:last-child {
  917. margin-bottom: 0; }
  918. .sidebar .nav-tabs .nav-item:first-child .nav-link {
  919. border-left: 0; }
  920. .sidebar .nav-tabs .nav-item:last-child .nav-link {
  921. border-right: 0; }
  922. .sidebar .nav-tabs .nav-link {
  923. border-top: 0;
  924. border-bottom-width: 0; }
  925. .sidebar .nav-tabs .nav-link.active {
  926. border-bottom-color: transparent; }
  927. .sidebar-dark .nav-tabs {
  928. background-color: #1e272c;
  929. border-bottom-color: rgba(255, 255, 255, 0.1); }
  930. .sidebar-dark .nav-tabs .nav-link {
  931. color: rgba(255, 255, 255, 0.9); }
  932. .sidebar-dark .nav-tabs .nav-link:hover, .sidebar-dark .nav-tabs .nav-link:focus {
  933. color: #fff; }
  934. .sidebar-dark .nav-tabs .nav-link.active {
  935. color: #fff; }
  936. .sidebar-dark .nav-tabs:not(.nav-tabs-bottom) .nav-link.active {
  937. background-color: #263238;
  938. border-color: rgba(255, 255, 255, 0.1); }
  939. .sidebar-dark .nav-tabs .nav-item.show .nav-link:not(.active) {
  940. color: #fff; }
  941. .sidebar-light .nav-tabs {
  942. background-color: whitesmoke;
  943. border-bottom-color: rgba(0, 0, 0, 0.125); }
  944. .sidebar-light .nav-tabs .nav-link:hover, .sidebar-light .nav-tabs .nav-link:focus {
  945. color: #333; }
  946. .sidebar-light .nav-tabs .nav-link.active {
  947. color: #333; }
  948. .sidebar-light .nav-tabs:not(.nav-tabs-bottom) .nav-link.active {
  949. background-color: #fff; }
  950. .row-tile {
  951. border-radius: 0.1875rem;
  952. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }
  953. .row-tile div[class*=col] .btn {
  954. border-width: 0;
  955. border-radius: 0; }
  956. .row-tile div[class*=col] .btn-light,
  957. .row-tile div[class*=col] .bg-white {
  958. border-color: rgba(0, 0, 0, 0.125); }
  959. .row-tile div[class*=col]:first-child .btn:first-child {
  960. border-top-left-radius: 0.1875rem; }
  961. .row-tile div[class*=col]:first-child .btn:last-child {
  962. border-bottom-left-radius: 0.1875rem; }
  963. .row-tile div[class*=col]:last-child .btn:first-child {
  964. border-top-right-radius: 0.1875rem; }
  965. .row-tile div[class*=col]:last-child .btn:last-child {
  966. border-bottom-right-radius: 0.1875rem; }
  967. .row-tile div[class*=col] .btn + .btn {
  968. border-top-width: 1px; }
  969. .row-tile div[class*=col] + div[class*=col] .btn {
  970. border-left-width: 1px; }
  971. .sidebar-user-material .sidebar-user-material-body {
  972. background: url(../../../../../../global_assets/images/backgrounds/user_bg3.jpg) center center no-repeat;
  973. background-size: cover; }
  974. .sidebar-dark .sidebar-user-material .collapse {
  975. background-color: transparent;
  976. border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
  977. .sidebar-light .sidebar-user-material .collapse {
  978. background-color: transparent;
  979. border-bottom: 1px solid #ddd; }
  980. .sidebar-user-material-footer > a {
  981. padding: 0.625rem 1.25rem;
  982. display: block;
  983. color: #fff;
  984. background-color: rgba(0, 0, 0, 0.15);
  985. transition: background-color ease-in-out 0.15s; }
  986. @media screen and (prefers-reduced-motion: reduce) {
  987. .sidebar-user-material-footer > a {
  988. transition: none; } }
  989. .sidebar-user-material-footer > a:hover, .sidebar-user-material-footer > a[aria-expanded="true"] {
  990. background-color: rgba(0, 0, 0, 0.25); }
  991. .sidebar-user-material-footer > a:after {
  992. transition: all ease-in-out 0.15s; }
  993. @media screen and (prefers-reduced-motion: reduce) {
  994. .sidebar-user-material-footer > a:after {
  995. transition: none; } }
  996. .sidebar-user-material-footer > a[aria-expanded="true"]:after {
  997. -webkit-transform: rotate(180deg);
  998. transform: rotate(180deg); }
  999. @media (min-width: 768px) {
  1000. .sidebar-xs .sidebar-user-material-body > .card-body {
  1001. display: none; }
  1002. .sidebar-xs .sidebar-user-material-footer > a {
  1003. padding: 1.25rem; }
  1004. .sidebar-xs .sidebar-user-material-footer > a:after {
  1005. margin: auto; }
  1006. .sidebar-xs .sidebar-user-material-footer > a > span {
  1007. display: none; } }
  1008. /* ------------------------------------------------------------------------------
  1009. *
  1010. * # Boxed layout
  1011. *
  1012. * Styles for main structure of content area in boxed layout
  1013. *
  1014. * ---------------------------------------------------------------------------- */
  1015. .layout-boxed-bg {
  1016. background: url(../../../../../../global_assets/images/backgrounds/boxed_bg.png) repeat; }
  1017. .layout-boxed {
  1018. box-shadow: -4px 2px 4px rgba(0, 0, 0, 0.15), 4px 2px 4px rgba(0, 0, 0, 0.15); }
  1019. @media (min-width: 992px) {
  1020. .layout-boxed,
  1021. .layout-boxed > .navbar {
  1022. width: 992px;
  1023. margin-left: auto;
  1024. margin-right: auto; } }
  1025. @media (min-width: 1200px) {
  1026. .layout-boxed,
  1027. .layout-boxed > .navbar {
  1028. width: 1200px; } }
  1029. .layout-boxed .page-content {
  1030. background-color: #eeeded; }
  1031. @media (min-width: 992px) {
  1032. .content-boxed:not(.navbar-collapse) {
  1033. margin-left: 6%;
  1034. margin-right: 6%; }
  1035. .navbar > .content-boxed > *:first-child {
  1036. margin-left: 6%; }
  1037. .navbar > .content-boxed > *:last-child {
  1038. margin-right: 6%; }
  1039. .breadcrumb-line > .content-boxed > *:first-child {
  1040. margin-left: 1.25rem; }
  1041. .breadcrumb-line > .content-boxed > *:last-child {
  1042. margin-right: 1.25rem; } }