@font-face {
    font-family: 'Chalkboard Bold';
    src: url(./fonts/Chalkboard-Bold.eot);
    src: url(./fonts/Chalkboard-Bold.eot?#iefix) format('embedded-opentype'),
    url(./fonts/Chalkboard-Bold.svg#Chalkboard%20Bold) format('svg'),
    url(./fonts/Chalkboard-Bold.woff) format('woff'),
    url(./fonts/Chalkboard-Bold.woff2) format('woff2'),
    url(./fonts/Chalkboard-Bold.otf) format('otf');
}

@font-face {
    font-family: 'Palatino-regular';
    src: url(./fonts/Palatino-regular.eot);
    src: url(./fonts/Palatino-regular.eot?#iefix) format('embedded-opentype'),
    url(./fonts/Palatino-regular.svg#Palatino-regular) format('svg'),
    url(./fonts/Palatino-regular.woff) format('woff'),
    url(./fonts/Palatino-regular.woff2) format('woff2'),
    url(./fonts/Palatino-regular.otf) format('otf');
}


*, html {margin: 0; padding: 0;}
.clearingItem {clear: both; float: none;}
body {font-size: 18px;}

h1 {color: #FBB800; font-size: 58px;  font-family: 'Chalkboard Bold'; padding-bottom: 10px;}
p {margin: 20px 0; line-height: 28px;}




/* BODY CONTAINER */
#header {height:  900px; width: 100%; background-color: #0086cd; position: relative;  z-index: -1; background-image: url(./images/Bg_new.png);}
#authorbox {height:  600px; width: 100%; background: rgb(255,255,255); background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(251,184,0,1) 100%); z-index: 5;}
#leseprobe {min-height: 500px; width: 100%;}
#footer {height: 465px; width: 100%; background-color: #0086cd; position: relative;  background-image: url(./images/Bg_new.png);}
#content {height: auto; padding: 100px 0; background-color: #FFF9EB; min-height: 300px;}
.contentwidth {width: 100%; max-width: 1480px; box-sizing: border-box; padding: 0 50px; position: relative; margin: 0 auto;}



/* HEADER  */
#headerimage {height: 100%; width: 580px; background-image: url(./images/dauersauer.png); background-repeat: no-repeat; background-size: contain; position: relative; bottom: 0; background-position: bottom; float: left; }
#headerimage.presse {height: 100%; width: 380px; background-image: url(./images/dauersauer.png); background-repeat: no-repeat; background-size: contain; position: relative; bottom: 0; background-position: bottom; float: left; }
#headertext {max-width: 660px; color: #fff; height: auto; position: relative; float: right; margin-top: 210px;}
#headertext.presse {max-width: 460px;color: #fff;height: auto;position: relative;float: left;margin-top: 150px;margin-left: 250px;}
.smilie {margin-right:25px; margin-bottom: 15px;}
.listitem table td {color: #fff;}
#header.small { padding: 100px 0px; height: auto;}


/* AUTHORBOX */
#authorinfo {position: relative;}
#authorinfo h1 {color: #0086CD; }
#authorinfo {position: relative; padding-top: 130px; width: 100%; max-width: 515px; float: left;}
#zitat {float: right; font-size: 28px; width: 100%; max-width: 650px; margin-top: 232px; line-height: 42px;}
#innerzitat {position: relative;}
.firsttitat {position: absolute; margin-left: -35px; margin-top: -35pX;}
.lastzitat {position: absolute; margin-right: -45px; margin-top: 25px;}



/* LESEPROBE */
#leseprobe {display: grid; grid-template-columns: 40% 60%;}
#logoscontent {float: left; width: 100%; background: #fff; min-height: 650px;  position: relative;}
#leseprobecontent {float: right; width: 100%; background: #FFF9EB;  min-height: 300px; padding-right: 50px; box-sizing: border-box;}
.singlelogo {max-width: 200px; height: auto; width: 100%; margin-bottom: 50px; transition: all 500ms;}
.singlelogo.opened {margin-bottom: 240px;}
.singlelogo.last{margin-bottom: 70px!important;}
.singlelogo.last.opened {margin-bottom: 0px!important;}
#logosinner {width: 200px; margin: 0 auto; padding-top: 140px; padding-bottom: 70px;}
#leseprobeinner {padding-left: 20%; padding-top: 120px; max-width: 650px; width: 100%; padding-bottom: 120pX;}
#readmore {background: #0086CD; color: #fff; font-family: 'Chalkboard Bold'; height: 50px; width: auto; padding: 0 25px; line-height: 50px; text-align: center; font-size: 26px; border-radius: 100px; border: solid 1px #0086cd; transition: all 250ms; margin-top: 50px; margin-bottom: 80px; display: inline-block;}
#readmore:hover {background: #fff; color: #0086CD; }
#imagecontianer {width: 100%; height: 100%; position: absolute; background-repeat: no-repeat; background-size: 450px; bottom: 30px; right: 30px; background-position: 100% 100%;}
#logo-wrapper {background: #fff; padding: 10px 40px; border-radius: 40px;  margin-right: 100px;}
#footerlogo {width: 220pX;}

/* FOOTER */
#leftfooter {padding-top: 70pX;}
#leftfooter table td {color: #fff; width: 300px; font-size: 18px;}
#leftfooter table td a {color: #fff; font-size: 18px; text-decoration: none;}
#leftfooter a {text-decoration: none;}
#navigationlinks {position: absolute; bottom: 70px; left: 50px;}
#navigationlinks a {color: #FBB800; font-size: 20px;  font-family: 'Chalkboard Bold'; padding-right: 100px; text-decoration: none;}
#footer .contentwidth {height: 100%;}
#dauersauer-footer {background-image: url(./images/dauersuaer-footer.png); position: absolute; right: 0; bottom: 0; background-size: contain; width: 380px; height: 380px; background-repeat: no-repeat; background-position: bottom;}

.profileimage {width: 300px; height: auto;}
.datatable td:nth-child(2) {padding-left: 20px;}

#footer h1 {font-size: 45px; padding-bottom: 55px;}

/*#leseprobeinner a {background: #0086CD; color: #fff; font-family: 'Chalkboard Bold'; height: 50px; width: 260px;  text-align: center; font-size: 26px; border-radius: 100px; border: solid 1px #0086cd; transition: all 250ms; margin-top: 50px; margin-bottom: 80px; text-decoration: none; font-size: 20px; padding: 0 20px;}*/
.dlbutton {background: #0086CD; color: #fff; font-family: 'Chalkboard Bold';  width: max-content;  text-align: center; font-size: 26px; border-radius: 100px; border: solid 1px #0086cd; transition: all 250ms;  margin-bottom: 20px; text-decoration: none; font-size: 20px; padding: 10px 20px;}
.dlbutton a {color: #fff; text-decoration: none;}

h2 {
    color: #0086CD;
    font-size: 35px;
    font-family: 'Chalkboard Bold';
    padding-bottom: 10px;
}

@media only screen and (max-width: 1415px) {

    #header {height: 750px;}
    #headerimage {width: 450px;}
    #headerimage.presse {width: 450px;}
    #leseprobeinner { padding-left: 13%; max-width: 590px;}
    #headertext {margin-top: 80px;}
    #headertext.presse {margin-top: 80px;}


}


@media only screen and (max-width: 1340px) {

    #authorinfo {max-width: 100%;float: unset; padding-top: 70px;}
    #zitat {float: unset;max-width: 100%;margin-top: 70px;}
    #authorbox {height: auto; min-height: 500px; padding-bottom: 70px;}

}


@media only screen and (max-width: 1250px) {

    #headerimage {width: 350px;position: absolute; right: 0; opacity: 0.5; bottom: unset; height: 450px; margin-top: 25%;}
    #headerimage.presse {width: 350px;position: absolute; right: 0; opacity: 0.5; bottom: unset; height: 450px; margin-top: 25%;}
    #leseprobeinner {padding-left: 13%;max-width: 490px;}
    #headertext {max-width: 100%;color: #fff;height: auto;position: relative;}
    #headertext.presse {max-width: 100%;color: #fff;height: auto;position: relative;}
    #header {height: auto; padding-bottom: 50px;}
    #headertext {margin-top: 50px;}
    #headertext.presse {margin-top: 50px;}


}


@media only screen and (max-width: 1150px) {


    #dauersauer-footer {width: 250px; height: 270px;}
    #navigationlinks a {padding-right: 70px;}


}




@media only screen and (max-width: 1035px) {

    #leseprobe {display: grid; grid-template-columns: 100%;}
    #logosinner { display: grid; grid-template-columns: 50% 50%; width: 100%; padding: 0 50px; padding-top: 70pX; text-align: center; box-sizing: border-box; }
    #dauersauer-footer {width: 350px; height: 370px; }
    #leseprobeinner {max-width: 100%;padding: 50px; box-sizing: border-box;}
    #leseprobecontent {padding-right: 0;}

    #imagecontianer {
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-size: contain;
        bottom: 00px;
        right: 00px;
        background-position: 50% 100%;
        margin: 0 auto;
    }

    #dauersauer-footer {width: 250px; height: 270px; }
    #headertext.presse {margin-left: 0;}
    #headerimage.presse {background-image: unset;}

    #readmore {height: auto; border-radius: 20px;}

}



@media only screen and (max-width: 950px) {


    #dauersauer-footer {width: 200px; height: 200px; }
    #navigationlinks a {padding-right: 30px;}
    .datatable td:nth-child(2) {padding-left: 0px; padding-top: 20px;}
    .dlbutton {background: #0086CD; color: #fff; font-family: 'Chalkboard Bold';  width: 90%;  text-align: center; font-size: 26px; border-radius: 100px; border: solid 1px #0086cd; transition: all 250ms;  margin-bottom: 20px; text-decoration: none; font-size: 20px; padding: 10px 20px;}


}



@media only screen and (max-width: 880px) {

    #headerimage {margin-top: 35%;}
    #headerimag.presse {margin-top: 35%;}

    #leftfooter {padding-top: 50pX;}
    #footer {height: 430px;}

    #leftfooter table td {width: 210px;}

    #leftfooter h1 {font-size: 35px;}
    #logo-wrapper { margin-right: 50px;}

    #navigationlinks {width: 100px;}

    .datatable td {width: 100%; display: block;}

}


@media only screen and (max-width: 680px) {

    #headerimage {margin-top: 55%;}
    #headerimage.presse {margin-top: 55%;}
    #footer table td {display: block; width: 100%;}
    #footer {height: 480px;}

    #dauersauer-footer {width: 150px; height: 150px;}
    #leftfooter h1 {padding-bottom: 25px;}

}



@media only screen and (max-width: 580px) {

    .profileimage {width: 100%; height: auto;}

    .singlelogo {max-width: 85%;}
    h1 {font-size: 35px;}
    #headerimage {margin-top: 90%;}
    #headerimage.presse {margin-top: 90%;}
    #navigationlinks {bottom: 30px;}
    #footer table td {display: block; width: 100%;}
    #footer table td p {margin: 12px 0;}

}