body {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    margin:0;
    font-family:"futura-pt";
    font-weight:400;
}

main {
    position:relative;
    left:0;
    top:0;
    width:100%;
    overflow:hidden;
}

h3 {
    line-height: 1.2;
    font-size:2rem;
}

p {
    font-weight:400;
}

.overlay {
    position:fixed;
    height:100vh;
    width:100vw;
    top:-100vh;
    transition:top 0.9s ease;
    z-index:101;
    overflow:auto;
    background-color:#ffffff;
}

.overlay.visible {
    top:0;
}

.overlay-scroller {
    position:absolute;
    overflow:hidden;
    width:100%;
    top:0;
    left:0;
}

.menu-back {
    position:relative;
    color:#ffffff;
    font-size:1.6vw;
    z-index:10;
    display:inline-block;
    line-height:1.6vw;
    width:auto;
    height:auto;
    margin-right:2vw;
    border:#ffffff 1px solid;
    padding:0.4vw 8px;
    left:6vw;
    top:4vw;
    transition:transform 0.4s ease;
    transform:rotate(6deg) scale(1);
    cursor:pointer;
}

.menu-back:hover {
    transform:rotate(6deg) scale(1.2);
}

.overlay .headline-banner {
    background-color:#ed1c24;
}

#overlay-manifesto {
    z-index:102;
}

#overlay-climate .headline {
    background-color:#75bb5c;
}

#overlay-mobility .headline {
    background-color:#00bff3;
}

#overlay-health .headline {
    background-color:#56c2b6;
}

#overlay-economy .headline {
    background-color:#ed1c24;
}

#overlay-housing .headline {
    background-color:#fff200;
}

#overlay-housing .headline h1 {
    color:#ed1c24;
}

#overlay-housing .headline h2 {
    color:#ed1c24;
}

#overlay-solidarity .headline {
    background-color:#ec008c;
}

.overlay .headline img {
    position:absolute;
    height:50%;
    top:20%;
    transform:rotate(-6deg);
    right:20%;
}

.motto {
    transform-origin: 0 0;
    position:relative;
    transform:rotate(-6deg);
    width:100%;
    left:0%;
    margin-top:3rem;
    margin-bottom:3rem;
}

.motto h3 {
    margin:0;
    color:#ed1c24;
    font-size:3.4vw;
    text-align: center;
    left: 10vw;
    position: relative;
    padding-top:4.5vw;
    transform:rotate(6deg);
}

.motto h3:first-of-type {
    left: -10vw;
    padding-top:4vw;
}

.subtext {
    transform-origin: 0 0;
    position:relative;
    width:100%;
    left:0%;
    white-space: nowrap;
}

.subtext .themes-background {
    left:-50vw;
    width:200vw;
    height:100%;
    transform:rotate(-6deg);
}

.subtext .subtext-column {
    position:relative;
    width:30%;
    display:inline-block;
    text-align:center;
    white-space: normal;
    color:#ffffff;
    font-size:1.2rem;
    z-index:1;
    padding-bottom:60px;
    padding-top:2rem;
    padding-left:15%;
    padding-right:5%;
    padding-bottom:12vw;
}

.subtext .subtext-column:last-of-type {
    padding-left:5%;
}

.subtext .subtext-column.only {
    padding-left:35%;
}

.overlay .themes .themes-inner p {
    max-height:none;
}

.manifesto-link {
    position:relative;
}

#overlay-climate .subtext .themes-background {
    background-color:#549c3c;
}

/*
#overlay-climate .themes-column:first-of-type {
    width:30%;
}

#overlay-climate .themes-column:nth-child(2) {
    width:40%;
}

#overlay-climate .themes-column:last-of-type {
    width:30%;
}
*/

#overlay-climate .themes .themes-column:first-of-type div:first-of-type .themes-background {
    background-color:#75bb5c;
}

#overlay-climate .themes .themes-column:first-of-type div .themes-background {
    background-color:#00a75e;
}

