@charset "UTF-8";

* {
    box-sizing: border-box;
}
html {
    overflow-x: hidden;
    overflow-y: scroll;
}
body {
    padding: 0px;
    margin: 0px;
    font-family: Electrolize, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: #000;
}
.headline p {
	margin: 0px;
}
.CMS_LINK_EDIT img,
.CMS_LINK_SAVE img {
    float: none !important;
    padding: 0px !important;
    border: 0px none !important;
}
a {
    color: inherit;
}
a img {
    border: 0px none;
}
.clear {
    clear: both;
}
.info,
.error {
    margin: 10px;
    padding: 8px;
    overflow: hidden;
    font-weight: bold;
    text-align: center;
}
.info {
    color: #0C0;
    background-color: rgba(0, 196, 0, 0.25);
    border: 1px solid #0C0;
}
.error {
    color: #F00;
    background-color: rgba(255, 0, 0, 0.25);
    border: 1px solid #F00;
}
.hiddens {
    display: none;
}

.centerAll {
    margin: auto;
    width: 100vw;
    max-width: 1000px;
}

/**** Header ****/
#Header {
    width: 100vw;
    height: calc(100vw * 9 / 21);
    background-image: url('../images/bg-top.png');
    background-size: cover;
}
#Header #Spruch {
    position: relative;
    margin: auto;
    top: calc(100vw * 80 / 1920);
    width: calc(100vw * 828 / 1920);
    height: calc(100vw * 170 / 1920);
    color: transparent;
    background-image: url('../images/Spruch.png');
    background-size: cover;
}
#Header #Datum {
    position: relative;
    margin: auto;
    top: calc((100vw * 22 / 1920) + 8px);
    width: calc(100vw * 828 / 1920);
    font-size: calc((100vw * 34 / 1920) + 20px);
    text-align: right;
    color: #F00;
}
#Header #Uhrzeit {
    position: relative;
    margin: auto;
    top: calc((100vw * 23 / 1920) + 8px);
    width: calc(100vw * 828 / 1920);
    font-size: calc((100vw * 26 / 1920) + 10px);
    text-align: right;
    color: #F00;
}
#Header #Buttons {
    position: relative;
    top: calc((100vw * 167 / 1920) - 20px);
}
#Header #Buttons2 {
    position: fixed;
    z-index: 2;
    top: 0px;
    width: 100vw;
}
#Header #Buttons ul,
#Header #Buttons2 ul {
    margin: 0px;
    padding: 0px;
    text-align: center;
    list-style-type: none;
}
#Header #Buttons .buttons,
#Header #Buttons2 .buttons {
    display: inline-block;
}
#Header #Buttons .buttons a,
#Header #Buttons2 .buttons a {
    display: inline-block;
    margin: calc((100vw * 14 / 1920) + 3px);
    width: calc((100vw * 95 / 1920) + 35px);
    height: calc((100vw * 95 / 1920) + 35px);
    vertical-align: text-top;
    color: transparent;
    background-color: rgba(230, 230, 230, 1);
    background-size: cover;
    border: calc((100vw * 2 / 1920) + 1px) solid rgb(255, 0, 0);
    border-radius: calc((100vw * 9 / 1920) + 8px);
    box-shadow: calc((100vw * 2 / 1920) + 2px) calc((100vw * 2 / 1920) + 2px) calc((100vw * 4 / 1920) + 4px) #000;
}
#Header #Buttons .buttons a:hover,
#Header #Buttons2 .buttons a:hover {
    background-color: rgba(255, 255, 255, 1);
}
#Header #Buttons .buttons a:active,
#Header #Buttons2 .buttons a:active {
    background-color: rgba(215, 215, 215, 1);
    border-color: rgb(200, 0, 0);
    box-shadow: calc((100vw * 1 / 1920) + 1px) calc((100vw * 1 / 1920) + 1px) calc((100vw * 2 / 1920) + 2px) #000;
}
#Header #Buttons #Button1 a,
#Header #Buttons2 #Button1 a {
    background-image: url('../images/Anmeldung.png');
}
#Header #Buttons #Button2 a,
#Header #Buttons2 #Button2 a {
    background-image: url('../images/Mitbringsel.png');
}
#Header #Buttons #Button3 a,
#Header #Buttons2 #Button3 a {
    background-image: url('../images/Helfer.png');
}
#Header #Buttons #Button4 a,
#Header #Buttons2 #Button4 a {
    background-image: url('../images/AnreiseUnterkunft.png');
}
#Header #Buttons #Button5 a,
#Header #Buttons2 #Button5 a {
    background-image: url('../images/Bildergalerie.png');
}

