h1, h2, h3, h4 {
    font-family: "SairaMedium",Helvetica,Arial,sans-serif;
    font-weight: normal;
    font-style: normal;
    letter-spacing: -0.0625em;
}

#main-header {
    position: relative;
    margin: 0;
    min-height: 33px;
    /*width: 100%;*/
    font-size: 16px;
    font-family: SairaMedium,Helvetica,Arial,sans-serif;
    letter-spacing: -0.0625em;
}

.c-logo {
    display: inline-block;
}

#main-menu-wrap {
    display: inline-block;
    max-width: 900px;
    padding-bottom: 10px;
}

#main-menu {
    min-height: 23px;
    font-family: InterSemiBold,Helvetica,Arial,sans-serif;
}

.system-main-menu-item {
    text-transform: none;
}

.open-system-menu-toplevel-item {
    margin-left: 20px;
}

.main-menu-item {
    margin-left: 20px;
    min-height: 23px;
}

.inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

body {
    /* position: absolute; */ /* background:#FFFFFF;*/
    /* font-family: Verdana; */
    /* color: #555; */
    /*font-family: Verdana, Tahoma, Geneva, sans-serif;*/
    font-family: InterLight,Helvetica,Arial,sans-serif;
    font-size: 16px;
    text-align: left;
    /*background: url(../Images/bg.jpg) repeat-y top center; */
    margin: 0 auto;
    padding: 0;
    font-stretch: normal;
    font-style: normal;
    font-variant-caps: normal;
    font-variant-ligatures: normal;
    font-variant-numeric: normal;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
}

html {
}

#nav {
    /*border-bottom: 2px solid #ccc;*/
    -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.25);
    width: 100%;
    min-height: 70px;
    position: fixed;
    top: 0px;
    z-index: 1000;
    background-color: white;
}

#main-center {
    width: 1200px;
    margin: 0 auto;
    position: relative;
    top: 130px;
}

#header-center {
    /*width:1200px;*/ /*width dynamic via resizeHeaderToFitCallback*/
    margin: 0 auto;
}

/* war nach einem kendoui update notwendig geworden, um gestrichelte Linie zu vermeiden */
form {
    outline: none;
}


/* Readonly Eingabefelder grau */
.lu-dialog input[readonly="readonly"] {
    background-color: gainsboro;
}


.lu-standalone-button:active {
    background-color: transparent !important;
    color: #333333 !important;
    border-color: #ff0000 !important;
}

.lu-standalone-button {
    padding-left: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    vertical-align: middle;
}

    .lu-standalone-button > img,
    .lu-standalone-button > span {
        vertical-align: middle;
        line-height: 36px;
    }


button > img,
button > span {
    vertical-align: middle;
}

.lu-button-disabled {
    pointer-events: none;
}



#main-content-container {
    padding-bottom: 20px;
    z-index: 2;
    min-height: 750px;
}


#workspace {
}

#main-footer {
    margin: 0;
    z-index: 3;
    width: 100%;
}


#show-current-navigation-link {
    font-family: InterSemiBold;
}


#language-nav {
    padding-top: 10px;
    margin-left: 30px;
    height: 20px;
}

#user-navigation-view-wrap {
    padding-top: 16px;
    position: relative;
    margin: 0;
    height: 27px;
}

/*
@media all and (max-width: 1200px) {
   
   #user-navigation-view {
        margin-right: 5%;
   }  
}*/

#user-navigation-view {
    display: inline-block;
    float: right;
    margin-right: 5%;
}

.user-navigation-menu-class {
    display: inline-block;
    position: relative;
    top: 0px;
}

#user-navigation-menu___ .k-i-arrow-s {
    background-image: url('sprite.svg#arrows--arrowD');
    background-repeat: no-repeat;
    background-position: center;
    height: 7px;
    width: 12px;
    fill: red;
    display: inline-block;
}