#overlay-climate .themes .themes-column:nth-child(2) div:first-of-type .themes-background {
    background-color:#549c3c;
}

#overlay-climate .themes .themes-column:last-of-type div .themes-background {
    background-color:#75bb5c;
}

#overlay-health .subtext .themes-background {
    background-color:#2da197;
}

#overlay-health .themes-column:first-of-type {
    width:30%;
}

#overlay-health .themes-column:nth-child(2) {
    width:40%;
}

#overlay-health .themes-column:last-of-type {
    width:30%;
}

#overlay-health .themes .themes-column:first-of-type div:first-of-type .themes-background {
    background-color:#75b9b0;
}

#overlay-health .themes .themes-column:first-of-type div .themes-background {
    background-color:#00988E;
}

#overlay-health .themes .themes-column:nth-child(2) div:first-of-type .themes-background {
    background-color:#00988e;
}

#overlay-health .themes .themes-column:nth-child(2) div .themes-background {
    background-color:#94cfc1;
}

#overlay-health .themes .themes-column:nth-child(2) div:last-of-type .themes-background {
    background-color:#37988a;
}

#overlay-health .themes .themes-column:last-of-type div .themes-background {
    background-color:#57bba9;
}

.logo {
    position:absolute;
    right:5%;
    top:4vw;
    width:15%;
    z-index:100;
}

.logo img {
    position:absolute;
    width:100%;
    right:0;
    top:0;
}

svg {
    width:100%;
}

.headline {
    position:relative;
    left:0;
    top:0;
    width:76%;
    height:45vh;
    color:#ffffff;
    background-color:#ed1c24;
    transform:rotate(-6deg);
    transform-origin: 0 100%;
    z-index:1;
}

.headline h1 {
    position:absolute;
    left:6vw;
    bottom:40px;
    font-size:2.5vw;
    transform:rotate(6deg);
    text-align:left;
    font-weight:700;
    color:#ffffff;
}

.headline h2 {
    position:absolute;
    left:6vw;
    bottom:38px;
    font-size:1.1vw;
    transform:rotate(6deg);
    text-align:center;
    font-weight:700;
    color:#ffffff;
}

.headline-social-media {
    position:absolute;
    right:5%;
    bottom:20%;
    height:2vw;
    white-space:nowrap;
    transform:rotate(6deg);
}

.headline-social-media a {
    position:relative;
    display:inline-block;
    width:2vw;
    height:2vw;
    margin-right:1vw;
    cursor:pointer;
    transform:scale(1);
    transition:transform 0.5s ease;
    vertical-align: top;
}

.headline-social-media a#menu-manifesto {
    position:relative;
    color:#ffffff;
    font-size:1vw;
    z-index:10;
    display:inline-block;
    line-height:1.4vw;
    width:auto;
    height:auto;
    margin-right:2vw;
    border:#ffffff 1px solid;
    padding:0.3vw 4px;
}

.headline-social-media a:hover {
    transform:scale(1.3);
}

.headline-social-media a img {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
}

.headline-banner {
    position:absolute;
    width:40%;
    left:95%;
    bottom:-2rem;
    height:3rem;
    background-color:#812990;
}

.headline .headline-banner-image, .overlay .headline .headline-banner-image {
    position:absolute;
    left:0;
    top:0;
    height:100%;
    transform:rotate(6deg);
}

.headline-banner p {
    font-family:"futura-pt-condensed";
    position:absolute;
    line-height:3rem;
    left:3rem;
    font-weight:600;
    font-size:1.6rem;
    margin:0;
}

.themes {
    position:relative;
    left:0;
    width:100%;
    transform:rotate(-6deg);
    transform-origin: 0 0;
}

.themes-column {
    position:relative;
    left:-3vw;
    top:0;
    width:32%;
    display:inline-block;
    vertical-align: top;
}

.themes-column > div {
    position:relative;
    padding:1rem;
}

