
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 300;
    src: url(../fonts/roboto-v18-latin-300.eot);
    src: local('Roboto Light'), local('Roboto-Light'), url(../fonts/roboto-v18-latin-300.eot?#iefix) format('embedded-opentype'),
    url(../fonts/roboto-v18-latin-300.woff2) format('woff2'), url(../fonts/roboto-v18-latin-300.woff) format('woff'),
    url(../fonts/roboto-v18-latin-300.ttf) format('truetype'), url(../fonts/roboto-v18-latin-300.svg#Roboto) format('svg');
    font-display: fallback
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/roboto-v18-latin-500.eot);
    src: local('Roboto Medium'), local('Roboto-Medium'), url(../fonts/roboto-v18-latin-500.eot?#iefix) format('embedded-opentype'),
    url(../fonts/roboto-v18-latin-500.woff2) format('woff2'), url(../fonts/roboto-v18-latin-500.woff) format('woff'),
    url(../fonts/roboto-v18-latin-500.ttf) format('truetype'), url(../fonts/roboto-v18-latin-500.svg#Roboto) format('svg');
    font-display: fallback
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/roboto-v18-latin-regular.eot);
    src: local('Roboto'), local('Roboto-Regular'), url(../fonts/roboto-v18-latin-regular.eot?#iefix) format('embedded-opentype'),
    url(../fonts/roboto-v18-latin-regular.woff2) format('woff2'), url(../fonts/roboto-v18-latin-regular.woff) format('woff'),
    url(../fonts/roboto-v18-latin-regular.ttf) format('truetype'), url(../fonts/roboto-v18-latin-regular.svg#Roboto) format('svg');
    font-display: fallback
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/roboto-v18-latin-500.eot);
    src: local('Roboto Medium'), local('Roboto-Medium'), url(../fonts/roboto-v18-latin-500.eot?#iefix) format('embedded-opentype'),
    url(../fonts/roboto-v18-latin-500.woff2) format('woff2'), url(../fonts/roboto-v18-latin-500.woff) format('woff'),
    url(../fonts/roboto-v18-latin-500.ttf) format('truetype'), url(../fonts/roboto-v18-latin-500.svg#Roboto) format('svg');
    font-display: fallback
}
@font-face {
    font-family: Roboto;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/roboto-v18-latin-700.eot);
    src: local('Roboto Bold'), local('Roboto-Bold'), url(../fonts/roboto-v18-latin-700.eot?#iefix) format('embedded-opentype'),
    url(../fonts/roboto-v18-latin-700.woff2) format('woff2'), url(../fonts/roboto-v18-latin-700.woff) format('woff'),
    url(../fonts/roboto-v18-latin-700.ttf) format('truetype'), url(../fonts/roboto-v18-latin-700.svg#Roboto) format('svg');
    font-display: fallback
}
.alert-danger a:hover{
    color: #c5b100;
}

.costOfYear .small{
    white-space: pre;
}
.control-label.value-label strike,
.costOfYear strike {
    font-size: 0.85em;
}
body.hideMenu #main{
    margin-top: 0;
    padding: 0 15px;
}
body.hideMenu form > .highlight-csit-panel > .panel-heading,
body.hideMenu .breadcrumb{
    display: none;
}
.inner.selectpicker > li > a:hover, .inner.selectpicker > li > a:focus, body, #accordionMenu h2,
.product-price-container .main-price-line > .big-price,.form-horizontal .key-label.control-label,
.bootstrap-select button, a.list-group-item.active:focus, .form-group-panel-default .form-group .value-label,
#dashboard .widget-panel > .panel-heading .dropdown ul.dropdown-menu li a,
p.lead,a.list-group-item:hover, a.list-group-item:focus, a.list-group-item.active, a.list-group-item.active:hover,
#accordionMenu h2, p.lead,.btn, .panel-body .radio-checkbox-headline-table-cell.has-pretty-child label,
h4.read,.breadcrumb, .breadcrumb a, .breadcrumb a:hover,.breadcrumb > li + li:before,.breadcrumb > .active,
.navbar-default .navbar-brand, #topMenu .navbar-nav > li > a,.headHeadline,a.form-link,.btn,.font-normal,
.form-group-panel-radio-check .form-group .value-label,.breadcrumb > li + li:before,.inner.selectpicker > li > a:hover,
.inner.selectpicker > li > a:focus,#dashboard .widget-panel > .panel-heading .dropdown ul.dropdown-menu li a,
.font-bold, .control-label.text-left,.mv-pre-comma,.mv-comma, .mv-post-comma,div.input-seperator:before,
.product-price-container .main-price-line > .big-price,.btn,.form-group-panel-default .form-group .key-label,
.form-group-panel-default > h4,
.form-group-panel-radio-check .form-group .key-label,.breadcrumb > .active,.control-label.text-left,
.list-group-item-info,a.list-group-item:hover, a.list-group-item:focus, a.list-group-item.active,
a.list-group-item.active:hover, a.list-group-item.active:focus,.panel-body > h3,.panel-default > .panel-heading,
.datepicker td.today, .datepicker td.today:hover, .datepicker td.active:hover, .datepicker td.active:hover:hover,
.datepicker td.active:focus, .datepicker td.active:hover:focus, .datepicker td.active:active,
.datepicker td.active:hover:active, .datepicker td.active.active, .datepicker td.active:hover.active,
.datepicker td.active.disabled, .datepicker td.active:hover.disabled, .datepicker td.active[disabled],
.datepicker td.active:hover[disabled], .datepicker td span.active:hover, .datepicker td span.active:focus,
.datepicker td span.active:active, .datepicker td span.active.active, .datepicker td span.active.disabled,
.datepicker td span.active[disabled],#dashboard .widget-panel .row h4,#subDashboard .widget-panel .row h4{
    font-family: 'Roboto', Arial, Verdana, Helvetica, sans-serif;
}


.panel-default > .panel-heading,#accordionMenu h2,#accordionMenu a.list-group-item.active,
#accordionMenu a.list-group-item:hover,.panel-title,.open > .dropdown-toggle.btn-default, .big-price,
#topMenu .navbar-nav > li > a:hover, .navbar-default .navbar-brand:hover,.form-control,.form-control:focus,
.bootstrap-select.form-control button,.input-group-addon,.btn-group .btn-default:hover,.btn-group .btn-default:focus
{color: #1a171b;}

body{
    color: #1a171b;
    background: #fff;
}
#logoLi{
    display: inline-block;
}
img#logo{
    position: absolute;
    left: 20px;
    top: 20px;
    margin: 0;
    max-height: 59px;
}

#topMenu{z-index: 11;}
#metaNavi {
    position: absolute;
    right: 20px;
    top: 34px;

}
#metaNavi > span {
    display: block;
    text-align: right;
    color: #676369;
    font-size: 16px;
    margin-top: 10px;
}
#metaNavi a{
    color: #000;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
}
#metaNavi a:before{
    font-family: 'FontAwesome', serif;
    content: "\f015";
    margin-right: 5px;
    font-size: 24px;
    font-weight: 400;
    display: inline-block;
    position: relative;
    top: 2px;
}
#metaNavi a.loginLink:before{content: "\f090";}
#metaNavi a.logoutLink:before{content: "\f08b";}
.homelink{margin-right: 20px;}

