@import "elements.less";

html {
    height : 100%;
}

body {
    .background-gradient( @noise-light, #333, #333, #333 );
    height        : 100%;
    padding-left  : 0;
    padding-right : 0;
}

hr {
    border-color : #b6b3a6;
}

input, button, select, textarea {
    .proxima-regular;
}

/* structural & schema definitions */
@top-adjustment           : 8em;     /* adjust for absolute header */
@rearview-color           : #932b8d; /* #ea3e3c */
@rearview-secondary-color : darken(@rearview-color, 10%);
@noise                    : url('../img/noise.png') 0 0 repeat;
@noise-light              : url('../img/noise-light.png') 0 0 repeat;
/* font definitions */
@proxima-bold-base-url    : '../fonts/ProximaNovaSoft-Bold/ProximaNovaSoft-Bold-webfont';
@proxima-regular-base-url : '../fonts/ProximaNovaSoft-Regular/ProximaNovaSoft-Regular-webfont';

@font-face {
    font-family    : 'ProximaBold';
    src            : url('@{proxima-bold-base-url}.eot?') format('eot'),
                     url('@{proxima-bold-base-url}.woff') format('woff'),
                     url('@{proxima-bold-base-url}.ttf') format('truetype');
    font-weight    : normal;
    text-rendering : optimizelegibility;
}
@font-face {
    font-family    : 'ProximaRegular';
    src            : url('@{proxima-regular-base-url}.eot?') format('eot'),
                     url('@{proxima-regular-base-url}.woff') format('woff'),
                     url('@{proxima-regular-base-url}.ttf') format('truetype');
    font-weight    : normal;
    text-rendering : optimizelegibility;
}

/* mixin helpers */
.proxima-bold {
    font-family : 'ProximaBold',
                  'Trebuchet MS',
                  Tahoma,
                  sans-serif;

    font-weight : normal;
}
.proxima-bold ( @size ) {
    font-family : 'ProximaBold',
                  'Trebuchet MS',
                  Tahoma,
                  sans-serif;

    font-weight : normal;
    font-size   : @size;
}
.proxima-regular {
    font-family : 'ProximaRegular',
                  'Trebuchet MS',
                  Tahoma,
                  sans-serif;

    font-weight : normal;
}
.proxima-regular ( @size ) {
    font-family : 'ProximaRegular',
                  'Trebuchet MS',
                  Tahoma,
                  sans-serif;

    font-weight : normal;
    font-size   : @size;
}


.transform(@string){
    -webkit-transform : @string;
       -moz-transform : @string;
        -ms-transform : @string;
         -o-transform : @string;
            transform : @string;
}

/* application wrapper */
.ls-rearview {

    /* primary navigation styles */
    @import "primarynav.less";

    /* footer nav bar */
    .footer-action-bar .navbar-inner {
        background : #f5f4ee;
        border     : none;

        a {
            text-transform : uppercase;
        }
    }

    @import "header.less";

    input.parsley-error {
      background-color: #F2DEDE !important;
      border: 1px solid #EED3D7 !important;
      color: #B94A48 !important;
    }

    /* alert timeline styles */
    .alert-timeline {
        position   : relative;
        box-shadow : 0 31px 46px -10px #000;

        /* trapazoid technique accordian heading */
        .polygon,
        .trapezoid {
            margin     : 0;
            padding    : 0;
            background : none;
        }

        .polygon {
            border     : medium none;
            display    : inline-block;
            text-align : center;
            width      : 10em;
            color      : #F5F4EE;
        }

        .trapezoid {
            margin       : 0 auto;
            display      : inline-block;
            height       : 0;
            width        : 1px;
            border-left  : 5em solid transparent;
            border-right : 5em solid transparent;
        }

        .polygon.tab .size {
            width        : 2.3em;
            border-width : 1.3em 0.8em;
        }

        .polygon .size {
            border-bottom : none;
            border-top    : 10em solid;
        }

        /* alert timeline accordian styles */
        .accordion-group {
            margin-bottom : 0;
            border-radius : 0;
            background    : #000;
        }

        .accordion-group,
        .accordion-inner {
            border : none;
        }

        .accordion-inner {
            padding : 2px 0 0 0;
        }

        .accordion-heading {
            position : absolute;
            display  : inline-block;
            height   : 20px;
            left     : -61px;

            p {
                position    : relative;
                top         : -24px;
                color       : #444240;
                text-indent : 3px;

                .proxima-regular();
            }

            .alert-status {
                color : #735854;
            }
        }

        .accordion-heading .accordion-toggle {
            margin-top : 2px;
            padding    : 0;
            height     : 20px;
            outline    : none;

            display    : none; /* NOTE : hidden till fixed */
        }

        .accordion-heading .accordion-toggle:hover {
            color : #F5F4EE;
        }

        /* timeline overriding styles */
        div.timeline-event-content {
            color : #735854;
            /* just the monitor name, hiding it
               by making it the same color as it's background */

            .proxima-regular(82%);
        }

        div.timeline-event-content {
            margin: 0 4px;
        }

        div.timeline-event-box,
        div.timeline-event-range {
            background : #735854; /*#373737;*/
            border : 2px solid #735854 !important;
            color : #F5F4ED;
            border-radius : 2px;
        }

        div.timeline-frame {
            border     : none;
            background : #F5F4EE;
        }

        div.timeline-axis-grid-minor {
            border-color: #ccc;
        }

        div.timeline-axis-grid-major {
            border-color: #999;
        }

        div.timeline-event {
            cursor       : pointer;
            border-color : #999;
        }

        div.timeline-event-line {
            border-color: #999;
            border-left-style: solid;
            border-left-width: 1px;
        }

        div.timeline-event-dot {
            height : 6px !important;
            width  : 6px !important;
            background : #fff !important;
            border-radius : 5px;
            border-width  : 2px;
        }

        /* font styles */
        div.timeline-axis-text {
            color : #444240;

            .proxima-regular();
        }

        /* navigation button styles */
        div.timeline-navigation {
            background-color : inherit;
            border           : none;
            border-radius    : inherit;
            color            : inherit;
            font-family      : inherit;
            font-size        : inherit;
            font-weight      : inherit;
            opacity          : 0.6;

            -webkit-transition : opacity 0.3s ease-in-out;
               -moz-transition : opacity 0.3s ease-in-out;
                    transition : opacity 0.3s ease-in-out;
        }
        div.timeline-navigation:hover {
            opacity : 1;
        }
    }

    /* popover style overides for alert timeline */
    .popover {
        width       : 400px !important;
        margin-left : -200px !important;
        background  : #000;
        left        : 50% !important;
        box-shadow  : 0px 0px 30px #222;
        z-index     : 1030 !important;

        .popover-title {
            display : none;
        }

        .btn {
            margin : 2px;
        }

        .alert-meta-data {
            text-align      : left;
            border-collapse : separate;
            border-spacing  : 10px 2px !important;

            .proxima-regular(inherit);

            th {
                text-align : right;
            }

            th, td {
                font-weight : normal;
                color       : #fff;
            }
        }
    }

    .popover.bottom .arrow {
        border-bottom-color: #000;
    }

    .popover-content {
        margin  : 0;
        padding : 2px;

        .small-monitor {
            margin-bottom : 0 !important;

            .btn-group {
                display : none !important;
            }
        }

        /* overlay styles for popovers in alert timeline */
        .alert-data-overlay {
            border-radius : 5px;
            color         : #999;
            height        : 100%;
            top           : 0;
            left          : 0;
            background    : rgba(0,0,0,0.3) !important;
            position      : absolute;
            text-align    : center;
            width         : 100%;

            h1 {
                margin-top  : 100px;
                font-weight : normal;
                .proxima-regular(36px);
            }
        }
    }

    /* add monitor wizard */
    .modal {
        width       : 880px;
        margin-top  : -284px;
        margin-left : -440px;
        overflow    : visible;

        .proxima-regular();

        h1 {
            margin      : -14px;
            padding     : 12px;
            color       : #444;
            background  : #c9c7c3;

            .border-radius(5px, 5px, 0, 0);
            .proxima-regular(36px);
        }

        h2 {
            margin      : 0;
            color       : #666;

            .proxima-regular(18px);
        }

        .hero-unit {
            margin-bottom : 10px;
            padding       : 16px;
            background    : #faf9f6;
            border        : 1px solid #dedddc;
            border-radius : 2px;

            fieldset.bottom {
                margin-bottom : 0;
            }
        }

        .hero-unit.expressions-metrics,
        .hero-unit.test-graph {
            margin-right : 16px;
            width        : 287px;
            min-height   : 275px;
            float        : left;

            .output {
                display: block;
                float: none;

                textarea {
                    width : 100%;
                }
            }
        }

        .test-graph .graph {
            min-height : auto;
        }

        .hero-unit.expressions-metrics {
            width : 480px;
        }

        .hero-unit.test-graph {
            margin-right : 0;
        }

        .modal-header {
            padding : 14px;

            .close,
            .back {
                margin      : 0;
                padding     : 0;
                position    : absolute;
                top         : -22px;
                left        : -19px;
                opacity     : 0.9;
                z-index     : 10000;
                border      : none;
                background  : none;
                color       : #fff;
                font-size   : 42px;
                text-shadow : 0 0 3px #000;
                outline     : none;
            }

            .back {
                display : none;
            }

            .close:hover,
            .back:hover {
                opacity : 1;
            }
        }

        .modal-body {
            position : static;
            padding-top : 9px;
            max-height  : 480px;
        }

        .modal-footer {
            background : #e4e3e1;
        }

        /* modal form styles */
        form {
            margin : 0;
        }

        /* name & shcedule styles */
        fieldset.set-schedule {
            margin-right  : 16px;
            margin-bottom : 10px;
            float         : none;
            display       : block;
        }

        fieldset.day-month-picker {
            margin-right  : 0;
            margin-bottom : 10px;
            float         : left;
            display       : block;
        }

        fieldset.pager-duty,
        fieldset.test-in-graph {
            margin-right : 0;
        }

        fieldset.description {
            clear : left;
        }

        fieldset.pager-duty textarea,
        fieldset.description textarea,
        fieldset.monitor-name input {
            width : 378px;
        }



        fieldset.expressions textarea,
        fieldset.metrics textarea {
            width : 458px;
        }
    }

    .modal.modal-large {
        .hero-unit.expressions-metrics {
            float : left;
        }

        .hero-unit.test-graph {
            margin-left : 530px;
            float : none;
            width : auto !important;
        }
    }

    .graph {
        margin-bottom : 12px;
        border-radius : 2px;
        background    : #333;
        min-height    : 150px;
        overflow      : hidden;

        .highcharts-container {
            top : 0 !important;

            .highcharts-loading {
                margin     : 0 !important;
                padding    : 0;
                position   : absolute;
                top        : 0 !important;
                left       : 0 !important;
                opacity    : 0.8 !important;
                height     : 100% !important;
                width      : 100% !important;
                background : #000 !important;

                span {
                    top   : 35% !important;
                    color : #999;
                    .proxima-regular(36px);
                }
            }
        }
    }

    /* bootstrap form style overrides */
    input[type=text],
    textarea,
    select {
        background : #333;
        border     : 1px solid #b6b3a6;
        color      : #adabac;
    }

    input.input-minutes-back {
        width : 73px;
    }

    input.date-picker {
        width : 114px;
    }

    .previous-errors select {
        width : 155px;
    }

    fieldset {
        margin-right : 16px;
        float        : left;
        display      : inline-block;
    }

    .form-horizontal .controls {
        margin-left : 76px;
    }

    .form-horizontal .control-label {
        float       : left;
        padding-top : 5px;
        text-align  : right;
        width       : 0;
    }

    /* dashboard styles */
    @import 'dashboard.less';

    /* small monitor widget styles */
    .small-monitor {
        margin        : 0;
        border-radius : 4px;
        box-shadow    : 0 0 35px #111;

        -webkit-transition       : -webkit-transform 1s;
           -moz-transition       :    -moz-transform 1s;
             -o-transition       :      -o-transform 1s;
                transition       :         transform 1s;
        -webkit-transform-style  : preserve-3d;
           -moz-transform-style  : preserve-3d;
             -o-transform-style  : preserve-3d;
                transform-style  : preserve-3d;
        -webkit-transform-origin : right center;
           -moz-transform-origin : right center;
             -o-transform-origin : right center;
                transform-origin : right center;

        h1 {
            margin      : 0 0 0 3px;
            color       : #fff;
            line-height : 22px;
            float       : left;
            display     : inline-block;
            cursor      : pointer;
            width       : 60%;
            overflow    : hidden;

            .proxima-regular(16px);
        }

        .btn-group {
            margin  : 3px auto 0 auto;
            width   : 180px;
            display : block;
        }

        .graph {
            margin        : 4px -3px -3px -3px;
            position      : relative;
            overflow      : hidden;
            min-height    : 225px;
            border-radius : 0 0 4px 4px;
            background    : #000;
        }

        .btn-group.activate {
            margin   : 0 auto;
            display  : inline-block;
            float    : right;
            width    : 52px;
            position : absolute;
            right    : 3px;
            top      : 3px;
        }

        .header-controls {
            margin   : 0 0 3px 0;
            overflow : hidden;

            .settings,
            .drag {
                margin   : 0px 5px 0px 0px;
                display  : inline-block;
                float    : right;
                width    : auto;
                position : absolute;
                right    : 55px;
                top      : 3px;
            }

            .header-name {
                span {
                    display : block;
                    width   : 9999999px;

                    p {
                        margin  : 0;
                        display : inline;
                    }
                }
            }

            .truncated-text {
                margin-left : 3px;
                display     : none;
                color       : #fff;
                line-height : 22px;
                .proxima-regular(16px);
            }

            .header-name.truncated + .truncated-text {
                display : inline-block;
            }

            /* drag handle for small monitor */
            .drag {
                right : 83px;
                top   : 5px;
                .drag-handle {
                    background-color : #222222;
                    border           : medium none;
                    border-radius    : 4px 4px 4px 4px;
                    color            : #B6B3A6;
                    font-size        : 11px;
                    padding          : 6px 5px 5px 6px;
                    cursor           : move;
                }
            }
        }


        /* overlay method styles */
        .overlay {
            margin     : 0;
            padding    : 0;
            position   : absolute;
            top        : 0;
            left       : 0;
            height     : 100%;
            width      : 100%;
            background : #000;
            opacity    : 0.7;

            h1 {
                margin-top  : 75px;
                color       : #999;
                width       : 100%;
                height      : 100%;
                text-align  : center;
                font-weight : normal;
                line-height : 36px;

                .proxima-regular(36px);
            }
        }
    }

    .small-monitor figure {
            margin        : 0;
            display       : block;
            border-radius : 4px;
    }

    .small-monitor .back,
    .small-monitor .front {
        -webkit-backface-visibility : hidden;
           -moz-backface-visibility : hidden;
             -o-backface-visibility : hidden;
                backface-visibility : hidden;
    }

    .small-monitor .back {
        position   : absolute;
        left       : 0;
        top        : 0;
        width      : 100%;
        background : #f5f4ee;

        -webkit-transform : rotateY( 180deg );
           -moz-transform : rotateY( 180deg );
             -o-transform : rotateY( 180deg );
                transform : rotateY( 180deg );

        fieldset {
            display : block;
            height  : 100%;
            width   : 100%;
            padding : 0;
            margin  : 0;
        }

        .description {
            border     : 2px solid #999;
            margin     : 3px 3px 48px 3px;
            min-height : 200px;
            overflow   : auto;
            background : #333;
        }

        p {
            margin : 3px 7px;
            color  : #adabac;
            .proxima-regular();
        }

        .btn-wrap {
            margin   : 4px;
            position : absolute;
            right    : 0;
            bottom   : 0;
        }
    }

    .small-monitor .front {
        padding       : 3px;
        background : #545954;
    }


    .small-monitor * {
        -webkit-transform-style : preserve-3d;
    }

    .small-monitor.flipped {
        .transform(translateX( -100% ) rotateY( -180deg ));
    }

    .small-monitor.active .graph,
    .small-monitor.active .header-controls {
        visibility : hidden;
        -webkit-backface-visibility : hidden;
    }

    /* expanded/edit styles */
    @import "expandedmonitor.less";


    /* tab styles */
    .nav-tabs {
        margin-bottom : 0;
        border-bottom : none;
        clear         : both;

        li {
            margin-bottom: 0;
            margin-left : 10px;
        }

        a {
            padding-top    : 4px;
            padding-bottom : 4px;
            background     : #656a65;
            border         : none;
            color          : #7e8079;
            text-transform : uppercase;
        }

        .active a {
            background : #767a76;
            border     : none;
            color      : #b6b3a6;
        }

        a:hover {
            background : #767a76;
            color      : #b6b3a6;
        }
    }

    .tab-content {
        padding       : 10px;
        background    : #767a76;
        border-radius : 4px;
    }

    .tab-content form {
        margin-bottom : 0;
    }

    .metrics-test {
        width : 488px;
        float : right;
    }


    /* alert status styles */
    .small-monitor.red .front {
        border      : none;
        background  : #735854;
        text-shadow : none;
    }

    .expanded-monitor.red {
        border      : none;
        background  : #735854;
        text-shadow : none;

        .data-view,
        .button-view,
        .tab-content {
            background : #8f7976;
        }

        .nav-tabs a {
            background : #816965;
            color      : #917f79;
        }

        .nav-tabs a:hover,
        .nav-tabs .active a {
            background : #8f7976;
            color      : #b6b3a6;
        }
    }

    .add-monitor {
        input[disabled] {
           background-color: #EEEEEE;
           cursor: not-allowed; 
        }
        .help.label {
            float  : right;
            cursor : pointer;
        }
        .tooltip {
            text-transform : none;

            .tooltip-inner {
                max-width : 500px;
                text-align : left;
                .proxima-regular(12px);

                table {
                    margin     : 5px 0;
                    text-align : left;

                    tr:nth-child(even) {
                        background : #333
                    }

                    th {
                        padding        : 2px;
                        width          : 200px;
                        vertical-align : top;
                        font-weight    : normal;
                    }
                    td {
                        padding        : 2px;
                        width          : 480px;
                        vertical-align : top;
                    }
                }

                .cron-help-details {
                  text-align : left; 
                }
            }
        }
        .tooltip.in {
            opacity : 0.9 !important;
        }
    }

    .metrics-schedule {
        .expressions textarea {
            width      : 396px;
            min-height : 200px;
        }
        .metrics-test .metrics textarea {
            width : 459px;
        }
    }

    /* add monitor code mirrors */
    .CodeMirror.error {
        border-color : #B94A48 !important;
        box-shadow   : 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px rgba(213, 147, 146, 0.8);
        outline      : 0 none;
    }

    .expressions-metrics {
        .metrics.error,
        .expressions.error {
            label {
                color : #b94a48;
            }
        }

        .metrics .CodeMirror,
        .expressions .CodeMirror {
            width         : 471px;
            display       : block;
            visibility    : visible;
            border        : 1px solid #b6b3a6;
            border-radius : 3px;
            transition    : border 0.2s linear 0s, box-shadow 0.2s linear 0s;
        }

        .metrics .CodeMirror-scroll,
        .expressions .CodeMirror-scroll {
            border-radius : 3px;
            height        : 100px;
        }

        .metrics .fullscreen .CodeMirror-scroll,
        .expressions .fullscreen .CodeMirror-scroll {
            height : 100%;
        }

        fieldset {
            margin-bottom : 16px;

            i {
                font-style  : normal;
                font-weight : normal;
                font-size   : 10px;
            }
        }

        fieldset.form-horizontal {
            .control-group {
                margin-bottom : 0;
            }
        }

        .help.label {
            float  : right;
            cursor : pointer;
        }

        .tooltip {
            text-transform : none;

            .tooltip-inner {
                max-width : 500px;

                .proxima-regular(12px);

                table {
                    margin     : 5px 0;
                    text-align : left;

                    tr:nth-child(even) {
                        background : #333
                    }

                    th {
                        padding        : 2px;
                        width          : 280px;
                        vertical-align : top;
                        font-weight    : normal;
                    }
                    td {
                        padding        : 2px;
                        width          : 400px;
                        vertical-align : top;
                    }
                }
            }
        }
        .tooltip.in {
            opacity : 0.9 !important;
        }
    }

    /* edit monitor styles */
    .metrics-schedule {

        input[disabled] {
           background-color: #7E8079;
           cursor: not-allowed; 
        }

        .metrics .CodeMirror,
        .expressions .CodeMirror {
            border-radius : 3px;
            display       : block;
            visibility    : visible;
        }

        .metrics .CodeMirror-scroll {
            border-radius : 3px;
            height : 100px;
        }

        .expressions .CodeMirror-scroll {
            border-radius : 3px;
            height : 196px;
        }

        .metrics .fullscreen .CodeMirror-scroll,
        .expressions .fullscreen .CodeMirror-scroll {
            height : 100%;
        }

        /* bootstrap styling of label/tooltip for expressions help */
        .help.label {
            float  : right;
            cursor : pointer;
        }

        .tooltip {
            text-transform : none;

            .tooltip-inner {
                max-width : 500px;
                text-align : left;
                .proxima-regular(12px);

                table {
                    margin     : 5px 0;
                    text-align : left;

                    tr:nth-child(even) {
                        background : #333
                    }

                    th {
                        padding        : 2px;
                        width          : 280px;
                        vertical-align : top;
                        font-weight    : normal;
                    }
                    td {
                        padding        : 2px;
                        width          : 400px;
                        vertical-align : top;
                    }
                }
            }
        }
        .tooltip.in {
            opacity : 0.9 !important;
        }
        .parsley-error-list li {
            font-weight : bold;
            font-size : larger;
        }
    }

    /* ecosystem styles (application tiles, etc.) */
    @import "ecosystem.less";

    /* rearview system alert styles */
    @import "alert.less";

    /* bootstrap form overrides */
    textarea: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 {
        border-color : rgba(140, 134, 110, 0.8);
        box-shadow   : 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(75, 75, 75, 0.7);
        outline      : 0 none;
    }



    .control-group.error input,
    .control-group.error select,
    .control-group.error textarea {
        border-color : #B94A48;
        box-shadow   : 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(185, 74, 74, 0.7);
    }

    input:focus:required:invalid:focus,
    textarea:focus:required:invalid:focus,
    select:focus:required:invalid:focus {
        border-color : #B94A48;
        box-shadow   : 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(185, 74, 74, 0.7);
    }
    .parsley-error-list {
        margin : 0;

        li {
            list-style : none;
            color      : #B94A48;
        }
    }

    .hero-unit {
        font-size : inherit;
    }

    .modal.fade.in {
        top : 50%;
    }

    .btn-inverse,
    .btn-inverse.active,
    .btn-inverse:active {
        color : #B6B3A6;
    }

    .btn-large {
        border-radius : 6px;
        font-size     : 16px;
        padding       : 9px 14px;
    }

    /* glyph icon override - for font awesome */
    .icon-white,
    .nav-tabs > .active > a > [class^="icon-"],
    .nav-tabs > .active > a > [class*=" icon-"],
    .nav-pills > .active > a > [class^="icon-"],
    .nav-pills > .active > a > [class*=" icon-"],
    .nav-list > .active > a > [class^="icon-"],
    .nav-list > .active > a > [class*=" icon-"],
    .navbar-inverse .nav > .active > a > [class^="icon-"],
    .navbar-inverse .nav > .active > a > [class*=" icon-"],
    .dropdown-menu > li > a:hover > [class^="icon-"],
    .dropdown-menu > li > a:hover > [class*=" icon-"],
    .dropdown-menu > .active > a > [class^="icon-"],
    .dropdown-menu > .active > a > [class*=" icon-"] {
        background-image : none;
    }

    /* making icons in tabs a tiny bit larger */
    .nav-tabs > li > a > [class^="icon-"] {
        margin         : 0 4px 0 -7px;
        font-size      : 130%;
        vertical-align : -2px;
    }

    /* codemirror styling */
    .CodeMirror-wrap {
        border-radius : 3px !important;

        pre {
            white-space : pre-wrap !important;
            word-break  : break-all !important;
            word-wrap   : break-word !important;
        }

        .CodeMirror-scroll {
            background : #000;
        }

        .CodeMirror-gutter {
            border-top-left-radius    : 3px;
            border-bottom-left-radius : 3px;
        }
    }

    .fullscreen {
        margin   : 0;
        padding  : 0;
        display  : block;
        position : absolute;
        top      : 0;
        left     : 0;
        width    : 100%;
        height   : 100%;
        z-index  : 9999 !important;
        border   : 0px solid #bbb;
        opacity  : 1;
    }

    .small-monitor {
        .tooltip {
            .tooltip-arrow {
                display : none !important;
            }

            .tooltip-inner {
                max-width : none !important;
            }
        }
    }

    /* jquery ui style adjustments */
    .ui-widget {
        .proxima-regular(12px);
        background : #000 !important;


        .ui-slider {
            margin-top : 7px;
        }

        .ui-timepicker-div dt {
            font-weight : normal !important;
        }
    }
    /* settings styles */
    .alert-settings {
        width: 100%;
        textarea {
            width: 100%
        }
    }
}