*{box-sizing:border-box;margin:0;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
main{text-align:center}
a{color:#285dab;cursor:pointer;font-weight:500;text-decoration:none}
a:hover{color:#1e4680;text-decoration:underline}
body{background-image:radial-gradient(circle,rgba(22,112,127,.75) 50%,rgba(22,112,127,1));color:#111;font-family:'neo-sans',sans-serif;font-size:16px}
h1, h2, h3, h4, h5, h6{font-weight:700;line-height:1.3;margin:0 0 7.5px}
h1, h2{width:100%}
h1, .h1{font-size:44px}
h2, .h2{font-size:32px}
h3, .h3{font-size:24px}
h4, .h4{font-size:20px}
h5, .h5{font-size:16px}
h6, .h6{font-size:14px}
img{border:0;display:inline-block;height:auto;max-width:100%}
p{line-height:1.54;margin-bottom:15px}
section{position:relative}
.box-center{padding:30px 0;text-align:center;width:100%}
.button{background:#285dab;border:0;border-radius:3px;box-shadow:inset 0 -2px 0 0 #1e4680;color:#fff;cursor:pointer;display:inline-block;font-size:18px;font-weight:700;height:48px;padding:0 30px;text-transform:uppercase;transition:background .1s linear}
.button:hover{background:#1e4680;box-shadow:inset 0 -2px 0 0 #036;color:#fff;text-decoration:none}
.material-icons{color:#006596;vertical-align:middle}
.max-width-1920{max-width:1920px}
.max-width-1300{max-width:1300px}
.max-width-1000{max-width:1000px}
.max-width-767{max-width:767px}
.max-width-667{max-width:667px}
.text-center{text-align:center}
.text-desc{font-size:18px;font-weight:300;margin:0 auto 30px}
.text-shadow{text-shadow:0 0 .5rem #000}
.text-upper{text-transform:uppercase}
.wrapper{margin:0 auto;padding:0 15px;position:relative}

/* Blocks */
.flex{display:flex;flex-flow:row wrap;width:100%}
[class*="flex-"]{margin:15px}
.flex-1{width:100%}
.flex-2{width:calc(50% - 30px)}
.flex-3{width:calc(33.333333% - 30px)}
.flex-4{width:calc(25% - 30px)}
.flex-5{width:calc(20% - 30px)}
.full{background:#fff;display:table;padding:60px 0;width:100%}
.grid-2, .grid-2-3, .grid-3{float:left;padding:0 15px}
.grid-2{width:50%}
.grid-2-3{width:66.666666%}
.grid-3{width:33.333333%}
@media(max-width:1334px){
    .flex-5{width:calc(33.333333% - 30px)}
}
@media(max-width:1024px){
    .flex-4, .flex-5{width:calc(50% - 30px)}
}
@media(max-width:667px){
    .flex-2, .flex-3, .flex-4, .flex-5{margin:15px 0;width:100%}
    .grid-2, .grid-2-3, .grid-3{width:100%}
}
@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){/* IE10+ */
    .flex{display:inline-block}
    [class*="flex-"]{float:left}
}

/* Form */
form{display:inline-block}
form input, form select, form textarea{color:#111;font-family:'neo-sans',sans-serif;font-size:16px}
form input[type="email"], form input[type="number"], form input[type="tel"], form input[type="text"], form .select, form textarea{border:1px solid #ddd;border-radius:3px;height:45px;margin-bottom:15px;position:relative}
form input[type="email"], form input[type="number"], form input[type="tel"], form input[type="text"], form textarea{padding:0 15px}
form button{font-size:16px}

.form{position:relative;width:100%}
.form button{font-size:18px;height:60px;margin-bottom:30px;padding:0 60px;width:100%}
.form fieldset{border:0;margin-bottom:10px}
.form input[type="checkbox"]{float:left;margin:3px 5px 10px 0}
.form input[type="email"], .form input[type="number"], .form input[type="tel"], .form input[type="text"], .form .select, form textarea{float:left;margin:0 5px 5px 0;width:calc(100% - 5px)}
.form input.input-20{width:calc(20% - 5px)}
.form input.input-25{width:calc(25% - 5px)}
.form input.input-33{width:calc(33.333333% - 5px)}
.form input.input-40{width:calc(40% - 5px)}
.form input.input-50{width:calc(50% - 5px)}
.form label{float:left}
.form label.radio{font-weight:500;margin-right:15px}

#form-code button{margin:15px auto 60px}
#form-code h1{color:#fff;font-family:'neo-sans', sans-serif;font-size:34px;font-weight:400;line-height:1}
#form-code input{border:4px solid #285dab;border-radius:8px;box-shadow:0 0 20px rgba(0,0,0,.25);display:block;font-size:32px;height:120px;margin:0 auto;max-width:330px;outline:0;text-align:center}
#form-code label{color:#fff!important;display:block;font-size:18px;font-weight:700;margin-bottom:5px}
#form-code p{color:#fff}
#form-member input.invalid{background:#fff url(//s3.eu-central-1.amazonaws.com/plustwaalf/winnen/layout/ic-invalid.png) no-repeat center right;background-size:24px 24px;border-bottom-color:#ff3b30}
#form-member input.valid{background:#fff url(//s3.eu-central-1.amazonaws.com/plustwaalf/winnen/layout/ic-valid.png) no-repeat center right;background-size:24px 24px;border-bottom-color:#4cd964}
#form-proces{background:rgba(0,0,0,.6) url(//s3.eu-central-1.amazonaws.com/plustwaalf/winnen/layout/proces.svg) no-repeat center;background-size:200px 200px;bottom:0;display:none;left:0;position:fixed;right:0;top:0;z-index:999;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}

/* List */
li{line-height:1.54}
ul{margin-left:18px;text-align:left}
ul.center{margin-left:calc(50% - 4em)!important}
ul.circle{color:#f6921e;list-style-type:circle}
ul.circle span{color:#333}
ul.icon{list-style:none;margin-left:35px}
ul.icon li{margin-bottom:10px}
ul.info{color:#444;font-size:14px}
ul .material-icons{font-size:30px;margin:-5px 0 0 -35px;position:absolute}

/* Pop-up */
#cover{background-color:rgba(0,0,0,.6);bottom:0;display:none;left:0;position:absolute;right:0;top:0;z-index:996}
#overlay{background-color:#111;background-color:rgba(17,17,17,.65);bottom:0;display:none;left:0;overflow-y:auto;position:fixed;right:0;top:0;z-index:999;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}
#popup{display:none;width:100%}
#popup-close{background:rgba(0,0,0,.1) url(//s3.eu-central-1.amazonaws.com/plustwaalf/winnen/layout/ic-close.png) no-repeat;background-size:60px 60px;border-radius:3px;cursor:pointer;height:60px;position:fixed;right:15px;top:15px;width:60px}
#popup-section{background:#fff;margin:30px auto;max-width:1000px}
#popup-section.max-700{max-width:700px}
#popup-section section{padding:15px}
@media(min-width:668px){
    #popup-section section{padding:30px}
}

/* Additional */
footer{display:none}
header{background:#fff;box-shadow:0 2px 2px rgba(0,0,0,.2);height:60px;width:100%}
header img{height:60px}
i.number{background:#006596;border-radius:100%;color:#fff;font-style:normal;font-weight:600;height:45px;line-height:45px;margin-left:-30px;position:absolute;width:45px}
img.border{border:4px solid #006596;border-radius:100%;margin-bottom:15px;max-width:180px}
img.border.small{max-width:120px}
#action-bg{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;bottom:0;position:absolute;top:60px;width:100%;z-index:-1}
#action-box{margin:0 auto;padding:0 15px}
#action-box h1{color:#fff;font-family:'neo-sans', cursive;font-size:34px;font-weight:400;line-height:1}
#action-box label, #action-box p{color:#fff}
#action-img{display:inline-block}
#ajax-bevestigen{background:rgba(22,112,127,.6);border-radius:3px;margin:0 auto;max-width:667px;padding:15px}
#ajax-bevestigen b, #ajax-bevestigen h5, #ajax-bevestigen label, #ajax-bevestigen p, #ajax-bevestigen span{color:#fff}
#ajax-bevestigen b, #ajax-bevestigen p{color:#fff;font-weight:500}
#ajax-bevestigen b{display:inline-block;margin-bottom:30px}
#ajax-bevestigen form{text-align:left}
#ajax-bevestigen h2{color:#f6921e}
#ajax-bevestigen h5{color:#fff}
#ajax-bevestigen i{color:#f6921e;font-style:normal;font-weight:700}
#footerbar{color:#fff;line-height:2;padding:30px 0;width:100%}
#footerbar a{color:#fff!important;margin:0 15px}
#footerbar a img{height:20px}
#footerbar .bottom{font-size:14px}
#footerbar .top{margin-bottom:30px}

@media(min-width:1024px) and (min-height:1024px){
    #action-box h1, #form-code h1{font-size:60px}
    #action-img{bottom:0;left:0;max-width:400px;position:fixed;z-index:-1}
    .box-center{left:0;padding:0;position:absolute;right:0;top:50%;transform:translateY(-50%);-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%)}
    #footerbar{bottom:0;margin:0;position:fixed}
}
@media(min-width:1280px) and (min-height:1024px){
    #ajax-bevestigen{padding:30px}
    #ajax-bevestigen b, #ajax-bevestigen p{font-size:18px}
    #form-code h1{font-size:75px}
}