#user-navigation-menu .k-i-arrow-60-down {
    background-image: url('arrow-down_red-white.png');
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    height: 7px;
    width: 12px;
    padding-left: 7px;
    font: icon; /* to overide the kendo icons by font*/
    opacity: 1.0;
    color: transparent;
}

.user-nav-menu-arrow-icon {
    display: inline-block;
    fill: red;
    width: 12px;
    height: 7px;
}

.user-navigation-label-class {
    display: inline-block;
    position: relative;
    top: -5px;
}

#user-navigation-view ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#user-navigation-view li {
}

#user-navigation-view ul a {
    /* text-decoration: none; */
    /*font-size:11px;*/
}

#language {
    /* float: left; */
    /* font-size: 13px; */
    list-style: none outside none;
    /* margin: 10px 0 0 33px; */
    padding: 0;
    margin: 0;
}


    #language li {
        float: left;
        text-align: center;
        background: none;
        margin: 0px 10px 0px 0px;
        padding: 0;
    }


        #language li a {
            /* color: #CCCCCC; */
            text-decoration: none;
            outline: none;
            border: none;
        }

/* a:hover für die Messe rausgenommen */

#flag_deutschland /* a:hover */, #flag_deutschland a[data-aktiv="true"] {
    background: url("../Images/deutschland_aktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_england /* a:hover */, #flag_england a[data-aktiv="true"] {
    background: url("../Images/england_aktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_frankreich /* a:hover */, #flag_frankreich a[data-aktiv="true"] {
    background: url("../Images/frankreich_aktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_niederlande /* a:hover */, #flag_niederlande a[data-aktiv="true"] {
    background: url("../Images/niederlande_aktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_daenemark /* a:hover */, #flag_daenemark a[data-aktiv="true"] {
    background: url("../Images/dk20.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_italien /* a:hover */, #flag_italien a[data-aktiv="true"] {
    background: url("../Images/it20.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_deutschland a {
    background: url("../Images/deutschland_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_england a {
    background: url("../Images/england_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_frankreich a {
    background: url("../Images/frankreich_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_niederlande a {
    background: url("../Images/niederlande_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_daenemark a {
    background: url("../Images/dk20_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}

#flag_italien a {
    background: url("../Images/it20_inaktiv.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
}



#info-icon a {
    background: url("../Images/messagebox_info.png") no-repeat scroll 0 0 transparent;
    height: 20px;
    width: 20px;
    float: left;
    margin-left: 50px;
}


.lu-link:hover {
    color: #e71e00;
    text-decoration: underline;
}


.lu-link {
    color: #8d8d8d;
    text-decoration: none;
}

.lu-separator-without-margin {
    margin-top: 10px;
    background-color: #ccc;
    border: 0;
    height: 1px;
}

.lu-separator {
    margin-top: 10px;
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-left: 15px;
    margin-right: 15px;
}

.lu-header-separator {
    background-color: #ccc;
    border: 0;
    height: 2px;
    margin: 0px;
}

.lu-block-info {
    line-height: 1.5em;
    padding: 5px;
    border-radius: 4px;
    border: 1px solid #2ab0ed;
    background-color: rgba(0, 184, 255, 0.11);
    background-image: url("../Images/1352308727_Info_Box_Blue-32.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 70px;
    margin-bottom: 10px;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    min-height: 50px;
    display: table;
    width: 85%;
}

    .lu-block-info label {
        vertical-align: middle;
        display: table-cell;
        text-align: left;
    }

#progressbarBox-view {
    width: 500px;
    padding: 20px;
}


#messagebox-view {
    max-width: 900px;
}


.lu-messagebox {
    line-height: 1.5em;
    padding: 5px;
    background-image: url("../Images/1352362340_Alert-48.png");
    background-size: 32px;
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 50px;
    min-height: 70px;
    display: table;
}

    .lu-messagebox label {
        vertical-align: middle;
        display: table-cell;
        text-align: left;
    }


.lu-block-success-msg {
    line-height: 1.5em;
    padding: 5px;
    border-radius: 4px;
    border: 1px solid #8fc400;
    background-color: #cdeb8e;
    background-image: url("../Images/Check.png");
    background-position: 10px center;
    background-repeat: no-repeat;
    padding-left: 70px;
    margin-bottom: 10px;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    min-height: 50px;
    display: table;
    width: 85%;
}

    .lu-block-success-msg label {
        vertical-align: middle;
        display: table-cell;
        text-align: left;
    }

span.lu-panel-error-msg {
    padding: 10px;
}

span.lu-dialog-error-msg {
    padding: 10px;
    margin: 20px;
    text-align: left;
}

.lu-dialog {
}


    .lu-dialog ul {
        margin-top: 0px;
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 10px;
        padding: 0;
    }

    .lu-dialog li {
        list-style: none;
        padding: 5px 0;
    }


.lu-dialog-label {
    display: inline-block;
    width: 150px;
    text-align: right;
}

.local-system-list {
    border-style: solid;
    border-width: 1px;
    overflow: hidden;
    padding: 10px 30px;
}

.lu-panel {
    /* border-radius: 5px; */
    border-style: solid;
    border-width: 1px;
    overflow: hidden;
    width: 800px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    /* background-position: 0 -255px; */
}

.lu-panel-h2 {
    text-align: left;
    padding: 5px 0;
    font-weight: normal;
    font-family: InterSemiBold;
    border-bottom: 1px solid #999;
}

.left {
    text-align: left;
}

.lu-panel-ul {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0px 0 30px 0;
}

    .lu-panel-ul li {
        list-style: none;
        padding: 5px 0;
    }


.lu-panel-label {
    display: inline-block;
    width: 200px;
    text-align: right;
}

.lu-panel-label-middle {
    display: inline-block;
    min-width: 120px;
    text-align: right;
}

.lu-panel-label-small {
    display: inline-block;
    min-width: 50px;
    text-align: right;
}

.lu-panel-error-msg {
    padding: 10px;
    margin-left: 10px;
}

.lu-panel-input {
    width: 270px;
    margin-right: 10px;
}

.lu-panel-input-small {
    min-width: 150px;
    margin-right: 10px;
}

.lu-panel-select-small {
    min-width: 100px;
}

.lu-panel-select {
    width: 270px;
}

.lu-system-info-input {
    width: 450px;
    margin-right: 10px;
}

.lu-dialog-button-panel {
    padding: 10px;
}


textarea {
    resize: none;
}

#login-view-header {
    /* border-radius: 10px; */
    border-style: solid;
    border-width: 1px;
    overflow: hidden;
    width: 800px;
    padding: 20px 20px 20px 20px;
    margin: 0px auto;
    /** background-position: 0 -255px; */
}

#login-view-panel {
    margin-top: 50px;
}

#system-list-view {
}

.bhkw-voltage-grid {
    margin-bottom: 10px;
}

.text-center {
    text-align: center;
}

.parameter-grid .k-grid-header {
    display: none;
}

#system-parameter-grid .k-grid-header {
    display: none;
}



/****
#statusbar-menu-impressum
{
    border-left: 1px solid #c5c5c5;
    margin-left: 500px; 
}

#statusbar-menu #copyright
{
    line-height: 30px;
    margin-left: 100px;
}
****/

#system-overview-view {
    /* margin:30px; */
}

#system-detail-view .dialog input {
    width: 400px;
}

#system-detail-view .dialog textarea {
    width: 400px;
}


#system-detail-shared-grid {
    margin: 10px;
}

#system-detail-view {
}


