/*Typography*/
html {
    font-family: "Open Sans", "Segoe UI", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}

body {
    color: #232d33;
    -moz-hyphens: manual;
    -ms-hyphens: manual;
    -webkit-hyphens: manual;
    hyphens: manual;
    overflow-y: scroll;
}

h1, h2, h3 {
    font-weight: 700;

}

h1, h2, h3,
h1.heading,
h1.heading .fill-color{
    color: #444;
}
h1.heading{
    font-weight: bold;
}

h1, h2, h3, .heading  {
    font-family: "Source Sans Pro", cursive;

}

.heading{
    color: #468857;
}

h1{
    margin-top: 0.6rem;
    margin-bottom: 0.6rem;
    font-weight: 300;
    color: #518abe;
    font-size: 2em;
}
.fill-color{
    fill: #518abe;
}

h2,h3 {
    font-size: 1.5em;
    margin-top: 0;
    margin-bottom: 0.6rem;
}
h3{
    font-size: 1.4em;
}

.blue{
    color:#518abe;
}

h4 {
    font-size: 1.4em;
    font-weight: normal;
}

h5 {
    font-size: 1.2em;
    font-weight: normal;
}

h6 {
    font-size: 1em;
}

@media handheld, only screen and (max-width: 55em) {
    h1 {
        font-size: 1.8em;
        margin-top: 0.3em;
        margin-bottom: 0.6em;
    }
}
@media handheld, only screen and (max-width: 40em) {
    h1 {
        font-size: 1.5em;
        margin-top: 0.3em;
        margin-bottom: 0.6em;
    }
}

@media handheld, only screen and (max-width: 30em) {
    h1 {
        font-size: 1.2em;
        margin-top: 0.3em;
        margin-bottom: 0.6em;
    }

    h2 {
        font-size: 1.6em;
    }

    h3 {
        font-size: 1.4em;
    }
}

@media handheld, only screen and (max-width: 25em) {
    h1 {
        font-size: 1.2em;
        margin-top: 0.3em;
        margin-bottom: 0.6em;
    }
}
/*Generic*/
pre {
    background-color: #f6f6f6;
    color: inherit;
}

code, pre code {
    font-size: 0.8em;
    color: #e01b6a;
}

a {
    color: #e01b6a;
}

input.plain, .transition {
    -webkit-transition-duration: 150ms;
    -moz-transition-duration: 150ms;
    -o-transition-duration: 150ms;
    transition-duration: 150ms;
    -webkit-transition-property: background, color, border-color, top, margin, padding, box-shadow;
    -moz-transition-property: background, color, border-color, top, margin, padding, box-shadow;
    -o-transition-property: background, color, border-color, top, margin, padding, box-shadow;
    transition-property: background, color, border-color, top, margin, padding, box-shadow;
}

.row {
    background-repeat: no-repeat;
    background-position: center bottom;
}

.invisible {
    width: 0;
    height: 0;
    overflow: hidden;
}


