body { background-color: #ffffff; margin-top: 0px }
.body-max-width { max-width:850px; margin:0 auto; }

/* Papierblatt- Hintergrundeffekt */
@media only screen and (max-width: 1000px) {
.body { background-color: #ffffff; margin-top: 0px; margin-bottom: 0px }

.body-max-width-shadow { max-width:950px; margin:0 auto;
  background-color: #ffffff }
}
  
@media only screen and (min-width: 1000px) {
.body { background-color: #d7d7d7; margin-top: 25px; margin-bottom: 25px }

.body-max-width-shadow { max-width:950px; margin:0 auto;
  background-color: #ffffff;
  box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.2), 0 0px 28px 0 rgba(0, 0, 0, 0.19); }
}


/* Smartphone, Tablet oder PC? */
@media only screen and (max-width: 601px) {
  .only_mobile { display: initial }
  .only_not_mobile { display: none }
  
  .only_not_desktop { display: initial }  
  .only_desktop { display: none }  

  .body-margin { margin-left:2%; margin-right:2% }

.text { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: normal;
  color: #000033;
  line-height: 23px; }

.bold { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #000066;
  line-height: 23px; }

a { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: normal;
  line-height: 23px;
  color: blue; }
}

@media only screen and (min-width: 601px) {
  .only_mobile { display: none }
  .only_not_mobile { display: initial }
  
  .only_not_desktop { display: initial }  
  .only_desktop { display: none }  

  .body-margin { margin-left:4%; margin-right:4% }

.text { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: normal;
  color: #000033;
  line-height: 23px; }

.bold { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #000066;
  line-height: 23px; }

a { font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-weight: normal;
  line-height: 23px;
  color: blue; }
}

@media only screen and (min-width: 801px) {
  .only_mobile { display: none }
  .only_not_mobile { display: initial }
  
  .only_not_desktop { display: none }  
  .only_desktop { display: initial }

  .body-margin { margin-left:7%; margin-right:7% }

.text { font-family: Calibri,Arial,Tahoma,Verdana,sans-serif;
  font-size: 18px;
  font-weight: normal;
  color: #000033;
  line-height: 23px; }

.bold { font-family: Calibri,Arial,Tahoma,Verdana,sans-serif;
  font-size: 18px;
  font-weight: bold;
  color: #000066;
  line-height: 23px; }

a { font-family: Calibri,Arial,Tahoma,Verdana,sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 23px;
  color: blue; }
  
.chapter { white-space: nowrap; } /* <nobr> bei allen Überschriften, sonst unnötiger Umbruch bei Google Chrome 110%, ist aber schlecht für Smartphones, später mit Media lösen */

}


a:visited { text-decoration: underline;  color: green; }
a:hover { text-decoration: underline;  color: red; }

/* Navigation */
nav {
 margin: auto;
 width: 100%;
 max-width: 715px;
 margin-bottom: 36px;
}
ul#navigation {
 margin: 0;
 padding: 0;
 list-style-type: None;
 height: 32px;
}
ul#navigation li {
 float: Left;
 width: 143px;
 position: Relative;
}
ul#navigation li a { font-family: Calibri,Arial,Helvetica,sans-serif;
 font-weight: bold;
 font-size: 18px;
 display: Block;
 width: 139px;
 line-height: 35px;
 text-align: Center;
 color: white;              /* #000095; */
 text-decoration: None;
 background: linear-gradient(#007dc1, #0061a7); 
 /* background-color: #00428E; */     /* #D1E3F0; */
 border: 4px Solid #FFFFFF;
 border-radius: 0px;
 border-bottom: 0;
}
/* ul#navigation li a:hover { text-decoration: underline;  color: white;  background: linear-gradient(#0061a7, navy); } */
ul#navigation li a:hover { text-decoration: underline;  color: white;  background: linear-gradient(#FCBC0E, #F89324); }
ul#navigation li a:active { color: #000000; cursor: Pointer; }



/* hr { border-top: 1px solid #ff0000;  height: 1px; } */
hr { border: none;  height: 1px;  background-color: #bbbbbb; }

dt { font-weight: bold;  color: #000066; }

.chapter { font-family: Arial,Helvetica,sans-serif;
  font-size: 19px;
  font-weight: bold;
  font-style: normal;
  color: #003d8f;       /* 000066 (bisher), 000099 (Börse), 003d8f (1&1) */
  background-color: #e0efff;   /* #daecff; */
  border: 1px solid #003d8f;
  border-collapse: separate;
  border-spacing: 1px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08), 0 0px 20px 0 rgba(0, 0, 0, 0.18);
}
.chapterH { font-family: Arial,Helvetica,sans-serif;
  font-size: 19px;
  font-weight: bold;
  font-style: normal;
  color: #003d8f;       /* 000066 (bisher), 000099 (Börse), 003d8f (1&1) */
  background-color: #e0efff;   /* #daecff; */
  margin: 0px;
  text-align: center;
}

.angebot { font-family: Arial,Helvetica,sans-serif;
  padding: 13px;
  background-color: #fff3ca;
  border: 1px solid #003d8f;
  border-collapse: separate;
  border-spacing: 0px;
  /* box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08), 0 0px 20px 0 rgba(0, 0, 0, 0.18); */
  box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.2), 0 0px 28px 0 rgba(0, 0, 0, 0.19);
}

.video {
  border: 1px solid #003d8f;
  box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.2), 0 0px 28px 0 rgba(0, 0, 0, 0.19);
}
.tdangebot { font-family: Calibri,Tahoma,Arial,Helvetica,sans-serif;
  font-size: 19px;
  font-weight: bold;
  color: #000066;
  line-height: 23px;
}