#main-menu > .k-item > .k-link > .k-image {
    /* margin-top: 2px; */
    /* margin-left: -5px; */
}

#main-menu img {
    width: 20px;
    height: 20px;
}

/*Expert open system menu with grey banner background */
#open-system-menu .k-group.k-menu-group.k-popup.k-reset.k-state-border-up {
    width: 3000px;
    padding-left: 3000px;
    left: -3000px;
    background-color: #F3F3F3;
}

#open-system-menu .k-animation-container {
    /*display:none !important;*/
    visibility: hidden; /*hide the animation to display background and menu at once, look openSystemMenu.activate*/
}


#open-system-menu-header {
    height: 28px;
    /*width: 100%;*/
    font-size: 16px;
    font-family: InterLight,Helvetica,Arial,sans-serif;
}


.k-menu .open-system-menu-state-selected > .k-link {
    background-color: transparent;
    color: black;
    font-family: InterSemiBold,Helvetica,Arial,sans-serif;
}


#open-system-menu {
    margin-left: 147px;
}

    #open-system-menu > .k-item > .k-link > .k-image {
        /* margin-top: 2px; */
        /* margin-left: -5px; */
    }

    #open-system-menu > .k-state-hover > .k-link {
        background-color: transparent;
        color: black;
        border-bottom: none;
    }

