/*    .navbar-default, .navbar-default .navbar-collapse {
        background-color: #017ac3;
    }

        .navbar-default .navbar-nav > li > a {
            color: white;
        }

        .navbar-default .navbar-brand {
            color: white;
        }

            .navbar-default .navbar-brand:hover {
                color: #ECECEC;
            }

        .navbar-default .navbar-nav > li > a:hover {
            background-color: black;
            color: #ECECEC;
        }
*/

    /* if input is marked as required make it go red if invalid */
    .form-validation input.ng-invalid.ng-touched {
        background-color: #FA787E;
    }


    /*
#grid-min-width table {
min-width: 1000px;
}

*/


    /* used for negative numbers in grid*/
    .negative {
        /*font-weight: bold;*/
        color: red;
        text-align: right
    }

    .positive {
        /*font-weight: bold;*/
        text-align: right
    }

    /* make font on grid small*/
    .k-grid.reports-grid {
        font-family: Arial;
        font-size: 11px;
    }

    /* used for scrollbar being hidden programmatically - from Kendo */
    .no-scrollbar .k-grid-header {
        padding: 0 !important;
    }

    .no-scrollbar .k-grid-content {
        overflow-y: visible;
    }

    /* END - used for scrollbar being hidden programmatically - from Kendo */

    /* notifications start*/
    /* Error template */
    .k-notification-error.k-group {
        background: rgba(100%,0%,0%,.7);
        color: #ffffff;
    }

    .notify-error {
    margin-left: 0vh;
    width: 95vw;
        height: 150px;
    }

    .k-notification-notify-error.k-group {
        background: rgba(100%,0%,0%,.7);
        color: #ffffff;
    }

    .notify-error h3 {
        /* font-size: 1em;*/
        padding: 10px 10px 5px;
    }

.notify-error p {
    /* font-size: 1em;*/
    margin: 10px;
}


    /*30px 15px 30px 30px;*/
/* 5px 15px 60px 10px*/
    .notify-error img {
        float: left;
    margin: 5px 7px 11px 1px;
    }

    /* Success template */
    .k-notification-info-large.k-group {
        background: rgba(0%,60%,0%,.7);
        color: #fff;
    }

    .info-large {
        width: 205px;
        height: 100px;
        padding: 0 30px;
        line-height: 100px;
    }

        .info-large h3 {
            font-size: 1.7em;
            font-weight: normal;
            display: inline-block;
            vertical-align: middle;
            color: white;
        }

        .info-large img {
            display: inline-block;
            vertical-align: middle;
            margin-right: 10px;
        }

    /* notifications END*/

    /* show ellipsis prevents the row height increasing when the text does not fit in to column */
    .k-grid td {
        /*   overflow: hidden;
text-overflow: ellipsis;*/
        white-space: nowrap;
    }

    /* Stop modal background from greying out*/
    .k-overlay {
        /* dont always need to change background colour
    background-color: white !important;
    OR ??
    background-color: inherit;
    */
        /* this is the important one*/
        /*opacity: 0.0 !important;*/
    }


    /* style changes required when using bootstrap with kendo
https://docs.telerik.com/kendo-ui/third-party/using-kendo-with-twitter-bootstrap#use-bootstrap-responsive-features */

    .form-control.k-widget {
        padding: 0;
        width: 100%;
        height: auto;
    }

        .form-control.k-widget:not(.k-autocomplete) {
            border-width: 0;
        }

    /* reset everything to the default box model */
    /* This makes the navbar height 2x height, so commented out for now. Does not seem to have any adverse affect on
*, :before, :after {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}*/

    /* set a border-box model only to elements that need it */
    /* this is needed to ensure controls are displayed correctly in kendo modal window */

    .form-control, /* if this class is applied to a Kendo UI widget, its layout may change */
    .container,
    .container-fluid,
    .row,
    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
    .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
    .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
    .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
    .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
    .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
    .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
    .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
    .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
    .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
    .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11,
    .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }




    /* modal form bootstap ui only*/
    @media (min-width:760px) {
        .modal-xlg .modal-dialog {
            width: 750px;
        }
    }

    @media (min-width:1010px) {
        .modal-xlg .modal-dialog {
            width: 1000px;
        }
    }

    @media (min-width:1100px) {
        .modal-xlg .modal-dialog {
            width: 1300px;
        }
    }
    /* END - modal form bootstap ui only*/

