/* @section 1. Global Styles */

#whitelabelPvgPower,
#ui-datepicker-div,
#loading {
    font: 1em/1.5em Rubik, sans-serif;
    color: #444;
}

#whitelabelPvgPower {
    width: 99.5%;
}

#whitelabelPvgPower > div {
    background-color: #fff;
}

#whitelabelPvgPower.layer {
    min-width: inherit
}

.tooltip.showTooltipFirstState .tooltipFirstState,
.tooltip.showTooltipSecondState .tooltipSecondState {
    display: block;
}

.tooltip.showTooltipFirstState .tooltipSecondState,
.tooltip.showTooltipSecondState .tooltipFirstState {
    display: none;
}

.whitelabelPvg .resultsTable .tariffNumbering {
    color: #c3c3c3;
}

.whitelabelPvg .resultsTable .numberingForcedSpace {
    display: block;
    padding-top: 15px;
}

@media (max-width: 800px) {
    #whitelabelPvgPower {
        font-size: 1.2em !important;
        line-height: 1.2em;
    }

    .advertisementLine {
        display: none;
    }
}

@media (max-width: 650px) {
    #whitelabelPvgPower {
        font-size: 1.3em;
        line-height: 1.3em;
    }
}

/* @section 2.5 Buttons */

.layoutEnergy .buttonDefault,
.layoutEnergy .buttonDefaultSmall,
.layoutEnergy .buttonDefaultBackSmall {
    background: #8faf11;
}

.layoutEnergy .buttonDefault:hover,
.layoutEnergy .buttonDefaultSmall:hover,
.layoutEnergy .buttonDefaultBackSmall:hover {
    background: #a7cc17;
}

/* @section 3.1 Footer */

.whitelabelFooter {
    margin: 0 auto;
    max-width: 40em;
    text-align: center;
}

.whitelabelFooter > p > span,
.whitelabelFooter > span {
    white-space: nowrap;
}

#calculatorIndex .consumption strong {
    width: 40%;
    display: inline-block
}

/* @section 4.1 Index */

.whitelabelBoxContent form {
    margin: 0 auto;
    text-align: center;
}

.whitelabelBoxContent li {
    line-height: 2.25em
}

.whitelabelBoxContent li *:not(.icoError) {
    vertical-align: middle;
}

.whitelabelBoxContent li input[type="checkbox"] {
    margin-right: .25em;
}

.whitelabelBoxContent li.button .buttonDefault {
    margin-left: 20px;
    margin-top: 15px;
}

.whitelabelBoxContent .criteria,
.whitelabelBoxContent .options {
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

.whitelabelBoxContent .criteria {
    width: 50%;
}

.whitelabelBoxContent .options {
    width: 43%;
}

.whitelabelBoxContent .options li {
    margin-bottom: 5px;
}

.whitelabelBoxContent .options input:not([type="checkbox"]):not([type="radio"]) {
    margin: 0 5px;
}

.whitelabelBoxContent .criteria li {
    margin-bottom: 5px;
}

.whitelabelBoxContent .criteria input:not([type="checkbox"]):not([type="radio"]),
.whitelabelBoxContent .criteria select {
    width: 100px;
    vertical-align: top;
}

.whitelabelBoxContent .criteria input {
    width: 101px;
}

.whitelabelBoxContent .criteria input.city,
.whitelabelBoxContent .criteria select.citySelect {
    margin-left: calc(45% + 19px);
}

.whitelabelBoxContent .criteria label {
    width: 45%;
    display: inline-block
}

.whitelabelBoxContent .criteria label.error {
    width: auto
}

.whitelabelBoxContent .cityLine .city {
    display: none
}

.whitelabelBoxContent .cityLine .icoError {
    margin-left: -24px;
}

@media (max-width: 650px) {
    .icoError {
        height: 24px;
    }
}

/* @section 4.2.1.4 Vergleichstarif */

/* @section 4.2.2 Toptariff */

.resultsTable .badgeBoxInner:after {
    border: none;
}

/* @section 5. Kombilanding */

.combiForm {
    width: 535px;
    margin: 0 auto;
    padding: 5px 0
}

.combiForm .formHeadline {
    font-size: 2.4em;
    line-height: 1.6em;
    margin: 10px
}

.combiForm .formList {
    width: 260px
}

.combiForm .formListOption {
    width: 205px;
}

.combiForm .formList label {
    width: 110px;
    display: inline-block;
    line-height: 2em
}

.combiForm .formListOption label {
    display: inline-block;
    line-height: 2em
}

.combiForm label.error {
    width: auto
}

.combiForm input[type="checkbox"] {
    margin-right: .25em;
    vertical-align: middle;
}

.combiForm input:not([type="checkbox"]):not([type="radio"]) {
    vertical-align: middle;
    width: 100px;
}

.combiForm .city,
.combiForm .hadCity ~ select.citySelect {
    margin: 5px 0 0 129px;
    width: 100px;
}

.combiForm select {
    width: 100px
}

.combiForm ul {
    float: left;
    margin: 0 15px
}

.combiForm li {
    margin-bottom: 5px
}

.combiForm li.button {
    margin-top: 15px
}

.combiForm .consumption strong {
    display: inline-block;
    width: 80px
}

.gasCalculator .consumption strong {
    display: inline-block;
    width: 100px
}

@media (max-width: 800px) {
    .combiForm .error + .icoError,
    .combiForm .hadCity + .icoError {
        top: 3px;
    }
}

@media (max-width: 767px) {
    .whitelabelBoxContent .criteria input.constantWidth {
        width: 121px;
    }
}

@media (min-width: 551px) {
    .whitelabelBoxContent form {
        width: 100%;
        max-width: 40em;
    }
}

@media (max-width: 550px) {
    .whitelabelBoxContent form {
        min-width: inherit;
        max-width: inherit
    }

    .whitelabelBoxContent {
        min-width: inherit;
    }

    .whitelabelBoxContent form {
        width: 22em;
        position: relative;
        padding-bottom: 4em;
    }

    .whitelabelBoxContent .criteria,
    .whitelabelBoxContent .options {
        padding: 0 5%;
        width: 90%;
    }

    .whitelabelBoxContent li.button .buttonDefault {
        position: absolute;
        bottom: 0.5em;
    }

    .splitFooter {
        display: block;
    }
}

.specialcustomerContent {
    padding: 20px 10px 0;
    text-align: left;
}

.specialcustomerContent.landingSpecialCustomer {
    padding-top: 0;
}

.specialCustomer li {
    padding: 2px 0
}

.specialCustomer label {
    display: inline-block;
    width: 115px
}

.specialCustomer .icoError {
    margin: 0 0 0 -3px
}

.specialcustomerContent .buttons {
    margin-top: 20px;
    text-align: right
}

.specialcustomerContent .buttons a {
    margin-right: 10px
}

#whitelabelPvgPower .breakMid:after {
    display: none;
}

