/*
 * SWKN-spezifische Styles. Überschreiben ggf. styles aus der common.css
 */

/************************** Primefaces-Overrides **************************/

.ui-fileupload .pi-plus::before {
    content: "";
}

.ui-inputfield {
    height: 34px;
}

.ui-messages-info-icon, .ui-messages-warn-icon, .ui-messages-error-icon, .ui-messages-fatal-icon, .ui-message-info-icon,
.ui-message-warn-icon, .ui-message-error-icon, .ui-message-fatal-icon {
    background-image: none;
}

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {
    background-image: none;
}

.ui-messages-error, .ui-message-error {
    margin-top: 0px;
    padding: 0px 0px;
    background-color: transparent;
    border: 0px;
}

.ui-selectmanycheckbox.ui-widget td, .ui-selectoneradio.ui-widget td {
    padding-right: 5px;
}

.ui-selectoneradio.ui-widget td .ui-radiobutton {
    margin-left: 10px;
}

.ui-button-text-icon-left .ui-button-text {
    padding: .3em 0.5em .3em 1.1em;
}

.ui-fileupload-buttonbar .ui-button-text {
    padding: 0 0 1px 0px;
}

.ui-widget-header.ui-fileupload-buttonbar {
    background: none;
    border: none;
    padding: 0;
}

.ui-widget-header.ui-fileupload-buttonbar .ui-icon {
    background: none;
}

.ui-fileupload-files .ui-button.ui-state-default.ui-fileupload-cancel {
    background: none;
}

.ui-column-title {
    font-weight: bold;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: black;
    background: white;
}

.ui-accordion-header.ui-state-active, .ui-accordion-header.ui-state-default {
    font-weight: normal;
}

.ui-state-disabled {
    opacity: .65;
}

.ui-datatable-tablewrapper {
    overflow: inherit;
}

.ui-datepicker {
    position: absolute;
}

.ui-widget-overlay {
    z-index: 1997 !important;
}

.ui-selectonemenu.form-control {
    padding: 3px 0;
    width: 100% !important;
}

.ui-selectonemenu.form-control .ui-selectonemenu-trigger {
    width: 25px;
}

.ui-selectonemenu.form-control .ui-selectonemenu-trigger .ui-icon {
    margin-top: 8px;
}

.ui-messages-error-summary, .ui-messages-info-summary, .ui-messages-fatal-summary, .ui-messages-warn-summary,
.ui-message-error-summary, .ui-message-info-summary, .ui-message-fatal-summary, .ui-message-warn-summary {
    margin-left: 0;
}

.zaehlerInput .ui-message-error-summary {
    margin-left: -5px;
}

.ui-messages a {
    text-decoration: underline;
}

.ui-widget-content a {
    color: #337AB7;
}

.ui-draggable h3 {
    margin: 0 0 15px 0;
}

.ui-messages ul {
    margin: 0;
}

.ui-messages-info {
    color: #31B404;
    background-color: transparent;
    border-color: #AAE89F;
}

.ui-messages-warn {
    background-color: #FFFF00;
    border: 0px;
    color: #000;
}

.ui-messages-error, .ui-messages-fatal {
    padding: 0;
}

.ui-messages-info-icon, .ui-messages-warn-icon, .ui-messages-error-icon, .ui-messages-fatal-icon {
    display: none;
}

.ui-fileupload-content {
    border: none;
    background: #F5F7F7;
}

.ui-autocomplete {
    display: block;
}

.ui-autocomplete input {
    display: block;
    width: 100%;
}

/** Prognose Legende **/

div.hidden-xs ul.prognose-legend {
    font-size: smaller;
    padding-left: 80px;
    margin-bottom: 20px;
}

div.visible-xs ul.prognose-legend {
    font-size: smaller;
    padding-left: 40px;
    margin-bottom: 30px;
}

/************************** Bootstrap-Overrides ***************************/
.h1, h1 {
    margin-top: 20px;
}

.h2, h2 {
    margin-top: 20px;
}

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

h1, h2, h3, h4 {
    line-height: 1em;
}

h1, h2, h3, h4 {
    font-size: 1.75em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: Flama, Arial, sans-serif;
    font-weight: bold;
    font-style: normal;
    color: #002e5f;
    text-rendering: optimizeLegibility;
    margin-top: 0;
    margin-bottom: 0.4em;
    line-height: 0.8125em;
    padding-top: 20px;
}