.themes-column:first-of-type {
    width:40%;
}

.themes-column:last-of-type {
    width:28%;
}

.themes-inner {
    position:relative;
    padding-left:32px;
    padding-right:32px;
    line-height:1.6;
    margin-bottom:32px;
    color:#ffffff;
    text-align:center;
}

.themes-column > div .themes-inner p {
    max-height:0rem;
    transition:max-height 1.4s ease;
    overflow:hidden;
}

.themes-column > div.expanded .themes-inner p {
    max-height:50rem;
}

.themes-background {
    position:absolute;
    top:0;
    height:100%;
    width:100%;
    overflow:hidden;
}

.themes-background img {
    position:absolute;
}

.themes-inner .button {
    display:inline-block;
    position:relative;
    border:#ffffff 1px solid;
    padding:4px 6px;
    font-size:1.2rem;
    margin-top:1rem;
    margin-bottom:1rem;
    transition:transform 0.4s ease;
    cursor:pointer;
    transform:scale(1);
}

.themes-inner .button:hover {
    transform:scale(1.2);
}

.themes-column:first-of-type .themes-background {
    right:0;
    width:100vw;
}

.themes-column:first-of-type div:last-of-type .themes-background {
    height:400%;
}

.themes-column:nth-child(2) .themes-background {
    left:0;
    width:100%;
}

.themes-column:nth-child(2) div:last-of-type .themes-background {
    height:400%;
}

.themes-column:last-of-type .themes-background {
    left:0;
    width:100vw;
}

#themes-climate .themes-background {
    background-color:#7dc35c;
}

#themes-climate-image {
    bottom:-5%;
    height:80%;
    right:20vw;
}

#themes-mobility .themes-background {
    background-color:#00bff3;
    height:400%;
}

#themes-mobility-image {
    bottom:72.5%;
    width:20vw;
    right:-1vw;
    transform:rotate(6deg);
}

#themes-health .themes-background {
    background-color:#56c2b6;
}

.themes-column:nth-child(2) > div:first-of-type .themes-inner {
    top:2rem;
    margin-bottom:4rem;
}

.themes-column:nth-child(3)> div:first-of-type .themes-inner {
    top:4rem;
    margin-bottom:6rem;
}

#themes-health-image {
    top:-5%;
    height:60%;
    right:20%;
}

#themes-economy .themes-background {
    background-color:#ed1c24;
}

#themes-economy-image {
    top:20%;
    width:40%;
    right:5%;
}

#themes-housing .themes-background {
    background-color:#fff200;
}

#themes-housing .themes-inner {
    color:#000000;
}

#themes-housing-image-1 {
    bottom:2%;
    height:50%;
    left:2%;
    transform:rotate(6deg);
}

#themes-housing-image-2 {
    top:-5%;
    height:40%;
    left:20vw;
    transform:rotate(6deg);
}

#themes-housing .themes-inner .button {
    border:#000000 1px solid;
}

.logo-2 {
    position:relative;
    left:25%;
    top:4vw;
    width:50%;
    z-index:100;
    transform:rotate(6deg);
    opacity:0;
    transition:opacity 2.8s ease;
}

.logo-2.visible {
    opacity:1;
}

.logo-2 img {
    position:absolute;
    width:100%;
    right:0;
    top:0;
}

#solidarity {
    position:relative;
    padding:1rem;
    z-index:1;
    transform:rotate(-6deg);
}

#solidarity h3 {
    position:absolute;
    top:5rem;
    left:60%;
    color:#ffffff;
    transform:rotate(6deg);
    text-align:center;
}

#solidarity h3 strong {
    font-size:3rem;
}

#solidarity .themes-background {
    left:-50vw;
    width:200vw;
    height:200%;
    background-color:#ec008c;
}

#solidarity .themes-inner {
    position:relative;
    width:30%;
    left:20%;
    transform:rotate(6deg);
    padding-top:4vw;
    padding-bottom:1vw;
    font-size:1.2rem;
}

