console.less: removed unused declarations

/*
 * Original console.less file courtesy of liveoak project, licensed under EPL v1.0
 * https://github.com/liveoak-io/liveoak/blob/c33e5b2d32c1e63da85c4cce76c18c71cbb00cc5/console/src/main/resources/app/less/console.less
 */

@exo:               "Exo 2", sans-serif;
@fsize:             12px;
@fsizebig:          13px;

@inc:               30;
/* Main navigation colors */
@c_navlight:        #ebebeb;
@c_nav:             #DEDCDC;
@c_navdark:         #DEDCDC - 100;

/* Side navigation colors */
@c_snavslight:      #464646;
@c_snavlight:       #404040;
@c_snav:            #343434;
@c_snavdark:        @c_snav - @inc;
@c_snavboder:       #525252;
@c_snavfont:        #aaaaaa;

@c_mainpane:        #f5f5f5;

/* Basic color palette */
@c_white:           #fff;

@c_graylight:       #848484;
@c_gray:            #484848;

/* these colors are originally green in liveoak console,
   for a sake of compatibility, I leave out original names */
@c_green:           #00A9EC;
@c_greenxlight: 		lighten(@c_green, 50%);
@c_greenlight:			lighten(@c_green, 35%);
@c_greenmedium:     darken(@c_green, 10%);
@c_greendark:       @c_green - @inc;

@c_red:             #cb0000;

/* Border colors */
@c_border:          #cacaca;

/*
***********************************
          Basic elements
***********************************
*/

body {
    line-height: 1.909em;
    font-family: @exo;
    color: @c_gray;
    background-color: @c_mainpane;
    font-size: 12px;
    line-height: 1.5em;
}

/* Code to fix the backgrounds */
html, body {
    height: 100%;
}

#lo-content-row {
    min-height: calc(~"100% - 79px");
}

#lo-content-row {
    overflow: hidden;

    > div {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

/* Basic elements */
h1, h2, h3, h4, h5, h6 {
    font-family: @exo;
    line-height: 1.3em;
    font-weight: 500;

    span {
        color: @c_graylight;
    }
}

h3, .h3 {
    font-size: 18px;
}

a {
    color: @c_green;

    &:hover, &:focus {
        color: @c_greendark;
    }

    &:focus {
        outline: 0 none;
    }
}

p {
    color: @c_gray;
    margin: 0;
    line-height: 1.4em;
    font-weight: 300;
    font-size: @fsizebig;
}

i {
    font-size: 16px;
}

.clickable {
    cursor: pointer;
}

hr {
    border-color: #ddd;
    margin-top: 15px;
    margin-bottom: 19px;
    clear: both;
}

/* Hide spinner for type="number" inputs */
input[type=number].no-spinner::-webkit-inner-spin-button,
input[type=number].no-spinner::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/*
***********************************
    LiveOak specific elements
***********************************
*/

/* Information from the top of the main content pane */
.lo-page-info {
    margin-bottom: 20px;

    p {
        color: @c_gray;
        display: inline-block;
        margin-top: 5px;
    }
}

/* Top Menu */

.navbar-pf {
    background-color: @c_green;
    border: none;

    .navbar-header {
        border: none;
    }

    .navbar-utility {

        li.dropdown > .dropdown-toggle {
            padding-left: 10px;
        }

        a.lo-user {
            border: none;
            color: @c_white !important;
            font-size: @fsizebig;
            font-size: 13px;

            &:hover {
                background-color: @c_greenmedium;
            }
        }
    }

    .navbar-primary {
        background-color: @c_navlight;
        background-image: none;
        margin-bottom: 0;
        border: solid @c_border;
        border-width: 1px 0;

        > li.dropdown.context {
            padding: 0;
            margin-top: 1px;

            a, a:hover {
                border: none;
                background-color: @c_nav;
                background-image: none;
                color: @c_navdark;
                text-align: center;

                &:hover {
                    background-color: #d6d4d4;
                }
            }
        }
    }

    .navbar-brand {
        margin: 0;
        padding: 0 30px;

        h1 {
            font-size: 20px;
            margin: 0;
            line-height: 36px;
            color: @c_white;

            &:hover {
                text-decoration: underline;
            }
        }
    }
}

/* Side menu (1st column) */
.lo-sidebar {
    background-color: @c_snav;
    padding: 0;

    .dropdown {
        margin-top: 10px;

        .dropdown-toggle {
            display: block;
            font-size: 13px;
            line-height: 1em;
            font-weight: bold;
            padding: 10px 10px 12px 20px;
            color: @c_snavfont;
            background-color: @c_snavlight;
            border-color: @c_snavboder;
            border-style: solid;
            border-top-width: 1px;
            border-bottom-width: 1px;
            text-align: center;

            &:hover, &:focus, &:active {
                background-color: @c_snavslight;
                text-decoration: none;
            }

            .caret {
                float: right;
                margin-top: 3px;
                margin-left: 15px;
            }
        }

        .dropdown-menu {
            margin-top: 1px;
            width: 100%;
            text-align: center;
        }
    }

    .navbar-vertical {
        border: none;

        li {
            text-align: center;
            margin-top: 36px;

            &:first-child {
                margin-top: 32px;
            }

            a {
                font-size: 14px;
                color: @c_white;
                font-weight: bold;
                opacity: 0.5;

                &:hover, &:focus {
                    text-decoration: none;
                    opacity: 1;
                }

                .fa {
                    display: block;
                    color: inherit;
                    opacity: 1;
                    -webkit-opacity: inherit;
                }
            }

            &.active {
                background: url(../img/sidebar-active.svg) no-repeat right 22px;

                a {
                    opacity: 1;
                    background-color: transparent;
                    border: none;

                    &:after {
                        display: none;
                    }
                }
            }
        }
    }
}

/* The main area (2rd column) */
.lo-main-pane {
    padding: 0;

    .lo-content-area {
        padding: 0 30px 30px;
        background-color: @c_mainpane;
    }

    .lo-content-area {

        > h2 {
            margin-bottom: 15px;
        }
    }
}

/* Panel */
.panel {

    .panel-heading, .panel-body {
        padding : 1em;
    }

    .panel-heading {
        background: #fff;
        border: none;
        padding: 12px 20px 8px 20px;

        .panel-title {
            display: inline-block;
            color: @c_gray;
            font-size: 21px;
            font-weight: 500;

            a {
                color: @c_green;
            }
        }

        .edit {
            margin-left: 15px;
        }

        h3 {
            margin: 2px 0 0 0;
        }

        .pull-right span {
            margin-top: 4px;
            display: inline-block;
        }

        .dropdown,
        .pull-right > a {
            margin-top: 8px;
            visibility: hidden;

            &.open {
                visibility: visible;
            }

            .dropdown-toggle {

                > b {
                    display: none;
                }
            }

            .dropdown-menu {
                left: auto;
                right: 0;
                min-width: inherit;
            }
        }

        + .panel-body {
            padding-top: 2px;
        }
    }

    &:hover .dropdown,
    &:hover .pull-right > a {
        visibility: visible;
        display: block;
    }

    .panel-body {
        padding: 15px 20px;

        &.empty-instance {

            padding: 45px 30px;

            .fa {
                font-size: 128px;
                opacity: 0.2;
            }

            p {
                color: @c_gray;
                font-size: 20px;
                margin-bottom: 25px;
                margin-top: 5px;
            }

            .btn-lg {
                font-size: 14px;
                padding: 6px 12px;
            }
        }

        .lo-app-opts {
            margin-bottom: 0;

            li {
                display: inline-block;
                margin-right: 40px;
                font-size: 13px;
                margin-bottom: 5px;

                a, a:hover {
                    color: @c_gray;
                }

                i {
                    margin-right: 6px;
                }
            }
        }
    }

    legend {
        padding-top: 0;
        border-top: none;
    }

    .form-actions {
        margin-bottom: 5px;
    }
}

/*
***********************************
   Restyling basic PFly elements
***********************************
*/

/* Button group in dashboard panel header */
.lo-dashboard .btn-group {
    .btn {
        font-size: 12px;
        padding: 6px 15px 6px;
        line-height: 12px;
        box-shadow: none;
    }

    .btn-primary {
        background-color: @c_green;
        border-color: #619e6e;
        color: @c_white;
    }

    .btn-default {
        background-color: @c_white;
        background-image: none;
        border-color: #ddd;
        color: #777;
        font-weight: normal;
    }

    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default.active,
    .open .dropdown-toggle.btn-default {
        background-color: #f3f3f3;
        border-color: #ccc;
        color: #555;
    }

    .btn-default:active,
    .btn-default.active {
        font-weight: bold;
        background-image: none;
        box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) inset;
        border-color: #ccc;
    }

    .btn-default:active {
        font-weight: normal;
    }
}