.table > caption + thead > tr:first-child > td, .table > caption + thead > tr:first-child > th,
.table > colgroup + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > th,
.table > thead:first-child > tr:first-child > td, .table > thead:first-child > tr:first-child > th {
    border: 1px solid #e3e4e5;
}

.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn-group:not(:last-child) > .btn, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
    background-color: white;
}

.panel {
    padding: 0;
}

.panel.panel-default {
    padding: 0;
    box-shadow: none;
    border: none;
    border-radius: 0;
}

.panel.panel-default > .panel-heading {
    color: white;
    background-color: #002e5f;
    padding: 7px 10px;
    border-radius: 0;
}

.panel-default > .panel-body {
    padding: 0;
}

.panel-body.no-padding {
    padding: 0;
}

.panel-body.no-padding .form-group {
    padding: 0;
}

.panel-body.no-padding h4 {
    margin-top: 0;
}

.panel-body dl {
    margin-bottom: 10px;
}

.panel-body .form-group {
    padding: 10px 10px 0 0;
    margin-bottom: 10px;
}

.panel-body .form-group label {
    padding: 3px 25px;
    vertical-align: baseline;
}

.panel-body dl.dl-horizontal dt {
    margin-top: 0;
}

.panel-body dl.dl-horizontal dd {
    margin-left: 0;
    margin-bottom: 3px;
}

.text-warning {
    color: #E49000;
}

.dropdown-menu > form > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.dropdown-menu > form > li > a:focus, .dropdown-menu > form > li > a:hover {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}

.dl-horizontal dt {
    padding-left: 10px;
    text-align: left;
}

.navmenu {
    width: 170px;
}

.navmenu-nav > li {
    padding: 0;
    line-height: 1.8em;
    border-bottom: 1px dotted white;
    background-color: rgba(201, 4, 24, 0.77);
}

.navmenu-default .navmenu-nav > li > a, .navbar-default .navbar-offcanvas .navmenu-nav > li > a {
    display: block;
    padding: .4em 1.2em;
    color: white;
    font-size: 1.2em;
    background: url("/onlineservices/javax.faces.resource/images/m_navigation_arrow.png.xhtml?conversationContext=1") no-repeat 95% 50%;
    background-size: 25px;
}

.dropdown-menu > li {
    color: #333;
    padding: 0 10px 0 15px;
}

.navbar-brand {
    line-height: 90px;
    height: 90px;
    padding-top: 0;
}

.navbar-default .navbar-collapse {
    border-color: #bcbdbf;
}

.navbar-default .navbar-toggle {
    float: left;
}

.navbar-default .navbar-nav > li > a {
    padding-top: 6px;
    padding-bottom: 7px;
    color: white;
}

.form-group label {
    background-color: transparent;
}

.dropdown-menu {
    min-width: 220px;
}

.navmenu-default, .navbar-default .navbar-offcanvas {
    background-color: transparent;
    border-right-style: none;
}

.fa-2x {
    font-size: 1.5em;
}

.ui-icon.fa {
    text-indent: 0;
    background-image: none;
}

.fa-rotate-45 {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.fa-rotate-315 {
    -webkit-transform: rotate(315deg);
    -ms-transform: rotate(315deg);
    transform: rotate(315deg);
}

/************************** eigene Style-Klassen **************************/

/* Übergeordnete Panels, z.B. auf "Meine Daten" - "Daten des Geschäftspartners" */
.panel.panel-wrapper {
    padding: 15px;
    box-shadow: 0 0 4px #B3B3B3;
    color: black;
}

.panel.panel-wrapper > .panel-heading {
    padding-left: 0;
    background: none;
    font-size: 24px;
}

/* Lade-Animation */
#loadingDlg {
    background: #555;
    border: 1px solid #555;
    border-radius: 10px;
    box-shadow: none;
    opacity: 0.9;
    z-index: 9999 !important;
}

#loadingDlg .loading-text {
    font-size: smaller;
    color: #fff;
}

.ui-datatable tbody td {
    border: 1px solid #e3e4e5;
}

h2.abstand-bottom-50 {
    margin-bottom: 50px;
}

