1 /*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
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
10 * Core: General Layout Style
11 * -------------------------
22 -webkit-font-smoothing: antialiased
;
23 -moz-osx-font-smoothing: grayscale
;
24 font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica
, Arial
, sans-serif
;
43 .layout-boxed .wrapper {
47 box-shadow: 0 0 8px rgba
(0, 0, 0, 0.5);
51 background: url
('../img/boxed-bg.jpg') repeat fixed
;
54 * Content Wrapper - contains the main content
55 * ```.right-side has been deprecated as of v2.0.0 in favor of .content-wrapper ```
60 -webkit-transition: -webkit-transform
0.3s ease-in-out
, margin
0.3s ease-in-out
;
61 -moz-transition: -moz-transform
0.3s ease-in-out
, margin
0.3s ease-in-out
;
62 -o-transition: -o-transform
0.3s ease-in-out
, margin
0.3s ease-in-out
;
63 transition: transform
0.3s ease-in-out
, margin
0.3s ease-in-out
;
67 .layout-top-nav
.content-wrapper
,
68 .layout-top-nav
.right-side
,
69 .layout-top-nav .main-footer {
72 @media (max-width: 767px) {
79 @media (min-width: 768px) {
80 .sidebar-collapse
.content-wrapper
,
81 .sidebar-collapse
.right-side
,
82 .sidebar-collapse .main-footer {
86 @media (max-width: 767px) {
87 .sidebar-open
.content-wrapper
,
88 .sidebar-open
.right-side
,
89 .sidebar-open .main-footer {
90 -webkit-transform: translate
(230px, 0);
91 -ms-transform: translate
(230px, 0);
92 -o-transform: translate
(230px, 0);
93 transform: translate
(230px, 0);
99 background-color: #ecf0f5;
106 border-top: 1px solid
#d2d6de;
110 .fixed
.main-sidebar
,
114 .fixed .main-header {
119 .fixed
.content-wrapper
,
123 @media (max-width: 767px) {
124 .fixed
.content-wrapper
,
129 .fixed.layout-boxed .wrapper {
132 body
.hold-transition
.content-wrapper
,
133 body
.hold-transition
.right-side
,
134 body
.hold-transition
.main-footer
,
135 body
.hold-transition
.main-sidebar
,
136 body
.hold-transition
.left-side
,
137 body
.hold-transition
.main-header
> .navbar
,
138 body
.hold-transition
.main-header
.logo
{
140 -webkit-transition: none
;
166 font-family: 'Source Sans Pro', sans-serif
;
176 text-decoration: none
;
181 margin: 10px 0 20px 0;
184 .page-header > small {
190 * Component: Main Header
191 * ----------------------
198 .main-header > .navbar {
199 -webkit-transition: margin-left
0.3s ease-in-out
;
200 -o-transition: margin-left
0.3s ease-in-out
;
201 transition: margin-left
0.3s ease-in-out
;
208 .layout-top-nav .main-header > .navbar {
211 .main-header #navbar-search-input.form-control {
212 background: rgba
(255, 255, 255, 0.2);
213 border-color: transparent
;
215 .main-header #navbar-search-input
.form-control:focus
,
216 .main-header #navbar-search-input.form-control:active {
217 border-color: rgba
(0, 0, 0, 0.1);
218 background: rgba
(255, 255, 255, 0.9);
220 .main-header #navbar-search-input.form-control::-moz-placeholder {
224 .main-header #navbar-search-input.form-control:-ms-input-placeholder {
227 .main-header #navbar-search-input.form-control::-webkit-input-placeholder {
230 .main-header
.navbar-custom-menu
,
231 .main-header .navbar-right {
234 @media (max-width: 991px) {
235 .main-header
.navbar-custom-menu a
,
236 .main-header .navbar-right a {
238 background: transparent
;
241 @media (max-width: 767px) {
242 .main-header .navbar-right {
245 .navbar-collapse .main-header .navbar-right {
248 .main-header .navbar-right > li {
253 .main-header .sidebar-toggle {
255 background-color: transparent
;
256 background-image: none
;
258 font-family: fontAwesome
;
260 .main-header .sidebar-toggle:before {
263 .main-header .sidebar-toggle:hover {
266 .main-header
.sidebar-toggle:focus
,
267 .main-header .sidebar-toggle:active {
268 background: transparent
;
270 .main-header .sidebar-toggle .icon-bar {
273 .main-header
.navbar
.nav
> li
.user
> a
> .fa
,
274 .main-header
.navbar
.nav
> li
.user
> a
> .glyphicon
,
275 .main-header .navbar .nav > li.user > a > .ion {
278 .main-header .navbar .nav > li > a > .label {
288 -webkit-transition: width
0.3s ease-in-out
;
289 -o-transition: width
0.3s ease-in-out
;
290 transition: width
0.3s ease-in-out
;
298 font-family: "Helvetica Neue", Helvetica
, Arial
, sans-serif
;
303 .main-header .logo .logo-lg {
306 .main-header .logo .logo-mini {
309 .main-header .navbar-brand {
314 padding: 15px 15px 0 15px;
316 .content-header > h1 {
320 .content-header > h1 > small {
322 display: inline-block
;
326 .content-header > .breadcrumb {
328 background: transparent
;
338 .content-header > .breadcrumb > li > a {
340 text-decoration: none
;
341 display: inline-block
;
343 .content-header
> .breadcrumb
> li
> a
> .fa
,
344 .content-header
> .breadcrumb
> li
> a
> .glyphicon
,
345 .content-header > .breadcrumb > li > a > .ion {
348 .content-header > .breadcrumb > li + li:before {
351 @media (max-width: 991px) {
352 .content-header > .breadcrumb {
361 .content-header > .breadcrumb li:before {
371 @media (max-width: 991px) {
372 .navbar-custom-menu .navbar-nav > li {
375 .navbar-custom-menu .navbar-nav {
379 .navbar-custom-menu .navbar-nav > li > a {
381 padding-bottom: 15px;
385 @media (max-width: 767px) {
390 .main-header .navbar {
394 .main-header .navbar {
397 .main-header .navbar-custom-menu {
401 @media (max-width: 991px) {
402 .navbar-collapse.pull-left {
403 float: none
!important
;
405 .navbar-collapse.pull-left + .navbar-custom-menu {
425 -webkit-transition: -webkit-transform
0.3s ease-in-out
, width
0.3s ease-in-out
;
426 -moz-transition: -moz-transform
0.3s ease-in-out
, width
0.3s ease-in-out
;
427 -o-transition: -o-transform
0.3s ease-in-out
, width
0.3s ease-in-out
;
428 transition: transform
0.3s ease-in-out
, width
0.3s ease-in-out
;
430 @media (max-width: 767px) {
436 @media (max-width: 767px) {
439 -webkit-transform: translate
(-230px, 0);
440 -ms-transform: translate
(-230px, 0);
441 -o-transform: translate
(-230px, 0);
442 transform: translate
(-230px, 0);
445 @media (min-width: 768px) {
446 .sidebar-collapse
.main-sidebar
,
447 .sidebar-collapse .left-side {
448 -webkit-transform: translate
(-230px, 0);
449 -ms-transform: translate
(-230px, 0);
450 -o-transform: translate
(-230px, 0);
451 transform: translate
(-230px, 0);
454 @media (max-width: 767px) {
455 .sidebar-open
.main-sidebar
,
456 .sidebar-open .left-side {
457 -webkit-transform: translate
(0, 0);
458 -ms-transform: translate
(0, 0);
459 -o-transform: translate
(0, 0);
460 transform: translate
(0, 0);
464 padding-bottom: 10px;
466 .sidebar-form input:focus {
467 border-color: transparent
;
483 .user-panel > .image > img {
488 .user-panel > .info {
489 padding: 5px 5px 5px 15px;
494 .user-panel > .info > p {
498 .user-panel > .info > a {
499 text-decoration: none
;
504 .user-panel
> .info
> a
> .fa
,
505 .user-panel
> .info
> a
> .ion
,
506 .user-panel > .info > a > .glyphicon {
519 .sidebar-menu > li > a {
520 padding: 12px 5px 12px 15px;
523 .sidebar-menu
> li
> a
> .fa
,
524 .sidebar-menu
> li
> a
> .glyphicon
,
525 .sidebar-menu > li > a > .ion {
528 .sidebar-menu
> li
.label
,
529 .sidebar-menu > li .badge {
533 .sidebar-menu li.header {
534 padding: 10px 25px 10px 15px;
537 .sidebar-menu li > a > .fa-angle-left {
544 .sidebar-menu li.active > a > .fa-angle-left {
545 -webkit-transform: rotate
(-90deg);
546 -ms-transform: rotate
(-90deg);
547 -o-transform: rotate
(-90deg);
548 transform: rotate
(-90deg);
550 .sidebar-menu li.active > .treeview-menu {
553 .sidebar-menu .treeview-menu {
560 .sidebar-menu .treeview-menu .treeview-menu {
563 .sidebar-menu .treeview-menu > li {
566 .sidebar-menu .treeview-menu > li > a {
567 padding: 5px 5px 5px 15px;
571 .sidebar-menu
.treeview-menu
> li
> a
> .fa
,
572 .sidebar-menu
.treeview-menu
> li
> a
> .glyphicon
,
573 .sidebar-menu .treeview-menu > li > a > .ion {
576 .sidebar-menu
.treeview-menu
> li
> a
> .fa-angle-left
,
577 .sidebar-menu .treeview-menu > li > a > .fa-angle-down {
581 * Component: Sidebar Mini
583 @media (min-width: 768px) {
584 .sidebar-mini
.sidebar-collapse
.content-wrapper
,
585 .sidebar-mini
.sidebar-collapse
.right-side
,
586 .sidebar-mini.sidebar-collapse .main-footer {
587 margin-left: 50px!important
;
590 .sidebar-mini.sidebar-collapse .main-sidebar {
591 -webkit-transform: translate
(0, 0);
592 -ms-transform: translate
(0, 0);
593 -o-transform: translate
(0, 0);
594 transform: translate
(0, 0);
595 width: 50px!important
;
598 .sidebar-mini.sidebar-collapse .sidebar-menu > li {
601 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
604 .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span {
605 border-top-right-radius: 4px;
607 .sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span {
608 border-bottom-right-radius: 4px;
610 .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
613 border-bottom-right-radius: 4px;
615 .sidebar-mini
.sidebar-collapse
.sidebar-menu
> li:hover
> a
> span:not
(.pull-right
),
616 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
617 display: block
!important
;
622 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
625 padding: 12px 5px 12px 20px;
626 background-color: inherit
;
628 .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
632 .sidebar-mini
.sidebar-collapse
.main-sidebar
.user-panel
> .info
,
633 .sidebar-mini
.sidebar-collapse
.sidebar-form
,
634 .sidebar-mini
.sidebar-collapse
.sidebar-menu
> li
> a
> span
,
635 .sidebar-mini
.sidebar-collapse
.sidebar-menu
> li
> .treeview-menu
,
636 .sidebar-mini
.sidebar-collapse
.sidebar-menu
> li
> a
> .pull-right
,
637 .sidebar-mini.sidebar-collapse .sidebar-menu li.header {
638 display: none
!important
;
639 -webkit-transform: translateZ
(0);
641 .sidebar-mini.sidebar-collapse .main-header .logo {
644 .sidebar-mini.sidebar-collapse .main-header .logo > .logo-mini {
650 .sidebar-mini.sidebar-collapse .main-header .logo > .logo-lg {
653 .sidebar-mini.sidebar-collapse .main-header .navbar {
658 .main-sidebar
.user-panel
,
659 .sidebar-menu > li.header {
663 .sidebar-menu:hover {
667 .sidebar-menu > li.header {
671 .sidebar-menu li > a {
674 .sidebar-menu li > a > .pull-right {
681 * Component: Control sidebar. By default, this is the right sidebar.
683 .control-sidebar-bg {
693 -webkit-transition: right
0.3s ease-in-out
;
694 -o-transition: right
0.3s ease-in-out
;
695 transition: right
0.3s ease-in-out
;
702 @media (max-width: 768px) {
707 .control-sidebar > .tab-content {
710 .control-sidebar
.control-sidebar-open
,
711 .control-sidebar.control-sidebar-open + .control-sidebar-bg {
714 .control-sidebar-open
.control-sidebar-bg
,
715 .control-sidebar-open .control-sidebar {
718 @media (min-width: 768px) {
719 .control-sidebar-open
.content-wrapper
,
720 .control-sidebar-open
.right-side
,
721 .control-sidebar-open .main-footer {
725 .nav-tabs
.control-sidebar-tabs
> li:first-of-type
> a
,
726 .nav-tabs
.control-sidebar-tabs
> li:first-of-type
> a:hover
,
727 .nav-tabs.control-sidebar-tabs > li:first-of-type > a:focus {
728 border-left-width: 0;
730 .nav-tabs.control-sidebar-tabs > li > a {
733 .nav-tabs
.control-sidebar-tabs
> li
> a
,
734 .nav-tabs.control-sidebar-tabs > li > a:hover {
737 border-left: 1px solid transparent
;
738 border-bottom: 1px solid transparent
;
740 .nav-tabs.control-sidebar-tabs > li > a .icon {
743 .nav-tabs
.control-sidebar-tabs
> li
.active
> a
,
744 .nav-tabs
.control-sidebar-tabs
> li
.active
> a:hover
,
745 .nav-tabs
.control-sidebar-tabs
> li
.active
> a:focus
,
746 .nav-tabs.control-sidebar-tabs > li.active > a:active {
751 @media (max-width: 768px) {
752 .nav-tabs.control-sidebar-tabs {
755 .nav-tabs.control-sidebar-tabs > li {
759 .control-sidebar-heading {
765 .control-sidebar-subheading {
770 .control-sidebar-menu {
775 .control-sidebar-menu > li > a {
779 .control-sidebar-menu
> li
> a:before
,
780 .control-sidebar-menu > li > a:after {
784 .control-sidebar-menu > li > a:after {
787 .control-sidebar-menu > li > a > .control-sidebar-subheading {
790 .control-sidebar-menu .menu-icon {
798 .control-sidebar-menu .menu-info {
802 .control-sidebar-menu .menu-info > .control-sidebar-subheading {
805 .control-sidebar-menu .menu-info > p {
809 .control-sidebar-menu .progress {
812 .control-sidebar-dark {
815 .control-sidebar-dark
,
816 .control-sidebar-dark + .control-sidebar-bg {
819 .control-sidebar-dark .nav-tabs.control-sidebar-tabs {
820 border-bottom: #1c2529;
822 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a {
826 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
> a
,
827 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
> a:hover
,
828 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:focus {
829 border-left-color: #141a1d;
830 border-bottom-color: #141a1d;
832 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
> a:hover
,
833 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
> a:focus
,
834 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:active {
837 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:hover {
840 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
.active
> a
,
841 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
.active
> a:hover
,
842 .control-sidebar-dark
.nav-tabs
.control-sidebar-tabs
> li
.active
> a:focus
,
843 .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li.active > a:active {
847 .control-sidebar-dark
.control-sidebar-heading
,
848 .control-sidebar-dark .control-sidebar-subheading {
851 .control-sidebar-dark .control-sidebar-menu > li > a:hover {
854 .control-sidebar-dark .control-sidebar-menu > li > a .menu-info > p {
857 .control-sidebar-light {
860 .control-sidebar-light
,
861 .control-sidebar-light + .control-sidebar-bg {
863 border-left: 1px solid
#d2d6de;
865 .control-sidebar-light .nav-tabs.control-sidebar-tabs {
866 border-bottom: #d2d6de;
868 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a {
872 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
> a
,
873 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
> a:hover
,
874 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:focus {
875 border-left-color: #d2d6de;
876 border-bottom-color: #d2d6de;
878 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
> a:hover
,
879 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
> a:focus
,
880 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:active {
883 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
.active
> a
,
884 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
.active
> a:hover
,
885 .control-sidebar-light
.nav-tabs
.control-sidebar-tabs
> li
.active
> a:focus
,
886 .control-sidebar-light .nav-tabs.control-sidebar-tabs > li.active > a:active {
890 .control-sidebar-light
.control-sidebar-heading
,
891 .control-sidebar-light .control-sidebar-subheading {
894 .control-sidebar-light .control-sidebar-menu {
897 .control-sidebar-light .control-sidebar-menu > li > a:hover {
900 .control-sidebar-light .control-sidebar-menu > li > a .menu-info > p {
904 * Component: Dropdown menus
905 * -------------------------
907 /*Dropdowns in general*/
912 .dropdown-menu > li > a {
915 .dropdown-menu
> li
> a
> .glyphicon
,
916 .dropdown-menu
> li
> a
> .fa
,
917 .dropdown-menu > li > a > .ion {
920 .dropdown-menu > li > a:hover {
921 background-color: #e1e3e9;
924 .dropdown-menu > .divider {
925 background-color: #eee;
927 .navbar-nav
> .notifications-menu
> .dropdown-menu
,
928 .navbar-nav
> .messages-menu
> .dropdown-menu
,
929 .navbar-nav > .tasks-menu > .dropdown-menu {
935 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
,
936 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
,
937 .navbar-nav > .tasks-menu > .dropdown-menu > li {
940 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.header
,
941 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.header
,
942 .navbar-nav > .tasks-menu > .dropdown-menu > li.header {
943 border-top-left-radius: 4px;
944 border-top-right-radius: 4px;
945 border-bottom-right-radius: 0;
946 border-bottom-left-radius: 0;
947 background-color: #ffffff;
949 border-bottom: 1px solid
#f4f4f4;
953 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.footer
> a
,
954 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.footer
> a
,
955 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a {
956 border-top-left-radius: 0;
957 border-top-right-radius: 0;
958 border-bottom-right-radius: 4px;
959 border-bottom-left-radius: 4px;
961 background-color: #fff;
963 border-bottom: 1px solid
#eeeeee;
964 color: #444!important
;
967 @media (max-width: 991px) {
968 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.footer
> a
,
969 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.footer
> a
,
970 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a {
971 background: #fff!important
;
972 color: #444!important
;
975 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.footer
> a:hover
,
976 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.footer
> a:hover
,
977 .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a:hover {
978 text-decoration: none
;
981 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.menu
,
982 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.menu
,
983 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu {
990 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.menu
> li
> a
,
991 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.menu
> li
> a
,
992 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a {
995 /* Prevent text from breaking */
996 border-bottom: 1px solid
#f4f4f4;
998 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.menu
> li
> a:hover
,
999 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.menu
> li
> a:hover
,
1000 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a:hover {
1001 background: #f4f4f4;
1002 text-decoration: none
;
1004 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a {
1007 text-overflow: ellipsis
;
1008 white-space: nowrap
;
1011 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.menu
> li
> a
> .glyphicon
,
1012 .navbar-nav
> .notifications-menu
> .dropdown-menu
> li
.menu
> li
> a
> .fa
,
1013 .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion {
1016 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a {
1020 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > div > img {
1021 margin: auto
10px auto auto
;
1025 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 {
1032 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 > small {
1039 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > p {
1044 .navbar-nav
> .messages-menu
> .dropdown-menu
> li
.menu
> li
> a:before
,
1045 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after {
1049 .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after {
1052 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a {
1055 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > h3 {
1061 .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > .progress {
1065 .navbar-nav > .user-menu > .dropdown-menu {
1066 border-top-right-radius: 0;
1067 border-top-left-radius: 0;
1069 border-top-width: 0;
1072 .navbar-nav
> .user-menu
> .dropdown-menu
,
1073 .navbar-nav > .user-menu > .dropdown-menu > .user-body {
1074 border-bottom-right-radius: 4px;
1075 border-bottom-left-radius: 4px;
1077 .navbar-nav > .user-menu > .dropdown-menu > li.user-header {
1082 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {
1087 border-color: transparent
;
1088 border-color: rgba
(255, 255, 255, 0.2);
1090 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > p {
1093 color: rgba
(255, 255, 255, 0.8);
1097 .navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > small {
1101 .navbar-nav > .user-menu > .dropdown-menu > .user-body {
1103 border-bottom: 1px solid
#f4f4f4;
1104 border-top: 1px solid
#dddddd;
1106 .navbar-nav
> .user-menu
> .dropdown-menu
> .user-body:before
,
1107 .navbar-nav > .user-menu > .dropdown-menu > .user-body:after {
1111 .navbar-nav > .user-menu > .dropdown-menu > .user-body:after {
1114 .navbar-nav > .user-menu > .dropdown-menu > .user-body a {
1115 color: #444 !important
;
1117 @media (max-width: 991px) {
1118 .navbar-nav > .user-menu > .dropdown-menu > .user-body a {
1119 background: #fff !important
;
1120 color: #444 !important
;
1123 .navbar-nav > .user-menu > .dropdown-menu > .user-footer {
1124 background-color: #f9f9f9;
1127 .navbar-nav
> .user-menu
> .dropdown-menu
> .user-footer:before
,
1128 .navbar-nav > .user-menu > .dropdown-menu > .user-footer:after {
1132 .navbar-nav > .user-menu > .dropdown-menu > .user-footer:after {
1135 .navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default {
1138 @media (max-width: 991px) {
1139 .navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default:hover {
1140 background-color: #f9f9f9;
1143 .navbar-nav > .user-menu .user-image {
1151 @media (max-width: 767px) {
1152 .navbar-nav > .user-menu .user-image {
1159 /* Add fade animation to dropdown menus by appending
1160 the class .animated-dropdown-menu to the .dropdown-menu ul (or ol)*/
1161 .open:not(.dropup) > .animated-dropdown-menu {
1162 backface-visibility: visible
!important
;
1163 -webkit-animation: flipInX
0.7s both
;
1164 -o-animation: flipInX
0.7s both
;
1165 animation: flipInX
0.7s both
;
1167 @keyframes flipInX
{
1169 transform: perspective
(400px) rotate3d
(1, 0, 0, 90deg);
1170 transition-timing-function: ease-in
;
1174 transform: perspective
(400px) rotate3d
(1, 0, 0, -20deg);
1175 transition-timing-function: ease-in
;
1178 transform: perspective
(400px) rotate3d
(1, 0, 0, 10deg);
1182 transform: perspective
(400px) rotate3d
(1, 0, 0, -5deg);
1185 transform: perspective
(400px);
1188 @-webkit-keyframes flipInX
{
1190 -webkit-transform: perspective
(400px) rotate3d
(1, 0, 0, 90deg);
1191 -webkit-transition-timing-function: ease-in
;
1195 -webkit-transform: perspective
(400px) rotate3d
(1, 0, 0, -20deg);
1196 -webkit-transition-timing-function: ease-in
;
1199 -webkit-transform: perspective
(400px) rotate3d
(1, 0, 0, 10deg);
1203 -webkit-transform: perspective
(400px) rotate3d
(1, 0, 0, -5deg);
1206 -webkit-transform: perspective
(400px);
1209 /* Fix dropdown menu in navbars */
1210 .navbar-custom-menu > .navbar-nav > li {
1213 .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
1218 @media (max-width: 991px) {
1219 .navbar-custom-menu > .navbar-nav {
1222 .navbar-custom-menu > .navbar-nav > li {
1225 .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
1229 border: 1px solid
#ddd;
1240 border-color: #d2d6de;
1242 .form-control:focus {
1243 border-color: #3c8dbc;
1246 .form-control::-moz-placeholder
,
1247 .form-control:-ms-input-placeholder
,
1248 .form-control::-webkit-input-placeholder {
1252 .form-control:not(select) {
1253 -webkit-appearance: none
;
1254 -moz-appearance: none
;
1257 .form-group.has-success label {
1260 .form-group.has-success .form-control {
1261 border-color: #00a65a;
1264 .form-group.has-warning label {
1267 .form-group.has-warning .form-control {
1268 border-color: #f39c12;
1271 .form-group.has-error label {
1274 .form-group.has-error .form-control {
1275 border-color: #dd4b39;
1279 .input-group .input-group-addon {
1281 border-color: #d2d6de;
1282 background-color: #fff;
1285 .btn-group-vertical
.btn
.btn-flat:first-of-type
,
1286 .btn-group-vertical .btn.btn-flat:last-of-type {
1292 /* support Font Awesome icons in form-control */
1293 .form-control-feedback.fa {
1296 .input-lg
+ .form-control-feedback
.fa
,
1297 .input-group-lg
+ .form-control-feedback
.fa
,
1298 .form-group-lg .form-control + .form-control-feedback.fa {
1301 .input-sm
+ .form-control-feedback
.fa
,
1302 .input-group-sm
+ .form-control-feedback
.fa
,
1303 .form-group-sm .form-control + .form-control-feedback.fa {
1307 * Component: Progress Bar
1308 * -----------------------
1311 .progress > .progress-bar {
1312 -webkit-box-shadow: none
;
1316 .progress
> .progress-bar
,
1317 .progress
.progress-bar
,
1318 .progress > .progress-bar .progress-bar {
1321 /* size variation */
1328 .progress
.sm
.progress-bar
,
1329 .progress-sm .progress-bar {
1338 .progress
.xs
.progress-bar
,
1339 .progress-xs .progress-bar {
1348 .progress
.xxs
.progress-bar
,
1349 .progress-xxs .progress-bar {
1353 .progress.vertical {
1357 display: inline-block
;
1360 .progress.vertical > .progress-bar {
1365 .progress
.vertical
.sm
,
1366 .progress.vertical.progress-sm {
1369 .progress
.vertical
.xs
,
1370 .progress.vertical.progress-xs {
1373 .progress
.vertical
.xxs
,
1374 .progress.vertical.progress-xxs {
1377 .progress-group .progress-text {
1380 .progress-group .progress-number {
1383 /* Remove margins from progress bars when put in a table */
1384 .table tr > td .progress {
1387 .progress-bar-light-blue
,
1388 .progress-bar-primary {
1389 background-color: #3c8dbc;
1391 .progress-striped
.progress-bar-light-blue
,
1392 .progress-striped .progress-bar-primary {
1393 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
);
1394 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
);
1395 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
);
1397 .progress-bar-green
,
1398 .progress-bar-success {
1399 background-color: #00a65a;
1401 .progress-striped
.progress-bar-green
,
1402 .progress-striped .progress-bar-success {
1403 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
);
1404 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
);
1405 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
);
1408 .progress-bar-info {
1409 background-color: #00c0ef;
1411 .progress-striped
.progress-bar-aqua
,
1412 .progress-striped .progress-bar-info {
1413 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
);
1414 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
);
1415 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
);
1417 .progress-bar-yellow
,
1418 .progress-bar-warning {
1419 background-color: #f39c12;
1421 .progress-striped
.progress-bar-yellow
,
1422 .progress-striped .progress-bar-warning {
1423 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
);
1424 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
);
1425 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 .progress-bar-danger {
1429 background-color: #dd4b39;
1431 .progress-striped
.progress-bar-red
,
1432 .progress-striped .progress-bar-danger {
1433 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
);
1434 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
);
1435 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 * Component: Small Box
1439 * --------------------
1445 margin-bottom: 20px;
1446 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
1448 .small-box > .inner {
1451 .small-box > .small-box-footer {
1456 color: rgba
(255, 255, 255, 0.8);
1459 background: rgba
(0, 0, 0, 0.1);
1460 text-decoration: none
;
1462 .small-box > .small-box-footer:hover {
1464 background: rgba
(0, 0, 0, 0.15);
1470 white-space: nowrap
;
1476 .small-box p > small {
1487 -webkit-transition: all
0.3s linear
;
1488 -o-transition: all
0.3s linear
;
1489 transition: all
0.3s linear
;
1495 color: rgba
(0, 0, 0, 0.15);
1498 text-decoration: none
;
1501 .small-box:hover .icon {
1504 @media (max-width: 767px) {
1522 background: #ffffff;
1523 border-top: 3px solid
#d2d6de;
1524 margin-bottom: 20px;
1526 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
1529 border-top-color: #3c8dbc;
1532 border-top-color: #00c0ef;
1535 border-top-color: #dd4b39;
1538 border-top-color: #f39c12;
1541 border-top-color: #00a65a;
1544 border-top-color: #d2d6de;
1546 .box
.collapsed-box
.box-body
,
1547 .box.collapsed-box .box-footer {
1550 .box .nav-stacked > li {
1551 border-bottom: 1px solid
#f4f4f4;
1554 .box .nav-stacked > li:last-of-type {
1555 border-bottom: none
;
1557 .box.height-control .box-body {
1561 .box .border-right {
1562 border-right: 1px solid
#f4f4f4;
1565 border-left: 1px solid
#f4f4f4;
1570 .box.box-solid > .box-header .btn.btn-default {
1571 background: transparent
;
1573 .box
.box-solid
> .box-header
.btn:hover
,
1574 .box.box-solid > .box-header a:hover {
1575 background: rgba
(0, 0, 0, 0.1);
1577 .box.box-solid.box-default {
1578 border: 1px solid
#d2d6de;
1580 .box.box-solid.box-default > .box-header {
1582 background: #d2d6de;
1583 background-color: #d2d6de;
1585 .box
.box-solid
.box-default
> .box-header a
,
1586 .box.box-solid.box-default > .box-header .btn {
1589 .box.box-solid.box-primary {
1590 border: 1px solid
#3c8dbc;
1592 .box.box-solid.box-primary > .box-header {
1594 background: #3c8dbc;
1595 background-color: #3c8dbc;
1597 .box
.box-solid
.box-primary
> .box-header a
,
1598 .box.box-solid.box-primary > .box-header .btn {
1601 .box.box-solid.box-info {
1602 border: 1px solid
#00c0ef;
1604 .box.box-solid.box-info > .box-header {
1606 background: #00c0ef;
1607 background-color: #00c0ef;
1609 .box
.box-solid
.box-info
> .box-header a
,
1610 .box.box-solid.box-info > .box-header .btn {
1613 .box.box-solid.box-danger {
1614 border: 1px solid
#dd4b39;
1616 .box.box-solid.box-danger > .box-header {
1618 background: #dd4b39;
1619 background-color: #dd4b39;
1621 .box
.box-solid
.box-danger
> .box-header a
,
1622 .box.box-solid.box-danger > .box-header .btn {
1625 .box.box-solid.box-warning {
1626 border: 1px solid
#f39c12;
1628 .box.box-solid.box-warning > .box-header {
1630 background: #f39c12;
1631 background-color: #f39c12;
1633 .box
.box-solid
.box-warning
> .box-header a
,
1634 .box.box-solid.box-warning > .box-header .btn {
1637 .box.box-solid.box-success {
1638 border: 1px solid
#00a65a;
1640 .box.box-solid.box-success > .box-header {
1642 background: #00a65a;
1643 background-color: #00a65a;
1645 .box
.box-solid
.box-success
> .box-header a
,
1646 .box.box-solid.box-success > .box-header .btn {
1649 .box.box-solid > .box-header > .box-tools .btn {
1653 .box.box-solid[class*='bg'] > .box-header {
1656 .box .box-group > .box {
1664 margin-bottom: 0.3em;
1667 .overlay-wrapper
> .overlay
,
1668 .box
> .loading-img
,
1669 .overlay-wrapper > .loading-img {
1677 .overlay-wrapper .overlay {
1679 background: rgba
(255, 255, 255, 0.7);
1682 .box
.overlay
> .fa
,
1683 .overlay-wrapper .overlay > .fa {
1693 .overlay-wrapper .overlay.dark {
1694 background: rgba
(0, 0, 0, 0.5);
1716 .box-header.with-border {
1717 border-bottom: 1px solid
#f4f4f4;
1719 .collapsed-box .box-header.with-border {
1720 border-bottom: none
;
1723 .box-header
> .glyphicon
,
1725 .box-header .box-title {
1726 display: inline-block
;
1732 .box-header
> .glyphicon
,
1733 .box-header > .ion {
1736 .box-header > .box-tools {
1741 .box-header > .box-tools [data-toggle="tooltip"] {
1744 .box-header > .box-tools.pull-right .dropdown-menu {
1751 background: transparent
;
1754 .open
.btn-box-tool
,
1755 .btn-box-tool:hover {
1758 .btn-box-tool.btn:active {
1762 border-top-left-radius: 0;
1763 border-top-right-radius: 0;
1764 border-bottom-right-radius: 3px;
1765 border-bottom-left-radius: 3px;
1768 .no-header .box-body {
1769 border-top-right-radius: 3px;
1770 border-top-left-radius: 3px;
1772 .box-body > .table {
1778 .box-body .full-width-chart {
1781 .box-body.no-padding .full-width-chart {
1784 .box-body .box-pane {
1785 border-top-left-radius: 0;
1786 border-top-right-radius: 0;
1787 border-bottom-right-radius: 0;
1788 border-bottom-left-radius: 3px;
1790 .box-body .box-pane-right {
1791 border-top-left-radius: 0;
1792 border-top-right-radius: 0;
1793 border-bottom-right-radius: 3px;
1794 border-bottom-left-radius: 0;
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 border-top: 1px solid
#f4f4f4;
1803 background-color: #ffffff;
1808 @media (max-width: 991px) {
1809 .chart-legend > li {
1815 background: #f7f7f7;
1817 .box-comments .box-comment {
1819 border-bottom: 1px solid
#eee;
1821 .box-comments
.box-comment:before
,
1822 .box-comments .box-comment:after {
1826 .box-comments .box-comment:after {
1829 .box-comments .box-comment:last-of-type {
1832 .box-comments .box-comment:first-of-type {
1835 .box-comments .box-comment img {
1838 .box-comments .comment-text {
1842 .box-comments .username {
1847 .box-comments .text-muted {
1851 /* Widget: TODO LIST */
1861 background: #f4f4f4;
1863 border-left: 2px solid
#e6e7e8;
1866 .todo-list > li:last-of-type {
1869 .todo-list > li > input[type='checkbox'] {
1870 margin: 0 10px 0 5px;
1872 .todo-list > li .text {
1873 display: inline-block
;
1877 .todo-list > li .label {
1881 .todo-list > li .tools {
1886 .todo-list
> li
.tools
> .fa
,
1887 .todo-list
> li
.tools
> .glyphicon
,
1888 .todo-list > li .tools > .ion {
1892 .todo-list > li:hover .tools {
1893 display: inline-block
;
1895 .todo-list > li.done {
1898 .todo-list > li.done .text {
1899 text-decoration: line-through
;
1902 .todo-list > li.done .label {
1903 background: #d2d6de !important
;
1905 .todo-list .danger {
1906 border-left-color: #dd4b39;
1908 .todo-list .warning {
1909 border-left-color: #f39c12;
1912 border-left-color: #00c0ef;
1914 .todo-list .success {
1915 border-left-color: #00a65a;
1917 .todo-list .primary {
1918 border-left-color: #3c8dbc;
1920 .todo-list .handle {
1921 display: inline-block
;
1925 /* Chat widget (DEPRECATED - this will be removed in the next major release. Use Direct Chat instead)*/
1927 padding: 5px 20px 5px 10px;
1930 margin-bottom: 10px;
1943 border: 2px solid transparent
;
1946 .chat .item > .online {
1947 border: 2px solid
#00a65a;
1949 .chat .item > .offline {
1950 border: 2px solid
#dd4b39;
1952 .chat .item > .message {
1956 .chat .item > .message > .name {
1960 .chat .item > .attachment {
1962 background: #f4f4f4;
1967 .chat .item > .attachment > h4 {
1972 .chat
.item
> .attachment
> p
,
1973 .chat .item > .attachment > .filename {
1979 .chat
.item
> .attachment:before
,
1980 .chat .item > .attachment:after {
1984 .chat .item > .attachment:after {
1990 .modal .panel-body {
1994 * Component: Info Box
1995 * -------------------
2002 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2004 margin-bottom: 15px;
2009 .info-box .progress {
2010 background: rgba
(0, 0, 0, 0.2);
2011 margin: 5px -10px 5px -10px;
2014 .info-box
.progress
,
2015 .info-box .progress .progress-bar {
2018 .info-box .progress .progress-bar {
2022 border-top-left-radius: 2px;
2023 border-top-right-radius: 0;
2024 border-bottom-right-radius: 0;
2025 border-bottom-left-radius: 2px;
2033 background: rgba
(0, 0, 0, 0.2);
2035 .info-box-icon > img {
2047 .progress-description
,
2051 white-space: nowrap
;
2053 text-overflow: ellipsis
;
2056 text-transform: uppercase
;
2061 .progress-description {
2065 * Component: Timeline
2066 * -------------------
2088 margin-bottom: 15px;
2090 .timeline
> li:before
,
2091 .timeline > li:after {
2095 .timeline > li:after {
2098 .timeline > li > .timeline-item {
2099 -webkit-box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2100 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2110 .timeline > li > .timeline-item > .time {
2116 .timeline > li > .timeline-item > .timeline-header {
2119 border-bottom: 1px solid
#f4f4f4;
2124 .timeline > li > .timeline-item > .timeline-header > a {
2127 .timeline
> li
> .timeline-item
> .timeline-body
,
2128 .timeline > li > .timeline-item > .timeline-footer {
2131 .timeline
> li
> .fa
,
2132 .timeline
> li
> .glyphicon
,
2133 .timeline > li > .ion {
2140 background: #d2d6de;
2146 .timeline > .time-label > span {
2149 display: inline-block
;
2150 background-color: #fff;
2153 .timeline-inverse > li > .timeline-item {
2154 background: #f0f0f0;
2155 border: 1px solid
#ddd;
2156 -webkit-box-shadow: none
;
2159 .timeline-inverse > li > .timeline-item > .timeline-header {
2160 border-bottom-color: #ddd;
2168 -webkit-box-shadow: none
;
2170 border: 1px solid transparent
;
2173 text-transform: uppercase
;
2177 -webkit-box-shadow: none
;
2178 -moz-box-shadow: none
;
2183 -webkit-box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2184 -moz-box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2185 box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2194 .btn.btn-file > input[type='file'] {
2203 filter: alpha
(opacity
=0);
2210 background-color: #f4f4f4;
2215 .btn-default:active
,
2216 .btn-default.hover {
2217 background-color: #e7e7e7;
2220 background-color: #3c8dbc;
2221 border-color: #367fa9;
2224 .btn-primary:active
,
2225 .btn-primary.hover {
2226 background-color: #367fa9;
2229 background-color: #00a65a;
2230 border-color: #008d4c;
2233 .btn-success:active
,
2234 .btn-success.hover {
2235 background-color: #008d4c;
2238 background-color: #00c0ef;
2239 border-color: #00acd6;
2244 background-color: #00acd6;
2247 background-color: #dd4b39;
2248 border-color: #d73925;
2253 background-color: #d73925;
2256 background-color: #f39c12;
2257 border-color: #e08e0b;
2260 .btn-warning:active
,
2261 .btn-warning.hover {
2262 background-color: #e08e0b;
2265 border: 1px solid
#fff;
2266 background: transparent
;
2271 .btn-outline:active {
2272 color: rgba
(255, 255, 255, 0.7);
2273 border-color: rgba
(255, 255, 255, 0.7);
2276 -webkit-box-shadow: none
;
2279 .btn[class*='bg-']:hover {
2280 -webkit-box-shadow: inset
0 0 100px rgba
(0, 0, 0, 0.2);
2281 box-shadow: inset
0 0 100px rgba
(0, 0, 0, 0.2);
2287 margin: 0 0 10px 10px;
2292 border: 1px solid
#ddd;
2293 background-color: #f4f4f4;
2297 .btn-app
> .glyphicon
,
2303 background: #f4f4f4;
2309 -webkit-box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2310 -moz-box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2311 box-shadow: inset
0 3px 5px rgba
(0, 0, 0, 0.125);
2321 * Component: Callout
2322 * ------------------
2327 padding: 15px 30px 15px 15px;
2328 border-left: 5px solid
#eee;
2332 text-decoration: underline
;
2341 .callout p:last-child {
2345 .callout .highlight {
2346 background-color: #fff;
2348 .callout.callout-danger {
2349 border-color: #c23321;
2351 .callout.callout-warning {
2352 border-color: #c87f0a;
2354 .callout.callout-info {
2355 border-color: #0097bc;
2357 .callout.callout-success {
2358 border-color: #00733e;
2376 filter: alpha
(opacity
=20);
2378 .alert .close:hover {
2380 filter: alpha
(opacity
=50);
2384 text-decoration: underline
;
2387 border-color: #008d4c;
2391 border-color: #d73925;
2394 border-color: #e08e0b;
2397 border-color: #00acd6;
2403 .nav
> li
> a:hover
,
2404 .nav
> li
> a:active
,
2405 .nav > li > a:focus {
2407 background: #f7f7f7;
2410 .nav-pills > li > a {
2412 border-top: 3px solid transparent
;
2415 .nav-pills
> li
> a
> .fa
,
2416 .nav-pills
> li
> a
> .glyphicon
,
2417 .nav-pills > li > a > .ion {
2420 .nav-pills
> li
.active
> a
,
2421 .nav-pills
> li
.active
> a:hover
,
2422 .nav-pills > li.active > a:focus {
2423 border-top-color: #3c8dbc;
2425 .nav-pills > li.active > a {
2429 .nav-stacked > li > a {
2432 border-left: 3px solid transparent
;
2435 .nav-stacked
> li
.active
> a
,
2436 .nav-stacked > li.active > a:hover {
2437 background: transparent
;
2440 border-left-color: #3c8dbc;
2442 .nav-stacked > li.header {
2443 border-bottom: 1px solid
#ddd;
2445 margin-bottom: 10px;
2447 text-transform: uppercase
;
2451 margin-bottom: 20px;
2453 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2456 .nav-tabs-custom > .nav-tabs {
2458 border-bottom-color: #f4f4f4;
2459 border-top-right-radius: 3px;
2460 border-top-left-radius: 3px;
2462 .nav-tabs-custom > .nav-tabs > li {
2463 border-top: 3px solid transparent
;
2464 margin-bottom: -2px;
2467 .nav-tabs-custom > .nav-tabs > li > a {
2471 .nav-tabs-custom > .nav-tabs > li > a.text-muted {
2474 .nav-tabs-custom
> .nav-tabs
> li
> a
,
2475 .nav-tabs-custom > .nav-tabs > li > a:hover {
2476 background: transparent
;
2479 .nav-tabs-custom > .nav-tabs > li > a:hover {
2482 .nav-tabs-custom
> .nav-tabs
> li:not
(.active
) > a:hover
,
2483 .nav-tabs-custom
> .nav-tabs
> li:not
(.active
) > a:focus
,
2484 .nav-tabs-custom > .nav-tabs > li:not(.active) > a:active {
2485 border-color: transparent
;
2487 .nav-tabs-custom > .nav-tabs > li.active {
2488 border-top-color: #3c8dbc;
2490 .nav-tabs-custom
> .nav-tabs
> li
.active
> a
,
2491 .nav-tabs-custom > .nav-tabs > li.active:hover > a {
2492 background-color: #fff;
2495 .nav-tabs-custom > .nav-tabs > li.active > a {
2496 border-top-color: transparent
;
2497 border-left-color: #f4f4f4;
2498 border-right-color: #f4f4f4;
2500 .nav-tabs-custom > .nav-tabs > li:first-of-type {
2503 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
2504 border-left-color: transparent
;
2506 .nav-tabs-custom > .nav-tabs.pull-right {
2507 float: none
!important
;
2509 .nav-tabs-custom > .nav-tabs.pull-right > li {
2512 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type {
2515 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type > a {
2516 border-left-width: 1px;
2518 .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a {
2519 border-left-color: #f4f4f4;
2520 border-right-color: transparent
;
2522 .nav-tabs-custom > .nav-tabs > li.header {
2528 .nav-tabs-custom
> .nav-tabs
> li
.header
> .fa
,
2529 .nav-tabs-custom
> .nav-tabs
> li
.header
> .glyphicon
,
2530 .nav-tabs-custom > .nav-tabs > li.header > .ion {
2533 .nav-tabs-custom > .tab-content {
2536 border-bottom-right-radius: 3px;
2537 border-bottom-left-radius: 3px;
2539 .nav-tabs-custom
.dropdown
.open
> a:active
,
2540 .nav-tabs-custom .dropdown.open > a:focus {
2541 background: transparent
;
2545 .pagination > li > a {
2546 background: #fafafa;
2549 .pagination.pagination-flat > li > a {
2550 border-radius: 0 !important
;
2553 * Component: Products List
2554 * ------------------------
2561 .products-list > .item {
2563 -webkit-box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2564 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
2568 .products-list
> .item:before
,
2569 .products-list > .item:after {
2573 .products-list > .item:after {
2576 .products-list .product-img {
2579 .products-list .product-img img {
2583 .products-list .product-info {
2586 .products-list .product-title {
2589 .products-list .product-description {
2593 white-space: nowrap
;
2594 text-overflow: ellipsis
;
2596 .product-list-in-box > .item {
2597 -webkit-box-shadow: none
;
2600 border-bottom: 1px solid
#f4f4f4;
2602 .product-list-in-box > .item:last-of-type {
2603 border-bottom-width: 0;
2609 .table
> thead
> tr
> th
,
2610 .table
> tbody
> tr
> th
,
2611 .table
> tfoot
> tr
> th
,
2612 .table
> thead
> tr
> td
,
2613 .table
> tbody
> tr
> td
,
2614 .table > tfoot > tr > td {
2615 border-top: 1px solid
#f4f4f4;
2617 .table > thead > tr > th {
2618 border-bottom: 2px solid
#f4f4f4;
2620 .table tr td .progress {
2624 border: 1px solid
#f4f4f4;
2626 .table-bordered
> thead
> tr
> th
,
2627 .table-bordered
> tbody
> tr
> th
,
2628 .table-bordered
> tfoot
> tr
> th
,
2629 .table-bordered
> thead
> tr
> td
,
2630 .table-bordered
> tbody
> tr
> td
,
2631 .table-bordered > tfoot > tr > td {
2632 border: 1px solid
#f4f4f4;
2634 .table-bordered
> thead
> tr
> th
,
2635 .table-bordered > thead > tr > td {
2636 border-bottom-width: 2px;
2639 .table
.no-border td
,
2640 .table.no-border th {
2643 /* .text-center in tables */
2645 table
.text-center td
,
2646 table
.text-center th
{
2660 background-color: #d2d6de;
2664 * Component: Direct Chat
2665 * ----------------------
2667 .direct-chat .box-body {
2668 border-bottom-right-radius: 0;
2669 border-bottom-left-radius: 0;
2674 .direct-chat.chat-pane-open .direct-chat-contacts {
2675 -webkit-transform: translate
(0, 0);
2676 -ms-transform: translate
(0, 0);
2677 -o-transform: translate
(0, 0);
2678 transform: translate
(0, 0);
2680 .direct-chat-messages {
2681 -webkit-transform: translate
(0, 0);
2682 -ms-transform: translate
(0, 0);
2683 -o-transform: translate
(0, 0);
2684 transform: translate
(0, 0);
2694 margin-bottom: 10px;
2696 .direct-chat-msg:before
,
2697 .direct-chat-msg:after {
2701 .direct-chat-msg:after {
2704 .direct-chat-messages
,
2705 .direct-chat-contacts {
2706 -webkit-transition: -webkit-transform
0.5s ease-in-out
;
2707 -moz-transition: -moz-transform
0.5s ease-in-out
;
2708 -o-transition: -o-transform
0.5s ease-in-out
;
2709 transition: transform
0.5s ease-in-out
;
2715 background: #d2d6de;
2716 border: 1px solid
#d2d6de;
2717 margin: 5px 0 0 50px;
2720 .direct-chat-text:after
,
2721 .direct-chat-text:before {
2725 border: solid transparent
;
2726 border-right-color: #d2d6de;
2730 pointer-events: none
;
2732 .direct-chat-text:after {
2736 .direct-chat-text:before {
2740 .right .direct-chat-text {
2744 .right
.direct-chat-text:after
,
2745 .right .direct-chat-text:before {
2748 border-right-color: transparent
;
2749 border-left-color: #d2d6de;
2757 .right .direct-chat-img {
2768 .direct-chat-timestamp {
2771 .direct-chat-contacts-open .direct-chat-contacts {
2772 -webkit-transform: translate
(0, 0);
2773 -ms-transform: translate
(0, 0);
2774 -o-transform: translate
(0, 0);
2775 transform: translate
(0, 0);
2777 .direct-chat-contacts {
2778 -webkit-transform: translate
(101%, 0);
2779 -ms-transform: translate
(101%, 0);
2780 -o-transform: translate
(101%, 0);
2781 transform: translate
(101%, 0);
2787 background: #222d32;
2791 .contacts-list > li {
2792 border-bottom: 1px solid rgba
(0, 0, 0, 0.2);
2796 .contacts-list
> li:before
,
2797 .contacts-list > li:after {
2801 .contacts-list > li:after {
2804 .contacts-list > li:last-of-type {
2805 border-bottom: none
;
2807 .contacts-list-img {
2812 .contacts-list-info {
2816 .contacts-list-name
,
2817 .contacts-list-status {
2820 .contacts-list-name {
2823 .contacts-list-status {
2826 .contacts-list-date {
2828 font-weight: normal
;
2830 .contacts-list-msg {
2833 .direct-chat-danger .right > .direct-chat-text {
2834 background: #dd4b39;
2835 border-color: #dd4b39;
2838 .direct-chat-danger
.right
> .direct-chat-text:after
,
2839 .direct-chat-danger .right > .direct-chat-text:before {
2840 border-left-color: #dd4b39;
2842 .direct-chat-primary .right > .direct-chat-text {
2843 background: #3c8dbc;
2844 border-color: #3c8dbc;
2847 .direct-chat-primary
.right
> .direct-chat-text:after
,
2848 .direct-chat-primary .right > .direct-chat-text:before {
2849 border-left-color: #3c8dbc;
2851 .direct-chat-warning .right > .direct-chat-text {
2852 background: #f39c12;
2853 border-color: #f39c12;
2856 .direct-chat-warning
.right
> .direct-chat-text:after
,
2857 .direct-chat-warning .right > .direct-chat-text:before {
2858 border-left-color: #f39c12;
2860 .direct-chat-info .right > .direct-chat-text {
2861 background: #00c0ef;
2862 border-color: #00c0ef;
2865 .direct-chat-info
.right
> .direct-chat-text:after
,
2866 .direct-chat-info .right > .direct-chat-text:before {
2867 border-left-color: #00c0ef;
2869 .direct-chat-success .right > .direct-chat-text {
2870 background: #00a65a;
2871 border-color: #00a65a;
2874 .direct-chat-success
.right
> .direct-chat-text:after
,
2875 .direct-chat-success .right > .direct-chat-text:before {
2876 border-left-color: #00a65a;
2879 * Component: Users List
2880 * ---------------------
2888 .users-list > li img {
2893 .users-list
> li
> a:hover
,
2894 .users-list > li > a:hover .users-list-name {
2905 white-space: nowrap
;
2906 text-overflow: ellipsis
;
2913 * Component: Carousel
2914 * -------------------
2916 .carousel-control
.left
,
2917 .carousel-control.right {
2918 background-image: none
;
2920 .carousel-control > .fa {
2925 display: inline-block
;
2933 background: rgba
(0, 0, 0, 0.3);
2937 -webkit-box-shadow: 0 2px 3px rgba
(0, 0, 0, 0.125);
2938 box-shadow: 0 2px 3px rgba
(0, 0, 0, 0.125);
2941 @media (min-width: 768px) {
2943 -webkit-box-shadow: 0 2px 3px rgba
(0, 0, 0, 0.125);
2944 box-shadow: 0 2px 3px rgba
(0, 0, 0, 0.125);
2948 border-bottom-color: #f4f4f4;
2951 border-top-color: #f4f4f4;
2953 .modal-primary
.modal-header
,
2954 .modal-primary .modal-footer {
2955 border-color: #307095;
2957 .modal-warning
.modal-header
,
2958 .modal-warning .modal-footer {
2959 border-color: #c87f0a;
2961 .modal-info
.modal-header
,
2962 .modal-info .modal-footer {
2963 border-color: #0097bc;
2965 .modal-success
.modal-header
,
2966 .modal-success .modal-footer {
2967 border-color: #00733e;
2969 .modal-danger
.modal-header
,
2970 .modal-danger .modal-footer {
2971 border-color: #c23321;
2974 * Component: Social Widgets
2975 * -------------------------
2981 .widget-user .widget-user-header {
2984 border-top-right-radius: 3px;
2985 border-top-left-radius: 3px;
2987 .widget-user .widget-user-username {
2992 text-shadow: 0 1px 1px rgba
(0, 0, 0, 0.2);
2994 .widget-user .widget-user-desc {
2997 .widget-user .widget-user-image {
3003 .widget-user .widget-user-image > img {
3006 border: 3px solid
#fff;
3008 .widget-user .box-footer {
3011 .widget-user-2 .widget-user-header {
3013 border-top-right-radius: 3px;
3014 border-top-left-radius: 3px;
3016 .widget-user-2 .widget-user-username {
3022 .widget-user-2 .widget-user-desc {
3025 .widget-user-2
.widget-user-username
,
3026 .widget-user-2 .widget-user-desc {
3029 .widget-user-2 .widget-user-image > img {
3038 .mailbox-messages > .table {
3044 .mailbox-controls.with-border {
3045 border-bottom: 1px solid
#f4f4f4;
3047 .mailbox-read-info {
3048 border-bottom: 1px solid
#f4f4f4;
3051 .mailbox-read-info h3 {
3055 .mailbox-read-info h5 {
3059 .mailbox-read-time {
3063 .mailbox-read-message {
3066 .mailbox-attachments li {
3069 border: 1px solid
#eee;
3070 margin-bottom: 10px;
3073 .mailbox-attachment-name {
3077 .mailbox-attachment-icon
,
3078 .mailbox-attachment-info
,
3079 .mailbox-attachment-size {
3082 .mailbox-attachment-info {
3084 background: #f4f4f4;
3086 .mailbox-attachment-size {
3090 .mailbox-attachment-icon {
3096 .mailbox-attachment-icon.has-img {
3099 .mailbox-attachment-icon.has-img > img {
3107 /* ADD THIS CLASS TO THE <BODY> TAG */
3109 background: #d2d6de;
3114 margin-bottom: 25px;
3117 .lockscreen-logo a {
3120 .lockscreen-wrapper {
3125 /* User name [optional] */
3126 .lockscreen .lockscreen-name {
3130 /* Will contain the image and the sign in form */
3136 margin: 10px auto
30px auto
;
3149 .lockscreen-image > img {
3154 /* Contains the password input and the login button */
3155 .lockscreen-credentials {
3158 .lockscreen-credentials .form-control {
3161 .lockscreen-credentials .btn {
3162 background-color: #fff;
3166 .lockscreen-footer {
3170 * Page: Login & Register
3171 * ----------------------
3177 margin-bottom: 25px;
3186 background: #d2d6de;
3193 @media (max-width: 768px) {
3201 .register-box-body {
3207 .login-box-body
.form-control-feedback
,
3208 .register-box-body .form-control-feedback {
3215 padding: 0 20px 20px 20px;
3217 .social-auth-links {
3221 * Page: 400 and 500 error pages
3222 * ------------------------------
3226 margin: 20px auto
0 auto
;
3228 @media (max-width: 991px) {
3233 .error-page > .headline {
3238 @media (max-width: 991px) {
3239 .error-page > .headline {
3244 .error-page > .error-content {
3248 @media (max-width: 991px) {
3249 .error-page > .error-content {
3253 .error-page > .error-content > h3 {
3257 @media (max-width: 991px) {
3258 .error-page > .error-content > h3 {
3269 border: 1px solid
#f4f4f4;
3284 border: 3px solid
#d2d6de;
3291 border-bottom: 1px solid
#d2d6de;
3292 margin-bottom: 15px;
3293 padding-bottom: 15px;
3296 .post:last-of-type {
3302 margin-bottom: 15px;
3305 * Social Buttons for Bootstrap
3307 * Copyright 2013-2015 Panayiotis Lipiridis
3308 * Licensed under the MIT License
3310 * https://github.com/lipis/bootstrap-social
3316 white-space: nowrap
;
3318 text-overflow: ellipsis
;
3320 .btn-social > :first-child {
3329 border-right: 1px solid rgba
(0, 0, 0, 0.2);
3331 .btn-social.btn-lg {
3334 .btn-social.btn-lg > :first-child {
3339 .btn-social.btn-sm {
3342 .btn-social.btn-sm > :first-child {
3347 .btn-social.btn-xs {
3350 .btn-social.btn-xs > :first-child {
3359 white-space: nowrap
;
3361 text-overflow: ellipsis
;
3366 .btn-social-icon > :first-child {
3375 border-right: 1px solid rgba
(0, 0, 0, 0.2);
3377 .btn-social-icon.btn-lg {
3380 .btn-social-icon.btn-lg > :first-child {
3385 .btn-social-icon.btn-sm {
3388 .btn-social-icon.btn-sm > :first-child {
3393 .btn-social-icon.btn-xs {
3396 .btn-social-icon.btn-xs > :first-child {
3401 .btn-social-icon > :first-child {
3406 .btn-social-icon.btn-lg {
3412 .btn-social-icon.btn-sm {
3418 .btn-social-icon.btn-xs {
3426 background-color: #d87a68;
3427 border-color: rgba
(0, 0, 0, 0.2);
3434 .open > .dropdown-toggle.btn-adn {
3436 background-color: #ce563f;
3437 border-color: rgba
(0, 0, 0, 0.2);
3441 .open > .dropdown-toggle.btn-adn {
3442 background-image: none
;
3446 background-color: #ffffff;
3450 background-color: #205081;
3451 border-color: rgba
(0, 0, 0, 0.2);
3453 .btn-bitbucket:hover
,
3454 .btn-bitbucket:focus
,
3455 .btn-bitbucket
.focus
,
3456 .btn-bitbucket:active
,
3457 .btn-bitbucket
.active
,
3458 .open > .dropdown-toggle.btn-bitbucket {
3460 background-color: #163758;
3461 border-color: rgba
(0, 0, 0, 0.2);
3463 .btn-bitbucket:active
,
3464 .btn-bitbucket
.active
,
3465 .open > .dropdown-toggle.btn-bitbucket {
3466 background-image: none
;
3468 .btn-bitbucket .badge {
3470 background-color: #ffffff;
3474 background-color: #1087dd;
3475 border-color: rgba
(0, 0, 0, 0.2);
3480 .btn-dropbox:active
,
3481 .btn-dropbox
.active
,
3482 .open > .dropdown-toggle.btn-dropbox {
3484 background-color: #0d6aad;
3485 border-color: rgba
(0, 0, 0, 0.2);
3487 .btn-dropbox:active
,
3488 .btn-dropbox
.active
,
3489 .open > .dropdown-toggle.btn-dropbox {
3490 background-image: none
;
3492 .btn-dropbox .badge {
3494 background-color: #ffffff;
3498 background-color: #3b5998;
3499 border-color: rgba
(0, 0, 0, 0.2);
3501 .btn-facebook:hover
,
3502 .btn-facebook:focus
,
3503 .btn-facebook
.focus
,
3504 .btn-facebook:active
,
3505 .btn-facebook
.active
,
3506 .open > .dropdown-toggle.btn-facebook {
3508 background-color: #2d4373;
3509 border-color: rgba
(0, 0, 0, 0.2);
3511 .btn-facebook:active
,
3512 .btn-facebook
.active
,
3513 .open > .dropdown-toggle.btn-facebook {
3514 background-image: none
;
3516 .btn-facebook .badge {
3518 background-color: #ffffff;
3522 background-color: #ff0084;
3523 border-color: rgba
(0, 0, 0, 0.2);
3530 .open > .dropdown-toggle.btn-flickr {
3532 background-color: #cc006a;
3533 border-color: rgba
(0, 0, 0, 0.2);
3537 .open > .dropdown-toggle.btn-flickr {
3538 background-image: none
;
3540 .btn-flickr .badge {
3542 background-color: #ffffff;
3546 background-color: #f94877;
3547 border-color: rgba
(0, 0, 0, 0.2);
3549 .btn-foursquare:hover
,
3550 .btn-foursquare:focus
,
3551 .btn-foursquare
.focus
,
3552 .btn-foursquare:active
,
3553 .btn-foursquare
.active
,
3554 .open > .dropdown-toggle.btn-foursquare {
3556 background-color: #f71752;
3557 border-color: rgba
(0, 0, 0, 0.2);
3559 .btn-foursquare:active
,
3560 .btn-foursquare
.active
,
3561 .open > .dropdown-toggle.btn-foursquare {
3562 background-image: none
;
3564 .btn-foursquare .badge {
3566 background-color: #ffffff;
3570 background-color: #444444;
3571 border-color: rgba
(0, 0, 0, 0.2);
3578 .open > .dropdown-toggle.btn-github {
3580 background-color: #2b2b2b;
3581 border-color: rgba
(0, 0, 0, 0.2);
3585 .open > .dropdown-toggle.btn-github {
3586 background-image: none
;
3588 .btn-github .badge {
3590 background-color: #ffffff;
3594 background-color: #dd4b39;
3595 border-color: rgba
(0, 0, 0, 0.2);
3602 .open > .dropdown-toggle.btn-google {
3604 background-color: #c23321;
3605 border-color: rgba
(0, 0, 0, 0.2);
3609 .open > .dropdown-toggle.btn-google {
3610 background-image: none
;
3612 .btn-google .badge {
3614 background-color: #ffffff;
3618 background-color: #3f729b;
3619 border-color: rgba
(0, 0, 0, 0.2);
3621 .btn-instagram:hover
,
3622 .btn-instagram:focus
,
3623 .btn-instagram
.focus
,
3624 .btn-instagram:active
,
3625 .btn-instagram
.active
,
3626 .open > .dropdown-toggle.btn-instagram {
3628 background-color: #305777;
3629 border-color: rgba
(0, 0, 0, 0.2);
3631 .btn-instagram:active
,
3632 .btn-instagram
.active
,
3633 .open > .dropdown-toggle.btn-instagram {
3634 background-image: none
;
3636 .btn-instagram .badge {
3638 background-color: #ffffff;
3642 background-color: #007bb6;
3643 border-color: rgba
(0, 0, 0, 0.2);
3645 .btn-linkedin:hover
,
3646 .btn-linkedin:focus
,
3647 .btn-linkedin
.focus
,
3648 .btn-linkedin:active
,
3649 .btn-linkedin
.active
,
3650 .open > .dropdown-toggle.btn-linkedin {
3652 background-color: #005983;
3653 border-color: rgba
(0, 0, 0, 0.2);
3655 .btn-linkedin:active
,
3656 .btn-linkedin
.active
,
3657 .open > .dropdown-toggle.btn-linkedin {
3658 background-image: none
;
3660 .btn-linkedin .badge {
3662 background-color: #ffffff;
3666 background-color: #2672ec;
3667 border-color: rgba
(0, 0, 0, 0.2);
3669 .btn-microsoft:hover
,
3670 .btn-microsoft:focus
,
3671 .btn-microsoft
.focus
,
3672 .btn-microsoft:active
,
3673 .btn-microsoft
.active
,
3674 .open > .dropdown-toggle.btn-microsoft {
3676 background-color: #125acd;
3677 border-color: rgba
(0, 0, 0, 0.2);
3679 .btn-microsoft:active
,
3680 .btn-microsoft
.active
,
3681 .open > .dropdown-toggle.btn-microsoft {
3682 background-image: none
;
3684 .btn-microsoft .badge {
3686 background-color: #ffffff;
3690 background-color: #f7931e;
3691 border-color: rgba
(0, 0, 0, 0.2);
3698 .open > .dropdown-toggle.btn-openid {
3700 background-color: #da7908;
3701 border-color: rgba
(0, 0, 0, 0.2);
3705 .open > .dropdown-toggle.btn-openid {
3706 background-image: none
;
3708 .btn-openid .badge {
3710 background-color: #ffffff;
3714 background-color: #cb2027;
3715 border-color: rgba
(0, 0, 0, 0.2);
3717 .btn-pinterest:hover
,
3718 .btn-pinterest:focus
,
3719 .btn-pinterest
.focus
,
3720 .btn-pinterest:active
,
3721 .btn-pinterest
.active
,
3722 .open > .dropdown-toggle.btn-pinterest {
3724 background-color: #9f191f;
3725 border-color: rgba
(0, 0, 0, 0.2);
3727 .btn-pinterest:active
,
3728 .btn-pinterest
.active
,
3729 .open > .dropdown-toggle.btn-pinterest {
3730 background-image: none
;
3732 .btn-pinterest .badge {
3734 background-color: #ffffff;
3738 background-color: #eff7ff;
3739 border-color: rgba
(0, 0, 0, 0.2);
3746 .open > .dropdown-toggle.btn-reddit {
3748 background-color: #bcddff;
3749 border-color: rgba
(0, 0, 0, 0.2);
3753 .open > .dropdown-toggle.btn-reddit {
3754 background-image: none
;
3756 .btn-reddit .badge {
3758 background-color: #000000;
3762 background-color: #ff5500;
3763 border-color: rgba
(0, 0, 0, 0.2);
3765 .btn-soundcloud:hover
,
3766 .btn-soundcloud:focus
,
3767 .btn-soundcloud
.focus
,
3768 .btn-soundcloud:active
,
3769 .btn-soundcloud
.active
,
3770 .open > .dropdown-toggle.btn-soundcloud {
3772 background-color: #cc4400;
3773 border-color: rgba
(0, 0, 0, 0.2);
3775 .btn-soundcloud:active
,
3776 .btn-soundcloud
.active
,
3777 .open > .dropdown-toggle.btn-soundcloud {
3778 background-image: none
;
3780 .btn-soundcloud .badge {
3782 background-color: #ffffff;
3786 background-color: #2c4762;
3787 border-color: rgba
(0, 0, 0, 0.2);
3794 .open > .dropdown-toggle.btn-tumblr {
3796 background-color: #1c2d3f;
3797 border-color: rgba
(0, 0, 0, 0.2);
3801 .open > .dropdown-toggle.btn-tumblr {
3802 background-image: none
;
3804 .btn-tumblr .badge {
3806 background-color: #ffffff;
3810 background-color: #55acee;
3811 border-color: rgba
(0, 0, 0, 0.2);
3816 .btn-twitter:active
,
3817 .btn-twitter
.active
,
3818 .open > .dropdown-toggle.btn-twitter {
3820 background-color: #2795e9;
3821 border-color: rgba
(0, 0, 0, 0.2);
3823 .btn-twitter:active
,
3824 .btn-twitter
.active
,
3825 .open > .dropdown-toggle.btn-twitter {
3826 background-image: none
;
3828 .btn-twitter .badge {
3830 background-color: #ffffff;
3834 background-color: #1ab7ea;
3835 border-color: rgba
(0, 0, 0, 0.2);
3842 .open > .dropdown-toggle.btn-vimeo {
3844 background-color: #1295bf;
3845 border-color: rgba
(0, 0, 0, 0.2);
3849 .open > .dropdown-toggle.btn-vimeo {
3850 background-image: none
;
3854 background-color: #ffffff;
3858 background-color: #587ea3;
3859 border-color: rgba
(0, 0, 0, 0.2);
3866 .open > .dropdown-toggle.btn-vk {
3868 background-color: #466482;
3869 border-color: rgba
(0, 0, 0, 0.2);
3873 .open > .dropdown-toggle.btn-vk {
3874 background-image: none
;
3878 background-color: #ffffff;
3882 background-color: #720e9e;
3883 border-color: rgba
(0, 0, 0, 0.2);
3890 .open > .dropdown-toggle.btn-yahoo {
3892 background-color: #500a6f;
3893 border-color: rgba
(0, 0, 0, 0.2);
3897 .open > .dropdown-toggle.btn-yahoo {
3898 background-image: none
;
3902 background-color: #ffffff;
3905 * Plugin: Full Calendar
3906 * ---------------------
3909 background: #f4f4f4;
3910 background-image: none
;
3913 border-bottom-color: #ddd;
3918 background-color: #e9e9e9;
3920 .fc-header-title h2 {
3927 padding-right: 10px;
3933 background: #fafafa;
3939 .fc-widget-header:first-of-type
,
3940 .fc-widget-content:first-of-type {
3944 .fc-widget-header:last-of-type
,
3945 .fc-widget-content:last-of-type {
3955 padding-right: 10px;
3962 .fc-color-picker > li {
3968 .fc-color-picker > li .fa {
3969 -webkit-transition: -webkit-transform linear
0.3s;
3970 -moz-transition: -moz-transform linear
0.3s;
3971 -o-transition: -o-transform linear
0.3s;
3972 transition: transform linear
0.3s;
3974 .fc-color-picker > li .fa:hover {
3975 -webkit-transform: rotate
(30deg);
3976 -ms-transform: rotate
(30deg);
3977 -o-transform: rotate
(30deg);
3978 transform: rotate
(30deg);
3981 -webkit-transition: all linear
0.3s;
3982 -o-transition: all linear
0.3s;
3983 transition: all linear
0.3s;
3989 box-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
3990 text-shadow: 0 1px 1px rgba
(0, 0, 0, 0.1);
3994 .external-event:hover {
3995 box-shadow: inset
0 0 90px rgba
(0, 0, 0, 0.2);
4001 .select2-container--default
.select2-container--focus
,
4002 .select2-selection
.select2-container--focus
,
4003 .select2-container--default:focus
,
4004 .select2-selection:focus
,
4005 .select2-container--default:active
,
4006 .select2-selection:active {
4009 .select2-container--default
.select2-selection--single
,
4010 .select2-selection .select2-selection--single {
4011 border: 1px solid
#d2d6de;
4016 .select2-container--default.select2-container--open {
4017 border-color: #3c8dbc;
4020 border: 1px solid
#d2d6de;
4023 .select2-container--default .select2-results__option--highlighted[aria-selected] {
4024 background-color: #3c8dbc;
4027 .select2-results__option {
4030 -webkit-user-select: none
;
4032 .select2-container .select2-selection--single .select2-selection__rendered {
4038 .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
4042 .select2-container--default .select2-selection--single .select2-selection__arrow {
4046 .select2-container--default .select2-selection--single .select2-selection__arrow b {
4049 .select2-dropdown
.select2-search__field
,
4050 .select2-search--inline .select2-search__field {
4051 border: 1px solid
#d2d6de;
4053 .select2-dropdown
.select2-search__field:focus
,
4054 .select2-search--inline .select2-search__field:focus {
4056 border: 1px solid
#3c8dbc;
4058 .select2-container--default .select2-results__option[aria-disabled=true] {
4061 .select2-container--default .select2-results__option[aria-selected=true] {
4062 background-color: #ddd;
4064 .select2-container--default
.select2-results__option
[aria-selected
=true
],
4065 .select2-container--default .select2-results__option[aria-selected=true]:hover {
4068 .select2-container--default .select2-selection--multiple {
4069 border: 1px solid
#d2d6de;
4072 .select2-container--default .select2-selection--multiple:focus {
4073 border-color: #3c8dbc;
4075 .select2-container--default.select2-container--focus .select2-selection--multiple {
4076 border-color: #d2d6de;
4078 .select2-container--default .select2-selection--multiple .select2-selection__choice {
4079 background-color: #3c8dbc;
4080 border-color: #367fa9;
4084 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
4086 color: rgba
(255, 255, 255, 0.7);
4088 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
4091 .select2-container .select2-selection--single .select2-selection__rendered {
4092 padding-right: 10px;
4095 * General: Miscellaneous
4096 * ----------------------
4105 margin-bottom: 20px;
4107 .margin-bottom-none {
4116 .description-block {
4121 .description-block.margin-bottom {
4122 margin-bottom: 25px;
4124 .description-block > .description-header {
4130 .description-block > .description-text {
4131 text-transform: uppercase
;
4152 .bg-light-blue-active
,
4163 .callout
.callout-danger
,
4164 .callout
.callout-warning
,
4165 .callout
.callout-info
,
4166 .callout
.callout-success
,
4177 .modal-primary
.modal-body
,
4178 .modal-primary
.modal-header
,
4179 .modal-primary
.modal-footer
,
4180 .modal-warning
.modal-body
,
4181 .modal-warning
.modal-header
,
4182 .modal-warning
.modal-footer
,
4183 .modal-info
.modal-body
,
4184 .modal-info
.modal-header
,
4185 .modal-info
.modal-footer
,
4186 .modal-success
.modal-body
,
4187 .modal-success
.modal-header
,
4188 .modal-success
.modal-footer
,
4189 .modal-danger
.modal-body
,
4190 .modal-danger
.modal-header
,
4191 .modal-danger .modal-footer {
4192 color: #fff !important
;
4196 background-color: #d2d6de !important
;
4199 background-color: #f7f7f7;
4202 background-color: #111111 !important
;
4205 .callout
.callout-danger
,
4209 .modal-danger .modal-body {
4210 background-color: #dd4b39 !important
;
4213 .callout
.callout-warning
,
4216 .modal-warning .modal-body {
4217 background-color: #f39c12 !important
;
4220 .callout
.callout-info
,
4223 .modal-info .modal-body {
4224 background-color: #00c0ef !important
;
4227 background-color: #0073b7 !important
;
4231 .modal-primary .modal-body {
4232 background-color: #3c8dbc !important
;
4235 .callout
.callout-success
,
4238 .modal-success .modal-body {
4239 background-color: #00a65a !important
;
4242 background-color: #001f3f !important
;
4245 background-color: #39cccc !important
;
4248 background-color: #3d9970 !important
;
4251 background-color: #01ff70 !important
;
4254 background-color: #ff851b !important
;
4257 background-color: #f012be !important
;
4260 background-color: #605ca8 !important
;
4263 background-color: #d81b60 !important
;
4267 background-color: #b5bbc8 !important
;
4270 background-color: #000000 !important
;
4273 .modal-danger
.modal-header
,
4274 .modal-danger .modal-footer {
4275 background-color: #d33724 !important
;
4278 .modal-warning
.modal-header
,
4279 .modal-warning .modal-footer {
4280 background-color: #db8b0b !important
;
4283 .modal-info
.modal-header
,
4284 .modal-info .modal-footer {
4285 background-color: #00a7d0 !important
;
4288 background-color: #005384 !important
;
4290 .bg-light-blue-active
,
4291 .modal-primary
.modal-header
,
4292 .modal-primary .modal-footer {
4293 background-color: #357ca5 !important
;
4296 .modal-success
.modal-header
,
4297 .modal-success .modal-footer {
4298 background-color: #008d4c !important
;
4301 background-color: #001a35 !important
;
4304 background-color: #30bbbb !important
;
4307 background-color: #368763 !important
;
4310 background-color: #00e765 !important
;
4313 background-color: #ff7701 !important
;
4315 .bg-fuchsia-active {
4316 background-color: #db0ead !important
;
4319 background-color: #555299 !important
;
4322 background-color: #ca195a !important
;
4324 [class^
="bg-"].disabled
{
4326 filter: alpha
(opacity
=65);
4329 color: #dd4b39 !important
;
4332 color: #f39c12 !important
;
4335 color: #00c0ef !important
;
4338 color: #0073b7 !important
;
4341 color: #111111 !important
;
4344 color: #3c8dbc !important
;
4347 color: #00a65a !important
;
4350 color: #d2d6de !important
;
4353 color: #001f3f !important
;
4356 color: #39cccc !important
;
4359 color: #3d9970 !important
;
4362 color: #01ff70 !important
;
4365 color: #ff851b !important
;
4368 color: #f012be !important
;
4371 color: #605ca8 !important
;
4374 color: #d81b60 !important
;
4391 display: none
!important
;
4394 border: 0 !important
;
4397 padding: 0 !important
;
4400 margin: 0 !important
;
4403 box-shadow: none
!important
;
4409 .mailbox-attachments {
4414 .list-group-unbordered > .list-group-item {
4422 border-radius: 0 !important
;
4425 .text-bold
.table td
,
4426 .text-bold.table th {
4433 padding: 5px!important
;
4434 width: auto
!important
;
4435 height: auto
!important
;
4438 background: #39cccc !important
;
4439 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #39cccc), color-stop
(1, #7adddd)) !important
;
4440 background: -ms-linear-gradient
(bottom
, #39cccc, #7adddd) !important
;
4441 background: -moz-linear-gradient
(center bottom
, #39cccc 0%, #7adddd 100%) !important
;
4442 background: -o-linear-gradient
(#7adddd, #39cccc) !important
;
4443 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#7adddd', endColorstr
='#39cccc', GradientType
=0) !important
;
4446 .bg-light-blue-gradient {
4447 background: #3c8dbc !important
;
4448 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #3c8dbc), color-stop
(1, #67a8ce)) !important
;
4449 background: -ms-linear-gradient
(bottom
, #3c8dbc, #67a8ce) !important
;
4450 background: -moz-linear-gradient
(center bottom
, #3c8dbc 0%, #67a8ce 100%) !important
;
4451 background: -o-linear-gradient
(#67a8ce, #3c8dbc) !important
;
4452 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#67a8ce', endColorstr
='#3c8dbc', GradientType
=0) !important
;
4456 background: #0073b7 !important
;
4457 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #0073b7), color-stop
(1, #0089db)) !important
;
4458 background: -ms-linear-gradient
(bottom
, #0073b7, #0089db) !important
;
4459 background: -moz-linear-gradient
(center bottom
, #0073b7 0%, #0089db 100%) !important
;
4460 background: -o-linear-gradient
(#0089db, #0073b7) !important
;
4461 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#0089db', endColorstr
='#0073b7', GradientType
=0) !important
;
4465 background: #00c0ef !important
;
4466 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #00c0ef), color-stop
(1, #14d1ff)) !important
;
4467 background: -ms-linear-gradient
(bottom
, #00c0ef, #14d1ff) !important
;
4468 background: -moz-linear-gradient
(center bottom
, #00c0ef 0%, #14d1ff 100%) !important
;
4469 background: -o-linear-gradient
(#14d1ff, #00c0ef) !important
;
4470 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#14d1ff', endColorstr
='#00c0ef', GradientType
=0) !important
;
4473 .bg-yellow-gradient {
4474 background: #f39c12 !important
;
4475 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #f39c12), color-stop
(1, #f7bc60)) !important
;
4476 background: -ms-linear-gradient
(bottom
, #f39c12, #f7bc60) !important
;
4477 background: -moz-linear-gradient
(center bottom
, #f39c12 0%, #f7bc60 100%) !important
;
4478 background: -o-linear-gradient
(#f7bc60, #f39c12) !important
;
4479 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#f7bc60', endColorstr
='#f39c12', GradientType
=0) !important
;
4482 .bg-purple-gradient {
4483 background: #605ca8 !important
;
4484 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #605ca8), color-stop
(1, #9491c4)) !important
;
4485 background: -ms-linear-gradient
(bottom
, #605ca8, #9491c4) !important
;
4486 background: -moz-linear-gradient
(center bottom
, #605ca8 0%, #9491c4 100%) !important
;
4487 background: -o-linear-gradient
(#9491c4, #605ca8) !important
;
4488 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#9491c4', endColorstr
='#605ca8', GradientType
=0) !important
;
4491 .bg-green-gradient {
4492 background: #00a65a !important
;
4493 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #00a65a), color-stop
(1, #00ca6d)) !important
;
4494 background: -ms-linear-gradient
(bottom
, #00a65a, #00ca6d) !important
;
4495 background: -moz-linear-gradient
(center bottom
, #00a65a 0%, #00ca6d 100%) !important
;
4496 background: -o-linear-gradient
(#00ca6d, #00a65a) !important
;
4497 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#00ca6d', endColorstr
='#00a65a', GradientType
=0) !important
;
4501 background: #dd4b39 !important
;
4502 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #dd4b39), color-stop
(1, #e47365)) !important
;
4503 background: -ms-linear-gradient
(bottom
, #dd4b39, #e47365) !important
;
4504 background: -moz-linear-gradient
(center bottom
, #dd4b39 0%, #e47365 100%) !important
;
4505 background: -o-linear-gradient
(#e47365, #dd4b39) !important
;
4506 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#e47365', endColorstr
='#dd4b39', GradientType
=0) !important
;
4509 .bg-black-gradient {
4510 background: #111111 !important
;
4511 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #111111), color-stop
(1, #2b2b2b)) !important
;
4512 background: -ms-linear-gradient
(bottom
, #111111, #2b2b2b) !important
;
4513 background: -moz-linear-gradient
(center bottom
, #111111 0%, #2b2b2b 100%) !important
;
4514 background: -o-linear-gradient
(#2b2b2b, #111111) !important
;
4515 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#2b2b2b', endColorstr
='#111111', GradientType
=0) !important
;
4518 .bg-maroon-gradient {
4519 background: #d81b60 !important
;
4520 background: -webkit-gradient
(linear
, left bottom
, left top
, color-stop
(0, #d81b60), color-stop
(1, #e73f7c)) !important
;
4521 background: -ms-linear-gradient
(bottom
, #d81b60, #e73f7c) !important
;
4522 background: -moz-linear-gradient
(center bottom
, #d81b60 0%, #e73f7c 100%) !important
;
4523 background: -o-linear-gradient
(#e73f7c, #d81b60) !important
;
4524 filter: progid:DXImageTransform
.Microsoft
.gradient
(startColorstr
='#e73f7c', endColorstr
='#d81b60', GradientType
=0) !important
;
4527 .description-block .description-icon {
4534 position: static
!important
;
4544 background: #f4f4f4;
4545 margin: 15px 0 9px 0;
4551 .list-link > a:hover {
4570 .user-block
.username
,
4571 .user-block
.description
,
4572 .user-block .comment {
4576 .user-block .username {
4580 .user-block .description {
4584 .user-block
.user-block-sm
.username
,
4585 .user-block
.user-block-sm
.description
,
4586 .user-block.user-block-sm .comment {
4589 .user-block.user-block-sm .username {
4595 .box-comments
.box-comment img
,
4596 .user-block.user-block-sm img {
4600 .box-comments
.box-comment img
,
4601 .user-block.user-block-sm img {
4602 width: 30px!important
;
4603 height: 30px!important
;
4605 .img-sm + .img-push {
4612 .img-md + .img-push {
4619 .img-lg + .img-push {
4623 border: 3px solid
#d2d6de;
4627 border: 2px solid
#d2d6de;
4631 border: 1px solid
#f4f4f4;
4633 margin-bottom: 10px;
4634 background: #f7f7f7;
4636 .attachment-block .attachment-img {
4642 .attachment-block .attachment-pushed {
4645 .attachment-block .attachment-heading {
4648 .attachment-block .attachment-text {
4651 .connectedSortable {
4654 .ui-helper-hidden-accessible {
4656 clip: rect
(0 0 0 0);
4665 background: #f4f4f4;
4666 border: 1px dashed
#ddd;
4667 margin-bottom: 10px;
4669 .full-opacity-hover {
4671 filter: alpha
(opacity
=65);
4673 .full-opacity-hover:hover {
4675 filter: alpha
(opacity
=100);
4684 width: 100%!important
;
4696 display: none
!important
;
4701 margin-left: 0!important
;
4702 min-height: 0!important
;
4703 -webkit-transform: translate
(0, 0) !important
;
4704 -ms-transform: translate
(0, 0) !important
;
4705 -o-transform: translate
(0, 0) !important
;
4706 transform: translate
(0, 0) !important
;
4708 .fixed
.content-wrapper
,
4709 .fixed .right-side {
4710 padding-top: 0!important
;
4725 .table-responsive
> .table tr th
,
4726 .table-responsive > .table tr td {
4727 white-space: normal
!important
;