/* Stylesheet für die Buchseiten des KlaRas-Verlages */

/* Reset */
* {margin:0; padding:0;}

/* Hintergrund- und Textfarben */
.snowwhite  {background-color:#fff; color:black;}
.darkyellow {background-color:#fc0; color:black;}

/* Zeichensatz */
body        {font-family:Verdana,Arial,Helvetica,sans-serif;}

/* Zeichengröße */
td, p       {font-size:18px;}

/* Seitenkopf */
.kopflinks  {height:80px; text-align:left; padding-left:20px; font:bold 18px Arial,sans-serif;}
.kopfmitte  {height:80px; text-align:center; font:bold 40px Arial,sans-serif;}
.kopfrechts {height:80px; text-align:right; padding-right:10px; font:small-caps bold 30px 'Arial Narrow',sans-serif;}
.spreizen   {word-spacing:0.3pc;}

/* KlaRas */
.smallcaps  {font-variant:small-caps;}

/* Überschrift */
.ue         {font-weight:bold; font-size:30px; letter-spacing:1px; margin-top:15px;}
.ui         {display:inline;}
.rm         {font-weight:bold; font-size:18px;}

#titel img  {float:left; height:250px; margin:15px 15px 15px 30px; border:1px solid gray;}
#titel span {font-size:20px;}

#titel-ful  {display:block;}   /* Sonderbehandlung für Seite Naturpark Barnim */
#titel-red  {display:none;}

.ab1 {margin-top:10px;}
.ab2 {margin-bottom:6px;}
.ab3 {margin-top:6px; margin-bottom:6px;}
.ab4 {margin-top:6px; margin-bottom:6px; font-size:14px; margin-right:15px;}

/* Tabellen */
table       {border:0; border-collapse:collapse; width:100%;}
.w100       {width:100%;}

/* Tabellenzellen */
td.im       {text-align:left; padding-left:30px;}
td.tt       {text-align:center; padding:0 30px 0 0;}
td.tfl      {height:90px; text-align:left; padding-left:10px;}
td.tfm      {height:90px; text-align:center;}
td.tfr      {height:90px; text-align:right; padding-right:10px;}
td.tfh      {height:45px;}
td.tfu      {height:40px; font-weight:800; font-size:15px; text-align:center;}
td.bx       {height:60px; text-align:center;}
td.vt       {vertical-align:top;}

/* Image */
img         {border:0;}
img.rand    {border:1px solid gray;}

/* Absatz */
p           {text-align:center; line-height:130%; margin:0;}
p.pp        {text-align:justify; text-indent:13px; margin:10px 30px 0px 30px;}

/* Speziell für Karte Berliner Umland Süd */

#kartenwrapper {text-align:center;}
#kartenwrapper img {margin:16px; border:1px solid silver;}
.inline      {display:inline;}
a:hover.bgw  {background-color:#fff;}

/* Zwischenschicht */
#zwischenschicht {position:fixed; left:0px; top:0px; width:100%; height:100%; display:none; opacity:0; background-color:#bfbfbf; padding-top:10px;}
#zwischenschicht button {position:fixed; right:7px; top:4px; width:29px; height:29px; background-color:red; text-align:center; border:2px solid white;}
#zwischenschicht div {text-align:center;}

/* Sprungleiste */
#sprungleiste {position:relative; left:50%; width:50%; margin-left:-25%; margin-top:18px; margin-bottom:18px; text-align:center;}
/* Ende Speziell ... */

/* Link */
a:link      {color:#00f; text-decoration:none; background-color:#fff;}
a:link.ab   {color:#00f; text-decoration:none; background-color:#fc0;}
a:link.spez {background-color:#fc0;}
a:visited   {color:#00f; text-decoration:none; background-color:#fff;}
a:visited.ab{color:#00f; text-decoration:none; background-color:#fc0;}
a:active    {color:#000; text-decoration:none; background-color:#ff00a0;}
a:hover     {color:#fff; text-decoration:none; background-color:#000; font-weight:400;}
a:hover.ab  {color:#fff; text-decoration:none; background-color:#fc0;}
a:hover.spez{background-color:#fc0;}

/* Media-Anpassung Seitenkopf */
@media only screen and (max-width:1100px) {
 #kopf td:nth-of-type(2) {font-size:36px;}
}
@media only screen and (max-width:1000px) {
 #kopf td:nth-of-type(2) {font-size:32px;}
}
@media only screen and (max-width:900px) {
 #kopf td:nth-of-type(2) {font-size:28px;}
 #kopf td:nth-of-type(3) {font-size:24px;}
}
@media only screen and (max-width:800px) {
 #kopf td:nth-of-type(2) {font-size:24px;}
 #kopf td:nth-of-type(3) {font-size:19px;}
}
@media only screen and (max-width:700px) {
 #kopf td:nth-of-type(1) {font-size:12px; padding-left:6px;}
 #kopf td:nth-of-type(2) {font-size:20px;}
 #kopf td:nth-of-type(3) {font-size:15px;}
}
@media only screen and (max-width:500px) {
 #kopf td:nth-of-type(2) {font-size:17px;}
}
@media only screen and (max-width:300px) {
 #kopf td:nth-of-type(2) {font-size:14px;}
}
/* Media-Anpassung Bücherleiste */
@media only screen and (min-width:1100px) {
 #tdwrapper {display:block; width:195px;}
 #blwrapper {display:block; width:195px;}
}
@media only screen and (max-width:900px) {
 #tdwrapper {display:none; width:0px;}
 #blwrapper {display:none; width:0px;}
}
/* Media-Anpassung Titelblock */
@media only screen and (max-width:800px) {
 #titel p {font-size:14px; margin-top:5px;}
 #titel div p {font-size:14px; margin-top:5px;}
}
@media only screen and (max-width:700px) {
 #titel img {display:none;}
}
/* Media-Anpassung Beschreibungstext */
@media only screen and (max-width:800px) {
 #txtwrapper p {margin:6px 10px 0px 6px;}
}
/* Media-Anpassung Sprungleiste */
@media only screen and (max-width:900px) {
 #sprungleiste {margin-left:-17%;}
 #sprungleiste {width:300px;}
}
@media only screen and (max-width:700px) {
 #sprungleiste {margin-left:-27%;}
 #sprungleiste {width:300px;}
}
@media only screen and (max-width:500px) {
 #sprungleiste {margin-left:-35%;}
 #sprungleiste {width:300px;}
}
/* Ende des Stylesheet */