h2.abstand-bottom-25 {
    margin-bottom: 25px;
}

h2.abstand-bottom-20 {
    margin-bottom: 20px;
}

.form-inline .form-control.inline-calendar {
    border: none;
}

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

div.center-wrapper div.center-container {
    display: inline-block;
    text-align: left;
}

/*
 * Popup
 */

.popup {
    z-index: 4000 !important;
}

.dialog-no-padding .ui-dialog-content {
    padding: 0;
}

input[type=date], input[type=time], input[type=datetime-local], input[type=month] {
    min-width: 150px;
    min-height: 34px;
}

/* ------------------------ */
/* media abhängige styles   */
/* ------------------------ */

/****************************** mobile (xs) ***********************************/
@media (max-width: 767px) {
    /************************** Allgemein *************************************/
    body {
        background-color: white;
    }

    /************************** Primefaces-Overrides **************************/
    .ui-datatable-reflow thead th,
    .ui-datatable-reflow tfoot td {
        display: none;
    }

    .ui-datatable-reflow .ui-datatable-data td {
        text-align: left;
        display: block;
        border: 0 none;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        clear: left;
        background-color: #f6f8f8;
        margin-bottom: 3px;
    }

    .ui-datatable-reflow .ui-datatable-data td.ampel {
        text-align: left;
    }

    .ui-datatable-reflow .ui-datatable-data.ui-widget-content {
        border: 0 none;
    }

    .ui-datatable-reflow .ui-datatable-data tr.ui-widget-content {
        border-left: 0 none;
        border-right: 0 none;
    }

    .ui-datatable-reflow .ui-datatable-data td .ui-column-title {
        padding: .4em;
        min-width: 30%;
        display: inline-block;
        margin: -.4em 1em -.4em -.4em;
        width: 50%;
        font-weight: normal;
        text-align: left;
    }

    .ui-datatable-reflow .ui-datatable-data tr.ui-widget-content.ui-datatable-odd td {
        background-color: lightgray;
    }

    .ui-datatable-reflow .ui-datatable-data td .data-value {
        width: 35%;
        font-weight: bold;
        text-align: right;
        float: right;
    }

    .ui-fileupload-content .ui-widget-content {
        border: none;
    }

    .dl-horizontal dt {
        padding-left: 0;
    }

    .ui-button, .ui-button.ui-state-default {
        background-color: #00A8E1;
        border-color: #008AB8;
        /*padding-left: 25px;*/
        /*height: 26px;*/
        color: #FFF;
        border: 0;
        border-radius: 0;
        margin-right: 5px;
        margin-bottom: 5px;
        text-decoration: none;
    }

    /************************** Bootstrap-Overrides ***************************/
    h2, .h2 {
        margin-top: 5px;
        font-size: 24px;
    }

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

    .navbar-right {
        margin-right: 0;
    }

    .nav.navbar-nav {
        margin-top: 0;
        margin-bottom: 0;
    }

    .navbar-nav > li {
        float: left;
    }

    .navbar-nav .open .dropdown-menu {
        position: absolute;
        left: auto;
        right: 0;
        float: left;
        /* margin-top: 0; */
        background-color: #fff;
        /* border: 0; */
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    }

    .navbar-default .navbar-toggle {
        margin-top: 10px;
        border: none;
        padding-top: 5px;
        margin-left: 10px;
    }

    .navbar-default .navbar-toggle, .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
        background-color: transparent;
        border-radius: 0;
    }

    .navbar-default #vertragskontoForm select {
        margin: 10px;
        color: black;
        border: 4px solid transparent;
        border-radius: 3px;
    }

    .navbar-brand {
        padding: 0;
        line-height: 100%;
        width: 100%;
        height: auto;
    }

    .navbar-brand img {
        max-width: 100%;
        height: auto;
        display: inline-block;
        vertical-align: middle;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: white;
        width: 30px;
        height: 3px;
        border-radius: 2px;
        border: 2px solid white;
    }

    .btn, .btn-group {
        width: 100%;
    }

    .panel-body dl.dl-horizontal dd {
        background-color: #f6f6f7;
    }

    .panel-body .form-group {
        margin-left: 0;
    }

    .panel-body .form-group label {
        padding: 8px;
    }

    .navmenu-default .navmenu-nav > li > a:hover, .navbar-default .navbar-offcanvas .navmenu-nav > li > a:hover,
    .navmenu-default .navmenu-nav > li > a:focus, .navbar-default .navbar-offcanvas .navmenu-nav > li > a:focus {
        color: #bbb;
    }

    /************************** eigene Style-Klassen **************************/
    .main {
        /*margin-top: 8%;*/
    }

    .main .row.stage {
        margin: 0;
    }

    .formpanel {
        margin-top: 10px;
        /*border: none;*/
        margin-bottom: 0;
        background-color: white;
        padding: 15px;
    }

    .formpanel h2 {
        margin: 15px 0;
    }

    .main .header-title .inner h2 {
        padding: 0 15px 10px;
        margin-top: 0;
    }

    .main .tile {
        /*height: 60px;*/
        padding: 0;
        margin-bottom: 10px;
        box-shadow: 0 0 4px #d0d0d1;
    }

    .main .tile .cont {
        height: 65px;
        background: url("/onlineservices/javax.faces.resource/images/mvv/landing_arrow.png.xhtml?conversationContext=1") top right no-repeat white;
        background-size: contain;
    }

    .main .tile .cont img {
        margin: 3px 8px;
    }

    .navbar#mobile-header {
        background: none;
    }

    .navbar#mobile-footer {
        background: none;
    }

    .navbar#mobile-header {
        background: none;
    }

    .mobileDate {
        width: 100%;
    }

    #zaehlerstand .ui-datatable-reflow .ui-datatable-data td .ui-column-title {
        width: 40%;
    }

    #zaehlerstand .ui-datatable-reflow .ui-datatable-data td .data-value {
        width: 40%;
        text-align: left;
    }

}