#cage, .wrapper{
    max-width: 980px;
    margin: 0 auto;
    position: relative;
    width: 100%;
}
#main{width: 100%; min-height: 650px; }
footer {
    clear: both;
    border-top: solid 10px #FFE500;
    background: #eee;
    color: #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 0;
    margin: 0;
}
footer p.copyright {
    float: right;
    margin: 0 20px 0 0;
    font-weight: 700;
}
footer ul {
    float: left;
    margin: 0 0 0 20px !important;
    padding-left: 0;
    width: auto;
}
footer ul li {
    display: inline;
    float: left;
    padding: 0;
    background: none;
    margin: 0 15px 0 0;
}
footer ul li a, footer ul li span {
    display: block;
    color: #000 !important;
    font-size: 18px;
    font-weight: 400;
    text-decoration: none;
}
footer ul li a:hover{ text-decoration: underline; color: #FFF; }
footer a.icon {
    width: 103px;
    height: 105px;
    background: transparent url(../images/de_DE/top.png) no-repeat left top;
    position: absolute;
    left: 50%;
    top: -48px;
    margin: 0 0 0 -51px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    color: #7db34b;
    line-height: 128px;
    text-transform: uppercase;
}
p{line-height: 1.3em;}

.navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #666666;
}
.bootstrap-select.btn-group .dropdown-menu li > a:hover{ border-left: none;}
.open > .dropdown-menu.selectpicker > li a {
    min-height: 33px;
}
.form-horizontal .form-group:last-child {
    margin-bottom: 0;
}
.form-horizontal .row .form-group:last-child, #newAccountData, .form-horizontal .messageGroup .form-group:last-child,
.form-horizontal .debitDivergingHolder .form-group:last-child,
.form-horizontal #generic_bankName .form-group:last-child,
.form-horizontal .pNational .form-group:last-child {
    margin-bottom: 15px;
}

.withNoContent.has-pretty-child > span {vertical-align: middle;}
.withNoContent.has-pretty-child > div{vertical-align: top;}

