3 // -----------------------------------------------------
6 // -----------------------------------------------------
8 @import url('http://fonts.googleapis.com/css?family=Cabin:400,700');
10 h1, h2, h3, h4, h5, h6,
11 h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
16 input, button, select, textarea,
17 .navbar-search .search-query {
18 font-family: @baseFontFamily;
22 color: rgba(256, 256, 256, 0.5);
27 // -----------------------------------------------------
30 background-color: #4397A2;
31 #gradient > .radial(lighten(#0F8790, 7%), #0F8790);
35 border-bottom: 1px solid rgba(256, 256, 256, 0.3);
39 border-bottom: 0px solid transparent;
43 border-top: 1px solid rgba(256, 256, 256, 0.3);
47 // -----------------------------------------------------
67 .nav > li.active > a {
69 background-color: lighten(@navbarBackground, 10%);
73 .nav > li.active > a:hover {
74 background-color: lighten(@navbarBackground, 10%);
81 .navbar-search .search-query {
82 border: 2px solid lighten(@navbarBackground, 10%);
83 background-color: transparent;
88 background-color: @grayLighter;
89 border-color: @grayLighter;
98 .navbar .nav > li.dropdown.open > .dropdown-menu a:hover,
99 div.subnav .nav > li.dropdown.open > .dropdown-menu a:hover,
100 .dropdown-menu > li > a:hover,
101 .nav .dropdown.open > .dropdown-menu > li > a:hover {
102 background-color: rgba(0, 57, 59, 0.9);
106 background-color: rgba(42, 99, 105, 0.9);
107 background-image: none;
108 border: 0px solid transparent;
112 .nav > li.dropdown.open > a {
113 border-color: transparent;
114 background-color: rgba(256, 256, 256, 0.4);
119 border-color: transparent;
123 .nav > .active > a:hover,
125 .nav > li.active > a:hover, {
126 border-right-color: transparent;
127 background-color: rgba(256, 256, 256, 0.4);
136 .navbar .nav-collapse.collapse {
144 background-color: lighten(@navbarBackground, 10%);
147 .navbar-form, .navbar-search {
149 border-color: lighten(@navbarBackground, 10%);
152 .navbar-search .search-query {
153 border: 2px solid @textColor;
158 // -----------------------------------------------------
160 .buttonBackgroundCustom(@color) {
162 background-image: none;
163 background-color: @color;
165 &:hover, &:active, &.active, &.disabled, &[disabled] {
166 background-color: darken(@color, 5%);
171 background-color: darken(@color, 15%);
175 // IE 7 + 8 can't handle box-shadow to show active, so we darken a bit ourselves
178 background-color: darken(@color, 15%) e("\9");
185 border: 0px solid transparent;
188 .buttonBackgroundCustom(@grayLighter);
191 .btn-group .btn:first-child {
193 -webkit-border-top-left-radius: 0;
194 -moz-border-radius-topleft: 0;
195 border-top-left-radius: 0;
196 -webkit-border-bottom-left-radius: 0;
197 -moz-border-radius-bottomleft: 0;
198 border-bottom-left-radius: 0;
201 .btn-group .btn:last-child,
202 .btn-group .dropdown-toggle {
203 -webkit-border-top-right-radius: 0;
204 -moz-border-radius-topright: 0;
205 border-top-right-radius: 0;
206 -webkit-border-bottom-right-radius: 0;
207 -moz-border-radius-bottomright: 0;
208 border-bottom-right-radius: 0;
211 .btn-group .dropdown-toggle,
212 .btn-group.open .dropdown-toggle,
213 .btn.open .dropdown-toggle {
218 .btn-warning .caret {
220 border-top-color: @white;
224 .buttonBackgroundCustom(#AD1D28);
228 .buttonBackgroundCustom(@orange);
232 .buttonBackgroundCustom(darken(@yellow, 3%));
236 .buttonBackgroundCustom(@green);
240 .buttonBackgroundCustom(@purple);
244 .buttonBackgroundCustom(#27666D);
248 padding: 13px 16px 12px;
251 [class^="icon-"], [class*=" icon-"] {
256 .btn-small [class^="icon-"] {
260 .add-on [class^="icon-"] {
265 // -----------------------------------------------------
268 background-color: lighten(#147E88, 10%);
271 .table th, .table td,
272 .table tbody + tbody {
273 border-top: 0px solid transparent;
278 border: 1px solid lighten(#147E88, 12%);
281 border-top: 1px solid lighten(#147E88, 12%);
288 border-left: 1px solid lighten(#147E88, 12%);
295 tr:nth-child(odd) td,
296 tr:nth-child(odd) th {
297 background-color: lighten(#147E88, 15%);
305 background-color: rgba(256, 256, 256, 0.4);
311 // -----------------------------------------------------
313 legend, label, .help-block, .input-file {
315 border: 0px solid transparent;
318 input, textarea, select, .uneditable-input {
319 border: 0px solid transparent;
327 input, textarea, .search-query, .uneditable-input,
328 .input-append input, .input-append .uneditable-input,
329 .input-prepend input, .input-prepend .uneditable-input {
330 border-color: transparent;
336 background-color: transparent;
337 border-top: 0px solid transparent;
340 .control-group.warning > label,
341 .control-group.warning .help-inline {
342 color: lighten(@orange, 30%);
345 .control-group.error > label,
346 .control-group.error .help-inline {
347 color: lighten(@linkColor, 10%);
350 .control-group.success > label,
351 .control-group.success .help-inline {
352 color: lighten(@green, 20%);
355 .input-prepend .add-on, .input-append .add-on {
359 border-color: transparent;
361 background-color: @grayLighter;
365 // -----------------------------------------------------
367 .breadcrumb, .pager > li > a {
368 border-color: transparent;
375 background-color: #3CB9C6;
376 background-image: none;
388 background-color: #3CB9C6;
391 background-color: #8AD5DC;
398 background-color: #3CB9C6;
399 background-image: none;
403 border: 0px solid transparent;
406 .disabled a, .disabled a:hover {
411 background-color: rgba(256, 256, 256, 0.4);
415 .active a, .active a:hover {
416 background-color: rgba(256, 256, 256, 0.4);
428 .nav-tabs .dropdown.open > .dropdown-toggle,
429 .nav-pills .dropdown.open > .dropdown-toggle {
430 background-color: #8AD5DC;
432 border-color: transparent;
435 .nav-tabs, .nav-pills {
436 border-color: transparent;
439 border-color: transparent;
447 li:active > a:hover {
455 li:active > a:hover {
456 background-color: #8AD5DC;
457 border-color: transparent;
462 .nav-tabs, .nav-tabs > li > a {
463 border-bottom: 1px solid rgba(256, 256, 256, 0.5);
467 background-color: #3CB9C6;
470 .nav-tabs.nav-stacked {
482 li:active > a:hover {
483 border-color: transparent;
501 li:active > a:hover {
502 background-color: #8AD5DC;
510 // -----------------------------------------------------
512 .alert, .label, .progress, .well, pre, code {
513 border-color: transparent;
520 background-color: rgba(256, 256, 256, 0.3);
525 background-color: #3CB9C6;
526 background-image: none;
529 .label, .label:hover {
530 background-color: @grayLighter;
535 .label-warning, .label-warning:hover, .alert {
536 background-color: @orange;
540 .label-important, .label-important:hover, .alert-error {
541 background-color: darken(@yellow, 3%);
545 .label-success, .label-success:hover, .alert-success {
546 background-color: @green;
550 .label-info, .label-info:hover, .alert-info {
551 background-color: @purple;
560 background-image: none;
561 background-color: #27666D;
565 background-image: none;
566 background-color: @orange;
570 .progress-danger .bar {
571 background-image: none;
572 background-color: #AD1D28;
574 .progress-danger.progress-striped .bar {
575 #gradient > .striped(#AD1D28);
578 .progress-success .bar {
579 background-image: none;
580 background-color: @green;
582 .progress-success.progress-striped .bar {
583 #gradient > .striped(@green);
586 .progress-info .bar {
587 background-image: none;
588 background-color: @blue;
590 .progress-info.progress-striped .bar {
591 #gradient > .striped(@blue);
595 border: 0px solid transparent;
602 border-left-color: lighten(#147E88, 12%);
605 border-right-color: lighten(#147E88, 12%);
609 color: rgba(256, 256, 256, 0.6);