/************************** nicht-mobile (sm, md, lg) *************************/
@media (min-width: 768px) {
    /************************** Allgemein *************************************/
    body {
        background-color: white;
    }

    /************************** Primefaces-Overrides **************************/
    .ui-datatable-data {
        text-align: left;
    }

    .ui-datatable-tablewrapper thead th.ampel {
        text-align: left;
    }

    .ui-datatable-data td.ampel {
        text-align: left;
    }

    .dl-horizontal dt {
        padding-left: 0;
    }

    /************************** Bootstrap-Overrides ***************************/
    .form-horizontal .control-label {
        text-align: left;
    }

    /************************** eigene Style-Klassen **************************/
    .main .header-title {
        margin-top: 30px;
        /*margin: 30px 15px 0 15px;*/
        min-height: 135px;
        margin-bottom: -5px;
    }

    div.schatten {
        background: url("/onlineservices/javax.faces.resource/images/header_schatten_2.png.xhtml?conversationContext=1") no-repeat top;
        background-size: 100% 100%;
        height: 30px;
    }

    /* für die Anrede auf der Landing-Page */
    .main .header-title .inner {
        background: rgba(255, 255, 255, 0.65);
        min-height: 100px;
        line-height: 100px;
    }

    .main .header-title .inner h2 {
        vertical-align: middle;
        display: inline-block;
        padding: 0 30px;
    }

    .main .tile {
        padding: 0 15px;
        background: url("/onlineservices/javax.faces.resource/images/kachel_schatten.png.xhtml?conversationContext=1") no-repeat bottom;
        background-size: 95% 36%;
        height: 130px;
    }

    .main .banner-large .tile {
        padding: 0;
        background-size: 93% 12%;
        background-position-x: 130%;
        height: 390px;
    }

    .main .tile .cont img {
        margin: 6% 0 7% 20%;
        width: 20%;
    }

    /* padding für inputs in inline layouteten Formularen */
    .form-inline .form-group.inline-padding {
        padding-right: 20px;
    }

    .form-horizontal .control-label.label-lift {
        padding-top: 0;
    }

}

/****************************** ab iPad Landscape (md, lg) ***********************************/
@media (min-width: 992px) {
    .main .tile .cont img {
        margin: 15% 0 15% 12%
    }
}

/****************************** Desktop groß (lg) ***********************************/
@media (min-width: 1200px) {
    .main .tile .cont img {
        margin: 11% 0 12% 15%
    }
}

/* Fügt dem body die aktuelle Viewport-Größe hinzu, damit diese in der entsprechenden js-Funktion erkannt
   werden kann */