/* Buttons */
.btn {
    margin-left: .5em;
}

.btn-primary
{
    background-color: @c_green;
    border-color: @c_greendark;
    background-image: linear-gradient(to bottom, @c_green 0%, @c_green 100%);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open
.dropdown-toggle.btn-primary
{
    background-color: @c_greenmedium;
    border-color: @c_greendark ;
    background-image: none;
}

/* Breadcrumb */
.breadcrumb {
    margin: 10px 0 0 0;
    font-size: @fsize;
    padding-bottom: 0;

    a {
        font-size: @fsize;
    }
}

/* Dropdown */
.dropdown-menu {
    padding: 5px 0 4px;

    li > a {
        font-size: @fsize;
    }

    li + li {margin-top: 1px;}

    li.separator {
        border-top: 1px solid #E5E5E5;
        margin-top: 4px;
        padding-top: 4px;
    }

    li > a:hover {
        background-color: @c_greenxlight;
        border-color: @c_greenlight;
    }

    > li > a:focus,
    > li > a:active {
        background-color: @c_green;
        border-color: @c_greendark;
    }

    > li.active {
        > a,> a:hover {
            background-color: @c_green !important; /* Fix in patternfly */
            color: #FFFFFF;
            border-color: @c_greendark !important; /* Fix in patternfly */
        }
    }
}

/* Forms */
.form-control {

    font-size: 12px;

    &:focus, &:hover {
        border-color: @c_green;
    }

    &:focus {
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 73, 0.6);
    }
}

/* Grid */
.row {
    margin-left: 0;
    margin-right: 0;
}

/* Fix for user icon in main nav */
.navbar-pf .navbar-utility {
    li.dropdown > .dropdown-toggle .pficon-user {
        position: static;
    }
    > .open > a:focus,
    > .open > a{
        background: @c_greenmedium;
    }
}

/* Notifications/Alerts */

.alert {
    line-height: 1.5em;
    padding: 9px 10px 9px 34px;
}

.feedback-aligner {
    position: fixed;
    top: 1.5em;
    text-align: center;
    width: 100%;
    height: 0;
    z-index: 1060;

    .alert {
        width: 500px;
        margin: 0 auto;
    }
}

.help-block {
    margin-bottom: 0;
}

/* Modal */

.modal-content {
    position: relative;

    .modal-body {
        padding: 0;
        margin: 20px;

        p {
            font-size: 12px;
            display: block;
            line-height: 1.2em;
            margin-bottom: 8px;

            &:last-child {
                margin-bottom: 0;
            }

            &.primary-message {
                font-weight: bold;
            }
        }

        .form-group:last-child {
            margin-bottom: 0;
        }

        fieldset {
            margin-bottom: 0;
        }

        legend {
            border-top: none;
            padding-top: 0;
        }

        label {
            text-align: right;
            font-weight: normal;
        }

        .bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]) {
            /*    	width: 100%;*/
        }

        + .modal-footer {
            margin-top: 0;
        }
    }

    .steps {
        position: absolute;
        bottom: 22px;
        margin-left: 20px;
        color: @c_graylight;
    }
}

/* Media queries */

