body {background: #fbfbfb;font-family: 'Open Sans', sans-serif;margin: 0;}
a {color: #fff;}
a:hover {text-decoration: none;color:#3b3b3b;}

* {-webkit-box-sizing: border-box; -moz-box-sizing: border-box;box-sizing: border-box;}

.Absolute-Center {margin: auto;position: absolute;top: 0; left: 0; bottom: 0; right: 0;}
.Absolute-Center.is-Responsive {width: 850px;height: 520px;padding: 40px;}

.main, .left, .main #einloesen{outline:0;-webkit-box-shadow: 3px 11px 38px -1px rgba(0,0,0,0.40);-moz-box-shadow: 3px 11px 38px -1px rgba(0,0,0,0.49);box-shadow: 3px 11px 38px -1px rgba(0,0,0,0.49);}
.main, .left{position: relative;min-height: 1px;padding-right: 20px;padding-left: 20px;float: left;}

.grow {transition: all .2s ease-in-out;}
.grow:hover {transform: scale(1.03);}

.hide{display: none !important;}

.spinner {width: 40px; height: 40px; background-color: #e46c15;margin: 100px auto;-webkit-animation: sk-rotateplane 1.2s infinite ease-in-out; animation: sk-rotateplane 1.2s infinite ease-in-out;  }

.main {height: 434px;width:60%;z-index:1000;background-color: #fff;  background: url(/img/hintergrund-landwirt.jpg) no-repeat center left; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover;background-size: cover;color:#00a151;padding: 0 40px;}
.main h1{line-height: 1.2;font-size: 27px;font-weight: 300;margin-top: 40px;}
.main div.form, .main div.addfingerprint{display: block;text-align: center;margin-top: 100px;margin-bottom: 150px;position: relative;}
.main div.addfingerprint{margin-top: 45px;}
.main div.addfingerprint h2{font-size: 17px;margin-bottom: 20px;color: #e46c15;}

.main div.form input[type=text]{border-width: 0 0 3px 0;border-color: #00a151;width: 330px;margin-bottom: 20px;background: none;padding: 0 5px;color: #7d7d7d;font-size: 20px;font-weight: 600;}
.main div.form .checkbox {margin-bottom: 20px; font-size: 14px; padding: 0 20px; text-align: left;}
.main div.form .checkbox a { color: #00a151; }
.main div.form .checkbox.error, .main div.form .checkbox.error a { color: #e46c15; }

.main div.form input[type=text].error{border-color: #e46c15;}
.main button, .main a#epaper{font-size: 14px;background: #00a151;color: #fff;border: none;padding: 10px 40px;border-radius: 40px;}
.main button:focus, .main a#epaper:focus{outline: 0;}
.main button:hover, .main a#epaper:hover{cursor: pointer;cursor: pointer;}
.main a#epaper{text-decoration: none;}
.main div.addfingerprint div.count{margin-top: 20px;}
.main div.form div.fehler{display: none;}
.main div.form div.fehler.display{display: block !important;position: absolute;left:0;right:0;top:-45px;}
.main div.form div.fehler.display span{font-size: 12px;padding: 5px 10px;color:#fff;background: #e4752d;background: -moz-linear-gradient(top, #e4752d 23%, #d36d22 100%);background: -webkit-linear-gradient(top, #e4752d 23%,#d36d22 100%);background: linear-gradient(to bottom, #e4752d 23%,#d36d22 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4752d', endColorstr='#d36d22',GradientType=0 );}
.main div.showepaper{text-align: center;margin-top: 100px;}
.main .bottom{position: absolute;bottom: 0;left: 0;right: 0;max-width: 100%;padding: 15px 0px;text-align: center;}
.main .bottom img{width: 200px;max-width: 100%;}

.left {height:408px;width:40%;background: #009b4d;color:#fff;padding: 0 30px;margin: 15px 0;}
.left h2{font-size: 14px; font-weight: 300;margin-bottom: 20px;font-weight: 600;margin-top: 20px;}
.left p{margin-bottom: 30px;font-size: 12px;}
.left .grafik{margin-bottom:25px; text-align: center;height: 155px;background: url(/img/erklaerung.svg)  no-repeat center 20px; -webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover;background-size: cover;}
.left .grafik span{background: #fff;color: #3b3b3b;padding: 3px 25px;font-weight: 600;border-radius: 30px;font-size: 15px;}
.left footer{text-align: center;font-size:12px;margin-bottom:15px;}
.left footer a:hover{color: white;}

.impressum{margin: 30px 20px;width: 760px;left: calc(50% - 400px);position: absolute;}
.impressum a{color: #00a151;}
.impressum .btn{margin-top: 25px;background: #00a151;padding: 5px 10px;color: #fff;text-decoration: none;border-radius: 20px;float: right;}
@media (min-width: 900px) {
    .left .grafik{margin-bottom:15px;}
}

@media (max-width: 900px) {
    .impressum{left: 0; width: calc(100% - 40px);}
    .Absolute-Center {position: relative;margin: 0;}
    .Absolute-Center.is-Responsive {width: auto;height: auto;padding: 0;}
    .main {height: 500px;}
    .main div.form input[type=text] {width: 100%;}
    .main div.form .checkbox {padding: 0;}
    .main, .left{width:100%;margin:0;}
    .left h2{margin-top: 30px;}
    .left .grafik{display: inline-block;width: 250px;}
    .left .grafikcontainer{text-align: center;}
}

@-webkit-keyframes sk-rotateplane {
    0% { -webkit-transform: perspective(120px) }
    50% { -webkit-transform: perspective(120px) rotateY(180deg) }
    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes sk-rotateplane {
    0% {
        transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
    } 50% {
          transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
          -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
      } 100% {
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        }
}