body::before {
    display: none;
    content: "xs";
}

@media (min-width: 768px) {
    body::before {
        content: "sm";
    }
}

@media (min-width: 992px) {
    body::before {
        content: "md";
    }
}

@media (min-width: 1200px) {
    body::before {
        content: "lg";
    }
}

h3.errorHeadline {
    margin: 20px 0 20px 0;
}

@font-face {
    font-family: "Flama";
    src: url("/onlineservices/javax.faces.resource/fonts/Flama-Book.eot.xhtml?conversationContext=1");
    src: url("/onlineservices/javax.faces.resource/fonts/Flama-Book.eot.xhtml?conversationContext=1") format('embedded-opentype'), url("/onlineservices/javax.faces.resource/fonts/Flama-Book.woff.xhtml?conversationContext=1") format('woff'), url("/onlineservices/javax.faces.resource/fonts/Flama-Book.svg.xhtml?conversationContext=1") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Flama";
    src: url("/onlineservices/javax.faces.resource/fonts/Flama-Bold.eot.xhtml?conversationContext=1");
    src: url("/onlineservices/javax.faces.resource/fonts/Flama-Bold.eot.xhtml?conversationContext=1") format('embedded-opentype'), url("/onlineservices/javax.faces.resource/fonts/Flama-Bold.woff.xhtml?conversationContext=1") format('woff'), url("/onlineservices/javax.faces.resource/fonts/Flama-Bold.ttf.xhtml?conversationContext=1") format('truetype'), url("/onlineservices/javax.faces.resource/fonts/Flama-Bold.svg.xhtml?conversationContext=1") format("svg");
    font-weight: bold;
    font-style: normal;
}

body, .ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: 'Flama', sans-serif;
}

.main .tile .landing-item {
    font-family: 'Flama', sans-serif;
}

i.fa.ci, a.linkarrow {
    color: #00a8e1;
}

.ui-button .ui-button-text {
    font-weight: normal;
    font-size: 14px;
    /*	padding: 0 0 1px 7px;*/
}

.ui-slider-handle.ui-state-default {
    background: #00a9e9;
}

.ui-widget-header, .ui-datepicker-header {
    background: #00a9e9;
    border-color: #00a9e9;
}

.ui-datepicker-next.ui-corner-all.ui-datepicker-next-hover.ui-state-hover, .ui-datepicker-prev.ui-corner-all.ui-datepicker-prev-hover.ui-state-hover {
    background: #002e5f;
    border: 1px solid #002e5f;
}

.ui-datepicker .ui-state-focus .ui-icon, .ui-datepicker .ui-state-hover .ui-icon {
    background-color: #002e5f;
}

.ui-fileupload-simple .ui-state-hover {
    background-color: #008AB8;
}

.ui-selectonemenu-trigger.ui-state-default {
    background-color: #00a9e9;
}

.ui-selectonemenu-trigger.ui-state-default.ui-state-hover, .ui-selectonemenu-trigger.ui-state-default.ui-state-focus {
    background-color: #0094cd;
}

.ui-state-default .ui-icon, .ui-state-hover .ui-icon {
    background-image: url("/onlineservices/javax.faces.resource/images/ui-icons_ffffff_256x240.png.xhtml?conversationContext=1");
}

.ui-state-active .ui-icon {
    background-image: url("/onlineservices/javax.faces.resource/images/swk/ui-icons_00a8e1_256x240.png.xhtml?conversationContext=1");
}

.ui-chkbox-box.ui-state-active .ui-icon.ui-icon-check {
    background-color: #fff;
}

.ui-chkbox .ui-chkbox-box {
    border-color: #bcbdbf;
    width: auto;
    height: auto;
}

.ui-chkbox-box.ui-state-hover .ui-icon {
    background-color: white;
}

.ui-state-focus .ui-icon, .ui-state-hover .ui-icon {
    background-color: #0094cd;
}

.ui-radiobutton-box.ui-state-hover .ui-icon {
    background-color: transparent;
}

.ui-state-default {
    background-color: #fff;
}

.ui-draggable .ui-dialog-titlebar {
    background: #00a9e9;
}

.removeButton.ui-button .ui-button-text.ui-c, .removeButton.ui-button.ui-state-default .ui-button-text.ui-c {
    margin-left: -6px;
    margin-top: -2px;
}

