@import url("../font/dancing-script.css"); @charset "utf-8"; @media screen, projection { /* Die Banner für die einzelnen Hauptthemen werden geladen: ------------------------------------------------------------*/ #banner #ba1880 { height: 170px; width: 569px; background: url(1880.jpg) no-repeat;} #banner #ba1881 { height: 170px; width: 569px; background: url(1881.jpg) no-repeat;} #banner #ba1882 { height: 170px; width: 569px; background: url(1882.jpg) no-repeat;} #banner #ba1883 { height: 170px; width: 569px; background: url(1883.jpg) no-repeat;} #banner #ba1884 { height: 170px; width: 569px; background: url(1884.jpg) no-repeat;} #banner #ba20j { height: 170px; width: 569px; background: url(20.jpg) no-repeat;} #banner #ba19 { height: 170px; width: 569px; background: url(1900.jpg) no-repeat;} #banner #ba191 { height: 170px; width: 569px; background: url(1901.jpg) no-repeat;} #banner #ba33 { height: 170px; width: 569px; background: url(weimar.jpg) no-repeat;} #banner #ba32 { height: 170px; width: 569px; background: url(weimar1.jpg) no-repeat;} #banner #ba14 { height: 170px; width: 569px; background: url(1914.jpg) no-repeat;} #banner #ba141 { height: 170px; width: 569px; background: url(1914-1.jpg) no-repeat;} #banner #ba39 { height: 170px; width: 569px; background: url(krieg.jpg) no-repeat;} #banner #ba40 { height: 170px; width: 569px; background: url(40.jpg) no-repeat;} #banner #ba41 { height: 170px; width: 569px; background: url(41.jpg) no-repeat;} #banner #ba42 { height: 170px; width: 569px; background: url(42.jpg) no-repeat;} #banner #ba44 { height: 170px; width: 569px; background: url(44.jpg) no-repeat;} #banner #ba45 { height: 170px; width: 569px; background: url(45.jpg) no-repeat;} #banner #ba451 { height: 170px; width: 569px; background: url(1945.jpg) no-repeat;} #banner #ba452 { height: 170px; width: 569px; background: url(1946.jpg) no-repeat;} #banner #ba46 { height: 170px; width: 569px; background: url(46.jpg) no-repeat;} #banner #ba47 { height: 170px; width: 569px; background: url(47.jpg) no-repeat;} #banner #shoa { height: 170px; width: 569px; background: url(shoa.jpg) no-repeat;} #banner #shoa2 { height: 170px; width: 569px; background: url(shoa2.jpg) no-repeat;} #banner #shoa3 { height: 170px; width: 569px; background: url(shoa3.jpg) no-repeat;} #banner #shoa4 { height: 170px; width: 569px; background: url(shoa4.jpg) no-repeat;} #banner #boot { height: 170px; width: 569px; background: url(boot.jpg) no-repeat;} #banner #boot1 { height: 170px; width: 569px; background: url(boot-1.jpg) no-repeat;} #banner #boot2 { height: 170px; width: 569px; background: url(boot-2.jpg) no-repeat;} #banner #boot3 { height: 170px; width: 569px; background: url(boot-3.jpg) no-repeat;} #banner #scool { height: 170px;width: 569px; background: url(schule.jpg) no-repeat;} #banner #scool1 { height: 170px;width: 569px; background: url(schule1.jpg) no-repeat;} #banner #scool2 { height: 170px;width: 569px; background: url(schule2.jpg) no-repeat;} #banner #scool3 { height: 170px;width: 569px; background: url(schule3.jpg) no-repeat;} #banner #ba48 { height: 170px; width: 569px; background: url(waehrung.jpg) no-repeat;} #banner #ba48_1 { height: 170px; width: 569px; background: url(48.jpg) no-repeat;} #banner #ba50 { height: 170px; width: 569px; background: url(1950.jpg) no-repeat;} #banner #ba50_1 { height: 170px; width: 569px; background: url(1950-1.jpg) no-repeat;} #banner #ba50_2 { height: 170px; width: 569px; background: url(1950-2.jpg) no-repeat;} #banner #ba50_3 { height: 170px; width: 569px; background: url(1950-3.jpg) no-repeat;} #banner #ba80 { height: 170px; width: 569px; background: url(1980.jpg) no-repeat;} #banner #ba80_2 { height: 170px; width: 569px; background: url(1980-2.jpg) no-repeat;} #banner #ba80_3 { height: 170px; width: 569px; background: url(1980-3.jpg) no-repeat;} #banner #ba80_4 { height: 170px; width: 569px; background: url(1980-4.jpg) no-repeat;} #banner #barez { height: 170px; width: 569px; background: url(rez.jpg) no-repeat;} #banner #reise { height: 170px; width: 569px; background: url(reise.jpg) no-repeat;} #banner #reise1 { height: 170px; width: 569px; background: url(reise1.jpg) no-repeat;} #banner #reise2 { height: 170px; width: 569px; background: url(reise2.jpg) no-repeat;} #banner #nahost { height: 170px; width: 569px; background: url(nahost.jpg) no-repeat;} #banner #nahost1 { height: 170px; width: 569px; background: url(nahost1.jpg) no-repeat;} #banner #auto { height: 170px; width: 569px; background: url(auto.jpg) no-repeat;} #banner #auto1 { height: 170px; width: 569px; background: url(auto1.jpg) no-repeat;} #banner #auto2 { height: 170px; width: 569px; background: url(auto2.jpg) no-repeat;} #banner #auto3 { height: 170px; width: 569px; background: url(auto3.jpg) no-repeat;} #banner #tier { height: 170px; width: 569px; background: url(tier.jpg) no-repeat;} #banner #history { height: 170px; width: 569px; background: url(history.jpg) no-repeat;} #banner #zttfl-0 { height: 170px; width: 569px; background: url(zeittafel.jpg) no-repeat;} #banner #zttfl-1 { height: 170px; width: 569px; background: url(zeittafel1.jpg) no-repeat;} #banner #zttfl-2 { height: 170px; width: 569px; background: url(zeittafel2.jpg) no-repeat;} #banner #maritim { height: 170px; width: 569px; background: url(maritim.jpg) no-repeat;} #banner #maritim1 { height: 170px; width: 569px; background: url(maritim1.jpg) no-repeat;} #banner #lyrik { height: 170px; width: 569px; background: url(lyrik.jpg) no-repeat;} #banner #lyrik1 { height: 170px; width: 569px; background: url(lyrik1.jpg) no-repeat;} #banner #ddr { height: 170px; width: 569px; background: url(ddr.jpg) no-repeat;} #banner #ddr2 { height: 170px; width: 569px; background: url(ddr2.jpg) no-repeat;} #banner #weihnacht { height: 170px; width: 569px; background: url(weihnacht.jpg) no-repeat;} #banner #flucht { height: 170px; width: 569px; background: url(flucht.jpg) no-repeat;} #banner #flucht1 { height: 170px; width: 569px; background: url(flucht1.jpg) no-repeat;} #banner #flucht2 { height: 170px; width: 569px; background: url(flucht2.jpg) no-repeat;} #banner #flucht3 { height: 170px; width: 569px; background: url(flucht3.jpg) no-repeat;} /* Die Banner der einzelnen Hauptthemen werden geladen: ------------------------------------------------------------*/ #banner #start { height: 170px; width: 569px; background: url(start.jpg) no-repeat;} #banner #start1 { height: 170px; width: 569px; background: url(start1.jpg) no-repeat;} #banner #start2 { height: 170px; width: 569px; background: url(start2.jpg) no-repeat;} #banner #advent {height: 170px; width: 569px;background: url(advent.jpg) no-repeat;} #banner #silvester {height: 170px;width: 569px; background: url(silvester.jpg) no-repeat;} #banner #werk {height: 170px;width: 569px;background: url(werk.jpg) no-repeat;} #banner #werk1 {height: 170px;width: 569px;background: url(werk1.jpg) no-repeat;} #banner #aktuell {height: 170px;width: 569px;background: url(aktuell.jpg) no-repeat;} #banner #aktuell1 {height: 170px;width: 569px;background: url(aktuell1.jpg) no-repeat;} #banner #aktuell2 {height: 170px;width: 569px;background: url(aktuell2.jpg) no-repeat;} #banner #blog {height: 170px;width: 569px;background: url(blog.jpg) no-repeat;} #banner #autoren {height: 170px;width: 569px;background: url(autor.jpg) no-repeat;} #banner #autor1 {height: 170px;width: 569px;background: url(autor1.jpg) no-repeat;} #banner #autor2 {height: 170px;width: 569px;background: url(autor2.jpg) no-repeat;} #banner #autor3 {height: 170px;width: 569px;background: url(autor3.jpg) no-repeat;} #banner #lexikon {height: 170px;width: 569px;background: url(lex.jpg) no-repeat;} #banner #buch {height: 170px;width: 569px;background: url(buch.jpg) no-repeat;} #banner #dennoch {height: 170px;width: 569px;background: url(dennoch.jpg) no-repeat;} #banner #schwarzbrot {height: 170px;width: 569px;background: url(schwarzbrot.jpg) no-repeat;} #banner #kriegskinder {height: 170px;width: 569px;background: url(kriegskinder.jpg) no-repeat;} #banner #gast {height: 170px;width: 569px;background: url(gast.jpg) no-repeat;} #banner #kontakt {height: 170px;width: 569px;background: url(kontakt.jpg) no-repeat;} #banner #sitemap { height: 170px; width: 569px; background: url(sitemap.jpg) no-repeat;} /* Banner - Hover für Thema -------------------------------------------------------------- */ #sidebar a span.Ue_1880 {background: url(../banner/ba_1880_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1900 {background: url(../banner/ba_1900_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1914 {background: url(../banner/ba_1914_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1933 {background: url(../banner/ba_1933_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1939 {background: url(../banner/ba_krieg_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_shoa {background: url(../banner/shoa_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1940 {background: url(../banner/ba_uboot_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1945 {background: url(../banner/ba_1945_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1948 {background: url(../banner/ba_1948_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1950 {background: url(../banner/ba_1950_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1980 {background: url(../banner/ba_1980_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_flucht {background: url(../banner/ba_flucht_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_modern {background: url(../banner/ba_modern_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_1989 {background: url(../banner/ba_ddr_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_zeit {background: url(../banner/ba_zeittafel_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_hist {background: url(../banner/ba_history_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_schule {background: url(../banner/ba_schule_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_verschickt {background: url(../banner/ba_heim_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_see {background: url(../banner/ba_maritim_hover.jpg) no-repeat right top; z-index: 1025;} #sidebar a span.Ue_reise {background: url(../banner/ba_reise_hover.jpg) no-repeat right top; z-index: 1025;} #sidebar a span.Ue_nahost {background: url(../banner/ba_nahost_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_auto {background: url(../banner/auto_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_tier {background: url(../banner/tier_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_weihnacht {background: url(../banner/ba_weihnacht_hover.jpg) no-repeat right top; z-index: 1025;} #sidebar a span.Ue_kueche {background: url(../banner/ba_rez_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_heiter {background: url(../banner/ba_lyrik_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_schreib {background: url(../banner/schreib-hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} #sidebar a span.Ue_blog {background: url(../banner/blog_hover.jpg) no-repeat right top; z-index: 1025; line-height:1.5em;} /* ###### Bannerwechsel ###### */ main { background: transparent; border-color: transparent; } main h1 {font-family: 'dancing_script_otregular'; z-index:100; transform: rotate(-5deg); color: #fff; text-shadow: 1px 1px 0 #000742, 1px -1px 0 #000742, -1px 1px 0 #000742, -1px -1px 0 #000742, 1px 0px 0 #000742, 0px 1px 0 #000742, -1px 0px 0 #000742, 0px -1px 0 #000742; white-space:nowrap;} #serie {position: relative; height: 170px; width: 569px; margin: 10px 0 0 0; background: url(../banner/main.jpg) no-repeat; border: none;} #serie figure {position: absolute;top: -8px; left: -33px;} /*#serie figcaption {position: absolute;left: 1em;font-size: 2em;font-weight: bold; bottom: 0.5em; color: white;}*/ @-webkit-keyframes bilder { 0% {opacity: 1; } 34% {opacity: 1;} 35% {opacity: 0;} 100% {opacity: 0;} } @keyframes bilder { 0% {opacity: 1;} 34% {opacity: 1;} 35% {opacity: 0;} 100% {opacity: 0;} } #serie figure:nth-of-type(1) {-webkit-animation: bilder 20s 9s infinite; animation: bilder 20s 9s infinite;} #serie figure:nth-of-type(2) {-webkit-animation: bilder 20s 3s infinite; animation: bilder 20s 3s infinite;} #serie figure:nth-of-type(3) {-webkit-animation: bilder 20s 14s infinite; animation: bilder 20s 14s infinite;} @-webkit-keyframes wechseln { 0% {opacity: 1; transform: scale(1, 1); z-index: 20;} 20% {opacity: 1;transform: scale(1, 1);} 34% {opacity: 0;transform: scale(0, 0);} 100% {opacity: 1;transform: scale(0, 0);} } @keyframes wechseln { 0% {opacity: 1; transform: scale(1, 1); z-index: 20;} 20% {opacity: 1;transform: scale(1, 1);} 34% {opacity: 0;transform: scale(0, 0);} 100% {opacity: 1;transform: scale(0, 0); } } #serie figure:nth-of-type(4) {-webkit-animation: wechseln 20s 13s infinite; animation: wechseln 20s 13s infinite;} #serie figure:nth-of-type(5) {-webkit-animation: wechseln 20s 7s infinite; animation: wechseln 20s 7s infinite;} #serie figure:nth-of-type(6) {-webkit-animation: wechseln 20s infinite; animation: wechseln 20s infinite;} /* ####### Themengruppe formatieren ######## */ #themenGruppe span:before { content: "Thema: "; /*color:#009;*/ background: rgba(0,0,0,.8); color:#fff; font-weight:700; padding:6px; margin-right:1em; border:1px solid black; border-radius:50%;} #buecher span:before { content: "Printerzeugnisse, Bücher: "; color:#009;} #themenGruppe, #buecher { margin: 30px 0 10px -50px; padding: 0 30px 5px 30px; border-bottom: 1px solid #ccc; font-family:Arial, Helvetica, sans-serif; font-size:0.8em; display:inline-block; color:#7f7f7f; box-shadow:none !important;} #themenGruppe a:link, #buecher a:link { color:#7f7f7f;text-decoration:none; } #themenGruppe a:hover, #buecher a:hover { color:#f90;text-decoration:underline; } }