#user-navigation-menu > .k-state-hover > .k-link {
    background-color: transparent;
    color: black;
    border-bottom: none;
}

/* open-system-menu - Expert dropdown menu without red underscore */
.k-context-menu.k-menu-vertical > .k-state-hover > .k-link, .k-menu .k-menu-group .k-state-hover > .k-link {
    background-color: transparent;
    color: black;
    border-bottom: none;
}


#open-system-menu img {
    width: 20px;
    height: 20px;
}

.accesslevel-icon {
    width: 24px;
    height: 24px;
    margin: auto;
}

.accesslevel-icon-readonly {
    background: url('../Images/Lesen.png') no-repeat center center;
    background-size: 24px 24px;
}

.accesslevel-icon-writeable {
    background: url('../Images/Schreiben.png') no-repeat center center;
    background-size: 24px 24px;
}


.system-state-icon {
    width: 24px;
    height: 24px;
    margin: auto;
}


.system-state-icon-offline {
    background: url('../Images/Offline.png') no-repeat center center;
    background-size: 24px 24px;
}

.system-state-icon-online {
    background: url('../Images/Online.png') no-repeat center center;
    background-size: 24px 24px;
}

.system-state-icon-locked {
    background: url('../Images/Gesperrt.png') no-repeat center center;
    background-size: 24px 24px;
}

/* Window opens and closes slowly in Chrome */
/*  http://www.kendoui.com/forums/ui/window/window-opens-and-closes-slowly.aspx */
/****
body:after {
 
    content: "";
    display: block;
    visibility: hidden;
    height: 0;
    font: 0/0;
    -webkit-transform:translateZ(0);
 
}
***/

.statusbar {
    display: table; /* Allow the centering to work */
    margin: 0 auto;
}


    .statusbar ul {
        display: table-row;
    }

        .statusbar ul li {
            display: table-cell;
            list-style-type: none;
            vertical-align: middle;
            height: 25px;
            border-right: 1px solid black;
            padding-left: 10px;
            padding-right: 10px;
        }

            .statusbar ul li.lastStatusbarElem {
                border-right: none;
            }

            .statusbar ul li a {
                display: table-cell;
                vertical-align: middle;
                height: 25px;
            }

    .statusbar li a:focus {
        outline: none;
    }

/***
.lu-grid-groupHeader
{
    width: 95%;
    margin-top: 0px;
    margin-bottom: 0px;
}
***/

/***
.console div
{
    background-image: url("sprite.png");
    background-repeat: no-repeat;
    background-color: transparent;
}
* html .console div
{
    background-image: url("sprite_ie6.png");
}
.console
{
    background-color: #FFF;
    border: 1px solid #CCC;
    color: #333;
    font: 11px Consolas, Monaco, "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
    height: 200px;
    margin: 1.4em 0 0;
    overflow-x: hidden;
    overflow-y: scroll;
    text-align: left;
}
.console .count
{
    background-color: #91AFEF;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
    color: #FFFFFF;
    font-size: 10px;
    margin-left: 5px;
    padding: 2px 6px 2px 5px;
}
.console div
{
    background-position: 6px -95px;
    border-bottom: 1px solid #DDD;
    padding: 5px 5px 4px 24px;
}
.console .error
{
    background-position: 6px -135px;
}
    ****/