.formpanel {
    background-color: white;
    margin-bottom: 0px;
    border: 0px !important;
    border-radius: 4px 4px 0;
    /*padding: 15px 15px 30px 30px;*/
}

.ui-datatable thead th, .ui-datatable tfoot td {
    text-align: left;
}

.ui-widget-content {
    border: 1px solid white;
}

.ui-accordion .ui-accordion-header.ui-state-default, .ui-accordion .ui-accordion-header.ui-state-active {
    background-color: #002e5f;
}

.navbar {
    height: 30px;
    border: none;
}

.panel-body p {
    padding: 10px;
    background-color: white;
    margin-bottom: 2px;
}

.panel-body.form-horizontal {
    background-color: white;
}

.panel-body dl.dl-horizontal dd, .panel-body dl.dl-horizontal dt {
    margin-top: 3px;
    /*margin-left: 0;*/
    background-color: white;
    padding: 3px 10px 2px 10px;
    font-size: 14px;
}

button.ui-button {
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0.5) inset;
    box-shadow: 0 0 0 rgba(255, 255, 255, 0.5) inset;
    -webkit-transition: background-color 300ms ease-out;
    -moz-transition: background-color 300ms ease-out;
    transition: background-color 300ms ease-out;
    padding-top: 0.8125em;
    padding-bottom: 0.75em;
    -webkit-appearance: none;
    padding-left: 1.5em;
    font-size: 0.9375em;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    padding-right: 1.5em;
    border-style: solid;
    border-width: 0 0 2px 0;
    cursor: pointer;
    font-family: inherit;
    font-weight: normal;
    line-height: 1;
    margin: 10px 10px 10px 0px;
    position: relative;
    text-decoration: none;
    text-align: center;
    background-color: #00A8E1;
    border-color: #008AB8;
    color: #fff;
}

.removeButton.ui-button, .removeButton.ui-button.ui-state-default {
    height: 30px;
    width: 30px;
    padding: 0;
    margin-left: 15px;
    background-color: #00A8E1;
    border-color: #008AB8;
    color: #fff;
}

.removeButton.ui-button:hover {
    background-color: #008AB8;
    border-color: #008AB8;
    color: #fff;
}

button.ui-button:hover {
    background-color: #008AB8;
    border-color: #008AB8;
    color: #fff;
}

.navbar#mobile-header p, .navbar#desktop#desktop-header {
    margin-top: 8px;
    margin-bottom: 8px;
}

.navbar#mobile-footer p, .navbar#desktop#desktop-footer p {
    margin-top: 8px;
    margin-bottom: 8px;
}

.navbar#mobile-footer p {
    font-size: 10px;
    /*margin-top: 20px;*/
    text-align: left;
}

.navbar#mobile-header p {
    font-size: 10px;
    /*margin-top: 20px;*/
    text-align: left;
}

.navbar#mobile-footer .container {
    margin-top: 30px;
    padding: 0 15px;
    color: #777;
}

.navbar#mobile-header .container {
    margin-top: 30px;
    padding: 0 15px;
    color: #777;
}

.navbar-default {
    background-color: #00a8e1;
}

.navbar#mobile-footer {
    background: #00a8e1;
}

.navbar#mobile-header {
    background: #00a8e1;
}

.navbar#desktop-footer {
    padding-top: 1em;
    padding-bottom: 1em;
    color: white;
    background: #00a8e1;
    background-image: none;
    background-repeat: repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    margin-top: 40px;
    padding-top: 40px;
    background-image: url(https://www.swkiel-netz.de/swkn/media/technical_files/img/segel.png);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    height: auto;
}

.navbar#mobile-footer {
    padding-top: 1em;
    padding-bottom: 1em;
    color: white;
    background: #00a8e1;
    background-image: none;
    background-repeat: repeat;
    background-position-x: 0%;
    background-position-y: 0%;
    margin-top: 40px;
    background-image: url(https://www.swkiel-netz.de/swkn/media/technical_files/img/segel.png);
    background-repeat: no-repeat;
    background-position: 100% 100%;
    height: auto;
}

.navbar#mobile-header {
    background: #002e5f;
}

.navbar#desktop-header {
    background: #002e5f;
    border: none;
}

.navbar {
    position: relative;
    min-height: 30px;
    margin-bottom: 20px;
}