.panel-default{border: none;}
.panel-default > .panel-heading{
    padding: 10px 0; border: none; background-color: transparent;
}
.panel-default > .panel-body{
    padding: 15px 0;
}
.bootstrap-select.form-control button span.caret{ color: #676369;}
.panel-title, p.lead{font-size: 22px; color: #000;}
.panel-title.highlight-csit{font-size: 30px;}

.input-group-addon{ border-color: #b2b2b2; background-color: #FFF; }
.form-control, .bootstrap-select.form-control button,.bootstrap-select.form-control button:hover,
.selectpicker.btn-default, .bootstrap-select.open .dropdown-toggle.btn-default{
    border-color: #b2b2b2;
    outline: none !important;
    box-shadow: none;
    font-weight: 400;
    font-size: 16px;
}
.form-control:focus,.selectpicker.btn-default, .bootstrap-select.open .dropdown-toggle.btn-default,
.bootstrap-select.form-control button:focus,.btn-group .btn-default:active,.form-control:focus,
.bootstrap-select.form-control button:focus, .form-control.alert-default:focus{
    border-color: #1a171b;
    box-shadow: none;
    outline: none !important;
}
.bootstrap-select > .dropdown-menu.open{
    border-top: 1px solid #EEE;
    padding-top: 0;
}
.bootstrap-select.btn-group .dropdown-menu{border: 1px solid #EEE;}
.open > .dropdown-menu.selectpicker > li a, .open > .dropdown-menu.selectpicker > li a:hover{
    padding: 2px 14px;
}
.bootstrap-select.btn-group .dropdown-menu li:last-child > a:hover{border-bottom: none;}
.using-glyphicons{color: #b2b2b2; }

.typeahead.dropdown-menu{
    width: calc(100% - 30px);
    border: 1px solid #EEE !important;
    margin: -1px 0 0;
}
.typeahead.dropdown-menu > .active > a, .typeahead.dropdown-menu .active > a:hover, .typeahead.dropdown-menu > .active > a:focus {
    background-color: #FFF;
    color: #ffe500;
}
.typeahead.dropdown-menu > li > a{
    color: #676369;
}

/*Link*/
a, a:visited {
    color: #000;
    text-decoration: none;
}
a:hover, a:active, a:focus, a.form-link:hover {
    color: #ffe500;
    background-color: transparent;
    text-decoration: none;
}
a.form-link{
    color: #000;
    background: none;
    padding-left: 10px;
    position: relative;
}
a.form-link:before{
    font-family: "FontAwesome", serif;
    content: "\f105";
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    font-weight: 700;
}
a.form-link + a.form-link {
    margin-left: 10px;
}
.priceBl a.form-link, .priceBl a,.priceBl a:hover {
    font-size: 36px;
    color: #676369;
    font-weight: 600;
}
.priceBl a.form-link:before{content: none;}
/*
#csShowInvoicesForm p a img{display: none;}
#csShowInvoicesForm p a:before{
    font-size: 20px;
    font-family: 'FontAwesome', serif;
    content: "\f1c1";
    color: #4a4a4a;
    padding-left: 3px;
}
#csShowInvoicesForm p .insideLink a:before{display: none;}
*/
/*button*/
.btn-primary, #loginInc2Block a.form-link,div.wait-button,div.wait-button:hover, a.btn-primary {
    background: #b2b2b2;
    border: 1px solid #b2b2b2;
    color: #fff;
    cursor: pointer;
    float: right;
    font-family: inherit;
    font-weight: bold;
    padding: 3px 15px 3px 15px;
    text-align: left;
    width: auto;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary,
#loginInc2Block a.form-link:hover {
    background-color: #FFF;
    border-color: #1a171b;
    color: #1a171b;
}
#loginInc2Block a.form-link {
    float: left;
    padding-left: 15px;
    padding-right: 30px;
    margin-bottom: 15px;
}
#loginInc2Block a.form-link:before {
    left: inherit;
    right: 15px;
    top: 2px;
    font-size: 24px;
    font-weight: 200;
}
#loginInc2Block br {
    clear: both;
}
.btn-default[type=reset],.btn-default[type=submit],a.btn-default,button.btn-default{
    background-color: #FFFFFF;
    border-color: #b2b2b2;
    color: #b2b2b2;
    font-weight: 600;
}
.btn-default[type=reset]:hover,.btn-default[type=submit]:hover,a.btn-default:hover, button.btn-default:not(.selectpicker):hover,
button.btn-default:not(.selectpicker):focus{
    background-color: #FFF;
    border-color: #1a171b;
    color: #1a171b;
    font-weight: 600;
}
#registerCustomerForm .btn.using-glyphicons{padding-bottom: 1px;}

.ui-widget-content,.ui-widget-header,
.modal-header,.modal-content{border-color: #CCC;}
.ui-widget-header,.modal-header{background-color: #EEE;}
.modal-header .close{color: #676369;}

/*breadcrumb*/
.breadcrumb > li + li:before {
    font-family: 'FontAwesome',sans-serif !important;
    content: '\f105';
    font-size: 0.65em;
    color: #999999;
    font-weight: 700;
    margin: 0;
    padding: 0 5px 0 3px;
}
.breadcrumb {font-size: 0.8em;    padding-top: 3px; padding-left: 0;}
.breadcrumb, .breadcrumb .active{color: #999999!important; font-size: 16px;}
.breadcrumb a, .breadcrumb a:hover {color: #999999!important; font-size: 16px;}
/*.breadcrumb > li + li:before {
    font-family: arial,verdana,sans-serif !important; content: "›"; color: #FFF;
}*/
.breadcrumb > li + li.homeLi:before{display: none;}
span.step{border-color: #b2b2b2; background: #FFF;}
span.step.active{ background: #ffe500;}

.open > .dropdown-menu > li a:hover, .open > .dropdown-menu > li a:focus,
.naviLinkActive_sub{
    background-color: #f4f4f4;
    border-left: 0;
    padding-left: 14px;
}

/*tooltip,popover*/
.popover {  border-radius: 0;  background-color: #F3F4F6;  border-color: #bbbbbb;  }
.popover.topRight > .arrow,.popover.topLeft > .arrow {  border-top-color: #a9a8a8 !important;  }
.popover.topRight .arrow:after,.popover.topLeft .arrow:after {    border-top-color: #F3F4F6 !important;}
.popover-title {}
.popover-content {}

/*table*/
.table > thead > tr > th {
    background-color: #F9F9F9;
    border: 1px solid #e0e4e8;
    border-right: 0;
    border-bottom-color: #a9a8a8;
}
.table-responsive {  border: 1px solid #EEE;}
.table-striped > tbody > tr:nth-child(2n) > td, .table-striped > tbody > tr:nth-child(2n) > th {
    background-color: #F9F9F9;
}
.table-responsive > table.sum-table > tbody > tr:last-child > td {
    border-top: 1px double #ffe500;
}

.panel-default .panel-default,.panel-default.filterBlock{border-bottom: 1px solid #EEE;}
/*datepicker */
.datepicker th.prev, .datepicker th.datepicker-switch, .datepicker th.next,
.datepicker td.today, .datepicker td.today:hover, .datepicker td.active:hover, .datepicker td.active:hover:hover,
.datepicker td.active:focus, .datepicker td.active:hover:focus, .datepicker td.active:active,
.datepicker td.active:hover:active, .datepicker td.active.active, .datepicker td.active:hover.active,
.datepicker td.active.disabled, .datepicker td.active:hover.disabled, .datepicker td.active[disabled],
.datepicker td.active:hover[disabled], .datepicker td span.active:hover, .datepicker td span.active:focus,
.datepicker td span.active:active, .datepicker td span.active.active, .datepicker td span.active.disabled,
.datepicker td span.active[disabled]
{ background-color: #d0023c;}
.datepicker td, .datepicker td span.month, .datepicker td span.year{color: #1a171b;}
.datepicker td.day:hover, .datepicker td span.month:hover, .datepicker td span.year:hover,
.datepicker th.prev:hover, .datepicker th.datepicker-switch:hover, .datepicker th.next:hover{
    background: #eeeeee; color: #1a171b;
}

/*productCalculatorShort*/
.product-price-container .main-price-line {border: 1px solid #E0E4E8; background: transparent;}
.cage2 {  padding: 1.5%;  }
.form-group .col-xs-24.col-sm-8:first-child {padding-right: 0;}

#productCalculatorForm .table-responsive {margin-bottom: 10px;}

.product-calculator-slider-grafix{ opacity: 0.6;}
.product-calculator-slider-grafix.active{ opacity: 1;}
.slider.slider-horizontal .slider-track,.slider.slider-horizontal .slider-selection
{box-shadow: none; background: #FFF; border: 1px solid #96a6b3;}
.slider.slider-horizontal .slider-selection{ background: #f3f4f6;    border: none;}
.slider.slider-horizontal .slider-handle {
    background-color: #5e7386;
    border-color: #1A3552;
}
.slider.slider-horizontal .slider-handle:hover,.slider.slider-horizontal .slider-handle:active {
    background-color: #ff8a16;
    border-color: #485f73;
}
a.btn.btn-default.pull-left.showProductsLink.showDetails:before {
    content: "+ ";
}
a.btn.btn-default.pull-left.showProductsLink.showDetails.active:before {
    content: "- ";
}
.product-price-container {
    background-color: #eeeeee;
}
.product-price-container > .detail-prices,.product-price-container .main-price-line,
.panel-default > .panel-heading + .panel-collapse > .panel-body{border-color: #ccc;}
.panel-default #accordion .panel-default, .panel-default #postboxAccordion .panel-default {
    border: 1px solid #eee;
    margin-bottom: 12px;
}
#accordion .panel-default > .panel-heading, #postboxAccordion .panel-default > .panel-heading{padding: 10px; }
#accordion .btn {
    margin-top: 8px;
}
#accordion input[type=hidden] + input.btn {margin-left: 10px;}
.form-group,#startDeliveranceBlock,#startDateBlock, #contractNoBlock {
    margin-bottom: 15px;
}
/*teaserPage,cockpit*/
.labelText{
    font-weight: 700;
}
#subDashboard{
    border-bottom: 0;
}
#dashboard .mobile-panel{
    display: block;
}
div#myData, #dashboard div#bankData_mobile.mobile-panel, #dashboard div#userData_mobile.mobile-panel, #dashboard div.bankData_mobile.mobile-panel {
    display: none;
}
#dashboard #prepaymentOverview_mobile .widget-panel .panel-body{
    padding-bottom: 10px;
}
div#prepaymentOverview_mobile .table-responsive {
    margin-top: 0;
}
#dashboard-panel-body > .row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}
#dashboard-panel-body > .row > div:nth-child(6) {
    order: 1;
}
div#customerData_mobile {
    order: 2;
}
div#prepaymentOverview_mobile {
    order: 3;
}
div#billingData_mobile {
    order: 4;
}
#dashboard-news-container {
    min-height: 45px;
    padding: 5px 10px 40px !important;
}
.currentContractLabel .hidden-xs {
    font-size: 14px;
}
.currentContractLabel .hidden-xs span{
    background: #ffe73b;
    font-size: 16px;
    padding: 0 3px;
}
#dashboard .table-responsive > table.sum-table > tfoot > tr > td {
    border-top: 1px double #ffe500;
}
#dashboard .table-responsive > table.sum-table > tbody > tr:last-child > td {
    border-top:0;
}
#dashboard > .panel-heading .cursor,
.currentContract .nextContract, .currentContract .prevContract {
    position: relative;
    display: inline-block;
}
#dashboard .highlight.using-glyphicons .prevContract,
#dashboard .highlight.using-glyphicons .nextContract{
    font-size: 22px;
}
#dashboard > .panel-heading .cursor:after,
.currentContract .prevContract .cursor:after,
.currentContract .nextContract .cursor:after {
    content: "weiter";
    position: absolute;
    top: 50%;
    left: 100%;
    transform: translateY(-50%);
    display: inline-block;
    color: #d60040;
    font-weight: 700;
    font-family: 'Roboto', Arial, Verdana, Helvetica, sans-serif;
    font-size: 16px;
}
.currentContract .prevContract .cursor:after {
    transform: scaleX(-1.0) translateY(-50%);
}
#dashboard > .panel-heading .rightCCGBlock .cursor:after,
.currentContract .prevContract:after {
    left: inherit;
    right: 100%;
}
.rightCB_content {padding-bottom: 43px!important;}
#dashboard{margin-top: 20px; border-color: #eeeeee;}
#dashboard .widget-panel .row h4 {margin: 5px 0;}
#dashboard .widget-panel #dashboard-customer-container > div > .row h4 {margin:0 0 5px 0;}
.mv-type,.mv-comma,.mv-post-comma,.mv-unit, .mv-pre-comma.not-available {
    background-color: #eeeeee;
}
.mv-post-comma,
.mv-pre-comma.not-available {
    color: #676369;
}
#dashboard-panel-body .widget-panel > .panel-heading.dropdown-heading {
    padding: 6px 10px 7px 10px;
}
#dashboard .panel-heading {
    background-position: 95% 3px;
    background-size: 32px;
}
#dashboard .leftCB_content .panel-heading, #dashboard .meterValue .panel-heading, #dashboard .prePayment .panel-heading{
    background-size: 42px; background-position-y: 6px;
}
#dashboard-customer-container, #dashboard-invoices-container-long{min-height: 234px;}
#dashboard .widget-panel > .panel-heading .dropdown ul.dropdown-menu{
    margin-left: -10px;
    margin-top: 15px;
    border-top: none;
    background: transparent;
    padding-top: 0;
    border-top: 1px solid #EEE;
}
#dashboard .horiz_slides{ display: block; }
#dashboard .highlight.using-glyphicons {font-size: 26px;}
#dashboard .highlight,#dashboard .widget-panel > .panel-heading .dropdown a {
    color: #d0023c;
}
#dashboard .widget-panel > .panel-heading .dropdown .dropdown-menu a{color: #1a171b;}
a#customerNoInvoiceNoSelection:hover, a#customerNoInvoiceNoSelection:focus,#dashboard .widget-panel > .panel-heading .dropdown .dropdown-menu a:hover {
    color: #ffe500;
}
#dashboard .widget-panel > .panel-heading .dropdown a .caret{margin-top: 13px;}
#dashboard .widget-panel{border: 1px solid #EEE;}
#dashboard .widget-panel .panel-body {  padding: 10px 10px 45px;}
#dashboard #invoiceData.widget-panel .panel-body {  padding: 10px;}

