﻿


.kandidaten { color: #333333; position: relative; top: 0rem; left: 0rem; }

.kandidaten__headline   { text-align: left; cursor: pointer; float: left; }
.kandidaten__state      { font-size: 1.6rem; line-height: 1.8rem; display: block; font-weight: normal; margin: 0rem; color: #414141; padding-bottom: 0.6rem; }
.kandidaten__statenode  { font-weight: bold; }
.kandidaten__arrow      { position: relative; left: 2rem; top: 1.8rem; vertical-align: top; }
.kandidaten__title      { font-size: 3.5rem; line-height: 4rem; color: #414141; display: inline; margin: 0rem 0rem 0rem 0rem; vertical-align: top; }

.kandidaten__flags      { float: right; position: relative; top: 0rem; left: 0rem; text-align: center; padding-top: 3.6rem; margin-bottom: 3rem; }
.kandidaten__flagslist  { }
.kandidaten__flag       { display: inline-block; padding: 0rem 1rem 0rem 1rem; text-align: center; }
.kandidaten__flaglink   { font-size: 1.5rem; line-height: 1.7rem; color: #6D6E6F; }
.kandidaten__flag--active .kandidaten__flaglink { font-weight: bold; color: #333333; border-bottom: solid 2px #333333; display: block; padding-bottom: 0.2rem; }
.kandidaten__flaglink:hover { color: #015EAB; }

.kandidat__districts    { top: 8rem; left: 9rem; }

.grk table tr:hover td  { color: white; }
.grk table tr:hover td a { color: white; }






.kandidat { position: relative; top: 0em; left: 0em; padding: 0em 0em 0em 0em; }

.kandidat .error { width: 100%; text-align: center; padding-top: 8em; }

.kandidat .district-header { width: 100%; height: 4.9em; position: relative; top: 0em; left: 0em; border-bottom: solid 2px white; border-right: solid 2px white; margin-top: 4em; }
.kandidat .district-header div { width: 100%; min-height: 3.5em; position: absolute; bottom: 0em; left: 0em; padding: 1em 1em 1em 7.5em; z-index: 1; background-color: #F2F2F3; z-index: 0; }
.kandidat .district-header img { position: absolute; left: 0.8rem; bottom: 0.4rem; z-index: 2; width: 5rem; }
.kandidat .district-header h3 { float: left; margin: 0em; font-size: 1.6em; font-weight: bold; }
.kandidat .district-header h4 { float: right; margin: 0em; font-size: 1.6em; font-weight: bold; }

.kandidat .right .emblem { height: 8.6em; }
.kandidat .right .emblem img { width: 100%; max-width: 100%; position: relative; top: -0.8em; }
.kandidat .right .styled-select { width: 100%; min-width: 100%; }

.kdetail { width: 100%; clear: both; }
.kdetail .portrait { display: block; background-repeat: no-repeat; background-position: bottom center; background-size: 100% auto; }
.kdetail .portrait span { display: block; position: absolute; bottom: 0em; left: 0em; width: 100%; color: white; text-align: center; padding: 0.5em; font-size: 1.4em; font-weight: bold; text-transform: uppercase; }

.kdetail .row { width: 100%; clear: both; }
.kdetail .row__left { width: 40%; float: left; position: relative; top: 0em; left: 0em; }
.kdetail .row__right { width: 60%; float: left; position: relative; top: 0em; left: 0em; padding-top: 40%; }

.kdetail .portrait__imagecon { position: relative; top: 0rem; left: 0rem; padding-bottom: 100%; overflow: hidden; background-color: #F4F4F5; }
.body--isnew .kdetail .portrait__image { position: absolute; top: 0rem; left: -15%; width: 130%; }
.body--isarchive .kdetail .portrait__image {  position: absolute; top: 0rem; left:0%; width:100%; }

.kandidat p { font-size: 1.4em; }
.kandidat p.comment--long { font-size: 1.2em; line-height:1.4em; margin-top:0.4em; }
.kandidat .row { padding-top: 0.3em; }
.kandidat .tabcontent { display: none; position: absolute; left: 0em; bottom: 3em; width: 100%; padding: 0em 0.5em 2em 3em; }
.kandidat .tabcontent:first-child { display: block; }
.kandidat .tabcontent.show { display: block; }

.body--isold .kdetail .row__left { width: 35%; float: left; position: relative; top: 0em; left: 0em; }
.body--isold .kdetail .row__right { width: 65%; float: left; position: relative; top: 0em; left: 0em; padding-top: 52.5%; }

.body--isold .kdetail .portrait__imagecon { padding-bottom: 150%; }
.body--isold .kdetail .portrait__image { left: 0%; width: 100%; }

.body--morespace1 .row__left { width: 45%; }
.body--morespace1 .row__right { width: 55%; padding-top: 45%; }

.body--morespace2 .row__left { width: 50%; }
.body--morespace2 .row__right { width: 50%; padding-top: 50%; }

.kandidat .info { position: absolute; top: 4em; left: 0em; padding: 0em 0.5em 4em 3em; }
.kandidat .info .gewaehlt { background-color: #1D7D09; color: white; text-align: center; text-transform: uppercase; padding: 0.3em 0.6em 0.3em 0.6em; display: inline; font-size: 1.4em; }
.kandidat .info .kandidatur { margin: 0.3em 0em 1em 0em; }
.kandidat .info .name { font-size: 2.5em; margin: 0em; }
.kandidat .info .age { margin: 0em 0em 0em 0em; }

.kandidat .result { padding-bottom: 6em; }
.kandidat .result .perc { margin: 0em; font-size: 2.5em; }
.kandidat .result .votes { margin: 0em; }

.kandidat .person { }
.kandidat .person h4 { font-size: 1.4em; margin: 1em 0em 0em 0em; }
.kandidat .person p { margin: 0em; }

.kandidat .politics { }
.kandidat .politics h4 { font-size: 1.4em; margin: 1em 0em 0.3em 0em; }
.kandidat .politics p { margin: 0em; font-size: 1.4em; line-height: 1.8em; }

.kandidat .tabs { width: 100%; position: absolute; bottom: 0em; left: 0em; }
.kandidat .tabs li { float: left; padding: 0.8em 0em 0.8em 0em; text-align: center; width: 33%; background-color: #F2F2F4; border-right: solid 0px #AAAAAC; }
.kandidat .tabs li a { font-size: 1.2em; cursor: pointer; color: black; }
.kandidat .tabs li:last-child { border-right-width: 0px; }
.kandidat .tabs li.active { background-color: #AAAAAC; }
.kandidat .tabs li.active a { font-weight: bold; color: white; }
.kandidat .tabs[data-count="1"] li { width: 100%; }
.kandidat .tabs[data-count="2"] li { width: 50%; }

.kandidat .oponnents            { width: 100%; padding-top: 2em; padding-bottom:4rem; }
.kandidat .oponnent             { width: 32%; margin-right: 0em; float: left; position: relative; top: 0em; left: 0em; margin-right: 1%; }
.kandidat .oponnent__link       { float: left; max-width: 10em; position: relative; top: 0em; left: 0em; margin-right: 1em; display: inline-block; }
.kandidat .oponnent__imagecon { display: block; width: 100%; padding-bottom: 100%; background-color: #F4F4F5; }
.kandidat .oponnent__image      { float: left; max-width: 100%; }
.kandidat .oponnent__short      { position: absolute; bottom: 0em; padding: 0.3em; font-size: 1.4em; text-transform: uppercase; color: white; width: 100%; display: block; text-align: center; }
.kandidat .oponnent__dataop     { float: left; width: calc(100% - 11em); display: inline-block; margin: 1em 0em 0em 0em; vertical-align: top; }
.kandidat .oponnent__type       { font-size: 1.4rem; line-height: 1.8rem; }
.kandidat .oponnent__name       { font-size: 1.6rem; margin: 0em 0em 1rem 0em; }
.kandidat .oponnent__perc       { font-size: 1.6rem; font-weight: bold; }
.kandidat .oponnent__votes      { font-size: 1.4rem; line-height: 1.8rem; }
.kandidat .oponnents[data-count="0"] { display: none; }
.kandidat .oponnents[data-count="4"] .oponnent { width: 25%; }


.oponnents__switch { font-size: 1.6rem; display: block; width: 100%; padding: 2rem 0rem 1rem 0rem; }

.kandidat .parteilink { width: 100%; text-align: right; padding: 1em 0.5em; }
.kandidat .parteilink a { font-size: 1.4em; }
.kandidat .parteilink i { font-size: 1.4em; position: relative; top: 0.1em; left: -0.2em; }

/* kandidat/stimmenherkunft.ascx */

.shk { width: 100%; margin-top: 3em; clear: both; }
.shk table { width: 100%; }
.shk h2 { background-color: #f2f2f4; padding: 0.5em 1em 0.5em 1em; margin: 0em; font-size: 1.8em; font-weight: normal; border-bottom: solid 2px #E6E6E8; }
.shk table th:nth-child(3) { text-align: center; }
.shk table td:nth-child(3) { text-align: center; }
.shk table td i { color: #1E7C0A; font-size: 2em; }
.shk table th:last-child { text-align: right; }
.shk table td:nth-child(2) { text-align: right; }
.shk table td:last-child div { min-height: 1.5em; border-style: solid; border-width: 0em 0.5em 0em 0em; }
.shk table .totalrow td { border-bottom: solid 1px white; }
.shk table .totalrow:last-child td span { font-weight: bold; }


/* resultate/gemeinderatskandidaten.ascx */

.grk { width: 100%; margin-top: 3em; }
.grk table { width: 100%; }
.grk h2 { background-color: #f2f2f4; padding: 0.5em 1em 0.5em 1em; margin: 0em; font-size: 1.8em; font-weight: normal; border-bottom: solid 2px white; }
.grk table th:nth-child(3) { text-align: center; }
.grk table td:nth-child(3) { text-align: center; }
.grk table td i { color: #1E7C0A; font-size:1.5rem; margin-left:1.5rem;  }
.grk table th:last-child { text-align: right; }
.grk table td:last-child { text-align: right; }
.grk table tr.highlight td { color: red; }
.grk table tr.highlight td a { color: red; }

.grk .footnotes          { margin-top:1.5rem; margin-left:1.8rem; }
.grk .footnotes li       { font-size:1.2em; line-height:1.6em; }

.box.vorsteher { margin-top: 2em; }
.box.vorsteher h2 { margin: 0em; border-bottom: solid 2px white; }
.box.vorsteher td:last-child { text-align: right; }
.box.vorsteher td:last-child b { color: #1D7D09; }


@media screen and (max-width: 1024px) {

    .kandidat .left { width: 100%; clear: both; }
    .kandidat .flags { position: relative; top: 0em; left: 0em; width: 50%; float: left; clear: none; margin: 0em 0em 4em 0em; }
    .kandidat .right { display: none; }
    .kandidat .left .styled-select { display: block; float: right; width: 50%; margin: 0em 0em 2em 0em; }
}

@media screen and (max-width: 768px) {
    .kandidat__districts { top: 8rem; left: -2rem; z-index: 999; }
}

@media screen and (max-width: 768px) {

    .kandidat .district-header { border-right-width: 0px; }
    .kandidat .partei { border-right-width: 0px; }
    .kandidat .flags { width: 100%; margin-top: 1em; }
    .kandidat .flags li { width: 20%; }
    .kandidat .left .styled-select { float: none; width: 100%; clear: both; margin: 1em 0em 0em 0em; }

    .kdetail .row__left { width: 45%; }
    .kdetail .row__right { width: 55%; padding-top: 45%; }

    .body--morespace1 .row__left { width: 50%; }
    .body--morespace1 .row__right { width: 50%; padding-top: 50%; }

    .body--morespace2 .row__left { width: 55%; }
    .body--morespace2 .row__right { width: 45%; padding-top: 55%; }
}




@media screen and (max-width: 767px) {
    .kandidat__districts { position: fixed; top: 7rem; left: 0rem; width: 100%; padding: 2rem; height: calc(100% - 7rem); overflow: auto; }

    .kandidaten__flags { float: left; padding-top: 1rem; padding-bottom: 1rem; clear: both; }

    .body--isold .kdetail .row__left { width: 50%; }
    .body--isold .kdetail .row__right { width:100%; padding-top:2rem; }
}

@media screen and (max-width: 767px) {


    .kandidat .district-header { height: 3.5rem; }
    .kandidat .district-header img { width: 4.5rem; }

    .kandidat .row__right { }
    .kandidat .tabs { }
    .kandidat .info { position: relative; top: 0rem; left: 0rem; padding: 0rem 0.5rem 1rem 0rem; }

    .kandidat .tabcontent { position: relative; top: 0rem; left: 0rem; padding-left: 0rem; }
    .kandidat .tabs { position: relative; top: 0rem; left: 0rem; }
    .kandidat .tabs[data-count="1"] { display: none; }

    .kdetail .row__left { width: 100%; }
    .kdetail .row__right { width: 100%; padding-top: 0%; margin-bottom: 0rem; float: none; clear: both; position: relative; padding-bottom: 0rem; padding-top: 2rem; }
}




@media screen and (max-width: 480px) {

    .kandidat .district-header h3 { float: none; clear: both; }
    .kandidat .district-header h4 { float: none; clear: both; margin-top: 0.3em; font-weight: normal; }

    .kandidat .tabs li.active a { font-weight: normal; }

    .sthk table th:nth-child(2) li { min-height: 4.5em; }
    .sthk table th:nth-child(2) li span:first-child { border-width: 0px 0px 5px 0px; padding-bottom: 0.5em; padding-right: 0em; display: block; min-height: inherit; }
}

@media screen and (max-width: 400px) {
    .kandidat .district-header h4 { font-size: 1.2em; }
    .kandidat table { font-size: 9px; }

    .kandidat p { font-size: 1.5em; }

    .kandidat .info { padding: 1em 0em 1em 0em; position: relative; top: 0em; left: 0em; }
    .kandidat .tabcontent { display: block; padding: 0em 0em 1em 0em; position: relative; top: 0em; left: 0em; }
    .kandidat .tabs { display: none; }
    .kdetail .portrait { max-width: 100%; }
}

@media screen and (max-width: 325px) {
    .kandidat .district-header h4 { font-size: 1.2em; }
}