/*Dark sections*/
.dark {
    background-color: #222933;
    color: #fff;
    font-weight: 300;
}
.am-1 .dark{ background-color: #181E25; }
.am-2 .dark{ background-color: #181E25; }
.am-3 .dark{ background-color: #181E25; }
.am-4 .dark{ background-color: #414F62; }
.am-5 .dark{ background-color: #4B5B71; }
.am-6 .dark{ background-color: #4B5B71; }
.am-7 .dark{ background-color: #607490; }
.am-8 .dark{ background-color: #607490; }
.am-9 .dark{ background-color: #607490; }
.am-10 .dark{ background-color: #6C819D; }
.am-11 .dark{ background-color: #607490; }
.pm-12 .dark{ background-color: #566881; }

.pm-1 .dark{ background-color: #414F62; }
.pm-2 .dark{ background-color: #374353; }
.pm-3 .dark{ background-color: #374353; }
.pm-4 .dark{ background-color: #2D3643; }
.pm-5 .dark{ background-color: #2D3643; }
.pm-6 .dark{ background-color: #2D3643; }
.pm-7 .dark{ background-color: #222933; }
.pm-8 .dark{ background-color: #222933; }
.pm-9 .dark{ background-color: #2D3643; }
.pm-10 .dark{ background-color: #181E25; color: #e0e0e0; }
.pm-11 .dark{ background-color: #181E25; color: #e0e0e0; }
.am-12 .dark{ background-color: #181E25; color: #e0e0e0; }

.dark.not-so-dark {
    color: #444444;
    background-color: #94ba9d;
}
.dark.not-so-dark h2
{
    /*color:*/
}
.dark a {
    text-decoration: none;
    color: #ffffff;
}

.dark a:active {
    /*color: #e01b6a;*/
}

.dark .discreet {
    color: #737b80;
}

.dark ::selection {
    background-color: #a1acb3;
    color: #fff;
}

.dark ::-moz-selection {
    background-color: #a1acb3;
    color: #fff;
}

/*Master title*/
div.heading,
.row-tv .row-content {
    line-height: 1em;
}

div.heading a, div.heading a:hover, div.heading a:focus {
    color: inherit;
}

div.heading small {
    font-size: 0.5em;
    line-height: 1;
}

/*Intro*/
.row-intro,
.row-tv {
    line-height: 1.6;
}

.row-tv {
    font-size: 1.6em;
    clear: both;
}


.row-intro .row-content,
.row-tv .row-content {
    max-width: 60em;
}

.row-intro div.heading,
.row-tv .row-content {
    font-size: 5em;
    text-align: center;
    color: #ffffff;
}

.row-intro div.heading a {
    -webkit-transition-duration: 0ms;
    -moz-transition-duration: 0ms;
    -o-transition-duration: 0ms;
    transition-duration: 0ms;
}

.row-content .excerpt {
    font-size: 1.2em;
    padding-bottom: 1.2em;
}

/**
    Slideshow positioning
    ul.slideshow    -   position: relative
      li            -   position: absolute     (stack all li elements on top of each other in preparation for cross fade)
        span        -   display:  table-cell  in order for vertical-align: middle to work
*/

ul.slideshow{
    padding: 0;
    margin: 0;
    position: relative;
}
.slideshow li
 {
    position: absolute;
    list-style-type: none;
    width: inherit;
    height: inherit;
}

.slideshow li span {
    display: table-cell;
    vertical-align: middle;
    width: 50%;
    height: inherit;
    font-family: "Lobster Two", fantasy;
    color: #990055;
}

.intro .slideshow li span{
    text-align: left;
}

/* SLIDESHOW fade in out

for more information see: http://css3.bradshawenterprises.com/cfimg/#cf4a

For "n" elements You must define:
a=presentation time for one element
b=duration for cross fading
Total animation-duration is of course t=(a+b)*n

animation-delay = t/n or = a+b

Percentage for keyframes:

0%
a/t*100%
(a+b)/t*100% = 1/n*100%
100%-(b/t*100%)
100%

*/

.slideshow li {
    opacity: 0; /* set initial opacity to zero and then define keyframes for opacity 1 and animation delay */
    -webkit-animation-name: xfade;
    -moz-animation-name: xfade;
    -o-animation-name: xfade;
    animation-name: xfade;
    -webkit-animation-duration: 18s;
    -moz-animation-duration: 18s;
    -o-animation-duration: 18s;
    animation-duration: 18s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@-webkit-keyframes xfade {
    0% {
        opacity: 1;
    }
    28.5714% {
        opacity: 1;
    }
    33.3333% {
        opacity: 0;
    }
    95.2381% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes xfade {
    0% {
        opacity: 1;
    }
    28.5714% {
        opacity: 1;
    }
    33.3333% {
        opacity: 0;
    }
    95.2381% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.screen svg .icon8 {
    -webkit-animation-delay: -42s;
    -moz-animation-delay: -42s;
    -o-animation-delay: -42s;
    animation-delay: -42s;
}

.screen svg .icon7 {
    -webkit-animation-delay: -36s;
    -moz-animation-delay: -36s;
    -o-animation-delay: -36s;
    animation-delay: -36s;
}

.screen svg .icon6 {
    -webkit-animation-delay: -30s;
    -moz-animation-delay: -30s;
    -o-animation-delay: -30s;
    animation-delay: -30s;
}

.screen svg .icon5 {
    -webkit-animation-delay: -24s;
    -moz-animation-delay: -24s;
    -o-animation-delay: -24s;
    animation-delay: -24s;
}


.screen svg .icon4 {
    -webkit-animation-delay: -18s;
    -moz-animation-delay: -18s;
    -o-animation-delay: -18s;
    animation-delay: -18s;
}

.slideshow img:nth-child(3),
.slideshow li:nth-child(3),
.screen svg .icon3 {
    -webkit-animation-delay: -12s;
    -moz-animation-delay: -12s;
    -o-animation-delay: -12s;
    animation-delay: -12s;
}

.slideshow img:nth-child(2),
.slideshow li:nth-child(2),
.screen svg .icon2 {
    -webkit-animation-delay: -6s;
    -moz-animation-delay: -6s;
    -o-animation-delay: -6s;
    animation-delay: -6s;
}

.slideshow img:nth-child(1),
.slideshow li:nth-child(1),
.screen svg .icon1 {
    -webkit-animation-delay: 0s;
    -moz-animation-delay: 0s;
    -o-animation-delay: 0s;
    animation-delay: 0s;
}



.row-tv .screen,
ul.slideshow{
    height: 12em;
}
input[type="radio"].additional-info-button{
    display: none;
}
.additional-info-content p:first-child{
    margin-top: 0;
}
.additional-info-content p:last-child{
    margin-bottom: 0;
}
input[type="radio"]:checked.additional-info-button ~ .additional-info-content,
.container{
    /*height: 5em;*/

}
.contain{
    /*position: absolute;*/
}

input[type="radio"].additional-info-button ~ .additional-info-content{
    display: none;
    opacity: 0;
    /*width: 40em;*/
    height: 8em;
    z-index: -100;
    /*-webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    transition: all 0.2s ease;*/
    margin: 0;
    padding: 0 0 0 0.5em;
}

input[type="radio"].additional-info-button ~ .additional-info-content.sub {
    height: 6.5em;
    margin-top: 0.5em;
}
.scroll{
    overflow-y: scroll;
}

.scrollable{
    overflow-y: auto;
}

input[type="radio"]:checked.additional-info-button.relax ~ .additional-info-content.relax,
input[type="radio"]:checked.additional-info-button.nature ~ .additional-info-content.nature,
input[type="radio"]:checked.additional-info-button.culture ~ .additional-info-content.culture,
input[type="radio"]:checked.additional-info-button.active ~ .additional-info-content.active,
input[type="radio"]:checked.additional-info-button.january ~ .additional-info-content.january,
input[type="radio"]:checked.additional-info-button.april ~ .additional-info-content.april,
input[type="radio"]:checked.additional-info-button.june ~ .additional-info-content.june,
input[type="radio"]:checked.additional-info-button.july ~ .additional-info-content.july,
input[type="radio"]:checked.additional-info-button.september ~ .additional-info-content.september,
input[type="radio"]:checked.additional-info-button.october ~ .additional-info-content.october,
input[type="radio"]:checked.additional-info-button.december ~ .additional-info-content.december
{
    top:0;
    opacity: 1;
    display: block;
    height: 21em;
    /*-webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -o-transition: all 0.8s ease;
    -ms-transition: all 0.8s ease;
    transition: all 0.8s ease;
    z-index: 100;*/
}

@media handheld, only screen and (min-width: 55em) {
    input[type="radio"]:checked.additional-info-button.first ~ .additional-info-content.first,
    input[type="radio"]:checked.additional-info-button.second ~ .additional-info-content.second,
    input[type="radio"]:checked.additional-info-button.third ~ .additional-info-content.third,
    input[type="radio"]:checked.additional-info-button.fourth ~ .additional-info-content.fourth,
    input[type="radio"]:checked.additional-info-button.fifth ~ .additional-info-content.fifth,
    input[type="radio"]:checked.additional-info-button.sixth ~ .additional-info-content.sixth,
    input[type="radio"]:checked.additional-info-button.seventh ~ .additional-info-content.seventh,
    input[type="radio"]:checked.additional-info-button.eighth ~ .additional-info-content.eighth,
    input[type="radio"]:checked.additional-info-button.ninth ~ .additional-info-content.ninth,
    input[type="radio"]:checked.additional-info-button.tenth ~ .additional-info-content.tenth,
    input[type="radio"]:checked.additional-info-button.eleventh ~ .additional-info-content.eleventh,
    input[type="radio"]:checked.additional-info-button.twelfth ~ .additional-info-content.twelfth
    {
        top:0;
        opacity: 1;
        display: block;
        /*-webkit-transition: all 0.8s ease;
        -moz-transition: all 0.8s ease;
        -o-transition: all 0.8s ease;
        -ms-transition: all 0.8s ease;
        transition: all 0.8s ease;
        z-index: 100;*/
    }


    input[type="radio"]:checked.additional-info-button.first ~ label.sub.first.tab,
    input[type="radio"]:checked.additional-info-button.second ~ label.sub.second.tab,
    input[type="radio"]:checked.additional-info-button.third ~ label.sub.third.tab,
    input[type="radio"]:checked.additional-info-button.fourth ~ label.sub.fourth.tab,
    input[type="radio"]:checked.additional-info-button.fifth ~ label.sub.fifth.tab,
    input[type="radio"]:checked.additional-info-button.sixth ~ label.sub.sixth.tab,
    input[type="radio"]:checked.additional-info-button.seventh ~ label.sub.seventh.tab,
    input[type="radio"]:checked.additional-info-button.eighth ~ label.sub.eighth.tab,
    input[type="radio"]:checked.additional-info-button.ninth ~ label.sub.ninth.tab,
    input[type="radio"]:checked.additional-info-button.tenth ~ label.sub.tenth.tab,
    input[type="radio"]:checked.additional-info-button.eleventh ~ label.sub.eleventh.tab,
    input[type="radio"]:checked.additional-info-button.twelfth ~ label.sub.twelfth.tab
    {
        background-color: #ffffff;
    }
}

@media handheld, only screen and (max-width: 55em) {
    input[type="radio"]:checked.additional-info-button.small-first-to-third ~ .additional-info-content.first,
    input[type="radio"]:checked.additional-info-button.small-first-to-third ~ .additional-info-content.second,
    input[type="radio"]:checked.additional-info-button.small-first-to-third ~ .additional-info-content.third,
    input[type="radio"]:checked.additional-info-button.small-fourth-to-sixth ~ .additional-info-content.fourth,
    input[type="radio"]:checked.additional-info-button.small-fourth-to-sixth ~ .additional-info-content.fifth,
    input[type="radio"]:checked.additional-info-button.small-fourth-to-sixth ~ .additional-info-content.sixth,
    input[type="radio"]:checked.additional-info-button.small-seventh-to-ninth ~ .additional-info-content.seventh,
    input[type="radio"]:checked.additional-info-button.small-seventh-to-ninth ~ .additional-info-content.eighth,
    input[type="radio"]:checked.additional-info-button.small-seventh-to-ninth ~ .additional-info-content.ninth,
    input[type="radio"]:checked.additional-info-button.small-tenth-to-twelfth ~ .additional-info-content.tenth,
    input[type="radio"]:checked.additional-info-button.small-tenth-to-twelfth ~ .additional-info-content.eleventh,
    input[type="radio"]:checked.additional-info-button.small-tenth-to-twelfth ~ .additional-info-content.twelfth
    {
        top:0;
        opacity: 1;
        display: block;
        /*-webkit-transition: all 0.8s ease;
        -moz-transition: all 0.8s ease;
        -o-transition: all 0.8s ease;
        -ms-transition: all 0.8s ease;
        transition: all 0.8s ease;
        z-index: 100;*/
    }


    input[type="radio"]:checked.additional-info-button.small-first-to-third ~ label.sub.small-first-to-third.tab,
    input[type="radio"]:checked.additional-info-button.small-fourth-to-sixth ~ label.sub.small-fourth-to-sixth.tab,
    input[type="radio"]:checked.additional-info-button.small-seventh-to-ninth ~ label.sub.small-seventh-to-ninth.tab,
    input[type="radio"]:checked.additional-info-button.small-tenth-to-twelfth ~ label.sub.small-tenth-to-twelfth.tab{
        background-color: #ffffff;
    }
}

label + input[type="radio"]:checked.additional-info-button{
    color:#e0e0e0;
    /*transition: all 0.8s ease;*/
}

input[type="radio"]:checked.additional-info-button.first ~ label.sub.icon.first,
input[type="radio"]:checked.additional-info-button.second ~ label.sub.icon.second,
input[type="radio"]:checked.additional-info-button.third ~ label.sub.icon.third,
input[type="radio"]:checked.additional-info-button.fourth ~ label.sub.icon.fourth {
    border-bottom: 0.1rem solid;
}
input[type="radio"]:checked.additional-info-button.first ~ label.sub.first,
input[type="radio"]:checked.additional-info-button.second ~ label.sub.second,
input[type="radio"]:checked.additional-info-button.third ~ label.sub.third,
input[type="radio"]:checked.additional-info-button.fourth ~ label.sub.fourth
{
    text-decoration:none;
}

input[type="radio"]:checked.additional-info-button.first ~ label.sub.first.fill .fill-color,
input[type="radio"]:checked.additional-info-button.second ~ label.sub.second.fill .fill-color,
input[type="radio"]:checked.additional-info-button.third ~ label.sub.third.fill .fill-color,
input[type="radio"]:checked.additional-info-button.fourth ~ label.sub.fourth.fill .fill-color{
    fill: #444444;
}

input[type="radio"].additional-info-button.first ~ label.sub.tab{
    background-color: #E6E6E6;
    border-right:0.1rem dashed #ffffff;
}


input[type="radio"]:checked.additional-info-button.january ~ .column>h2>label.january,
input[type="radio"]:checked.additional-info-button.april ~ .column>h2>label.april,
input[type="radio"]:checked.additional-info-button.june ~ .column>h2>label.june,
input[type="radio"]:checked.additional-info-button.july ~ .column>h2>label.july,
input[type="radio"]:checked.additional-info-button.september ~ .column>h2>label.september,
input[type="radio"]:checked.additional-info-button.october ~ .column>h2>label.october,
input[type="radio"]:checked.additional-info-button.december ~ .column>h2>label.december,
.column>h2>label.january:hover,
.column>h2>label.april:hover,
.column>h2>label.june:hover,
.column>h2>label.july:hover,
.column>h2>label.september:hover,
.column>h2>label.october:hover,
.column>h2>label.december:hover,
input[type="radio"]:checked.additional-info-button.first ~ label.first,
input[type="radio"]:checked.additional-info-button.second ~ label.second,
input[type="radio"]:checked.additional-info-button.third ~ label.third,
input[type="radio"]:checked.additional-info-button.fourth ~ label.fourth,
input[type="radio"]:checked.additional-info-button.relax ~ label.relax,
input[type="radio"]:checked.additional-info-button.nature ~ label.nature,
input[type="radio"]:checked.additional-info-button.culture ~ label.culture,
input[type="radio"]:checked.additional-info-button.active ~ label.active
{
    color:#444444;
}


input[type="radio"]:checked.additional-info-button.relax ~ label.relax .fill-color,
input[type="radio"]:checked.additional-info-button.nature ~ label.nature .fill-color,
input[type="radio"]:checked.additional-info-button.culture ~ label.culture .fill-color,
input[type="radio"]:checked.additional-info-button.active ~ label.active .fill-color
{
    fill:#444444;
}


label.additional-info.sub{
    margin-top: 0.5em;
    display: inline-block;
}

.additional-info-content.buffer-top{
    margin-top: 2rem!important;
}

@media handheld, only screen and (max-width: 55em) {

}

@media handheld, only screen and (max-width: 40em) {
    .row-intro div.heading,
    .row-tv .row-content {
        font-size: 3em;
    }

    .row-tv {
        font-size: 1.1em;
    }
    .row-tv .screen{
        height: 10em;
    }
    ul.slideshow{
        height: 8em;
    }

    label.additional-info{
        font-size: 1.4em;

    }
    label.additional-info::after {
        /*content: " ...";*/
    }
    .img-spinning-circle {
        min-width: 39em;
        width: 39em;
        left: 0;
        top: -15em;
    }

    .row-content .excerpt {
        padding-bottom: 0.8em;
        font-size: 1.1em;
    }
}

@media handheld, only screen and (max-width: 30em) {
    .row-intro div.heading,
    .row-tv .row-content {
        font-size: 2.4em;
    }

    .row-tv {
        font-size: 0.8em;
    }
    .row-tv .screen{
        height: 11em;
    }

    ul.slideshow{
        height: 9em;
    }


    label.additional-info{
        font-size: 1.2em;
    }
    .img-spinning-circle {
        min-width: 43em;
        width: 43em;
        left: -1em;
        top: -17em;
    }

    .row-content .excerpt {
        /*padding-top: 0.8em;*/
        padding-bottom: 0.8em;
        font-size: 0.8em;
    }
}

@media handheld, only screen and (max-width: 25em) {
    .row-intro div.heading,
    .row-tv .row-content {
        font-size: 2.2em;
    }

    .row-tv {
        font-size: 0.8em;
        line-height: 1.3em;
    }

    .row-tv .screen{
        height: 12em;
        width: 11em;
    }

    .row-tv.intro .screen{
        width: 100%;
    }

    .slideshow li{
        text-align: center;
    }

    label.additional-info{
        font-size: 1.1em;
    }

    ul.slideshow{
        height: 14em;
    }

    .img-spinning-circle {
        min-width: 39em;
        width: 39em;
        left: -1em;
        top: -14.2em;
    }

    .row-content .excerpt {
        /*padding-top: 0.55em;*/
        padding-bottom: 0.55em;
        font-size: 0.9em;
    }
}


.row-intro h3 {
    text-align: center;
    font-weight: inherit;
    font-size: 1.4em;
}

/*Title row*/
.row-overview {
    color: #fff;
    font-weight: 300;
    text-align: center;
}

.row-overview .row-content {
    margin-bottom: 1.2em;
}
.row-overview .description {
    margin-top: 3.8em;
    margin-bottom: 4em;
    color: #ffa6a6;
}

/*Menu*/
#menu {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center;
    z-index: 1000;
    /* font-family: "Open Sans Condensed", "Helvetica Neue", Helvetica, Arial, sans-serif; */
}

#menu.fixed {
    position: fixed;
    top: 0;
    left: 0;
    border-bottom: 0.1em solid #efefef;
}
#menu.fixed a{
    color: #e0e0e0;
}

#menu li.selected a{
    color: #fefefe;
}
#menu li {
    display: inline-block;
}

#menu a {
    display: inline-block;
    position: relative;
    padding: 0.4em 1.2em 0.5em 1.2em;
    color: #ffffff;
    text-decoration: none;
    top: 0;
    border-color: transparent;
    font-size: 1.5em;
}



@media handheld, only screen and (max-width: 55em) {
    #menu a {
        font-size: 1.3em;
        padding-right: 1em;
        padding-left: 1em;
        border-top-width: 0.5em;
        border-bottom-width: 0.5em;
    }
}

@media handheld, only screen and (max-width: 40em) {
    #menu a {
        font-size: 1.1em;
        padding-right: 0.8em;
        padding-left: 0.8em;
        border-top-width: 0.5em;
        border-bottom-width: 0.5em;
        font-family: "Open Sans Condensed", fantasy;
    }
}

@media handheld, only screen and (max-width: 30em) {
    #menu a {
        font-size: 1.1em;
        padding-right: 0.8em;
        padding-left: 0.8em;
        border-top-width: 0.5em;
        border-bottom-width: 0.5em;
    }
}

@media handheld, only screen and (max-width: 25em) {
    #menu a {
        padding-right: 0.4em;
        padding-left: 0.4em;
        border-top-width: 0;
        border-bottom-width: 0.2em;
    }
}

#menu li.selected {
    background: url("images/nav_halbkreis.svg") no-repeat center bottom;
    background-size: 1em;
}

#menu a.selected {
    /*color: #A34E75;*/
    background: url("images/nav_halbkreis.svg") no-repeat center bottom;
    background-size: 1em;
}

#menu a:active {
    top: 0.15em;
}

#menu a:hover:active, #menu li.selected a:hover, #menu li.selected a:focus {
    top: 0;
}

/*All reference sections*/
.reference > .row,
.row-kontakt,
.row-impressum {
    border-top-width: 1em;
    border-color: #993366;
    background-image: url("images/halbkreis.svg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 3em;
}

.center {
    text-align: center;
}

.collapsed .sourceContent {
    overflow-y: hidden;
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-top-width: 0;
    border-bottom-width: 0;
    border-color: transparent;
}

/*Medienpaedagogik*/
.row-medienpaedagogik .column p {
    text-align: center;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0.8em;
    padding-bottom: 1em;
}

/* Impressum */

/* Kontakt */
.row-kontakt {
    line-height: 1.6;
}

.row-kontakt div.heading {
    font-size: 3.5em;
}

.row-kontakt h1, .row-kontakt p, .row-kontakt h1 a, .row-kontakt h1 img {
    margin-right: auto;
    margin-left: auto;
}

#kontakt .kontakt p{
    color: #e0e0e0;
}


@media handheld, only screen and (max-width: 40em) {
    #kontakt .kontakt a.first{
        margin-top: 0.5em;
    }
}

#kontakt .kontakt a.border {
    border-top: 0.1em solid rgba(239, 239, 239, 0.2);
}

#kontakt .kontakt a.icon {
    background-size: 2em;
    background-position: center left;
    height: inherit;
    padding-bottom: 1em;
    padding-top: 1em;
    padding-left: 2.5em;
    margin: 0 0 0 0.2em;
    width: 15em;
}
#kontakt .kontakt a.first{
    margin-top: 0.8em;
}
.row-kontakt .row-content {
    max-width: 50em;
}

.row-kontakt .column.fixed {
    width: 3.8em;
}

.row-kontakt .column.fluid.right > .column-content {
    margin-left: 5em;
}

.row-kontakt .column.fluid {
    margin-bottom: 4em;
}

.overflow-hidden {
    overflow: hidden;
}


::-webkit-input-placeholder { /* WebKit browsers */
    color:    #7F7F7F;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #7F7F7F;
    opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #7F7F7F;
    opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #7F7F7F;
}

input[type="number"]::-webkit-input-placeholder {
    color:    #666666;
}
input[type="number"]:-moz-placeholder {
    color:    #666666;
    opacity:  1;
}
input[type="number"]::-moz-placeholder {
    color:    #666666;
    opacity:  1;
}
input[type="number"]:-ms-input-placeholder {
    color:    #585858;
}


input[type="text"],
input[type="search"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="color"],
textarea,
input[type="submit"] {
    background-color: #D9D9D9;
    border: 0.151rem solid #8C2B5E;
    box-sizing: border-box;
    color: #3c3c3c;
    display: block;
    font-family: inherit;
    height: 2.825rem;
    margin: 0 0 0.85rem;
    padding: 0.625rem;
    width: 100%;
    max-width: 100%;
    border-radius: 0.6em;
}
input[type="number"] {
    font-family: "Open Sans Condensed", sans-serif;
    display: inline-block;
    color: #2B2B2B;
}

input[type="submit"] {
    position: relative;
    display: inline-block;
    text-align: center;
    background-color: #D36FA3;
    color: #262626;
    font-size: inherit;
}

input[type="text"]:focus, input[type="tel"]:focus,
textarea:focus, input[type="number"]:focus,
input[type="email"]:focus {
    border-color: #993366;
    outline: 0 none;
}

textarea[rows] {
    height: auto;
}

.justify p,
p.justify {
    text-align: justify !important;
}

.striped {
    background: url("images/striped.svg") repeat;
}

.reference .row.striped {
    border-top: 0.1em solid #efefef;
}

.condensed {
    font-family: "Open Sans Condensed", sans-serif;
    letter-spacing: 0.1em;
}

.row.dark .limit-small {
    max-width: 35em;
}
.icon-links .icon{
    opacity: 0.75;
}
.icon {
    height: 2em;
    padding-left: 2.5em;
    display: inline-block;
    background-repeat: no-repeat;
    margin-right: 3.6em;
    margin-top: 0;
    margin-bottom: 0;
    background-size: contain;
}
.icon:last-child {
    margin-right: 0;
}

label.additional-info svg,
label.additional-info.sub svg{
    height:2em;
}
label.additional-info.sub svg{
    vertical-align: initial;
}
label.additional-info svg{
    vertical-align: middle;
}
.not-so-dark svg .fill-color{
    fill:#468857;
}
svg .fill-color{
    fill:#444;
}

.row-kontakt .icon {
    margin-right: 0.2em;
}
.not-so-dark label{
    font-size: 1.25em;
}
.not-so-dark p{
    font-size: 1.2em;
}

@media handheld, only screen and (max-width: 60em) {
    .icon {
        height: 2em;
        margin-right: 4em;
    }
}

@media handheld, only screen and (max-width: 40em) {
    .icon {
        height: 2em;
        margin-right: 4em;
    }
}

@media handheld, only screen and (max-width: 30em) {
    .icon {
        height: 2em;
        margin-right: 2em;
    }
}

@media handheld, only screen and (max-width: 25em) {
    .icon {
        height: 2em;
        margin-right: 2em;
    }
}

.icon.up {
    /*background-image: url("images/woborder/icon_navigatoben_aktiv.svg");*/
}
.icon.package{
    background-image: url("images/icons/box.svg");
}
.icon.contact {
    background-image: url("images/icons/business.svg");
}


@media handheld, only screen and (min-width: 55em) {
    .show-for-small {
        display: none!important;
    }
    input[type="radio"].additional-info-button{
        display: none;
    }
}

@media handheld, only screen and (max-width: 55.1em) {
    .show-for-small {
        display: block;
    }
    .row-overview.buffer {
        padding-bottom: 0;
    }
    .hidden-for-small {
        display: none!important;
    }

}
@media handheld, only screen and (max-width: 20em) {
    input[type="number"]{
        font-size: 0.8em;
    }
}

svg .fill-color-white{
    fill:#FFFFFF;
}
svg .circle-style {
    fill-rule:evenodd;clip-rule:evenodd;fill:#CC6699;stroke:#993366;stroke-width:3;
}

svg .stroke-color-white{
    stroke:#FFFFFF;
}
svg .stroke-miterlimit{
    stroke-miterlimit:10;
}
svg .even-odd {
    fill-rule:evenodd;clip-rule:evenodd
}
svg .fill-none{
    fill:none;
}
svg .stroke{
    stroke-width:3;
}

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

.date {
    margin-top: 1em;
}