.mv-pre-comma {  background-color: #ffe500;}

.open > .dropdown-menu li{box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.3); background: #FFF; position: relative;}
#topMenu .open > .dropdown-menu, #dashboard .open > .dropdown-menu{
    padding-top: 12px;
    border: none;
    box-shadow: none;
}
ul.dropdown-menu[aria-labelledby=customerNoInvoiceNoSelection] {
    margin-top: 15px;
    border-top: 1px solid #EEE !important;
    padding-top: 0 !important;
}
.open > .dropdown-menu > li a,.open > .dropdown-menu > li a:hover {
    border-bottom: 1px solid #eee;
    border-left: 0;
    background: #FFF;
    color: #1a171b;
    font-size: 16px;
    line-height: 1.75em;
    padding: 7px 20px;
}
.open > .dropdown-menu{border-top: 1px solid #EEE;}
.open > .dropdown-menu:after,#dashboard .widget-panel > .panel-heading .dropdown .dropdown-menu:after{
    background: transparent url(../images/de_DE/aufklappnav-pfeil.png) no-repeat center 0;
    position: absolute;
    content: " ";
    width: 33px;
    height: 15px;
    display: block;
    top: -15px;
    left: calc(50% - 8px);
}
#topMenu .open > .dropdown-menu:after{top: 10px; left: 30px;}
.open > .dropdown-menu > li a:hover { color:#ffe500; }
div#dashboard-invoices-container {
    padding-bottom: 25px !important;
}
#invoiceDataFooter{
    margin-left: 2px;
    position: absolute;
    bottom: 5px;
    font-size: 12px;
}
/*teaserPage,logged out*/
.fullLine{width: 100% !important;}
.widget-layout-container{
    display: block; width: 100%; max-width: 1252px; margin: 0 auto;
}
.widget-container {
    background-color: #fff;
    border: 1px solid #96a6b3;
    float: left;
    height: 313px;
    margin: 10px;
    position: relative;
    text-align: left;
    width: 293px;
}
.widget-container .panel-default{border: none;}
.widget-container .control-label{display: none;}