/**** ContentArea ****/
#ContentArea {
    
}
#ContentArea h3 {
    margin: calc((100vw * 14 / 1920) + 3px + ((100vw * 90 / 1920) + 40px) + ((100vw * 14 / 1920) + 3px)) 10px calc((100vw * 14 / 1920) + 3px) 10px;
    font-size: calc((100vw * 12 / 1920) + 16px);
}
#ContentArea h4 {
    margin: calc((100vw * 14 / 1920) + 3px) 10px calc((100vw * 14 / 1920) + 3px) 10px;
    font-size: calc((100vw * 6 / 1920) + 14px);
    text-align: justify;
}
#ContentArea p,
#ContentArea div.text {
    margin: 10px 0px;
    padding: 0px 10px;
    text-align: justify;
}
#ContentArea label {
    display: inline-block;
    width: 290px;
    max-width: calc(100vw - 24px);
    vertical-align: top;
}
#ContentArea div.text ul {
    display: inline-block;
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}
#ContentArea form fieldset {
    margin: 0px 2px 4px 2px;
    padding: 4px 8px 8px 8px;
    border: 1px solid #AAA;
}
#ContentArea form fieldset .inputs {
    max-width: calc(100vw - 20px);
}
#ContentArea form fieldset .inputs input[type=text],
#ContentArea form fieldset .inputs textarea,
#ContentArea form fieldset .inputs .grpradio,
#ContentArea form fieldset .inputs .grpcheckbox,
#ContentArea form fieldset .inputs input[type=file] {
    margin: 0px 0px 4px 0px;
    padding: 0px 1px;
    width: 396px;
    max-width: calc(100vw - 24px);
    height: 22px;
    font-family: inherit;
    font-size: 14px;
    color: #333;
    border: 1px solid #AAA;
}
#ContentArea form fieldset .inputs .grpradio,
#ContentArea form fieldset .inputs .grpcheckbox {
    height: auto;
    min-height: 22px;
    color: inherit;
}
#ContentArea form fieldset .inputs .fileUpload {
    display: inline-flex;
    position: relative;
    margin: 0px 0px 4px 0px;
    padding: 0px;
    width: 396px;
    max-width: calc(100vw - 24px);
    height: 22px;
    vertical-align: top;
}
#ContentArea form fieldset .inputs .fileUpload label.uploadText {
    position: absolute;
    z-index: 1;
    margin: 0px;
    padding: 0px 1px;
    top: 0px;
    left: 0px;
    width: inherit;
    max-width: inherit;
    height: inherit;
    overflow: hidden;
    font-size: 14px;
    line-height: 20px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #333;
    background-color: #FFF;
    border: 1px solid #AAA;
    cursor: pointer;
}
#ContentArea form fieldset .inputs .fileUpload input.upload {
    margin: 0px;
    padding: 0px;
    width: inherit;
    height: inherit;
    overflow: hidden;
}
#ContentArea form fieldset .inputs textarea {
    height: 68px;
}
#ContentArea form .buttons {
    margin: 10px;
    text-align: center;
}
#ContentArea form .buttons input {
    padding: 3px 10px 4px 10px;
    font-family: inherit;
    font-size: inherit;
    background-color: rgba(230, 230, 230, 1);
    border: calc((100vw * 2 / 1920) + 1px) solid rgb(255, 0, 0);
    border-radius: calc((100vw * 9 / 1920) + 8px);
    box-shadow: calc((100vw * 2 / 1920) + 2px) calc((100vw * 2 / 1920) + 2px) calc((100vw * 4 / 1920) + 4px) #000;
    cursor: pointer;
}
#ContentArea form .buttons input:hover {
    background-color: rgba(255, 255, 255, 1);
}
#ContentArea form .buttons input:active {
    background-color: rgba(215, 215, 215, 1);
    border-color: rgb(200, 0, 0);
    box-shadow: calc((100vw * 1 / 1920) + 1px) calc((100vw * 1 / 1920) + 1px) calc((100vw * 2 / 1920) + 2px) #000;
}
#ContentArea #Anmeldung,
#ContentArea #Mitbringsel,
#ContentArea #Helfer,
#ContentArea #AnreiseUnterkunft,
#ContentArea #Bildergalerie {
    padding: .1px 0px;
    min-height: calc(100vh + 1px);
}
#ContentArea #Anmeldung {
    color: #FFF;
    background-color: #333;
}
#ContentArea #Mitbringsel {
    color: #333;
    background-color: #FFF;
}
#ContentArea #Helfer {
    color: #FFF;
    background-color: #333;
}
#ContentArea #AnreiseUnterkunft {
    color: #333;
    background-color: #FFF;
}
#ContentArea #AnreiseUnterkunft .content {
    
}
#ContentArea #AnreiseUnterkunft .content #GoogleMapsMultiple {
    
}
#ContentArea #AnreiseUnterkunft .content #GoogleMapsMultiple #MapCanvas {
    border: 2px solid #999;
}
#ContentArea #AnreiseUnterkunft .content #GoogleMapsMultiple #RouteCanvas {
    
}
#ContentArea #AnreiseUnterkunft .content #GoogleMapsMultiple #LegendCanvas {
    padding: 2px 10px 3px 10px;
}
#ContentArea #Bildergalerie {
    color: #FFF;
    background-color: #333;
}
#ContentArea #Bildergalerie .content {
    text-align: center;
}
#ContentArea #Bildergalerie .content .SimpleGallery {
    display: inline-block;
    margin: 0px 10px 10px 10px;
}

/**** Footer ****/
#Footer {
    color: #333;
    background-color: #FFF;
    border-top: 1px solid #333;
}
#Footer p {
    margin: 30px 10px;
    text-align: center;
}