AdminLTE-without-plugins.css (90048B)
1 @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic); 2 /*! 3 * AdminLTE v2.3.5 Without Third-Party Plugins 4 * Author: Almsaeed Studio 5 * Website: Almsaeed Studio <http://almsaeedstudio.com> 6 * License: Open source - MIT 7 * Please visit http://opensource.org/licenses/MIT for more information 8 !*/ 9 /* 10 * Core: General Layout Style 11 * ------------------------- 12 */ 13 html, 14 body { 15 height: 100%; 16 } 17 .layout-boxed html, 18 .layout-boxed body { 19 height: 100%; 20 } 21 body { 22 font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; 23 font-weight: 400; 24 overflow-x: hidden; 25 overflow-y: auto; 26 } 27 /* Layout */ 28 .wrapper { 29 height: 100%; 30 position: relative; 31 overflow-x: hidden; 32 overflow-y: auto; 33 } 34 .wrapper:before, 35 .wrapper:after { 36 content: " "; 37 display: table; 38 } 39 .wrapper:after { 40 clear: both; 41 } 42 .layout-boxed .wrapper { 43 max-width: 1250px; 44 margin: 0 auto; 45 min-height: 100%; 46 box-shadow: 0 0 8px rgba(0, 0, 0, 0.5); 47 position: relative; 48 } 49 .layout-boxed { 50 background: url('../img/boxed-bg.jpg') repeat fixed; 51 } 52 /* 53 * Content Wrapper - contains the main content 54 * ```.right-side has been deprecated as of v2.0.0 in favor of .content-wrapper ``` 55 */ 56 .content-wrapper, 57 .right-side, 58 .main-footer { 59 -webkit-transition: -webkit-transform 0.3s ease-in-out, margin 0.3s ease-in-out; 60 -moz-transition: -moz-transform 0.3s ease-in-out, margin 0.3s ease-in-out; 61 -o-transition: -o-transform 0.3s ease-in-out, margin 0.3s ease-in-out; 62 transition: transform 0.3s ease-in-out, margin 0.3s ease-in-out; 63 margin-left: 230px; 64 z-index: 820; 65 } 66 .layout-top-nav .content-wrapper, 67 .layout-top-nav .right-side, 68 .layout-top-nav .main-footer { 69 margin-left: 0; 70 } 71 @media (max-width: 767px) { 72 .content-wrapper, 73 .right-side, 74 .main-footer { 75 margin-left: 0; 76 } 77 } 78 @media (min-width: 768px) { 79 .sidebar-collapse .content-wrapper, 80 .sidebar-collapse .right-side, 81 .sidebar-collapse .main-footer { 82 margin-left: 0; 83 } 84 } 85 @media (max-width: 767px) { 86 .sidebar-open .content-wrapper, 87 .sidebar-open .right-side, 88 .sidebar-open .main-footer { 89 -webkit-transform: translate(230px, 0); 90 -ms-transform: translate(230px, 0); 91 -o-transform: translate(230px, 0); 92 transform: translate(230px, 0); 93 } 94 } 95 .content-wrapper, 96 .right-side { 97 min-height: 100%; 98 background-color: #ecf0f5; 99 z-index: 800; 100 } 101 .main-footer { 102 background: #fff; 103 padding: 15px; 104 color: #444; 105 border-top: 1px solid #d2d6de; 106 } 107 /* Fixed layout */ 108 .fixed .main-header, 109 .fixed .main-sidebar, 110 .fixed .left-side { 111 position: fixed; 112 } 113 .fixed .main-header { 114 top: 0; 115 right: 0; 116 left: 0; 117 } 118 .fixed .content-wrapper, 119 .fixed .right-side { 120 padding-top: 50px; 121 } 122 @media (max-width: 767px) { 123 .fixed .content-wrapper, 124 .fixed .right-side { 125 padding-top: 100px; 126 } 127 } 128 .fixed.layout-boxed .wrapper { 129 max-width: 100%; 130 } 131 body.hold-transition .content-wrapper, 132 body.hold-transition .right-side, 133 body.hold-transition .main-footer, 134 body.hold-transition .main-sidebar, 135 body.hold-transition .left-side, 136 body.hold-transition .main-header .navbar, 137 body.hold-transition .main-header .logo { 138 /* Fix for IE */ 139 -webkit-transition: none; 140 -o-transition: none; 141 transition: none; 142 } 143 /* Content */ 144 .content { 145 min-height: 250px; 146 padding: 15px; 147 margin-right: auto; 148 margin-left: auto; 149 padding-left: 15px; 150 padding-right: 15px; 151 } 152 /* H1 - H6 font */ 153 h1, 154 h2, 155 h3, 156 h4, 157 h5, 158 h6, 159 .h1, 160 .h2, 161 .h3, 162 .h4, 163 .h5, 164 .h6 { 165 font-family: 'Source Sans Pro', sans-serif; 166 } 167 /* General Links */ 168 a { 169 color: #3c8dbc; 170 } 171 a:hover, 172 a:active, 173 a:focus { 174 outline: none; 175 text-decoration: none; 176 color: #72afd2; 177 } 178 /* Page Header */ 179 .page-header { 180 margin: 10px 0 20px 0; 181 font-size: 22px; 182 } 183 .page-header > small { 184 color: #666; 185 display: block; 186 margin-top: 5px; 187 } 188 /* 189 * Component: Main Header 190 * ---------------------- 191 */ 192 .main-header { 193 position: relative; 194 max-height: 100px; 195 z-index: 1030; 196 } 197 .main-header .navbar { 198 -webkit-transition: margin-left 0.3s ease-in-out; 199 -o-transition: margin-left 0.3s ease-in-out; 200 transition: margin-left 0.3s ease-in-out; 201 margin-bottom: 0; 202 margin-left: 230px; 203 border: none; 204 min-height: 50px; 205 border-radius: 0; 206 } 207 .layout-top-nav .main-header .navbar { 208 margin-left: 0; 209 } 210 .main-header #navbar-search-input.form-control { 211 background: rgba(255, 255, 255, 0.2); 212 border-color: transparent; 213 } 214 .main-header #navbar-search-input.form-control:focus, 215 .main-header #navbar-search-input.form-control:active { 216 border-color: rgba(0, 0, 0, 0.1); 217 background: rgba(255, 255, 255, 0.9); 218 } 219 .main-header #navbar-search-input.form-control::-moz-placeholder { 220 color: #ccc; 221 opacity: 1; 222 } 223 .main-header #navbar-search-input.form-control:-ms-input-placeholder { 224 color: #ccc; 225 } 226 .main-header #navbar-search-input.form-control::-webkit-input-placeholder { 227 color: #ccc; 228 } 229 .main-header .navbar-custom-menu, 230 .main-header .navbar-right { 231 float: right; 232 } 233 @media (max-width: 991px) { 234 .main-header .navbar-custom-menu a, 235 .main-header .navbar-right a { 236 color: inherit; 237 background: transparent; 238 } 239 } 240 @media (max-width: 767px) { 241 .main-header .navbar-right { 242 float: none; 243 } 244 .navbar-collapse .main-header .navbar-right { 245 margin: 7.5px -15px; 246 } 247 .main-header .navbar-right > li { 248 color: inherit; 249 border: 0; 250 } 251 } 252 .main-header .sidebar-toggle { 253 float: left; 254 background-color: transparent; 255 background-image: none; 256 padding: 15px 15px; 257 font-family: fontAwesome; 258 } 259 .main-header .sidebar-toggle:before { 260 content: "\f0c9"; 261 } 262 .main-header .sidebar-toggle:hover { 263 color: #fff; 264 } 265 .main-header .sidebar-toggle:focus, 266 .main-header .sidebar-toggle:active { 267 background: transparent; 268 } 269 .main-header .sidebar-toggle .icon-bar { 270 display: none; 271 } 272 .main-header .navbar .nav > li.user > a > .fa, 273 .main-header .navbar .nav > li.user > a > .glyphicon, 274 .main-header .navbar .nav > li.user > a > .ion { 275 margin-right: 5px; 276 } 277 .main-header .navbar .nav > li > a > .label { 278 position: absolute; 279 top: 9px; 280 right: 7px; 281 text-align: center; 282 font-size: 9px; 283 padding: 2px 3px; 284 line-height: .9; 285 } 286 .main-header .logo { 287 -webkit-transition: width 0.3s ease-in-out; 288 -o-transition: width 0.3s ease-in-out; 289 transition: width 0.3s ease-in-out; 290 display: block; 291 float: left; 292 height: 50px; 293 font-size: 20px; 294 line-height: 50px; 295 text-align: center; 296 width: 230px; 297 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 298 padding: 0 15px; 299 font-weight: 300; 300 overflow: hidden; 301 } 302 .main-header .logo .logo-lg { 303 display: block; 304 } 305 .main-header .logo .logo-mini { 306 display: none; 307 } 308 .main-header .navbar-brand { 309 color: #fff; 310 } 311 .content-header { 312 position: relative; 313 padding: 15px 15px 0 15px; 314 } 315 .content-header > h1 { 316 margin: 0; 317 font-size: 24px; 318 } 319 .content-header > h1 > small { 320 font-size: 15px; 321 display: inline-block; 322 padding-left: 4px; 323 font-weight: 300; 324 } 325 .content-header > .breadcrumb { 326 float: right; 327 background: transparent; 328 margin-top: 0; 329 margin-bottom: 0; 330 font-size: 12px; 331 padding: 7px 5px; 332 position: absolute; 333 top: 15px; 334 right: 10px; 335 border-radius: 2px; 336 } 337 .content-header > .breadcrumb > li > a { 338 color: #444; 339 text-decoration: none; 340 display: inline-block; 341 } 342 .content-header > .breadcrumb > li > a > .fa, 343 .content-header > .breadcrumb > li > a > .glyphicon, 344 .content-header > .breadcrumb > li > a > .ion { 345 margin-right: 5px; 346 } 347 .content-header > .breadcrumb > li + li:before { 348 content: '>\00a0'; 349 } 350 @media (max-width: 991px) { 351 .content-header > .breadcrumb { 352 position: relative; 353 margin-top: 5px; 354 top: 0; 355 right: 0; 356 float: none; 357 background: #d2d6de; 358 padding-left: 10px; 359 } 360 .content-header > .breadcrumb li:before { 361 color: #97a0b3; 362 } 363 } 364 .navbar-toggle { 365 color: #fff; 366 border: 0; 367 margin: 0; 368 padding: 15px 15px; 369 } 370 @media (max-width: 991px) { 371 .navbar-custom-menu .navbar-nav > li { 372 float: left; 373 } 374 .navbar-custom-menu .navbar-nav { 375 margin: 0; 376 float: left; 377 } 378 .navbar-custom-menu .navbar-nav > li > a { 379 padding-top: 15px; 380 padding-bottom: 15px; 381 line-height: 20px; 382 } 383 } 384 @media (max-width: 767px) { 385 .main-header { 386 position: relative; 387 } 388 .main-header .logo, 389 .main-header .navbar { 390 width: 100%; 391 float: none; 392 } 393 .main-header .navbar { 394 margin: 0; 395 } 396 .main-header .navbar-custom-menu { 397 float: right; 398 } 399 } 400 @media (max-width: 991px) { 401 .navbar-collapse.pull-left { 402 float: none !important; 403 } 404 .navbar-collapse.pull-left + .navbar-custom-menu { 405 display: block; 406 position: absolute; 407 top: 0; 408 right: 40px; 409 } 410 } 411 /* 412 * Component: Sidebar 413 * ------------------ 414 */ 415 .main-sidebar, 416 .left-side { 417 position: absolute; 418 top: 0; 419 left: 0; 420 padding-top: 50px; 421 min-height: 100%; 422 width: 230px; 423 z-index: 810; 424 -webkit-transition: -webkit-transform 0.3s ease-in-out, width 0.3s ease-in-out; 425 -moz-transition: -moz-transform 0.3s ease-in-out, width 0.3s ease-in-out; 426 -o-transition: -o-transform 0.3s ease-in-out, width 0.3s ease-in-out; 427 transition: transform 0.3s ease-in-out, width 0.3s ease-in-out; 428 } 429 @media (max-width: 767px) { 430 .main-sidebar, 431 .left-side { 432 padding-top: 100px; 433 } 434 } 435 @media (max-width: 767px) { 436 .main-sidebar, 437 .left-side { 438 -webkit-transform: translate(-230px, 0); 439 -ms-transform: translate(-230px, 0); 440 -o-transform: translate(-230px, 0); 441 transform: translate(-230px, 0); 442 } 443 } 444 @media (min-width: 768px) { 445 .sidebar-collapse .main-sidebar, 446 .sidebar-collapse .left-side { 447 -webkit-transform: translate(-230px, 0); 448 -ms-transform: translate(-230px, 0); 449 -o-transform: translate(-230px, 0); 450 transform: translate(-230px, 0); 451 } 452 } 453 @media (max-width: 767px) { 454 .sidebar-open .main-sidebar, 455 .sidebar-open .left-side { 456 -webkit-transform: translate(0, 0); 457 -ms-transform: translate(0, 0); 458 -o-transform: translate(0, 0); 459 transform: translate(0, 0); 460 } 461 } 462 .sidebar { 463 padding-bottom: 10px; 464 } 465 .sidebar-form input:focus { 466 border-color: transparent; 467 } 468 .user-panel { 469 position: relative; 470 width: 100%; 471 padding: 10px; 472 overflow: hidden; 473 } 474 .user-panel:before, 475 .user-panel:after { 476 content: " "; 477 display: table; 478 } 479 .user-panel:after { 480 clear: both; 481 } 482 .user-panel > .image > img { 483 width: 100%; 484 max-width: 45px; 485 height: auto; 486 } 487 .user-panel > .info { 488 padding: 5px 5px 5px 15px; 489 line-height: 1; 490 position: absolute; 491 left: 55px; 492 } 493 .user-panel > .info > p { 494 font-weight: 600; 495 margin-bottom: 9px; 496 } 497 .user-panel > .info > a { 498 text-decoration: none; 499 padding-right: 5px; 500 margin-top: 3px; 501 font-size: 11px; 502 } 503 .user-panel > .info > a > .fa, 504 .user-panel > .info > a > .ion, 505 .user-panel > .info > a > .glyphicon { 506 margin-right: 3px; 507 } 508 .sidebar-menu { 509 list-style: none; 510 margin: 0; 511 padding: 0; 512 } 513 .sidebar-menu > li { 514 position: relative; 515 margin: 0; 516 padding: 0; 517 } 518 .sidebar-menu > li > a { 519 padding: 12px 5px 12px 15px; 520 display: block; 521 } 522 .sidebar-menu > li > a > .fa, 523 .sidebar-menu > li > a > .glyphicon, 524 .sidebar-menu > li > a > .ion { 525 width: 20px; 526 } 527 .sidebar-menu > li .label, 528 .sidebar-menu > li .badge { 529 margin-right: 5px; 530 } 531 .sidebar-menu > li .badge { 532 margin-top: 3px; 533 } 534 .sidebar-menu li.header { 535 padding: 10px 25px 10px 15px; 536 font-size: 12px; 537 } 538 .sidebar-menu li > a > .fa-angle-left, 539 .sidebar-menu li > a > .pull-right-container > .fa-angle-left { 540 width: auto; 541 height: auto; 542 padding: 0; 543 margin-right: 10px; 544 } 545 .sidebar-menu li > a > .fa-angle-left { 546 position: absolute; 547 top: 50%; 548 right: 10px; 549 margin-top: -8px; 550 } 551 .sidebar-menu li.active > a > .fa-angle-left, 552 .sidebar-menu li.active > a > .pull-right-container > .fa-angle-left { 553 -webkit-transform: rotate(-90deg); 554 -ms-transform: rotate(-90deg); 555 -o-transform: rotate(-90deg); 556 transform: rotate(-90deg); 557 } 558 .sidebar-menu li.active > .treeview-menu { 559 display: block; 560 } 561 .sidebar-menu .treeview-menu { 562 display: none; 563 list-style: none; 564 padding: 0; 565 margin: 0; 566 padding-left: 5px; 567 } 568 .sidebar-menu .treeview-menu .treeview-menu { 569 padding-left: 20px; 570 } 571 .sidebar-menu .treeview-menu > li { 572 margin: 0; 573 } 574 .sidebar-menu .treeview-menu > li > a { 575 padding: 5px 5px 5px 15px; 576 display: block; 577 font-size: 14px; 578 } 579 .sidebar-menu .treeview-menu > li > a > .fa, 580 .sidebar-menu .treeview-menu > li > a > .glyphicon, 581 .sidebar-menu .treeview-menu > li > a > .ion { 582 width: 20px; 583 } 584 .sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-left, 585 .sidebar-menu .treeview-menu > li > a > .pull-right-container > .fa-angle-down, 586 .sidebar-menu .treeview-menu > li > a > .fa-angle-left, 587 .sidebar-menu .treeview-menu > li > a > .fa-angle-down { 588 width: auto; 589 } 590 /* 591 * Component: Sidebar Mini 592 */ 593 @media (min-width: 768px) { 594 .sidebar-mini.sidebar-collapse .content-wrapper, 595 .sidebar-mini.sidebar-collapse .right-side, 596 .sidebar-mini.sidebar-collapse .main-footer { 597 margin-left: 50px !important; 598 z-index: 840; 599 } 600 .sidebar-mini.sidebar-collapse .main-sidebar { 601 -webkit-transform: translate(0, 0); 602 -ms-transform: translate(0, 0); 603 -o-transform: translate(0, 0); 604 transform: translate(0, 0); 605 width: 50px !important; 606 z-index: 850; 607 } 608 .sidebar-mini.sidebar-collapse .sidebar-menu > li { 609 position: relative; 610 } 611 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a { 612 margin-right: 0; 613 } 614 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span { 615 border-top-right-radius: 4px; 616 } 617 .sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span { 618 border-bottom-right-radius: 4px; 619 } 620 .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu { 621 padding-top: 5px; 622 padding-bottom: 5px; 623 border-bottom-right-radius: 4px; 624 } 625 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right), 626 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu { 627 display: block !important; 628 position: absolute; 629 width: 180px; 630 left: 50px; 631 } 632 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span { 633 top: 0; 634 margin-left: -3px; 635 padding: 12px 5px 12px 20px; 636 background-color: inherit; 637 } 638 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container { 639 position: relative!important; 640 float: right; 641 width: auto!important; 642 left: 180px !important; 643 top: -22px !important; 644 z-index: 900; 645 } 646 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container > .label:not(:first-of-type) { 647 display: none; 648 } 649 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu { 650 top: 44px; 651 margin-left: 0; 652 } 653 .sidebar-mini.sidebar-collapse .main-sidebar .user-panel > .info, 654 .sidebar-mini.sidebar-collapse .sidebar-form, 655 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span, 656 .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu, 657 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .pull-right, 658 .sidebar-mini.sidebar-collapse .sidebar-menu li.header { 659 display: none !important; 660 -webkit-transform: translateZ(0); 661 } 662 .sidebar-mini.sidebar-collapse .main-header .logo { 663 width: 50px; 664 } 665 .sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini { 666 display: block; 667 margin-left: -15px; 668 margin-right: -15px; 669 font-size: 18px; 670 } 671 .sidebar-mini.sidebar-collapse .main-header .logo > .logo-lg { 672 display: none; 673 } 674 .sidebar-mini.sidebar-collapse .main-header .navbar { 675 margin-left: 50px; 676 } 677 } 678 .sidebar-menu, 679 .main-sidebar .user-panel, 680 .sidebar-menu > li.header { 681 white-space: nowrap; 682 overflow: hidden; 683 } 684 .sidebar-menu:hover { 685 overflow: visible; 686 } 687 .sidebar-form, 688 .sidebar-menu > li.header { 689 overflow: hidden; 690 text-overflow: clip; 691 } 692 .sidebar-menu li > a { 693 position: relative; 694 } 695 .sidebar-menu li > a > .pull-right-container { 696 position: absolute; 697 right: 10px; 698 top: 50%; 699 margin-top: -7px; 700 } 701 /* 702 * Component: Control sidebar. By default, this is the right sidebar. 703 */ 704 .control-sidebar-bg { 705 position: fixed; 706 z-index: 1000; 707 bottom: 0; 708 } 709 .control-sidebar-bg, 710 .control-sidebar { 711 top: 0; 712 right: -230px; 713 width: 230px; 714 -webkit-transition: right 0.3s ease-in-out; 715 -o-transition: right 0.3s ease-in-out; 716 transition: right 0.3s ease-in-out; 717 } 718 .control-sidebar { 719 position: absolute; 720 padding-top: 50px; 721 z-index: 1010; 722 } 723 @media (max-width: 768px) { 724 .control-sidebar { 725 padding-top: 100px; 726 } 727 } 728 .control-sidebar > .tab-content { 729 padding: 10px 15px; 730 } 731 .control-sidebar.control-sidebar-open, 732 .control-sidebar.control-sidebar-open + .control-sidebar-bg { 733 right: 0; 734 } 735 .control-sidebar-open .control-sidebar-bg, 736 .control-sidebar-open .control-sidebar { 737 right: 0; 738 } 739 @media (min-width: 768px) { 740 .control-sidebar-open .content-wrapper, 741 .control-sidebar-open .right-side, 742 .control-sidebar-open .main-footer { 743 margin-right: 230px; 744 } 745 } 746 .nav-tabs.control-sidebar-tabs > li:first-of-type > a, 747 .nav-tabs.control-sidebar-tabs > li:first-of-type > a:hover, 748 .nav-tabs.control-sidebar-tabs > li:first-of-type > a:focus { 749 border-left-width: 0; 750 } 751 .nav-tabs.control-sidebar-tabs > li > a { 752 border-radius: 0; 753 } 754 .nav-tabs.control-sidebar-tabs > li > a, 755 .nav-tabs.control-sidebar-tabs > li > a:hover { 756 border-top: none; 757 border-right: none; 758 border-left: 1px solid transparent; 759 border-bottom: 1px solid transparent; 760 } 761 .nav-tabs.control-sidebar-tabs > li > a .icon { 762 font-size: 16px; 763 } 764 .nav-tabs.control-sidebar-tabs > li.active > a, 765 .nav-tabs.control-sidebar-tabs > li.active > a:hover, 766 .nav-tabs.control-sidebar-tabs > li.active > a:focus, 767 .nav-tabs.control-sidebar-tabs > li.active > a:active { 768 border-top: none; 769 border-right: none; 770 border-bottom: none; 771 } 772 @media (max-width: 768px) { 773 .nav-tabs.control-sidebar-tabs { 774 display: table; 775 } 776 .nav-tabs.control-sidebar-tabs > li { 777 display: table-cell; 778 } 779 } 780 .control-sidebar-heading { 781 font-weight: 400; 782 font-size: 16px; 783 padding: 10px 0; 784 margin-bottom: 10px; 785 } 786 .control-sidebar-subheading { 787 display: block; 788 font-weight: 400; 789 font-size: 14px; 790 } 791 .control-sidebar-menu { 792 list-style: none; 793 padding: 0; 794 margin: 0 -15px; 795 } 796 .control-sidebar-menu > li > a { 797 display: block; 798 padding: 10px 15px; 799 } 800 .control-sidebar-menu > li > a:before, 801 .control-sidebar-menu > li > a:after { 802 content: " "; 803 display: table; 804 } 805 .control-sidebar-menu > li > a:after { 806 clear: both; 807 } 808 .control-sidebar-menu > li > a > .control-sidebar-subheading { 809 margin-top: 0; 810 } 811 .control-sidebar-menu .menu-icon { 812 float: left; 813 width: 35px; 814 height: 35px; 815 border-radius: 50%; 816 text-align: center; 817 line-height: 35px; 818 } 819 .control-sidebar-menu .menu-info { 820 margin-left: 45px; 821 margin-top: 3px; 822 } 823 .control-sidebar-menu .menu-info > .control-sidebar-subheading { 824 margin: 0; 825 } 826 .control-sidebar-menu .menu-info > p { 827 margin: 0; 828 font-size: 11px; 829 } 830 .control-sidebar-menu .progress { 831 margin: 0; 832 } 833 .control-sidebar-dark { 834 color: #b8c7ce; 835 } 836 .control-sidebar-dark, 837 .control-sidebar-dark + .control-sidebar-bg { 838 background: #222d32; 839 } 840 .control-sidebar-dark .nav-tabs.control-sidebar-tabs { 841 border-bottom: #1c2529; 842 } 843 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a { 844 background: #181f23; 845 color: #b8c7ce; 846 } 847 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a, 848 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:hover, 849 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:focus { 850 border-left-color: #141a1d; 851 border-bottom-color: #141a1d; 852 } 853 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:hover, 854 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:focus, 855 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:active { 856 background: #1c2529; 857 } 858 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:hover { 859 color: #fff; 860 } 861 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li.active > a, 862 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li.active > a:hover, 863 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li.active > a:focus, 864 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li.active > a:active { 865 background: #222d32; 866 color: #fff; 867 } 868 .control-sidebar-dark .control-sidebar-heading, 869 .control-sidebar-dark .control-sidebar-subheading { 870 color: #fff; 871 } 872 .control-sidebar-dark .control-sidebar-menu > li > a:hover { 873 background: #1e282c; 874 } 875 .control-sidebar-dark .control-sidebar-menu > li > a .menu-info > p { 876 color: #b8c7ce; 877 } 878 .control-sidebar-light { 879 color: #5e5e5e; 880 } 881 .control-sidebar-light, 882 .control-sidebar-light + .control-sidebar-bg { 883 background: #f9fafc; 884 border-left: 1px solid #d2d6de; 885 } 886 .control-sidebar-light .nav-tabs.control-sidebar-tabs { 887 border-bottom: #d2d6de; 888 } 889 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a { 890 background: #e8ecf4; 891 color: #444444; 892 } 893 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a, 894 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:hover, 895 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:focus { 896 border-left-color: #d2d6de; 897 border-bottom-color: #d2d6de; 898 } 899 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:hover, 900 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:focus, 901 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:active { 902 background: #eff1f7; 903 } 904 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li.active > a, 905 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li.active > a:hover, 906 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li.active > a:focus, 907 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li.active > a:active { 908 background: #f9fafc; 909 color: #111; 910 } 911 .control-sidebar-light .control-sidebar-heading, 912 .control-sidebar-light .control-sidebar-subheading { 913 color: #111; 914 } 915 .control-sidebar-light .control-sidebar-menu { 916 margin-left: -14px; 917 } 918 .control-sidebar-light .control-sidebar-menu > li > a:hover { 919 background: #f4f4f5; 920 } 921 .control-sidebar-light .control-sidebar-menu > li > a .menu-info > p { 922 color: #5e5e5e; 923 } 924 /* 925 * Component: Dropdown menus 926 * ------------------------- 927 */ 928 /*Dropdowns in general*/ 929 .dropdown-menu { 930 box-shadow: none; 931 border-color: #eee; 932 } 933 .dropdown-menu > li > a { 934 color: #777; 935 } 936 .dropdown-menu > li > a > .glyphicon, 937 .dropdown-menu > li > a > .fa, 938 .dropdown-menu > li > a > .ion { 939 margin-right: 10px; 940 } 941 .dropdown-menu > li > a:hover { 942 background-color: #e1e3e9; 943 color: #333; 944 } 945 .dropdown-menu > .divider { 946 background-color: #eee; 947 } 948 .navbar-nav > .notifications-menu > .dropdown-menu, 949 .navbar-nav > .messages-menu > .dropdown-menu, 950 .navbar-nav > .tasks-menu > .dropdown-menu { 951 width: 280px; 952 padding: 0 0 0 0; 953 margin: 0; 954 top: 100%; 955 } 956 .navbar-nav > .notifications-menu > .dropdown-menu > li, 957 .navbar-nav > .messages-menu > .dropdown-menu > li, 958 .navbar-nav > .tasks-menu > .dropdown-menu > li { 959 position: relative; 960 } 961 .navbar-nav > .notifications-menu > .dropdown-menu > li.header, 962 .navbar-nav > .messages-menu > .dropdown-menu > li.header, 963 .navbar-nav > .tasks-menu > .dropdown-menu > li.header { 964 border-top-left-radius: 4px; 965 border-top-right-radius: 4px; 966 border-bottom-right-radius: 0; 967 border-bottom-left-radius: 0; 968 background-color: #ffffff; 969 padding: 7px 10px; 970 border-bottom: 1px solid #f4f4f4; 971 color: #444444; 972 font-size: 14px; 973 } 974 .navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a, 975 .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a, 976 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a { 977 border-top-left-radius: 0; 978 border-top-right-radius: 0; 979 border-bottom-right-radius: 4px; 980 border-bottom-left-radius: 4px; 981 font-size: 12px; 982 background-color: #fff; 983 padding: 7px 10px; 984 border-bottom: 1px solid #eeeeee; 985 color: #444 !important; 986 text-align: center; 987 } 988 @media (max-width: 991px) { 989 .navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a, 990 .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a, 991 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a { 992 background: #fff !important; 993 color: #444 !important; 994 } 995 } 996 .navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a:hover, 997 .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a:hover, 998 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a:hover { 999 text-decoration: none; 1000 font-weight: normal; 1001 } 1002 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu, 1003 .navbar-nav > .messages-menu > .dropdown-menu > li .menu, 1004 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu { 1005 max-height: 200px; 1006 margin: 0; 1007 padding: 0; 1008 list-style: none; 1009 overflow-x: hidden; 1010 } 1011 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a, 1012 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a, 1013 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a { 1014 display: block; 1015 white-space: nowrap; 1016 /* Prevent text from breaking */ 1017 border-bottom: 1px solid #f4f4f4; 1018 } 1019 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a:hover, 1020 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover, 1021 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a:hover { 1022 background: #f4f4f4; 1023 text-decoration: none; 1024 } 1025 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a { 1026 color: #444444; 1027 overflow: hidden; 1028 text-overflow: ellipsis; 1029 padding: 10px; 1030 } 1031 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon, 1032 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa, 1033 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion { 1034 width: 20px; 1035 } 1036 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a { 1037 margin: 0; 1038 padding: 10px 10px; 1039 } 1040 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > div > img { 1041 margin: auto 10px auto auto; 1042 width: 40px; 1043 height: 40px; 1044 } 1045 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 { 1046 padding: 0; 1047 margin: 0 0 0 45px; 1048 color: #444444; 1049 font-size: 15px; 1050 position: relative; 1051 } 1052 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 > small { 1053 color: #999999; 1054 font-size: 10px; 1055 position: absolute; 1056 top: 0; 1057 right: 0; 1058 } 1059 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > p { 1060 margin: 0 0 0 45px; 1061 font-size: 12px; 1062 color: #888888; 1063 } 1064 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:before, 1065 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after { 1066 content: " "; 1067 display: table; 1068 } 1069 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after { 1070 clear: both; 1071 } 1072 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a { 1073 padding: 10px; 1074 } 1075 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > h3 { 1076 font-size: 14px; 1077 padding: 0; 1078 margin: 0 0 10px 0; 1079 color: #666666; 1080 } 1081 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > .progress { 1082 padding: 0; 1083 margin: 0; 1084 } 1085 .navbar-nav > .user-menu > .dropdown-menu { 1086 border-top-right-radius: 0; 1087 border-top-left-radius: 0; 1088 padding: 1px 0 0 0; 1089 border-top-width: 0; 1090 width: 280px; 1091 } 1092 .navbar-nav > .user-menu > .dropdown-menu, 1093 .navbar-nav > .user-menu > .dropdown-menu > .user-body { 1094 border-bottom-right-radius: 4px; 1095 border-bottom-left-radius: 4px; 1096 } 1097 .navbar-nav > .user-menu > .dropdown-menu > li.user-header { 1098 height: 175px; 1099 padding: 10px; 1100 text-align: center; 1101 } 1102 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > img { 1103 z-index: 5; 1104 height: 90px; 1105 width: 90px; 1106 border: 3px solid; 1107 border-color: transparent; 1108 border-color: rgba(255, 255, 255, 0.2); 1109 } 1110 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > p { 1111 z-index: 5; 1112 color: #fff; 1113 color: rgba(255, 255, 255, 0.8); 1114 font-size: 17px; 1115 margin-top: 10px; 1116 } 1117 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > small { 1118 display: block; 1119 font-size: 12px; 1120 } 1121 .navbar-nav > .user-menu > .dropdown-menu > .user-body { 1122 padding: 15px; 1123 border-bottom: 1px solid #f4f4f4; 1124 border-top: 1px solid #dddddd; 1125 } 1126 .navbar-nav > .user-menu > .dropdown-menu > .user-body:before, 1127 .navbar-nav > .user-menu > .dropdown-menu > .user-body:after { 1128 content: " "; 1129 display: table; 1130 } 1131 .navbar-nav > .user-menu > .dropdown-menu > .user-body:after { 1132 clear: both; 1133 } 1134 .navbar-nav > .user-menu > .dropdown-menu > .user-body a { 1135 color: #444 !important; 1136 } 1137 @media (max-width: 991px) { 1138 .navbar-nav > .user-menu > .dropdown-menu > .user-body a { 1139 background: #fff !important; 1140 color: #444 !important; 1141 } 1142 } 1143 .navbar-nav > .user-menu > .dropdown-menu > .user-footer { 1144 background-color: #f9f9f9; 1145 padding: 10px; 1146 } 1147 .navbar-nav > .user-menu > .dropdown-menu > .user-footer:before, 1148 .navbar-nav > .user-menu > .dropdown-menu > .user-footer:after { 1149 content: " "; 1150 display: table; 1151 } 1152 .navbar-nav > .user-menu > .dropdown-menu > .user-footer:after { 1153 clear: both; 1154 } 1155 .navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default { 1156 color: #666666; 1157 } 1158 @media (max-width: 991px) { 1159 .navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default:hover { 1160 background-color: #f9f9f9; 1161 } 1162 } 1163 .navbar-nav > .user-menu .user-image { 1164 float: left; 1165 width: 25px; 1166 height: 25px; 1167 border-radius: 50%; 1168 margin-right: 10px; 1169 margin-top: -2px; 1170 } 1171 @media (max-width: 767px) { 1172 .navbar-nav > .user-menu .user-image { 1173 float: none; 1174 margin-right: 0; 1175 margin-top: -8px; 1176 line-height: 10px; 1177 } 1178 } 1179 /* Add fade animation to dropdown menus by appending 1180 the class .animated-dropdown-menu to the .dropdown-menu ul (or ol)*/ 1181 .open:not(.dropup) > .animated-dropdown-menu { 1182 backface-visibility: visible !important; 1183 -webkit-animation: flipInX 0.7s both; 1184 -o-animation: flipInX 0.7s both; 1185 animation: flipInX 0.7s both; 1186 } 1187 @keyframes flipInX { 1188 0% { 1189 transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 1190 transition-timing-function: ease-in; 1191 opacity: 0; 1192 } 1193 40% { 1194 transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 1195 transition-timing-function: ease-in; 1196 } 1197 60% { 1198 transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 1199 opacity: 1; 1200 } 1201 80% { 1202 transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 1203 } 1204 100% { 1205 transform: perspective(400px); 1206 } 1207 } 1208 @-webkit-keyframes flipInX { 1209 0% { 1210 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); 1211 -webkit-transition-timing-function: ease-in; 1212 opacity: 0; 1213 } 1214 40% { 1215 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); 1216 -webkit-transition-timing-function: ease-in; 1217 } 1218 60% { 1219 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); 1220 opacity: 1; 1221 } 1222 80% { 1223 -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); 1224 } 1225 100% { 1226 -webkit-transform: perspective(400px); 1227 } 1228 } 1229 /* Fix dropdown menu in navbars */ 1230 .navbar-custom-menu > .navbar-nav > li { 1231 position: relative; 1232 } 1233 .navbar-custom-menu > .navbar-nav > li > .dropdown-menu { 1234 position: absolute; 1235 right: 0; 1236 left: auto; 1237 } 1238 @media (max-width: 991px) { 1239 .navbar-custom-menu > .navbar-nav { 1240 float: right; 1241 } 1242 .navbar-custom-menu > .navbar-nav > li { 1243 position: static; 1244 } 1245 .navbar-custom-menu > .navbar-nav > li > .dropdown-menu { 1246 position: absolute; 1247 right: 5%; 1248 left: auto; 1249 border: 1px solid #ddd; 1250 background: #fff; 1251 } 1252 } 1253 /* 1254 * Component: Form 1255 * --------------- 1256 */ 1257 .form-control { 1258 border-radius: 0; 1259 box-shadow: none; 1260 border-color: #d2d6de; 1261 } 1262 .form-control:focus { 1263 border-color: #3c8dbc; 1264 box-shadow: none; 1265 } 1266 .form-control::-moz-placeholder, 1267 .form-control:-ms-input-placeholder, 1268 .form-control::-webkit-input-placeholder { 1269 color: #bbb; 1270 opacity: 1; 1271 } 1272 .form-control:not(select) { 1273 -webkit-appearance: none; 1274 -moz-appearance: none; 1275 appearance: none; 1276 } 1277 .form-group.has-success label { 1278 color: #00a65a; 1279 } 1280 .form-group.has-success .form-control, 1281 .form-group.has-success .input-group-addon { 1282 border-color: #00a65a; 1283 box-shadow: none; 1284 } 1285 .form-group.has-success .help-block { 1286 color: #00a65a; 1287 } 1288 .form-group.has-warning label { 1289 color: #f39c12; 1290 } 1291 .form-group.has-warning .form-control, 1292 .form-group.has-warning .input-group-addon { 1293 border-color: #f39c12; 1294 box-shadow: none; 1295 } 1296 .form-group.has-warning .help-block { 1297 color: #f39c12; 1298 } 1299 .form-group.has-error label { 1300 color: #dd4b39; 1301 } 1302 .form-group.has-error .form-control, 1303 .form-group.has-error .input-group-addon { 1304 border-color: #dd4b39; 1305 box-shadow: none; 1306 } 1307 .form-group.has-error .help-block { 1308 color: #dd4b39; 1309 } 1310 /* Input group */ 1311 .input-group .input-group-addon { 1312 border-radius: 0; 1313 border-color: #d2d6de; 1314 background-color: #fff; 1315 } 1316 /* button groups */ 1317 .btn-group-vertical .btn.btn-flat:first-of-type, 1318 .btn-group-vertical .btn.btn-flat:last-of-type { 1319 border-radius: 0; 1320 } 1321 .icheck > label { 1322 padding-left: 0; 1323 } 1324 /* support Font Awesome icons in form-control */ 1325 .form-control-feedback.fa { 1326 line-height: 34px; 1327 } 1328 .input-lg + .form-control-feedback.fa, 1329 .input-group-lg + .form-control-feedback.fa, 1330 .form-group-lg .form-control + .form-control-feedback.fa { 1331 line-height: 46px; 1332 } 1333 .input-sm + .form-control-feedback.fa, 1334 .input-group-sm + .form-control-feedback.fa, 1335 .form-group-sm .form-control + .form-control-feedback.fa { 1336 line-height: 30px; 1337 } 1338 /* 1339 * Component: Progress Bar 1340 * ----------------------- 1341 */ 1342 .progress, 1343 .progress > .progress-bar { 1344 -webkit-box-shadow: none; 1345 box-shadow: none; 1346 } 1347 .progress, 1348 .progress > .progress-bar, 1349 .progress .progress-bar, 1350 .progress > .progress-bar .progress-bar { 1351 border-radius: 1px; 1352 } 1353 /* size variation */ 1354 .progress.sm, 1355 .progress-sm { 1356 height: 10px; 1357 } 1358 .progress.sm, 1359 .progress-sm, 1360 .progress.sm .progress-bar, 1361 .progress-sm .progress-bar { 1362 border-radius: 1px; 1363 } 1364 .progress.xs, 1365 .progress-xs { 1366 height: 7px; 1367 } 1368 .progress.xs, 1369 .progress-xs, 1370 .progress.xs .progress-bar, 1371 .progress-xs .progress-bar { 1372 border-radius: 1px; 1373 } 1374 .progress.xxs, 1375 .progress-xxs { 1376 height: 3px; 1377 } 1378 .progress.xxs, 1379 .progress-xxs, 1380 .progress.xxs .progress-bar, 1381 .progress-xxs .progress-bar { 1382 border-radius: 1px; 1383 } 1384 /* Vertical bars */ 1385 .progress.vertical { 1386 position: relative; 1387 width: 30px; 1388 height: 200px; 1389 display: inline-block; 1390 margin-right: 10px; 1391 } 1392 .progress.vertical > .progress-bar { 1393 width: 100%; 1394 position: absolute; 1395 bottom: 0; 1396 } 1397 .progress.vertical.sm, 1398 .progress.vertical.progress-sm { 1399 width: 20px; 1400 } 1401 .progress.vertical.xs, 1402 .progress.vertical.progress-xs { 1403 width: 10px; 1404 } 1405 .progress.vertical.xxs, 1406 .progress.vertical.progress-xxs { 1407 width: 3px; 1408 } 1409 .progress-group .progress-text { 1410 font-weight: 600; 1411 } 1412 .progress-group .progress-number { 1413 float: right; 1414 } 1415 /* Remove margins from progress bars when put in a table */ 1416 .table tr > td .progress { 1417 margin: 0; 1418 } 1419 .progress-bar-light-blue, 1420 .progress-bar-primary { 1421 background-color: #3c8dbc; 1422 } 1423 .progress-striped .progress-bar-light-blue, 1424 .progress-striped .progress-bar-primary { 1425 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1426 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1427 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1428 } 1429 .progress-bar-green, 1430 .progress-bar-success { 1431 background-color: #00a65a; 1432 } 1433 .progress-striped .progress-bar-green, 1434 .progress-striped .progress-bar-success { 1435 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1436 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1437 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1438 } 1439 .progress-bar-aqua, 1440 .progress-bar-info { 1441 background-color: #00c0ef; 1442 } 1443 .progress-striped .progress-bar-aqua, 1444 .progress-striped .progress-bar-info { 1445 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1446 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1447 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1448 } 1449 .progress-bar-yellow, 1450 .progress-bar-warning { 1451 background-color: #f39c12; 1452 } 1453 .progress-striped .progress-bar-yellow, 1454 .progress-striped .progress-bar-warning { 1455 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1456 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1457 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1458 } 1459 .progress-bar-red, 1460 .progress-bar-danger { 1461 background-color: #dd4b39; 1462 } 1463 .progress-striped .progress-bar-red, 1464 .progress-striped .progress-bar-danger { 1465 background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1466 background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1467 background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); 1468 } 1469 /* 1470 * Component: Small Box 1471 * -------------------- 1472 */ 1473 .small-box { 1474 border-radius: 2px; 1475 position: relative; 1476 display: block; 1477 margin-bottom: 20px; 1478 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 1479 } 1480 .small-box > .inner { 1481 padding: 10px; 1482 } 1483 .small-box > .small-box-footer { 1484 position: relative; 1485 text-align: center; 1486 padding: 3px 0; 1487 color: #fff; 1488 color: rgba(255, 255, 255, 0.8); 1489 display: block; 1490 z-index: 10; 1491 background: rgba(0, 0, 0, 0.1); 1492 text-decoration: none; 1493 } 1494 .small-box > .small-box-footer:hover { 1495 color: #fff; 1496 background: rgba(0, 0, 0, 0.15); 1497 } 1498 .small-box h3 { 1499 font-size: 38px; 1500 font-weight: bold; 1501 margin: 0 0 10px 0; 1502 white-space: nowrap; 1503 padding: 0; 1504 } 1505 .small-box p { 1506 font-size: 15px; 1507 } 1508 .small-box p > small { 1509 display: block; 1510 color: #f9f9f9; 1511 font-size: 13px; 1512 margin-top: 5px; 1513 } 1514 .small-box h3, 1515 .small-box p { 1516 z-index: 5; 1517 } 1518 .small-box .icon { 1519 -webkit-transition: all 0.3s linear; 1520 -o-transition: all 0.3s linear; 1521 transition: all 0.3s linear; 1522 position: absolute; 1523 top: -10px; 1524 right: 10px; 1525 z-index: 0; 1526 font-size: 90px; 1527 color: rgba(0, 0, 0, 0.15); 1528 } 1529 .small-box:hover { 1530 text-decoration: none; 1531 color: #f9f9f9; 1532 } 1533 .small-box:hover .icon { 1534 font-size: 95px; 1535 } 1536 @media (max-width: 767px) { 1537 .small-box { 1538 text-align: center; 1539 } 1540 .small-box .icon { 1541 display: none; 1542 } 1543 .small-box p { 1544 font-size: 12px; 1545 } 1546 } 1547 /* 1548 * Component: Box 1549 * -------------- 1550 */ 1551 .box { 1552 position: relative; 1553 border-radius: 3px; 1554 background: #ffffff; 1555 border-top: 3px solid #d2d6de; 1556 margin-bottom: 20px; 1557 width: 100%; 1558 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 1559 } 1560 .box.box-primary { 1561 border-top-color: #3c8dbc; 1562 } 1563 .box.box-info { 1564 border-top-color: #00c0ef; 1565 } 1566 .box.box-danger { 1567 border-top-color: #dd4b39; 1568 } 1569 .box.box-warning { 1570 border-top-color: #f39c12; 1571 } 1572 .box.box-success { 1573 border-top-color: #00a65a; 1574 } 1575 .box.box-default { 1576 border-top-color: #d2d6de; 1577 } 1578 .box.collapsed-box .box-body, 1579 .box.collapsed-box .box-footer { 1580 display: none; 1581 } 1582 .box .nav-stacked > li { 1583 border-bottom: 1px solid #f4f4f4; 1584 margin: 0; 1585 } 1586 .box .nav-stacked > li:last-of-type { 1587 border-bottom: none; 1588 } 1589 .box.height-control .box-body { 1590 max-height: 300px; 1591 overflow: auto; 1592 } 1593 .box .border-right { 1594 border-right: 1px solid #f4f4f4; 1595 } 1596 .box .border-left { 1597 border-left: 1px solid #f4f4f4; 1598 } 1599 .box.box-solid { 1600 border-top: 0; 1601 } 1602 .box.box-solid > .box-header .btn.btn-default { 1603 background: transparent; 1604 } 1605 .box.box-solid > .box-header .btn:hover, 1606 .box.box-solid > .box-header a:hover { 1607 background: rgba(0, 0, 0, 0.1); 1608 } 1609 .box.box-solid.box-default { 1610 border: 1px solid #d2d6de; 1611 } 1612 .box.box-solid.box-default > .box-header { 1613 color: #444444; 1614 background: #d2d6de; 1615 background-color: #d2d6de; 1616 } 1617 .box.box-solid.box-default > .box-header a, 1618 .box.box-solid.box-default > .box-header .btn { 1619 color: #444444; 1620 } 1621 .box.box-solid.box-primary { 1622 border: 1px solid #3c8dbc; 1623 } 1624 .box.box-solid.box-primary > .box-header { 1625 color: #ffffff; 1626 background: #3c8dbc; 1627 background-color: #3c8dbc; 1628 } 1629 .box.box-solid.box-primary > .box-header a, 1630 .box.box-solid.box-primary > .box-header .btn { 1631 color: #ffffff; 1632 } 1633 .box.box-solid.box-info { 1634 border: 1px solid #00c0ef; 1635 } 1636 .box.box-solid.box-info > .box-header { 1637 color: #ffffff; 1638 background: #00c0ef; 1639 background-color: #00c0ef; 1640 } 1641 .box.box-solid.box-info > .box-header a, 1642 .box.box-solid.box-info > .box-header .btn { 1643 color: #ffffff; 1644 } 1645 .box.box-solid.box-danger { 1646 border: 1px solid #dd4b39; 1647 } 1648 .box.box-solid.box-danger > .box-header { 1649 color: #ffffff; 1650 background: #dd4b39; 1651 background-color: #dd4b39; 1652 } 1653 .box.box-solid.box-danger > .box-header a, 1654 .box.box-solid.box-danger > .box-header .btn { 1655 color: #ffffff; 1656 } 1657 .box.box-solid.box-warning { 1658 border: 1px solid #f39c12; 1659 } 1660 .box.box-solid.box-warning > .box-header { 1661 color: #ffffff; 1662 background: #f39c12; 1663 background-color: #f39c12; 1664 } 1665 .box.box-solid.box-warning > .box-header a, 1666 .box.box-solid.box-warning > .box-header .btn { 1667 color: #ffffff; 1668 } 1669 .box.box-solid.box-success { 1670 border: 1px solid #00a65a; 1671 } 1672 .box.box-solid.box-success > .box-header { 1673 color: #ffffff; 1674 background: #00a65a; 1675 background-color: #00a65a; 1676 } 1677 .box.box-solid.box-success > .box-header a, 1678 .box.box-solid.box-success > .box-header .btn { 1679 color: #ffffff; 1680 } 1681 .box.box-solid > .box-header > .box-tools .btn { 1682 border: 0; 1683 box-shadow: none; 1684 } 1685 .box.box-solid[class*='bg'] > .box-header { 1686 color: #fff; 1687 } 1688 .box .box-group > .box { 1689 margin-bottom: 5px; 1690 } 1691 .box .knob-label { 1692 text-align: center; 1693 color: #333; 1694 font-weight: 100; 1695 font-size: 12px; 1696 margin-bottom: 0.3em; 1697 } 1698 .box > .overlay, 1699 .overlay-wrapper > .overlay, 1700 .box > .loading-img, 1701 .overlay-wrapper > .loading-img { 1702 position: absolute; 1703 top: 0; 1704 left: 0; 1705 width: 100%; 1706 height: 100%; 1707 } 1708 .box .overlay, 1709 .overlay-wrapper .overlay { 1710 z-index: 50; 1711 background: rgba(255, 255, 255, 0.7); 1712 border-radius: 3px; 1713 } 1714 .box .overlay > .fa, 1715 .overlay-wrapper .overlay > .fa { 1716 position: absolute; 1717 top: 50%; 1718 left: 50%; 1719 margin-left: -15px; 1720 margin-top: -15px; 1721 color: #000; 1722 font-size: 30px; 1723 } 1724 .box .overlay.dark, 1725 .overlay-wrapper .overlay.dark { 1726 background: rgba(0, 0, 0, 0.5); 1727 } 1728 .box-header:before, 1729 .box-body:before, 1730 .box-footer:before, 1731 .box-header:after, 1732 .box-body:after, 1733 .box-footer:after { 1734 content: " "; 1735 display: table; 1736 } 1737 .box-header:after, 1738 .box-body:after, 1739 .box-footer:after { 1740 clear: both; 1741 } 1742 .box-header { 1743 color: #444; 1744 display: block; 1745 padding: 10px; 1746 position: relative; 1747 } 1748 .box-header.with-border { 1749 border-bottom: 1px solid #f4f4f4; 1750 } 1751 .collapsed-box .box-header.with-border { 1752 border-bottom: none; 1753 } 1754 .box-header > .fa, 1755 .box-header > .glyphicon, 1756 .box-header > .ion, 1757 .box-header .box-title { 1758 display: inline-block; 1759 font-size: 18px; 1760 margin: 0; 1761 line-height: 1; 1762 } 1763 .box-header > .fa, 1764 .box-header > .glyphicon, 1765 .box-header > .ion { 1766 margin-right: 5px; 1767 } 1768 .box-header > .box-tools { 1769 position: absolute; 1770 right: 10px; 1771 top: 5px; 1772 } 1773 .box-header > .box-tools [data-toggle="tooltip"] { 1774 position: relative; 1775 } 1776 .box-header > .box-tools.pull-right .dropdown-menu { 1777 right: 0; 1778 left: auto; 1779 } 1780 .box-header > .box-tools .dropdown-menu > li > a { 1781 color: #444!important; 1782 } 1783 .btn-box-tool { 1784 padding: 5px; 1785 font-size: 12px; 1786 background: transparent; 1787 color: #97a0b3; 1788 } 1789 .open .btn-box-tool, 1790 .btn-box-tool:hover { 1791 color: #606c84; 1792 } 1793 .btn-box-tool.btn:active { 1794 box-shadow: none; 1795 } 1796 .box-body { 1797 border-top-left-radius: 0; 1798 border-top-right-radius: 0; 1799 border-bottom-right-radius: 3px; 1800 border-bottom-left-radius: 3px; 1801 padding: 10px; 1802 } 1803 .no-header .box-body { 1804 border-top-right-radius: 3px; 1805 border-top-left-radius: 3px; 1806 } 1807 .box-body > .table { 1808 margin-bottom: 0; 1809 } 1810 .box-body .fc { 1811 margin-top: 5px; 1812 } 1813 .box-body .full-width-chart { 1814 margin: -19px; 1815 } 1816 .box-body.no-padding .full-width-chart { 1817 margin: -9px; 1818 } 1819 .box-body .box-pane { 1820 border-top-left-radius: 0; 1821 border-top-right-radius: 0; 1822 border-bottom-right-radius: 0; 1823 border-bottom-left-radius: 3px; 1824 } 1825 .box-body .box-pane-right { 1826 border-top-left-radius: 0; 1827 border-top-right-radius: 0; 1828 border-bottom-right-radius: 3px; 1829 border-bottom-left-radius: 0; 1830 } 1831 .box-footer { 1832 border-top-left-radius: 0; 1833 border-top-right-radius: 0; 1834 border-bottom-right-radius: 3px; 1835 border-bottom-left-radius: 3px; 1836 border-top: 1px solid #f4f4f4; 1837 padding: 10px; 1838 background-color: #ffffff; 1839 } 1840 .chart-legend { 1841 margin: 10px 0; 1842 } 1843 @media (max-width: 991px) { 1844 .chart-legend > li { 1845 float: left; 1846 margin-right: 10px; 1847 } 1848 } 1849 .box-comments { 1850 background: #f7f7f7; 1851 } 1852 .box-comments .box-comment { 1853 padding: 8px 0; 1854 border-bottom: 1px solid #eee; 1855 } 1856 .box-comments .box-comment:before, 1857 .box-comments .box-comment:after { 1858 content: " "; 1859 display: table; 1860 } 1861 .box-comments .box-comment:after { 1862 clear: both; 1863 } 1864 .box-comments .box-comment:last-of-type { 1865 border-bottom: 0; 1866 } 1867 .box-comments .box-comment:first-of-type { 1868 padding-top: 0; 1869 } 1870 .box-comments .box-comment img { 1871 float: left; 1872 } 1873 .box-comments .comment-text { 1874 margin-left: 40px; 1875 color: #555; 1876 } 1877 .box-comments .username { 1878 color: #444; 1879 display: block; 1880 font-weight: 600; 1881 } 1882 .box-comments .text-muted { 1883 font-weight: 400; 1884 font-size: 12px; 1885 } 1886 /* Widget: TODO LIST */ 1887 .todo-list { 1888 margin: 0; 1889 padding: 0; 1890 list-style: none; 1891 overflow: auto; 1892 } 1893 .todo-list > li { 1894 border-radius: 2px; 1895 padding: 10px; 1896 background: #f4f4f4; 1897 margin-bottom: 2px; 1898 border-left: 2px solid #e6e7e8; 1899 color: #444; 1900 } 1901 .todo-list > li:last-of-type { 1902 margin-bottom: 0; 1903 } 1904 .todo-list > li > input[type='checkbox'] { 1905 margin: 0 10px 0 5px; 1906 } 1907 .todo-list > li .text { 1908 display: inline-block; 1909 margin-left: 5px; 1910 font-weight: 600; 1911 } 1912 .todo-list > li .label { 1913 margin-left: 10px; 1914 font-size: 9px; 1915 } 1916 .todo-list > li .tools { 1917 display: none; 1918 float: right; 1919 color: #dd4b39; 1920 } 1921 .todo-list > li .tools > .fa, 1922 .todo-list > li .tools > .glyphicon, 1923 .todo-list > li .tools > .ion { 1924 margin-right: 5px; 1925 cursor: pointer; 1926 } 1927 .todo-list > li:hover .tools { 1928 display: inline-block; 1929 } 1930 .todo-list > li.done { 1931 color: #999; 1932 } 1933 .todo-list > li.done .text { 1934 text-decoration: line-through; 1935 font-weight: 500; 1936 } 1937 .todo-list > li.done .label { 1938 background: #d2d6de !important; 1939 } 1940 .todo-list .danger { 1941 border-left-color: #dd4b39; 1942 } 1943 .todo-list .warning { 1944 border-left-color: #f39c12; 1945 } 1946 .todo-list .info { 1947 border-left-color: #00c0ef; 1948 } 1949 .todo-list .success { 1950 border-left-color: #00a65a; 1951 } 1952 .todo-list .primary { 1953 border-left-color: #3c8dbc; 1954 } 1955 .todo-list .handle { 1956 display: inline-block; 1957 cursor: move; 1958 margin: 0 5px; 1959 } 1960 /* Chat widget (DEPRECATED - this will be removed in the next major release. Use Direct Chat instead)*/ 1961 .chat { 1962 padding: 5px 20px 5px 10px; 1963 } 1964 .chat .item { 1965 margin-bottom: 10px; 1966 } 1967 .chat .item:before, 1968 .chat .item:after { 1969 content: " "; 1970 display: table; 1971 } 1972 .chat .item:after { 1973 clear: both; 1974 } 1975 .chat .item > img { 1976 width: 40px; 1977 height: 40px; 1978 border: 2px solid transparent; 1979 border-radius: 50%; 1980 } 1981 .chat .item > .online { 1982 border: 2px solid #00a65a; 1983 } 1984 .chat .item > .offline { 1985 border: 2px solid #dd4b39; 1986 } 1987 .chat .item > .message { 1988 margin-left: 55px; 1989 margin-top: -40px; 1990 } 1991 .chat .item > .message > .name { 1992 display: block; 1993 font-weight: 600; 1994 } 1995 .chat .item > .attachment { 1996 border-radius: 3px; 1997 background: #f4f4f4; 1998 margin-left: 65px; 1999 margin-right: 15px; 2000 padding: 10px; 2001 } 2002 .chat .item > .attachment > h4 { 2003 margin: 0 0 5px 0; 2004 font-weight: 600; 2005 font-size: 14px; 2006 } 2007 .chat .item > .attachment > p, 2008 .chat .item > .attachment > .filename { 2009 font-weight: 600; 2010 font-size: 13px; 2011 font-style: italic; 2012 margin: 0; 2013 } 2014 .chat .item > .attachment:before, 2015 .chat .item > .attachment:after { 2016 content: " "; 2017 display: table; 2018 } 2019 .chat .item > .attachment:after { 2020 clear: both; 2021 } 2022 .box-input { 2023 max-width: 200px; 2024 } 2025 .modal .panel-body { 2026 color: #444; 2027 } 2028 /* 2029 * Component: Info Box 2030 * ------------------- 2031 */ 2032 .info-box { 2033 display: block; 2034 min-height: 90px; 2035 background: #fff; 2036 width: 100%; 2037 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2038 border-radius: 2px; 2039 margin-bottom: 15px; 2040 } 2041 .info-box small { 2042 font-size: 14px; 2043 } 2044 .info-box .progress { 2045 background: rgba(0, 0, 0, 0.2); 2046 margin: 5px -10px 5px -10px; 2047 height: 2px; 2048 } 2049 .info-box .progress, 2050 .info-box .progress .progress-bar { 2051 border-radius: 0; 2052 } 2053 .info-box .progress .progress-bar { 2054 background: #fff; 2055 } 2056 .info-box-icon { 2057 border-top-left-radius: 2px; 2058 border-top-right-radius: 0; 2059 border-bottom-right-radius: 0; 2060 border-bottom-left-radius: 2px; 2061 display: block; 2062 float: left; 2063 height: 90px; 2064 width: 90px; 2065 text-align: center; 2066 font-size: 45px; 2067 line-height: 90px; 2068 background: rgba(0, 0, 0, 0.2); 2069 } 2070 .info-box-icon > img { 2071 max-width: 100%; 2072 } 2073 .info-box-content { 2074 padding: 5px 10px; 2075 margin-left: 90px; 2076 } 2077 .info-box-number { 2078 display: block; 2079 font-weight: bold; 2080 font-size: 18px; 2081 } 2082 .progress-description, 2083 .info-box-text { 2084 display: block; 2085 font-size: 14px; 2086 white-space: nowrap; 2087 overflow: hidden; 2088 text-overflow: ellipsis; 2089 } 2090 .info-box-text { 2091 text-transform: uppercase; 2092 } 2093 .info-box-more { 2094 display: block; 2095 } 2096 .progress-description { 2097 margin: 0; 2098 } 2099 /* 2100 * Component: Timeline 2101 * ------------------- 2102 */ 2103 .timeline { 2104 position: relative; 2105 margin: 0 0 30px 0; 2106 padding: 0; 2107 list-style: none; 2108 } 2109 .timeline:before { 2110 content: ''; 2111 position: absolute; 2112 top: 0; 2113 bottom: 0; 2114 width: 4px; 2115 background: #ddd; 2116 left: 31px; 2117 margin: 0; 2118 border-radius: 2px; 2119 } 2120 .timeline > li { 2121 position: relative; 2122 margin-right: 10px; 2123 margin-bottom: 15px; 2124 } 2125 .timeline > li:before, 2126 .timeline > li:after { 2127 content: " "; 2128 display: table; 2129 } 2130 .timeline > li:after { 2131 clear: both; 2132 } 2133 .timeline > li > .timeline-item { 2134 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2135 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2136 border-radius: 3px; 2137 margin-top: 0; 2138 background: #fff; 2139 color: #444; 2140 margin-left: 60px; 2141 margin-right: 15px; 2142 padding: 0; 2143 position: relative; 2144 } 2145 .timeline > li > .timeline-item > .time { 2146 color: #999; 2147 float: right; 2148 padding: 10px; 2149 font-size: 12px; 2150 } 2151 .timeline > li > .timeline-item > .timeline-header { 2152 margin: 0; 2153 color: #555; 2154 border-bottom: 1px solid #f4f4f4; 2155 padding: 10px; 2156 font-size: 16px; 2157 line-height: 1.1; 2158 } 2159 .timeline > li > .timeline-item > .timeline-header > a { 2160 font-weight: 600; 2161 } 2162 .timeline > li > .timeline-item > .timeline-body, 2163 .timeline > li > .timeline-item > .timeline-footer { 2164 padding: 10px; 2165 } 2166 .timeline > li > .fa, 2167 .timeline > li > .glyphicon, 2168 .timeline > li > .ion { 2169 width: 30px; 2170 height: 30px; 2171 font-size: 15px; 2172 line-height: 30px; 2173 position: absolute; 2174 color: #666; 2175 background: #d2d6de; 2176 border-radius: 50%; 2177 text-align: center; 2178 left: 18px; 2179 top: 0; 2180 } 2181 .timeline > .time-label > span { 2182 font-weight: 600; 2183 padding: 5px; 2184 display: inline-block; 2185 background-color: #fff; 2186 border-radius: 4px; 2187 } 2188 .timeline-inverse > li > .timeline-item { 2189 background: #f0f0f0; 2190 border: 1px solid #ddd; 2191 -webkit-box-shadow: none; 2192 box-shadow: none; 2193 } 2194 .timeline-inverse > li > .timeline-item > .timeline-header { 2195 border-bottom-color: #ddd; 2196 } 2197 /* 2198 * Component: Button 2199 * ----------------- 2200 */ 2201 .btn { 2202 border-radius: 3px; 2203 -webkit-box-shadow: none; 2204 box-shadow: none; 2205 border: 1px solid transparent; 2206 } 2207 .btn.uppercase { 2208 text-transform: uppercase; 2209 } 2210 .btn.btn-flat { 2211 border-radius: 0; 2212 -webkit-box-shadow: none; 2213 -moz-box-shadow: none; 2214 box-shadow: none; 2215 border-width: 1px; 2216 } 2217 .btn:active { 2218 -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2219 -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2220 box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2221 } 2222 .btn:focus { 2223 outline: none; 2224 } 2225 .btn.btn-file { 2226 position: relative; 2227 overflow: hidden; 2228 } 2229 .btn.btn-file > input[type='file'] { 2230 position: absolute; 2231 top: 0; 2232 right: 0; 2233 min-width: 100%; 2234 min-height: 100%; 2235 font-size: 100px; 2236 text-align: right; 2237 opacity: 0; 2238 filter: alpha(opacity=0); 2239 outline: none; 2240 background: white; 2241 cursor: inherit; 2242 display: block; 2243 } 2244 .btn-default { 2245 background-color: #f4f4f4; 2246 color: #444; 2247 border-color: #ddd; 2248 } 2249 .btn-default:hover, 2250 .btn-default:active, 2251 .btn-default.hover { 2252 background-color: #e7e7e7; 2253 } 2254 .btn-primary { 2255 background-color: #3c8dbc; 2256 border-color: #367fa9; 2257 } 2258 .btn-primary:hover, 2259 .btn-primary:active, 2260 .btn-primary.hover { 2261 background-color: #367fa9; 2262 } 2263 .btn-success { 2264 background-color: #00a65a; 2265 border-color: #008d4c; 2266 } 2267 .btn-success:hover, 2268 .btn-success:active, 2269 .btn-success.hover { 2270 background-color: #008d4c; 2271 } 2272 .btn-info { 2273 background-color: #00c0ef; 2274 border-color: #00acd6; 2275 } 2276 .btn-info:hover, 2277 .btn-info:active, 2278 .btn-info.hover { 2279 background-color: #00acd6; 2280 } 2281 .btn-danger { 2282 background-color: #dd4b39; 2283 border-color: #d73925; 2284 } 2285 .btn-danger:hover, 2286 .btn-danger:active, 2287 .btn-danger.hover { 2288 background-color: #d73925; 2289 } 2290 .btn-warning { 2291 background-color: #f39c12; 2292 border-color: #e08e0b; 2293 } 2294 .btn-warning:hover, 2295 .btn-warning:active, 2296 .btn-warning.hover { 2297 background-color: #e08e0b; 2298 } 2299 .btn-outline { 2300 border: 1px solid #fff; 2301 background: transparent; 2302 color: #fff; 2303 } 2304 .btn-outline:hover, 2305 .btn-outline:focus, 2306 .btn-outline:active { 2307 color: rgba(255, 255, 255, 0.7); 2308 border-color: rgba(255, 255, 255, 0.7); 2309 } 2310 .btn-link { 2311 -webkit-box-shadow: none; 2312 box-shadow: none; 2313 } 2314 .btn[class*='bg-']:hover { 2315 -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2); 2316 box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2); 2317 } 2318 .btn-app { 2319 border-radius: 3px; 2320 position: relative; 2321 padding: 15px 5px; 2322 margin: 0 0 10px 10px; 2323 min-width: 80px; 2324 height: 60px; 2325 text-align: center; 2326 color: #666; 2327 border: 1px solid #ddd; 2328 background-color: #f4f4f4; 2329 font-size: 12px; 2330 } 2331 .btn-app > .fa, 2332 .btn-app > .glyphicon, 2333 .btn-app > .ion { 2334 font-size: 20px; 2335 display: block; 2336 } 2337 .btn-app:hover { 2338 background: #f4f4f4; 2339 color: #444; 2340 border-color: #aaa; 2341 } 2342 .btn-app:active, 2343 .btn-app:focus { 2344 -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2345 -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2346 box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); 2347 } 2348 .btn-app > .badge { 2349 position: absolute; 2350 top: -3px; 2351 right: -10px; 2352 font-size: 10px; 2353 font-weight: 400; 2354 } 2355 /* 2356 * Component: Callout 2357 * ------------------ 2358 */ 2359 .callout { 2360 border-radius: 3px; 2361 margin: 0 0 20px 0; 2362 padding: 15px 30px 15px 15px; 2363 border-left: 5px solid #eee; 2364 } 2365 .callout a { 2366 color: #fff; 2367 text-decoration: underline; 2368 } 2369 .callout a:hover { 2370 color: #eee; 2371 } 2372 .callout h4 { 2373 margin-top: 0; 2374 font-weight: 600; 2375 } 2376 .callout p:last-child { 2377 margin-bottom: 0; 2378 } 2379 .callout code, 2380 .callout .highlight { 2381 background-color: #fff; 2382 } 2383 .callout.callout-danger { 2384 border-color: #c23321; 2385 } 2386 .callout.callout-warning { 2387 border-color: #c87f0a; 2388 } 2389 .callout.callout-info { 2390 border-color: #0097bc; 2391 } 2392 .callout.callout-success { 2393 border-color: #00733e; 2394 } 2395 /* 2396 * Component: alert 2397 * ---------------- 2398 */ 2399 .alert { 2400 border-radius: 3px; 2401 } 2402 .alert h4 { 2403 font-weight: 600; 2404 } 2405 .alert .icon { 2406 margin-right: 10px; 2407 } 2408 .alert .close { 2409 color: #000; 2410 opacity: 0.2; 2411 filter: alpha(opacity=20); 2412 } 2413 .alert .close:hover { 2414 opacity: 0.5; 2415 filter: alpha(opacity=50); 2416 } 2417 .alert a { 2418 color: #fff; 2419 text-decoration: underline; 2420 } 2421 .alert-success { 2422 border-color: #008d4c; 2423 } 2424 .alert-danger, 2425 .alert-error { 2426 border-color: #d73925; 2427 } 2428 .alert-warning { 2429 border-color: #e08e0b; 2430 } 2431 .alert-info { 2432 border-color: #00acd6; 2433 } 2434 /* 2435 * Component: Nav 2436 * -------------- 2437 */ 2438 .nav > li > a:hover, 2439 .nav > li > a:active, 2440 .nav > li > a:focus { 2441 color: #444; 2442 background: #f7f7f7; 2443 } 2444 /* NAV PILLS */ 2445 .nav-pills > li > a { 2446 border-radius: 0; 2447 border-top: 3px solid transparent; 2448 color: #444; 2449 } 2450 .nav-pills > li > a > .fa, 2451 .nav-pills > li > a > .glyphicon, 2452 .nav-pills > li > a > .ion { 2453 margin-right: 5px; 2454 } 2455 .nav-pills > li.active > a, 2456 .nav-pills > li.active > a:hover, 2457 .nav-pills > li.active > a:focus { 2458 border-top-color: #3c8dbc; 2459 } 2460 .nav-pills > li.active > a { 2461 font-weight: 600; 2462 } 2463 /* NAV STACKED */ 2464 .nav-stacked > li > a { 2465 border-radius: 0; 2466 border-top: 0; 2467 border-left: 3px solid transparent; 2468 color: #444; 2469 } 2470 .nav-stacked > li.active > a, 2471 .nav-stacked > li.active > a:hover { 2472 background: transparent; 2473 color: #444; 2474 border-top: 0; 2475 border-left-color: #3c8dbc; 2476 } 2477 .nav-stacked > li.header { 2478 border-bottom: 1px solid #ddd; 2479 color: #777; 2480 margin-bottom: 10px; 2481 padding: 5px 10px; 2482 text-transform: uppercase; 2483 } 2484 /* NAV TABS */ 2485 .nav-tabs-custom { 2486 margin-bottom: 20px; 2487 background: #fff; 2488 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2489 border-radius: 3px; 2490 } 2491 .nav-tabs-custom > .nav-tabs { 2492 margin: 0; 2493 border-bottom-color: #f4f4f4; 2494 border-top-right-radius: 3px; 2495 border-top-left-radius: 3px; 2496 } 2497 .nav-tabs-custom > .nav-tabs > li { 2498 border-top: 3px solid transparent; 2499 margin-bottom: -2px; 2500 margin-right: 5px; 2501 } 2502 .nav-tabs-custom > .nav-tabs > li > a { 2503 color: #444; 2504 border-radius: 0; 2505 } 2506 .nav-tabs-custom > .nav-tabs > li > a.text-muted { 2507 color: #999; 2508 } 2509 .nav-tabs-custom > .nav-tabs > li > a, 2510 .nav-tabs-custom > .nav-tabs > li > a:hover { 2511 background: transparent; 2512 margin: 0; 2513 } 2514 .nav-tabs-custom > .nav-tabs > li > a:hover { 2515 color: #999; 2516 } 2517 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:hover, 2518 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:focus, 2519 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:active { 2520 border-color: transparent; 2521 } 2522 .nav-tabs-custom > .nav-tabs > li.active { 2523 border-top-color: #3c8dbc; 2524 } 2525 .nav-tabs-custom > .nav-tabs > li.active > a, 2526 .nav-tabs-custom > .nav-tabs > li.active:hover > a { 2527 background-color: #fff; 2528 color: #444; 2529 } 2530 .nav-tabs-custom > .nav-tabs > li.active > a { 2531 border-top-color: transparent; 2532 border-left-color: #f4f4f4; 2533 border-right-color: #f4f4f4; 2534 } 2535 .nav-tabs-custom > .nav-tabs > li:first-of-type { 2536 margin-left: 0; 2537 } 2538 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a { 2539 border-left-color: transparent; 2540 } 2541 .nav-tabs-custom > .nav-tabs.pull-right { 2542 float: none !important; 2543 } 2544 .nav-tabs-custom > .nav-tabs.pull-right > li { 2545 float: right; 2546 } 2547 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type { 2548 margin-right: 0; 2549 } 2550 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type > a { 2551 border-left-width: 1px; 2552 } 2553 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a { 2554 border-left-color: #f4f4f4; 2555 border-right-color: transparent; 2556 } 2557 .nav-tabs-custom > .nav-tabs > li.header { 2558 line-height: 35px; 2559 padding: 0 10px; 2560 font-size: 20px; 2561 color: #444; 2562 } 2563 .nav-tabs-custom > .nav-tabs > li.header > .fa, 2564 .nav-tabs-custom > .nav-tabs > li.header > .glyphicon, 2565 .nav-tabs-custom > .nav-tabs > li.header > .ion { 2566 margin-right: 5px; 2567 } 2568 .nav-tabs-custom > .tab-content { 2569 background: #fff; 2570 padding: 10px; 2571 border-bottom-right-radius: 3px; 2572 border-bottom-left-radius: 3px; 2573 } 2574 .nav-tabs-custom .dropdown.open > a:active, 2575 .nav-tabs-custom .dropdown.open > a:focus { 2576 background: transparent; 2577 color: #999; 2578 } 2579 .nav-tabs-custom.tab-primary > .nav-tabs > li.active { 2580 border-top-color: #3c8dbc; 2581 } 2582 .nav-tabs-custom.tab-info > .nav-tabs > li.active { 2583 border-top-color: #00c0ef; 2584 } 2585 .nav-tabs-custom.tab-danger > .nav-tabs > li.active { 2586 border-top-color: #dd4b39; 2587 } 2588 .nav-tabs-custom.tab-warning > .nav-tabs > li.active { 2589 border-top-color: #f39c12; 2590 } 2591 .nav-tabs-custom.tab-success > .nav-tabs > li.active { 2592 border-top-color: #00a65a; 2593 } 2594 .nav-tabs-custom.tab-default > .nav-tabs > li.active { 2595 border-top-color: #d2d6de; 2596 } 2597 /* PAGINATION */ 2598 .pagination > li > a { 2599 background: #fafafa; 2600 color: #666; 2601 } 2602 .pagination.pagination-flat > li > a { 2603 border-radius: 0 !important; 2604 } 2605 /* 2606 * Component: Products List 2607 * ------------------------ 2608 */ 2609 .products-list { 2610 list-style: none; 2611 margin: 0; 2612 padding: 0; 2613 } 2614 .products-list > .item { 2615 border-radius: 3px; 2616 -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2617 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); 2618 padding: 10px 0; 2619 background: #fff; 2620 } 2621 .products-list > .item:before, 2622 .products-list > .item:after { 2623 content: " "; 2624 display: table; 2625 } 2626 .products-list > .item:after { 2627 clear: both; 2628 } 2629 .products-list .product-img { 2630 float: left; 2631 } 2632 .products-list .product-img img { 2633 width: 50px; 2634 height: 50px; 2635 } 2636 .products-list .product-info { 2637 margin-left: 60px; 2638 } 2639 .products-list .product-title { 2640 font-weight: 600; 2641 } 2642 .products-list .product-description { 2643 display: block; 2644 color: #999; 2645 overflow: hidden; 2646 white-space: nowrap; 2647 text-overflow: ellipsis; 2648 } 2649 .product-list-in-box > .item { 2650 -webkit-box-shadow: none; 2651 box-shadow: none; 2652 border-radius: 0; 2653 border-bottom: 1px solid #f4f4f4; 2654 } 2655 .product-list-in-box > .item:last-of-type { 2656 border-bottom-width: 0; 2657 } 2658 /* 2659 * Component: Table 2660 * ---------------- 2661 */ 2662 .table > thead > tr > th, 2663 .table > tbody > tr > th, 2664 .table > tfoot > tr > th, 2665 .table > thead > tr > td, 2666 .table > tbody > tr > td, 2667 .table > tfoot > tr > td { 2668 border-top: 1px solid #f4f4f4; 2669 } 2670 .table > thead > tr > th { 2671 border-bottom: 2px solid #f4f4f4; 2672 } 2673 .table tr td .progress { 2674 margin-top: 5px; 2675 } 2676 .table-bordered { 2677 border: 1px solid #f4f4f4; 2678 } 2679 .table-bordered > thead > tr > th, 2680 .table-bordered > tbody > tr > th, 2681 .table-bordered > tfoot > tr > th, 2682 .table-bordered > thead > tr > td, 2683 .table-bordered > tbody > tr > td, 2684 .table-bordered > tfoot > tr > td { 2685 border: 1px solid #f4f4f4; 2686 } 2687 .table-bordered > thead > tr > th, 2688 .table-bordered > thead > tr > td { 2689 border-bottom-width: 2px; 2690 } 2691 .table.no-border, 2692 .table.no-border td, 2693 .table.no-border th { 2694 border: 0; 2695 } 2696 /* .text-center in tables */ 2697 table.text-center, 2698 table.text-center td, 2699 table.text-center th { 2700 text-align: center; 2701 } 2702 .table.align th { 2703 text-align: left; 2704 } 2705 .table.align td { 2706 text-align: right; 2707 } 2708 /* 2709 * Component: Label 2710 * ---------------- 2711 */ 2712 .label-default { 2713 background-color: #d2d6de; 2714 color: #444; 2715 } 2716 /* 2717 * Component: Direct Chat 2718 * ---------------------- 2719 */ 2720 .direct-chat .box-body { 2721 border-bottom-right-radius: 0; 2722 border-bottom-left-radius: 0; 2723 position: relative; 2724 overflow-x: hidden; 2725 padding: 0; 2726 } 2727 .direct-chat.chat-pane-open .direct-chat-contacts { 2728 -webkit-transform: translate(0, 0); 2729 -ms-transform: translate(0, 0); 2730 -o-transform: translate(0, 0); 2731 transform: translate(0, 0); 2732 } 2733 .direct-chat-messages { 2734 -webkit-transform: translate(0, 0); 2735 -ms-transform: translate(0, 0); 2736 -o-transform: translate(0, 0); 2737 transform: translate(0, 0); 2738 padding: 10px; 2739 height: 250px; 2740 overflow: auto; 2741 } 2742 .direct-chat-msg, 2743 .direct-chat-text { 2744 display: block; 2745 } 2746 .direct-chat-msg { 2747 margin-bottom: 10px; 2748 } 2749 .direct-chat-msg:before, 2750 .direct-chat-msg:after { 2751 content: " "; 2752 display: table; 2753 } 2754 .direct-chat-msg:after { 2755 clear: both; 2756 } 2757 .direct-chat-messages, 2758 .direct-chat-contacts { 2759 -webkit-transition: -webkit-transform 0.5s ease-in-out; 2760 -moz-transition: -moz-transform 0.5s ease-in-out; 2761 -o-transition: -o-transform 0.5s ease-in-out; 2762 transition: transform 0.5s ease-in-out; 2763 } 2764 .direct-chat-text { 2765 border-radius: 5px; 2766 position: relative; 2767 padding: 5px 10px; 2768 background: #d2d6de; 2769 border: 1px solid #d2d6de; 2770 margin: 5px 0 0 50px; 2771 color: #444444; 2772 } 2773 .direct-chat-text:after, 2774 .direct-chat-text:before { 2775 position: absolute; 2776 right: 100%; 2777 top: 15px; 2778 border: solid transparent; 2779 border-right-color: #d2d6de; 2780 content: ' '; 2781 height: 0; 2782 width: 0; 2783 pointer-events: none; 2784 } 2785 .direct-chat-text:after { 2786 border-width: 5px; 2787 margin-top: -5px; 2788 } 2789 .direct-chat-text:before { 2790 border-width: 6px; 2791 margin-top: -6px; 2792 } 2793 .right .direct-chat-text { 2794 margin-right: 50px; 2795 margin-left: 0; 2796 } 2797 .right .direct-chat-text:after, 2798 .right .direct-chat-text:before { 2799 right: auto; 2800 left: 100%; 2801 border-right-color: transparent; 2802 border-left-color: #d2d6de; 2803 } 2804 .direct-chat-img { 2805 border-radius: 50%; 2806 float: left; 2807 width: 40px; 2808 height: 40px; 2809 } 2810 .right .direct-chat-img { 2811 float: right; 2812 } 2813 .direct-chat-info { 2814 display: block; 2815 margin-bottom: 2px; 2816 font-size: 12px; 2817 } 2818 .direct-chat-name { 2819 font-weight: 600; 2820 } 2821 .direct-chat-timestamp { 2822 color: #999; 2823 } 2824 .direct-chat-contacts-open .direct-chat-contacts { 2825 -webkit-transform: translate(0, 0); 2826 -ms-transform: translate(0, 0); 2827 -o-transform: translate(0, 0); 2828 transform: translate(0, 0); 2829 } 2830 .direct-chat-contacts { 2831 -webkit-transform: translate(101%, 0); 2832 -ms-transform: translate(101%, 0); 2833 -o-transform: translate(101%, 0); 2834 transform: translate(101%, 0); 2835 position: absolute; 2836 top: 0; 2837 bottom: 0; 2838 height: 250px; 2839 width: 100%; 2840 background: #222d32; 2841 color: #fff; 2842 overflow: auto; 2843 } 2844 .contacts-list > li { 2845 border-bottom: 1px solid rgba(0, 0, 0, 0.2); 2846 padding: 10px; 2847 margin: 0; 2848 } 2849 .contacts-list > li:before, 2850 .contacts-list > li:after { 2851 content: " "; 2852 display: table; 2853 } 2854 .contacts-list > li:after { 2855 clear: both; 2856 } 2857 .contacts-list > li:last-of-type { 2858 border-bottom: none; 2859 } 2860 .contacts-list-img { 2861 border-radius: 50%; 2862 width: 40px; 2863 float: left; 2864 } 2865 .contacts-list-info { 2866 margin-left: 45px; 2867 color: #fff; 2868 } 2869 .contacts-list-name, 2870 .contacts-list-status { 2871 display: block; 2872 } 2873 .contacts-list-name { 2874 font-weight: 600; 2875 } 2876 .contacts-list-status { 2877 font-size: 12px; 2878 } 2879 .contacts-list-date { 2880 color: #aaa; 2881 font-weight: normal; 2882 } 2883 .contacts-list-msg { 2884 color: #999; 2885 } 2886 .direct-chat-danger .right > .direct-chat-text { 2887 background: #dd4b39; 2888 border-color: #dd4b39; 2889 color: #ffffff; 2890 } 2891 .direct-chat-danger .right > .direct-chat-text:after, 2892 .direct-chat-danger .right > .direct-chat-text:before { 2893 border-left-color: #dd4b39; 2894 } 2895 .direct-chat-primary .right > .direct-chat-text { 2896 background: #3c8dbc; 2897 border-color: #3c8dbc; 2898 color: #ffffff; 2899 } 2900 .direct-chat-primary .right > .direct-chat-text:after, 2901 .direct-chat-primary .right > .direct-chat-text:before { 2902 border-left-color: #3c8dbc; 2903 } 2904 .direct-chat-warning .right > .direct-chat-text { 2905 background: #f39c12; 2906 border-color: #f39c12; 2907 color: #ffffff; 2908 } 2909 .direct-chat-warning .right > .direct-chat-text:after, 2910 .direct-chat-warning .right > .direct-chat-text:before { 2911 border-left-color: #f39c12; 2912 } 2913 .direct-chat-info .right > .direct-chat-text { 2914 background: #00c0ef; 2915 border-color: #00c0ef; 2916 color: #ffffff; 2917 } 2918 .direct-chat-info .right > .direct-chat-text:after, 2919 .direct-chat-info .right > .direct-chat-text:before { 2920 border-left-color: #00c0ef; 2921 } 2922 .direct-chat-success .right > .direct-chat-text { 2923 background: #00a65a; 2924 border-color: #00a65a; 2925 color: #ffffff; 2926 } 2927 .direct-chat-success .right > .direct-chat-text:after, 2928 .direct-chat-success .right > .direct-chat-text:before { 2929 border-left-color: #00a65a; 2930 } 2931 /* 2932 * Component: Users List 2933 * --------------------- 2934 */ 2935 .users-list > li { 2936 width: 25%; 2937 float: left; 2938 padding: 10px; 2939 text-align: center; 2940 } 2941 .users-list > li img { 2942 border-radius: 50%; 2943 max-width: 100%; 2944 height: auto; 2945 } 2946 .users-list > li > a:hover, 2947 .users-list > li > a:hover .users-list-name { 2948 color: #999; 2949 } 2950 .users-list-name, 2951 .users-list-date { 2952 display: block; 2953 } 2954 .users-list-name { 2955 font-weight: 600; 2956 color: #444; 2957 overflow: hidden; 2958 white-space: nowrap; 2959 text-overflow: ellipsis; 2960 } 2961 .users-list-date { 2962 color: #999; 2963 font-size: 12px; 2964 } 2965 /* 2966 * Component: Carousel 2967 * ------------------- 2968 */ 2969 .carousel-control.left, 2970 .carousel-control.right { 2971 background-image: none; 2972 } 2973 .carousel-control > .fa { 2974 font-size: 40px; 2975 position: absolute; 2976 top: 50%; 2977 z-index: 5; 2978 display: inline-block; 2979 margin-top: -20px; 2980 } 2981 /* 2982 * Component: modal 2983 * ---------------- 2984 */ 2985 .modal { 2986 background: rgba(0, 0, 0, 0.3); 2987 } 2988 .modal-content { 2989 border-radius: 0; 2990 -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125); 2991 box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125); 2992 border: 0; 2993 } 2994 @media (min-width: 768px) { 2995 .modal-content { 2996 -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125); 2997 box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125); 2998 } 2999 } 3000 .modal-header { 3001 border-bottom-color: #f4f4f4; 3002 } 3003 .modal-footer { 3004 border-top-color: #f4f4f4; 3005 } 3006 .modal-primary .modal-header, 3007 .modal-primary .modal-footer { 3008 border-color: #307095; 3009 } 3010 .modal-warning .modal-header, 3011 .modal-warning .modal-footer { 3012 border-color: #c87f0a; 3013 } 3014 .modal-info .modal-header, 3015 .modal-info .modal-footer { 3016 border-color: #0097bc; 3017 } 3018 .modal-success .modal-header, 3019 .modal-success .modal-footer { 3020 border-color: #00733e; 3021 } 3022 .modal-danger .modal-header, 3023 .modal-danger .modal-footer { 3024 border-color: #c23321; 3025 } 3026 /* 3027 * Component: Social Widgets 3028 * ------------------------- 3029 */ 3030 .box-widget { 3031 border: none; 3032 position: relative; 3033 } 3034 .widget-user .widget-user-header { 3035 padding: 20px; 3036 height: 120px; 3037 border-top-right-radius: 3px; 3038 border-top-left-radius: 3px; 3039 } 3040 .widget-user .widget-user-username { 3041 margin-top: 0; 3042 margin-bottom: 5px; 3043 font-size: 25px; 3044 font-weight: 300; 3045 text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); 3046 } 3047 .widget-user .widget-user-desc { 3048 margin-top: 0; 3049 } 3050 .widget-user .widget-user-image { 3051 position: absolute; 3052 top: 65px; 3053 left: 50%; 3054 margin-left: -45px; 3055 } 3056 .widget-user .widget-user-image > img { 3057 width: 90px; 3058 height: auto; 3059 border: 3px solid #fff; 3060 } 3061 .widget-user .box-footer { 3062 padding-top: 30px; 3063 } 3064 .widget-user-2 .widget-user-header { 3065 padding: 20px; 3066 border-top-right-radius: 3px; 3067 border-top-left-radius: 3px; 3068 } 3069 .widget-user-2 .widget-user-username { 3070 margin-top: 5px; 3071 margin-bottom: 5px; 3072 font-size: 25px; 3073 font-weight: 300; 3074 } 3075 .widget-user-2 .widget-user-desc { 3076 margin-top: 0; 3077 } 3078 .widget-user-2 .widget-user-username, 3079 .widget-user-2 .widget-user-desc { 3080 margin-left: 75px; 3081 } 3082 .widget-user-2 .widget-user-image > img { 3083 width: 65px; 3084 height: auto; 3085 float: left; 3086 } 3087 /* 3088 * Page: Mailbox 3089 * ------------- 3090 */ 3091 .mailbox-messages > .table { 3092 margin: 0; 3093 } 3094 .mailbox-controls { 3095 padding: 5px; 3096 } 3097 .mailbox-controls.with-border { 3098 border-bottom: 1px solid #f4f4f4; 3099 } 3100 .mailbox-read-info { 3101 border-bottom: 1px solid #f4f4f4; 3102 padding: 10px; 3103 } 3104 .mailbox-read-info h3 { 3105 font-size: 20px; 3106 margin: 0; 3107 } 3108 .mailbox-read-info h5 { 3109 margin: 0; 3110 padding: 5px 0 0 0; 3111 } 3112 .mailbox-read-time { 3113 color: #999; 3114 font-size: 13px; 3115 } 3116 .mailbox-read-message { 3117 padding: 10px; 3118 } 3119 .mailbox-attachments li { 3120 float: left; 3121 width: 200px; 3122 border: 1px solid #eee; 3123 margin-bottom: 10px; 3124 margin-right: 10px; 3125 } 3126 .mailbox-attachment-name { 3127 font-weight: bold; 3128 color: #666; 3129 } 3130 .mailbox-attachment-icon, 3131 .mailbox-attachment-info, 3132 .mailbox-attachment-size { 3133 display: block; 3134 } 3135 .mailbox-attachment-info { 3136 padding: 10px; 3137 background: #f4f4f4; 3138 } 3139 .mailbox-attachment-size { 3140 color: #999; 3141 font-size: 12px; 3142 } 3143 .mailbox-attachment-icon { 3144 text-align: center; 3145 font-size: 65px; 3146 color: #666; 3147 padding: 20px 10px; 3148 } 3149 .mailbox-attachment-icon.has-img { 3150 padding: 0; 3151 } 3152 .mailbox-attachment-icon.has-img > img { 3153 max-width: 100%; 3154 height: auto; 3155 } 3156 /* 3157 * Page: Lock Screen 3158 * ----------------- 3159 */ 3160 /* ADD THIS CLASS TO THE <BODY> TAG */ 3161 .lockscreen { 3162 background: #d2d6de; 3163 } 3164 .lockscreen-logo { 3165 font-size: 35px; 3166 text-align: center; 3167 margin-bottom: 25px; 3168 font-weight: 300; 3169 } 3170 .lockscreen-logo a { 3171 color: #444; 3172 } 3173 .lockscreen-wrapper { 3174 max-width: 400px; 3175 margin: 0 auto; 3176 margin-top: 10%; 3177 } 3178 /* User name [optional] */ 3179 .lockscreen .lockscreen-name { 3180 text-align: center; 3181 font-weight: 600; 3182 } 3183 /* Will contain the image and the sign in form */ 3184 .lockscreen-item { 3185 border-radius: 4px; 3186 padding: 0; 3187 background: #fff; 3188 position: relative; 3189 margin: 10px auto 30px auto; 3190 width: 290px; 3191 } 3192 /* User image */ 3193 .lockscreen-image { 3194 border-radius: 50%; 3195 position: absolute; 3196 left: -10px; 3197 top: -25px; 3198 background: #fff; 3199 padding: 5px; 3200 z-index: 10; 3201 } 3202 .lockscreen-image > img { 3203 border-radius: 50%; 3204 width: 70px; 3205 height: 70px; 3206 } 3207 /* Contains the password input and the login button */ 3208 .lockscreen-credentials { 3209 margin-left: 70px; 3210 } 3211 .lockscreen-credentials .form-control { 3212 border: 0; 3213 } 3214 .lockscreen-credentials .btn { 3215 background-color: #fff; 3216 border: 0; 3217 padding: 0 10px; 3218 } 3219 .lockscreen-footer { 3220 margin-top: 10px; 3221 } 3222 /* 3223 * Page: Login & Register 3224 * ---------------------- 3225 */ 3226 .login-logo, 3227 .register-logo { 3228 font-size: 35px; 3229 text-align: center; 3230 margin-bottom: 25px; 3231 font-weight: 300; 3232 } 3233 .login-logo a, 3234 .register-logo a { 3235 color: #444; 3236 } 3237 .login-page, 3238 .register-page { 3239 background: #d2d6de; 3240 } 3241 .login-box, 3242 .register-box { 3243 width: 360px; 3244 margin: 7% auto; 3245 } 3246 @media (max-width: 768px) { 3247 .login-box, 3248 .register-box { 3249 width: 90%; 3250 margin-top: 20px; 3251 } 3252 } 3253 .login-box-body, 3254 .register-box-body { 3255 background: #fff; 3256 padding: 20px; 3257 border-top: 0; 3258 color: #666; 3259 } 3260 .login-box-body .form-control-feedback, 3261 .register-box-body .form-control-feedback { 3262 color: #777; 3263 } 3264 .login-box-msg, 3265 .register-box-msg { 3266 margin: 0; 3267 text-align: center; 3268 padding: 0 20px 20px 20px; 3269 } 3270 .social-auth-links { 3271 margin: 10px 0; 3272 } 3273 /* 3274 * Page: 400 and 500 error pages 3275 * ------------------------------ 3276 */ 3277 .error-page { 3278 width: 600px; 3279 margin: 20px auto 0 auto; 3280 } 3281 @media (max-width: 991px) { 3282 .error-page { 3283 width: 100%; 3284 } 3285 } 3286 .error-page > .headline { 3287 float: left; 3288 font-size: 100px; 3289 font-weight: 300; 3290 } 3291 @media (max-width: 991px) { 3292 .error-page > .headline { 3293 float: none; 3294 text-align: center; 3295 } 3296 } 3297 .error-page > .error-content { 3298 margin-left: 190px; 3299 display: block; 3300 } 3301 @media (max-width: 991px) { 3302 .error-page > .error-content { 3303 margin-left: 0; 3304 } 3305 } 3306 .error-page > .error-content > h3 { 3307 font-weight: 300; 3308 font-size: 25px; 3309 } 3310 @media (max-width: 991px) { 3311 .error-page > .error-content > h3 { 3312 text-align: center; 3313 } 3314 } 3315 /* 3316 * Page: Invoice 3317 * ------------- 3318 */ 3319 .invoice { 3320 position: relative; 3321 background: #fff; 3322 border: 1px solid #f4f4f4; 3323 padding: 20px; 3324 margin: 10px 25px; 3325 } 3326 .invoice-title { 3327 margin-top: 0; 3328 } 3329 /* 3330 * Page: Profile 3331 * ------------- 3332 */ 3333 .profile-user-img { 3334 margin: 0 auto; 3335 width: 100px; 3336 padding: 3px; 3337 border: 3px solid #d2d6de; 3338 } 3339 .profile-username { 3340 font-size: 21px; 3341 margin-top: 5px; 3342 } 3343 .post { 3344 border-bottom: 1px solid #d2d6de; 3345 margin-bottom: 15px; 3346 padding-bottom: 15px; 3347 color: #666; 3348 } 3349 .post:last-of-type { 3350 border-bottom: 0; 3351 margin-bottom: 0; 3352 padding-bottom: 0; 3353 } 3354 .post .user-block { 3355 margin-bottom: 15px; 3356 } 3357 /* 3358 * General: Miscellaneous 3359 * ---------------------- 3360 */ 3361 .pad { 3362 padding: 10px; 3363 } 3364 .margin { 3365 margin: 10px; 3366 } 3367 .margin-bottom { 3368 margin-bottom: 20px; 3369 } 3370 .margin-bottom-none { 3371 margin-bottom: 0; 3372 } 3373 .margin-r-5 { 3374 margin-right: 5px; 3375 } 3376 .inline { 3377 display: inline; 3378 } 3379 .description-block { 3380 display: block; 3381 margin: 10px 0; 3382 text-align: center; 3383 } 3384 .description-block.margin-bottom { 3385 margin-bottom: 25px; 3386 } 3387 .description-block > .description-header { 3388 margin: 0; 3389 padding: 0; 3390 font-weight: 600; 3391 font-size: 16px; 3392 } 3393 .description-block > .description-text { 3394 text-transform: uppercase; 3395 } 3396 .bg-red, 3397 .bg-yellow, 3398 .bg-aqua, 3399 .bg-blue, 3400 .bg-light-blue, 3401 .bg-green, 3402 .bg-navy, 3403 .bg-teal, 3404 .bg-olive, 3405 .bg-lime, 3406 .bg-orange, 3407 .bg-fuchsia, 3408 .bg-purple, 3409 .bg-maroon, 3410 .bg-black, 3411 .bg-red-active, 3412 .bg-yellow-active, 3413 .bg-aqua-active, 3414 .bg-blue-active, 3415 .bg-light-blue-active, 3416 .bg-green-active, 3417 .bg-navy-active, 3418 .bg-teal-active, 3419 .bg-olive-active, 3420 .bg-lime-active, 3421 .bg-orange-active, 3422 .bg-fuchsia-active, 3423 .bg-purple-active, 3424 .bg-maroon-active, 3425 .bg-black-active, 3426 .callout.callout-danger, 3427 .callout.callout-warning, 3428 .callout.callout-info, 3429 .callout.callout-success, 3430 .alert-success, 3431 .alert-danger, 3432 .alert-error, 3433 .alert-warning, 3434 .alert-info, 3435 .label-danger, 3436 .label-info, 3437 .label-warning, 3438 .label-primary, 3439 .label-success, 3440 .modal-primary .modal-body, 3441 .modal-primary .modal-header, 3442 .modal-primary .modal-footer, 3443 .modal-warning .modal-body, 3444 .modal-warning .modal-header, 3445 .modal-warning .modal-footer, 3446 .modal-info .modal-body, 3447 .modal-info .modal-header, 3448 .modal-info .modal-footer, 3449 .modal-success .modal-body, 3450 .modal-success .modal-header, 3451 .modal-success .modal-footer, 3452 .modal-danger .modal-body, 3453 .modal-danger .modal-header, 3454 .modal-danger .modal-footer { 3455 color: #fff !important; 3456 } 3457 .bg-gray { 3458 color: #000; 3459 background-color: #d2d6de !important; 3460 } 3461 .bg-gray-light { 3462 background-color: #f7f7f7; 3463 } 3464 .bg-black { 3465 background-color: #111111 !important; 3466 } 3467 .bg-red, 3468 .callout.callout-danger, 3469 .alert-danger, 3470 .alert-error, 3471 .label-danger, 3472 .modal-danger .modal-body { 3473 background-color: #dd4b39 !important; 3474 } 3475 .bg-yellow, 3476 .callout.callout-warning, 3477 .alert-warning, 3478 .label-warning, 3479 .modal-warning .modal-body { 3480 background-color: #f39c12 !important; 3481 } 3482 .bg-aqua, 3483 .callout.callout-info, 3484 .alert-info, 3485 .label-info, 3486 .modal-info .modal-body { 3487 background-color: #00c0ef !important; 3488 } 3489 .bg-blue { 3490 background-color: #0073b7 !important; 3491 } 3492 .bg-light-blue, 3493 .label-primary, 3494 .modal-primary .modal-body { 3495 background-color: #3c8dbc !important; 3496 } 3497 .bg-green, 3498 .callout.callout-success, 3499 .alert-success, 3500 .label-success, 3501 .modal-success .modal-body { 3502 background-color: #00a65a !important; 3503 } 3504 .bg-navy { 3505 background-color: #001f3f !important; 3506 } 3507 .bg-teal { 3508 background-color: #39cccc !important; 3509 } 3510 .bg-olive { 3511 background-color: #3d9970 !important; 3512 } 3513 .bg-lime { 3514 background-color: #01ff70 !important; 3515 } 3516 .bg-orange { 3517 background-color: #ff851b !important; 3518 } 3519 .bg-fuchsia { 3520 background-color: #f012be !important; 3521 } 3522 .bg-purple { 3523 background-color: #605ca8 !important; 3524 } 3525 .bg-maroon { 3526 background-color: #d81b60 !important; 3527 } 3528 .bg-gray-active { 3529 color: #000; 3530 background-color: #b5bbc8 !important; 3531 } 3532 .bg-black-active { 3533 background-color: #000000 !important; 3534 } 3535 .bg-red-active, 3536 .modal-danger .modal-header, 3537 .modal-danger .modal-footer { 3538 background-color: #d33724 !important; 3539 } 3540 .bg-yellow-active, 3541 .modal-warning .modal-header, 3542 .modal-warning .modal-footer { 3543 background-color: #db8b0b !important; 3544 } 3545 .bg-aqua-active, 3546 .modal-info .modal-header, 3547 .modal-info .modal-footer { 3548 background-color: #00a7d0 !important; 3549 } 3550 .bg-blue-active { 3551 background-color: #005384 !important; 3552 } 3553 .bg-light-blue-active, 3554 .modal-primary .modal-header, 3555 .modal-primary .modal-footer { 3556 background-color: #357ca5 !important; 3557 } 3558 .bg-green-active, 3559 .modal-success .modal-header, 3560 .modal-success .modal-footer { 3561 background-color: #008d4c !important; 3562 } 3563 .bg-navy-active { 3564 background-color: #001a35 !important; 3565 } 3566 .bg-teal-active { 3567 background-color: #30bbbb !important; 3568 } 3569 .bg-olive-active { 3570 background-color: #368763 !important; 3571 } 3572 .bg-lime-active { 3573 background-color: #00e765 !important; 3574 } 3575 .bg-orange-active { 3576 background-color: #ff7701 !important; 3577 } 3578 .bg-fuchsia-active { 3579 background-color: #db0ead !important; 3580 } 3581 .bg-purple-active { 3582 background-color: #555299 !important; 3583 } 3584 .bg-maroon-active { 3585 background-color: #ca195a !important; 3586 } 3587 [class^="bg-"].disabled { 3588 opacity: 0.65; 3589 filter: alpha(opacity=65); 3590 } 3591 .text-red { 3592 color: #dd4b39 !important; 3593 } 3594 .text-yellow { 3595 color: #f39c12 !important; 3596 } 3597 .text-aqua { 3598 color: #00c0ef !important; 3599 } 3600 .text-blue { 3601 color: #0073b7 !important; 3602 } 3603 .text-black { 3604 color: #111111 !important; 3605 } 3606 .text-light-blue { 3607 color: #3c8dbc !important; 3608 } 3609 .text-green { 3610 color: #00a65a !important; 3611 } 3612 .text-gray { 3613 color: #d2d6de !important; 3614 } 3615 .text-navy { 3616 color: #001f3f !important; 3617 } 3618 .text-teal { 3619 color: #39cccc !important; 3620 } 3621 .text-olive { 3622 color: #3d9970 !important; 3623 } 3624 .text-lime { 3625 color: #01ff70 !important; 3626 } 3627 .text-orange { 3628 color: #ff851b !important; 3629 } 3630 .text-fuchsia { 3631 color: #f012be !important; 3632 } 3633 .text-purple { 3634 color: #605ca8 !important; 3635 } 3636 .text-maroon { 3637 color: #d81b60 !important; 3638 } 3639 .link-muted { 3640 color: #7a869d; 3641 } 3642 .link-muted:hover, 3643 .link-muted:focus { 3644 color: #606c84; 3645 } 3646 .link-black { 3647 color: #666; 3648 } 3649 .link-black:hover, 3650 .link-black:focus { 3651 color: #999; 3652 } 3653 .hide { 3654 display: none !important; 3655 } 3656 .no-border { 3657 border: 0 !important; 3658 } 3659 .no-padding { 3660 padding: 0 !important; 3661 } 3662 .no-margin { 3663 margin: 0 !important; 3664 } 3665 .no-shadow { 3666 box-shadow: none !important; 3667 } 3668 .list-unstyled, 3669 .chart-legend, 3670 .contacts-list, 3671 .users-list, 3672 .mailbox-attachments { 3673 list-style: none; 3674 margin: 0; 3675 padding: 0; 3676 } 3677 .list-group-unbordered > .list-group-item { 3678 border-left: 0; 3679 border-right: 0; 3680 border-radius: 0; 3681 padding-left: 0; 3682 padding-right: 0; 3683 } 3684 .flat { 3685 border-radius: 0 !important; 3686 } 3687 .text-bold, 3688 .text-bold.table td, 3689 .text-bold.table th { 3690 font-weight: 700; 3691 } 3692 .text-sm { 3693 font-size: 12px; 3694 } 3695 .jqstooltip { 3696 padding: 5px !important; 3697 width: auto !important; 3698 height: auto !important; 3699 } 3700 .bg-teal-gradient { 3701 background: #39cccc !important; 3702 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #39cccc), color-stop(1, #7adddd)) !important; 3703 background: -ms-linear-gradient(bottom, #39cccc, #7adddd) !important; 3704 background: -moz-linear-gradient(center bottom, #39cccc 0%, #7adddd 100%) !important; 3705 background: -o-linear-gradient(#7adddd, #39cccc) !important; 3706 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7adddd', endColorstr='#39cccc', GradientType=0) !important; 3707 color: #fff; 3708 } 3709 .bg-light-blue-gradient { 3710 background: #3c8dbc !important; 3711 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #3c8dbc), color-stop(1, #67a8ce)) !important; 3712 background: -ms-linear-gradient(bottom, #3c8dbc, #67a8ce) !important; 3713 background: -moz-linear-gradient(center bottom, #3c8dbc 0%, #67a8ce 100%) !important; 3714 background: -o-linear-gradient(#67a8ce, #3c8dbc) !important; 3715 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#67a8ce', endColorstr='#3c8dbc', GradientType=0) !important; 3716 color: #fff; 3717 } 3718 .bg-blue-gradient { 3719 background: #0073b7 !important; 3720 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0073b7), color-stop(1, #0089db)) !important; 3721 background: -ms-linear-gradient(bottom, #0073b7, #0089db) !important; 3722 background: -moz-linear-gradient(center bottom, #0073b7 0%, #0089db 100%) !important; 3723 background: -o-linear-gradient(#0089db, #0073b7) !important; 3724 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0089db', endColorstr='#0073b7', GradientType=0) !important; 3725 color: #fff; 3726 } 3727 .bg-aqua-gradient { 3728 background: #00c0ef !important; 3729 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00c0ef), color-stop(1, #14d1ff)) !important; 3730 background: -ms-linear-gradient(bottom, #00c0ef, #14d1ff) !important; 3731 background: -moz-linear-gradient(center bottom, #00c0ef 0%, #14d1ff 100%) !important; 3732 background: -o-linear-gradient(#14d1ff, #00c0ef) !important; 3733 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#14d1ff', endColorstr='#00c0ef', GradientType=0) !important; 3734 color: #fff; 3735 } 3736 .bg-yellow-gradient { 3737 background: #f39c12 !important; 3738 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #f39c12), color-stop(1, #f7bc60)) !important; 3739 background: -ms-linear-gradient(bottom, #f39c12, #f7bc60) !important; 3740 background: -moz-linear-gradient(center bottom, #f39c12 0%, #f7bc60 100%) !important; 3741 background: -o-linear-gradient(#f7bc60, #f39c12) !important; 3742 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7bc60', endColorstr='#f39c12', GradientType=0) !important; 3743 color: #fff; 3744 } 3745 .bg-purple-gradient { 3746 background: #605ca8 !important; 3747 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #605ca8), color-stop(1, #9491c4)) !important; 3748 background: -ms-linear-gradient(bottom, #605ca8, #9491c4) !important; 3749 background: -moz-linear-gradient(center bottom, #605ca8 0%, #9491c4 100%) !important; 3750 background: -o-linear-gradient(#9491c4, #605ca8) !important; 3751 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9491c4', endColorstr='#605ca8', GradientType=0) !important; 3752 color: #fff; 3753 } 3754 .bg-green-gradient { 3755 background: #00a65a !important; 3756 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00a65a), color-stop(1, #00ca6d)) !important; 3757 background: -ms-linear-gradient(bottom, #00a65a, #00ca6d) !important; 3758 background: -moz-linear-gradient(center bottom, #00a65a 0%, #00ca6d 100%) !important; 3759 background: -o-linear-gradient(#00ca6d, #00a65a) !important; 3760 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ca6d', endColorstr='#00a65a', GradientType=0) !important; 3761 color: #fff; 3762 } 3763 .bg-red-gradient { 3764 background: #dd4b39 !important; 3765 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #dd4b39), color-stop(1, #e47365)) !important; 3766 background: -ms-linear-gradient(bottom, #dd4b39, #e47365) !important; 3767 background: -moz-linear-gradient(center bottom, #dd4b39 0%, #e47365 100%) !important; 3768 background: -o-linear-gradient(#e47365, #dd4b39) !important; 3769 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e47365', endColorstr='#dd4b39', GradientType=0) !important; 3770 color: #fff; 3771 } 3772 .bg-black-gradient { 3773 background: #111111 !important; 3774 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #111111), color-stop(1, #2b2b2b)) !important; 3775 background: -ms-linear-gradient(bottom, #111111, #2b2b2b) !important; 3776 background: -moz-linear-gradient(center bottom, #111111 0%, #2b2b2b 100%) !important; 3777 background: -o-linear-gradient(#2b2b2b, #111111) !important; 3778 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2b2b2b', endColorstr='#111111', GradientType=0) !important; 3779 color: #fff; 3780 } 3781 .bg-maroon-gradient { 3782 background: #d81b60 !important; 3783 background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #d81b60), color-stop(1, #e73f7c)) !important; 3784 background: -ms-linear-gradient(bottom, #d81b60, #e73f7c) !important; 3785 background: -moz-linear-gradient(center bottom, #d81b60 0%, #e73f7c 100%) !important; 3786 background: -o-linear-gradient(#e73f7c, #d81b60) !important; 3787 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e73f7c', endColorstr='#d81b60', GradientType=0) !important; 3788 color: #fff; 3789 } 3790 .description-block .description-icon { 3791 font-size: 16px; 3792 } 3793 .no-pad-top { 3794 padding-top: 0; 3795 } 3796 .position-static { 3797 position: static !important; 3798 } 3799 .list-header { 3800 font-size: 15px; 3801 padding: 10px 4px; 3802 font-weight: bold; 3803 color: #666; 3804 } 3805 .list-seperator { 3806 height: 1px; 3807 background: #f4f4f4; 3808 margin: 15px 0 9px 0; 3809 } 3810 .list-link > a { 3811 padding: 4px; 3812 color: #777; 3813 } 3814 .list-link > a:hover { 3815 color: #222; 3816 } 3817 .font-light { 3818 font-weight: 300; 3819 } 3820 .user-block:before, 3821 .user-block:after { 3822 content: " "; 3823 display: table; 3824 } 3825 .user-block:after { 3826 clear: both; 3827 } 3828 .user-block img { 3829 width: 40px; 3830 height: 40px; 3831 float: left; 3832 } 3833 .user-block .username, 3834 .user-block .description, 3835 .user-block .comment { 3836 display: block; 3837 margin-left: 50px; 3838 } 3839 .user-block .username { 3840 font-size: 16px; 3841 font-weight: 600; 3842 } 3843 .user-block .description { 3844 color: #999; 3845 font-size: 13px; 3846 } 3847 .user-block.user-block-sm .username, 3848 .user-block.user-block-sm .description, 3849 .user-block.user-block-sm .comment { 3850 margin-left: 40px; 3851 } 3852 .user-block.user-block-sm .username { 3853 font-size: 14px; 3854 } 3855 .img-sm, 3856 .img-md, 3857 .img-lg, 3858 .box-comments .box-comment img, 3859 .user-block.user-block-sm img { 3860 float: left; 3861 } 3862 .img-sm, 3863 .box-comments .box-comment img, 3864 .user-block.user-block-sm img { 3865 width: 30px !important; 3866 height: 30px !important; 3867 } 3868 .img-sm + .img-push { 3869 margin-left: 40px; 3870 } 3871 .img-md { 3872 width: 60px; 3873 height: 60px; 3874 } 3875 .img-md + .img-push { 3876 margin-left: 70px; 3877 } 3878 .img-lg { 3879 width: 100px; 3880 height: 100px; 3881 } 3882 .img-lg + .img-push { 3883 margin-left: 110px; 3884 } 3885 .img-bordered { 3886 border: 3px solid #d2d6de; 3887 padding: 3px; 3888 } 3889 .img-bordered-sm { 3890 border: 2px solid #d2d6de; 3891 padding: 2px; 3892 } 3893 .attachment-block { 3894 border: 1px solid #f4f4f4; 3895 padding: 5px; 3896 margin-bottom: 10px; 3897 background: #f7f7f7; 3898 } 3899 .attachment-block .attachment-img { 3900 max-width: 100px; 3901 max-height: 100px; 3902 height: auto; 3903 float: left; 3904 } 3905 .attachment-block .attachment-pushed { 3906 margin-left: 110px; 3907 } 3908 .attachment-block .attachment-heading { 3909 margin: 0; 3910 } 3911 .attachment-block .attachment-text { 3912 color: #555; 3913 } 3914 .connectedSortable { 3915 min-height: 100px; 3916 } 3917 .ui-helper-hidden-accessible { 3918 border: 0; 3919 clip: rect(0 0 0 0); 3920 height: 1px; 3921 margin: -1px; 3922 overflow: hidden; 3923 padding: 0; 3924 position: absolute; 3925 width: 1px; 3926 } 3927 .sort-highlight { 3928 background: #f4f4f4; 3929 border: 1px dashed #ddd; 3930 margin-bottom: 10px; 3931 } 3932 .full-opacity-hover { 3933 opacity: 0.65; 3934 filter: alpha(opacity=65); 3935 } 3936 .full-opacity-hover:hover { 3937 opacity: 1; 3938 filter: alpha(opacity=100); 3939 } 3940 .chart { 3941 position: relative; 3942 overflow: hidden; 3943 width: 100%; 3944 } 3945 .chart svg, 3946 .chart canvas { 3947 width: 100% !important; 3948 } 3949 /* 3950 * Misc: print 3951 * ----------- 3952 */ 3953 @media print { 3954 .no-print, 3955 .main-sidebar, 3956 .left-side, 3957 .main-header, 3958 .content-header { 3959 display: none !important; 3960 } 3961 .content-wrapper, 3962 .right-side, 3963 .main-footer { 3964 margin-left: 0 !important; 3965 min-height: 0 !important; 3966 -webkit-transform: translate(0, 0) !important; 3967 -ms-transform: translate(0, 0) !important; 3968 -o-transform: translate(0, 0) !important; 3969 transform: translate(0, 0) !important; 3970 } 3971 .fixed .content-wrapper, 3972 .fixed .right-side { 3973 padding-top: 0 !important; 3974 } 3975 .invoice { 3976 width: 100%; 3977 border: 0; 3978 margin: 0; 3979 padding: 0; 3980 } 3981 .invoice-col { 3982 float: left; 3983 width: 33.3333333%; 3984 } 3985 .table-responsive { 3986 overflow: auto; 3987 } 3988 .table-responsive > .table tr th, 3989 .table-responsive > .table tr td { 3990 white-space: normal !important; 3991 } 3992 }