/***** BEGIN: SchemaView classes *****/
.sv_container {
    width: 100%;
    padding: 3px;
    margin: 0 auto;
    text-align: left;
}

.sv_top_container {
    width: 100%;
    padding: 0px;
    margin: 0 auto;
}

.sv_left {
    width: 50%;
    height: 100%;
    min-width: 100px;
    min-height: 100px;
    float: left;
    margin: 1px;
    text-align: left;
    padding-right: 10px;
}

.sv_right {
    float: left;
    width: 45%;
    margin: 1px;
    text-align: left;
    margin-top: 70px;
}

.sv_below {
    width: 100%;
    text-align: left;
    margin-top: 20px;
}

.sv_clear {
    clear: both;
    height: 0;
    width: 100%;
}

.sv_combobox {
    width: 100%;
}

.sv_combobox_button {
    padding-left: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    float: right;
}

.sv_image {
    width: 422px;
    height: 422px;
    float: left;
    margin: 0 auto;
}


.sv_hg_top_container {
    text-align: center;
    margin-top: 20px;
}

/***** END: SchemaView classes *****/

.dummy_image {
    max-width: 100%;
    max-height: 100%;
}

/*Center image and label vertically in a grid row*/
.grid-drop-down-image {
    display: inline-block;
    margin: 0 10px 0 0;
    height: 20px;
    vertical-align: middle;
}

.grid-drop-down-label {
    vertical-align: middle;
}

.state_image {
    float: left;
    height: 20px;
    width: 20px;
}

.image_border {
    float: left;
    /*padding:1px;*/
    /*border:thin solid grey;*/
    margin-right: 5px;
}



/******************************/
/**** Zeitprogramm Slider *****/
/******************************/

.ts-row {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 20px;
}

.ts-row-top {
    margin-top: 65px;
}

.ts-row-label {
    float: left;
    width: 60px;
    height: 40px;
    /* line-height : 40px; */
    position: relative;
}

.ts-container {
    height: 40px;
    position: relative;
    margin-left: 60px;
}


    .ts-container * {
        -webkit-user-select: none; /* Chrome + Safari */
        user-select: none; /* HTML 5 */
        -ms-user-select: none;
    }

/* Zeitskala Zahlen 00:24 */
.ts-legend {
    position: absolute;
    padding: 0;
    margin-top: 20px;
    font-size: 11px;
    text-shadow: 1px 1px 0 #FFFFFF;
    /* background-image: url(../Images/timeline.png); */
}

    .ts-legend li {
        float: left;
        list-style: none;
        -webkit-user-select: none; /* Chrome + Safari */
        user-select: none; /* HTML 5 */
        -ms-user-select: none;
    }

.ts-slider-bar {
    height: 10px;
    background-color: #999;
    border: solid 1px #fff;
    margin: 2px;
    position: absolute;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: inset 0px 1.5px 2px #000;
    -moz-box-shadow: inset 0px 1.5px 2px #000;
    box-shadow: inset 0px 1.5px 2px #000;
}

.ts-ival-bar {
    position: absolute;
    height: 10px;
    margin: 3px;
    background-color: #00ABFE;
    -webkit-box-shadow: inset 0px 1.5px 2px #000;
    -moz-box-shadow: inset 0px 1.5px 2px #000;
    box-shadow: inset 0px 1.5px 2px #000;
}