@media (min-width: 769px) and (max-width: 1178px) {
    #whitelabelPvgPower .breakMid:after {
        display: block;
        content: ""
    }

    #whitelabelPvgPower .breakMid.breakMidHyphen:after {
        display: inline;
        content: " - ";
    }
}

@media (min-width: 1179px) and (max-width: 1400px) {
    #whitelabelPvgPower .breakMid.breakMidHyphen.breakMidHyphenWideNoBreak:after {
        display: none;
    }

    #whitelabelPvgPower .breakMid.breakMidHyphen.breakMidHyphenWideWithHyphen:after {
        display: inline;
        content: " - ";
    }
}

.ico.hasTooltip {
    display: inline-block;
    margin-right: .25em;
}

.listAlternate input[name="formerProviderName"] {
    margin-right: -.25em;
}

.icoWithLeftSpaceMargin {
    margin-left: .25em;
}

.error + .icoError,
.hadCity + .icoError {
    margin-left: -24px;
    top: 1px;
}

.optionsBox + .seals {
    right: 22px;
}

.indexIndex .whitelabelPvg .seals {
    display: inline-block;
    left: 20px;
    max-width: 90%;
    min-width: 210px;
    position: relative;
}

.whitelabelPvg .seals .seal-widget {
    float: left;
    height: 67px;
    transform: scale(.55);
    transform-origin: 0 0;
    width: 167px;
}

.indexLanding .whitelabelPvg .seals .seal-widget {
    left: 20px;
    position: relative;
}

@media (max-width: 650px) {
    .whitelabelPvg form.searchResults {
        padding-top: 25px;
    }

    .whitelabelPvg .optionsBox + .seals {
        top: -67px;
    }
}

@media (max-width: 550px) {
    .whitelabelPvg .searchResults .titleContainer {
        width: calc(100% - 140px);
    }

    .indexIndex .whitelabelPvg .seals {
        left: 46px;
    }
}

@media (min-width: 801px) {
    .resultsTable .priceResults {
        font-size: 1.8em;
    }

    .resultsTable .first.costs .title,
    .resultsTable .first.costs .tariffNumbering,
    .resultsTable .second.savings .savedUp,
    .resultsTable .third .tariffName,
    .resultsTable .third .moreDetailsButton,
    .resultsTable .fourth .listBonus li,
    .resultsTable .tariffAssessment,
    .resultsTable .secondYearPrice {
        font-size: 1.2em;
    }

    .resultsTable .third .comparisonText {
        font-size: 0.85em;
    }

    .resultsTable .badgeCashback .cashbackMarking,
    .resultsTable .badgeCashback .cashbackMarking {
        font-size: 1.1em;
    }
}

@media (min-width: 1450px) {
	.resultsTable > tbody > tr.bannerRow {
		display: table-row;
	}
}
