11.04.2026, 13:32
<style type="text/css">/*
*/:root { --h4w-storyline-highlight-1: #4984c9; --h4w-storyline-bg-1: #d3def3; --h4w-storyline-bg-2: #e0e7f5; --h4w-storyline-bg-3: #dce5f6; --h4w-storyline-fontcolor-main: #262c45; --h4w-storyline-main-bgcolor: var(--h4w-storyline-bg-2); --h4w-storyline-blacklist-bg: var(--h4w-storyline-bg-3); --h4w-storyline-blacklist-border-color: var(--h4w-storyline-bg-1); --h4w-storyline-blacklist-color: var(--h4w-storyline-fontcolor-main); --h4w-storyline-blacklist-title-color: var(--h4w-storyline-highlight1); --h4w-storyline-blacklist-hauspunkte-bg: var(--h4w-storyline-main-bgcolor); --h4w-storyline-blacklist-hauspunkte-color: var(--h4w-storyline-fontcolor-main); --h4w-storyline-blacklist-hr: var(--h4w-storyline-bg-3); --h4w-storyline-highlight1: var(--h4w-storyline-highlight-1); --h4w-storyline-schlagzeile-bg: #f4f6fa; }/*
**** ------------------------------------------------ ****
**** Schlagzeilen Overview ****
**** ------------------------------------------------ ****
*/ .h4w-storyline-container { width: 600px; box-sizing: border-box; background: var(--h4w-storyline-blacklist-bg); border: 3px solid var(--h4w-storyline-blacklist-border-color); color: var(--h4w-storyline-blacklist-color); font-family: "Montserrat", sans-serif; font-size: 14px; line-height: 160%; margin: 0 auto; padding: 30px; text-align: justify; }/*
*/ .h4w-storyline-container * { box-sizing: border-box; }/*
*/ .h4w-storyline-container b1 { color: var(--h4w-storyline-highlight1); font-weight: 500 !important; }/*
*/ .h4w-storyline-container ul li { list-style: none; position: relative; margin-bottom: 5px; text-align: left; }/*
*/ .h4w-storyline-container ul { padding-left: 25px; }/*
*/ .h4w-storyline-container ul li::before { content: "»"; position: absolute; color: var(--h4w-storyline-highlight1); left: -15px; }/*
*/ .h4w-storyline-separator { width: 100%; height: 50px; background: url('https://h4w-rpg.de/design/ice_storm_war/kat_2.png') #cfddf3 no-repeat top center; display: flex; justify-content: center; align-items: center; }/*
*/ .h4w-storyline-separator .text { background: rgba(255, 255, 255, 0.87); padding: 0.3em 0.5em; font-size: 20px; color: var(--h4w-storyline-fontcolor-main); font-family: "DM Serif Display", serif; }/*
*/ .h4w-storyline-headline, .h4w-storyline-headline a { font-family: "DM Serif Display", serif; font-size: 28px; text-align: center; margin-bottom: 10px; color: var(--h4w-storyline-highlight1); text-decoration: none; }/*
*/ .h4w-storyline-header { width: 600px; height: 330px; background: url('https://h4w-rpg.de/storyline/logo3.png') #cfddf3 no-repeat top center; margin: 0 auto; }/*
*/ .h4w-storyline-cursive { font-style: italic; font-family: "Domine", serif; padding: 20px 20px 20px 50px; color:#5a648d;}/*
*/ .h4w-storyline-cursive-accent {display: inline-block; overflow: visible; color: rgba(139, 170, 218, 0.5); font-size: 200px; position: relative; right: 35px; top: 75px; letter-spacing: -0.1em; font-family: "Times New Roman";}/*
*/ hl { font-weight: bold; padding-bottom: 6px; background-image: linear-gradient(rgba(139, 170, 218, 0.1), rgba(139, 170, 218, 0.5)); background-position: 0 60%; background-repeat: no-repeat; background-size: 100% 6px; }/*
**** ------------------------------------------------ ****
**** Content ****
**** ------------------------------------------------ ****
*/ .h4w-schlagzeilen-container { width: 100%; height: 100%; padding: 30px 0 20px 0; }/*
*/ .h4w-schlagzeilen-box { width: 540px; margin-top: -40px; padding: 15px; box-sizing: border-box; background: var(--h4w-storyline-schlagzeile-bg); border: 3px solid var(--h4w-storyline-blacklist-bg); text-align: left; color: var(--h4w-storyline-blacklist-color); position: relative; z-index: 5; transition: 0.5s; animation: bring-to-front 12s infinite ease-in-out; }/*
*/ .h4w-schlagzeilen-box:nth-child(odd) { margin-left: -50px; }/*
*/ .h4w-schlagzeilen-box:nth-child(even) { margin-left: 50px; }/*
**** ------------------------------------------------ ****
**** Header ****
**** ------------------------------------------------ ****
*/ .h4w-schlagzeile-top { display: flex; align-items: center; gap: 8px; position: relative; }/*
*/ .h4w-schlagzeile-top i { font-size: 16px; color: var(--h4w-storyline-highlight1); }/*
*/ .h4w-schlagzeile-source { font-size: 15px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: var(--h4w-storyline-highlight1); }/*
*/ .h4w-schlagzeile-date { position: absolute; right: 0; font-weight: 700; color: var(--h4w-storyline-highlight1); }/*
**** ------------------------------------------------ ****
**** Main Content ****
**** ------------------------------------------------ ****
*/ .h4w-schlagzeile-main { margin-top: 5px; display: flex; gap: 3%; }/*
*/ .h4w-schlagzeile-text { width: 82%; }/*
*/ .h4w-schlagzeile-text span { display: block; color: var(--h4w-storyline-highlight1); }/*
*/ .h4w-schlagzeile-infos { width: 15%; text-align: right; font-weight: 700; }/*
*/ .h4w-storyline-links {display: flex; gap: 10px; justify-content: center; flex-wrap: wrap;} /*
*/ .h4w-storyline-links a:link {padding: 5px 10px; border: 1px solid var( --h4w-storyline-fontcolor-main); font-size: 13px;} /*
**** ------------------------------------------------ ****
**** Icons / Stats ****
**** ------------------------------------------------ ****
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-likes, .h4w-schlagzeile-infos .h4w-schlagzeile-comments/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-shares, .h4w-schlagzeile-infos .h4w-schlagzeile-retweets { position: relative; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-likes { color: #d45764; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-likes::after { content: "\eb04"; font-family: "cappuccicons"; padding-left: 3px; font-size: 12px; position: relative; top: 1px; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-comments { color: #70a7b3; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-comments::after { content: "\e9d7"; font-family: "cappuccicons"; padding-left: 3px; font-size: 12px; position: relative; top: 1px; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-shares { color: #a679b3; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-shares::after { content: "\ec66"; font-family: "cappuccicons"; padding-left: 3px; font-size: 11px; position: relative; top: -0.5px; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-retweets { color: #77b574; }/*
*/ .h4w-schlagzeile-infos .h4w-schlagzeile-retweets::after { content: "\ec37"; font-family: "cappuccicons"; padding-left: 3px; font-size: 12px; position: relative; top: 1px; }/*
**** ------------------------------------------------ ****
**** Magie ****
**** ------------------------------------------------ ****
*/ @keyframes bring-to-front {/*
0% { z-index: 5; transform: scale(1); border-color: var(--h4w-storyline-blacklist-bg); }/*
*/ 10% { z-index: 10; transform: scale(1.05); border-color: var(--h4w-storyline-highlight1); }/*
*/ 30% { z-index: 10; transform: scale(1.05); border-color: var(--h4w-storyline-highlight1); }/*
*/ 40% { z-index: 5; transform: scale(1); border-color: var(--h4w-storyline-blacklist-bg); }/*
*/ 100% { z-index: 5; transform: scale(1); border-color: var(--h4w-storyline-blacklist-bg); }
}/*
*/ .h4w-schlagzeilen-box:nth-child(1) { animation-delay: 0s; }/*
*/ .h4w-schlagzeilen-box:nth-child(2) { animation-delay: 4s; }/*
*/ .h4w-schlagzeilen-box:nth-child(3) { animation-delay: 8s; }/*
*/ .h4w-schlagzeilen-box:nth-child(4) { animation-delay: 12s; }/*
*/</style>