.tabelle {
  background-color: #fff3ca;       /* #ffeeb2; */
  border: 1px solid #e8b400;       /* #b78d00; */
  outline: 1px solid #e8b400;      /* #b78d00; */
  outline-offset: 1px;
  border-collapse: collapse;
  border-spacing: 1px;
  box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.07),
              0 0px 20px 2px rgba(0, 0, 0, 0.17);
}

td { padding: 4px;
     padding-left: 6px;
     padding-right: 6px; }
/* table { border-collapse: collapse; } */

.big { font-family: Calibri, Arial,Helvetica,sans-serif;
  font-size: 24px;
  font-weight: normal; }

.inhalt { font-family: Calibri,Arial,Tahoma,Verdana,sans-serif;
  font-size: 18px;
  font-weight: bold;
  color: #000066;
  white-space: nowrap;
  padding-bottom: 6px; }

.noframe { font-family: Calibri,Arial,sans-serif;
  font-size: 21px;
  font-weight: bold;
  color: #dd0000;
  line-height: 23px; }

.noframelink { font-family: Calibri,Arial,sans-serif;
  font-size: 21px;
  font-weight: bold;
  line-height: 23px; }

.tdbold { font-family: Calibri,Arial,Tahoma,Verdana,sans-serif;
  font-size: 18px;
  font-weight: bold;
  color: #000066;
  line-height: 23px;
  border: 1px solid #e8b400; }  /* (für ockerfarbene Tabellen-Innenränder im Internet Explorer und Edge) */

.button { font-family: Arial,Helvetica,sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #000000;
  height:28px; }

.download-button {
        -moz-box-shadow:inset 0px 2px 3px -1px #54a3f7;
        -webkit-box-shadow:inset 0px 2px 3px -1px #54a3f7;
        box-shadow:inset 0px 2px 3px -1px #54a3f7;
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
        background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
        background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
        background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
        background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
        background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
        background-color:#007dc1;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        border-radius:3px;
        border:1px solid #124d77;
        display:inline-block;
        cursor:pointer;
        color:#ffffff;
        font-family:Arial;
        font-size:17px;
        font-weight:bold;
        /* padding:9px 45px; */
        text-decoration:none;
        text-shadow:0px 1px 0px #154682;
}
.download-button:hover {
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
        background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
        background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
        background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
        background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
        background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
        background-color:#0061a7;
        text-decoration:underline;
}
.download-button:active {
        position:relative;
        top:1px;
}

.zoom-in img{
  cursor: -moz-zoom-in;
  cursor: -webkit-zoom-in;
  cursor: zoom-in;
}   /* Derzeit nicht genutzt 01.03.2017 */

/* .shadow { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); } */
.shadow { box-shadow: 0 2px 14px 0 rgba(0, 0, 0, 0.2), 0 0px 28px 0 rgba(0, 0, 0, 0.19); }

.shadow-small { box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.15), 0 0px 20px 0 rgba(0, 0, 0, 0.19);
  cursor: -moz-zoom-in;
  cursor: -webkit-zoom-in;
  cursor: zoom-in; }