@media only screen and (min-width: 1201px) {

    .app-dashboard .lo-info-pane {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media only screen and (max-width: 1200px) {

    .app-dashboard .lo-info-pane {

        padding: 0 35px;

        h3 {
            margin: 20px 10px 15px;
        }

        .details section {
            float: left;
            width: 33%;
            margin-bottom: 20px;
            padding: 0 10px;
        }
    }
}

@media only screen and (min-width: 992px) {

    #lo-content-row > aside {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.5em;
    }

    .lo-info-pane {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media only screen and (min-width: 768px) {

    .navbar-pf {

        .navbar-utility {
            padding-right: 20px;

            a.lo-user {
                line-height: 22px;
            }
        }

        .navbar-primary {
            min-height: 40px;
        }
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.45em;

        &.highlight {
            font-size: 0.9em;
        }
    }
}

@media only screen and (min-width: 641px) and (max-width: 767px) {

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.4em;
        padding: 0 10px;

        &.highlight {
            font-size: 0.8em;
        }
    }
}

@media only screen and (min-width: 641px) {

    .lo-main-pane.app-dashboard .panel .panel-heading .btn-group {
        float: right;
    }
}

@media only screen and (max-width: 991px) {

    .lo-sidebar .navbar-vertical {

        margin-bottom: 0;

        ul {
            display: table;
            width: 100%;
            margin-bottom: 0;
        }

        li {
            display: table-cell;
            width: 25%;
            margin: 0;
            padding-bottom: 13px;
            padding-top: 8px;

            &.active {
                background-image: url(../css/img/sidebar-active-horizontal.svg);
                background-position: center bottom;
            }
        }
    }

    .lo-info-pane {

        padding: 0 40px;

        h3 {
            margin-top: 20px;
            margin-bottom: 15px;
        }
    }

    .next-steps .lo-tutorials {
        clear: both;
    }
}

@media only screen and (max-width: 767px) {

    .navbar-pf .navbar-utility {
        border-bottom: none;
        min-height: 0;

        .dropdown {
            text-align: right;
        }
    }

    .navbar-pf .navbar-nav .active .navbar-persistent,
    .navbar-pf .navbar-nav .active .dropdown-menu,
    .navbar-pf .navbar-nav .open .dropdown-menu {
        background-color: @c_white !important;
        padding: 5px 0 4px;
    }

    .navbar-pf .navbar-nav .active .navbar-persistent > li > a,
    .navbar-pf .navbar-nav .active .dropdown-menu > li > a,
    .navbar-pf .navbar-nav .open .dropdown-menu > li > a {
        color: @c_gray;
        padding-right: 20px;
        border-width: 1px 0;
        border-style: solid;
        border-color: transparent;

        &:hover {
            background-color: @c_greenxlight;
            border-color: @c_greenlight;
            color: @c_gray;
        }
    }

    .navbar-pf .navbar-primary {
        border-color: #ddd;
        min-height: auto;

        > li.dropdown.context {
            border: none;
            margin: 0;

            a {
                font-size: 13px;
                font-weight: 600;
                padding-top: 12px;
                padding-bottom: 12px;
            }
        }
    }

    .lo-form-horizontal .form-group > div, form .form-group > div {
        padding-left: 0;
        padding-right: 0;
    }

    .bootstrap-select {
        width: 100%;
    }

    .form-inline-info {
        padding-left: 0;
        padding-right: 0;
    }

    .lo-form-horizontal .control-label > span,
    form .control-label > span {
        right: 10px;
    }

    .lo-form-horizontal .form-group.multiple > div + div,
    form .form-group.multiple > div + div {
        margin-left: 0;
        padding-left: 0;
    }
}

@media only screen and (max-width: 640px) {

    .nav-tabs > li:first-child {
        margin-left: 15px;
    }

    .lo-sidebar {

        .dropdown {
            margin-top: 8px;

            .dropdown-toggle {
                padding-top: 8px;
                padding-bottom: 10px;
            }
        }

        .navbar-vertical li {

            padding-bottom: 10px;

            a {
                font-size: 13px;

                .fa {
                    font-size: 2.5em;
                }
            }
        }
    }

    .app-dashboard .lo-info-pane {
        padding: 0 20px;
    }

    .lo-main-pane .lo-content-area {
        padding: 0 15px 30px;
    }

    .panel.lo-dashboard .panel-heading .panel-title {
        display: block;
    }

    .lo-main-pane.app-dashboard .panel .panel-heading .btn-group {
        margin-top: 10px;
    }

    .panel.lo-dashboard .panel-body .lo-measure-box {
        width: 100%;
    }

    .app-dashboard .lo-info-pane .details section {
        width: 50%;
    }

    .lo-page-info p {
        display: block;
        margin-bottom: 10px;
    }

    .lo-main-pane .lo-content-area > h2.pull-left {
        float: none !important;

        + p.subtitle {
            margin-top: -10px;
            margin-bottom: 10px;
        }
    }

    .feedback-aligner .alert {
        min-width: 0;
        width: calc(~"100% - 30px");
    }

    .next-steps .columns {

        .col-xs-6 {
            width: 100%;
        }

        .panel-body .content-area {
            min-height: 0;
        }
    }

    .advanced-search {
        margin-bottom: 10px;

        + .pull-right {
            margin-bottom: 5px;
        }
    }

    .search-comp input {
        width: 150px;
    }

    .storage-collections .lo-page-info .pull-left {
        margin-bottom: 10px;
    }
}

/*
 * Original console.less file courtesy of liveoak project, licensed under EPL v1.0
 * https://github.com/liveoak-io/liveoak/blob/c33e5b2d32c1e63da85c4cce76c18c71cbb00cc5/console/src/main/resources/app/less/console.less
 */

@exo:               "Exo 2", sans-serif;
@fsize:             12px;
@fsizebig:          13px;

@inc:               30;
/* Main navigation colors */
@c_navlight:        #ebebeb;
@c_nav:             #DEDCDC;
@c_navdark:         #DEDCDC - 100;

/* Side navigation colors */
@c_snavslight:      #464646;
@c_snavlight:       #404040;
@c_snav:            #343434;
@c_snavdark:        @c_snav - @inc;
@c_snavboder:       #525252;
@c_snavfont:        #aaaaaa;

@c_mainpane:        #f5f5f5;

/* Basic color palette */
@c_white:           #fff;

@c_graylight:       #848484;
@c_gray:            #484848;

/* these colors are originally green in liveoak console,
   for a sake of compatibility, I leave out original names */
@c_green:           #00A9EC;
@c_greenxlight: 		lighten(@c_green, 50%);
@c_greenlight:			lighten(@c_green, 35%);
@c_greenmedium:     darken(@c_green, 10%);
@c_greendark:       @c_green - @inc;

@c_red:             #cb0000;

/* Border colors */
@c_border:          #cacaca;

/*
***********************************
          Basic elements
***********************************
*/

body {
    line-height: 1.909em;
    font-family: @exo;
    color: @c_gray;
    background-color: @c_mainpane;
    font-size: 12px;
    line-height: 1.5em;
}

/* Code to fix the backgrounds */
html, body {
    height: 100%;
}

#lo-content-row {
    min-height: calc(~"100% - 79px");
}

#lo-content-row {
    overflow: hidden;

    > div {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

/* Basic elements */
h1, h2, h3, h4, h5, h6 {
    font-family: @exo;
    line-height: 1.3em;
    font-weight: 500;

    span {
        color: @c_graylight;
    }
}

h3, .h3 {
    font-size: 18px;
}

a {
    color: @c_green;

    &:hover, &:focus {
        color: @c_greendark;
    }

    &:focus {
        outline: 0 none;
    }
}

p {
    color: @c_gray;
    margin: 0;
    line-height: 1.4em;
    font-weight: 300;
    font-size: @fsizebig;
}

i {
    font-size: 16px;
}

.clickable {
    cursor: pointer;
}

.opacity-20 {
    opacity: 0.2;
}

.green-circle {
    border-radius: 50%;
    width: 7px;
    height: 7px;
    background-color: @c_green;
    display: inline-block;
    margin-right: 2px;
}

hr {
    border-color: #ddd;
    margin-top: 15px;
    margin-bottom: 19px;
    clear: both;
}

/* Apply to make color slightly lighter */
.lo-emph {
    color: @c_graylight;
}

.lo-label {
    color: @c_graylight;
}

/* Hide spinner for type="number" inputs */
input[type=number].no-spinner::-webkit-inner-spin-button,
input[type=number].no-spinner::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/*
***********************************
    LiveOak specific elements
***********************************
*/

/* Information from the top of the main content pane */
.lo-page-info {
    margin-bottom: 20px;

    p {
        color: @c_gray;
        display: inline-block;
        margin-top: 5px;
    }
}

/* Top Menu */

.navbar-pf {
    background-color: @c_green;
    border: none;

    .navbar-header {
        border: none;
    }

    .navbar-utility {

        li.dropdown > .dropdown-toggle {
            padding-left: 10px;
        }

        a.lo-user {
            border: none;
            color: @c_white !important;
            font-size: @fsizebig;
            font-size: 13px;

            &:hover {
                background-color: @c_greenmedium;
            }
        }
    }

    .navbar-primary {
        background-color: @c_navlight;
        background-image: none;
        margin-bottom: 0;
        border: solid @c_border;
        border-width: 1px 0;

        > li.dropdown.context {
            padding: 0;
            margin-top: 1px;

            a, a:hover {
                border: none;
                background-color: @c_nav;
                background-image: none;
                color: @c_navdark;
                text-align: center;

                &:hover {
                    background-color: #d6d4d4;
                }
            }
        }
    }

    .navbar-brand {
        margin: 0;
        padding: 0 30px;

        h1 {
            font-size: 20px;
            margin: 0;
            line-height: 36px;
            color: @c_white;

            &:hover {
                text-decoration: underline;
            }
        }
    }
}

/* Side menu (1st column) */
.lo-sidebar {
    background-color: @c_snav;
    padding: 0;

    .dropdown {
        margin-top: 10px;

        .dropdown-toggle {
            display: block;
            font-size: 13px;
            line-height: 1em;
            font-weight: bold;
            padding: 10px 10px 12px 20px;
            color: @c_snavfont;
            background-color: @c_snavlight;
            border-color: @c_snavboder;
            border-style: solid;
            border-top-width: 1px;
            border-bottom-width: 1px;
            text-align: center;

            &:hover, &:focus, &:active {
                background-color: @c_snavslight;
                text-decoration: none;
            }

            .caret {
                float: right;
                margin-top: 3px;
                margin-left: 15px;
            }
        }

        .dropdown-menu {
            margin-top: 1px;
            width: 100%;
            text-align: center;
        }
    }

    .navbar-vertical {
        border: none;

        li {
            text-align: center;
            margin-top: 36px;

            &:first-child {
                margin-top: 32px;
            }

            a {
                font-size: 14px;
                color: @c_white;
                font-weight: bold;
                opacity: 0.5;

                &:hover, &:focus {
                    text-decoration: none;
                    opacity: 1;
                }

                .fa {
                    display: block;
                    color: inherit;
                    opacity: 1;
                    -webkit-opacity: inherit;
                }
            }

            &.active {
                background: url(../img/sidebar-active.svg) no-repeat right 22px;

                a {
                    opacity: 1;
                    background-color: transparent;
                    border: none;

                    &:after {
                        display: none;
                    }
                }
            }
        }
    }
}

/* The main area (2rd column) */
.lo-main-pane {
    padding: 0;

    .lo-content-area {
        padding: 0 30px 30px;
        background-color: @c_mainpane;
    }

    .lo-content-area {

        > h2 {
            margin-bottom: 15px;
        }
    }
}

/* Nav menu (tabs) */

.nav-tabs > li:first-child {
    margin-left: 30px;
}

.nav-tabs-pf > li.active > a:before,
.nav-tabs-pf > li.active > a:active:before,
.nav-tabs-pf > li.active > a:focus:before,
.nav-tabs-pf > li.active > a:hover:before {
    background-color: @c_green;
}

.nav-tabs-pf > li > a {
    padding-top: 13px;
    padding-bottom: 13px;
}

.nav-tabs-pf > li.active > a,
.nav-tabs-pf > li.active > a:active,
.nav-tabs-pf > li.active > a:focus,
.nav-tabs-pf > li.active > a:hover {
    color: @c_green;
}

/* Panel */
.panel {

    .panel-heading, .panel-body {
        padding : 1em;
    }

    .panel-heading {
        background: #fff;
        border: none;
        padding: 12px 20px 8px 20px;

        .panel-title {
            display: inline-block;
            color: @c_gray;
            font-size: 21px;
            font-weight: 500;

            a {
                color: @c_green;
            }
        }

        .edit {
            margin-left: 15px;
        }

        h3 {
            margin: 2px 0 0 0;
        }

        .pull-right span {
            margin-top: 4px;
            display: inline-block;
        }

        .dropdown,
        .pull-right > a {
            margin-top: 8px;
            visibility: hidden;

            &.open {
                visibility: visible;
            }

            .dropdown-toggle {

                > b {
                    display: none;
                }
            }

            .dropdown-menu {
                left: auto;
                right: 0;
                min-width: inherit;
            }
        }

        + .panel-body {
            padding-top: 2px;
        }
    }

    &:hover .dropdown,
    &:hover .pull-right > a {
        visibility: visible;
        display: block;
    }

    .panel-body {
        padding: 15px 20px;

        &.empty-instance {

            padding: 45px 30px;

            .fa {
                font-size: 128px;
                opacity: 0.2;
            }

            p {
                color: @c_gray;
                font-size: 20px;
                margin-bottom: 25px;
                margin-top: 5px;
            }

            .btn-lg {
                font-size: 14px;
                padding: 6px 12px;
            }
        }

        .lo-app-opts {
            margin-bottom: 0;

            li {
                display: inline-block;
                margin-right: 40px;
                font-size: 13px;
                margin-bottom: 5px;

                a, a:hover {
                    color: @c_gray;
                }

                i {
                    margin-right: 6px;
                }
            }
        }
    }

    legend {
        padding-top: 0;
        border-top: none;
    }

    .form-actions {
        margin-bottom: 5px;
    }
}

/* Panel Dashboard */
.panel.lo-dashboard .panel-body {
    .lo-measure-box {
        width: 33.333333%;
        font-size: 0.6em;
        margin-top: 30px;
        display: table;

        > i {
            padding-right: 0.2734375em;
            display: table-cell;
            font-size: 10.54545454545455em;
            text-align: right;
            vertical-align: middle;
        }

        > div {
            text-align: left;

            em {
                font-size: 11.63636363636364em;
                font-weight: 300;
                line-height: 0.6em;
                margin-bottom: -0.078125em;
            }

            .measure {
                font-size: 2.5em;
                line-height: 0.5em;
            }

            .text {
                font-size: 13px;
                color: @c_graylight;
                padding-left: 3px;
                display: block;
                padding-top: 0.5em;
            }
        }

        &.api {
            color: #69a8cd;
        }

        &.users {
            color: #e9b356;

            i {
                font-size: 9.84848484848485em;
            }
        }

        &.push {
            color: #e39090;

            i {
                padding-right: 0.24691358024691em;
                padding-left: 0.24691358024691em;
            }
        }

        &.storage {
            color: #6ab1ad;

            i {
                padding-right: 0.23188405797101em;
            }
        }

        &.highlight {
            width: 100%;
            margin-top: 0;
            font-size: 1em;
            float: none;

            .text {
                font-size: 16px;
                padding-left: 5px;
            }
        }
    }
}

/* The info area (3rd column) */
.lo-info-pane {
    font-size: @fsize;
    background-color: rgba(255,255,255,0.75);
    padding-top: 0;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 1.3em;

    a {
        font-size: @fsize;
    }

    h3 {
        margin-top: 30px;
        margin-bottom: 22px;
    }

    h4 {
        color: @c_green;
        font-weight: 600;
    }

    section  {
        margin-bottom: 2.5em;

        > div {
            margin-bottom: 12px;
            font-size: @fsize;

            .lo-label {
                font-weight: normal;
                padding: 0;
                display: block;
                text-align: left;
            }

            .lo-field {
                display: inline-block;
                margin-top: 4px;
            }

            .field + button {
                padding-left: 5px;
            }

            .circle {
                border-radius: 50%;
                width: 7px;
                height: 7px;
                background-color: @c_green;
                display: inline-block;
            }

            > a {
                display: inline-block;
                margin-top: 6px;
            }

            ul {
                margin-top: 2px;
                margin-bottom: 0;
            }
        }
    }

    ul {
        margin-bottom: 20px;

        li {

            margin-bottom: 5px;

            .translucid {
                opacity: 0.5;
            }

            .fa + a {
                margin-left: 5px;
            }

            .btn-icon {
                margin-left: 10px;
                line-height: 14px;
                visibility: hidden;
            }

            &:hover .btn-icon {
                visibility: visible;
            }
        }
    }
}

.lo-tutorials {

    i {
        float: left;
        color: @c_graylight;
    }

    p, a {
        display:block;
        font-size: @fsizebig;
        padding-left: 48px;
    }

    p {
        color: @c_gray;
        margin-bottom: 2px;
    }

    a {
        font-size: @fsize;
    }
}

.lo-info-pane .lo-tutorials p {
    margin-bottom: 7px;
}

.lo-main-pane.app-dashboard .lo-tutorials {
    padding: 0 15px;
    margin-top: 25px;
}

/* Bevel-less button with an icon */

button.lo-icon-button {
    padding: 0;
    background-image: 0;
    border: none;
    background-color: transparent;
    line-height: 1em;

    span {
        text-indent: -999999px;
        display: inline-block;
    }

    i {
        color: @c_green;
    }

    &:hover i {
        color: @c_greendark;
    }

    &:active i {
        color: @c_gray;
        text-shadow: 0 0 10px rgba(0,0,0,0.3);
    }
}

/* LO form specific */

p.subtitle {
    float: right;
    font-size: @fsize;
    color: @c_graylight;
}

h2.pull-left + p.subtitle {
    margin-top: 30px;
}

.required {
    color: @c_red;
}

p.form-info {
    margin-bottom: 23px;
}

.lo-form-horizontal, form {
    clear: both;

    fieldset {
        margin-bottom: 24px;
    }

    .control-label {
        text-align: right;
        color: @c_gray;
        font-weight: 400;
        position: relative;
        padding-left: 0;
        font-size: 12px;
        line-height: 1.3em;
        padding-top: 5px;

        > span {
            position: absolute;
            right: 5px;
            top: 3px;
        }
    }

    .form-group {

        &:last-child {
            margin-bottom: 0;
        }

        > div {
            padding-left: 0.5em;
        }

        table {
            margin-bottom: 0;
        }

        .bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]) {
            width: 100%;
        }

        &.multiple {
            > div + div {
                clear: both;
                margin-left: 16.666666666666664%;
                padding-left: 0.5em;
            }

            > div {
                margin-bottom: 5px;

                &:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}

.radio-inline, .checkbox-inline {
    padding-left: 0;
}

.form-inline-info {
    margin-top: 5px;
    margin-bottom: 0;
    padding-left: 5px;

    .alert {
        margin-bottom: 0;
        z-index: 1051;
    }
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a i.check-mark {
    font-family: 'FontAwesome';
    margin-top: 5px;

    &:before {
        content: "";
    }
}

.bootstrap-select.btn-group .btn .filter-option {
    font-size: 12px;
}

.bootstrap-select.btn-group,
.bootstrap-select.btn-group[class*="span"] {
    margin-bottom: 0;
}

.col-sm-9.bootstrap-select.btn-group > .dropdown-menu {
    min-width: calc(~"100% - 25px");
    margin-left: .5em;
}

.form-actions {
    margin-top: 10px;
}

/* Instances */

.lo-instances {

    label {
        text-indent: -99999px;
        background: @c_white;
        background-position: center top;
        background-repeat: no-repeat;
        border: 1px solid @c_mainpane - 30;
        width: 160px;
        height: 105px;
        border-radius: 6px;
        margin: 0 15px 15px 0;

        &:hover {
            border-width: 1px;
            border-color: @c_green;
        }

        &.active{
            border-width: 3px;
            border-color: @c_green;
            background-position: center -107px;
        }

        &.custom {
            text-indent: -8px;
            text-align: center;
            font-size: 15px;
            font-weight: 600;
            padding-top: 42px;
            line-height: 1.2em;

            &.active {
                padding-top: 40px;
            }

            input {
                visibility: hidden;
                margin-left: -5px;
            }
        }
    }

    .checkbox-inline + .checkbox-inline {
        margin-left: 0;
    }

    span {
        display: inline-block;

        .btn-icon {
            margin: 0 0 15px 0;
        }
    }

    .html5 {
        background-image: url("img/pf/html5.png");
    }

    .android {
        background-image: url("img/pf/android.png");
    }

    .ios {
        background-image: url("img/pf/ios.png");
    }
}

.form-group .lo-instances {
    margin-bottom: -15px;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a i.check-mark {
    font-family: 'FontAwesome';
    margin-top: 5px;

    &:before {
        content: "";
    }
}

/* Collapsible forms */

legend {
    border-width: 1px 0 0 0;
    border-color: @c_border;
    border-style: solid;
    font-size: 14px;
    font-weight: 600;
    padding-top: 19px;
    color: @c_gray;
    line-height: 1em;

    span {
        font-weight: 600;
        color: @c_gray;
        cursor: pointer;
    }

    &.collapsible:before{
        content: "";
        color: @c_graylight;
        display: inline-block;
        font-family: "FontAwesome";
        font-weight: normal;
        margin-right: .5em;
    }

    &.collapsible.collapsed {
        margin-bottom: 0;

        &:before{
            content: "";
        }
    }
}

/* Selectpicker */

.select-lg .btn {
    border-radius: 1px;
    font-size: 13px;
    line-height: 1.33;
    padding: 6px 10px;
}

.btn-icon {
    color: #666;
    font-size: 16px;
    padding: 0;
    margin: 0;
    line-height: 16px;

    span {
        text-indent: -99999px;
        display: inline-block;
        width: 0;
    }

    &:hover, &:focus {
        color: @c_greendark;
        text-decoration: none;
    }
}

.tooltip-inner {
    font-size: 11.5px;
}

.search-comp {
    display: inline-block;
    position: relative;
    font-weight: normal;

    input {
        padding-right: 25px;
    }

    .btn-icon {
        font-size: 14px;
        line-height: 16px;
        padding-right: 2px;
        position: absolute;
        right: 0;
        top: 4px;  }
}

/* Table */

.table {
    font-size: 12px;

    > thead > tr > th,
    > tbody > tr > th,
    > tfoot > tr > th {
        font-family: @exo;
    }

    &-hover > tbody > tr:hover > td,
    &-hover > tbody > tr:hover > th {
        background-color: @c_greenxlight;
        border-bottom-color: @c_greenlight;
    }

    &-striped > tbody > tr:nth-child(2n+1) > td,
    &-striped > tbody > tr:nth-child(2n+1) > th {
        background-color: #fff;
    }

    th.table-actions {
        line-height: 1em;
        padding-top: 5px;
        padding-bottom: 5px;

        .search-comp {
            float: left;
            margin-right: 15px;
        }

        .advanced-search {
            display: inline-block;
        }

        .dropdown {
            display: inline-block;
        }
    }

    thead {
        th {
            &.caption{
                text-align: center;
            }

            &.row-id {
                width: 100px;
            }

            &.hasDropdown {
                .dropdown {
                    float: right;
                    line-height: 17px;
                    visibility: hidden;

                    &.open {
                        visibility: visible;
                    }
                }

                &:hover .dropdown {
                    visibility: visible;
                }

                .btn-icon i {
                    font-size: 14px;
                }
            }

            /* Data table hide/unhide buttons*/
            .btn-unhide {

                font-size: 0px;

                .lo-unhide-left, .lo-unhide-right {
                    background: url('../img/unhide.png');
                    width: 12px;
                    height: 13px;
                    display: inline-block;
                }

                .lo-unhide-left {
                    background-position: 0 13px;
                    position:relative;
                    left: 1px;
                }

                .lo-unhide-right {
                    background-position: 12px 13px;
                }

                &:hover {
                    .lo-unhide-left {
                        background-position: 0 0px;
                    }

                    .lo-unhide-right {
                        background-position: 12px 0;
                    }
                }
            }

            .btn-unhide-left, .btn-unhide-right {
                bottom: -4px;
                position: relative;
            }

            .btn-unhide-left {
                float: left;
                margin-left: -10px;
            }

            .btn-unhide-right {
                float: right;
                margin-right: -23px;
            }
        }
    }

    .lo-table-edit {
        td {
            padding: 0;

            &.row-id {
                white-space:nowrap;
                padding: 2px 6px;

                input {
                    width: 100%;
                }
            }
        }

        input {
            box-shadow: none;
            background: transparent;
            border-color: transparent;
        }

        input:focus {
            border-color: @c_green;
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 73, 0.6);
        }

        input:hover {
            border-color: @c_green;
        }
    }

    .actions {
        width: 70px;
        text-align: center;
    }

    .before-actions {
        border-right: none;
    }

    td.actions {

        .btn {
            visibility: hidden;
            margin-left: 0;

            + .btn {
                margin-left: 10px;
            }
        }

        .deleted {
            td span{
                opacity: 0.4;
                text-decoration: line-through;
            }
        }
    }

    tr:hover td.actions .btn {
        visibility: visible;
    }
}

/* Advanced search box */

.search-clear {
    padding-left: 10px;
}

.advanced-search {
    position: relative;
    line-height:20px;

    > a {
        font-size: 12px;
        font-weight: normal;
        line-height: 26px;
    }

    .lo-condition-add {
        position: relative;
        top: 15px;
    }

    .popover {
        display: block;
        width: 400px;
        max-width: 400px;
        padding: 15px;
        position: absolute;
        top: 28px;
        left: -156px;
        font-weight: normal;
        /*
        &.fade.in {
          display: block;
        }
        */

        .form-group > div {
            padding-left: 0;
        }
    }

    .inline-items {
        margin-bottom: 5px;

        .bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]) {
            width: 100px;
            margin-bottom: 4px;
        }

        .form-control {
            width: calc(~"100% - 137px");
        }
    }

    &:last-child {
        margin-bottom: 15px;
    }

    .inline {
        display: inline-block;
        margin-right: 5px;

        &:last-child {
            margin-right: 0;
        }
    }

    .btn-icon {
        margin-bottom: 5px;
        margin-left: 0;
    }
}

/*
***********************************
   Restyling basic PFly elements
***********************************
*/

/* Button group in dashboard panel header */
.lo-dashboard .btn-group {
    .btn {
        font-size: 12px;
        padding: 6px 15px 6px;
        line-height: 12px;
        box-shadow: none;
    }

    .btn-primary {
        background-color: @c_green;
        border-color: #619e6e;
        color: @c_white;
    }

    .btn-default {
        background-color: @c_white;
        background-image: none;
        border-color: #ddd;
        color: #777;
        font-weight: normal;
    }

    .btn-default:hover,
    .btn-default:focus,
    .btn-default:active,
    .btn-default.active,
    .open .dropdown-toggle.btn-default {
        background-color: #f3f3f3;
        border-color: #ccc;
        color: #555;
    }

    .btn-default:active,
    .btn-default.active {
        font-weight: bold;
        background-image: none;
        box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15) inset;
        border-color: #ccc;
    }

    .btn-default:active {
        font-weight: normal;
    }
}

/* Buttons */
.btn {
    margin-left: .5em;
}

.btn-primary
{
    background-color: @c_green;
    border-color: @c_greendark;
    background-image: linear-gradient(to bottom, @c_green 0%, @c_green 100%);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open
.dropdown-toggle.btn-primary
{
    background-color: @c_greenmedium;
    border-color: @c_greendark ;
    background-image: none;
}

/* Breadcrumb */
.breadcrumb {
    margin: 10px 0 0 0;
    font-size: @fsize;
    padding-bottom: 0;

    a {
        font-size: @fsize;
    }
}

/* Dropdown */
.dropdown-menu {
    padding: 5px 0 4px;

    li > a {
        font-size: @fsize;
    }

    li + li {margin-top: 1px;}

    li.separator {
        border-top: 1px solid #E5E5E5;
        margin-top: 4px;
        padding-top: 4px;
    }

    li > a:hover {
        background-color: @c_greenxlight;
        border-color: @c_greenlight;
    }

    > li > a:focus,
    > li > a:active {
        background-color: @c_green;
        border-color: @c_greendark;
    }

    > li.active {
        > a,> a:hover {
            background-color: @c_green !important; /* Fix in patternfly */
            color: #FFFFFF;
            border-color: @c_greendark !important; /* Fix in patternfly */
        }
    }
}

/* Forms */
.form-control {

    font-size: 12px;

    &:focus, &:hover {
        border-color: @c_green;
    }

    &:focus {
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 73, 0.6);
    }
}

/* Grid */
.row {
    margin-left: 0;
    margin-right: 0;
}

/* Fix for user icon in main nav */
.navbar-pf .navbar-utility {
    li.dropdown > .dropdown-toggle .pficon-user {
        position: static;
    }
    > .open > a:focus,
    > .open > a{
        background: @c_greenmedium;
    }
}

/* Notifications/Alerts */

.alert {
    line-height: 1.5em;
    padding: 9px 10px 9px 34px;
}

.feedback-aligner {
    position: fixed;
    top: 1.5em;
    text-align: center;
    width: 100%;
    height: 0;
    z-index: 1060;

    .alert {
        width: 500px;
        margin: 0 auto;
    }
}

.help-block {
    margin-bottom: 0;
}

/* Modal */

.modal-content {
    position: relative;

    .modal-body {
        padding: 0;
        margin: 20px;

        p {
            font-size: 12px;
            display: block;
            line-height: 1.2em;
            margin-bottom: 8px;

            &:last-child {
                margin-bottom: 0;
            }

            &.primary-message {
                font-weight: bold;
            }
        }

        .form-group:last-child {
            margin-bottom: 0;
        }

        fieldset {
            margin-bottom: 0;
        }

        legend {
            border-top: none;
            padding-top: 0;
        }

        label {
            text-align: right;
            font-weight: normal;
        }

        .bootstrap-select:not([class*="span"]):not([class*="col-"]):not([class*="form-control"]) {
            /*    	width: 100%;*/
        }

        + .modal-footer {
            margin-top: 0;
        }
    }

    .steps {
        position: absolute;
        bottom: 22px;
        margin-left: 20px;
        color: @c_graylight;
    }
}

.modal#create-application .modal-body {
    min-height: 150px;
}