.monthPriceInfo {
    font-size: 12px;
}
.prettycheckbox>a,.prettyradio>a {
    position: relative;
}
.checkbox-row  a{
    text-decoration: underline;
}
.prettycheckbox>a:before,.prettyradio>a:before {
    position: absolute;
    left: 5px;
    top: 5px;
    content: " ";
    width: 20px;
    height: 20px;
    border: 1px solid #b2b2b2;
    display: block;
}
.prettycheckbox>a.disabled:before,.prettyradio>a.disabled:before,
.prettycheckbox>a.checked.disabled:before,.prettyradio>a.checked.disabled:before {
    background-color: #001c54;
    opacity: 0.06;
    border-color: #001c54;
}
.prettycheckbox>a:focus:before,.prettyradio>a:focus:before  {
    border-color: #1a171b;
}
.prettyradio>a:before {
    border-radius: 50%;
}
#productCalculatorShortForm.page1 > .panel-default .prettyradio>a.disabled,
#productCalculatorShortForm.page1 > .panel-default .prettyradio>a.checked.disabled {
    background-position: center;
    opacity: 0.6;
}
.bootstrap-select.form-control button.disabled {
    background-color: #f3f4f6;
    border-color: #e0e4e8;
    -webkit-box-shadow: inset 0 -8px 6px -6px #f3f5f7;
    -moz-box-shadow: inset 0 -8px 6px -6px #f3f5f7;
    box-shadow: inset 0 -8px 6px -6px #f3f5f7;
    opacity: 1;
}
.bootstrap-select.btn-group button.disabled.btn .caret{
    outline-color: #f3f4f6;
}
select[disabled] + .bootstrap-select {
    cursor: not-allowed;
}
#productCalculatorShortForm.page1 > .panel-default .bootstrap-select.form-control button.disabled,
#productCalculatorShortForm.page1 > .panel-default .form-control[disabled=disabled],
#productCalculatorShortForm.page1 > .panel-default .form-control[disabled=disabled]:focus{
    background-color: #d2cbb6;
    box-shadow: none;
    color: #8e8e8e;
}
.contentStepBlock {
    display: table;
    width: 100%;
    margin: 10px 0 20px;
}
.contentStepBlock div {
    display: table-cell;
    padding: 0 10px 0 0;
    color: #aeaeae;
    font-size: 14px;
    font-weight: 400;
    position: relative;
}
.contentStepBlock div .stepNum{
    color: #FFF;
    font-weight: 700;
    display: block;
    background: #aeaeae;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    text-align: center;
    line-height: 22px;
    box-sizing: content-box;
    box-shadow: 0 2px 5px #777;
    border: 3px solid #FFF;
}
.contentStepBlock div.active {
    color: #000;
    font-weight: 600;
}
.contentStepBlock div.active .stepNum{
    background: #000;
}
.contentStepBlock div:after {
    content: "";
    width: calc(100% - 40px);
    height: 5px;
    background: #aeaeae;
    position: absolute;
    left: 34px;
    top: 12px;
}
.contentStepBlock div.active:before,
.contentStepBlock div.active:after {
    background: #000;
}
.contentStepBlock div .allStep{
    display: none;
    font-weight: 700;
    margin: -6px 0 0 35px;
    width: 100%;
}
.contentStepBlock div.current .allStep{
    display: block;
}