/* Folgend: Derzeit nicht genutzt 08.03.2017 */
.logo { font-family: Arial,Helvetica,sans-serif;
  font-size: 40px;
  font-weight: 900;
  color: #f69404;    /* #fc9a04   #f69404*/
  text-shadow: 0px 1px 0px #999,
               0px 2px 0px #888,
               0px 3px 0px #777,
               0px 4px 0px #666,
               0px 5px 0px #555,
               0px 6px 0px #444,
               0px 7px 5px #011;
}   /* Derzeit nicht genutzt 08.03.2017 */

.logo2 { font-family: Arial,Helvetica,sans-serif;
  font-size: 38px;
  font-weight: 900;
  color: #f69404;    /* #fc9a04   #f69404*/
  text-shadow: 0px 1px 0px #999,
               0px 2px 0px #777,
               0px 3px 0px #555,
               0px 4px 4px #666;
}

.headline { font-family:Arial,sans-serif;
  font-size: 21px;
  font-weight: 700;
  width: 100%;
  margin-top: 9px;
  color: #03429f;
  /* text-shadow: 0px 1px 2px #bbb; */
}

.formular { background-color: #eeeeee;
  margin-left:auto; margin-right:auto;  /* zentrieren, <center> in HTML5 nicht erlaubt! */
  outline: 13px solid #eeeeee;
  box-shadow: 0px 2px 20px 14px #cccccc,
              0px 0px 0px 14px #bbbbbb;
 }


/* p,dd,div { line-height: 20px; }   z.Zt. noch nicht benutzt */

/*
body,p,td,th,li { font-family : Calibri,Geneva,Helvetica,Arial,sans-serif;
  font-size : 13px;
  font-weight : normal;
  font-style : normal;
  line-height: 18px;
  color: Black; }
*/


/* #cookiedingsbums a {color:#000; text-decoration:none;} */

#cookiedingsbums a:hover {text-decoration:underline;}

#cookiedingsbums div {padding:10px; padding-right:40px}

#cookiedingsbums {
   margin-left: -8px;
   outline: 1px solid #7b92a9;
   text-align:right;
   border-top:1px solid #fff;
   background: #d6e0eb;
   background: -moz-linear-gradient(top, #d6e0eb 0%, #f2f6f9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6e0eb), color-stop(100%,#f2f6f9));
   background: -webkit-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%);
   background: -o-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%);
   background: -ms-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%);
   background: linear-gradient(to bottom, #d6e0eb 0%,#f2f6f9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(   startColorstr='#d6e0eb', endColorstr='#f2f6f9',GradientType=0 );
   position:fixed;
   bottom:0px;
   z-index:10000;
   width:100%;
   font-size:12px;
   line-height:16px;}

#cookiedingsbumsCloser {
   color: #777;
   font: 14px/100% arial, sans-serif;
   position: absolute;
   right: 5px;
   text-decoration: none;
   text-shadow: 0 1px 0 #fff;
   top: 5px;
   cursor:pointer;
   border-top:1px solid white;
   border-left:1px solid white;
   border-bottom:1px solid #7b92a9;
   border-right:1px solid #7b92a9;
   padding:4px;
   background: #ced6df; /* Old browsers */
   background: -moz-linear-gradient(top, #ced6df0%, #f2f6f9 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9));
   background: -webkit-linear-gradient(top, #ced6df0%,#f2f6f9 100%);
   background: -o-linear-gradient(top, #ced6df0%,#f2f6f9 100%);
   background: -ms-linear-gradient(top, #ced6df0%,#f2f6f9 100%);
   background: linear-gradient(to bottom, #ced6df0%,#f2f6f9 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(    startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 );
 }

#cookiedingsbumsCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;}