@font-face{font-family:'antoniobold';src:url(../fonts/antonio-bold-webfont.woff2) format("woff2"),url(../fonts/antonio-bold-webfont.woff) format("woff");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'antoniolight';src:url(../fonts/antonio-light-webfont.woff2) format("woff2"),url(../fonts/antonio-light-webfont.woff) format("woff");font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'hp_simplifiedregular';src:url(../fonts/hpsimplified_rg-webfont.woff2) format("woff2"),url(../fonts/hpsimplified_rg-webfont.woff) format("woff");font-weight:400;font-style:normal;font-display:swap}
html{scroll-behavior:smooth}
a:link{color:#fff}
a:visited{color:#ccc}
a:hover,a:active{color:red}
body{margin:0;background:url("../images/site/web-hg.jpg") no-repeat fixed center center;background-size:cover;background-color:#0a0a0a;font-family:"hp_simplifiedregular","Gill Sans","Gill Sans MT",Calibri,"Trebuchet MS",sans-serif;color:#fff}
h1{font-size:2em;font-variant:small-caps;font-family:"antoniobold",Arial,sans-serif;letter-spacing:.15em;color:#3b5998;font-weight:700;margin:2em 0 .8em}
h2{font-variant:small-caps;font-family:"antoniolight",Arial,sans-serif;margin:1.4em 0 .6em}
h3{margin:1.5em 0 .5em}
h4{text-decoration:underline;margin:1.2em 0 .5em}
h5{text-decoration:none;font-weight:400;margin:.8em 0}
h6{text-decoration:none;font-weight:400;font-size:.85em;color:#ccc;margin:.6em 0}
.hidden{display:none}
#page-wrapper{max-width:1400px;margin:0 auto}
#header{padding:2% 5%;display:flex;flex-direction:column;align-items:flex-start}
#header #blog-title{margin:20px 0 0 100px}
#header #blog-title a{font-family:"antoniobold",Arial,sans-serif;font-size:2.2rem;letter-spacing:.1em;text-decoration:none;color:#fff}
#header #blog-title a:hover{color:#3B5998}
#header #logo img{max-width:100%;height:auto;display:block}
#banner img{width:100%;height:auto;display:block}
#content-wrapper{display:flex;flex-direction:row;width:100%;margin:0;padding:0;background:rgba(15,15,15,.75)}
#content-wrapper article,#content-wrapper aside{box-sizing:border-box}
#content-wrapper article{flex:0 0 70%;padding:5%}
#content-wrapper aside{flex:0 0 30%;padding:5%}
.breadcrumb{font-size:.9em;margin:0}
.breadcrumb ul{list-style-type:none;margin:0;padding:0}
.breadcrumb li{color:#aaa;display:inline-block;margin:0;padding:0}
.breadcrumb li:after{content:">";margin:0 .6em;color:#aaa}
.breadcrumb li:last-child:after{content:""}
.breadcrumb a{color:#fff;text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.pagination{display:flex;gap:.5rem;align-items:center;margin:2rem 0 0 0;flex-wrap:wrap;justify-content:center}
.pagination a,.pagination span{text-decoration:none}
.pagination .page{display:inline-flex;justify-content:center;align-items:center;height:2rem;min-width:2rem;padding:0 .5rem;border-radius:999px}
.pagination .page.d1{width:2rem;min-width:2rem;padding:0}
.pagination a.page:hover{color:#fff;border:1px solid #3b5998}
.pagination .current{font-weight:700;color:#3b5998;border:1px solid #3b5998}
.pagination .dots{border:none;padding:0 .25rem}
.pagination .prev,.pagination .next{font-weight:600;display:inline-flex;align-items:center;justify-content:center;height:2rem;padding:0 .9rem;border-radius:999px}
.pagination .prev:hover,.pagination .next:hover{color:#fff;border:1px solid #3b5998}
.post .content img{max-width:100%;height:auto}
.post .meta{margin:20px 0 0 0}
.post ul{font-size:1em;text-align:left;margin:1em 0 0}
.post ul li{list-style-type:circle;margin:.3em 0}
.post ol{font-size:1em;text-align:left;margin:1em 0 0}
.post ol li{list-style-type:decimal;margin:.3em 0}
.post-excerpt{margin:0 0 1rem 0;padding:.5% 5% 3% 5%;background:rgba(255,255,255,.05);border-radius:6px}
.img-left{float:left;margin:30px 30px 30px 0;max-width:45%}
.img-right{float:right;margin:30px 0 30px 30px;max-width:45%}
.img-center{display:block;margin:1em auto;max-width:90%}
.author-pic-small{width:32px;height:32px;border-radius:50%;vertical-align:middle;margin-right:.3rem}
#sidebar{color:#fff;font-size:.9em}
#sidebar .sidebar-box{margin:0 0 1rem 0;padding:10%;background:rgba(255,255,255,.05);border-radius:6px}
#sidebar h3{font-family:"antoniobold",Arial,sans-serif;font-size:1.2em;margin-top:0;color:#3b5998}
#sidebar .author-box{text-align:center}
#sidebar .author-pic{max-width:120px;height:auto;border-radius:50%;margin:1em auto}
#sidebar .placeholder{opacity:.5}
#sidebar .small{font-size:.8em;color:#ccc}
#sidebar ul{list-style-type:none;padding:0;margin:0}
#sidebar ul li{margin:.7em 0 0 0}
#sidebar ul li a{color:#ccc;text-decoration:none}
#sidebar ul li a:hover{color:red}
footer{background:rgba(15,15,15,.65);padding:2% 10%;border-top:1px solid #fff}
footer h2{font-size:1.2em;margin:1em 0 .3em}
footer p{font-size:.9em;margin:.5em 0}
footer .imprint{display:flex;flex-wrap:wrap;gap:2em;margin-top:2em}
footer .imprint-col{flex:1 1 200px;padding:1% 0 1% 2%;border-left:1px dotted #fff}
footer a{color:#fff;text-decoration:none}
footer a:hover{text-decoration:underline}
.post.error404 .links ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 1em; flex-wrap: wrap; }
.post.error404 .links li { display: inline; }
.post.error404 .links li::after { content: " |"; margin-left: 1em; }
.post.error404 .links li:last-child::after { content: ""; }#privacy-content,#privacy-content a:link,#privacy-content a:visited{color:#000}
.overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);z-index:9999}
.overlay-content{position:relative;margin:5% auto;padding:20px;background-color:#fff;width:80%;max-width:800px;border-radius:8px;height:80%;max-height:600px;overflow-y:auto}
.close-btn{position:sticky;top:10px;right:10px;text-align:right;font-size:30px;color:#3b3b3b;font-weight:bold;cursor:pointer;z-index:10000}
.close-btn:hover{color:red}
@media(max-width:1200px){#content-wrapper{flex-direction:column}#content-wrapper article,#content-wrapper aside{flex:1 1 100%;padding:5%}}
@media(max-width:992px){#sidebar .sidebar-box{padding:0 10%}.post .meta .author{line-height:36px;}}
@media(max-width:768px){h1{font-size:1.6em}#header #blog-title a{font-size:1.8rem;letter-spacing:.08em}}
@media(max-width:480px){#header #blog-title a{font-size:1.6rem;letter-spacing:.05em}footer .imprint-col{max-height:100px;overflow:auto}.post.error404 .links ul{flex-direction: column;gap: 0.5em}.post.error404 .links li::after { content: ""; margin: 0}}