#themes-solidarity-image {
    top:18%;
    width:10%;
    left:51%;
    transform:rotate(6deg);
}

#candidates-photo {
    position:relative;
    z-index:2;
    width:140vw;
    left:-20vw;
    height:40vw;
    transform:rotate(-6deg);
    overflow:hidden;
}

#candidates-photo img {
    position:absolute;
    width:100%;
    left:2%;
    top:-8vw;
    transform:rotate(6deg);
}

#introduction {
    padding-top:0vw;
    position:relative;
    z-index:2;
    width:100%;
    white-space: nowrap;
    transform:rotate(-6deg);
    line-height:1.6;
}

#introduction .background {
    position:absolute;
    left:-50vw;
    top:-2rem;
    width:200vw;
    height:200%;
    background-color:#56c2b6;
}

.introduction-column {
    position:relative;
    left:20%;
    width:30%;
    display:inline-block;
    text-align:center;
    white-space: normal;
    color:#ffffff;
    font-size:1.2rem;
    transform:rotate(6deg);
    z-index:1;
    padding-bottom:60px;
    padding-top:2rem;
}

.introduction-column:first-of-type {
    color:#ed1c24;
    font-size:3.4rem;
    top:8rem;
    vertical-align: top;
    padding-top:0;
}

.introduction-column:first-of-type p {
    font-weight:700;
    line-height:1.2;
    margin:0;
    position:relative;
}

.introduction-column:first-of-type p:nth-child(1) {
    left:0.4rem;
}

.introduction-column:first-of-type p:nth-child(3) {
    left:-2.4rem;
}

.introduction-column:first-of-type p:nth-child(4) {
    left:-0.8rem;
}

/* ********* */
/* Manifesto */
/* ********* */
body > section > article {
    position:relative;
    left:0;
    right:0;
    margin:0 auto;
    width:1080px;
    top:0;
    overflow:hidden;
    padding-top:20px;
    padding-bottom:60px;
}

body > section > article > h1 {
    font-size:1.8rem;
    font-weight:300;
    line-height:1.5;
}

body > main + section > article > h1 {
    display:none;
}

body > section > article > aside {
    position:relative;
    float:left;
    width:30%;
    margin-right:3%;
    margin-bottom:20px;
    height:auto;
    height:calc(100vh - 220px);
    overflow:auto;
}

body > section > article > aside img {
    position:relative;
    float:left;
    width:100%;
    height:auto;
}

body > section > article > aside > ul {
    list-style-type:none;
    padding-left:6px;
    font-size:1rem;
    line-height:1.3;
}

body > section > article > aside > ul li {
    margin-top:1rem;
    padding-left: 2em;
    text-indent:-2em;
}

body > section > article > aside > ul > ul {
    list-style-type:none;
    padding-left:18px;
    font-size:1rem;
    line-height:1.3;
}

body > section > article > aside .manifesto-link.active {
    font-weight:600;
    color:#000000;
}

body > section > article > aside > ul > ul > li {
    margin-top:0.4rem;
}

body > section > article > aside a {
    text-decoration: none;
    color:#232323;
}

body > section > article > main {
    position:relative;
    top:0;
    width:65%;
    line-height:1.8;
    overflow:auto;
    height:calc(100vh - 220px);
    padding-right:16px;
    transition:opacity 0.8s ease;
    opacity:1;
}

body > section > article > main.loading {
    opacity:0.3;
}

body > section > article > main > *:first-child {
    margin-top:0;
}

body > section > article > main > h1 {
    font-size:1.8rem;
    font-weight:300;
    line-height:1.5;
}

body > section > article > a:last-of-type {
    position:absolute;
    display:inline-block;
    font-size:0.8rem;
    height: 30px;
    background-color:#df0404;
    color: #ffffff;
    padding: 0px 14px;
    line-height: 30px;
    transition: color 0.4s ease, background-color 0.2s ease, border 0.3s ease;
    cursor: pointer;
    margin:0px 4px;
    border:1px solid #df0404;
    margin-top:40px;
    right:8px;
    bottom:8px;
    margin-bottom:30px;
}