/*
***********************************
          Specific Pages
***********************************
*/

/* Dashboard Page */
.lo-main-pane.app-dashboard .panel {
    margin-top: 20px;

    .panel-heading {
        padding: 10px 15px;
        border-bottom: 1px solid @c_mainpane;

        .btn-group {
            margin-top: 2px;
        }
    }

    .panel-body {
        padding: 36px 15px 32px;
    }
}

/* Edit Storage Page */

.lo-db-instances {
    /*   text-align: center; */ /* for 1 resource */
    text-align: left;
    padding-left: 0;

    [class*="lo-db-"] {
        text-indent: -9999em;
        background: @c_white;
        background-position: center top;
        background-repeat: no-repeat;
        border: 1px solid @c_mainpane - 30;
        display: inline-block;
        width: 160px;
        height: 105px;
        border-radius: 6px;
        margin: 1em;
        margin-left: 0; /* for 1 resource */
        cursor: pointer;
        margin-top: 0;
        margin-bottom: 15px;

        &:hover {
            border-width: 1px;
            border-color: @c_green;
        }

        &.active{
            border-width: 3px;
            border-color: @c_green;
            background-position: center -105px;
        }
    }

    .lo-db-mongo {
        background-image: url("img/db/mongo.png");

        &.active {
        }
    }

    .lo-db-mysql {
        background-image: url("img/db/mysql.png");
    }

    .lo-db-plsql {
        background-image: url("img/db/plsql.png");
    }

    p,a {
        font-size: 13px;
    }
}