.navbar {
    position: relative;
    min-height: 30px;
    margin-bottom: 20px;
}

.navbar#mobile-footer p, .navbar#desktop#desktop-footer p {
    margin-top: 8px;
    margin-bottom: 8px;
}

.navbar#mobile-header p, .navbar#desktop#desktop-header p {
    margin-top: 8px;
    margin-bottom: 8px;
}

.navbar#mobile-footer p {
    font-size: 10px;
    /*margin-top: 20px;*/
    text-align: left;
}

.navbar#mobile-header p {
    font-size: 10px;
    /*margin-top: 20px;*/
    text-align: left;
}

.navbar#mobile-footer .container {
    margin-top: 30px;
    padding: 0 15px;
    color: #777;
}

.navbar#mobile-header .container {
    margin-top: 30px;
    padding: 0 15px;
    color: #777;
}

.netzebar-default {
    background-color: #00a8e1;
}

.netzebar#mobile-footer {
    background: #00a8e1;
}

.netzebar#desktop-footer {
    background: #00a8e1;
    border: none;
}

.netzebar#mobile-header {
    background: #00a8e1;
}

.netzebar#desktop-header {
    background: #00a8e1;
    border: none;
}

.netzebar {
    position: relative;
    min-height: 30px;
    margin-bottom: 20px;
}

.netzebartext {
    color: white;
}

.ui-fileupload .ui-widget-header {
    border: inherit;
    background: inherit;
}

.ui-fileupload-content .ui-progressbar .ui-progressbar-value {
    background-color: #008AB8;
    border-color: #008AB8;
    color: #fff;
}

.ui-fileupload .ui-state-default:hover {
    color: #0094cd;
    text-decoration: none;
    line-height: inherit;
    background: transparent;
    border: none;
}

.ui-fileupload .ui-state-default {
    color: #00a8e1;
    text-decoration: none;
    line-height: inherit;
    background: transparent;
    border: none;
}

span.h1 {
    line-height: 1;
}

span.h1 {
    color: #FFFFFF;
    margin-bottom: 0;
    font-size: 30px;
    line-height: 1em;
    font-family: Flama, Arial, sans-serif;
    font-style: normal;
    font-weight: bold;
    margin-top: 0;
    text-rendering: optimizelegibility;
    padding: 0px;
}

#title-area {
    margin-bottom: 20px;
    padding-top: 1em;
    padding-bottom: 1em;
    color: white;
    background: #00a8e1;
}

#mobile-title-area {
    margin-bottom: 20px;
    padding-top: 1em;
    padding-bottom: 1em;
    color: white;
    background: #00a8e1;
}

.form-horizontal .form-group {
    margin-right: 0px;
    margin-left: 0px;
    background: #F5F7F7;
    padding-top: 15px;
    padding-bottom: 15px;
}

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

.zaehlerInputContainer {
    background: #F5F7F7;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
}

.ui-outputlabel-rfi {
    margin-left: 0;
    color: #00a8e1;
}

#desktop-footer .claim-box {
    margin-bottom: 20px;
}

.footerLink {
    padding-right: 15px;
    color: white !important;
}

.navbar#mobile-footer a, .navbar#desktop#desktop-footer a {
    padding-right: 15px;
    color: white !important;
}

#desktop-footer .footerLink {
    padding-right: 15px;
    color: white !important;
}

.footerLinkMobile {
    padding-right: 15px;
    padding-left: 15px;
    color: white;
}

.footerLinkMobile {
    padding-right: 15px;
    padding-left: 15px;
    color: white;
}

.navbar-text {
    float: left;
    margin-right: 0px;
    margin-left: 0px;
}

.logo {
    vertical-align: middle;
    display: inline-block;
    height: 100px;
    width: 251px;
    padding: 15px;
}

select {
    color: black;
}

.btn-primary {
    color: #00a8e1;
    text-decoration: none;
    line-height: inherit;
    background: transparent;
}

.btn-primary:focus {
    color: #0094cd;
    text-decoration: none;
    line-height: inherit;
    background: transparent;
}

.row {
    margin-right: 0px;
    margin-left: 0px;
}

.container {
    padding-right: 0px;
    padding-left: 0px;
}

.layout-container {
    padding-right: 0px;
    padding-left: 15px;
}

