html {
margin: 0;
padding: 0;
height: 100%;
overflow-x: hidden !important; /*- disabled for widget chrome bug */
background:url('@{base-url}/@{html-background-image}') @html-background-color;
}
body {
margin: 0;
padding: 0;
height: 100%;
overflow:hidden; /*- disabled for widget chrome bug */
background:url('@{base-url}/@{body-background-image}') @body-background-color;
direction:ltr;
}
a:hover, a:active, a:focus, button, button:active, button:focus, object, embed, input::-moz-focus-inner {
outline: 0;
}
h1,h2,h3,h4 {
margin:0;
font-family:"Open Sans", Arial, Helvetica, Sans-Serif;
font-weight:300;
}
.page-title {
margin: 12px 0 28px;
span {
font-size: @font-size-base+3;
color: @gray-dark;
display: inline-block;
vertical-align: 1px;
}
}
label {
font-weight:normal;
}
*:focus {
outline: 0 !important;
}
/*
* IE FIX for tap delay
*/
a, input, button {
-ms-touch-action: none !important;
}
textarea:focus,
select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
outline: 0;
outline: thin dotted \9;
/* IE6-9 */
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.input-sm,
.input-lg,
.input-xs,
.form-control {
border-radius:0px !important;
-webkit-border-radius: 0px !important;
-moz-border-radius: 0px !important;
}
.input-xs {
height: 24px;
padding: 2px 10px;
font-size: 11px;
line-height: 1.5;
}
.btn-xs {
padding: 1px 5px;
}
.btn-sm {
padding: 6px 10px 5px;
}
.btn-lg {
padding: 10px 16px;
}
.no-space {
margin:0;
}
.no-space > [class*="col-"] {
margin: 0 !important;
padding-right: 0;
padding-left: 0;
}
#content {
padding:10px 14px;
position:relative;
left:0px;
}
body.container {
position: relative;
padding: 0;
border-left:1px solid @gray-mid-light;
border-right:1px solid @gray-mid-light;
box-shadow: 0 2px 70px rgba(red(@black), green(@black), blue(@black), 0.45);
}
.no-content-padding {
margin: -10px -14px 0 -14px; /*used with content >:first-child */
}
.no-padding {
padding:0px !important;
& > pre {
margin:30px;
}
}
.no-padding &>table, .no-padding .dataTables_wrapper table {
border:none !important;
margin-bottom:0px !important;
border-bottom-width:0px !important;
}
.no-padding-bottom {
padding-bottom:0px !important;
}
.padding-5 {
padding:5px !important;
}
.padding-7 {
padding:7px !important;
}
.padding-10 {
padding:10px !important;
}
.padding-top-10 {
padding-top:10px !important;
}
.padding-bottom-10 {
padding-bottom:10px !important;
}
.no-padding &>table tr td:last-child,.no-padding &>table tr th:last-child,.no-padding .dataTables_wrapper table tr td:last-child,.no-padding .dataTables_wrapper table tr th:last-child {
border-right:none !important;
}
.no-padding &>table tr td:first-child,.no-padding &>table tr th:first-child,.no-padding .dataTables_wrapper table tr td:first-child,.no-padding .dataTables_wrapper table tr th:first-child {
border-left:none !important;
}
.no-padding {
.dataTables_wrapper {
table {
tbody {
tr:last-child {
td {
border-bottom:0;
}
}
}
}
}
}
/*
* Headers
*/
h1 {
letter-spacing:-1px;
font-size:@font-size-h1;
margin:10px 0;
}h1 small {
font-size:@font-size-h4;
font-weight:300;
letter-spacing:-1px;
}.lead {
font-size:@font-size-h4 + 1px;
}
h2 {
letter-spacing:-1px;
font-size: @font-size-h2;
margin:20px 0;
line-height:normal;
}
h3 {
display: block;
font-size: @font-size-h3;
font-weight: 400;
margin: 20px 0;
line-height:normal;
}
h4 {
line-height:normal;
}
h5 {
font-size: @font-size-h5;
font-weight: 300;
margin: 10px 0;
line-height:normal;
}
h6 {
font-size: @font-size-h6;
margin: 10px 0;
font-weight:bold;
line-height:normal;
}
.row-seperator-header {
margin:15px 14px 20px;
border-bottom:none;
display:block;
color: darken( @gray-light, 20.9%);
font-size:20px;
font-weight:400;
}
/*
* Forced text alignments
*/
.text-align-center, .text-center {
text-align:center !important
}
.text-align-left, .text-left {
text-align:left !important
}
.text-align-right, .text-right {
text-align:right !important
}
/*
* Font Weights
*/
.semi-bold {
font-weight:400 !important;
}
.ultra-light {
font-weight:300 !important;
}
/*
* Font Sizes
*/
.font-xs {
font-size:85% !important;
}
.font-sm {
font-size:95% !important;
}
.font-md {
font-size:130% !important;
}
.font-lg {
font-size:160% !important;
}
.font-xl {
font-size:200% !important;
}
.font-400 {
font-size:400% !important;
}
/*
* Center Canvas
*/
.center-canvas, .center-child-canvas > canvas {
display:block !important;
margin:0 auto !important;
}
/*
* Margins
*/
.no-margin {
margin:0px !important;
}
.margin-top-5 {
margin-top:5px !important;
}
.margin-top-10 {
margin-top:10px !important;
}
.margin-bottom-5 {
margin-bottom:5px !important;
}
.margin-bottom-10 {
margin-bottom:10px !important;
}
.margin-right-5 {
margin-right:5px !important;
}
/*
* No border
*/
.no-border, .well[class*=" bg-"].no-border {
border-width:0px !important;
}
.no-border-transparent {
border-color:transparent !important;
}
.no-border-radius {
border-radius:0px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
}
/*
* Inlines
*/
.display-inline {
display:inline-block !important;
}
.display-normal {
display:inline !important;
}
/*
* Images
*/
.hover-transparent {
opacity:.5;
}.hover-transparent:hover {
opacity:1;
}
/*
* JUST A BORDER
*/
.bordered {
border:1px solid rgba(red(@black), green(@black), blue(@black),.2);
}.bordered:hover {
border:1px solid rgba(red(@black), green(@black), blue(@black),.4);
}
/*
* CURSORS
*/
.cursor-pointer {
cursor:pointer;
}
/*
* ***************************************************
* MAIN LAYOUT START
* ***************************************************
*/
aside {
display: block;
overflow: hidden;
min-height:100%;
background: @asideColor-end;
background: url(@asideDataURL);
background: -moz-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(93%, @asideColor-end), color-stop(100%, @asideColor-start));
background: -webkit-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
background: -o-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
background: -ms-linear-gradient(left, @asideColor-end 93%, @asideColor-start 100%);
background: linear-gradient(to right, @asideColor-end 93%, @asideColor-start 100%);
min-height: 100%;
}
/*
* HEADER GROUP
*/
#header {
display: block;
height: @smart-navbar-height;
position: relative;
margin: 0;
padding: 0 13px 0 0;
background-color: @smart-navbar-color-start;
background-image: -moz-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@smart-navbar-color-start), to(@smart-navbar-color-end));
background-image: -webkit-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
background-image: -o-linear-gradient(top, @smart-navbar-color-start, @smart-navbar-color-end);
background-image: linear-gradient(to bottom, @smart-navbar-color-start, @smart-navbar-color-end);
background-repeat: repeat-x;
}
#header > div {
display: inline-block;
vertical-align: middle;
height: @smart-navbar-height;
float:left;
}
#header > div.open {
font-weight:bold;
}
.fixed-header #header {
position:fixed;
width:100%;
z-index: @left-panel-zindex+1;
top:0px;
border-bottom:2px solid @gray-light;
border-bottom: 1px solid rgba(0,0,0,.3);
box-shadow: -11px 12px 23px rgba(0, 0, 0, 0.1);
}
/* as per version 1.3 */
.fixed-header.fixed-ribbon #header {
border-bottom:none;
box-shadow:none;
}
.container.fixed-header #header {
max-width: 1164px;
}
.fixed-header #header .ajax-dropdown {
z-index: @left-panel-zindex+2;
}
.fixed-header #shortcut {
position:fixed;
}
.fixed-header #main {
margin-top:@smart-navbar-height;
}
#logo-group > span {
display: inline-block;
height: @smart-navbar-height - 10;
float: left;
}
#logo-group span#activity {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
cursor: default !important;
display: inline-block;
font-weight: bold;
height: 24px;
width: 24px;
padding: 2px;
text-align: center;
text-decoration: none !important;
-moz-user-select: none;
-webkit-user-select: none;
background-color: lighten(@gray-lightest, 1.9%);
background-image: -webkit-gradient(linear,left top,left bottom,from(lighten(@gray-lightest, 1.9%)),to(darken(@gray-lightest, 1%)));
background-image: -webkit-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -moz-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -ms-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -o-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
border: 1px solid @gray-mid-light;
color: @dropdownbtn-icon-color;
font-size: 19px;
margin: 10px 0 0 0;
position:relative;
}
#logo-group span#activity:hover {
border: 1px solid @gray-mid-light;
transition: all 0.0s;
cursor: pointer !important;
-webkit-box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), 0.08);
box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), 0.08);
}
#logo {
display: inline-block;
width: @asideWidth - 45px;
margin-top: 13px;
margin-left: 9px;
}
#logo img {
width:110px;
height:auto;
padding-left:3px;
}
#logo-group > span .badge {
position: absolute;
top: -5px;
right: -5px;
cursor: pointer;
background:@blueSky;
display: inline-block;
font-size: 10px;
box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black), 0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.07);
color: @white;
font-weight: bold;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
padding: 2px 4px 3px 4px;
text-align: center;
line-height: normal;
}
#activity.active .badge {
background: darken(@blueSky, 10%) !important;
}
#project-context {
display: inline-block;
padding: 7px 13px 0;
position:relative;
}
#project-context > span {
display: block;
}
#project-context > :first-child {
display: block;
color: @gray-mid-light;
font-size: 10px;
font-weight: bold;
text-transform: uppercase;
text-shadow: 0 0 1px white;
padding-left:0px;
text-align:left;
}
#project-selector {
max-width: 97%;
white-space: nowrap;
background: none;
border: none;
padding: 0;
text-align: left;
color: @gray;
font-size: 14px;
cursor: pointer;
}
#project-selector:hover {
color: @gray-dark;
}
.header-search {
position:relative;
}.header-search.pull-right {
margin-left:6px;
}
.header-search > input[type="text"] {
display: block;
box-sizing: border-box;
-moz-box-sizing: border-box;
min-width:200px;
width: 100%;
height: 30px;
padding: 0 10px;
outline: none;
border-width: 1px;
border-style: solid;
border-radius: 0;
border-color:@gray-mid-light;
background: @white;
color: #404040;
appearance: normal;
-moz-appearance: none;
-webkit-appearance: none;
margin-top:10px;
line-height:normal;
}
.header-search > button {
background: none;
border: none;
color: #6D6A69;
font-size: 17px;
height: 30px;
line-height: 30px;
margin: 0;
padding: 0;
position: absolute;
right: 0px;
top: 10px;
width: 30px;
z-index: 2;
}
#search-mobile {
display:none;
}
#cancel-search-js {
position: absolute;
display: none;
background: @brand-danger;
z-index: 3;
color: @white;
padding: 0;
right: 10px;
top: 10px;
text-align: center;
height: 29px;
line-height: 29px;
width: 30px;
font-size: 17px;
text-decoration:none !important;
}
#header > :first-child, aside {
width: @asideWidth;
}
/*
* LEFT PANEL
*/
#left-panel {
position: absolute;
top: @smart-navbar-height;
left: 0px;
z-index: @left-panel-zindex;
}
#main {
display: block;
margin-left: @asideWidth;
padding: 0;
min-height:500px;
}
/*
* RIBBON
*/
#ribbon {
min-height: @ribbon-height;
background: @ribbonBGColor;
padding: 0 13px;
position:relative;
}
#ribbon .breadcrumb {
display: inline-block;
margin: 0;
padding: 11px 34px 11px 0 !important;
background:none;
vertical-align:top;
}
#ribbon .breadcrumb a, #ribbon .breadcrumb {
color: #BBB !important;
text-decoration:none !Important;
}
#ribbon .breadcrumb > .active, #ribbon .breadcrumb li:last-child {
color: #E4E4E4;
}
.fixed-ribbon #ribbon {
position: fixed;
right: 0;
left: @asideWidth;
top: @smart-navbar-height;
z-index: @fixed-ribbon-zindex;
}
.container.fixed-ribbon #ribbon {
width: 944px;
left: 590px;
}
.fixed-ribbon #content {
padding-top: @smart-navbar-height + 1;
}
.minified.fixed-ribbon #ribbon {
left: 45px;
}
.hidden-menu.fixed-ribbon #ribbon {
left:10px;
}
/*
* NAV
* Menu CSS is learnt from: http://experiments.wemakesites.net/css3-treeview.html
*/
.fixed-navigation #left-panel {
position:fixed;
z-index: @fixed-navigation-zindex;
}
/* All levels */
nav ul li a:active {
background:@asideNavActiveBGColor !important;
}
/* All levels */
nav ul {
width: 100%;
padding: 40px 28px 25px 0;
padding: 0;
margin: 0;
font-size: 13px;
line-height: 0.5em;
list-style: none;
position: relative;
}
/* All levels */
nav ul .active > a {
color: #fff !important;
position: relative;
}
/* All levels */
nav ul li.active > a:before {
content: "\f0d9";
font-family: FontAwesome;
display: block;
height: 27px;
line-height: normal;
width: 27px;
position: absolute;
right: -21px;
font-size: 20px;
color:@gray-lighter;
}
nav ul li.active.open > a:before {
content: "";
}
nav > ul > li:last-child.open {
border-bottom:1px solid rgba(255,255,255,0.15);
}
/* All levels */
nav ul li {
overflow: hidden;
}
/* All levels */
nav ul li a {
line-height: normal;
font-size: @asideNavFontSize;
padding: 10px 10px 10px 11px;
color: @asideLinkColor;
display: block;
font-weight: normal;
text-decoration: none !important;
position:relative;
}
/* Second level */
nav > ul > li > ul > li > a {
padding-top: 7px;
padding-bottom: 7px;
}
/* Third Level */
nav > ul > li > ul > li > ul > li > a {
padding-top: 7px;
padding-bottom: 7px;
}
/* All levels */
nav ul li a:focus {
color: @asideLinkColorFocus;
}
/* All levels */
nav ul li a:hover {
color: @asideLinkColorHover;
text-decoration: none;
}
/* All levels */
nav ul b {
float: right;
font-size: @asideNavFontSize;
margin-top: -1px;
}
/* All levels */
nav ul span.menu-item-parent {
display: inline-block;
margin: 0;
padding: 0;
}
/* First level: A, Second level: LI Open */
nav ul li.open > a, nav ul li.open > a b {
color: #fff !important;
}
/* First level: Icon */
nav > ul > li > a b {
position: absolute !important;
right: @asideNavExpanIconPush-x;
top: @asideNavExpanIconPush-y;
}
nav > ul > li > a > i {
/*font-size: 121%; fa-lg overrides this so.. */
margin-right: 5px;
width: 15px;
display: inline-block;
text-align: center;
position:relative;
}
/* First level icon */
nav > ul > li > a > i > em {
font-size: 9px;
display: block;
padding: 2px;
position: absolute;
top: -8px;
right: -6px;
text-decoration: none;
font-style: normal;
background: #ED1C24;
color: @white;
min-width: 13px;
border-radius: 50%;
max-height:13px;
line-height: 8px;
font-weight: bold;
vertical-align: baseline;
white-space: nowrap;
text-align: center;
border: 1px solid rgba(red(@white), green(@white), blue(@white), 0.1);
}
/* Second level switched to relative */
nav ul li li {
border-bottom: none;
position: relative;
}
/* Second level: UL */
nav > ul > li > ul::before {
content: "";
display: block;
position: absolute;
z-index: 1;
left: 23px;
top: 0;
bottom: 0;
border-left: 1px solid #7A7A7A;
}
/* Second level: UL LI */
nav > ul ul li::before {
content: "";
display: block;
position: absolute;
width: 8px;
left: 23px;
top: 16px;
border-top: 1px solid #7A7A7A;
z-index: 1;
}
/* Third level: UL LI */
nav > ul ul ul li::before {
content: "";
display: block;
position: absolute;
width: 18px;
left: 10px;
top: 17px;
border-top: 1px solid transparent;
}
/* Second level and onwards > */
nav > ul ul li a i {
font-size: @asideNavFontSize !important;
width: 18px !important;
text-align: center !important;
}
/* Second and Third level line color */
nav > ul > li:hover > ul::before, nav > ul > li:hover > ul > li::before{
border-color: #ACACAC !important;
}
/* Second Level: UL */
nav ul ul {
margin: 0;
padding: 0;
display: none;
background: rgba(69, 69, 69,.6);
}
nav ul ul {
padding: 7px 0;
}
/* Third Level: UL */
nav ul ul ul {
background: transparent;
padding: 0;
}
/* Third Level: LI */
nav ul ul li {
margin: 0;
padding: 0;
}
/* Second Level: A */
nav ul ul li > a {
padding-left: 42px;
font-size: @asideNavFontSizeSecondLevel;
font-weight: normal;
outline: 0;
}
/* Second Level: A:hover */
nav ul ul li > a:hover {
background-color: rgba(69, 69, 69,.8);
color: @white;
}
/* Third Level: A */
nav ul ul ul li a {
color: @gray-mid-light;
padding: 8px 10px 8px 70px;
font-size: @asideNavFontSizeThirdLevel;
}
/* Third Level: A:hover */
nav ul ul ul li a:hover {
background-color: #4C4F53;
color: @white;
}
/* Fourth Level: A */
nav ul ul ul ul li a {
padding-left: 90px;
}
/* Fifth Level: A */
nav ul ul ul ul ul li a {
padding-left: 110px;
}
/* Sixth Level: A */
nav ul ul ul ul ul ul li a {
padding-left: 130px;
}
/* Second level: B */
nav ul ul b {
color: #B3B3B3;
}
/* Second level: LI:hover B */
nav ul ul > li:hover b {
color: #D5D9E2;
}
/*
* HEADER NAV DROPDOWN LIST
*/
.header-dropdown-list {
list-style:none;
float:right;
position:relative;
margin:0;
& > li {
display: inline-block;
padding-right: 5px;
& > .dropdown-toggle {
margin-top:16px;
display:block;
}
}
}
/*
* ***************************************************
* MAIN LAYOUT END
* ***************************************************
*/
/*
* ACCORDIONS
*/
.smart-accordion-default.panel-group {
margin-bottom:0px;
}
.smart-accordion-default.panel-group .panel+.panel {
margin-top:-1px;
}
.smart-accordion-default.panel-group .panel-heading {
padding:0px;
}
.smart-accordion-default.panel-group .panel-title a {
display: block;
padding: 10px 15px;
text-decoration: none !important;
}
.smart-accordion-default .panel-heading, .panel-group .panel {
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
}
.smart-accordion-default .panel-default>.panel-heading {
background-color: lighten( @gray-lightest, 3.5%);
}
.smart-accordion-default .panel-default {
border-color:lighten( @gray-light, 16.5%);
}
.smart-accordion-default .panel-title > a >:first-child{
display:none;
}
.smart-accordion-default .panel-title > a.collapsed > .fa{
display:none;
}
.smart-accordion-default .panel-title > a.collapsed >:first-child{
display:inline-block;
}
.no-padding .smart-accordion-default > div {
border-left:none !important;
border-right:none !important;
}
.no-padding .smart-accordion-default > div:first-child {
border-top:none !important;
}
.no-padding .smart-accordion-default > div:last-child {
border-bottom:none !important;
}
/*
* ON OFF SWITCHES
*/
/* http://proto.io/freebies/onoff/ */
.onoffswitch-container {
margin-top:4px;
margin-left:7px;
display:inline-block;
}
.onoffswitch {
position: relative;
width: 50px;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select: none;
margin-top:3px;
margin-bottom:3px;
margin-left:5px;
display:inline-block;
vertical-align:middle;
}
.onoffswitch-checkbox {
display: none;
}
.onoffswitch-label {
display: block;
overflow: hidden;
cursor: pointer;
border: 1px solid lighten(@gray, 5%);
border-radius: 50px;
border-color: lighten(@gray-light, 8%) lighten(@gray-light, 10%) lighten(@gray-light, 2%);
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.onoffswitch-inner {
width: 200%;
margin-left: -100%;
display:block;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
float: left;
width: 50%;
height: 15px;
padding: 0;
line-height: 15px;
font-size: 10px;
color: @white;
font-family: Trebuchet, Arial, sans-serif;
font-weight: bold;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.onoffswitch-inner:before {
content: attr(data-swchon-text);
text-shadow: 0 -1px 0 @gray-dark;
padding-left: 7px;
background-color: @onOffSwitchBG;
color: @white;
box-shadow: inset 0 2px 6px rgba(red(@black), green(@black), blue(@black), 0.5), 0 1px 2px rgba(red(@black), green(@black), blue(@black), 0.05);
text-align:left;
}
.onoffswitch-inner:after {
content: attr(data-swchoff-text);
padding-right: 7px;
text-shadow: 0 -1px 0 @white;
background-color: @white;
color: @gray;
text-align: right;
box-shadow:inset 0 2px 4px rgba(red(@black), green(@black), blue(@black),.15), 0 1px 2px rgba(red(@black), green(@black), blue(@black),.05);
}
.onoffswitch-switch {
width: 19px;
height:19px;
margin: -2px;
background: white;
border: 1px solid lighten(@gray-light, .5%);
border-radius: 50px;
position: absolute;
top: 0;
bottom: 0;
right: 32px;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
background-color: @gray-lightest;
background-image: -moz-linear-gradient(top, white, @gray-lighter);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(white), to(@gray-lighter));
background-image: -webkit-linear-gradient(top, white, @gray-lighter);
background-image: -o-linear-gradient(top, white, @gray-lighter);
background-image: linear-gradient(to bottom, white, @gray-lighter);
background-repeat: repeat-x;
-webkit-box-shadow: 1px 1px 4px 0px rgba(red(@black), green(@black), blue(@black), .3);
box-shadow: 1px 1px 4px 0px rgba(red(@black), green(@black), blue(@black), .3);
}
.onoffswitch-checkbox + .onoffswitch-label .onoffswitch-switch:before, .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch:before {
content: "\f00d";
color:@brand-danger;
display:block;
text-align:center;
line-height:19px;
font-size: 10px;
text-shadow: 0 -1px 0 @white;
font-weight:bold;
font-family:FontAwesome;
}
/* checked */
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch:before {
content: "\f00c";
color: @blue;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
margin-left: 0;
display:block;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
right: 0px;
}
.onoffswitch-switch:hover {
background-color: @gray-lighter;
}
.onoffswitch-switch:active {
background-color: @gray-lighter;
box-shadow:inset 0 2px 4px rgba(red(@black), green(@black), blue(@black),.15), 0 1px 2px rgba(red(@black), green(@black), blue(@black),.05);
}
/*
* Disabled state
*/
.onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-inner:after, .onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-inner:before {
text-shadow: 0 1px 0 @white;
background: @gray-mid-light;
color: @gray-dark;
}
.onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-switch, .onoffswitch-checkbox:disabled + .onoffswitch-label .onoffswitch-switch {
background-color: @gray-lightest;
background-image: -moz-linear-gradient(top, @gray-mid-light, @gray-lightest);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@gray-mid-light), to(@gray-lightest));
background-image: -webkit-linear-gradient(top, @gray-mid-light, @gray-lightest);
background-image: -o-linear-gradient(top, @gray-mid-light, @gray-lightest);
background-image: linear-gradient(to bottom, @gray-mid-light, @gray-lightest);
box-shadow: none !important;
}
.onoffswitch-checkbox:disabled + .onoffswitch-label,
.onoffswitch-checkbox:checked:disabled + .onoffswitch-label .onoffswitch-label {
border-color: lighten(@gray-light, 7%) @gray-light darken(@gray-light, 7%) !important;
}
.onoffswitch-checkbox:checked + .onoffswitch-label{
border-color: @onOffSwitchBG darken(@onOffSwitchBG, 7%) darken(@onOffSwitchBG, 12%);
}
.onoffswitch + span, .onoffswitch-title {
display: inline-block;
vertical-align: middle;
margin-top: -5px;
}
/*
* FORMS
*/
.form-control {
box-shadow:none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
}
.form hr {
margin-left:-13px;
margin-right:-13px;
border-color:rgba(red(@black), green(@black), blue(@black), 0.1);
margin-top: 20px;
margin-bottom: 20px;
}
.form fieldset {
display: block;
border: none;
background: rgba(red(@white), green(@white), blue(@white), 0.9);
position: relative;
}
fieldset {
position:relative;
}
.form-actions {
display: block;
padding: 13px 14px 15px;
border-top: 1px solid rgba(red(@black), green(@black), blue(@black), 0.1);
background: rgba(red(lighten(@gray-lightest, 2%)), green(lighten(@gray-lightest, 2%)), blue(lighten(@gray-lightest, 2%)), 0.9);
margin-top:25px;
margin-left: -13px;
margin-right: -13px;
margin-bottom: -13px;
text-align:right;
}.well .form-actions {
margin-left: -19px;
margin-right: -19px;
margin-bottom: -19px;
}.well.well-lg .form-actions {
margin-left: -24px;
margin-right: -24px;
margin-bottom: -24px;
}.well.well-sm .form-actions {
margin-left: -9px;
margin-right: -9px;
margin-bottom: -9px;
}
.popover-content .form-actions {
margin:0 -14px -9px;
border-radius:0 0 3px 3px;
padding:9px 14px
}
.no-padding .form .form-actions {
margin:0;
display: block;
padding: 13px 14px 15px;
border-top: 1px solid rgba(red(@black), green(@black), blue(@black), 0.1);
background: rgba(248, 248, 248, 0.9);
text-align:right;
margin-top:25px;
}
.form header, legend {
display: block;
padding: 8px 0;
border-bottom: 1px dashed rgba(red(@black), green(@black), blue(@black), 0.2);
background: @white;
font-size: 16px;
font-weight: 300;
color: @gray-darker;
margin: 25px 0px 20px;
} .no-padding .form header {
margin: 25px 14px 0;
}.form header:first-child {
margin-top:10px;
} legend {
font-weight:400;
margin-top:0px;
background:none;
}
.input-group-addon {
padding: 6px 10px;
border-radius: 0;
-moz-border-radius: 0;
-webkit-border-radius: 0;
}
.input-group-addon {
transition: border-color 0.3s;
-o-transition: border-color 0.3s;
-ms-transition: border-color 0.3s;
-moz-transition: border-color 0.3s;
-webkit-transition: border-color 0.3s;
transition: background-color 0.3s;
-o-transition: background-color 0.3s;
-ms-transition: background-color 0.3s;
-moz-transition: background-color 0.3s;
-webkit-transition: background-color 0.3s;
}
.input-group-addon .fa {
font-size:14px;
}
.input-group-addon .fa-lg, .input-group-addon .fa-2x {
font-size: 2em;
}
.input-group-addon .fa-3x, .input-group-addon .fa-4x, .input-group-addon .fa-5x {
font-size: 30px;
}
input[type="text"]:focus + .input-group-addon {
border-color: @blueSky;
background-color: lighten(@state-info-text, 23%);
color:@white;
}
.has-warning input[type="text"], .has-warning input[type="text"] + .input-group-addon {
border-color: @state-warning-border;
}.has-warning input[type="text"] + .input-group-addon {
background-color: darken(@state-warning-bg, 5%);
color:@state-warning-text;
}
.has-warning input[type="text"]:focus, .has-warning input[type="text"]:focus + .input-group-addon {
border-color: @state-warning-border;
}.has-warning input[type="text"]:focus + .input-group-addon {
background-color: darken(@state-warning-bg, 45%);
color:@white;
}
.has-error .input-group-addon {
border-color: @state-danger-border;
background:@state-danger-bg;
color:@state-danger-text;
}
.has-error input[type="text"], .has-error input[type="text"] + .input-group-addon {
border-color: @state-danger-border;
}.has-error input[type="text"] + .input-group-addon {
background-color: @state-danger-bg;
color:@state-danger-text;
}
.has-error input[type="text"]:focus, .has-error input[type="text"]:focus + .input-group-addon {
border-color: darken(@state-danger-bg, 35%);
}.has-error input[type="text"]:focus + .input-group-addon {
background-color: darken(@state-danger-bg, 35%);
color:@white;
}
.has-success input[type="text"]:focus + .input-group-addon {
border-color:@state-success-border;
background-color:@state-success-border;
color:@white;
}
.form fieldset .form-group:last-child, .form fieldset .form-group:last-child .note,
.form .form-group:last-child, .form .form-group:last-child .note {
margin-bottom:0;
}
.note {
margin-top: 6px;
padding: 0 1px;
font-size: 11px;
line-height: 15px;
color: @gray-light;
}
/*
* WITH ICON
*/
.input-icon-right {
position:relative;
}
.input-icon-right > i, .input-icon-left > i {
position:absolute;
right:10px;
top:30%;
font-size:16px;
color:@gray-mid-light;
}
.input-icon-left > i {
right:auto;
left:24px;
}
.input-icon-right .form-control {
padding-right:27px;
}
.input-icon-left .form-control {
padding-left:29px;
}
input[type="text"].ui-autocomplete-loading,
input[type="password"].ui-autocomplete-loading,
input[type="datetime"].ui-autocomplete-loading,
input[type="datetime-local"].ui-autocomplete-loading,
input[type="date"].ui-autocomplete-loading,
input[type="month"].ui-autocomplete-loading,
input[type="time"].ui-autocomplete-loading,
input[type="week"].ui-autocomplete-loading,
input[type="number"].ui-autocomplete-loading,
input[type="email"].ui-autocomplete-loading,
input[type="url"].ui-autocomplete-loading,
input[type="search"].ui-autocomplete-loading,
input[type="tel"].ui-autocomplete-loading,
input[type="color"].ui-autocomplete-loading {
background-image: url("@{base-url}/select2-spinner.gif") !important;
background-repeat: no-repeat;
background-position: 99% 50%;
padding-right:27px
}
.input-group-addon .checkbox, .input-group-addon .radio {
min-height: 0px;
margin-right:0px !important;
padding-top:0;
}
.input-group-addon label input[type="checkbox"].checkbox + span,
.input-group-addon label input[type="radio"].radiobox + span,
.input-group-addon label input[type="radio"].radiobox + span:before,
.input-group-addon label input[type="checkbox"].checkbox + span:before {
margin-right:0px;
}
.input-group-addon .onoffswitch , .input-group-addon .onoffswitch-label{
margin:0;
}
/*
* HR
*/
hr.simple {
margin-top:10px;
margin-bottom:10px;
border-style:dashed;
}
/*
* Timeline Seperator
*/
.timeline-seperator {
display:block;
text-align:center;
color:@gray-light;
margin:20px 0 0;
& > :first-child {
padding:4px 5px;
border:1px dashed rgba(red(@black), green(@black), blue(@black), 0.1);
background:@white;
font-size:11px;
border-radius:4px;
}
}.timeline-seperator .btn, .timeline-seperator .btn + .dropdown-menu {
margin-right:15px;
}
.timeline-seperator:after {
display:block;
content:" ";
margin:0 20px;
border-bottom:1px dashed rgba(red(@black), green(@black), blue(@black), 0.1);
margin-top:-8px;
}
/*
* Alerts
*/
.alert {
margin-bottom: 20px;
margin-top: 0px;
padding: 5px 15px 5px 34px;
color:#675100;
border-width:0px;
border-left-width:5px;
padding:10px;
border-radius:0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
.close {
top: 0px;
right: -5px;
line-height: 20px;
}
}
.alert-heading {
font-weight:600;
}
.alert-danger {
border-color: darken(@state-danger-border, 10%);
color: @white;
background: darken(@state-danger-bg, 33%);
text-shadow:none;
}
.alert-warning {
border-color:lighten(@state-warning-border,5%);
color: darken(@state-warning-text, 19%);
background: lighten(spin(@state-warning-border, 8), 22%);
}
.alert-success {
border-color: lighten(@state-success-border,25%);
color: darken(@state-success-text,10%);
background: darken(lighten(spin(@state-success-text, -20), 50%), 8%);
}
.alert-info {
border-color: @state-info-border;
color: darken(@state-info-text, 3%);
background: @state-info-bg;
}
/*
* WELLS
*/
.well {
background: darken(@white, 1.5%);
border: 1px solid darken(@gray-lighter, 7%);
box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
-webkit-box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
-moz-box-shadow: 0 1px 1px darken(@gray-lighter, 1%);
position:relative;
}
.well.well-clean {
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
border-color:transparent;
}
.well.well-glass {
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
border-color:transparent;
background-color:rgba(red(@white), green(@white), blue(@white),.25);
color:@white;
}
.well.well-light {
background: @white;
border: 1px solid darken(@gray-lighter, 5%);
}
.widget-body {
.well {
margin-bottom:0px;
}
}
.well.transparent {
border:none !important;
background:none !important;
}
.jarviswidget.well.transparent > div, .jarviswidget.well.transparent > div .widget-body {
padding:0px !important;
}
/* any wells with custom bg the border will be darkened */
.well[class^="bg-"], .well[class*=" bg-"]{
border: 1px solid @gray !important;
}
/*
* PROGRESS BARS
*/
.progress-micro {
height: @progressbar-micro !important;
line-height:@progressbar-micro !important;
}
.progress-xs {
height: @progressbar-xs !important;
line-height:@progressbar-xs !important;
}
.progress-sm {
height: @progressbar-sm !important;
line-height:@progressbar-sm !important;
}
.progress-lg {
height: @progressbar-lg !important;
line-height:@progressbar-lg !important;
}
.progress .progress-bar {
position: absolute;
overflow: hidden;
line-height: 20px;
}
.progress .progressbar-back-text {
position: absolute;
width: 100%;
height: 100%;
font-size: 12px;
line-height: 20px;
text-align: center;
}
.progress .progressbar-front-text {
display: block;
width: 100%;
font-size: 12px;
line-height: 20px;
text-align: center;
}
.progress.right .progress-bar {
right: 0;
}
.progress.right .progressbar-front-text {
position: absolute;
right: 0;
}
.progress.vertical {
width: 25px;
height: 100%;
min-height:150px;
margin-right: 20px;
display:inline-block;
margin-bottom:0px;
}
.progress.wide-bar {
width: 40px;
}
.progress.vertical.bottom {
position: relative;
}
.progress.vertical.bottom .progressbar-front-text {
position: absolute;
bottom: 0;
}
.progress.vertical .progress-bar {
width: 100%;
height: 0;
-webkit-transition: height 0.6s ease;
transition: height 0.6s ease;
}
.progress.vertical.bottom .progress-bar {
position: absolute;
bottom: 0;
}
@-webkit-keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
@-moz-keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
@-o-keyframes progress-bar-stripes {
from {
background-position: 0 0;
}
to {
background-position: 40px 0;
}
}
@keyframes progress-bar-stripes {
from {
background-position: 40px 0;
}
to {
background-position: 0 0;
}
}
.progress {
position: relative;
margin-bottom: 20px;
overflow: hidden;
height: 22px;
background: @gray-lighter;
box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
-webkit-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
-moz-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten( @gray-light, 29%) inset;
border-radius:@progressbar-radius;
-moz-border-radius:@progressbar-radius;
-webkit-border-radius:@progressbar-radius;
}
.progress-bar {
float: left;
width: 0;
height: 100%;
font-size: 11px;
color: @white;
text-align: center;
background-color: @blue;
-webkit-box-shadow: inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.15);
box-shadow: inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.15);
font-weight:bold;
text-shadow: 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.25);
background-image:url('@{base-url}/pattern/overlay-pattern.png');
}
.progress-striped .progress-bar {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-size: 40px 40px;
}
.progress.active .progress-bar {
-webkit-animation: progress-bar-stripes 2s linear infinite;
-moz-animation: progress-bar-stripes 2s linear infinite;
-ms-animation: progress-bar-stripes 2s linear infinite;
-o-animation: progress-bar-stripes 2s linear infinite;
animation: progress-bar-stripes 2s linear infinite;
}
.progress-bar-danger {
background-color: @brand-danger;
}
.progress-striped .progress-bar-danger {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-success {
background-color: @brand-success;
}
.progress-striped .progress-bar-success {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-warning {
background-color: @brand-warning;
}
.progress-striped .progress-bar-warning {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
}
.progress-bar-info {
background-color: @brand-info;
}
.progress-striped .progress-bar-info {
background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, rgba(red(@white), green(@white), blue(@white), 0.15)), color-stop(0.75, transparent), to(transparent));
background-image: -webkit-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: -moz-linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
background-image: linear-gradient(45deg, rgba(red(@white), green(@white), blue(@white), 0.15) 25%, transparent 25%, transparent 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 50%, rgba(red(@white), green(@white), blue(@white), 0.15) 75%, transparent 75%, transparent);
}
.progress-info .bar, .progress .bar-info {
background: @brand-info;
}
.vertical-bars {
padding:0;
margin:0;
}
.vertical-bars:after {
content: "";
display: block;
height: 0;
clear: both;
}
.vertical-bars li {
padding: 14px 0;
width: 25%;
display: block;
float: left;
text-align: center;
}
.vertical-bars li:first-child {
border-left: none;
}
.vertical-bars > li > .progress.vertical:first-child {
margin-left: auto;
}
.vertical-bars > li > .progress.vertical {
margin: 0 auto;
float: none;
}
/*
* BAR HOLDER
*/
.bar-holder:first-child {
border-top: none;
}
.bar-holder {
padding: 18px 15px;
}
.bar-holder .progress {
margin:0;
}
/*
* TABS
*/
.nav-tabs>li > a .badge {
font-size: 11px;
padding: 3px 5px 3px 5px;
opacity: .5;
margin-left: 5px;
min-width: 17px;
font-weight: normal;
}
.nav-tabs>li > a > .fa {
opacity: .5;
}
.tabs-left .nav-tabs>li > a .badge {
margin-right:5px;
margin-left:0px;
}
.nav-tabs>li > a .label {
display:inline-block;
font-size:11px;
margin-left:5px;
opacity: .5;
}
.nav-tabs>li.active > a .badge, .nav-tabs>li.active > a .label, .nav-tabs>li.active > a > .fa{
opacity: 1;
}
.nav-tabs>li>a {
border-radius:0px;
color:@gray-dark;
}
.nav-tabs > li.active > a {
-webkit-box-shadow: 0 -2px 0 @blue;
-moz-box-shadow: 0 -2px 0 @blue;
box-shadow: 0 -2px 0 @blue;
border-top-width: 0px !important;
margin-top: 1px !important;
font-weight:bold;
}
.tabs-left .nav-tabs > li.active > a {
-webkit-box-shadow: -2px 0 0 @blue;
-moz-box-shadow: -2px 0 0 @blue;
box-shadow: -2px 0 0 @blue;
border-top-width: 1px !important;
border-left: none !important;
margin-left: 1px !important;
}
.tabs-left .nav-pills > li.active > a {
border:none !important;
box-shadow:none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
}
.tabs-right .nav-tabs > li.active > a {
-webkit-box-shadow: 2px 0 0 @blue;
-moz-box-shadow: 2px 0 0 @blue;
box-shadow: 2px 0 0 @blue;
border-top-width: 1px !important;
border-right: none !important;
margin-right: 1px !important;
}
.tabs-below .nav-tabs > li.active > a {
-webkit-box-shadow: 0 2px 0 @blue;
-moz-box-shadow: 0 2px 0 @blue;
box-shadow: 0 2px 0 @blue;
border-bottom-width: 0px !important;
border-top: none !important;
margin-top: 0px !important;
}
.tabs-below > .nav-tabs, .tabs-right > .nav-tabs, .tabs-left > .nav-tabs {
border-bottom: 0;
}
.tab-content > .tab-pane, .pill-content > .pill-pane {
display: none;
}
.tab-content > .active, .pill-content > .active {
display: block;
}
.tabs-below > .nav-tabs {
border-top: 1px solid darken(@gray-lighter, 7%);
}
.tabs-below > .nav-tabs > li {
margin-top: -1px;
margin-bottom: 0;
}
.tabs-left > .nav-tabs > li, .tabs-right > .nav-tabs > li,
.tabs-left > .nav-pills > li, .tabs-right > .nav-pills > li {
float: none;
}
.tabs-left > .nav-tabs > li > a, .tabs-right > .nav-tabs > li > a,
.tabs-left > .nav-pills > li > a, .tabs-right > .nav-pills > li > a {
min-width: 74px;
margin-right: 0;
margin-bottom: 3px;
}
.tabs-left > .nav-tabs, .tabs-left > .nav-pills {
float: left;
margin-right: 19px;
border-right: 1px solid darken(@gray-lighter, 7%);
} .tabs-left > .nav-pills {
border-right:none;
}
.tabs-left > .nav-tabs > li > a {
margin-right: -1px;
}
.tabs-left > .nav-tabs > li > a:hover, .tabs-left > .nav-tabs > li > a:focus {
border-color: @gray-lighter darken(@gray-lighter, 10%) @gray-lighter @gray-lighter;
}
.tabs-left > .nav-tabs .active > a, .tabs-left > .nav-tabs .active > a:hover, .tabs-left > .nav-tabs .active > a:focus {
border-color: darken(@gray-lighter, 10%) transparent darken(@gray-lighter, 10%) darken(@gray-lighter, 7%);
*border-right-color: @white;
}
.tabs-left > .tab-content {
margin-left: 109px;
}
.tabs-right > .nav-tabs {
float: right;
margin-left: 19px;
border-left: 1px solid darken(@gray-lighter, 7%); /* DDD */
}
.tabs-right > .nav-tabs > li > a {
margin-left: -1px;
}
.tabs-right > .nav-tabs > li > a:hover, .tabs-right > .nav-tabs > li > a:focus {
border-color: @gray-lighter @gray-lighter @gray-lighter darken(@gray-lighter, 7%);
}
.tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {
border-color: darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) transparent;
*border-left-color: @white;
}
.tabs-below > .nav-tabs, .tabs-right > .nav-tabs, .tabs-left > .nav-tabs {
border-bottom: 0;
}
.tab-content > .tab-pane, .pill-content > .pill-pane {
display: none;
}
.tab-content > .active, .pill-content > .active {
display: block;
}
.tabs-below > .nav-tabs {
border-top: 1px solid darken(@gray-lighter, 7%);
}
.tabs-below > .nav-tabs > li {
margin-top: -1px;
margin-bottom: 0;
}
.tabs-below > .nav-tabs > li > a:hover, .tabs-below > .nav-tabs > li > a:focus {
border-top-color: darken(@gray-lighter, 7%);
border-bottom-color: transparent;
}
.tabs-below > .nav-tabs > .active > a, .tabs-below > .nav-tabs > .active > a:hover, .tabs-below > .nav-tabs > .active > a:focus {
border-color: transparent darken(@gray-lighter, 7%) darken(@gray-lighter, 7%) darken(@gray-lighter, 7%); /* tabs */
}
/* bordered tabs */
.nav-tabs.bordered {
background:@white;
border:1px solid darken(@gray-lighter, 7%);
}
.nav-tabs.bordered >:first-child a{
border-left-width:0px !important;
}
.nav-tabs.bordered + .tab-content {
border:1px solid darken(@gray-lighter, 7%);
border-top:none;
}
/* bordered tabs top right */
.tabs-pull-right.nav-tabs>li, .tabs-pull-right.nav-pills>li {
float:right;
}
.tabs-pull-right.nav-tabs>li:first-child > a, .tabs-pull-right.nav-pills>li:first-child > a {
margin-right:1px;
}
.tabs-pull-right.bordered.nav-tabs>li:first-child > a, .tabs-pull-right.bordered.nav-pills>li:first-child > a {
border-left-width:1px !important;
margin-right:0px;
border-right-width:0px;
}
/* jarviswidget header first child is tab */
.jarviswidget > header > .nav-tabs.pull-left > li:first-child a{
border-left-width:0px !important;
}
/*
* WEBKIT IOS HIGHLIGHT COLOR
*
*/
a:link, .btn, button {
-webkit-tap-highlight-color: fade(@red, 50%);
}
.login-info, .login-info *, #logo-group *, .minified .menu-item-parent {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/*
* BS2 useful classes
* these classes and its importance was overlooked in BS3
*/
.hidden-desktop {
display:none !important;
}
/*
* DROPDOWN MENU
*/
.dropdown-menu-xs {
min-width:37px;
}
.dropdown-menu-xs>li>a {
padding: 3px 10px;
}.dropdown-menu-xs>li>a:hover i {
color:#fff !important;
}
/* Dropdown menu extended */
.dropdown-submenu {
position: relative;
}
.dropdown-submenu>.dropdown-menu {
top: 0;
left: 100%;
margin-top: -6px;
margin-left: -1px;
}
.dropdown-submenu:hover>.dropdown-menu {
display: block;
}
.dropdown-submenu>a:after {
display: block;
content: " ";
float: right;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
border-width: 5px 0 5px 5px;
border-left-color: @gray-mid-light;
margin-top: 5px;
margin-right: -10px;
}
.dropdown-submenu:hover>a:after {
border-left-color: @white;
}
.dropdown-submenu.pull-left {
float: none;
}
.dropdown-submenu.pull-left>.dropdown-menu {
left: -100%;
margin-left: 10px;
}
/*
* Table
*/
.table.has-tickbox thead tr th:first-child {
width:18px;
}
.table.has-tickbox.smart-form thead tr th:first-child .radio,
.table.has-tickbox.smart-form thead tr th:first-child .checkbox,
.table.has-tickbox.smart-form tbody tr td:first-child .radio,
.table.has-tickbox.smart-form tbody tr td:first-child .checkbox {
padding:0px !important;
}
.table thead tr, .fc-border-separate thead tr {
background-color: @gray-lighter;
background-image: -webkit-gradient(linear,0 0,0 100%,from(@table-header-color-start),to(@table-header-color-end));
background-image: -webkit-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
background-image: -moz-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
background-image: -ms-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
background-image: -o-linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
background-image: -linear-gradient(top,@table-header-color-start 0,@table-header-color-end 100%);
font-size: 12px;
}.fc-border-separate thead tr th {
padding: 4px;
line-height: 1.428571429;
}
.table-bordered>thead>tr>th, .table-bordered>thead>tr>td {
border-width:1px;
}
.no-padding > .table-bordered {
border:none !important;
}
.no-padding > .table-bordered thead tr th:first-child,
.no-padding > .table-bordered thead tr td:first-child,
.no-padding > .table-bordered tbody tr td:first-child {
border-left-width:0px !important;
}
.no-padding > .table-bordered thead tr th:last-child,
.no-padding > .table-bordered tbody tr td:last-child {
border-right-width:0px !important;
}
.no-padding > .table-bordered tbody tr:last-child td {
border-bottom-width:0px !important;
}
.no-padding .note-editable .table-bordered {
border: 1px solid darken(@gray-lighter, 7%) !important;
}
.smart-form.table td .radio i,
.smart-form.table td .checkbox i,
.smart-form.table th .radio i,
.smart-form.table th .checkbox i {
top: 0px !important;
}
/*
* small stats
*/
.show-stats .progress {
height: 7px;
border-radius: 0;
margin-top: 3px;
margin-bottom: 15px;
}
.show-stats {
padding-top:6px !important;
}
.show-stat-buttons {
float:left;
width:100%;
}
.show-stats .show-stat-buttons>:first-child{
padding-right:5px;
}
.show-stats .show-stat-buttons>:last-child{
padding-left:5px;
}
.show-stat-microcharts {
margin-left:-10px;
margin-right:-10px;
}
.show-stat-microcharts > div {
border-right: 1px solid #DADADA !important;
border-top: 1px solid #DADADA !important;
margin-top: 10px !important;
height: 65px;
overflow:hidden;
padding: 7px 9px;
}
.show-stat-microcharts >:last-child {
border-right:none !important;
}
.show-stat-microcharts .sparkline {
margin-top:10px;
margin-right:8px;
opacity:.7;
} .show-stat-microcharts .sparkline:hover {
opacity:1;
}
.smaller-stat {
margin:0;
padding:0;
list-style:none;
}
.smaller-stat li {
margin-top:3px;
margin-right:0px;
}.smaller-stat li:first-child {
margin-top:8px;
}
.smaller-stat span.label {
width:40px;
display:block;
text-align:left;
opacity:.5;
cursor: default;
} .smaller-stat span.label:hover {
opacity:1;
}
/*
* Login info
*/
.login-info {
border-bottom: 1px solid #D8D4D4;
display: block;
font-size: 12px;
height: 39px;
color: @white;
border: solid transparent;
border-width: 1px 0px 1px 0px;
box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black), 0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black), 0.07);
width: 100%;
margin: 0px !important;
border-bottom: 1px solid #525151;
}
.login-info a {
text-decoration:none !important;
color: @asideLinkColor;
display: inline-block;
margin-top: 6px;
}
.login-info a span {
text-transform: capitalize;
font-size: @font-size-base + 1px; /* 14px~ */
display: inline-block;
text-decoration: none;
max-width: 150px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
}
.login-info a span + i {
vertical-align:middle;
}
.login-info a:hover {
color: @white;
}
.login-info > span {
height: 38px;
display: block;
padding: 0 10px;
border-bottom: 1px solid #1A1817;
}
.login-info img {
width: 25px;
height: auto;
display: inline-block;
vertical-align: middle;
margin-top: 1px;
margin-right: 5px;
margin-left: 0px;
border-left: 3px solid @white;
}
img.online, img.busy, img.offline, img.away {
border-left:3px solid #fff;
}
img.online {
border-left-color: @greenBright !important;
}
img.busy {
border-left-color: @redBright !important;
}
img.offline {
border-left-color: darken(@gray-lighter, 7%) !important;
}
img.away {
border-left-color: #ffc40d !important;
}
/*
* Client page forms
*/
.client-form header {
padding: 15px 13px;
margin:0;
border-bottom-style:solid;
border-bottom-color:rgba(red(@black), green(@black), blue(@black), .1);
background: rgba(248, 248, 248, .9);
}
/*
* MINIFIED MENU
*/
.minified .inbox-badge {
border-radius: 50%;
font-size: 9px;
padding: 2px;
position: absolute;
top: 6px;
right: 6px;
background: #ED1C24;
min-width:13px;
}
.minifyme {
border-bottom: 1px solid #302F2F;
background: #454545;
color: #A8A8A8;
text-align: center;
padding: 0;
width: 36px;
height: 28px;
display: block;
position: absolute;
right: -3px;
border-radius: 5px 0px 0px 5px;
cursor: pointer;
margin-top: 5px;
font-size: 19px;
transition: all 0.1s linear 0s;
}
.minifyme:hover {
background:#646464;
color:#E4E4E4;
right: 0px;
}
.minified .minifyme {
right: 0px;
color: #A8A8A8;
position: relative;
width: 100%;
border-radius: 0px;
margin: 0;
height: 34px;
font-size: 23px;
}
.minified .minifyme .fa:before {
content:"\f0a9";
}
.minified .login-info a span, .minified .login-info a i {
display: none;
}
.minified .login-info span {
padding: 0px 5px;
text-align:center;
}
.minified .login-info img {
margin: -2px 0 0;
width: 30px;
}
.minified .login-info {
height: 38px;
border-bottom: 1px solid #181818;
}
.minified #left-panel {
width: 45px;
}
.minified #main {
margin-left: 45px;
}
/*
* Minified NAV
*/
.minified #left-panel, .minified nav > ul > li {
overflow: visible;
}
.minified nav > ul > ul {
min-height: 100px !important;
max-height: 180px !important;
overflow-y: scroll;
overflow-x: hidden;
background: #ed1c24 !important;
}
.minified nav > ul > li, .minified nav > ul > li a {
position: relative;
}
.minified nav ul > li > a {
padding: 10px 11px;
display:block
}
.minified nav > ul > li > a .fa.fa-fw {
display: block;
width: auto;
text-align: center;
padding:0;
}
.minified nav > ul > li > a > i {
text-align:center;
margin:0;
display:block;
}
.minified nav > ul > li.active > a::before {
content: "\f0d9";
}
.minified nav ul ul li a {
padding-left: 14px;
}
.minified nav ul ul li li a {
padding-left: 25px;
}
.minified nav > ul ul li::before {
left: 12px;
}
.minified nav > ul > li > ul::before {
left: 12px;
}
.minified nav > ul > li > a .menu-item-parent, .minified nav > ul > li > a > b {
display: none;
}
.minified nav > ul > li > a > .menu-item-parent {
display: none;
position: absolute;
left: 40px;
top: -3px;
width: @asideWidth - 34px;
height: 38px;
line-height: 38px;
background-color: whiteSmoke;
color: @gray-dark;
z-index: 3;
-webkit-box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
-moz-box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black),0.2);
box-shadow: 2px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
border-left: 1px solid @gray-mid-light;
border-top: 1px solid #D8D4D4;
border-bottom: 1px solid @white;
padding-left: 12px;
}
.minified nav > ul > li > ul {
display: none !important;
position: absolute;
left: 40px;
width: @asideWidth - 20px;
z-index: 5;
border: 1px solid @gray-mid-light;
min-height: 180px;
-webkit-box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
-moz-box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black),0.2);
box-shadow: 1px 1px 2px 0 rgba(red(@black), green(@black), blue(@black), 0.2);
background: #3A3633;
margin-top: -3px;
}
.minified nav ul > li > ul > li > ul {
position: relative;
left: 13px;
border: none;
width: auto;
margin-left: -12px;
width: @asideWidth - 23px;
}
.minified nav > ul > li:hover > a > .menu-item-parent, .minified nav > ul > li:hover > ul {
display: block !important;
}
.minified nav > ul > li > ul > li {
background-color: rgba(69, 69, 69, .9);
}
.minified nav > ul > li > ul > li > ul > li {
background-color: #484B50;
}
.minified nav > ul > li {
border-bottom: 1px solid #1A1817;
border-top: 1px solid #525151;
}
.minified nav > ul > li > ul::before {
border-left: none;
}
.minified nav > ul ul li::before {
border: none;
}
.slimScrollDiv, .slimScrollDiv > :first-child {
overflow: hidden;
}
.minified .slimScrollDiv, .minified .slimScrollDiv > :first-child {
overflow: visible !important;
}
.minified .slimScrollBar, .minified .slimScrollRail {
display: none;
}
.minified nav > ul > li > ul > li > a {
padding-top: 7px;
padding-bottom: 7px;
}
.minified nav > ul > li > ul > li > ul > li > a {
padding-top: 7px;
padding-bottom: 7px;
}
.minified nav > ul > li > ul > li > ul > li a {
padding-top: 6px;
padding-bottom: 6px;
}
/* Fourth Level: A */
.minified nav ul ul ul ul li a {
padding-left: 45px;
}
/* Fifth Level: A */
.minified nav ul ul ul ul ul li a {
padding-left: 62px;
}
/* Sixth Level: A */
.minified nav ul ul ul ul ul ul li a {
padding-left: 82px;
}
/*
* SHORT CUTS
*/
.pull-right {
float: right !Important;
}
.pull-left {
float: left !Important;
}
/*
* ALTERNATIVE PAGING
*/
.pagination.pagination-alt>li>a {
box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
border: none;
margin-left: -1px;
}
.pagination.pagination-alt > li:first-child>a {
padding-left:0px;
}
/*
* CUSTOM BUTTON
*/
.pagination > li > a, .pagination > li > span {
box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
}
.disabled {
color:@white;
}
.btn-default.disabled {
color:@gray-light;
}
.btn {
border-radius:2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
}
.btn:active {
position:relative;
top:1px;
left:1px;
}
.btn.btn-ribbon {
background-color: #707070;
background-image: -moz-linear-gradient(top, #777, #666);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#777), to(#666));
background-image: -webkit-linear-gradient(top, #777, #666);
background-image: -o-linear-gradient(top, #777, #666);
background-image: linear-gradient(to bottom, #777, #666);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff777777', endColorstr='#ff666666', GradientType=0);
color: white;
padding: 0 5px;
line-height: 20px;
vertical-align: middle;
height: 20px;
display: block;
border: none;
float: left;
margin: 0 8px 0 0;
cursor: pointer;
}
.btn.btn-ribbon > i {
font-size:111%;
}
.ribbon-button-alignment {
padding-top: 10px;
display: inline-block;
}
.ribbon-button-alignment.pull-right > .btn.btn-ribbon {
margin: 0 0 0 8px;
}
/*
* Panels
*/
.panel-purple {
border-color:@purple;
& > .panel-heading {
color: @white;
background-color: @purple;
border-color: @purple;
}
}
.panel-greenLight {
border-color:@greenLight;
& > .panel-heading {
color: @white;
background-color: @greenLight;
border-color: @greenLight;
}
}
.panel-greenDark {
border-color:@greenDark;
& > .panel-heading {
color: @white;
background-color: @greenDark;
border-color: @greenDark;
}
}
.panel-darken {
border-color:@gray-dark;
& > .panel-heading {
color: @white;
background-color: #404040;
border-color: #404040;
}
}
.panel-pink {
border-color:@pink;
& > .panel-heading {
color: @white;
background-color: @pink;
border-color: @pink;
}
}
.panel-green {
border-color:@green;
& > .panel-heading {
color: @white;
background-color: @green;
border-color: @green;
}
}
.panel-blueLight {
border-color: @blueLight;
& > .panel-heading {
color: @white;
background-color: @blueLight;
border-color: @blueLight;
}
}
.panel-pinkDark {
border-color:@pinkDark;
& > .panel-heading {
color: @white;
background-color: @pinkDark;
border-color: @pinkDark;
}
}
.panel-redLight {
border-color: @redLight;
& > .panel-heading {
color: @white;
background-color: @redLight;
border-color: @redLight;
}
}
.panel-red {
border-color: @red;
& > .panel-heading {
color: @white;
background-color: @red;
border-color: @red;
}
}
.panel-teal {
border-color: @teal;
& > .panel-heading {
color: @white;
background-color: @teal;
border-color: @teal;
}
}
.panel-orange {
border-color: @orange;
& > .panel-heading {
color: @white;
background-color: @orange;
border-color: @orange;
}
}
.panel-blueDark {
border-color: @blueDark;
& > .panel-heading {
color: @white;
background-color: @blueDark;
border-color: @blueDark;
}
}
.panel-magenta {
border-color:@magenta;
& > .panel-heading {
color: @white;
background-color: @magenta;
border-color: @magenta;
}
}
.panel-blue {
border-color: @blue;
& > .panel-heading {
color: @white;
background-color: @blue;
border-color: @blue;
}
}
.panel-footer > .btn-block {
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius: 0px;
border-bottom:none;
border-left:none;
border-right:none;
}
/*
* Circle Buttons
*/
.btn-circle {
width: 30px;
height: 30px;
text-align: center;
padding: 6px 0;
font-size: 12px;
line-height: 18px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.btn-circle.btn-lg {
width: 50px;
height: 50px;
padding: 10px 15px;
font-size: 18px;
line-height: 30px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
.btn-circle.btn-xl {
width: 70px;
height: 70px;
padding: 10px 15px;
font-size: 24px;
line-height: 50px;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}
/*
* Big Metro Buttons
*/
.btn-metro {
margin:0 0 20px;
padding-top:15px;
padding-bottom:15px;
}
.btn-metro > span {
display:block;
vertical-align: bottom;
margin-top:10px;
text-transform:uppercase;
}
.btn-metro > span.label {
position: absolute;
top:0px;
right:0px;
}
/*
* buttons with labels
*/
.btn-label {position: relative;left: -12px;display: inline-block;padding: 6px 12px;background: rgba(red(@black), green(@black), blue(@black),0.15);border-radius: 3px 0 0 3px;}
.btn-labeled {padding-top: 0;padding-bottom: 0;}
.btn-link {
box-shadow: none;
-webkit-box-shadow: none;
font-size: @font-size-base + 1;
}
/*
* ANIMATION
*/
#left-panel, #content {
-moz-transition: left .1s ease-out;
-ms-transition: left .1s ease-out;
-o-transition: left .1s ease-out;
-webkit-transition: left .1s ease-out;
transition: left .1s ease-out;
}
#main {
-moz-transition: all .1s ease-out;
-ms-transition: all .1s ease-out;
-o-transition: all .1s ease-out;
-webkit-transition: all .1s ease-out;
transition: all .1s ease-out;
}
/*
* CHARTS
*/
.chart-small {
height:100px;
width:100%;
}
.chart-large {
height:235px;
width:100%;
}
.chart-xl {
height:297px;
width:100%;
}
/*
* Flot Tool tips
*/
#flotTip {
padding: 3px 5px;
background-color: @white;
z-index: @tooltip-zindex;
color: @gray-dark;
-webkit-box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black), 0.1);
-moz-box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black),0.1);
box-shadow: 0 1px 8px rgba(red(@black), green(@black), blue(@black), 0.1);
font-size: 14px;
border: 1px solid #C1C1C1;
-moz-border-radius: 4px;
-khtml-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
#flotTip span {
color:#38812D;
font-weight:bold;
}
.legendLabel span {
display: block;
margin: 0 5px;
}
.legendColorBox {
padding-left: 10px;
vertical-align: top;
padding-top: 5px;
}
.legendColorBox div > div {
width: 4px;
height: 4px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
box-sizing:content-box;
-moz-box-sizing:content-box;
-webkit-box-sizing: content-box;
}
/*
* Morris Charts
*/
.morris-hover.morris-default-style {
border-radius: 10px;
padding: 6px;
color: #666;
background: rgba(red(@white), green(@white), blue(@white), 0.8);
border: solid 2px rgba(230, 230, 230, 0.8);
font-family: sans-serif;
font-size: 12px;
text-align: center;
.morris-hover-row-label {
font-weight: bold;
margin: 0.25em 0;
}
.morris-hover-point {
white-space: nowrap;
margin: 0.1em 0;
}
}
.morris-hover {
position: absolute;
z-index: @morris-hover;
}
/*
* Flot Chart
*/
.chart {
height:220px;
margin:20px 5px 10px 10px;
}
.has-legend {
margin-top: 30px !important;
}
.has-legend-unique {
margin-top: 19px !important;
}
/*
* EASY PIE CHART
*/
.easyPieChart {
position: relative;
text-align: center;
canvas {
position: absolute;
top: 0;
left: 0;
}
}
.easy-pie-chart {
display:inline-block;
.percent {
color:#444;
font-size:12px;
font-weight:bold;
}
}
.easy-pie-title {
display: inline-block;
margin: 10px 6px 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size:12px;
font-weight:400;
text-transform:uppercase;
width:100px;
height:19px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.easy-pie-title .icon-color-good,
.easy-pie-title .icon-color-bad {
font-size:18px;
}
/*
* Carren colors
*/
.icon-color-good {
color:@greenBright;
}
.icon-color-bad {
color:@redBright;
}
/*
* SIGNS
*/
.percent-sign:after, .degree-sign:after {
content: " %";
line-height: normal;
}
.degree-sign:after {
content:" °F";
}
/*
* HIDDEN MENU
*/
.hidden-menu #left-panel {
left: -@asideWidth + 10px;
z-index: @hidden-lefthand-menu-zindex;
}
.hidden-menu #main {
margin-left: 10px;
}
.hidden-menu #left-panel:hover {
left: 0px;
}
.hidden-menu .minifyme {
display: none;
}
.minified #hide-menu {
display: none;
}
.btn-header.pull-right {
margin-left:6px;
}
.btn-header a > span {
font-size:13px;
font-weight:normal;
line-height:30px;
height:30px;
display:inline-block;
}
.btn-header > :first-child > a {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
cursor: default !important;
display: inline-block;
font-weight: bold;
height: 30px;
min-width: 30px;
padding: 2px;
text-align: center;
text-decoration: none !important;
-moz-user-select: none;
-webkit-user-select: none;
background-color: lighten(@gray-lightest, 1.9%);
background-image: -webkit-gradient(linear,left top,left bottom,from(lighten(@gray-lightest, 1.9%)),to(darken(@gray-lightest, 1%)));
background-image: -webkit-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -moz-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -ms-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: -o-linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
background-image: linear-gradient(top,lighten(@gray-lightest, 1.9%),darken(@gray-lightest, 1%));
border: 1px solid @gray-mid-light;
color: #6D6A69;
font-size: 17px;
margin: 10px 0 0 0;
}
.btn-header > :first-child > a:hover {
border: 1px solid @gray-mid-light;
color: #222;
transition: all 0.0s;
cursor: pointer;
-webkit-box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), .08);
box-shadow: inset 0px 0px 4px 1px rgba(red(@black), green(@black), blue(@black), .08);
}
.btn-header > :first-child > a:active {
background-color: #e8e8e8;
background-image: -moz-linear-gradient(top, #e8e8e8 0%, #ededed 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(100%,#ededed));
background-image: -webkit-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
background-image: -o-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
background-image: -ms-linear-gradient(top, #e8e8e8 0%,#ededed 100%);
background-image: linear-gradient(to bottom, #e8e8e8 0%,#ededed 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#ededed',GradientType=0 );
-webkit-box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
}
.hidden-menu #hide-menu > :first-child > a {
background-color: #e8e8e8;
background-image: -moz-linear-gradient(top, #5A5A5A 0%, #686868 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5A5A5A), color-stop(100%,#686868));
background-image: -webkit-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
background-image: -o-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
background-image: -ms-linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
background-image: linear-gradient(to bottom, #5A5A5A 0%,#686868 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5A5A5A', endColorstr='#686868',GradientType=0 );
-webkit-box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
box-shadow: inset 0px 0px 3px 1px rgba(red(@black), green(@black), blue(@black), .15);
color: @white;
border-color:#494949;
}
.hidden-menu #hide-menu > :first-child > a:active, .full-screen #fullscreen > :first-child > a:active {
-webkit-box-shadow: inset 0px 0px 6px 1px rgba(red(@black), green(@black), blue(@black), .2);
box-shadow: inset 0px 0px 6px 1px rgba(red(@black), green(@black), blue(@black), .2);
}
/*
* AJAX DROPDOWN
*/
.ajax-dropdown >:first-child {
margin:0 0 3px 0;
padding:0 0 9px 0;
}
.ajax-dropdown {
position: absolute;
display: none;
z-index: @ajax-dropdown-zindex;
background: white;
top: 48px;
left: 16px;
width: 344px;
height: 435px;
border-radius:0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-webkit-box-shadow: 0 2px 4px rgba(30, 30, 100, 0.25);
-moz-box-shadow: 0 2px 4px rgba(30,30,100,0.25);
box-shadow: 0 2px 4px rgba(30, 30, 100, 0.25);
padding:10px;
background: @white;
border: 1px solid #b3b3b3;
}
.ajax-dropdown:after, .ajax-dropdown:before {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.ajax-dropdown:after {
border-color: rgba(red(@white), green(@white), blue(@white), 0);
border-bottom-color: @ajaxdrop-arrow-top-color;
border-width: @ajaxdropdown-arrow-size;
left: 50%;
margin-left: -@ajaxdropdown-arrow-size;
}
.ajax-dropdown:before {
border-color: rgba(131, 131, 131, 0);
border-bottom-color: @ajaxdrop-arrow-bottom-color;
border-width: @ajaxdropdown-arrow-bottom;
left: 50%;
margin-left: -@ajaxdropdown-arrow-bottom;
}
.ajax-dropdown .btn-group .btn {
font-weight:bold;
text-transform:capitalize;
}
.ajax-dropdown .btn-group >:nth-child(2) {
border-right-width:0px;
border-left-width:0px;
}
.ajax-dropdown .btn-group .btn:active {
top:0px;
left:0px;
}
.ajax-notifications {
height: @ajaxdropdown-height;
display:block;
overflow: auto;
margin-right: -10px;
margin-left: -10px;
border-bottom: 1px solid #CECECE;
border-top: 1px solid #CECECE;
background: #E9E9E9;
}
.ajax-notifications > .alert.alert-transparent {
background-color: transparent;
border-color: transparent;
color: #757575;
margin:13px 10px;
}
.ajax-notifications > .alert>:first-child {
margin-bottom:10px;
font-weight:400;
}
.ajax-dropdown >:last-child {
font-size:13px;
display: block;
padding: 5px 0;
line-height: 22px;
font-weight: 400;
}
.ajax-dropdown .fa-4x.fa-border {
border-width:3px;
border-radius:50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
display:block;
margin:0 auto;
width:46px;
text-align:center;
color: #D1D1D1;
border-color:#D1D1D1;
}
/*
* LARGE DROPDOWNS
*/
.dropdown-large {
position: static !important;
}
.dropdown-menu-large {
margin-left: 16px;
margin-right: 16px;
padding: 20px 0px;
}
.dropdown-menu-large > li > ul {
padding: 0;
margin: 0;
}
.dropdown-menu-large > li > ul > li {
list-style: none;
}
.dropdown-menu-large > li > ul > li > a {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.428571429;
color: #333333;
white-space: normal;
}
.dropdown-menu-large > li ul > li > a:hover,
.dropdown-menu-large > li ul > li > a:focus {
text-decoration: none;
color: #262626;
background-color: #f5f5f5;
}
.dropdown-menu-large .disabled > a,
.dropdown-menu-large .disabled > a:hover,
.dropdown-menu-large .disabled > a:focus {
color: #999999;
}
.dropdown-menu-large .disabled > a:hover,
.dropdown-menu-large .disabled > a:focus {
text-decoration: none;
background-color: transparent;
background-image: none;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
cursor: not-allowed;
}
.dropdown-menu-large .dropdown-header {
color: #428bca;
font-size: 18px;
}
@media (max-width: 768px) {
.dropdown-menu-large {
margin-left: 0 ;
margin-right: 0 ;
}
.dropdown-menu-large > li {
margin-bottom: 30px;
}
.dropdown-menu-large > li:last-child {
margin-bottom: 0;
}
.dropdown-menu-large .dropdown-header {
padding: 3px 15px !important;
}
}
/*
* PAGING
*/
.pagination-xs>li>a, .pagination-xs>li>span {
padding: 4px 9px;
font-size:12px;
}
/*
* NOTIFICATIONS : MAIL
*/
.notification-body *, .notification-body:before *, .notification-body:after * {
box-sizing:border-box !important;
-webkit-box-sizing:border-box !important;
-moz-box-sizing:border-box !important;
}
.notification-body {
padding:0 0 0 3px;
margin:0;
list-style:none;
}
.notification-body > li {
border-bottom: 1px solid #E9E9E9;
position:relative;
}
.notification-body > li > span {
background: @white;
display: block;
min-height: 25px;
overflow: hidden;
padding: 8px 10px 13px;
white-space: normal;
}
.notification-body > li > span:hover {
background: #F0F4F7 ;
color: #667F8F;
}
.notification-body > li a.msg {
padding-left:50px !important;
}
.notification-body > li a, .notification-body > li a:hover {
text-decoration: none;
}
.notification-body > li a, .notification-body > li a span {
display:block;
position:relative;
overflow:hidden;
}
.notification-body > li a, .notification-body > li a:hover {
text-decoration:none;
}
.notification-body > li:hover .progress {
background: @white;
box-shadow: 0 1px 0 rgba(red(@black), green(@black), blue(@black), 0), 0 0 0 1px #A7A7A7 inset;
-webkit-box-shadow: 0 1px 0 rgba(red(@black), green(@black), blue(@black), 0), 0 0 0 1px #CCC inset;
-moz-box-shadow: 0 1px 0 transparent, 0 0 0 1px lighten(@gray-lighter, 10%) inset;
}.notification-body > li:hover .text-muted {
color:@gray-dark;
}
.notification-body .from {
font-size: @font-size-base + 1px;
line-height:normal;
color:@gray-dark;
font-weight:normal;
margin-right:60px;
margin-bottom:6px;
height:20px;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
}
.notification-body .unread .from {
font-weight:bold;
}
.notification-body .unread {
background:#FFFFE0;
}
.notification-body time {
position:absolute;
top:3px;
right:0;
font-size: 11px;
font-weight:normal;
color:#058dc7;
}
.notification-body .msg-body, .notification-body .subject {
font-size: @font-size-base;
color:#A0A0A0;
max-height:35px;
width: 100%;
text-overflow:ellipsis;
white-space: nowrap;
overflow: hidden;
}
.notification-body .subject {
font-size: @font-size-base;
color:@gray-dark;
max-height:22px;
}
/*
* WIZARDS
*/
.bootstrapWizard {
display: block;
list-style: none;
padding: 0;
position: relative;
width: 100%;
}
.bootstrapWizard a:hover, .bootstrapWizard a:active, .bootstrapWizard a:focus {
text-decoration: none
}
.bootstrapWizard li {
display: block;
float: left;
width: 25%;
text-align: center;
padding-left: 0;
}
.bootstrapWizard li:before {
border-top: 3px solid #55606E;
content: "";
display: block;
font-size: 0;
overflow: hidden;
position: relative;
top: 11px;
right: 1px;
width: 100%;
z-index: 1;
}
.bootstrapWizard li:first-child:before {
left: 50%;
max-width: 50%;
}
.bootstrapWizard li:last-child:before {
max-width: 50%;
width: 50%;
}
.bootstrapWizard li.complete .step {
background: @wizard-step-complete;
padding: 1px 6px;
border: 3px solid #55606E;
}
.bootstrapWizard li .step i {
font-size: 10px;
font-weight: normal;
position: relative;
top: -1.5px;
}
.bootstrapWizard li .step {
background: #B2B5B9;
color: @white;
display: inline;
font-size: 15px;
font-weight: bold;
line-height: 12px;
padding: 7px 13px;
border: 3px solid transparent;
border-radius: 50%;
line-height: normal;
position: relative;
text-align: center;
z-index: 2;
transition: all 0.1s linear 0s;
}
.bootstrapWizard li.active .step, .bootstrapWizard li.active.complete .step {
background: @wizard-step-active;
color: @white;
font-weight: bold;
padding: 7px 13px;
font-size: 15px;
border-radius: 50%;
border: 3px solid #55606E;
}
.bootstrapWizard li.complete .title, .bootstrapWizard li.active .title {
color: #2B3D53;
}
.bootstrapWizard li .title {
color: @gray-mid-light;
display: block;
font-size: 13px;
line-height: 15px;
max-width: 100%;
position: relative;
table-layout: fixed;
text-align: center;
top: 20px;
word-wrap: break-word;
z-index: 104;
}
.wizard-actions {
display: block;
list-style: none;
padding: 0;
position: relative;
width: 100%;
}
.wizard-actions li {
display: inline;
}
.tab-content.transparent {
background-color: transparent;
}
/*
* FUELUX WIZARD
*/
.fuelux .wizard {
position: relative;
overflow: hidden;
background-color: #f9f9f9;
border: 1px solid #d4d4d4;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
*zoom: 1;
-webkit-box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
-moz-box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
box-shadow: 0 1px 4px rgba(red(@black), green(@black), blue(@black), 0.065);
}
.fuelux .wizard:before,
.fuelux .wizard:after {
display: table;
line-height: 0;
content: "";
}
.fuelux .wizard:after {
clear: both;
}
.fuelux .wizard ul {
width: 4000px;
padding: 0;
margin: 0;
list-style: none outside none;
}
.fuelux .wizard ul.previous-disabled li.complete {
cursor: default;
}
.fuelux .wizard ul.previous-disabled li.complete:hover {
color: @green;
cursor: default;
background: #f3f4f5;
}
.fuelux .wizard ul.previous-disabled li.complete:hover .chevron:before {
border-left-color: #f3f4f5;
}
.fuelux .wizard ul li {
position: relative;
float: left;
height: 46px;
padding: 0 20px 0 30px;
margin: 0;
font-size: 16px;
line-height: 46px;
color: #999999;
cursor: default;
background: #ededed;
}
.fuelux .wizard ul li .chevron {
position: absolute;
top: 0;
right: -14px;
z-index: 1;
display: block;
border: 24px solid transparent;
border-right: 0;
border-left: 14px solid #d4d4d4;
}
.fuelux .wizard ul li .chevron:before {
position: absolute;
top: -24px;
right: 1px;
display: block;
border: 24px solid transparent;
border-right: 0;
border-left: 14px solid #ededed;
content: "";
}
.fuelux .wizard ul li.complete {
color: @state-success-text;
background: #f3f4f5;
}
.fuelux .wizard ul li.complete:hover {
cursor: pointer;
background: #e7eff8;
}
.fuelux .wizard ul li.complete:hover .chevron:before {
border-left: 14px solid #e7eff8;
}
.fuelux .wizard ul li.complete .chevron:before {
border-left: 14px solid #f3f4f5;
}
.fuelux .wizard ul li.active {
color: #3a87ad;
background: #f1f6fc;
}
.fuelux .wizard ul li.active .chevron:before {
border-left: 14px solid #f1f6fc;
}
.fuelux .wizard ul li .badge {
margin-right: 8px;
}
.fuelux .wizard ul li:first-child {
padding-left: 20px;
border-radius: 4px 0 0 4px;
}
.fuelux .wizard .actions {
position: absolute;
right: 0;
z-index: 2;
float: right;
padding-right: 15px;
padding-left: 15px;
line-height: 46px;
vertical-align: middle;
background-color: @gray-lighter;
border-left: 1px solid #d4d4d4;
}
.fuelux .wizard .actions a {
margin-right: 8px;
font-size: 12px;
line-height: 45px;
}
.fuelux .wizard .actions .btn-prev i {
margin-right: 5px;
}
.fuelux .wizard .actions .btn-next i {
margin-left: 5px;
}
.fuelux .step-content .step-pane {
display: none;
}
.fuelux .step-content .active {
display: block;
}
.fuelux .step-content .active .btn-group .active {
display: inline-block;
}
/*
* jarvismetro TILE
*/
.jarvismetro-tile {
float:left;
display: block;
background-color: @white;
width: 100px;
height: 70px;
cursor: pointer;
box-shadow: inset 0px 0px 1px #FFFFCC;
border:1px dotted #C5C5C5;
text-decoration: none;
color: @white;
position: relative;
font-weight: 300;
font-smooth: always;
margin: 0 10px 20px 0;
padding:5px;
position: relative;
}
.jarvismetro-tile:hover {
z-index: 10;
-webkit-transform: scale(1.07);
-moz-transform: scale(1.07);
}
.jarvismetro-tile.big-cubes {
width:120px;
height:120px;
}
.jarvismetro-tile.double {
width: 249px;
}
.jarvismetro-tile:active {
top: 1px;
left: 1px;
}
.jarvismetro-tile .iconbox {
text-align:center;
}
.jarvismetro-tile .iconbox i {
display:block;
margin: 15px auto 0;
height: 75px;
}
.jarvismetro-tile .iconbox span {
display:block;
text-align:left;
}
.jarvismetro-tile .iconbox span > span {
position: absolute;
right: -3px;
bottom: -3px;
border-radius: 50%;
padding: 5px 5px;
border: 1px solid @white;
}
.selected {
border: 1px solid @blueSky !important;
}
.selected:before {
display:block;
position: absolute;
content: "\f00c";
color: @white;
right: 4px;
font-family: FontAwesome;
z-index: 2;
}
.selected:after {
display:block;
width: 0;
height: 0;
border-top: 35px solid @blueSky;
border-left: 35px solid rgba(red(@black), green(@black), blue(@black), 0);
position: absolute;
display: block;
right: 0;
content: ".";
top: 0;
z-index: 1;
}
/*
* SHORT CUT
*/
#shortcut {
display:block;
position:absolute;
top:0px;
left:0;
height:auto;
width:100%;
background-color:#33302F;
background-color: rgba(red(@black), green(@black), blue(@black), 0.85);
z-index: @ajax-dropdown-zindex+2;
display:none;
color:@white;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
#shortcut ul {
padding: 15px 20px 10px;
list-style:none;
margin:0;
box-shadow: 0px 4px 10px rgba(red(@black), green(@black), blue(@black), 0.3);
-moz-box-shadow: 0px 4px 10px rgba(red(@black), green(@black), blue(@black), 0.3);
border-bottom: 1px solid #423F3F;
}
#shortcut ul li {
display:inline-block;
width:auto;
}
#shortcut ul li .jarvismetro-tile {
margin:0px 3px 3px;
border:none;
border-radius: 0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
}
#shortcut ul li .jarvismetro-tile:hover {
color:@white;
text-decoration:none;
}
#shortcut ul li .jarvismetro-tile:active, #shortcut ul li .jarvismetro-tile:focus {
left:0;
top:0;
}
.shortcut-on #response-btn {
display:none !important;
}
.shortcut-on #main .navbar, .shortcut-on #left-bar .navbar {
border:none !important;
}
/*
* ARROW BOX
*/
.arrow-box-up:after, .arrow-box-up:before {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.arrow-box-up:after {
border-color: rgba(red(@white), green(@white), blue(@white), 0);
border-bottom-color: @white;
border-width: 7px;
left: 50%;
margin-left: -7px;
}
.arrow-box-up:before {
border-color: rgba(131, 131, 131, 0);
border-bottom-color: #838383;
border-width: 8px;
left: 50%;
margin-left: -8px;
}
/*
* right
*/
.arrow-box-up-right:after, .arrow-box-up-right:before {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.arrow-box-up-right:after {
border-color: rgba(red(@white), green(@white), blue(@white), 0);
border-bottom-color: @white;
border-width: 7px;
right: 10px;
margin-left: -7px;
}
.arrow-box-up-right:before {
border-color: rgba(131, 131, 131, 0);
border-bottom-color: #838383;
border-width: 8px;
right: 9px;
margin-left: -8px;
}
/*
* BOOTSTRAP TOOLTIP
*/
.tooltip-inner {
padding: 5px 10px;
font-size:@tooltip-font-size;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
border-radius: 0px;
}
/*
* SPARKLINE
*/
.jqstooltip {
padding: 7px !important;
border-radius:3px !important;
-webkit-border-radius:3px !important;
-moz-border-radius:3px !important;
border:none !important;
background-color: rgba(red(@black), green(@black), blue(@black), 1) !important;
box-sizing:content-box;
-moz-box-sizing:content-box;
-webkit-box-sizing:content-box;
}
.jqstooltip .jqsfield {
font-family:"Segoe UI","Open Sans",Calibri,Candara,Arial,sans-serif;
font-size:@sparkline-font-size;
}
#sparks {
display: block;
list-style: none;
margin: 10px 0 0;
padding: 0;
text-align: right;
}
#sparks li {
display: inline-block;
max-height: 47px;
overflow: hidden;
text-align: left;
box-sizing:content-box;
-moz-box-sizing:content-box;
-webkit-box-sizing:content-box;
}
#sparks li h5 {
color: #555;
float: left;
font-size: 11px;
font-weight: normal;
margin: -3px 0 0 0;
padding: 0;
border: none;
text-transform: uppercase;
}
#sparks li span {
color: #636363;
display: block;
}
#sparks li {
border-left: 1px dotted #c7c7c7;
padding: 0 10px;
}
#sparks li:last-child {
padding-right: 0;
}
#sparks li:first-child {
border-left: none;
padding-left: 0;
}
.sparks-info {
min-width: 70px;
}
.sparks-info span {
font-size: 18px;
line-height: 20px;
margin: 0;
text-transform: none;
}
.sparks-info .sparkline {
display: block;
float: right;
margin: 3px 0 0 20px;
}
/*
* WEBKIT SCROLLING CSS
* Reference: http://stackoverflow.com/questions/10592657/scrollbar-stylesheet
* GitHub Source: https://gist.github.com/jambu/2004633
*/
.desktop-detected .custom-scroll::-webkit-scrollbar {
-webkit-overflow-scrolling: touch;
height: 10px;
width: 10px;
}
.desktop-detected .custom-scroll::-webkit-scrollbar:hover {
background-color: #E9E9E9;
border: 1px solid #dbdbdb;
}
.desktop-detected .custom-scroll::-webkit-scrollbar-button:start:decrement,
.scrollable::-webkit-scrollbar-button:end:increment {
background: transparent;
display: block;
height: 0;
}
.desktop-detected .custom-scroll::-webkit-scrollbar-track {
background-clip: padding-box;
border-width: 0 0 0 4px;
border: solid transparent;
}
.desktop-detected .custom-scroll::-webkit-scrollbar-track-piece {
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
-webkit-border-radius: 0;
background-color: transparent;
border-radius: 0;
}
.desktop-detected .custom-scroll::-webkit-scrollbar-thumb {
-moz-box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
-webkit-box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
background-clip: padding-box;
background-color: rgba(red(@black), green(@black), blue(@black),0.2);
border-width: 0;
border: none;
box-shadow: inset 1px 1px 0 rgba(red(@black), green(@black), blue(@black),0.1), inset 0 -1px 0 rgba(red(@black), green(@black), blue(@black),0.07);
}
.desktop-detected .custom-scroll::-webkit-scrollbar-thumb:vertical, .scrollable::-webkit-scrollbar-thumb:horizontal {
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
-webkit-border-radius: 0;
background-color: @gray-mid-light;
border-radius: 0;
}
.desktop-detected .custom-scroll::-webkit-scrollbar-thumb:active {
-moz-box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
-webkit-box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
background-color: rgba(red(@black), green(@black), blue(@black),0.44);
box-shadow: inset 1px 1px 3px rgba(red(@black), green(@black), blue(@black),0.33);
}
.desktop-detected .custom-scroll::-webkit-scrollbar-thumb:hover {
background-color: #959595;
}
.mobile-detected .custom-scroll {
-webkit-overflow-scrolling: touch;
}
/*
* Air fields
* Description: absolute positioned objects
*/
.air {
position:absolute;
z-index: 5;
}
.air-bottom {
bottom:0px;
}
.air-top {
top:0px;
}
.air-top-right {
top:0px;
right:0px;
}
.air-top-left {
top:0px;
left:0px;
}
.air-bottom-left {
bottom:0px;
left:0px;
}
.air-bottom-right {
bottom:0px;
right:0px;
}
/*
* Typehead
*/
.twitter-typeahead .tt-query,
.twitter-typeahead .tt-hint {
margin-bottom: 0;
}
.tt-dropdown-menu {
min-width: 160px;
margin-top: 2px;
padding: 5px 0;
background-color: @white;
border: 1px solid @gray-mid-light;
border: 1px solid rgba(red(@black), green(@black), blue(@black),.2);
*border-right-width: 2px;
*border-bottom-width: 2px;
-webkit-box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
-moz-box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
box-shadow: 0 5px 10px rgba(red(@black), green(@black), blue(@black),.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
.tt-suggestion {
display: block;
padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
color: @white;
background-color: #0081c2;
}
.tt-suggestion.tt-is-under-cursor a {
color: @white;
}
.tt-suggestion p {
margin: 0;
}
/*
* Google Maps
*/
.google_maps {
width:100%;
height:350px;
position:relative;
}
.google_maps * {
box-sizing:content-box;
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
}
.google_maps img {
max-width: none; /* needed for google map popup*/
}
/*
* Header btn
*/
.header-btn {
margin-top:5px;
}
/*
* TREE
*/
.tree {
min-height:20px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
}
.tree li {
list-style-type:none;
margin:0;
padding:5px;
position:relative
}
.tree ul ul li:hover {
background:rgba(red(@black), green(@black), blue(@black),.015);
}
.tree li:before, .tree li:after {
content:'';
left:-20px;
position:absolute;
right:auto
}
.tree li:before {
border-left:1px solid @gray-light;
bottom:50px;
height:100%;
top:-11px;
width:1px;
-webkit-transition: "border-color 0.1s ease 0.1s";
-moz-transition: "border-color 0.1s ease 0.1s";
-o-transition: "border-color 0.1s ease 0.1s";
transition: "border-color 0.1s ease 0.1s";
}
.tree li:after {
border-top:1px solid @gray-light;
height:20px;
top:18px;
width:25px
}
.tree li span {
-moz-border-radius:5px;
-webkit-border-radius:5px;
border:1px dotted @gray-light;
border-radius:5px;
display:inline-block;
padding:3px 8px;
text-decoration:none;
-webkit-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
-moz-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
-o-transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
transition: color .2s ease .1s,background-color .2s ease .1s,border-color .3s ease .2s;
}
.tree li.parent_li>span {
cursor:pointer;
padding:7px;
}
.tree>ul>li:before, .tree>ul>li::after {
border:0
}
.tree li:last-child::before {
height:30px
}
.tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span {
background:#eee;
border:1px solid #94a0b4;
color:#000
}
.tree > ul {
padding-left:0px;
}
.tree ul ul {
padding-left: 34px;
padding-top: 10px;
}
.tree li.parent_li>span:hover {
background-color: #DF8505;
border: 1px solid #C67605;
color: @white;
}
.tree li.parent_li>span:hover+ul li::before {
border-left-color: #F89406;
}
.tree li.parent_li>span:hover+ul li::after {
border-top-color: #F89406;
}
.tree li.parent_li>span:hover+ul li span {
background: #FDDFB3 !important;
border: 1px solid #FAA937;
color: #000;
}
/*
* VECTOR MAP
*/
.jvectormap-label {
position: absolute;
display: none;
border: solid 1px #CDCDCD;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
background: #292929;
color: white;
font-family: sans-serif, Verdana;
font-size: smaller;
padding: 3px;
}
.jvectormap-zoomin, .jvectormap-zoomout {
position: absolute;
background: #292929;
padding: 4px;
width: 22px;
height: 22px;
cursor: pointer;
line-height: 10px;
text-align: center;
font-size: 14px;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-moz-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
-webkit-box-shadow: inset 0 -2px 0 rgba(red(@black), green(@black), blue(@black), 0.05);
background-color: @white;
border: 1px solid @gray-mid-light;
}
.jvectormap-zoomin:hover, .jvectormap-zoomout:hover {
background:@gray-lighter;
border-color:lighten(@gray-light, 25%);
}
.jvectormap-zoomin {
top: 0px;
}
.jvectormap-zoomout {
top: 24px;
}
.vector-map {
height:300px;
width:100%;
padding:10px;
}
#heat-fill {
display:block;
position: relative;
margin-bottom:20px;
background:@gray-dark;
height:7px;
width:200px;
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAAABCAIAAAAU3Xa1AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowMDE4MkZGMzMzOTgxMUUzODZBQUNFQUNFOTk0NEUxRiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowMDE4MkZGNDMzOTgxMUUzODZBQUNFQUNFOTk0NEUxRiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjAwMTgyRkYxMzM5ODExRTM4NkFBQ0VBQ0U5OTQ0RTFGIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAwMTgyRkYyMzM5ODExRTM4NkFBQ0VBQ0U5OTQ0RTFGIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+rG8MDAAAAM5JREFUeNpUUtESwyAIg8ft9v8/W4ElBPWKV1AIiKEeEWVuVlWjINSVONBnirQDxukNgcuyTQsBzLHMDsLIQQw+nIL71JqNJ5GZJXApFNpmtlagQjfS2xGbkFA4Iwu+hu0sK3Wl3nOwNv7TvPrWk3X0eW9dK1pU9hK2eTuWb2ySJmlziutA3iBxmblPNvA5PNsuUpoDY80+Z0SW1IRpDEqwC58C14tsr1f8le8si0aojdADr/1UjaclsFashX8GGkL9wDxtRsV6ft/PX4ABADRzhOVIOJaAAAAAAElFTkSuQmCC)
}
.fill-a, .fill-b {
width:20px;
text-align: right;
overflow:hidden;
text-overflow:ellipsis;
display:block;
background:@white;
padding-right:4px;
position:absolute;
left:0px;
margin-top:-7px;
font-weight:bold;
}.fill-b {
text-align:left;
position:absolute;
right:0px;
left:auto;
top:0px;
width:60px;
padding-left:4px;
padding-right:0px;
}
/*
* CKEDITOR
*/
.cke_top {
background: rgba(248, 248, 248, 0.9) !important;
background-image:none !important;
}
/*
* PACE PROGRESS BAR
*/
.pace {
-webkit-pointer-events: none;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.pace-inactive {
display: none;
}
.pace .pace-progress {
background: @blueStandard;
position: fixed;
z-index: @pace-zindex;
top: 0;
left: 0;
height: 2px;
-webkit-transition: width 1s;
-moz-transition: width 1s;
-o-transition: width 1s;
transition: width 1s;
}
.pace .pace-progress-inner {
display: block;
position: absolute;
right: 0px;
width: 100px;
height: 100%;
box-shadow: 0 0 10px #29d, 0 0 5px #29d;
opacity: 1.0;
-webkit-transform: rotate(3deg) translate(0px, -4px);
-moz-transform: rotate(3deg) translate(0px, -4px);
-ms-transform: rotate(3deg) translate(0px, -4px);
-o-transform: rotate(3deg) translate(0px, -4px);
transform: rotate(3deg) translate(0px, -4px);
}
.pace .pace-activity {
display: block;
position: fixed;
z-index: @pace-zindex;
top: 63px;
right: 40px;
width: 14px;
height: 14px;
border: solid 2px transparent;
border-top-color: #29d;
border-left-color: #29d;
border-radius: 10px;
-webkit-animation: pace-spinner 400ms linear infinite;
-moz-animation: pace-spinner 400ms linear infinite;
-ms-animation: pace-spinner 400ms linear infinite;
-o-animation: pace-spinner 400ms linear infinite;
animation: pace-spinner 400ms linear infinite;
}
@-webkit-keyframes pace-spinner {
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@-moz-keyframes pace-spinner {
0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }
100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }
}
@-o-keyframes pace-spinner {
0% { -o-transform: rotate(0deg); transform: rotate(0deg); }
100% { -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-ms-keyframes pace-spinner {
0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }
100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes pace-spinner {
0% { transform: rotate(0deg); transform: rotate(0deg); }
100% { transform: rotate(360deg); transform: rotate(360deg); }
}
/*
* BS Multiselect
* TODO:
*/
.multiselect-container {
position: absolute;
list-style-type: none;
margin: 0;
padding: 0
}
.multiselect-container .input-group {
margin: 5px
}
.multiselect-container > li {
padding: 0
}
.multiselect-container > li > a.multiselect-all label {
font-weight: bold
}
.multiselect-container > li > label.multiselect-group {
margin: 0;
padding: 3px 20px 3px 20px;
height: 100%;
font-weight: bold
}
.multiselect-container > li > a > label {
margin: 0;
height: 100%;
cursor: pointer;
font-weight: normal
}
.multiselect-container > li > a > label.radio, .multiselect-container > li > a > label.checkbox {
margin: 0
}
.multiselect-container > li > a > label > input[type="checkbox"] {
margin-bottom: 5px
}
.btn-group > .btn-group:nth-child(2)> .multiselect.btn {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
/*
* FORMS: INPUT WITH ICONS
*/
.input-group .icon-addon .form-control {
border-radius: 0;
}
.icon-addon {
position: relative;
color: #555;
display: block;
}
.icon-addon:after,
.icon-addon:before {
display: table;
content: " ";
}
.icon-addon:after {
clear: both;
}
.icon-addon.addon-md .glyphicon,
.icon-addon .glyphicon,
.icon-addon.addon-md .fa,
.icon-addon .fa {
position: absolute;
z-index: 2;
left: 10px;
width: 20px;
margin-left: -2.5px;
text-align: center;
padding: 10px 0;
top: 1px
}
.icon-addon.addon-lg .form-control {
line-height: 1.33;
height: 46px;
font-size: 18px;
padding: 10px 16px 10px 40px;
}
.input-group-lg .icon-addon.addon-lg + .input-group-btn>.btn {
height:46px;
}
.icon-addon.addon-sm .form-control {
height: 30px;
padding: 5px 10px 5px 28px;
font-size: 12px;
line-height: 1.5;
}
.icon-addon.addon-lg .fa,
.icon-addon.addon-lg .glyphicon {
font-size: 18px;
margin-left: 0;
left: 11px;
top: 4px;
}
.icon-addon.addon-md .form-control,
.icon-addon .form-control {
padding-left: 30px;
float: left;
font-weight: normal;
}
.icon-addon.addon-sm .fa,
.icon-addon.addon-sm .glyphicon {
margin-left: 0;
font-size: 12px;
left: 5px;
top: -1px
}
.icon-addon .form-control:focus + .glyphicon,
.icon-addon:hover .glyphicon,
.icon-addon .form-control:focus + .fa,
.icon-addon:hover .fa {
color: #2580db;
}
.icon-addon input:disabled + .glyphicon,
.icon-addon select:disabled + .glyphicon,
.icon-addon input:disabled + .fa,
.icon-addon select:disabled + .fa {
color:#ccc;
}