/* Storage Collections Page */

.storage-collections {

    .lo-page-info {

        .btn-icon {
            margin-left: 12px;
        }

        span .btn-icon {
            margin-left: 5px;
        }
    }

    hr {
        float: left;
        width: 100%;
        margin-top: 0;
        margin-bottom: 20px;
    }
}

/* Next Steps Page */

.next-steps {

    .columns {
        position: relative;

        .panel {
            display: block;
            float: left;
            box-shadow: none;
            border-left: 15px solid #f5f5f5;
            border-right: 15px solid #f5f5f5;
            border-top: none;
            border-bottom: none;
            padding-left: 25px;
            padding-right: 25px;
        }

        .panel-body {
            padding: 0;

            .fa {
                font-size: 80px;
                opacity: 0.4;
                margin-top: 40px;

                + h3 {
                    margin-top: 0;
                    margin-bottom: 20px;
                }
            }

            h3 {
                font-size: 23px;
                color: @c_graylight;
            }

            .content-area {
                min-height: 54px;

                div {
                    vertical-align: middle;
                }
            }

            .lo-label, .lo-field {
                font-size: 13px;
            }

            .lo-field {
                margin-left: 5px;
            }

            a {
                font-size: 14px;
                margin-top: 20px;
                margin-bottom: 30px;
                float: right;
            }

            p {
                font-size: 16px;
            }

        }
    }

    .table {
        display: table;

        .table-row {
            display: table-row;

            .table-cell {
                display: table-cell;
                border-left: 15px solid #f5f5f5;
                border-right: 15px solid #f5f5f5;
                background-color: @c_white;
                vertical-align: middle;
                text-align: center;
                width: 33.33333333333333%;
                padding: 0 25px;
            }

            &:last-child .table-cell {
                text-align: right;
            }
        }
    }

    .table-cell {

        .fa {
            font-size: 80px;
            opacity: 0.4;
            margin-top: 40px;

            + h3 {
                margin-top: 0;
                margin-bottom: 20px;
            }
        }

        h3 {
            font-size: 23px;
            color: @c_graylight;
        }

        .lo-label, .lo-field {
            font-size: 13px;
        }

        .lo-field {
            margin-left: 5px;
        }

        a {
            font-size: 13px;
            margin-top: 20px;
            margin-bottom: 30px;
            display: inline-block;
        }

        p {
            font-size: 16px;
        }
    }

    .lo-tutorials {
        margin-left: 30px;
        margin-top: 25px;
    }
}