input[type="text"]:disabled{
    color: #1a171b !important;
}

.promotionCode .control-label{min-height: 31px;}

input#promotionCode {
    width: calc(100% - 120px);
    float: left;
}
#redeemPromotionCode{float: right; padding: 5px 20px 6px;}

.promotionCodeResult.okay div.control-label.value-label{
    color: #708a25;
}
.promotionCodeResult.failure div.control-label.value-label{
    color: #a94442;
}
.promotionCodeResult div.control-label.value-label:before{
    font-family: "FontAwesome", serif;
    content: "\f129";
    padding-right: 5px;
}
.promotionCodeResult.okay div.control-label.value-label:before{
    content: "\f00c";
}
.promotionCodeResult.failure div.control-label.value-label:before{
    content: "\f12a";
}

@media (min-width: 768px){
    header{
        height: auto;
        border-top: 10px solid #ffe500;
        position: fixed;
        z-index: 2;
        left: 0;
        top: 0;
        width: 100%;
        filter: drop-shadow(0px 3px 8px rgba(0, 0, 0, 0.16));
    }
    .wrapper{
        max-width: 980px;
        margin: 0 auto;
        position: relative;
        width: 100%;
    }

    #logoLi{
        display: inline-block;
    }
    img#logo{
        position: relative;
        left: 10px;
        top: 10px;
        margin: 0;
        max-height: 59px;
    }
    #metaNavi{
        top: 10px;
    }
    #topMenu{
        height: 45px; position: relative; padding-bottom:0;
        margin-top: 8px;
    }
    #topMenu .navbar-nav > li > a .caret{display: none;}
    #topMenu .navbar-nav > li > a{
        background: #fff;
        border: 1px solid #ffe500;
        color: #000;
        display: block;
        font-size: 20px;
        line-height: 35px;
        padding: 0 20px;
        font-weight: 600;
        text-decoration: none;
        width: auto;
    }
    #topMenu .navbar-default .navbar-nav > .active > a,#topMenu .navbar-default .navbar-nav > .open > a,
    #topMenu .navbar-nav > li > a:hover{
        color: #000;
        background: #ffe500;
        text-decoration: none;
        text-shadow: none;
        outline: 0 none;
    }
    #topMenu .container-fluid{background: #ffe500; padding: 0;}
    #topMenu .navbar-collapse{padding: 0;}
    #topMenu .navbar-nav{
        min-height: 45px;
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
    }
    #topMenu .navbar-nav > li {border-right: 1px solid #fddd80;}
    #topMenu .open > .dropdown-menu{
        padding-top: 25px;
        border: none;
        box-shadow: none;
        background: transparent;
    }
    #topMenu .open > .dropdown-menu > li:first-child:before{ left: 30px;}
    #topMenu .open > .dropdown-menu > li{box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.3);}
    #topMenu .open > .dropdown-menu > li a:hover{
        color: #000;
        background: #ffe500;
        text-decoration: none;
        text-shadow: none;
        outline: 0 none;
    }
    #topMenu .open > .dropdown-menu > li a{
        background: #fff;
        border: none;
        border-bottom: 1px solid #eeeeee;
        color: #676369;
        font-size: 16px;
        line-height: 1.75em;
        padding: 7px 20px;
        font-weight: 400;
        text-shadow: none;
    }
    #main{
        padding: 0 20px 80px;
        margin-top: 150px;
    }
    #topMenu  .navbar-right{display: none; }
    #dashboard .highlight {
        font-size: 1.4em;
    }
}
@media (max-width: 980px){
    div#topMenu:before, div#topMenu:after{display: none;}

    footer ul{
        float: none; text-align: center; margin: 0 0 10px !important;
    }
    footer ul li {
        display: inline-block;
        float: none;
    }
    footer p.copyright {
        float: none;
        margin: 0 10px 0 10px;
        text-align: center;
    }
    footer p.copyright br {
        display: none;
    }
}
@media (max-width: 899px){
    #topMenu .navbar-nav > li > a{
        padding: 0 9px;
    }
}
@media (max-width: 800px){
    body.classic #cage, body.top-drop #cage, body.side-collapse #cage, body.classic footer ul, body.top-drop footer ul,
    body.side-collapse footer ul{width: 100% !important;}
}
@media (max-width: 767px){
    /*Login mobile*/
    #loginInc2Block .row{margin-left: 0; margin-right: 0;}
    #loginInc2Block .row > div{padding-left: 0; padding-right: 0;}
    .navbar-nav .open .dropdown-menu > li > a.naviLinkActive_sub{padding-left: 19px;}

    #dashboard .mobile-panel{ display: block;}
    #dashboard #myData{ display: none;}

    header{
        height: auto; z-index: 9; position: relative;
        border-top: 10px solid #ffe500;
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.16);
    }
    #logoLi{
        position: absolute;
        z-index: 21;
        top: 50%;
        transform: translateY(-50%);
        left: 20px;
    }
    img#logo {
        height: inherit;
        max-height: 30px;
        top: 0;
        left: 0;
        float: left;
        position: relative;
    }
    body{background: transparent;}
    #main{padding: 0 15px 90px;}
    #metaNavi {
        position: absolute;
        right: 100px;
        top: 50%;
        z-index: 20;
        transform: translateY(-50%);
    }

    #topMenu .navbar{min-height: inherit; margin-bottom: 0;}
    .navbar-nav {
        margin: 0 -15px;
        padding: 0 15px;
        background: #fff;
    }
    .navbar-default .navbar-toggle {
        border: none;
        padding: 20px 15px 20px 25px;
        margin: 0;
        right: 0;
        background: #ffe73b;
        border-radius: 0;
    }
    .navbar-default .navbar-toggle .icon-bar {
        background-color: #000;
        display: block;
        width: 30px;
        height: 2px;
        border-radius: 2px;
        transition: all .2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        position: relative;
    }
    .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
        background-color: #ffe73b;
        height: 58px;
    }
    .navbar-toggle .icon-bar + .icon-bar {  margin-top: 6px;  }
    .collapsed.navbar-toggle .icon-bar:first-child, .collapsed.navbar-toggle .icon-bar:last-child{transform: inherit;}
    .collapsed.navbar-toggle .icon-bar:first-child{top: 0;}
    .collapsed.navbar-toggle .icon-bar:last-child{ bottom: 0; display: block;}
    .collapsed.navbar-toggle .icon-bar:nth-child(2) {display: block; width: 40px;margin-left: -10px;}
    .navbar-toggle .icon-bar:nth-child(2) {display: none;}
    .navbar-toggle .icon-bar:first-child{transform: rotate(-45deg);  top: 4px;}
    .navbar-toggle .icon-bar:last-child{transform: rotate(45deg);  bottom: 3px;}
    .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand{top: 11px;}

    #topMenu .navbar-collapse{
        position: absolute;
        width: 100%;
        max-height: calc(100vh - 60px) !important;
        overflow: auto;
    }
    #topMenu {
        position: relative;
        width: 100%;
        min-height: 5px;
    }
    #topMenu .navbar-nav > li:first-child{
        padding-top: 8px;
    }
    #topMenu .navbar-nav > li:last-child{
        padding-bottom: 8px;
    }
    #topMenu .navbar-nav > li > a.dropdown-toggle{
        border-bottom: 2px solid #ffe500 !important;
        background: #fff; color: #1a171b;
    }
    #topMenu .navbar-nav > li > a.dropdown-toggle .caret{display: none;}
    #topMenu .navbar-nav > li > a.dropdown-toggle,#topMenu .navbar-right > li.dropdown > a.dropdown-toggle:hover{
        background: #fff; color: #1a171b; border-bottom: 2px solid #ffe500 !important; position: relative;
        font-size: 16px; padding: 9px 25px 9px 10px; line-height: 1.3em;font-weight: 700;
    }
    #topMenu .navbar-nav > li > a.dropdown-toggle:hover, #topMenu .navbar-nav > li > a.dropdown-toggle:active{
        color: #1a171b;
    }
    #topMenu .navbar-nav > li > a.dropdown-toggle:after{
        font-family: "FontAwesome", serif;
        content: "\f107";
        position: absolute;
        right: 20px;
        font-size: 22px;
    }
    #topMenu .navbar-default .navbar-nav > .active > a,#topMenu .navbar-nav > li.active > a.dropdown-toggle:hover,
    #topMenu .navbar-default .navbar-nav > .open > a, #topMenu .navbar-nav > li.open > a.dropdown-toggle:active,
    #topMenu .navbar-nav > li.active > a.dropdown-toggle:after,
    #topMenu .navbar-nav > li.open > a.dropdown-toggle:after,#topMenu .navbar-right > li.dropdown.open > a.dropdown-toggle:hover,
    #topMenu .navbar-right > li.dropdown > a.dropdown-toggle:focus{background: #ffe500; color: #000 !important;}
    #topMenu .navbar-nav > li.open > a.dropdown-toggle:after{
        content: "\f106";
    }
    #topMenu .open > .dropdown-menu:after{display: none;}
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #666666;
    }
    ol.breadcrumb {
        margin: 0 -10px;
        background: #EEEEEE;
        line-height: 38px;
        padding: 0 10px;
    }
    #metaNavi > span {display: none;}
    #topMenu .navbar-right > li.dropdown > a.dropdown-toggle{
        border-bottom-color: #FFF !important;
        padding-bottom: 9px !important;
    }
    .navbar-nav.navbar-right .open .dropdown-menu{border: none; }
    #topMenu .open > .dropdown-menu{
        padding-top: 0;
    }
    #topMenu .open > .dropdown-menu > li:first-child:before{display: none;}
    #topMenu .open > .dropdown-menu > li:first-child {
        border-top: 0;
    }
    .navbar-nav .open .dropdown-menu > li > a{line-height: 1.75em;  padding: 7px 20px;}
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus
    {
        color: #ffe500;
    }
    .navbar-nav.navbar-right .open .dropdown-menu > li a:hover, .navbar-nav.navbar-right .open .dropdown-menu > li a:focus{
        border-left: 0; padding-left: 20px; background: #FFF; }
    .navbar-default .navbar-nav .open .dropdown-menu > li:last-child > a:hover{border-bottom: none;}
}
@media (max-width: 499px){
    .xs-price-display{
        color: #d0023c;
        text-align: right;
    }
}
@media (min-width: 505px){
    #main{
        padding-bottom: 120px;
    }
    #accordion a {
        display: table;
        width: 100%;
    }
    #accordion a .caret, #accordion a .highlight-csit, #accordion a .pull-right.xs-price-display {display: table-cell;}
    #accordion a .caret {width: 20px;    border: none;}
    #accordion a .caret:before {
        font-family: "FontAwesome", serif;
        content: "\f107";
        padding: 0 5px 0 0;
        line-height: 28px;
    }
    #accordion a.collapsed .caret:before {
        content: "\f106";
    }
    #accordion a .highlight-csit  {display: table-cell;}
    #accordion a .pull-right.xs-price-display {width: 150px; text-align: right;}
}
@media (max-width: 400px){
    .form-horizontal .form-group{ margin: 0; }
    .form-horizontal .form-group{ margin: 0 -8px 8px; }
    .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, .col-xs-13, .col-sm-13, .col-md-13, .col-lg-13, .col-xs-14, .col-sm-14, .col-md-14, .col-lg-14, .col-xs-15, .col-sm-15, .col-md-15, .col-lg-15, .col-xs-16, .col-sm-16, .col-md-16, .col-lg-16, .col-xs-17, .col-sm-17, .col-md-17, .col-lg-17, .col-xs-18, .col-sm-18, .col-md-18, .col-lg-18, .col-xs-19, .col-sm-19, .col-md-19, .col-lg-19, .col-xs-20, .col-sm-20, .col-md-20, .col-lg-20, .col-xs-21, .col-sm-21, .col-md-21, .col-lg-21, .col-xs-22, .col-sm-22, .col-md-22, .col-lg-22, .col-xs-23, .col-sm-23, .col-md-23, .col-lg-23, .col-xs-24, .col-sm-24, .col-md-24, .col-lg-24{
        padding-left: 8px;  padding-right: 8px;
    }
    div.input-seperator:before{
        margin-left: -14px;
    }
    .navbar-default .navbar-toggle{top: -35px;}
    #metaNavi a{
        display: block;
        text-align: right;
    }
    .homelink {
        margin-right: 0;
    }
}