.ts-ival-gripper {
    width: 5px;
    height: 15px;
    border: solid 1px #fff;
    position: absolute;
    z-index: 10;
    cursor: w-resize;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    -webkit-box-shadow: 0px 0px 4px #000;
    -moz-box-shadow: 0px 0px 4px #000;
    box-shadow: 0px 0px 4px #000;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2NjY2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -webkit-gradient(linear, 0% 80%, 0% 50%, from(#ccc), color-stop(0.9, #eee));
    background: -moz-linear-gradient(100% 90% 90deg, #CCCCCC, #EEEEEE, #ccc 0%, #eee 50%);
}

.ts-ival-gripper-legend {
    position: absolute;
    left: -18px;
    height: 10px;
    width: 30px;
    line-height: 10px;
    background-color: #000;
    color: #fff;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 5px;
    padding-right: 5px;
    opacity: 0.7;
    filter: alpha(opacity=70);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    text-align: center;
    -webkit-box-shadow: 2px 2px 10px #000;
    -moz-box-shadow: 2px 2px 10px #000;
    box-shadow: 2px 2px 10px #000;
    font-size: 10px;
}

.ts-ival-gripper-legend-arrow-start {
    opacity: 0.7;
    filter: alpha(opacity=70);
    /* border-right : 0.5em solid #CCCCCC; */
    border-color: #000 transparent transparent;
    border-style: solid solid solid;
    border-width: 0.5em 0.53em 0.53em;
    display: inline-block;
    height: 0;
    width: 0;
    line-height: 0;
    position: absolute;
    left: -5px;
    top: -10px;
}

.ts-ival-gripper-legend-arrow-end {
    opacity: 0.7;
    filter: alpha(opacity=70);
    border-color: transparent transparent #000 transparent;
    border-style: solid solid solid solid;
    border-width: 0.53em 0.53em 0.5em 0.53em;
    display: inline-block;
    height: 0;
    width: 0;
    line-height: 0;
    position: absolute;
    left: -5px;
    bottom: -10px;
}


.ts-ival-gripper-legend-start {
    top: -28px;
}

.ts-ival-gripper-legend-end {
    bottom: -28px;
}

.ts-popup-dialog {
    font-size: 13px;
    padding: 5px 10px 5px 0px;
    text-align: center;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 0px 2px #000;
    -webkit-box-shadow: 0px 0px 2px #000;
    -moz-box-shadow: 0px 0px 2px #000;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2NjY2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -webkit-gradient(linear, 0% 80%, 0% 50%, from(#CCC), color-stop(0.9, #E6E6E6));
    background: -moz-linear-gradient(100% 90% 90deg, #CCC, #E6E6E6, #CCC 0%, #E6E6E6 50%);
}

.ts-popup-dialog-wrapper {
    position: absolute;
    width: 150px;
    height: 80px;
    top: -90px;
    z-index: 999;
}

.ts-popup-dialog-button {
    width: 70px;
    padding: 5px 30px;
    text-align: center;
    cursor: pointer;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    -webkit-box-shadow: 0px 0px 2px #000;
    -moz-box-shadow: 0px 0px 2px #000;
    box-shadow: 0px 0px 2px #000;
    margin: 10px 10px 5px 10px;
    color: #fff;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSI0MCUiIHN0b3AtY29sb3I9IiM0OTliZWEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI4NyUiIHN0b3AtY29sb3I9IiMyMDdjZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -webkit-gradient(linear, 0% 80%, 0% 50%, from(#2567AB), color-stop(0.9, #4E89C5));
    background: -moz-linear-gradient(100% 90% 90deg, #2567AB, #4E89C5, #2567AB 0%, #4E89C5 50%);
}


.ts-popup-dialog-button-cancel {
    color: #000;
    margin: 5px 10px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VlZWVlZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNjY2NjY2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -webkit-gradient(linear, 0% 80%, 0% 50%, from(#CCC), color-stop(0.9, #EEE));
    background: -moz-linear-gradient(100% 90% 90deg, #CCC, #EEE, #CCC 0%, #EEE 50%);
}

.ts-popup-dialog-arrow {
    border-right: 0.5em solid #CCCCCC;
    border-color: #CCCCCC transparent transparent;
    border-style: solid solid solid;
    border-width: 0.5em 0.53em 0.53em;
    display: inline-block;
    height: 0;
    width: 0;
    line-height: 0;
    margin-left: 70px;
}

/* wird nur zur Markierung verwendet, um Elemente anhand des Klassennamens zu finden */
.ts-markerRange {
}

/***** BEGIN: Protocol classes *****/
.prot-config-container {
    width: 100%;
    overflow: hidden; /*Wichtig, damit der Flow auch ohne div mit clear:both funktioniert!!*/
    /*padding:0px;
  margin:0 auto;
  float: left;*/
}

.prot-config-left {
    width: 35%;
    float: left;
    margin: 1px;
    text-align: left;
}

.prot-config-center {
    width: 15%;
    float: left;
    margin-top: 200px;
    text-align: center;
    padding-right: 10px;
}

.prot-config-right {
    float: left;
    width: 45%;
    height: 100%;
    text-align: left;
}

/* Nicht noetig, wenn der container overflow:hidden hat!
 .prot-config-clear{
  clear:both;
  height:0;
  width:100%;
 }*/


.prot-config-below {
    width: 100%;
    text-align: right;
    margin-top: 20px;
    margin-bottom: 20px;
}

.prot-config-interval {
    margin-right: 22px;
}

.prot-config-device-treeview {
    display: inline-block;
    vertical-align: top;
    width: 100%;
    min-height: 400px;
    height: auto;
    text-align: left;
    /*border-style: solid;
    border-width: 1px;
    float: left;*/
}

.prot-config-choice-grid {
    width: 100%;
    min-height: 400px;
    height: 100%;
    /*float: left;*/
}

.k-upload {
    border-width: 0px !important;
}

.k-upload-button {
    margin: 0px !important;
    /*padding-left: 0px !important;
     padding-right: 0px !important;*/
}


    .k-upload-button span {
        /*vertical-align:middle;*/
    }


.k-upload-status {
    visibility: hidden !important;
}

.k-upload-status-total {
    visibility: hidden !important;
}


.k-ff input.k-button {
    padding-bottom: 0.2em !important;
    padding-top: 0.2em !important;
}

/***** END: Protocol classes *****/

/*Remove x Button (clear inside edit input field)
    http://stackoverflow.com/questions/17196845/ie-10s-ms-clear-pseudo-element-and-ie5-quirks-mode
    */
input::-ms-clear {
    display: none;
}

/*
.k-autocomplete .k-input::-ms-clear {
    display: none;
}*/

/* FIX: http://www.kendoui.com/forums/kendo-ui-web/general-discussions/kendo-ui-progress-z-index-of-kendo-widgets.aspx**/
.k-loading-mask {
    z-index: 100;
}

/*console*/

.console {
    background-color: transparent;
    color: #333;
    /*font: 11px Consolas, Monaco, "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;*/
    margin: 0;
    overflow-x: hidden;
    text-align: left;
    height: 200px;
    border: 1px solid rgba(20,53,80,0.1);
    background-color: #ffffff;
    text-indent: 0;
}

.console {
    min-width: 200px;
}

    .console .count {
        background-color: #26c6da;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px;
        border-radius: 15px;
        color: #ffffff;
        font-size: 10px;
        margin-left: 5px;
        padding: 2px 6px 2px 5px;
    }

    .console div {
        background-position: 6px -95px;
        border-bottom: 1px solid #DDD;
        padding: 5px 10px;
        /*height: 2em;*/
        line-height: 1.5em;
        vertical-align: middle;
    }

    .console .error {
        background-position: 6px -135px;
    }

.k-notification {
    border: 0;
}

.k-notification-new-version.k-group {
    background: rgba(0, 171, 254, 0.8) !important;
    color: #fff;
}

.new-version {
    width: 300px;
    padding: 0 30px;
}

    .new-version h3 {
        font-size: 1.1em;
    }


.bhkw-generator-frequence {
    margin-top: 20px;
    margin-bottom: 20px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight: bold;
}

.bhkw-generator-frequence-value {
    font-weight: bold;
    margin-left: 75px;
    border: none;
    width: 100px
}

.bhkw-generator-frequence-label {
    margin-left: 20px;
}

.bhkw-image {
    margin: 0 auto;
    min-height: 400px;
    min-width: 400px;
    max-height: 500px;
    max-width: 500px;
}

.bhkw-image-wrapper {
    text-align: center;
}

.menu-background-shape {
    background-color: #ccc;
    height: 400px;
    margin-top: -17px;
}

.ts-dyn-fault-msg {
    margin-top: 50px;
}

.ts-dyn-fault-header {
    margin-top: 50px;
}


#protocol-view-button-row > input {
    margin-right: 5px;
}

#system-list-view .k-autocomplete.k-header {
    min-width: 80%;
}

#system-shares-view-grid {
    min-height: 250px;
}

#dropDownTemplate + div {
    position: fixed;
}

/*gouping row edit buttons*/
.k-grid .k-grouping-row .k-button {
    font-size: 12px;
    border-color: white;
    color: white;
}

    .k-grid .k-grouping-row .k-button:hover {
        border-color: #ff0000;
    }

.groupHeaderStartEditIconStyle {
    color: white;
    opacity: 1;
    background: transparent;
    /*height: auto;*/
    height: 1.2em;
}

#commit-faultmessage-entry {
    background-color: #D9E6EE;
    padding: 5px 5px 5px 5px;
}

#system-list-view-grid > table > tbody > tr > td:nth-child(7) {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.32em 0em;
}