body > section > article > a:last-of-type:hover {
    background-color:#000000;
    border:1px solid #000000;
}

body > section > article a.manifesto-link {
    position:relative;;
    display:inline-block;
    font-size:0.8rem;
    height: 30px;
    color: #ffffff;
    padding: 0px 14px;
    line-height: 30px;
    transition: color 0.4s ease, background-color 0.2s ease, border 0.3s ease;
    cursor: pointer;
    margin:0px 4px;
    border:1px solid #df0404;
    margin-top:40px;
    text-decoration:none;
    margin-bottom:40px;
}

body > section > article a.manifesto-link.left {
    border:1px solid #000000;
    color:#000000;
    float:left;
    margin-left:16px;
}

body > section > article a.manifesto-link.left:hover {
    background-color: #787878;
    color: #ffffff;
    border: 1px solid #787878;
}

body > section > article a.manifesto-link.right {
    border:1px solid #df0404;
    background-color:#df0404;
    float:right;
    margin-right:16px;
}

body > section > article a.manifesto-link.right:hover {
    background-color:#000000;
    border:1px solid #000000;
}

@media (max-width:1199px) {
    .overlay .motto h3 {
        font-size:6vw;
        left:4vw;
    }

    .overlay .motto h3 {
        left:-4vw;
    }

    .overlay .subtext {
        white-space:normal;
        padding-top:2rem;
        padding-bottom:6rem;
    }

    .overlay .subtext .themes-background {
        transform:rotate(-6deg);
    }

    .overlay .subtext .subtext-column {
        width:auto;
        padding-left:16px;
        padding-right:16px;
        padding-bottom:0;
        padding-top:0;
    }

    .headline {
        height:35vh;
        min-height:25vw;
    }

    .headline h1 {
        font-size:3vw;
    }

    .headline h2 {
        font-size:1.2vw;
    }

    .headline-social-media {
        bottom:30%;
        height:3vw;
    }

    .headline-social-media a {
        width:3vw;
        height:3vw;
        margin-right:1.5vw;
    }

    .headline-social-media a#menu-manifesto {
        font-size:1.6vw;
        padding:0.6vw 6px;
        line-height:1.6vw;
    }

    .headline-banner p {
        font-size:1.2rem;
    }

    .themes-column {
        width:50%;
        left:-6vw;
    }

    .themes-column:first-of-type {
        width:50%;
    }

    .themes-column:last-of-type {
        width:100%;
    }

    .themes-column:last-of-type > div {
        width:60%;
        left:20%;
    }

    #overlay-health .themes-column:first-of-type {
        width:50%;
    }

    #overlay-health .themes-column:nth-child(2) {
        width:50%;
    }

    #overlay-health .themes-column:last-of-type {
        width:100%;
    }

    #themes-mobility-image {
        bottom:80.5%;
        right:2vw;
    }

    .themes-column:nth-child(2) .themes-background {
        width:100vw;
    }

    #themes-health-image {
        right:70%;
    }

    #themes-economy .themes-inner {
        padding-right:64px;
    }

    #themes-economy-image {
        right:55%;
    }

    .themes-column:last-of-type .themes-background {
        left:-50vw;
        width:200vw;
        height:150%;
    }

    #themes-housing-image-1 {
        left:27%;
        bottom:31%;
        height:25%;
    }

    #themes-housing-image-2 {
        left:47%;
        height:20%;
    }

    .themes-column:last-of-type > div:first-of-type .themes-inner {
        top:1rem;
    }

    #solidarity h3 {
        left:63%;
    }

    #solidarity .themes-inner {
        left:10%;
        width:40%;
    }

    .introduction-column {
        left:10%;
        width:40%;
    }
/*
    .themes-column:last-of-type::before {
        content:'<br/>';
    }
    */
}