.navbar-text {
    float: left;
    margin-right: 0px;
    margin-left: 20px;
}

.navbar {
    border-radius: 0px;
}

.abschicken-button {
    float: right;
}

a:focus, a:hover {
    color: #0094cd;
    text-decoration: none;
}

a {
    color: #00a8e1;
    background-color: transparent;
}

.ui-fileupload-buttonbar .ui-fileupload-choose input {
    font-size: 20px;
}

.ui-inputfield.strasse {
    width: 75%;
    float: left;
    margin-right: 5%;
}

.hausnummer {
    float: left;
    width: 20%;
}

.ui-datatable thead th, .ui-datatable tfoot td {
    padding: 0.625em 0.625em 0.625em 0.625em;
    text-align: left;
}

.ui-datatable .ui-sortable-column {
    cursor: pointer;
}

#zaehlerstandsmeldungForm th {
    color: #002E5F;
    font-weight: bold;
    font-size: 16px;
}

.ui-datatable thead th {
    border-color: #FFF;
    background: transparent;
}

.ui-datatable thead th, .ui-datatable tbody td, .ui-datatable tfoot td {
    overflow: hidden;
    white-space: nowrap;
    border-style: solid;
}

table thead tr th, table tfoot tr th, table tbody tr td, table tr td, table tfoot tr td {
    display: table-cell;
    line-height: 1.125em;
    border-width: 0px !important;
}

table tr th, table tr td {
    color: #000;
    vertical-align: bottom;
}

.ui-datatable thead, .ui-datatable-scrollable-header-box, .ui-datatable-scrollable-footer-box, .ui-treetable thead, .ui-treetable-scrollable-header-box, .ui-datatable-scrollable-footer-box {
    font-weight: normal;
    color: #555555;
}

table tr.even, table tr.alt, table tr:nth-of-type(2n) {
    background: #f5f7f7;
    border-width: 0px !important;
}

.ui-widget-content {
    border: 0px solid #dadada;
}

table thead, table tfoot {
    background: #dbe1e7;
    font-weight: bold;
    border-width: 0px !important;
}

.pruefenButton {
    float: right;
}

#zaehlerstandsmeldungForm .versendenButton {
    float: right;
    background-color: #5CC151 !important;
    border-color: #48AC3D !important;
    color: #fff !important;
}

#zaehlerstandsmeldungForm .versendenButton:hover {
    background-color: #48AC3D;
}

.ui-messages-info-summary, .ui-messages-warn-summary, .ui-messages-error-summary, .ui-messages-fatal-summary, .ui-message-info-summary, .ui-message-warn-summary, .ui-message-error-summary, .ui-message-fatal-summary {
    font-weight: bold;

}

.zaehlerWarnContainer {
    background: #FFFF00;
    padding-top: 20px;
    padding-bottom: 20px;
}

/*.ui-selectonemenu {
	padding-right: 0px;
}*/

.ui-selectonemenu .ui-selectonemenu-trigger {
    width: 22px;
}

.h2, h2 {
    font-size: 30px;
    font-weight: bold;
}

#zaehlerstandsmeldungForm .white {
    background: white !important;
}

.col-sm-4, .col-sm-8, .col-sm-9 {
    padding-left: 0px;
}

.ui-fileupload-buttonbar .ui-button .ui-button-text {
    display: inline-block;
}

.ui-fileupload-buttonbar .ui-button {
    padding: 0px;
}

#eingabeVerbrauchstelleForm .searchVerbrauchsstelleButton {
    margin-left: 20px;
}

#eingabeVerbrauchstelleForm .formularStartButton {
    margin-left: 20px;
}

#eingabeVerbrauchstelleForm .pagelabel, #ablesebelegErfolgForm .pagelabel {
    display: none;
}

#zaehlerstandsmeldungForm .pagelabel, #zaehlerstandsmeldungForm .pagetitle, #ablesebelegErfolgForm .pagetitle {
    display: none;
}

.datenschutzHinweis {
    padding-bottom: 15px;
    padding-right: 10px;
}

.panelGridLeftCenter td {
    vertical-align: inherit;
    height: 100px;
    width: 600px;
}

.ui-chkbox .ui-chkbox-box.ui-state-error {
    border-color: #C4000C;
}