.gateway-info-container {
    display: flex;
    flex: 1;
    flex-direction: row;
}

.gateway-info-form-fields {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 10px;
    gap: 15px 0px;
    flex: 2;
    padding-left: 10px;
}

.gateway-info-form-field > label {
    font-weight: 700;
}

.gateway-info-qr-code {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.gateway-info-form-field {
    display: flex;
    flex-direction: row;
}

.gateway-info-qr-code {
    position: relative;
    display: inline-block;
}

.gateway-info-qr-code-wrapper {
    flex: 1;
}

.gateway-info-form-field > label {
    display: flex;
    align-items: center;
    text-align: left !important;
    width: 115px;
}

.gateway-info-form-field > input {
    width: 455px;
    margin-right: 10px;
}

.energy-management-container {
    padding: 0px 10px;
}

.energy-management-view {
    display: none;
    padding: 10px;
    max-height: 600px;
    overflow-y: scroll;
}

.energy-management-refresh-button {
    margin-top: 10px;
}

.communication-container > label {
    text-align: left;
    width: 150px;
}

.connected-eebus-device-list-item {
    background: #ebebeb;
    margin-bottom: 25px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px 0px;
}

.connected-eebus-device {
    display: flex;
    flex-direction: row;
}

.connected-eebus-device > span {
    width: 140px;
    font-weight: 700;
}

.found-eebus-device-list-item {
    background: #ebebeb;
    margin-bottom: 25px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px 0px;
}

.found-eebus-device {
    display: flex;
    flex-direction: row;
}

.found-eebus-device > span {
    width: 140px;
    font-weight: 700;
}

.found-eebus-device-buttons {
    padding-top: 20px;
    display: flex;
    flex-direction: row;
    gap: 0px 10px;
}

.found-eebus-device-buttons {
    padding-top: 20px;
}

.eebus-info-text {
    width: fit-content !important;
}

.eebus-pin {
    align-items: center;
    display: flex;
}

.eebus-pin > label {
    font-weight: 700;
    width: 100px;
    text-align: left;
}

.firmware-version-message-box {
    display: flex;
    flex-direction: column;    
    gap: 10px;
    margin-right: 15px;
}

.firmware-version-message-box-item {
    display: flex;
    flex-direction: column;
}

.eebus-state-green {
    color: #74B959;
}

.eebus-state-red {
    color: #EB525A;
}