/* Generelle responsive Styles, OK, 13.12.19 ----------------------------------------------------- */
@font-face {font-family: "Open sans"; font-style: normal; font-weight: normal; src: url(https://cdn-images.dpv.de/images/fonts/Open_sans/open-sans-v27-latin-regular.woff) format("woff");}
@font-face {font-family: "Open sans"; font-style: normal; font-weight: bold; src: url(https://cdn-images.dpv.de/images/fonts/Open_sans/open-sans-v34-latin-700.woff) format("woff");}
@font-face {font-family: "Open sans"; font-style: normal; font-weight: 700; src: url(https://cdn-images.dpv.de/images/fonts/Open_sans/open-sans-v34-latin-700.woff) format("woff");}
@font-face {font-family: "Open sans"; font-style: normal; font-weight: 800; src: url(https://cdn-images.dpv.de/images/fonts/Open_sans/open-sans-v34-latin-800.woff) format("woff");}  


body {max-width: 1280px; font-family: "Open sans", sans-serif; color: #202020!important; font-size: 15px; line-height: 21px; background-color: #f3f3f3;}

.mobile { display: none!important;}
.landscape { display: none!important; }
h1 {font-family: "Open sans", sans-serif; margin-bottom: 20px; font-size: 28px; color: #202020; line-height: 1.1em; font-weight: bold; margin-top: 0;}
h2 {font-family: "Open sans", sans-serif; margin-bottom: 20px; font-size: 22px; color: #202020; line-height: 1.1em; font-weight: bold; margin-top: 0;}
h3 {font-family: "Open sans", sans-serif; margin-bottom: 20px; font-size: 18px; color: #202020; line-height: 1.1em; font-weight: bold; margin-top: 0;}
p {margin-top: 0; margin-bottom: 10px;}
ul {list-style: disc; padding-left: 18px;}
ul li {margin-bottom: 10px; }
.small {font-size: 12px;}
.big {font-size: 1.3em;}


a[href]:not(.buttonstyles):hover {text-decoration: underline;}
a {font-size: auto;}

.padding {padding: 2%;}
.teaser {padding: 2%; box-sizing: border-box; background: #eee; border: 1px solid #aaa; position: relative; z-index: 10; margin-bottom: 0%; margin-right: 2%}
.last {margin-right: 0}

.teaser:hover {box-shadow: 0 .2rem .6rem 0 rgba(0,0,0,.2);}

.block-100 { width: 100%; float: left;box-sizing: border-box;}
.block-80 { width: 79.6%; float: left;box-sizing: border-box;}
.block-75 { width: 74.5%; float: left;box-sizing: border-box;}
.block-66 { width: 66%; float: left;box-sizing: border-box;}
.block-60 { width: 59.2%; float: left;box-sizing: border-box;}
.block-50 { width: 49%; float: left;box-sizing: border-box;}
.block-40 { width: 38.8%; float: left;box-sizing: border-box;}
.block-33 { width: 32%; float: left;box-sizing: border-box;}
.block-25 { width: 23.5%; float: left;box-sizing: border-box;}
.block-16 { width: 15%; float: left;box-sizing: border-box;}

.teaser.block-50:nth-child(2n) {margin-right: 0}
.teaser.block-33:nth-child(3n) {margin-right: 0}
.teaser.block-25:nth-child(4n) {margin-right: 0}

.footer {background-color: #f3f3f3; font-size: 13px; line-height: 18px; text-align: center; padding-top: 36px; padding-bottom: 50px; padding-left: 20px; padding-right: 20px; clear: both;}
.footer a[href]:not(.buttonstyles) {color: #202020;}
.footer a[href]:not(.buttonstyles):hover {text-decoration: underline;}

.bold {font-weight: bold;}
.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}

a[href]:not(.buttonstyles) {color: red;}
a[href]:not(.buttonstyles).btn {display: block; text-align: center; width: 300px; color: white; background: red; border: 2px solid red; padding: 12px;margin-bottom: 12px; z-index: 100; position: relative; border-radius: .3rem;}
a[href]:not(.buttonstyles).btn.secondary {color: red; background: white; border: 2px solid red;}
a[href]:not(.buttonstyles).btn:hover {color: red; background: white; border: 2px solid red; transition: all 0.5s ease-out; text-decoration: none;}
a[href]:not(.buttonstyles).btn.secondary:hover {color: white; background: red; transition: all 0.5s ease-out;}
.teaser a[href]:not(.buttonstyles).btn {width: auto;}

.linkarea {position: absolute; font-size:0; top:0; left:0; width:100%; height: 100%; z-index: 20; cursor: pointer;}

img {max-width: 100%;}

.stoerer {position: absolute; background: red; display: block; border-radius: 50%; width: 120px; height: 120px; padding-top: 20px; box-sizing: border-box; line-height: 1.3em;}

.footer {padding-bottom: 120px;}
.cookie {position: fixed;bottom: 0;background: white;border-top: 1px solid #ccc;left: 0;width: 100%;z-index: 100000;text-align: left !important;padding-bottom: 20px;padding: 2%;}
.cookie p {width: 90%;float: left;padding: 0;}
.icon-close {width: 24px; float: right; margin-right: 55px;margin-top: 8px;}
.cookie .close {cursor:pointer;}

/* COUNTDOWN STYLES */
.fade {opacity: 0.2;}
.fade .linkarea {display: none;}
.fade a[href]:not(.buttonstyles).btn {display: none;} 
.drei img {max-width: 90%; margin-bottom: 20px;}
.zwei img {max-width: 85%; margin-bottom: 20px; margin-top: 6%;}
.eins img {max-width: 80%; margin-bottom: 20px; margin-top: 12%;}

.leseprobe {background-image: url(https://image.news.communication.dpv.de/lib/fe3b117175640474771473/m/1/13d846b3-a323-4035-991b-83d98b4cd867.png);
 background-color: ;
width: 116px;
height: 30px;
position: absolute;
z-index: 20;
background-size: 18px;
background-repeat: no-repeat;
background-position: 5px 3px;
margin-top: 156px; text-align:left;margin-left: 49%;}

.leseprobe .linkarea {font-size: 1em;color: white!important;padding-left: 32px;margin-top: 4px;}
.leseprobe .linkarea:hover {text-decoration: none!important;}

/* Angaben für Tablet widescreen */
@media only screen and (max-width: 1280px) {
.layout-canvas-g > .section {margin: 0;}
}

/* Angaben für Tablet */
@media only screen and (max-width: 960px) {
.stoerer {width: 100px; height: 100px; font-size: 0.8em; padding-top: 16px;}
.cookie p {width: 85%;}
.leseprobe {margin-left: 53%;}
}



/* Angaben für mobile */
@media only screen and (max-width: 580px) {
  .desktop { display: none!important; }
  .mobile { display: inline!important; width: 100%;}
  h1 {line-height: 1.2em;}
  h2 {line-height: 1.2em;}
  p { font-size: 16px; line-height: 21px; margin-bottom: 4%;}
  ul li {margin-left: 0px;}
  ul {font-size: 16px; line-height: 21px; text-align: left;}
  .padding {padding: 3%; padding-top: 6%;}
  a[href]:not(.buttonstyles).btn {padding-top: 14px; padding-bottom: 14px; width: auto;  margin-top: 4%; }

.stoerer {width: 120px; height: 120px; font-size: 1em;}
  
  .teaser {padding: 4%; padding-top: 8%; text-align: center; margin-bottom: 4%}
  .block-25, .block-33, .block-40, .block-50, .block-60, .block-66, .block-75, .block-80 {width: 100%!important; float: none;}
  .layout-canvas-g > .section {margin: 0; text-align: center;}

.sticky {position: fixed;bottom: 0;width: 100%;background: white;box-sizing: border-box;z-index: 10000;}
.cookie p {width: 70%;padding: 10px;}
.icon-close {width: 18px;margin-right: 47px;margin-top: 96px;}

   /* COUNTDOWN STYLES */
  .fade {display: none;}
  
  .leseprobe .linkarea {margin-top: 6px;}
.leseprobe {margin-left: 49.5%;}
}
/* eo Generelle responsive Styles, OK, 13.12.2019 -------------------------------------------------- */