@media (max-width:899px) {
    .subtext .themes-background {
        transform:rotate(0deg);
    }

    .logo {
        right: 3%;
        top: 10vw;
        width: 20%;
    }

    .headline {
        height:25vh;
        min-height:40vw;
    }

    .headline h1 {
        font-size:6vw;
        bottom:7.4vw;
    }

    .headline h2 {
        font-size:2.8vw;
        bottom:6.6vw;
    }

    .headline-social-media {
        bottom:60%;
    }

    .headline-social-media a {
        width:5vw;
        height:5vw;
        margin-right:2vw;
    }

    .headline-social-media a#menu-manifesto {
        font-size:2.4vw;
        padding:1.3vw 6px;
        line-height:2.4vw;
        margin-right:3vw;
    }

    .headline-banner {
        left:65%;
        width:70%;
        height:8vw;
        bottom:-6vw;
    }

    .headline-banner-image {
        left:0.5vw;
    }

    .headline-banner p {
        left:9.5vw;
        font-size:4vw;
        line-height:8vw;
    }

    .menu-back {
        font-size:3vw;
        left:8vw;
        top:5vw;
        line-height:3vw;
    }

    .themes {
        transform:rotate(0deg);
    }

    .themes-column {
        width:100%;
        left:0;
    }

    .themes-column:first-of-type {
        width:100%;
    }

    .themes-column:last-of-type {
        width:100%;
    }

    #overlay-health .themes-column:first-of-type {
        width:100%;
    }

    #overlay-health .themes-column:nth-child(2) {
        width:100%;
    }

    #overlay-health .themes-column:last-of-type {
        width:100%;
    }

    .themes-background {
        transform:rotate(-6deg);
    }

    .themes-inner {
        padding-left:16px;
        padding-right:16px;
    }

    .themes .themes-column .themes-background {
        width:200vw;
        left:-0vw;
        height:200%;
    }

    .themes .themes-column div:first-of-type .themes-background {
        left:-50vw;
    }

    .themes-column:first-of-type div:first-of-type .themes-background {
        top:-5.2vw;
    }

    #themes-climate-image {
        bottom: 45%;
        height: 40%;
        right: 30%;
    }

    .themes-column:first-of-type div:last-of-type .themes-background {
        top:-2rem;
    }

    #themes-mobility-image {
        bottom: 65%;
        width: 40%;
        right: 50%;
    }

    #themes-health-image {
        height: 30%;
        right: 20%;
    }

    .themes-column:nth-child(2) div:last-of-type .themes-background {
        top:-2rem;
    }

    #themes-economy .themes-inner {
        padding-right:16px;
    }

    .themes-column:last-of-type > div:first-of-type {
        width:auto;
        left:0;
    }

    #themes-housing-image-1 {
        left: 27%;
        bottom: 51%;
    }

    #themes-housing-image-2 {
        left: 67%;
        height: 20%;
    }

    #solidarity {
        transform:rotate(0deg);
    }

    #solidarity h3 {
        position:relative;
        top:0;
        left:0;
        width:100%;
        font-size:1.4rem;
        transform:rotate(0deg);
    }

    #solidarity h3 strong {
        font-size:2rem;
    }

    #solidarity .themes-inner {
        left:0;
        width:auto;
        transform:rotate(0deg);
    }

    #themes-solidarity-image {
        left: 41%;
        width: 41%;
    }

    #candidates-photo {
        height:80vw;
    }

    #introduction {
        transform:rotate(0deg);
        white-space: normal;
    }

    #introduction .background {
        transform:rotate(-6deg);
    }

    .introduction-column {
        left:0%;
        transform:rotate(0deg);
        padding-left:32px;
        padding-right:32px;
        width:auto;
        padding-top:1rem;
    }

    .introduction-column:first-of-type {
        font-size:2.6rem;
        top:2rem;
        padding-left:0px;
        padding-right:0px;
        width:100%;
    }
}