.lo-checkbox {
    opacity: 0.2;

    &.selected {
        opacity: 1.0;
        color: @c_green;

        &:hover {
            opacity: 1;
            color: @c_greendark;
        }
    }

    &:hover {
        opacity: 0.5;
    }
}

tr.deleted {
    td {
        span, input {
            opacity: 0.4;
            text-decoration: line-through;
        }
    }
}

/* Media queries */

@media only screen and (min-width: 1201px) {

    .app-dashboard .lo-info-pane {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media only screen and (max-width: 1200px) {

    .app-dashboard .lo-info-pane {

        padding: 0 35px;

        h3 {
            margin: 20px 10px 15px;
        }

        .details section {
            float: left;
            width: 33%;
            margin-bottom: 20px;
            padding: 0 10px;
        }
    }
}

@media only screen and (min-width: 992px) {

    #lo-content-row > aside {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.5em;
    }

    .lo-info-pane {
        margin-bottom: -99999px;
        padding-bottom: 99999px;
    }
}

@media only screen and (min-width: 768px) {

    .navbar-pf {

        .navbar-utility {
            padding-right: 20px;

            a.lo-user {
                line-height: 22px;
            }
        }

        .navbar-primary {
            min-height: 40px;
        }
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.45em;

        &.highlight {
            font-size: 0.9em;
        }
    }
}

@media only screen and (min-width: 641px) and (max-width: 767px) {

    .panel.lo-dashboard .panel-body .lo-measure-box {
        font-size: 0.4em;
        padding: 0 10px;

        &.highlight {
            font-size: 0.8em;
        }
    }
}

@media only screen and (min-width: 641px) {

    .lo-main-pane.app-dashboard .panel .panel-heading .btn-group {
        float: right;
    }
}

@media only screen and (max-width: 991px) {

    .lo-sidebar .navbar-vertical {

        margin-bottom: 0;

        ul {
            display: table;
            width: 100%;
            margin-bottom: 0;
        }

        li {
            display: table-cell;
            width: 25%;
            margin: 0;
            padding-bottom: 13px;
            padding-top: 8px;

            &.active {
                background-image: url(../css/img/sidebar-active-horizontal.svg);
                background-position: center bottom;
            }
        }
    }

    .lo-info-pane {

        padding: 0 40px;

        h3 {
            margin-top: 20px;
            margin-bottom: 15px;
        }
    }

    .next-steps .lo-tutorials {
        clear: both;
    }
}

@media only screen and (max-width: 767px) {

    .navbar-pf .navbar-utility {
        border-bottom: none;
        min-height: 0;

        .dropdown {
            text-align: right;
        }
    }

    .navbar-pf .navbar-nav .active .navbar-persistent,
    .navbar-pf .navbar-nav .active .dropdown-menu,
    .navbar-pf .navbar-nav .open .dropdown-menu {
        background-color: @c_white !important;
        padding: 5px 0 4px;
    }

    .navbar-pf .navbar-nav .active .navbar-persistent > li > a,
    .navbar-pf .navbar-nav .active .dropdown-menu > li > a,
    .navbar-pf .navbar-nav .open .dropdown-menu > li > a {
        color: @c_gray;
        padding-right: 20px;
        border-width: 1px 0;
        border-style: solid;
        border-color: transparent;

        &:hover {
            background-color: @c_greenxlight;
            border-color: @c_greenlight;
            color: @c_gray;
        }
    }

    .navbar-pf .navbar-primary {
        border-color: #ddd;
        min-height: auto;

        > li.dropdown.context {
            border: none;
            margin: 0;

            a {
                font-size: 13px;
                font-weight: 600;
                padding-top: 12px;
                padding-bottom: 12px;
            }
        }
    }

    .lo-form-horizontal .form-group > div, form .form-group > div {
        padding-left: 0;
        padding-right: 0;
    }

    .bootstrap-select {
        width: 100%;
    }

    .form-inline-info {
        padding-left: 0;
        padding-right: 0;
    }

    .lo-form-horizontal .control-label > span,
    form .control-label > span {
        right: 10px;
    }

    .lo-form-horizontal .form-group.multiple > div + div,
    form .form-group.multiple > div + div {
        margin-left: 0;
        padding-left: 0;
    }
}

@media only screen and (max-width: 640px) {

    .nav-tabs > li:first-child {
        margin-left: 15px;
    }

    .lo-sidebar {

        .dropdown {
            margin-top: 8px;

            .dropdown-toggle {
                padding-top: 8px;
                padding-bottom: 10px;
            }
        }

        .navbar-vertical li {

            padding-bottom: 10px;

            a {
                font-size: 13px;

                .fa {
                    font-size: 2.5em;
                }
            }
        }
    }

    .app-dashboard .lo-info-pane {
        padding: 0 20px;
    }

    .lo-main-pane .lo-content-area {
        padding: 0 15px 30px;
    }

    .panel.lo-dashboard .panel-heading .panel-title {
        display: block;
    }

    .lo-main-pane.app-dashboard .panel .panel-heading .btn-group {
        margin-top: 10px;
    }

    .panel.lo-dashboard .panel-body .lo-measure-box {
        width: 100%;
    }

    .app-dashboard .lo-info-pane .details section {
        width: 50%;
    }

    .lo-page-info p {
        display: block;
        margin-bottom: 10px;
    }

    .lo-main-pane .lo-content-area > h2.pull-left {
        float: none !important;

        + p.subtitle {
            margin-top: -10px;
            margin-bottom: 10px;
        }
    }

    .feedback-aligner .alert {
        min-width: 0;
        width: calc(~"100% - 30px");
    }

    .next-steps .columns {

        .col-xs-6 {
            width: 100%;
        }

        .panel-body .content-area {
            min-height: 0;
        }
    }

    .advanced-search {
        margin-bottom: 10px;

        + .pull-right {
            margin-bottom: 5px;
        }
    }

    .search-comp input {
        width: 150px;
    }

    .storage-collections .lo-page-info .pull-left {
        margin-bottom: 10px;
    }
}


css update

css update

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for 'https://github.com/BrightMahi/aacBuyerNew.git/'


Forgotten dejavu font definition

Forgotten dejavu font definition

@font-face {
  font-family: 'DejaVu Sans Mono';
  src: local('DejaVu Sans Mono'),
    url('~dejavu-fonts-ttf/ttf/DejaVuSansMono.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

error: pathspec 'src/fonts/dejavu.less' did not match any file(s) known to git


improve fg-subtle contrast

improve fg-subtle contrast

/*
* This is sortof prepared for adjustable themes.
* Everything is based of a single color taken from the syntax theme.
*/

@import "syntax-variables";

//provide defaults, users can set configs that are handled in config.less
@font-family: 'Open Sans', 'Helvetica Neue', 'Segoe UI', sans-serif;
@font-size: 12px;
@font-weight: 200;

// a modular scale maintains relations across all sizes and spaces
// http://type-scale.com
@modular-scale: 1.33;

@modular-scale-xxs:  pow(@modular-scale, -3);
@modular-scale-xs:   pow(@modular-scale, -2);
@modular-scale-s:    pow(@modular-scale, -1);
@modular-scale-m:    1;
@modular-scale-l:    pow(@modular-scale, 1);
@modular-scale-xl:   pow(@modular-scale, 2);
@modular-scale-xxl:  pow(@modular-scale, 3);
@modular-scale-xxxl: pow(@modular-scale, 4);

// leading color
@ui-theme-color: @syntax-background-color;

// tweaks, will later be provided by settings
@theme-adjust-saturation: 0%;
@theme-adjust-contrast:   0%;

// Config
@ui-hue:           hsvhue(@ui-theme-color);
@ui-saturation:    max(10% + @theme-adjust-saturation, 0%); // limit to > 0%
@ui-brightness:    24%;
@ui-contrast:      @theme-adjust-contrast * 0.12;
@ui-accent:        spin( hsl( @ui-hue, 50% + @ui-saturation, 50%), 66% );

// background
@base-bg: hsv(@ui-hue, @ui-saturation, @ui-brightness);

@level-0-bg: lighten(@base-bg, @ui-contrast + 12%);
@level-1-bg: lighten(@base-bg, @ui-contrast + 6%);
@level-2-bg:  darken(@base-bg, @ui-contrast);
@level-3-bg:  darken(@base-bg, @ui-contrast + 3%);
@level-4-bg:  darken(@base-bg, @ui-contrast + 6%);
@level-5-bg:  darken(@base-bg, @ui-contrast + 9%);

@bg-info:    hsl(208, 100%/1.33, 42%/1.33);
@bg-success: hsl(160,  70%/1.33, 42%/1.33);
@bg-warning: hsl(32,   60%/1.33, 42%/1.33);
@bg-error:   hsl(0,    70%/1.33, 42%/1.33);

// foreground
@base-fg: hsl(@ui-hue, @ui-saturation, max(30%, (@ui-brightness + @ui-contrast) * 2.5) );

@fg-subtle: fadeout(@base-fg, 36%);
@fg-faded: fade(@base-fg, 24%);
@fg-highlight: hsl(@ui-hue, @ui-saturation*8, @ui-contrast*10 + 88%);
@fg-selected: hsl(@ui-hue, @ui-saturation*8, @ui-contrast*10 + 98%);

@fg-info:    hsl(219,  79%/1.33, 66%/1.33);
@fg-success: hsl(140,  44%/1.33, 62%/1.33);
@fg-warning: hsl( 36,  60%/1.33, 72%/1.33);
@fg-error:   hsl(  9, 100%/1.33, 64%/1.33);

@fg-ignored:  @fg-subtle;
@fg-added:    @fg-success;
@fg-renamed:  @fg-info;
@fg-modified: @fg-warning;
@fg-removed:  @fg-error;

// translate to vars required for other packages
@text-color: @base-fg;
@text-color-subtle: @fg-subtle;
@text-color-faded: @fg-faded;
@text-color-highlight: @fg-highlight;
@text-color-selected: @fg-selected;
@text-color-info:    @fg-info;
@text-color-success: @fg-success;
@text-color-warning: @fg-warning;
@text-color-error:   @fg-error;

// other required vars
// may or may not be used elsewhere in this package
@app-background-color:             @level-2-bg;
@base-background-color:            @app-background-color;
@base-border-color:                @level-4-bg;

@tab-height:                       @modular-scale-xxxl * 1rem;
@tab-text-color:                   @fg-subtle;
@tab-bar-background-color:         @app-background-color;
@tab-bar-border-color:             @tab-bar-background-color;
@tab-background-color:             @level-2-bg;
@tab-background-color-active:      @ui-theme-color;
@tab-border-color:                 @tab-background-color;

@pane-item-background-color:       @level-3-bg;
@pane-item-border-color:           @level-5-bg;

@panel-heading-background-color:   @level-3-bg;
@panel-heading-border-color:       @level-5-bg;

@tool-panel-background-color:      @level-2-bg;
@tool-panel-border-color:          @level-5-bg;

@inset-panel-background-color:     @level-5-bg;
@inset-panel-border-color:         @level-5-bg;

@overlay-background-color:         @level-2-bg;
@overlay-border-color:             @level-5-bg;
@overlay-backdrop-color:           hsla( @ui-hue, @ui-saturation, 5%, .5);

@button-background-color:          @level-1-bg;
@button-background-color-hover:    @level-4-bg;
@button-background-color-selected: @level-1-bg;
@button-border-color:              @button-background-color;

@input-border-color:               @level-5-bg;
@input-background-color:           @level-0-bg;

@tooltip-background-color:         @ui-accent;
@tooltip-text-color:               contrast(@tooltip-background-color, white, hsl(0,0%,20%), 60 );
@tooltip-text-key-color:           @tooltip-background-color;
@tooltip-background-key-color:     @tooltip-text-color;

@progress-background-color:        @ui-accent;

@checkbox-background-color:        @level-1-bg;

@scrollbar-color:                  @level-1-bg;
@scrollbar-background-color:       transparent;

@tree-view-background-color:       @level-3-bg;
@tree-view-border-color:           @level-3-bg;

@ui-site-color-1: hsl(208, 100%, 50%); // green
@ui-site-color-2: hsl(160,  70%, 42%); // blue
@ui-site-color-3: hsl(32,   60%, 50%); // orange
@ui-site-color-4: #D831B0;             // pink
@ui-site-color-5: #EBDD5B;             // yellow

@component-padding:        @modular-scale-l * 1rem;
@component-padding:        @modular-scale-l * 12px;
@component-icon-padding:   @modular-scale-xs * 1rem;
@component-icon-size:      16/12 * 1rem;
@component-line-height:    @modular-scale-xxl * 1rem;
@component-border-radius:  2px;

@disclosure-arrow-size:    1rem;

// settings View
@settings-list-background-color:   @level-3-bg;
@theme-config-box-shadow:          inset 0 0 3px hsla(0, 0%, 100%, .4), 0 1px 3px hsla(0, 0%, 0%, .2);
@theme-config-box-shadow-selected: inset 0 1px 3px hsla(0, 0%, 0%, .1);
@theme-config-border-selected:     hsla(0, 0%, 100%, .75);

/*
* This is sortof prepared for adjustable themes.
* Everything is based of a single color taken from the syntax theme.
*/

@import "syntax-variables";

//provide defaults, users can set configs that are handled in config.less
@font-family: 'Open Sans', 'Helvetica Neue', 'Segoe UI', sans-serif;
@font-size: 12px;
@font-weight: 200;

// a modular scale maintains relations across all sizes and spaces
// http://type-scale.com
@modular-scale: 1.33;

@modular-scale-xxs:  pow(@modular-scale, -3);
@modular-scale-xs:   pow(@modular-scale, -2);
@modular-scale-s:    pow(@modular-scale, -1);
@modular-scale-m:    1;
@modular-scale-l:    pow(@modular-scale, 1);
@modular-scale-xl:   pow(@modular-scale, 2);
@modular-scale-xxl:  pow(@modular-scale, 3);
@modular-scale-xxxl: pow(@modular-scale, 4);

// leading color
@ui-theme-color: @syntax-background-color;

// tweaks, will later be provided by settings
@theme-adjust-saturation: 0%;
@theme-adjust-contrast:   0%;

// Config
@ui-hue:           hsvhue(@ui-theme-color);
@ui-saturation:    max(10% + @theme-adjust-saturation, 0%); // limit to > 0%
@ui-brightness:    24%;
@ui-contrast:      @theme-adjust-contrast * 0.12;
@ui-accent:        spin( hsl( @ui-hue, 50% + @ui-saturation, 50%), 66% );

// background
@base-bg: hsv(@ui-hue, @ui-saturation, @ui-brightness);

@level-0-bg: lighten(@base-bg, @ui-contrast + 12%);
@level-1-bg: lighten(@base-bg, @ui-contrast + 6%);
@level-2-bg:  darken(@base-bg, @ui-contrast);
@level-3-bg:  darken(@base-bg, @ui-contrast + 3%);
@level-4-bg:  darken(@base-bg, @ui-contrast + 6%);
@level-5-bg:  darken(@base-bg, @ui-contrast + 9%);

@bg-info:    hsl(208, 100%/1.33, 42%/1.33);
@bg-success: hsl(160,  70%/1.33, 42%/1.33);
@bg-warning: hsl(32,   60%/1.33, 42%/1.33);
@bg-error:   hsl(0,    70%/1.33, 42%/1.33);

// foreground
@base-fg: hsl(@ui-hue, @ui-saturation, max(30%, (@ui-brightness + @ui-contrast) * 2.5) );

@fg-subtle: fadeout(@base-fg, 50%);
@fg-faded: fade(@base-fg, 25%);
@fg-highlight: hsl(@ui-hue, @ui-saturation*8, @ui-contrast*10 + 88%);
@fg-selected: hsl(@ui-hue, @ui-saturation*8, @ui-contrast*10 + 98%);

@fg-info:    hsl(219,  79%/1.33, 66%/1.33);
@fg-success: hsl(140,  44%/1.33, 62%/1.33);
@fg-warning: hsl( 36,  60%/1.33, 72%/1.33);
@fg-error:   hsl(  9, 100%/1.33, 64%/1.33);

@fg-ignored:  @fg-subtle;
@fg-added:    @fg-success;
@fg-renamed:  @fg-info;
@fg-modified: @fg-warning;
@fg-removed:  @fg-error;

// translate to vars required for other packages
@text-color: @base-fg;
@text-color-subtle: @fg-subtle;
@text-color-faded: @fg-faded;
@text-color-highlight: @fg-highlight;
@text-color-selected: @fg-selected;
@text-color-info:    @fg-info;
@text-color-success: @fg-success;
@text-color-warning: @fg-warning;
@text-color-error:   @fg-error;

// other required vars
// may or may not be used elsewhere in this package
@app-background-color:             @level-2-bg;
@base-background-color:            @app-background-color;
@base-border-color:                @level-4-bg;

@tab-height:                       @modular-scale-xxxl * 1rem;
@tab-text-color:                   @fg-subtle;
@tab-bar-background-color:         @app-background-color;
@tab-bar-border-color:             @tab-bar-background-color;
@tab-background-color:             @level-2-bg;
@tab-background-color-active:      @ui-theme-color;
@tab-border-color:                 @tab-background-color;

@pane-item-background-color:       @level-3-bg;
@pane-item-border-color:           @level-5-bg;

@panel-heading-background-color:   @level-3-bg;
@panel-heading-border-color:       @level-5-bg;

@tool-panel-background-color:      @level-2-bg;
@tool-panel-border-color:          @level-5-bg;

@inset-panel-background-color:     @level-5-bg;
@inset-panel-border-color:         @level-5-bg;

@overlay-background-color:         @level-2-bg;
@overlay-border-color:             @level-5-bg;
@overlay-backdrop-color:           hsla( @ui-hue, @ui-saturation, 5%, .5);

@button-background-color:          @level-1-bg;
@button-background-color-hover:    @level-4-bg;
@button-background-color-selected: @level-1-bg;
@button-border-color:              @button-background-color;

@input-border-color:               @level-5-bg;
@input-background-color:           @level-0-bg;

@tooltip-background-color:         @ui-accent;
@tooltip-text-color:               contrast(@tooltip-background-color, white, hsl(0,0%,20%), 60 );
@tooltip-text-key-color:           @tooltip-background-color;
@tooltip-background-key-color:     @tooltip-text-color;

@progress-background-color:        @ui-accent;

@checkbox-background-color:        @level-1-bg;

@scrollbar-color:                  @level-1-bg;
@scrollbar-background-color:       transparent;

@tree-view-background-color:       @level-3-bg;
@tree-view-border-color:           @level-3-bg;

@ui-site-color-1: hsl(208, 100%, 50%); // green
@ui-site-color-2: hsl(160,  70%, 42%); // blue
@ui-site-color-3: hsl(32,   60%, 50%); // orange
@ui-site-color-4: #D831B0;             // pink
@ui-site-color-5: #EBDD5B;             // yellow

@component-padding:        @modular-scale-l * 1rem;
@component-padding:        @modular-scale-l * 12px;
@component-icon-padding:   @modular-scale-xs * 1rem;
@component-icon-size:      16/12 * 1rem;
@component-line-height:    @modular-scale-xxl * 1rem;
@component-border-radius:  2px;

@disclosure-arrow-size:    1rem;

// settings View
@settings-list-background-color:   @level-3-bg;
@theme-config-box-shadow:          inset 0 0 3px hsla(0, 0%, 100%, .4), 0 1px 3px hsla(0, 0%, 0%, .2);
@theme-config-box-shadow-selected: inset 0 1px 3px hsla(0, 0%, 0%, .1);
@theme-config-border-selected:     hsla(0, 0%, 100%, .75);


CSS fix.

CSS fix.

#bws-search {
    .section-title {
        border-top: none;
        letter-spacing: normal;
    }
    .filters {
        .border-box;
        padding: 0 20px;
        background-color: #ddd;

        .filterControl {
            display: block;
            padding: 5px 0;
            color: @bws-heading;
            font-size: 14pt;
        }
        .search-filters {
            padding: 20px 0;
            border-top: 1px dotted #bbb;

            h4 {
                .type7;
            }
            li {
                margin-bottom: 4px;
            }
            input {
                margin-right: 10px;
            }
        }
    }
}

#subapp-browser #bws-fullscreen #bws-search {
    background: @bws-background;

    .yui3-charmtoken {
        width: 50%;

        &:nth-child(odd) {
            border-left: none;
        }
        &:nth-child(even) {
            border-right: none;
        }
        .title {
            width: 215px;
        }
    }
}

#bws-search {
    .section-title {
        border-top: none;
    }
    .filters {
        .border-box;
        padding: 0 20px;
        background-color: #ddd;

        .filterControl {
            display: block;
            padding: 5px 0;
            color: @bws-heading;
            font-size: 14pt;
        }
        .search-filters {
            padding: 20px 0;
            border-top: 1px dotted #bbb;

            h4 {
                .type7;
            }
            li {
                margin-bottom: 4px;
            }
            input {
                margin-right: 10px;
            }
        }
    }
}

#subapp-browser #bws-fullscreen #bws-search {
    background: @bws-background;

    .yui3-charmtoken {
        width: 50%;

        &:nth-child(odd) {
            border-left: none;
        }
        &:nth-child(even) {
            border-right: none;
        }
        .title {
            width: 215px;
        }
    }
}