@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700);@keyframes musicBrickBars{0%,to{transform:scaleY(.55);opacity:.45}
35%{transform:scaleY(1);opacity:1}
65%{transform:scaleY(.72);opacity:.72}
}
@keyframes csillagPislog{0%,to{opacity:.2}
50%{opacity:1}
}
@keyframes betuLenges{0%,to{transform:rotate(-2.6deg)}
50%{transform:rotate(2.6deg)}
}
@keyframes zeneRazas{0%,to{transform:none}
10%{transform:translateX(-3px) rotate(-10deg)}
20%{transform:translateX(3px) rotate(10deg)}
30%{transform:translateX(-3px) rotate(-8deg)}
40%{transform:translateX(3px) rotate(8deg)}
50%{transform:translateX(-2px) rotate(-6deg)}
60%{transform:translateX(2px) rotate(6deg)}
70%{transform:translateX(-2px) rotate(-4deg)}
80%{transform:translateX(1px) rotate(3deg)}
90%{transform:translateX(-1px) rotate(-1deg)}
}
@keyframes teglaVillan{0%,to{outline-color:transparent}
18%,70%{outline-color:rgba(138,90,24,.85)}
}
.hidden{display:none;color:#fff;font-size:15px;background:#9d8279;line-height:15px;padding:2px}
.hidden span{padding:1px 2px;margin-right:8px;background:#573a38;display:inline-block}
abbr,address,article,aside,audio,b,blockquote,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,figcaption,figure,footer,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,mark,menu,nav,object,ol,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}
h1,h2,h3,h4{outline:0;background:0 0}
h1,h2,h3,h4,li,p{padding:0;border:0}
body{background:0 0;background:#e7e7de;margin:0;font:18px/1.3"Source Sans Pro",Calibri,Arial,Sans-Serif;color:#333}
fieldset,li,p{outline:0}
a,fieldset,form,label,legend,li,p{font-size:100%;background:0 0}
body,fieldset,form,h1,h2,h3,h4,legend,li,p{vertical-align:baseline}
a,label{margin:0}
body,form,label,legend{border:0;outline:0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:none}
a{vertical-align:baseline}
#fancyPicker a:hover,ins{text-decoration:none}
mark{font-style:italic}
del{text-decoration:line-through}
abbr[title],dfn[title]{cursor:help}
table{border-collapse:collapse;border-spacing:0}
a,form,hr,label{padding:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0}
mark,strong{font-weight:700}
form{margin:0}
.align-right{text-align:right}
button,input[type=button],input[type=reset],input[type=submit]{width:auto;background-color:#123e73;color:#fff;text-shadow:0-1px 0 rgba(0,0,0,.3);cursor:pointer;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4);-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4);-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-ms-transition-duration:0s;-o-transition-duration:.5s;transition-duration:.5s}
button{padding:4px 16px}
input[type=button],input[type=reset],input[type=submit]{font-weight:700;border-color:#123e73;padding-right:16px;padding-left:16px}
button,input{display:inline-block}
button,input,select{margin:3px 2px;font:18px"Source Sans Pro",Calibri,Arial,Sans-Serif;line-height:normal;border:1px solid #ccc;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:0;outline-offset:-2px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-transition:all .26s ease-out;-moz-transition:all .26s ease-out;-ms-transition:all .26s ease-out;-o-transition:all .26s ease-out;transition:all .26s ease-out}
input,select,textarea{padding:4px;color:#666;background-color:#fff;border-top-color:#999;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.1);-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,.1);box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}
textarea{font:18px"Source Sans Pro",Calibri,Arial,Sans-Serif;line-height:normal;border:1px solid #ccc;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:0;outline-offset:-2px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-transition:all .26s ease-out;-moz-transition:all .26s ease-out;-ms-transition:all .26s ease-out;-o-transition:all .26s ease-out;transition:all .26s ease-out;overflow:auto;display:block;width:100%;resize:vertical;margin:3px 0}
input,select{width:100px}
button,input,textarea{vertical-align:middle}
input[type=checkbox],input[type=image],input[type=radio]{width:auto;padding:0;background:0 0;border:0;cursor:pointer;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:none!important;-moz-box-shadow:none!important;box-shadow:none!important}
input[type=checkbox],input[type=radio]{position:relative;top:-2px}
input[type=color],input[type=file],label,select{display:inline-block;vertical-align:middle;cursor:pointer}
button::-moz-focus-inner,input::-moz-focus-inner{margin:0;padding:0;border:0;outline:0}
input:focus,select:focus,textarea:focus{border-color:#5079b7;-webkit-box-shadow:0 0 1px #5f90db,0 0 3px #5f90db,0 0 6px #5f90db;-moz-box-shadow:0 0 1px #5f90db,0 0 3px #5f90db,0 0 6px #5f90db;box-shadow:0 0 1px #5f90db,0 0 3px #5f90db,0 0 6px #5f90db}
button:focus,button:hover,input[type=button]:focus,input[type=button]:hover,input[type=reset]:focus,input[type=reset]:hover,input[type=submit]:focus,input[type=submit]:hover{background-color:#170513;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4);-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.4)}
button:active,input[type=button]:active,input[type=reset]:active,input[type=submit]:active{background-image:none;background-color:#980900;border-color:transparent;-webkit-box-shadow:inset 0 1px 2px rgba(0,0,0,.4);-moz-box-shadow:inset 0 1px 2px rgba(0,0,0,.4);box-shadow:inset 0 1px 2px rgba(0,0,0,.4)}
fieldset{margin:0 0 1em;padding:1em;border:1px solid #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
legend{margin:0;padding:0 10px;font-weight:700}
button[disabled],input[disabled],select[disabled],textarea[disabled]{opacity:.7;cursor:not-allowed;background-image:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important;box-shadow:none!important}
input[disabled],select[disabled],textarea[disabled]{background-color:#eee}
button[disabled],input[type=button][disabled],input[type=reset][disabled],input[type=submit][disabled]{background-color:#c40200!important}
input[type=date][readonly],input[type=date][readonly]:focus,input[type=email][readonly],input[type=email][readonly]:focus,input[type=number][readonly],input[type=number][readonly]:focus,input[type=tel][readonly],input[type=tel][readonly]:focus,input[type=text][readonly],input[type=text][readonly]:focus,input[type=url][readonly],input[type=url][readonly]:focus,textarea[readonly],textarea[readonly]:focus{background-color:#eee;cursor:default}
::-webkit-input-placeholder{color:#888}
:-ms-input-placeholder{color:#888}
::-moz-placeholder{color:#888}
:-moz-placeholder{color:#888}
:placeholder{color:#888}
:focus::-webkit-input-placeholder{color:#ccc}
:focus:-ms-input-placeholder{color:#ccc}
:focus::-moz-placeholder{color:#ccc}
:focus:-moz-placeholder{color:#ccc}
:focus:placeholder{color:#ccc}
input[type=range]{height:0;padding:2px 0}
img{max-width:100%;height:auto}
body{padding:0;font-size:18px;line-height:23px}
.brick ol{margin:0 0 10px 20px}
li::marker{margin-left:10px}
li{margin:0 0 4px}
#movieBrick,.brick>div#movieBrick{max-width:500px;margin:10px;padding:10px;border:1px solid rgba(255,200,0,.6);border-radius:10px;background:url(img/filmstrip-bg.png)top right no-repeat,radial-gradient(circle at 20% 30%,rgba(255,200,0,.18),transparent 45%),radial-gradient(circle at 80% 20%,rgba(255,255,255,.06),transparent 50%),linear-gradient(180deg,#0b141a 0,#05090c 100%);background-size:auto,auto,auto,contain;color:#fff;box-shadow:0 12px 28px rgba(0,0,0,.45);font-family:Arial,Helvetica,sans-serif;box-sizing:border-box}
.movieButtons{display:block;position:relative}
#movieHeader{display:block;padding:4px 2px 12px;font-size:0}
#movieHeader h2,#movieHeader img{display:inline-block;vertical-align:middle}
#movieHeader img{width:45px;height:45px;margin-right:10px}
#movieHeader h2{max-width:calc(100% - 60px);margin:0;color:#fff;font-size:21px;line-height:1.1;font-weight:900;text-transform:uppercase}
#movieHeader h2 span{display:block;margin-top:4px;color:#ffd21a;font-size:14px}
#topmovies ol{margin:0;padding:0;list-style:none;border:1px solid rgba(255,255,255,.14);border-radius:8px;overflow:hidden;background:rgba(0,0,0,.35)}
#topmovies li{position:relative;min-height:67px;margin:0;padding:5px 2px 5px 57px;border-bottom:1px solid rgba(255,255,255,.15);background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.01));color:#fff;font-size:17px;font-weight:800;box-sizing:border-box}
#musicBrick #topmusic li:last-child,#topmovies li:last-child{border-bottom:0}
#topmovies li:before{content:counter(list-item);left:0;top:0;width:48px;height:100%;background:rgba(255,255,255,.05);color:#cfd2d4;font-size:22px;line-height:67px;text-align:center}
#topmovies .movieTitle{display:block;padding:0 .5rem .5rem 0;line-height:1.25}
#topmovies li strong{position:absolute;bottom:0;right:2px;display:block;white-space:nowrap}
#firstMovie,#topmovies li a{line-height:1;text-align:center;box-sizing:border-box}
#topmovies li a{display:inline-block;max-width:86px;margin-right:8px;padding:7px 8px;border-radius:5px;opacity:.95;color:#fff;font-size:13px;font-weight:800;text-decoration:none!important;vertical-align:middle}
#topmovies li strong a{margin:0 8px 0 0}
#topmovies li a:hover{opacity:1}
a.trailerLink{position:relative;display:inline-block;padding:6px 8px!important;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);color:#e5e5e5!important}
.trailerLink>span{display:inline-block;width:0;height:0;margin-right:6px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid #fff;vertical-align:-1px}
.movieButtons>a:hover{background:#d93016;color:#fff!important}
a.tmdblink{background:#052338;color:#20d8ff!important;border:1px solid rgba(120,190,230,.4)}
a.tomatolink{position:relative;width:28px;height:28px;padding:0!important;border-radius:50%!important;background:#e43216;color:#fff!important;line-height:28px!important;text-align:center}
a.tomatolink::before{content:"";position:absolute;top:-5px;left:12px;width:13px;height:7px;background:#18a755;border-radius:50% 50%0 50%;transform:rotate(22deg)}
a.imdblink{background:#f5c518;color:#111!important}
#topmovies li.featuredMovie{min-height:188px;padding:14px 5px 14px 165px;border:2px solid #e0b300;border-radius:7px;background:radial-gradient(circle at 50% 50%,rgba(245,197,24,.16),rgba(0,0,0,.1) 45%,rgba(0,0,0,.55))}
#musicBrick #musicWavesTopRight #playButton,#topmovies li.featuredMovie:before{display:none}
#firstMovie,#musicBrick:before,#topmovies li:before{position:absolute;display:block;font-weight:900}
#firstMovie{left:0;top:0;width:48px;height:100%;padding-top:64px;background:linear-gradient(180deg,rgba(245,197,24,.35),rgba(245,197,24,.08));color:#ffd21a;font-size:30px}
#firstMovie img{display:block;width:18px;height:auto;margin:8px auto 0}
.moviePoster{position:absolute;left:58px;top:18px;width:100px;height:140px;object-fit:cover;border-radius:6px}
.featuredInfo,.moviePoster{display:block}
.featuredMovie .movieTitle{display:block;padding:0 0 14px;font-size:22px;line-height:1.1}
#movieDescription{display:block;margin-bottom:10px;color:#bfc4c7;font-size:14px;line-height:1.4;font-weight:400}
@media (max-width:420px){#movieHeader h2{font-size:20px}
#topmovies li{padding:12px 10px 50px 52px}
#topmovies li strong{position:relative;right:auto;bottom:auto;display:block;margin-top:8px}
#topmovies li.featuredMovie{padding:14px 10px 60px 110px}
.featuredMovie strong{right:auto!important;bottom:auto!important}
}
#sign{width:124px;height:124px;float:right;border-radius:70px;border:2px solid #472e00;margin:0 0 10px 50px;background:url(img/signs.png)no-repeat 0 0}
#sign.gemini{background-position:0 0}
#sign.leo{background-position:-165px 0}
#sign.virgo{background-position:-332px 0}
#sign.libra{background-position:0-167px}
#sign.scorpio{background-position:-165px -167px}
#sign.sagittarius{background-position:-332px -167px}
#sign.capricorn{background-position:0-334px}
#sign.aquarius{background-position:-165px -334px}
#sign.pisces{background-position:-332px -334px}
#sign.aries{background-position:0-500px}
#sign.taurus{background-position:-165px -500px}
#sign.cancer{background-position:-332px -500px}
.enterDate{font-size:.8em;color:#8a5a18;display:none}
#musicPlayer iframe,.home .enterDate{display:inline-block}
.home #yearInput.yearInputSet{border:2px solid #123e73;box-shadow:2px 2px 0#a8c1df inset;border-radius:12px}
#musicBrick{position:relative;overflow:hidden;max-width:500px;margin:20px auto;padding:26px 0 24px;border-radius:22px;background:linear-gradient(135deg,#01081d 0,#030d3c 52%,#000a28 100%);box-shadow:0 14px 34px rgba(0,0,0,.35);font-family:Arial,Helvetica,sans-serif;color:#fff}
#musicBrick,#musicBrick *{box-sizing:border-box}
#musicBrick:before{content:"★";top:24px;left:20px;width:46px;height:46px;border-radius:50%;text-align:center;line-height:46px;background:linear-gradient(135deg,#8f43ff,#d94ce8);color:#fff;font-size:26px;box-shadow:0 8px 20px rgba(159,72,255,.35)}
#musicBrick h2{margin:0 20px 22px;padding:2px 145px 0 60px;font-size:28px;line-height:1.02;font-weight:900;letter-spacing:-.8px;color:#fff}
#musicBrick #musicMonthNav{display:block;overflow:hidden;margin:18px 10px 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
#musicBrick #musicMonthNav a{width:auto;line-height:40px;padding:0 16px;border-radius:13px;display:inline-block;background:linear-gradient(135deg,rgba(101,44,177,.58),rgba(118,45,160,.42));color:#fff;font-size:14px;font-weight:900;text-decoration:none;letter-spacing:-.2px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);transition:transform .22s ease,background .22s ease,box-shadow .22s ease}
#musicBrick #musicMonthNav a span{display:inline-block;vertical-align:middle;margin:0 2px;font-size:22px;line-height:1;color:#ff72d2;font-weight:900;text-shadow:0 0 12px rgba(255,114,210,.4);transform:translateY(-4px)}
#musicBrick #musicMonthNav a:hover{transform:translateY(-2px);background:linear-gradient(135deg,#6d2cd2,#e045b6);box-shadow:0 10px 24px rgba(127,45,210,.28),inset 0 0 0 1px rgba(255,255,255,.18)}
#musicBrick #musicMonthNav a:hover span,#musicBrick #topmusic li.active strong{color:#fff}
#musicBrick #musicMonthNav .prevMonth{float:left;margin-left:0}
#musicBrick #musicMonthNav .nextMonth{float:right;margin-right:0}
@media (max-width:430px){#musicBrick #musicMonthNav{margin:14px 6px 0;padding-top:14px}
#musicBrick #musicMonthNav a{line-height:38px;padding:0 12px;border-radius:12px;font-size:12px}
#musicBrick #musicMonthNav a span{font-size:20px}
}
#musicBrick #wrapMusicPlayer{position:relative}
#musicBrick h2 span{display:block;margin-top:6px;font-size:17px;font-weight:900;color:#c84cff}
#musicBrick #musicWavesTopRight{position:absolute;top:30px;right:74px;display:block;font-size:0;white-space:nowrap;height:42px;line-height:42px}
#zeneNagyitGomb{position:absolute;top:28px;right:18px;z-index:6;width:40px;height:40px;padding:0;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:rgba(255,255,255,.08);color:#e9d8ff;cursor:pointer;transition:background .22s ease,transform .22s ease,border-color .22s ease}
#zeneNagyitGomb.zeneRazkodik,#zeneNagyitGomb:hover{background:linear-gradient(135deg,#6d2cd2,#e045b6);border-color:rgba(255,255,255,.5);color:#fff}
#zeneNagyitGomb:hover{transform:scale(1.08)}
#zeneNagyitGomb svg{display:block;width:22px;height:22px;margin:0 auto;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
#musicBrick.zeneNagy #zeneNagyitGomb .zeneIkonNyit,#zeneNagyitGomb .zeneIkonZar{display:none}
#musicBrick.zeneNagy #zeneNagyitGomb .zeneIkonZar{display:block}
#musicBrick.zeneNagy{position:fixed;top:var(--zeneFelso,0px);right:0;bottom:0;left:0;z-index:9998;width:auto;max-width:760px;margin:0 auto;padding-bottom:48px;border-radius:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;box-shadow:0 0 60px rgba(0,0,0,.6)}
#musicBrick.zeneNagy #zeneNagyitGomb{position:fixed;top:calc(var(--zeneFelso,0px) + 14px);right:max(14px,calc(50% - 366px));z-index:10000;background:rgba(10,14,36,.72)}
#zeneNagyitGomb.zeneRazkodik{animation:zeneRazas 1s ease-in-out}
#zeneHatter,body.zeneZarolt{position:fixed;left:0;right:0}
#zeneHatter{top:var(--zeneFelso,0px);bottom:0;z-index:9997;background:rgba(6,10,26,.86);opacity:0;transition:opacity .2s ease}
#zeneHatter.zeneHatterNyit{opacity:1}
body.zeneZarolt{width:100%;overflow:hidden}
#musicBrick #musicWavesTopRight .bar{display:inline-block;vertical-align:bottom;width:4px;border-radius:7px;background:linear-gradient(180deg,#7b48ef,#eb4db8)}
#musicBrick #musicWavesTopRight .bar+.bar{margin-left:5px}
#musicBrick #musicWavesTopRight .bar:nth-child(1){height:18px}
#musicBrick #musicWavesTopRight .bar:nth-child(2){height:26px}
#musicBrick #musicWavesTopRight .bar:nth-child(3){height:14px}
#musicBrick #musicWavesTopRight .bar:nth-child(4){height:28px}
#musicBrick #musicWavesTopRight .bar:nth-child(5){height:34px}
#musicBrick #musicWavesTopRight .bar:nth-child(6){height:42px}
#musicBrick #musicWavesTopRight .bar:nth-child(7){height:32px}
#musicBrick #musicWavesTopRight .bar:nth-child(8){height:20px}
#musicBrick #musicPlayer{display:block;margin:0 0 18px;text-align:center}
#musicBrick #borderedMusicSection{position:relative;cursor:pointer;overflow:hidden;min-height:245px;margin:0 20px;padding:25px 22px 65px;border:2px solid rgba(243,145,255,.7);border-radius:18px;background:radial-gradient(circle at 84% 16%,rgba(255,123,189,.45),transparent 30%),linear-gradient(135deg,#5b27b2 0,#7f1da7 45%,#f04892 100%);box-shadow:inset 0 0 40px rgba(255,255,255,.08)}
#musicBrick #borderedMusicSection:hover .playButtonOnImg{opacity:.9}
#musicBrick #borderedMusicSection:hover strong{text-shadow:2px 2px 4px #000}
#musicBrick #fadedNumberRight{position:absolute;right:-4px;top:-28px;font-size:112px;line-height:.85;font-weight:900;color:rgba(255,255,255,.1);letter-spacing:-6px;pointer-events:none}
#musicBrick .musicImg{position:relative;display:block;padding-left:144px;min-height:128px}
#musicBrick .musicImg>div:first-of-type{position:absolute;left:0;top:50%;margin-top:-50px;width:120px;height:100px;box-shadow:0 10px 22px rgba(0,0,0,.3)}
#musicBrick .musicImg img{display:block;width:120px;height:124px;max-width:none;object-fit:cover;border-radius:10px}
#musicBrick .playButtonOnImg{opacity:.7;position:absolute;left:50%;top:50%;margin:-40px 0 0-40px;z-index:5;width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#8c44ff,#bc40ef);box-shadow:0 8px 18px rgba(0,0,0,.58)}
#musicBrick .playButtonOnImg:before{content:"";position:absolute;top:21px;left:29px;border-top:19px solid transparent;border-bottom:19px solid transparent;border-left:27px solid #fff}
#musicBrick .nowPlaying{display:block;margin:25px 0 14px;font-size:14px;font-weight:900;letter-spacing:.3px;color:rgba(255,255,255,.7)}
#musicBrick #no1TitleArtist{margin:0;font-size:21px;line-height:1.18;font-weight:400;text-align:right;color:rgba(255,255,255,.82)}
#musicBrick #no1TitleArtist strong{display:block;margin:0 0 16px;font-size:30px;line-height:1.14;font-weight:900;letter-spacing:-1px;color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.08)}
#musicBrick #musicWaves{display:block;font-size:0;white-space:nowrap;height:80px;line-height:80px;position:absolute;bottom:5px;right:5px}
#musicBrick #musicWaves .bar{display:inline-block;vertical-align:bottom;width:4px;border-radius:7px;background:linear-gradient(180deg,#d36cff,#ff58c2);transform-origin:bottom center;animation:musicBrickBars 2.8s ease-in-out infinite}
#musicBrick #musicWaves .bar+.bar{margin-left:5px}
#musicBrick #musicWaves .bar:nth-child(1){height:28px;animation-delay:-.1s}
#musicBrick #musicWaves .bar:nth-child(2){height:52px;animation-delay:-.35s}
#musicBrick #musicWaves .bar:nth-child(3){height:76px;animation-delay:-.7s}
#musicBrick #musicWaves .bar:nth-child(4){height:44px;animation-delay:-1.05s}
#musicBrick #musicWaves .bar:nth-child(5){height:60px;animation-delay:-1.4s}
#musicBrick #musicWaves .bar:nth-child(6){height:36px;animation-delay:-1.75s}
#musicBrick #musicWaves .bar:nth-child(7){height:68px;animation-delay:-2.1s}
#musicBrick #musicWaves .bar:nth-child(8){height:44px;animation-delay:-2.45s}
#musicBrick #musicWaves .bar:nth-child(9){height:72px;opacity:.95;animation-delay:-2.8s}
#musicBrick #musicWaves .bar:nth-child(10){height:62px;opacity:.9;animation-delay:-3.15s}
#musicBrick #musicWaves .bar:nth-child(11){height:54px;opacity:.82;animation-delay:-3.5s}
#musicBrick #musicWaves .bar:nth-child(12){height:42px;opacity:.72;animation-delay:-3.85s}
#musicBrick #musicWaves .bar:nth-child(13){height:36px;opacity:.62;animation-delay:-4.2s}
#musicBrick #musicWaves .bar:nth-child(14){height:30px;opacity:.52;animation-delay:-4.55s}
#musicBrick #musicWaves .bar:nth-child(15){height:26px;opacity:.44;animation-delay:-4.9s}
#musicBrick #musicWaves .bar:nth-child(16){height:22px;opacity:.36;animation-delay:-5.25s}
#musicBrick #musicWaves .bar:nth-child(17){height:18px;opacity:.3;animation-delay:-5.6s}
#musicBrick #topmusic ol{list-style:none;margin:0;padding:0}
#musicBrick #topmusic li{cursor:pointer;position:relative;display:block;min-height:54px;margin:0;padding:12px 40px 12px 66px;border-bottom:1px solid rgba(255,255,255,.12);font-size:16px;line-height:1.2;color:rgba(255,255,255,.72);transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease,border-color .25s ease}
#musicBrick #topmusic li strong{margin-right:4px;font-size:17px;font-weight:900;letter-spacing:-.3px;color:#fff}
#musicBrick .musicCounter{position:absolute;left:20px;top:50%;width:34px;height:34px;margin-top:-17px;border-radius:50%;display:block;text-align:center;line-height:34px;background:#13215c;color:#fff;font-size:17px;font-weight:900}
#musicBrick #topmusic li:nth-child(1) .musicCounter{background:linear-gradient(135deg,#652cb1,#8e44e9)}
#musicBrick .openThisSong,#musicBrick .playThisSong{position:absolute;top:50%;width:26px;height:26px;display:block;text-align:center;line-height:26px;text-decoration:none}
#musicBrick .playThisSong{transform:translateY(-50%);font-size:28px;color:#9752ff;cursor:pointer}
#musicBrick .openThisSong{right:42px;transform:translateY(-50%) scale(.82);border-radius:50%;background:rgba(151,82,255,.13);color:#9d63ff;font-size:17px;font-weight:900;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease,background .22s ease,color .22s ease,box-shadow .22s ease}
#musicBrick #topmusic li.active .openThisSong,#musicBrick #topmusic li:hover .openThisSong{opacity:1;pointer-events:auto;transform:translateY(-50%) scale(1)}
#musicBrick #topmusic li:hover .openThisSong{background:rgba(255,114,210,.15);color:#ff72d2;box-shadow:0 0 14px rgba(255,114,210,.28)}
#musicBrick #topmusic li.active .openThisSong{background:rgba(255,255,255,.16);color:#fff;box-shadow:0 0 16px rgba(255,255,255,.25)}
#musicBrick .openThisSong:hover{background:#fff!important;color:#7b35d8!important;box-shadow:0 0 18px rgba(255,255,255,.4)!important}
#musicBrick .playThisSong{right:8px}
#musicBrick #topmusic li:hover{background:linear-gradient(90deg,rgba(94,43,177,.35),rgba(220,68,186,.18));color:#fff;transform:translateX(4px);border-bottom-color:rgba(216,92,255,.38);box-shadow:inset 3px 0 0#b85cff}
#musicBrick #topmusic li:hover .musicCounter{background:linear-gradient(135deg,#7b35d8,#e04bd1);box-shadow:0 0 16px rgba(190,84,255,.45)}
#musicBrick #topmusic li:hover .playThisSong{color:#ff72d2;text-shadow:0 0 14px rgba(255,114,210,.55);transform:translateY(-50%) scale(1.12)}
#musicBrick #topmusic li.active{background:linear-gradient(90deg,#6d2cd2 0,#e045b6 100%);color:#fff;border-bottom-color:transparent;box-shadow:0 10px 26px rgba(127,45,210,.28),inset 4px 0 0#fff;transform:translateX(0)}
#musicBrick #topmusic li.active .musicCounter{background:#fff;color:#6d2cd2;box-shadow:0 0 18px rgba(255,255,255,.28)}
#musicBrick #topmusic li.active .playThisSong{color:#fff;text-shadow:0 0 16px rgba(255,255,255,.55);transform:translateY(-50%) scale(1.15)}
#musicBrick #topmusic li.active:hover{transform:translateX(4px);box-shadow:0 12px 30px rgba(224,69,182,.34),inset 4px 0 0#fff}
@media (max-width:430px){#musicBrick{padding:22px 14px 20px;border-radius:20px}
#musicBrick:before{top:22px;left:14px;width:42px;height:42px;font-size:24px}
#musicBrick h2{padding:0 98px 0 52px;font-size:22px;color:#fff}
#musicBrick h2 span{font-size:14px}
#musicBrick #musicWavesTopRight{display:none}
#zeneNagyitGomb{top:22px;right:14px;width:42px;height:42px}
#musicBrick.zeneNagy #zeneNagyitGomb{top:calc(var(--zeneFelso,0px) + 10px);right:10px}
#musicBrick #borderedMusicSection{padding:16px 16px 14px}
#musicBrick .musicImg{padding-left:134px;min-height:110px}
#musicBrick .musicImg>div:first-of-type{width:120px;height:100px;border-radius:14px}
#musicBrick .musicImg img{width:120px!important;height:100px!important;max-width:none}
#musicBrick .playButtonOnImg{width:36px;height:36px;margin:-18px 0 0-18px}
#musicBrick .playButtonOnImg:before{top:10px;left:14px;border-top-width:8px;border-bottom-width:8px;border-left-width:11px}
#musicBrick .nowPlaying{margin-bottom:8px;font-size:11px}
#musicBrick #no1TitleArtist,#musicBrick #topmusic li strong{font-size:14px}
#musicBrick #no1TitleArtist strong{margin-bottom:6px;font-size:22px}
#musicBrick #fadedNumberRight{font-size:70px;top:8px}
#musicBrick #musicWaves{margin:12px 0 0 134px;height:34px;line-height:34px}
#musicBrick #musicWaves .bar{width:3px}
#musicBrick #musicWaves .bar+.bar{margin-left:3px}
#musicBrick #topmusic li{min-height:50px;padding:10px 34px 10px 46px;font-size:13px}
#musicBrick .musicCounter{left:4px;width:30px;height:30px;margin-top:-15px;font-size:15px}
#musicBrick .playThisSong{right:4px;font-size:24px}
}
@media (prefers-reduced-motion:reduce){#zeneHatter,#zeneNagyitGomb{transition:none}
#zeneNagyitGomb:hover{transform:none}
#musicBrick #musicWaves .bar,#zeneNagyitGomb.zeneRazkodik{animation:none}
}
.brick>div.newsPaperWrap{max-width:500px;border-radius:0;min-width:300px;margin:10px;padding:10px;background:#ede8dc;border:1px solid #c5b8a0;box-shadow:0 8px 24px rgba(0,0,0,.18),inset 0 0 0 1px rgba(255,255,255,.35);font-family:Georgia,"Times New Roman",serif;color:#000;position:relative;overflow:hidden}
.newsPaperWrap:after,.newsPaperWrap:before{content:"";position:absolute;inset:0;pointer-events:none}
.newsPaperWrap:before{background:radial-gradient(circle at 20% 30%,rgba(120,90,40,.08)0,transparent 60%),radial-gradient(circle at 80% 70%,rgba(100,70,30,.06)0,transparent 65%),radial-gradient(circle at 50% 50%,rgba(80,60,30,.05)0,transparent 70%),linear-gradient(120deg,rgba(255,255,255,.08),rgba(200,180,120,.06),rgba(0,0,0,.04)),repeating-linear-gradient(0deg,rgba(80,60,30,.025)0,rgba(80,60,30,.025) 1px,transparent 1px,transparent 3px),repeating-linear-gradient(90deg,rgba(80,60,30,.015)0,rgba(80,60,30,.015) 1px,transparent 1px,transparent 4px)}
.newsPaperWrap:after{background:radial-gradient(circle at 20% 15%,rgba(255,255,255,.12),transparent 18%),radial-gradient(circle at 80% 65%,rgba(0,0,0,.045),transparent 22%);mix-blend-mode:multiply}
.newsPaperWrap>*{position:relative;z-index:1}
#newsHeader{text-align:center;padding:10px 4px 0;margin:0 0 14px}
#newsHeader .newsMeta{display:block;position:relative;margin:0 0 16px;font-size:11px;letter-spacing:.34em;text-transform:uppercase;opacity:.86}
#newsHeader .newsMeta span:first-child{position:absolute;left:0;top:50%;transform:translateY(-50%);text-align:left}
#newsHeader .newsMeta span:nth-child(2){display:block;text-align:center}
#newsHeader .newsMeta span:last-child{position:absolute;right:0;top:50%;transform:translateY(-50%);text-align:right}
#newsHeader h2{margin:0;font-size:50px;line-height:.92;font-weight:700;color:#242424;letter-spacing:-.04em;text-align:center}
#newsHeader .newsTagline{display:block;margin:8px 0 14px;font-size:14px;font-style:italic;opacity:.8}
#newsHeader .newsRule{height:0;border-top:2px solid #3c3329;margin:0 0 10px}
#newsHeader .newsSubMeta{display:block;position:relative;font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px}
#newsHeader .newsSubMeta .newsDate{position:absolute;left:0;top:50%;transform:translateY(-50%);text-align:left}
#newsHeader .newsSubMeta .newsStars{display:block;text-align:center;letter-spacing:.4em}
#newsHeader .newsSubMeta .newsPrice{position:absolute;right:0;top:50%;transform:translateY(-50%);text-align:right}
#newsHeader .newsDoubleRule{height:6px;border-top:2px solid #3c3329;margin:0 0 8px}
#news,#news li{position:relative}
#news ol,#notableEvents{margin:0;list-style:none;display:block}
#news ol{padding:0}
#news ol li+li{margin-top:10px}
#news li{display:block;min-height:98px;padding:10px;background:linear-gradient(to bottom,rgba(255,255,255,.22),rgba(255,255,255,.12));box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
#news li:before,#notableEvents::before{content:"";position:absolute;left:101px;right:10px;top:41px}
/* The same bar the map's timeline is scrubbed with, and the same gradient in
   the same direction: sepia at the far end of the past, navy at today and
   beyond. The two panels sit one above the other on the page, so they may as
   well be reading from the same line. */
#notableEvents::before{left:0;right:0;top:50%;height:7px;transform:translateY(-50%);border-radius:4px;background:linear-gradient(90deg,#b58c50 0,#8a6a53 38%,#2a5b96 78%,#123e73 100%);box-shadow:0 1px 3px rgba(18,62,115,.3);opacity:1;z-index:0}
#news li:after{content:"";position:absolute;left:7px;right:7px;bottom:-6px;height:8px;background:linear-gradient(to bottom,rgba(0,0,0,.08),transparent);opacity:.22;pointer-events:none}
.np-thumb{position:absolute;left:10px;top:10px;width:82px;height:78px;display:block;text-align:center;line-height:78px;overflow:hidden;background:linear-gradient(135deg,rgba(0,0,0,.08),rgba(255,255,255,.22)),linear-gradient(to bottom,#d8ccb3,#c9bb9d);border:1px solid rgba(60,50,35,.35);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 1px 2px rgba(0,0,0,.12)}
.np-thumb:after,.np-thumb:before{content:"";position:absolute;inset:0;mix-blend-mode:multiply;pointer-events:none}
.np-thumb:before{background:radial-gradient(rgba(50,35,18,.18) .7px,transparent .9px);background-size:4px 4px;opacity:.22}
.np-thumb:after{background:linear-gradient(115deg,rgba(255,255,255,.18)0 28%,transparent 28% 72%,rgba(0,0,0,.08) 72% 100%),rgba(118,87,42,.42)}
.np-emoji{position:relative;z-index:1;display:inline-block;vertical-align:middle;font-size:43px;line-height:1;transform:scale(1.08);filter:grayscale(100%) contrast(130%) brightness(.88);text-shadow:0 0 1px rgba(0,0,0,.45),0 1px 1px rgba(0,0,0,.18)}
.np-text{margin-left:93px}
.np-title{display:block;text-transform:uppercase;font-weight:700;font-size:17px;line-height:1.02;letter-spacing:.02em;margin:1px 0 6px;text-wrap:balance}
.np-body{display:block;font-size:13px;line-height:1.28;color:#3a3127}
.np-footer{margin-top:12px;padding-top:8px;border-top:1px solid rgba(60,50,35,.35);font-size:11px;text-align:center;letter-spacing:.14em;text-transform:uppercase;opacity:.8}
@media (max-width:420px){#newsHeader h2{font-size:48px}
}
@media (max-width:360px){.newsPaperWrap{padding:10px 10px 12px}
#newsHeader .newsMeta,#newsHeader .newsSubMeta{font-size:9px;letter-spacing:.12em}
#newsHeader h2{font-size:40px}
#newsHeader .newsTagline{font-size:12px}
#news li{min-height:80px;padding:8px}
#news li:before{left:86px;top:35px}
.np-thumb{left:8px;top:8px;width:68px;height:64px;line-height:64px}
.np-text{margin-left:76px}
.np-emoji{font-size:28px}
.np-title{font-size:15px}
.np-body{font-size:12px}
}
/* The auto margins are what centre the timeline on a screen wide enough to
   hold all of it: the track is never narrower than the viewport, so the list
   inside it has the spare width to share out. On a screen that has to scroll
   there is no spare width and they resolve to nothing, which is why this needs
   no breakpoint of its own. */
#notableEvents{padding:0 2vw;margin:0 auto;white-space:nowrap;font-size:0;position:relative;min-width:0;width:-webkit-max-content;width:max-content;overflow:visible;z-index:2}
.worldMapSection{width:100%;margin:24px 0 28px;padding:0;background:0 0}
.worldMapInner{max-width:1400px;margin:0 auto;padding:0 16px}
.worldMapHeader{text-align:center;padding:0 16px 12px}
.worldMapHeader h2{font-size:1.45em;line-height:1.2;color:#333;margin:0 0 4px}
.worldMapHint{margin:0;font-size:.85em;color:#666}
/* The map fits itself to whatever box it is given, so the height only has to be
   a sensible shape: near the map's own 2000x1140 on a wide screen, never so
   tall on a phone that the page turns into one long scroll past it. The height
   is set here rather than by the map, so the frame is already the right size
   before a byte of the map has been asked for and nothing moves when it lands. */
.worldMapFrame{position:relative;height:clamp(430px,54vw,760px);border:1px solid #ccd5e6;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 8px 22px rgba(38,63,111,.09)}
/* The panel is styled from the first byte of the page but stays folded away
   until it has something to show. Both states are set by initWorldMap(), at the
   end of this file's script: mapLive lets it measure a box that is actually
   laid out, mapReady lifts the placeholder off a finished map. The map's own
   rules are at the bottom of this stylesheet. */
#mapapp{display:none}
.mapLive #mapapp{display:block}
.worldMapPlaceholder{position:absolute;left:0;top:0;right:0;bottom:0;z-index:10;background:linear-gradient(#f7f9fc,#e7edf6);text-align:center;font-size:0}
/* the two spans ride the middle line, which this pseudo-element sets up */
.worldMapPlaceholder:before{content:"";display:inline-block;height:100%;vertical-align:middle}
.mapReady .worldMapPlaceholder{opacity:0;visibility:hidden;transition:opacity .35s ease,visibility 0s .35s}
.worldMapSpinner{display:inline-block;vertical-align:middle;width:19px;height:19px;margin-right:11px;border:2px solid rgba(18,62,115,.18);border-top-color:#123e73;border-radius:50%;animation:mapPorog .8s linear infinite}
.worldMapLoading{display:inline-block;vertical-align:middle;font-family:Consolas,Monaco,monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#63748c}
@keyframes mapPorog{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){
.worldMapSpinner{animation:none}
.mapReady .worldMapPlaceholder{transition:none}
}
@media (max-width:760px){
.worldMapInner{padding:0 8px}
.worldMapFrame{height:clamp(400px,118vw,560px)}
}
.notableTimelineSection{width:100%;margin:24px 0 28px;padding:0;background:0 0}
.notableTimelineHeader{text-align:center;padding:0 16px 12px}
.notableTimelineHeader h2{font-size:1.45em;line-height:1.2;color:#333;margin:0 0 4px}
.notableTimelineHint{margin:0;font-size:.85em;color:#666}
.timelineScrollWrap{position:relative}
.timelineViewport{position:relative;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x proximity;scrollbar-color:#123e73 #ddd;padding:38px 0 34px;-webkit-overflow-scrolling:touch}
.timelineViewport::-webkit-scrollbar{height:6px}
.timelineViewport::-webkit-scrollbar-track{background:#ddd;border-radius:999px}
.timelineViewport::-webkit-scrollbar-thumb{background:#123e73;border-radius:999px}
.timelineTrack{position:relative;min-height:108px;overflow:visible;width:max-content;min-width:100%}
.timelineAxis{display:none}
#notableEvents li{display:inline-block;vertical-align:top;width:104px;white-space:normal;font-size:13px;position:relative;padding:0;scroll-snap-align:center}
/*
  The cards are wider than the space between two dates, so every item after the
  first slides 35px back over the one before it.

  A negative margin rather than a relative offset, which is what this used to be
  - one nth-child rule per item, shifting it left by its index times 35. A
  relative offset moves an item without moving the line's end: each item still
  took its own full width in the flow, so the timeline stayed as wide as 30
  cards laid end to end and the scroll ran on into a screen or two of nothing
  after the last one. A negative margin takes the width back as well.
*/
#notableEvents li+li{margin-left:-35px}
/*
  Two rows of cards riding the one line, odd ones above it and even ones below,
  each pointing at its own dot with a full-width triangle hung off the edge
  nearest the line: a V under the cards above, a peak over the cards below.

  The triangle is a clipped pseudo-element sitting outside the card's own box,
  never a clip on the card itself, so the card stays a plain rectangle and
  nothing inside it has to dodge a slanted edge - the icon can still sit in a
  corner. background:inherit keeps the point the colour of the card it hangs
  off, the white ones and the navy selected-date one alike, and the shadow is a
  drop-shadow filter rather than a box-shadow so that it follows the card and
  its point as one silhouette instead of drawing a line across the join.

  Nothing here crops its text: no fixed heights, no line clamps, no ellipses.
  The cards are as tall as their own titles need, and fitTimelineHeight() in
  db.js measures the tallest of them and pads the scroller to fit - a box that
  scrolls sideways has to hide whatever overflows it vertically, so the room
  has to be made rather than found.
*/
#notableEvents .eventLink{display:block;height:108px;color:inherit;text-decoration:none;position:relative}
#notableEvents .eventCard{position:absolute;left:50%;transform:translateX(-50%);width:96px;max-width:none;background:#fff;padding:9px 9px 8px;cursor:pointer;z-index:2;filter:drop-shadow(0 2px 3px rgba(28,44,74,.16));transition:filter .15s ease}
/* Rounded on the three corners that are corners; square where the point takes
   over, which would otherwise leave a nick of daylight at each end of the V. */
#notableEvents li:nth-child(odd) .eventCard{bottom:calc(50% + 26px);border-radius:10px 10px 0 0}
#notableEvents li:nth-child(even) .eventCard{top:calc(50% + 26px);border-radius:0 0 10px 10px}
#notableEvents .eventCard::after{content:"";position:absolute;left:0;right:0;height:17px;background:inherit}
#notableEvents li:nth-child(odd) .eventCard::after{top:100%;-webkit-clip-path:polygon(0 0,100% 0,50% 100%);clip-path:polygon(0 0,100% 0,50% 100%)}
#notableEvents li:nth-child(even) .eventCard::after{bottom:100%;-webkit-clip-path:polygon(50% 0,100% 100%,0 100%);clip-path:polygon(50% 0,100% 100%,0 100%)}
/* Unclipped it would be a bare rectangle hanging off the card: better no point. */
@supports not (clip-path:polygon(0 0,100% 0,50% 100%)){
#notableEvents .eventCard::after{display:none}
}
#notableEvents .eventCard:hover,#notableEvents li.activeInfo .eventCard{filter:drop-shadow(0 4px 9px rgba(28,44,74,.26));z-index:25}
/* The dot the point aims at. 10px of colour inside a 3px white ring. */
#notableEvents .eventDot{position:absolute;left:50%;top:50%;margin:-8px 0 0 -8px;display:block;width:10px;height:10px;border-radius:50%;border:3px solid #fff;box-shadow:0 1px 3px rgba(18,62,115,.35);z-index:3}
/* The dots read off the line they sit on: sepia behind, navy ahead. */
#notableEvents li.pastEvent .eventDot{background:#633b03}
#notableEvents li.futureEvent .eventDot{background:#04264f}
#notableEvents li.sameDayEvent .eventDot,#notableEvents li.selectedDateEvent .eventDot{background:#123e73;box-shadow:0 1px 3px rgba(18,62,115,.35),0 0 0 4px rgba(18,62,115,.25)}
/* The card layout: the year alone on the top line in navy, the day under it in
   the sepia at the other end of the line, the icon in the corner beside them
   and the title below. padding-right keeps the date clear of the icon. */
#notableEvents .eventIcon{position:absolute;top:7px;right:8px;font-size:17px;line-height:1;z-index:2;pointer-events:none}
#notableEvents .eventDate{display:block;margin:0 0 5px;padding-right:19px}
#notableEvents .eventYear{display:block;font-size:15px;font-weight:800;line-height:1.05;letter-spacing:.01em;color:#123e73}
#notableEvents .eventMd{display:block;margin-top:2px;font-size:9.5px;font-weight:700;line-height:1.2;letter-spacing:.1em;text-transform:uppercase;color:#8a5a18}
#notableEvents .eventTitle{display:block;font-size:12px;font-weight:700;line-height:1.3;color:#1f2a3b}
#notableEvents .distanceLabel{display:inline-block;margin-top:6px;padding:2px 7px;border-radius:999px;font-size:9px;font-weight:700;line-height:1.4;background:#eef2f7;color:#334155}
#notableEvents li.pastEvent .distanceLabel{background:rgba(99,59,3,.1);color:#7a4a08}
#notableEvents li.futureEvent .distanceLabel{background:rgba(4,38,79,.1);color:#123e73}
/*
  The page's own date, in navy: either the bare card drawn for a date nothing
  happened on, or - having followed a card here - the event that is on it. Both
  need their own hover, because these selectors outrank the plain card's
  :hover and would otherwise freeze its shadow.
*/
#notableEvents li.selectedDateEvent .eventCard,#notableEvents li.sameDayEvent .eventCard{background:#123e73;filter:drop-shadow(0 2px 5px rgba(18,62,115,.4))}
#notableEvents li.selectedDateEvent .eventCard:hover,#notableEvents li.sameDayEvent .eventCard:hover,#notableEvents li.sameDayEvent.activeInfo .eventCard{filter:drop-shadow(0 4px 10px rgba(18,62,115,.5))}
#notableEvents li.selectedDateEvent .eventYear,#notableEvents li.sameDayEvent .eventYear{color:#fff}
#notableEvents li.selectedDateEvent .eventMd,#notableEvents li.sameDayEvent .eventMd{color:#bcd3ef}
/* An event card carries a title and a pill the bare one has no use for. */
#notableEvents li.sameDayEvent .eventTitle{color:#fff}
#notableEvents li.sameDayEvent .distanceLabel{background:rgba(255,255,255,.18);color:#eaf2fb}
/* The bare one: no icon to leave room for, and a label where a title would be. */
#notableEvents li.selectedDateEvent .eventDate{margin-bottom:3px;padding-right:0;text-align:center}
#notableEvents li.selectedDateEvent .eventYear{font-size:17px}
#notableEvents li.selectedDateEvent .eventTitle{color:#93b4dc;text-align:center;font-size:8.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
#notableEvents li.selectedDateEvent .eventLink{cursor:default}
/* Clears the point rather than starting right under the card's own edge. */
#notableEvents .infoBubble{position:absolute;left:50%;transform:translateX(-50%);width:min(200px,calc(100% + 24px));margin:0;padding:7px 8px;background:#fff;color:#444;border:1px solid rgba(0,0,0,.12);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.14);font-size:11px;line-height:1.35;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility .15s ease;z-index:30}
#notableEvents li:nth-child(odd) .infoBubble{top:calc(100% + 21px);bottom:auto}
#notableEvents li:nth-child(even) .infoBubble{bottom:calc(100% + 21px);top:auto}
#notableEvents .eventCard:hover .infoBubble,#notableEvents li.activeInfo .infoBubble{opacity:1;visibility:visible}
.timelineNav{display:block;text-align:center;margin-top:4px}
.timelineNav .timelineScrollBtn{display:inline-block;margin:0 5px}
.timelineScrollBtn{width:36px;height:36px;border:1px solid #ccc;border-radius:50%;background:#fff;color:#123e73;font-size:22px;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.timelineScrollBtn:hover{background:#f5f5f0;border-color:#123e73}
@media (max-width:600px){.notableTimelineHeader h2{font-size:1.2em}
#notableEvents li{width:96px}
#notableEvents .eventCard{width:88px}
#notableEvents .eventTitle{font-size:11px}
#notableEvents .infoBubble{width:160px;font-size:10px}
.timelineViewport{padding:34px 0 28px}
}
.aligncenter{text-align:center;clear:both}
#monthList li a span,.inlineBlock{display:inline-block;vertical-align:middle}
#fancyPicker{text-align:center;background:#fff;font-weight:700;font-size:20px;line-height:24px}
#monthList{text-align:left;display:inline-block;list-style:none;max-width:700px;margin:10px 5px 5px}
#monthList a{display:block;border-radius:5px;padding:3px}
#monthList li{display:inline-block;width:230px;margin-bottom:0}
#monthList li a span{width:40px;margin:6px 20px 6px 50px;height:39px;background:url(img/months.png)no-repeat 0 0}
#monthList li:nth-child(2) a span{background-position:0-43px;height:30px}
#monthList li:nth-child(3) a span{background-position:0-75px;height:32px}
#monthList li:nth-child(4) a span{background-position:0-112px;height:30px}
#monthList li:nth-child(5) a span{background-position:0-142px;height:34px}
#monthList li:nth-child(6) a span{background-position:0-181px;height:33px}
#monthList li:nth-child(7) a span{background-position:0-217px;height:32px}
#monthList li:nth-child(8) a span{background-position:0-255px;height:31px}
#monthList li:nth-child(9) a span{background-position:0-289px;height:30px}
#monthList li:nth-child(10) a span{background-position:0-324px;height:33px}
#monthList li:nth-child(11) a span{background-position:0-363px;height:34px}
#monthList li:nth-child(12) a span{background-position:0-401px;height:39px}
#dayWrapDropdown,#monthWrapDropdown{display:inline-block;position:relative}
#dayWrapDropdown{min-width:40px;text-align:left}
#dayHeaderDropdown,#monthHeaderDropdown{width:235px;position:absolute;left:-50px;top:37px;font-size:19px;line-height:25px;background:#fff;z-index:99;box-shadow:3px 3px 13px #000;border-radius:10px}
#monthHeaderDropdown #monthList li a span{margin:3px 25px}
#monthList a:hover{background:#e7e7de}
#dayWrapDropdown #dayHeaderDropdown{left:auto;width:300px;right:-50px}
#dayWrapDropdown>a{cursor:zoom-in}
#dayWrapDropdown .dayCalendarPicker{width:285px;padding:5px}
#dayWrapDropdown .dayCalendarPicker a,#dayWrapDropdown .dayCalendarPicker div{padding:2px;font-size:20px;width:26px}
#yearHomePicker{position:relative;display:block;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;font-size:0;margin:0 auto 40px;padding:2px 2px 8px}
#yearHomePicker *{box-sizing:border-box}
#yearHomePicker .decadeRow{display:block;width:-webkit-max-content;width:max-content;margin:0 auto;font-size:0;white-space:nowrap}
#yearHomePicker .decadeItem{position:relative;display:inline-block;vertical-align:top;white-space:normal;margin:0 10px 0 0;font-size:16px}
#yearHomePicker .decadeItem:last-child{margin-right:0}
#yearHomePicker .decadeToggle{display:block;width:100%;padding:0;overflow:hidden;border:1px solid #d8e0ea;border-radius:12px;background:#fff;color:#123e73;cursor:pointer;text-align:center;white-space:normal;font-size:22px;appearance:none;-webkit-appearance:none}
#yearHomePicker .decadeItem.activeDecade .decadeToggle,#yearHomePicker .decadeToggle:hover{background:#f4f7fb;border-color:#c7d5e5}
#yearHomePicker .decadeToggle span{display:block;width:140px;height:200px;margin:0 auto 5px;background:url(img/decades/decadepicker200.webp)no-repeat 0 0;background-size:1800px 200px}
#yearHomePicker .decadeToggle strong{display:block;font-weight:700;font-size:25px;padding:7px 1px;line-height:1}
#yearHomePicker .decadeItem:nth-child(2) .decadeToggle span{background-position:-150px 0}
#yearHomePicker .decadeItem:nth-child(3) .decadeToggle span{background-position:-300px 0}
#yearHomePicker .decadeItem:nth-child(4) .decadeToggle span{background-position:-450px 0}
#yearHomePicker .decadeItem:nth-child(5) .decadeToggle span{background-position:-600px 0}
#yearHomePicker .decadeItem:nth-child(6) .decadeToggle span{background-position:-750px 0}
#yearHomePicker .decadeItem:nth-child(7) .decadeToggle span{background-position:-900px 0}
#yearHomePicker .decadeItem:nth-child(8) .decadeToggle span{background-position:-1050px 0}
#yearHomePicker .decadeItem:nth-child(9) .decadeToggle span{background-position:-1200px 0}
#yearHomePicker .decadeItem:nth-child(10) .decadeToggle span{background-position:-1350px 0}
#yearHomePicker .decadeItem:nth-child(11) .decadeToggle span{background-position:-1500px 0}
#yearHomePicker .decadeItem:nth-child(12) .decadeToggle span{background-position:-1650px 0}
#yearHomePicker .years{position:absolute;top:0;left:0;right:0;bottom:0;z-index:100;display:none;padding:6px 4px;border:1px solid #c7d5e5;border-radius:12px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.25);overflow-y:auto;font-size:0}
#firstBrick h1 #friendlyName,#yearHomePicker .decadeItem.activeDecade .years{display:block}
#yearHomePicker .years a{display:block;padding:2px;border-radius:8px;color:#123e73;text-align:center;text-decoration:none;font-size:30px}
#yearHomePicker .years a:hover{background:#e7effa!important;color:#123e73!important}
#yearHomePicker .years a.active{background:#123e73;color:#fff}
#yearHomePicker .years a.future{background:#6dadd1;color:#fff}
@media (hover:hover){#yearHomePicker .decadeItem:hover .years{display:block}
}
.home .homeIcon{display:none}
.home #header{padding:20px 10px 10px}
.dayCalendarPicker{width:400px;padding:10px;margin:auto;text-align:left}
.dayCalendarPicker a,.dayCalendarPicker div{display:inline-block;padding:8px 0;border:2px solid #123e73;margin:3px;font-size:25px;line-height:20px;width:46px;text-align:center;border-radius:8px;color:#190916;background:#fff;opacity:.3}
.dayCalendarPicker div{border-color:transparent;background:0 0;padding:8px 0 0;opacity:1}
.dayCalendarPicker a.active{background:#123e73!important;border-color:#123e73!important;color:#fff!important;box-shadow:none!important;text-shadow:-1px -1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,1px 1px 1px #000}
.dayCalendarPicker a.hoverable{opacity:1}
.dayCalendarPicker a.hoverable:hover{box-shadow:2px 2px 5px #000 inset;border:2px solid #274969}
.dayCalendarPicker a:nth-child(13),.dayCalendarPicker a:nth-child(14),.dayCalendarPicker a:nth-child(20),.dayCalendarPicker a:nth-child(21),.dayCalendarPicker a:nth-child(27),.dayCalendarPicker a:nth-child(28),.dayCalendarPicker a:nth-child(34),.dayCalendarPicker a:nth-child(35){border-color:#160611;background:#416a8f;color:#fff}
#breadcrumb .crumbRow,#breadcrumb>div{vertical-align:middle;display:inline-block}
#breadcrumb .crumbRow{white-space:nowrap}
#breadcrumb .crumbRow #dayHeaderDropdown,#breadcrumb .crumbRow #monthHeaderDropdown,#breadcrumb .crumbRow .year-dropdown{white-space:normal}
#breadcrumb .inlineBlock{width:40px}
#breadcrumb .crumbStep{display:inline-block;vertical-align:middle;line-height:0;padding:6px;border-radius:4px;color:#123e73}
#breadcrumb .crumbStep svg{width:26px;height:26px;fill:none;display:block}
#breadcrumb .crumbStep:focus,#breadcrumb .crumbStep:hover{text-decoration:none;color:#0c52a6;background:rgba(12,82,166,.09)}
#breadcrumb .crumbStep:focus-visible{outline:2px solid #0c52a6;outline-offset:1px}
#breadcrumb .crumbPrev{margin:0 4px 0 8px}
#breadcrumb .crumbNext{margin:0 8px 0 16px}
svg{width:30px;height:30px;display:inline-block;fill:#123e73}
.navigation{display:none}
h1,h2,h3,h4{color:#71530c;margin:5px 0 10px;font-size:1.15em;line-height:1em}
p{margin:0 0 10px}
.clearboth{clear:both}
.clearfix:after{clear:both;content:" ";display:block;font-size:0;height:0;visibility:hidden}
.clearfix{display:block}
* html .clearfix{height:1%}
#breadcrumb,#header{text-align:center;font-weight:700}
#breadcrumb{padding:10px;min-height:45px}
#header a:hover,a,a:link,a:visited{text-decoration:none;color:#180512}
#breadcrumb,a,a:link,a:visited{color:#123e73}
a:hover{color:#0c52a6}
.textarea{font-family:monospace}
#header{position:relative;min-height:60px;font-size:2em;background:#fff;line-height:1em;box-shadow:0 0 8px #9d8279;box-sizing:border-box}
#headerLogo{position:absolute;top:12px;left:40px;z-index:50;line-height:0}
.home #headerLogo{top:25px}
#headerLogo img{display:block;width:auto;height:44px}
.grid{max-width:2000px;margin:20px auto}
.brick{width:500px;min-height:100px;text-align:left}
.brick>div{margin:10px;min-height:50px;border-radius:10px;padding:10px;background:#fff}
.brick.transparent>div{background:0 0}
#notableTimelineSection,#worldMapSection,#yearHomePicker,.brick,.countdownBand{scroll-margin-top:12px}
#notableTimelineSection.kiemelve,#worldMapSection.kiemelve,#yearHomePicker.kiemelve,.brick.kiemelve>div,.countdownBand.kiemelve{outline:3px solid transparent;outline-offset:3px;animation:teglaVillan 1.6s ease}
#logo{display:block;text-align:center;padding:15px 5px 2px}
.year-picker-container{position:relative;top:-3px;width:100px;display:inline-block;margin:0 5px}
#yearInput{width:100%;padding:8px;box-sizing:border-box;cursor:pointer}
#yearInput.yearInputSet{color:#123e73;font-size:36px;margin:0;padding:0;text-align:right;border:0;background:#291f1f00;box-shadow:none;font-weight:700;cursor:text;width:110px}
.year-dropdown{display:none;font-size:19px;line-height:25px;position:absolute;top:100%;left:0;width:335px;height:300px;overflow-y:auto;background-color:#fff;border:1px solid #ccc;box-shadow:0 4px 8px rgba(0,0,0,.1);z-index:1000}
.year-dropdown a{display:inline-block;cursor:pointer;padding:0 10px}
.year-dropdown a:hover{background-color:#f0f0f0}
@media screen and (max-width:2170px){.grid{max-width:2000px}
}
@media screen and (max-width:2030px){.grid{max-width:1500px}
}
@media screen and (max-width:1900px){#yearHomePicker .decadeToggle span{width:105px;height:150px;background-image:url(img/decades/decadepicker150.webp);background-size:1350px 150px}
#yearHomePicker .decadeToggle strong{font-size:20px}
#yearHomePicker .years a{font-size:24px}
#yearHomePicker .decadeItem:nth-child(2) .decadeToggle span{background-position:-112.5px 0}
#yearHomePicker .decadeItem:nth-child(3) .decadeToggle span{background-position:-225px 0}
#yearHomePicker .decadeItem:nth-child(4) .decadeToggle span{background-position:-337.5px 0}
#yearHomePicker .decadeItem:nth-child(5) .decadeToggle span{background-position:-450px 0}
#yearHomePicker .decadeItem:nth-child(6) .decadeToggle span{background-position:-562.5px 0}
#yearHomePicker .decadeItem:nth-child(7) .decadeToggle span{background-position:-675px 0}
#yearHomePicker .decadeItem:nth-child(8) .decadeToggle span{background-position:-787.5px 0}
#yearHomePicker .decadeItem:nth-child(9) .decadeToggle span{background-position:-900px 0}
#yearHomePicker .decadeItem:nth-child(10) .decadeToggle span{background-position:-1012.5px 0}
#yearHomePicker .decadeItem:nth-child(11) .decadeToggle span{background-position:-1125px 0}
#yearHomePicker .decadeItem:nth-child(12) .decadeToggle span{background-position:-1237.5px 0}
}
@media screen and (max-width:1520px){.grid{max-width:1020px}
#logo img{height:auto;width:200px}
}
@media screen and (max-width:1030px){#yearHomePicker .decadeToggle span{width:70px;height:100px;background-image:url(img/decades/decadepicker100.webp);background-size:900px 100px}
#yearHomePicker .decadeToggle strong{font-size:14px}
#yearHomePicker .years a{font-size:17px}
#yearHomePicker .decadeItem:nth-child(2) .decadeToggle span{background-position:-75px 0}
#yearHomePicker .decadeItem:nth-child(3) .decadeToggle span{background-position:-150px 0}
#yearHomePicker .decadeItem:nth-child(4) .decadeToggle span{background-position:-225px 0}
#yearHomePicker .decadeItem:nth-child(5) .decadeToggle span{background-position:-300px 0}
#yearHomePicker .decadeItem:nth-child(6) .decadeToggle span{background-position:-375px 0}
#yearHomePicker .decadeItem:nth-child(7) .decadeToggle span{background-position:-450px 0}
#yearHomePicker .decadeItem:nth-child(8) .decadeToggle span{background-position:-525px 0}
#yearHomePicker .decadeItem:nth-child(9) .decadeToggle span{background-position:-600px 0}
#yearHomePicker .decadeItem:nth-child(10) .decadeToggle span{background-position:-675px 0}
#yearHomePicker .decadeItem:nth-child(11) .decadeToggle span{background-position:-750px 0}
#yearHomePicker .decadeItem:nth-child(12) .decadeToggle span{background-position:-825px 0}
}
@media screen and (max-width:1020px){.grid{max-width:920px}
.brick{width:450px}
#movieDescription,.enterDate,.home .enterDate{display:none}
.featuredMovie .movieButtons{height:70px}
}
@media screen and (max-width:920px){.grid{max-width:800px}
.brick{width:400px}
#fancyPicker #monthList li a span{margin:6px 15px 6px 14px}
#fancyPicker #monthList li{width:180px}
#fancyPicker #monthList{max-width:555px}
#header{min-height:56px}
#headerLogo{top:10px;left:10px}
#headerLogo img{height:36px}
#breadcrumb{padding:10px 12px 10px 100px}
.home #breadcrumb{padding:10px 12px}
}
@media screen and (max-width:850px){#yearHomePicker{margin-bottom:20px}
}
@media screen and (max-width:820px){.grid{max-width:502px}
.brick{width:500px}
}
@media screen and (max-width:700px){.dayCalendarPicker{width:300px}
.dayCalendarPicker a,.dayCalendarPicker div{font-size:21px;line-height:15px;width:34px;margin:2px}
#header{font-size:1.5em}
.home #header{padding:55px 10px 10px}
#headerLogo{top:7px;left:7px}
#headerLogo img{height:34px}
#breadcrumb{padding:10px 12px 10px 88px;min-height:38px}
#breadcrumb .inlineBlock{width:34px}
#breadcrumb .crumbStep{padding:4px}
#breadcrumb .crumbStep svg{width:22px;height:22px}
#breadcrumb .crumbPrev{margin:0 2px 0 4px}
#breadcrumb .crumbNext{margin:0 4px 0 12px}
#yearInput.yearInputSet{font-size:28px;width:88px}
.year-dropdown{width:280px;max-width:86vw;left:50%;transform:translateX(-50%)}
}
@media screen and (max-width:520px){.brick,.grid{width:430px;max-width:100%}
#breadcrumb .crumbStep,.homeIcon{display:none}
}
@media screen and (max-width:430px){#header{font-size:1.15em}
#breadcrumb{padding:8px 8px 8px 74px}
#yearInput.yearInputSet{font-size:24px;width:76px}
.year-picker-container{top:-2px;width:90px;margin:0 2px}
}
#eventsBrick,.brick>div#eventsBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:24px 18px 16px;border:1px solid #ccd5e6;border-radius:16px;background:#fff;color:#414b63;font-family:Arial,Helvetica,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.08);box-sizing:border-box}
#eventsBrick *{box-sizing:border-box}
#eventsBrick:before{content:"";position:absolute;top:20px;left:14px;width:50px;height:50px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.5 5 H17.5 V19 H6.5 Z' fill='%23eaf1fa'/%3E%3Crect x='8.3' y='8.9' width='7.4' height='1.15' rx='.57' fill='%239fb4d6'/%3E%3Crect x='8.3' y='11.4' width='7.4' height='1.15' rx='.57' fill='%239fb4d6'/%3E%3Crect x='8.3' y='13.9' width='4.8' height='1.15' rx='.57' fill='%239fb4d6'/%3E%3Crect x='4' y='2.8' width='16' height='4.2' rx='2.1' fill='%239fb4d6'/%3E%3Ccircle cx='6.1' cy='4.9' r='1' fill='%23263f6f'/%3E%3Crect x='4' y='17' width='16' height='4.2' rx='2.1' fill='%23263f6f'/%3E%3Ccircle cx='17.9' cy='19.1' r='1' fill='%239fb4d6'/%3E%3C/svg%3E")center/contain no-repeat;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}
#eventsBrick:after{content:"HISTORY";position:absolute;top:26px;right:-36px;transform:rotate(38deg);padding:3px 42px;background:rgba(138,90,24,.1);color:rgba(138,90,24,.55);font-size:11px;font-weight:900;letter-spacing:.42em;pointer-events:none}
#eventsBrick h2{margin:0 0 18px;padding:4px 86px 0 58px;font-size:26px;line-height:1.05;font-weight:900;letter-spacing:-.6px;color:#1b2a49}
#eventsBrick h2 span{display:block;margin-top:5px;font-size:15px;font-weight:900;letter-spacing:0;color:#8a5a18}
#eventsBrick .eventsTimeline{list-style:none;position:relative;margin:0;padding:0}
#eventsBrick .eventsTimeline:before{content:"";position:absolute;top:16px;bottom:16px;left:29px;width:2px;background:linear-gradient(180deg,transparent,rgba(38,63,111,.3) 36px,rgba(38,63,111,.3) calc(100% - 36px),transparent)}
#eventsBrick .histEvent{position:relative;margin:0;padding:13px 54px 13px 74px;border-bottom:1px solid #e0e8f4;font-size:15px;line-height:1.45;color:#414b63;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
#eventsBrick #dateevents>p:last-child,#eventsBrick .histEvent:last-child{border-bottom:0}
#eventsBrick .histEvent:hover{background:linear-gradient(90deg,rgba(138,90,24,.08),rgba(38,63,111,.04) 70%);transform:translateX(4px);box-shadow:inset 3px 0 0#8a5a18}
#eventsBrick .histYear{position:absolute;left:2px;top:13px;z-index:1;display:block;width:56px;padding:7px 0 6px;border:1px solid #e4d5b0;border-radius:11px;text-align:center;font-size:15px;font-weight:900;letter-spacing:-.3px;color:#8a5a18;background:#faf4e4;box-shadow:0 2px 6px rgba(0,0,0,.06);text-decoration:none;transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
#eventsBrick a.histYear:hover,#yearBrick .yiEvents li.kiemelve strong,#yearBrick .yiEvents strong:hover{transform:scale(1.08);background:#f3e9d2;box-shadow:0 6px 14px rgba(138,90,24,.25)}
#eventsBrick .histText{min-width:0}
#eventsBrick .histText strong{color:#1b2a49;font-weight:800}
#eventsBrick .histText a:hover{color:#1b2a49}
#eventsBrick .histEmoji{position:absolute;right:0;top:50%;transform:translateY(-50%);width:46px;height:46px;display:block;text-align:center;border-radius:50%;border:1px solid #d5dfef;background:#f4f8fd;font-size:26px;line-height:44px;text-decoration:none;transition:transform .22s ease,background .22s ease,box-shadow .22s ease}
#eventsBrick .histEvent:hover .histEmoji,#yearBrick .yiEvents li:hover .yiIco{transform:translateY(-50%) scale(1.12);background:#e9f0fa}
#eventsBrick a.histEmoji:hover{transform:translateY(-50%) scale(1.22);background:#dde6f4;box-shadow:0 0 14px rgba(38,63,111,.25)}
#eventsBrick #dateevents>p{padding:10px 2px;border-bottom:1px solid #e0e8f4;font-size:15px;line-height:1.45;color:#414b63}
#eventsBrick #dateevents>p a,#eventsBrick .histText a{color:#263f6f}
@media (max-width:430px){#eventsBrick{padding:20px 12px 12px;border-radius:14px}
#eventsBrick:before{top:18px;left:8px;width:44px;height:44px}
#eventsBrick:after{display:none}
#eventsBrick h2{padding:2px 8px 0 52px;font-size:21px}
#eventsBrick h2 span{font-size:13px}
#eventsBrick .eventsTimeline:before{left:25px}
#eventsBrick .histEvent{padding:11px 44px 11px 62px;font-size:13.5px}
#eventsBrick .histYear{width:48px;font-size:13px;border-radius:9px;padding:6px 0 5px}
#eventsBrick .histEmoji{width:38px;height:38px;font-size:20px;line-height:36px}
}
#bornBrick,.brick>div#bornBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:24px 20px 18px;border:1px solid rgba(167,140,255,.3);border-radius:20px;background-image:radial-gradient(1px 1px at 28px 44px,rgba(255,255,255,.6),transparent 2px),radial-gradient(1px 1px at 130px 12px,rgba(255,255,255,.45),transparent 2px),radial-gradient(1.6px 1.6px at 82px 96px,rgba(240,201,108,.55),transparent 2.6px),radial-gradient(1px 1px at 190px 70px,rgba(255,255,255,.4),transparent 2px),radial-gradient(1px 1px at 54px 118px,rgba(200,180,255,.5),transparent 2px),radial-gradient(1.8px 1.8px at 246px 44px,rgba(255,255,255,.7),transparent 3px),radial-gradient(1px 1px at 158px 186px,rgba(255,255,255,.35),transparent 2px),radial-gradient(circle at 86% 10%,rgba(178,132,255,.2),transparent 42%),radial-gradient(circle at 8% 86%,rgba(108,72,224,.26),transparent 50%),radial-gradient(circle at 62% 66%,rgba(255,120,205,.09),transparent 44%),linear-gradient(165deg,#060213 0,#170e3d 46%,#010003 100%);background-repeat:repeat,repeat,repeat,repeat,repeat,repeat,repeat,no-repeat,no-repeat,no-repeat,no-repeat;background-size:210px 160px,210px 160px,240px 190px,240px 190px,170px 230px,300px 240px,190px 250px,auto,auto,auto,auto;color:#eae7f8;font-family:Arial,Helvetica,sans-serif;box-shadow:0 14px 34px rgba(0,0,0,.45),inset 0 0 70px rgba(88,56,180,.22);box-sizing:border-box}
#bornBrick *{box-sizing:border-box}
#bornBrick>*{position:relative;z-index:1}
#bornBrick:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;display:block;pointer-events:none;background-image:radial-gradient(2px 2px at 16% 27%,rgba(255,255,255,.95),transparent 3px),radial-gradient(2.4px 2.4px at 62% 6%,rgba(240,201,108,.9),transparent 3.4px),radial-gradient(2px 2px at 91% 45%,rgba(255,255,255,.85),transparent 3px),radial-gradient(2.2px 2.2px at 29% 87%,rgba(183,165,255,.9),transparent 3.2px),radial-gradient(1.8px 1.8px at 78% 92%,rgba(255,255,255,.8),transparent 2.8px);background-repeat:no-repeat;animation:csillagPislog 5.5s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){#bornBrick:after{animation:none;opacity:.75}
}
#bornBrick:before{content:"";position:absolute;top:20px;left:16px;z-index:2;display:block;width:48px;height:48px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.4 4.6l.55 1.55 1.55.55-1.55.55-.55 1.55-.55-1.55-1.55-.55 1.55-.55z' fill='%23f0c96c'/%3E%3Ccircle cx='4.4' cy='13.1' r='1.75' fill='%23f3c6a4'/%3E%3Ccircle cx='19.6' cy='13.1' r='1.75' fill='%23f3c6a4'/%3E%3Cellipse cx='12' cy='12.6' rx='7.4' ry='7' fill='%23ffdcc0'/%3E%3Cpath d='M10.7 5.5c.35-2.1 3.1-2 3.2-.05' fill='none' stroke='%23c9884a' stroke-width='1.35' stroke-linecap='round'/%3E%3Ccircle cx='9.4' cy='11.9' r='1.05' fill='%233a2b22'/%3E%3Ccircle cx='14.6' cy='11.9' r='1.05' fill='%233a2b22'/%3E%3Ccircle cx='9.05' cy='11.55' r='.34' fill='%23fff'/%3E%3Ccircle cx='14.25' cy='11.55' r='.34' fill='%23fff'/%3E%3Ccircle cx='7.5' cy='14.4' r='1.4' fill='%23ff9db0' opacity='.65'/%3E%3Ccircle cx='16.5' cy='14.4' r='1.4' fill='%23ff9db0' opacity='.65'/%3E%3Cpath d='M10.1 15.5c1.2 1.25 2.6 1.25 3.8 0' fill='none' stroke='%23c9714f' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E")center/44px 44px no-repeat;filter:drop-shadow(0 4px 8px rgba(0,0,0,.55)) drop-shadow(0 0 12px rgba(183,165,255,.35))}
#bornBrick h2{margin:0 0 16px;padding:6px 0 0 58px;font-size:26px;line-height:1.1;font-weight:900;letter-spacing:-.6px;color:#fff}
#bornBrick h2 .onDate{color:#f0c96c}
#bornBrick #sign{float:right;width:124px;height:124px;margin:6px 0 12px 16px;border-radius:50%;border:2px solid rgba(240,201,108,.85);background-color:#f3ecd9;box-shadow:0 0 26px rgba(240,201,108,.35),0 8px 20px rgba(0,0,0,.35)}
#bornBrick .ageHero{margin:6px 0 16px}
#bornBrick .ageBig{display:block;font-size:64px;line-height:.95;font-weight:900;letter-spacing:-2px;background:linear-gradient(135deg,#f6d98a,#e79b3c);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#f0c96c}
#bornBrick .ageUnit{display:block;margin-top:2px;font-size:14px;font-weight:900;letter-spacing:.22em;text-transform:uppercase;color:#b7a5ff}
#bornBrick .agePrecise{display:block;margin-top:8px;font-size:14px;line-height:1.4;font-style:italic;color:rgba(234,231,248,.72)}
#bornBrick .bornRow{display:block;overflow:hidden;margin:8px 0;padding:10px 14px;border-radius:12px;border:1px solid rgba(183,165,255,.22);background:rgba(255,255,255,.06);transition:background .25s ease,transform .25s ease,border-color .25s ease}
#bornBrick .bornRow:hover{background:rgba(183,165,255,.14);border-color:rgba(240,201,108,.45);transform:translateX(4px)}
#bornBrick .bornLabel{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(234,231,248,.81)}
#bornBrick .bornRow .bornLabel,#bornBrick .zodEmoji{display:inline-block;vertical-align:middle;line-height:32px}
#bornBrick .zodEmoji{text-align:center;width:32px;height:32px;margin-right:8px;border-radius:50%;border:1px solid rgba(240,201,108,.35);background:rgba(240,201,108,.12);font-size:18px;line-height:30px}
#bornBrick .bornRow strong{display:block;float:right;font-size:17px;line-height:32px;font-weight:900;color:#fff}
#bornBrick .bornGen{clear:both;display:block;margin:12px 0 4px;padding:10px;border-radius:14px;border:1px solid rgba(183,165,255,.22);background:rgba(255,255,255,.06);transition:background .25s ease,border-color .25s ease}
#bornBrick .bornGen:hover{background:rgba(183,165,255,.14);border-color:rgba(240,201,108,.45)}
#bornBrick .bornGen img{display:inline-block;vertical-align:middle;margin-right:14px;width:130px;height:72px;object-fit:cover;border-radius:10px;box-shadow:0 6px 16px rgba(0,0,0,.4)}
#bornBrick .bornGen>div{display:inline-block;vertical-align:middle;max-width:calc(100% - 150px)}
#bornBrick .bornGen strong{display:block;margin:2px 0;font-size:20px;font-weight:900;letter-spacing:-.4px;color:#fff}
#bornBrick .bornGen em{display:block;font-style:normal;font-size:13px;font-weight:700;color:#f0c96c}
@media (max-width:430px){#bornBrick{padding:20px 14px 12px;border-radius:18px}
#bornBrick:before{top:17px;left:11px;width:42px;height:42px;background-size:38px 38px}
#bornBrick h2{padding:2px 0 0 52px;font-size:21px}
#bornBrick #sign{margin:4px 0 10px 12px}
#bornBrick .ageBig{font-size:52px}
#bornBrick .bornRow{padding:9px 12px}
#bornBrick .bornRow strong{font-size:15px}
#bornBrick .bornGen img{width:104px;height:60px}
#bornBrick .bornGen>div{max-width:calc(100% - 124px)}
#bornBrick .bornGen strong{font-size:17px}
}
#personalitiesBrick,.brick>div#personalitiesBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:24px 18px 16px;border:1px solid #ccd5e6;border-radius:16px;background:#fff;color:#414b63;font-family:Arial,Helvetica,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.08);box-sizing:border-box}
#personalitiesBrick *{box-sizing:border-box}
#personalitiesBrick:before{content:"";position:absolute;top:18px;left:14px;width:50px;height:50px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 16.6h16l-1.3-8.4-4.4 3.3L12 4.3 9.7 11.5 5.3 8.2z' fill='%239fb4d6'/%3E%3Crect x='4' y='17.6' width='16' height='2.6' rx='1' fill='%23263f6f'/%3E%3Ccircle cx='4.6' cy='7.4' r='1.35' fill='%239fb4d6'/%3E%3Ccircle cx='12' cy='3.4' r='1.35' fill='%239fb4d6'/%3E%3Ccircle cx='19.4' cy='7.4' r='1.35' fill='%239fb4d6'/%3E%3Ccircle cx='8.9' cy='18.9' r='.8' fill='%239fb4d6'/%3E%3Ccircle cx='12' cy='18.9' r='.8' fill='%239fb4d6'/%3E%3Ccircle cx='15.1' cy='18.9' r='.8' fill='%239fb4d6'/%3E%3C/svg%3E")center/contain no-repeat;filter:drop-shadow(0 4px 8px rgba(0,0,0,.18))}
#personalitiesBrick:after{content:"LEADERS";position:absolute;top:26px;right:-36px;transform:rotate(38deg);padding:3px 42px;background:rgba(138,90,24,.1);color:rgba(138,90,24,.55);font-size:11px;font-weight:900;letter-spacing:.42em;pointer-events:none}
#firstBrick h1,#personalitiesBrick h2{font-weight:900;color:#1b2a49;margin:0 0 14px;padding:2px 0 0 60px;font-size:33px;line-height:1.06;letter-spacing:-1px}
#personalitiesBrick h2{margin:0 0 18px;padding:6px 86px 0 60px;font-size:26px;line-height:1.05;letter-spacing:-.6px}
#personalitiesBrick h2 .onDate,#yearBrick h2 span{display:block;margin-top:5px;font-size:15px;font-weight:900;letter-spacing:0;color:#8a5a18}
#personalitiesBrick .leaderLine{display:block;overflow:hidden;margin:8px 0;padding:9px 12px;border-radius:12px;border:1px solid #e0e8f4;background:#f6f9fd;transition:background .25s ease,transform .25s ease,border-color .25s ease}
#personalitiesBrick .leaderLine:hover{background:#faf4e4;border-color:#e4d5b0;transform:translateX(4px)}
#personalitiesBrick .leaderIcon{display:inline-block;vertical-align:middle;width:26px;height:26px;margin-right:10px;background:center/contain no-repeat;filter:drop-shadow(0 2px 4px rgba(0,0,0,.15))}
#personalitiesBrick .leaderLabel{display:inline-block;vertical-align:middle;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7d8699;line-height:26px}
#personalitiesBrick .leaderLine strong{display:block;float:right;max-width:56%;text-align:right;font-size:15px;line-height:1.4;padding-top:3px;font-weight:900;color:#1b2a49}
#aboutBrick #dateintro a,#personalitiesBrick .leaderLink{color:#8a5a18;text-decoration:none;transition:color .2s ease}
#eventsBrick .histText a,#firstBrick .repeatLine a{text-decoration:none;transition:color .2s ease}
#aboutBrick #dateintro a:hover,#personalitiesBrick .leaderLink:hover{color:#3b3222}
#personalitiesBrick .ico-usa{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2l2.7 6.3 6.8.5-5.2 4.5 1.6 6.7-5.9-3.7-5.9 3.7 1.6-6.7-5.2-4.5 6.8-.5z' fill='%239fb4d6'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-pope{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.6c3.5 2.3 5.7 5.9 5.7 10V17H6.3v-5.4c0-4.1 2.2-7.7 5.7-10z' fill='%239fb4d6'/%3E%3Crect x='11.2' y='5.4' width='1.6' height='7' fill='%23263f6f'/%3E%3Crect x='8.9' y='7.6' width='6.2' height='1.6' fill='%23263f6f'/%3E%3Crect x='6' y='18.2' width='12' height='2.6' rx='1' fill='%23263f6f'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-england{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 17h16l-1.3-8.2-4.3 3.2L12 4.8 9.6 12 5.3 8.8z' fill='%239fb4d6'/%3E%3Crect x='4' y='18' width='16' height='2.5' rx='1' fill='%23263f6f'/%3E%3Ccircle cx='4.6' cy='7.9' r='1.3' fill='%239fb4d6'/%3E%3Ccircle cx='12' cy='3.9' r='1.3' fill='%239fb4d6'/%3E%3Ccircle cx='19.4' cy='7.9' r='1.3' fill='%239fb4d6'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-france{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.8c1.7 2.3 2.5 4.2 2.5 6 0 1.7-.8 3.2-2.5 4.4-1.7-1.2-2.5-2.7-2.5-4.4 0-1.8.8-3.7 2.5-6z' fill='%239fb4d6'/%3E%3Cpath d='M7.7 8c-2.3.7-3.8 2.1-3.8 4.2 0 1.7 1 3 3 3.6-.5-1.1-.2-2.1.7-3.1.7-.9 1.7-1.5 2.9-1.7z' fill='%239fb4d6'/%3E%3Cpath d='M16.3 8c2.3.7 3.8 2.1 3.8 4.2 0 1.7-1 3-3 3.6.5-1.1.2-2.1-.7-3.1-.7-.9-1.7-1.5-2.9-1.7z' fill='%239fb4d6'/%3E%3Crect x='8.3' y='14.7' width='7.4' height='1.9' rx='.95' fill='%23263f6f'/%3E%3Cpath d='M12 16.9c1 1.5 1.5 3 1.5 4.5h-3c0-1.5.5-3 1.5-4.5z' fill='%239fb4d6'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-germany{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.8l7.2 2.1v8.2c0 4.7-3 8-7.2 9.8-4.2-1.8-7.2-5.1-7.2-9.8V3.9z' fill='%239fb4d6'/%3E%3Crect x='5.6' y='8.4' width='12.8' height='1.5' fill='%23263f6f'/%3E%3Crect x='5.6' y='12.4' width='12.8' height='1.5' fill='%23263f6f'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-china{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.6l6 4.2H6z' fill='%239fb4d6'/%3E%3Crect x='10.5' y='6' width='3' height='1.6' fill='%23263f6f'/%3E%3Cpath d='M12 7l7 4.6H5z' fill='%239fb4d6'/%3E%3Crect x='9.3' y='11.8' width='5.4' height='1.9' fill='%23263f6f'/%3E%3Cpath d='M12 13l8.2 5H3.8z' fill='%239fb4d6'/%3E%3Crect x='7' y='19' width='10' height='3' rx='.9' fill='%23263f6f'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-japan{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='5.4' fill='%239fb4d6'/%3E%3Cpath d='M12 1.8v3.4M12 18.8v3.4M1.8 12h3.4M18.8 12h3.4M4.8 4.8l2.4 2.4M16.8 16.8l2.4 2.4M19.2 4.8l-2.4 2.4M7.2 16.8l-2.4 2.4' stroke='%23263f6f' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-rome{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4.6' y='2.6' width='14.8' height='2.5' rx='.9' fill='%239fb4d6'/%3E%3Cpath d='M5.6 5.9h12.8l-.9 1.9H6.5z' fill='%23263f6f'/%3E%3Crect x='7.2' y='8.6' width='2.3' height='9.2' fill='%239fb4d6'/%3E%3Crect x='10.85' y='8.6' width='2.3' height='9.2' fill='%239fb4d6'/%3E%3Crect x='14.5' y='8.6' width='2.3' height='9.2' fill='%239fb4d6'/%3E%3Cpath d='M5.6 18.6h12.8l1 2.8H4.6z' fill='%23263f6f'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-byzantium{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='10.9' y='1.8' width='2.2' height='20.4' rx='.9' fill='%239fb4d6'/%3E%3Crect x='6.6' y='5.4' width='10.8' height='2.1' rx='.9' fill='%23263f6f'/%3E%3Crect x='4.4' y='10.6' width='15.2' height='2.1' rx='.9' fill='%239fb4d6'/%3E%3C/svg%3E")}
#personalitiesBrick .ico-crescent{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.6 2.3a9.9 9.9 0 1 0 6.2 18A11.6 11.6 0 0 1 14.6 2.3z' fill='%239fb4d6'/%3E%3Cpath d='M18.4 8.1l1 2.2 2.4.2-1.8 1.6.5 2.3-2.1-1.2-2.1 1.2.5-2.3-1.8-1.6 2.4-.2z' fill='%23263f6f'/%3E%3C/svg%3E")}
@media (max-width:430px){#personalitiesBrick{padding:20px 12px 12px;border-radius:14px}
#personalitiesBrick:before{top:16px;left:8px;width:44px;height:44px}
#personalitiesBrick:after{display:none}
#personalitiesBrick h2{padding:2px 8px 0 54px;font-size:21px}
#personalitiesBrick h2 .onDate{font-size:13px}
#personalitiesBrick .leaderLine{padding:8px 10px}
#personalitiesBrick .leaderIcon{width:22px;height:22px;margin-right:8px}
#personalitiesBrick .leaderLabel{font-size:10.5px;line-height:22px}
#personalitiesBrick .leaderLine strong{font-size:13.5px;max-width:54%}
}
#firstBrick,.brick>div#firstBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:24px 20px 18px;border:1px solid #ccd5e6;border-radius:16px;background:#fff;color:#414b63;font-family:Arial,Helvetica,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.08);box-sizing:border-box}
#firstBrick *{box-sizing:border-box}
#firstBrick:before{content:"";position:absolute;top:20px;left:14px;width:50px;height:50px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 13.2a5.6 5.6 0 0 1 11.2 0z' fill='%239fb4d6'/%3E%3Cpath d='M12 3.4v2.6M4.6 6.4l1.9 1.9M19.4 6.4l-1.9 1.9M2.2 13.2h2.8M19 13.2h2.8' stroke='%23b6c7e2' stroke-width='1.8' stroke-linecap='round'/%3E%3Crect x='3' y='15.4' width='18' height='2' rx='1' fill='%235a76a8'/%3E%3Crect x='5.5' y='19' width='13' height='2' rx='1' fill='%23263f6f'/%3E%3C/svg%3E")center/contain no-repeat;opacity:.9}
#firstBrick .dayChip,#firstBrick .h1Kicker{font-size:13px;text-transform:uppercase;color:#263f6f}
#firstBrick .h1Kicker{display:block;margin-bottom:6px;font-weight:700;letter-spacing:.18em}
#firstBrick .dayChip{display:inline-block;margin-top:10px;padding:4px 13px;border:1px solid #d5dfef;border-radius:999px;font-weight:900;letter-spacing:.08em;background:#f4f8fd}
#firstBrick .firstHint{margin:0 0 12px;padding-left:60px;font-size:15px;font-weight:400;line-height:1.4;color:#5f6a85}
#firstBrick .agoHero{display:block;margin:14px 0;padding-top:2px}
#firstBrick .agoHero.agoSplit{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:12px 15px;border:1px solid #e4d5b0;border-radius:12px;background:#faf4e4}
#firstBrick .agoSplit .agoBig{flex:0 0 auto}
#firstBrick .agoSide{flex:1 1 175px;display:block;min-width:0}
#firstBrick .agoSplit .agoUnit{margin-top:0}
#firstBrick .agoSplit .agoPrecise{margin-top:6px;font-size:15px}
#firstBrick .agoSplit .maiNap{margin:2px 0 0}
#firstBrick .agoChips{flex:0 0 auto;display:block;text-align:center}
#firstBrick .agoChips .dayChip{display:block;margin:0 0 6px;background:#fff}
#firstBrick .agoChips .dayChip:last-child{margin-bottom:0}
#firstBrick .agoBig{display:block;font-size:41px;line-height:.95;font-weight:900;letter-spacing:-2px;color:#8a5a18}
#firstBrick .agoUnit{display:block;margin-top:3px;font-size:13px;font-weight:900;letter-spacing:.22em;text-transform:uppercase}
#firstBrick .agoPrecise{display:block;margin-top:8px;font-size:16px;line-height:1.45;font-style:italic;color:#1b2a49}
#firstBrick .agoPrecise strong{color:#263f6f}
#firstBrick .firstActions button,#firstBrick .todayBadge{display:inline-block;border-radius:999px;font-weight:900;color:#263f6f;background:#f4f8fd}
#firstBrick .todayBadge{padding:8px 18px;border:1px solid #d5dfef;font-size:16px}
#firstBrick .popRow{display:block;overflow:hidden;margin:10px 0 2px;padding:10px 14px;border-radius:12px;border:1px solid #e0e8f4;background:#f6f9fd;transition:background .25s ease,transform .25s ease,border-color .25s ease}
#firstBrick .popRow:hover{background:#e9f0fa;border-color:#ccd5e6;transform:translateX(4px)}
#firstBrick .popIcon{display:inline-block;vertical-align:middle;width:26px;height:26px;margin-right:10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='7.6' r='3.4' fill='%235a76a8'/%3E%3Cpath d='M3.2 19.6c0-3.7 2.6-6.1 5.8-6.1s5.8 2.4 5.8 6.1z' fill='%235a76a8'/%3E%3Ccircle cx='16.9' cy='8.7' r='2.6' fill='%239fb4d6'/%3E%3Cpath d='M16 13.6c2.9.3 4.9 2.5 4.9 6h-4.5z' fill='%239fb4d6'/%3E%3C/svg%3E")center/contain no-repeat}
#firstBrick .popLabel{display:inline-block;vertical-align:middle;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#7d8699;line-height:26px}
#firstBrick .popRow strong{display:block;float:right;font-size:17px;line-height:26px;font-weight:900;color:#1b2a49}
@media (max-width:430px){#firstBrick{padding:20px 14px 12px;border-radius:14px}
#firstBrick:before{top:16px;left:8px;width:44px;height:44px}
#firstBrick h1{font-size:26px}
#firstBrick .firstHint,#firstBrick h1{padding-left:54px}
#firstBrick .agoBig{font-size:44px}
#firstBrick .agoHero.agoSplit{gap:6px 12px;padding:10px 12px}
#firstBrick .agoSide{flex-basis:140px}
#firstBrick .popRow strong{font-size:15px}
}
#firstBrick .datumHiba{position:relative;margin:0 0 16px;padding:14px 16px 13px 52px;border:1px solid #e8c9a0;border-left:5px solid #b5541c;border-radius:12px;background:#fdf3e7}
#firstBrick .datumHiba:before{content:"!";position:absolute;top:15px;left:15px;width:24px;height:24px;border-radius:50%;background:#b5541c;color:#fff;font-size:16px;font-weight:900;line-height:24px;text-align:center}
#firstBrick .hibaCim{display:block;margin-bottom:4px;font-size:16px;font-weight:900;letter-spacing:-.2px;color:#8a3d12}
#firstBrick .hibaSzoveg{margin:0;font-size:14.5px;line-height:1.5;color:#6b4a30}
@media (max-width:430px){#firstBrick .datumHiba{padding:12px 13px 11px 44px}
#firstBrick .datumHiba:before{top:13px;left:11px;width:22px;height:22px;font-size:15px;line-height:22px}
#firstBrick .hibaCim{font-size:15px}
#firstBrick .hibaSzoveg{font-size:13.5px}
}
#onThisDay{position:relative;overflow:hidden;margin:0 0 16px;padding:13px 15px 14px;border:1px solid #ccd5e6;border-left:5px solid #263f6f;border-radius:14px;background:linear-gradient(135deg,#f8fbff,#e7eff9);box-shadow:0 8px 20px rgba(38,63,111,.16)}
#onThisDay .otdKicker{display:block;margin:0 0 9px;font-size:11.5px;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:#263f6f}
#onThisDay .otdKicker:before{content:"★";margin-right:7px;font-size:12px;vertical-align:1px}
#onThisDay .otdList{list-style:none;margin:0;padding:0}
#onThisDay .otdItem{margin:0;padding:0}
#onThisDay .otdItem+.otdItem{margin-top:9px;padding-top:9px;border-top:1px dashed #d5dfef}
#onThisDay .otdJump{display:flex;align-items:center;gap:13px;width:100%;margin:0;padding:5px;border:0;border-radius:12px;background:0 0;box-shadow:none;text-shadow:none;font:inherit;color:inherit;text-align:left;cursor:pointer;transition:background .22s ease,transform .22s ease}
#onThisDay .otdJump:active,#onThisDay .otdJump:focus,#onThisDay .otdJump:hover{background:rgba(255,255,255,.72);box-shadow:none;outline:0;transform:translateX(3px)}
#onThisDay .otdFace{flex:0 0 auto;width:68px;height:68px;border-radius:50%;border:2px solid #fff;object-fit:cover;background:#f4f8fd;box-shadow:0 5px 14px rgba(38,63,111,.32)}
#onThisDay .otdIco{flex:0 0 auto;width:54px;height:54px;border-radius:50%;border:1px solid #d5dfef;background:#fff;font-size:27px;line-height:52px;text-align:center;box-shadow:0 5px 14px rgba(38,63,111,.16)}
#onThisDay .otdIcoDot{font-size:22px;color:#7f9cc8}
#onThisDay .otdBody{flex:1 1 auto;min-width:0}
#onThisDay .otdHead{display:block;font-size:17px;line-height:1.32;color:#414b63}
#onThisDay .otdHead strong{font-weight:900;color:#1b2a49}
#onThisDay .otdLead,#onThisDay .otdYear{font-weight:700;color:#263f6f}
#onThisDay .otdMeta{display:block;margin-top:4px;font-size:11.5px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#8a93a8}
#onThisDay .otdBlurb{display:block;margin-top:5px;font-size:13.5px;line-height:1.45;color:#5f6a85}
#onThisDay .otdGo{flex:0 0 auto;font-size:23px;line-height:1;font-weight:900;color:#9fb4d6;transition:transform .22s ease,color .22s ease}
#onThisDay .otdJump:focus .otdGo,#onThisDay .otdJump:hover .otdGo{color:#263f6f;transform:translateX(3px)}
@media (max-width:430px){#onThisDay{padding:11px 12px 12px}
#onThisDay .otdJump{gap:10px;padding:3px}
#onThisDay .otdFace{width:56px;height:56px}
#onThisDay .otdIco{width:46px;height:46px;font-size:23px;line-height:44px}
#onThisDay .otdHead{font-size:15.5px}
#onThisDay .otdBlurb{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){#onThisDay .otdGo,#onThisDay .otdJump{transition:none}
#onThisDay .otdJump:focus,#onThisDay .otdJump:hover{transform:none}
}
#yearBrick .yiEvents li.kiemelve{background:linear-gradient(90deg,rgba(138,90,24,.16),rgba(38,63,111,.05) 70%);box-shadow:inset 3px 0 0#8a5a18;transform:translateX(4px)}
/* Stacked drop-shadows rather than a box-shadow ring: they trace the card and
   its point as one shape, where a ring would stop at the card's corners. */
#notableEvents li.kiemelve .eventCard{filter:drop-shadow(0 0 2px rgba(138,90,24,.9)) drop-shadow(0 0 2px rgba(138,90,24,.75)) drop-shadow(0 5px 12px rgba(0,0,0,.2));z-index:26}
#firstBrick .yearProgress{display:block;margin:14px 0 10px}
#firstBrick .progressLabel{display:block;overflow:hidden;margin-bottom:6px;font-size:13px;color:#5f6a85}
#firstBrick .progressLabel strong{color:#263f6f}
#firstBrick .progressLabel em{float:right;font-style:normal;font-size:12px;font-weight:900;letter-spacing:.06em}
#firstBrick .progressTrack{display:block;height:8px;border-radius:999px;background:#dde6f4;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
#firstBrick .progressFill{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#9fb4d6,#263f6f)}
#firstBrick .repeatLine{margin:10px 0;font-size:14px;line-height:1.45;color:#5f6a85}
#firstBrick .repeatLine a{color:#263f6f;font-weight:900}
#firstBrick .repeatLine a:hover{color:#1b2a49}
#firstBrick .moonIcon{display:inline-block;vertical-align:middle;width:26px;height:26px;margin-right:10px;font-size:20px;line-height:26px;text-align:center}
#firstBrick .firstActions{display:block;margin:14px 0 2px;padding-top:13px;border-top:1px solid #d5dfef}
#firstBrick .firstActions button{vertical-align:middle;width:auto;margin:0 8px 6px 0;padding:8px 14px;border:1px solid #ccd5e6;font-size:13px;letter-spacing:.04em;line-height:1;cursor:pointer;box-shadow:none;text-shadow:none;transition:background .22s ease,transform .22s ease,border-color .22s ease,color .22s ease}
#firstBrick .firstActions button:focus,#firstBrick .firstActions button:hover{background:#e9f0fa;border-color:#9fb4d6;color:#1b2a49;box-shadow:none;transform:translateY(-2px)}
#firstBrick .firstActions button:active{background:#dde6f4;border-color:#9fb4d6;box-shadow:none}
#firstBrick .firstActions .btnIco{margin-right:7px}
#firstBrick #copyLinkBtn{min-width:122px;text-align:center}
#firstBrick .firstActions button.copied,#firstBrick .firstActions button.copied:hover{background:#e9f5ec;border-color:#a9d4b7;color:#2e6b45}
#firstBrick #shareBtn{display:none}
#firstBrick #shareBtn.shareReady,#nativeShare.shareReady{display:inline-block}
@media (max-width:430px){#firstBrick .firstActions button{padding:7px 11px;font-size:12px;margin-right:5px}
}
#yearBrick,.brick>div#yearBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:22px 18px 16px;border:1px solid #ccd5e6;border-radius:16px;background:#fff;color:#414b63;font-family:Arial,Helvetica,sans-serif;box-shadow:0 8px 20px rgba(0,0,0,.08);box-sizing:border-box}
#yearBrick *{box-sizing:border-box}
#yearBrick:after{content:"REWIND";position:absolute;top:26px;right:-36px;transform:rotate(38deg);padding:3px 42px;background:rgba(138,90,24,.1);color:rgba(138,90,24,.55);font-size:11px;font-weight:900;letter-spacing:.42em;pointer-events:none}
#yearBrick h2{margin:0 0 16px;padding:2px 70px 0 0;font-size:26px;line-height:1.05;font-weight:900;letter-spacing:-.6px;color:#1b2a49}
#yearBrick .yiStats{font-size:0;margin:0 0 12px}
#yearBrick .yiStat{display:inline-block;vertical-align:top;width:31.33%;margin:0 1% 6px;padding:10px 4px;border:1px solid #e0e8f4;border-radius:10px;background:#f6f9fd;text-align:center}
#yearBrick .yiStat strong{display:block;font-size:21px;line-height:1;font-weight:900;letter-spacing:-.5px;color:#263f6f}
#yearBrick .yiStat span{display:block;height:2.2em;margin-top:4px;font-size:10px;font-weight:700;letter-spacing:.07em;line-height:1.1em;text-transform:uppercase;color:#7d8699}
#yearBrick .yiSection{margin:0 0 8px;padding-bottom:4px;border-bottom:2px solid #e4d5b0;font-size:12px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#8a5a18}
#yearBrick .yiEvents{list-style:none;position:relative;margin:0 0 16px;padding:0}
#yearBrick .yiEvents:before{content:"";position:absolute;top:16px;bottom:16px;left:31px;width:2px;background:linear-gradient(180deg,transparent,rgba(38,63,111,.3) 36px,rgba(38,63,111,.3) calc(100% - 36px),transparent)}
#yearBrick .yiEvents li{position:relative;margin:0;padding:13px 54px 13px 78px;border-bottom:1px solid #e0e8f4;font-size:15px;line-height:1.45;color:#414b63;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
#yearBrick .yiEvents li:last-child{border-bottom:0}
#yearBrick .yiEvents li:hover{background:linear-gradient(90deg,rgba(138,90,24,.08),rgba(38,63,111,.04) 70%);transform:translateX(4px);box-shadow:inset 3px 0 0#8a5a18}
#yearBrick .yiEvents strong{position:absolute;left:2px;top:13px;z-index:1;display:block;width:60px;padding:7px 0 6px;border:1px solid #e4d5b0;border-radius:11px;text-align:center;font-size:13.5px;font-weight:900;letter-spacing:-.3px;color:#8a5a18;background:#faf4e4;box-shadow:0 2px 6px rgba(0,0,0,.06);transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
#yearBrick .yiEvents .yiIco{position:absolute;right:0;top:50%;transform:translateY(-50%);width:46px;height:46px;display:block;text-align:center;border-radius:50%;border:1px solid #d5dfef;background:#f4f8fd;font-size:26px;line-height:44px;transition:transform .22s ease,background .22s ease}
#yearBrick .yiPhoto{display:block;width:100%;height:auto;margin:0 0 14px;border:1px solid #e4d5b0;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.1);cursor:zoom-in;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,filter .25s ease}
#yearBrick .yiPhoto:hover{transform:translateY(-3px) scale(1.015);border-color:#8a5a18;box-shadow:0 12px 26px rgba(0,0,0,.24);filter:saturate(1.08) contrast(1.03)}
#yearBrick .yiNote,#yearBrick .yiThen{margin:0 0 16px;border-radius:12px;font-size:13.5px}
#yearBrick .yiThen{padding:12px 14px;border:1px solid #e4d5b0;background:#faf4e4;line-height:1.55;color:#5c4a2a}
#yearBrick .yiThen strong{color:#8a5a18}
#yearBrick .yiThen em{color:#8a5a18;font-style:italic}
#yearBrick .yiNote{padding:10px 14px;border:1px solid #d5dfef;background:#f4f8fd;line-height:1.5;color:#263f6f}
#yearBrick .yiQ{margin:10px 0 3px;font-size:14px;font-weight:900;color:#1b2a49}
#yearBrick .yiA{margin:0 0 10px;font-size:13.5px;line-height:1.5;color:#414b63}
#yearBrick .yiNext a,#yearBrick .yiThen a{color:#8a5a18;text-decoration:none;font-weight:700;transition:color .2s ease}
#yearBrick .yiThen a:hover{color:#3b3222}
#yearBrick .yiEvents strong a{display:block;color:#8a5a18;text-decoration:none}
#yearBrick .yiNext{margin:0;padding-top:10px;border-top:1px solid #e0e8f4;text-align:right;font-size:14px}
#yearBrick .yiNext a{color:#263f6f;font-weight:900}
#aboutBrick #dateintro strong,#yearBrick .yiNext a:hover{color:#8a5a18}
#yearBrick .yiNext a span{font-size:18px;line-height:1}
@media (max-width:430px){#yearBrick{padding:18px 12px 12px;border-radius:14px}
#yearBrick:after{display:none}
#yearBrick h2{font-size:22px;padding-right:0}
#yearBrick .yiStat strong{font-size:18px}
#yearBrick .yiEvents:before{left:27px}
#yearBrick .yiEvents li{padding:11px 44px 11px 66px;font-size:13.5px}
#yearBrick .yiEvents strong{top:11px;width:52px;font-size:12px;border-radius:9px;padding:6px 0 5px}
#yearBrick .yiEvents .yiIco{width:38px;height:38px;font-size:20px;line-height:36px}
}
#yiLightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(12,16,28,.84);opacity:0;transition:opacity .2s ease}
#yiLightbox.yiLbOpen{opacity:1}
#yiLightbox:not(.yiLbOpen){pointer-events:none}
#yiLightbox img{display:block;width:auto;height:auto;max-width:94vw;max-height:88vh;border:1px solid #e4d5b0;border-radius:12px;box-shadow:0 18px 44px rgba(0,0,0,.5);transform:scale(.96);transition:transform .2s ease}
#yiLightbox.yiLbOpen img{transform:scale(1)}
#yiLbClose{position:absolute;top:14px;right:18px;width:42px;height:42px;padding:0;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(0,0,0,.4);color:#fff;font-size:30px;line-height:38px;font-family:Arial,Helvetica,sans-serif;cursor:pointer;transition:background .2s ease,transform .2s ease}
#yiLbClose:hover{background:rgba(138,90,24,.9);transform:scale(1.08)}
@media (max-width:430px){#yiLightbox{padding:10px}
#yiLbClose{top:8px;right:10px;width:36px;height:36px;font-size:25px;line-height:32px}
}
@media (prefers-reduced-motion:reduce){#yearBrick .yiPhoto,#yiLightbox,#yiLightbox img{transition:none}
#yearBrick .yiPhoto:hover{transform:none}
}
#aboutBrick,.brick>div#aboutBrick{position:relative;max-width:500px;margin:10px;padding:20px 22px 18px;border:1px solid #d8d2bf;border-radius:16px;background:#fff;color:#4a4234;box-shadow:0 8px 20px rgba(0,0,0,.08);box-sizing:border-box}
#aboutBrick:before{content:"";position:absolute;top:18px;right:20px;width:32px;height:32px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5.2C10.2 3.9 7.9 3.2 5 3.2c-.9 0-1.8.1-2.6.2v14.4c.8-.1 1.7-.2 2.6-.2 2.9 0 5.2.7 7 2 1.8-1.3 4.1-2 7-2 .9 0 1.8.1 2.6.2V3.4c-.8-.1-1.7-.2-2.6-.2-2.9 0-5.2.7-7 2z' fill='%23cbb98b'/%3E%3Cpath d='M12 5.2v14.4' stroke='%23f3eedb' stroke-width='1.4'/%3E%3C/svg%3E")center/contain no-repeat;opacity:.85}
#aboutBrick h2{margin:0 44px 12px 0;padding-bottom:10px;border-bottom:2px solid #e2d8b6;font-size:22px;line-height:1.15;font-weight:900;letter-spacing:-.4px;color:#263f6f}
#aboutBrick #dateintro{font-size:18.5px;line-height:1.42}
#shareBrick,.brick>div#shareBrick,.countdownBand{position:relative;overflow:hidden;font-family:Arial,Helvetica,sans-serif}
.countdownBand{display:block;padding:26px 16px 22px;border-top:1px solid rgba(87,216,255,.25);border-bottom:1px solid rgba(87,216,255,.25);background:radial-gradient(1px 1px at 25px 35px,rgba(255,255,255,.5),transparent 2px),radial-gradient(1px 1px at 140px 84px,rgba(255,255,255,.35),transparent 2px),radial-gradient(1.5px 1.5px at 80px 128px,rgba(127,179,240,.45),transparent 2.5px),linear-gradient(160deg,#03081e 0,#15204d 60%,#010206 100%);color:#e8f2fb;text-align:center}
.countdownBand *{box-sizing:border-box}
.countdownBand:after,.countdownBand:before{content:"";position:absolute;height:130%;pointer-events:none}
.countdownBand:before{left:-10%;top:-40%;width:60%;background:radial-gradient(circle,rgba(87,216,255,.14),transparent 60%);animation:vszLebeg 9s ease-in-out infinite alternate}
.countdownBand:after{right:-10%;bottom:-40%;width:55%;background:radial-gradient(circle,rgba(190,120,255,.13),transparent 60%);animation:vszLebeg 11s ease-in-out infinite alternate-reverse}
.countdownInner{position:relative;z-index:1;display:block;max-width:760px;margin:0 auto}
@media (prefers-reduced-motion:reduce){.countdownBand:after,.countdownBand:before{animation:none}
}
#shareBrick,.brick>div#shareBrick{max-width:500px;margin:10px;padding:22px 18px 16px;border:1px solid rgba(87,216,255,.35);border-radius:20px;background:radial-gradient(circle at 86% 10%,rgba(87,216,255,.14),transparent 45%),linear-gradient(155deg,#122437 0,#0e1c2c 55%,#07111b 100%);color:#e6f1f8;box-shadow:0 14px 34px rgba(0,0,0,.35);box-sizing:border-box}
#shareBrick *{box-sizing:border-box}
#shareBrick:before{content:"";position:absolute;top:20px;left:16px;width:44px;height:44px;display:block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='18' cy='5' r='3' fill='%2357d8ff'/%3E%3Ccircle cx='6' cy='12' r='3' fill='%23bde9ff'/%3E%3Ccircle cx='18' cy='19' r='3' fill='%2357d8ff'/%3E%3Cpath d='M8.6 10.6l6.8-4M8.6 13.4l6.8 4' stroke='%23bde9ff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")center/contain no-repeat;filter:drop-shadow(0 4px 8px rgba(0,0,0,.4))}
#shareBrick h2{margin:0 0 16px;padding:4px 0 0 56px;font-size:24px;line-height:1.06;font-weight:900;letter-spacing:-.5px;color:#fff}
#shareBrick h2 span{display:block;margin-top:5px;font-size:14px;font-weight:900;letter-spacing:0;color:#57d8ff}
.shareButtons{display:block;margin:0 0 4px;text-align:left}
.shareChip{display:inline-block;vertical-align:middle;width:auto;margin:0 6px 8px 0;padding:9px 14px;border:1px solid rgba(87,216,255,.4);border-radius:999px;background:rgba(87,216,255,.1);font-family:Arial,Helvetica,sans-serif;font-size:13.5px;font-weight:700;line-height:1;text-decoration:none;cursor:pointer;box-shadow:none;text-shadow:none;transition:background .22s ease,color .22s ease,border-color .22s ease,transform .22s ease}
.shareChip,a.shareChip,a.shareChip:link,a.shareChip:visited{color:#bde9ff}
.shareChip:focus,.shareChip:hover,a.shareChip:focus,a.shareChip:hover{background:rgba(87,216,255,.26);border-color:rgba(189,233,255,.75);color:#fff;box-shadow:none;transform:translateY(-2px)}
.shareChip:active{background:rgba(87,216,255,.36);box-shadow:none}
.shareChip .chipIcon{display:inline-block;margin-right:7px;font-weight:900}
.shareChip.copied,.shareChip.copied:hover{background:rgba(80,200,120,.24);border-color:rgba(130,225,160,.7);color:#c8f5d8}
#nativeShare{display:none}
#shareBrick .embedTitle{margin:14px 0 4px;padding-top:14px;border-top:1px solid rgba(87,216,255,.18);font-size:16px;font-weight:900;color:#fff}
#shareBrick .embedNote{margin:0 0 10px;font-size:13px;line-height:1.5;color:rgba(230,241,248,.72)}
#shareBrick .embedNote a{color:#57d8ff;text-decoration:none}
#shareBrick .embedNote a:hover{color:#fff}
.embedCode{display:block;margin:0 0 10px;padding:12px 14px;border:1px solid rgba(87,216,255,.25);border-radius:12px;background:rgba(0,0,0,.35);color:#cfe6f5;font-family:Consolas,Menlo,monospace;font-size:12px;line-height:1.6;text-align:left;white-space:pre-wrap;word-break:break-all;cursor:pointer}
.embedCode:focus-visible{outline:3px solid #57d8ff;outline-offset:2px}
.codeTag{color:#57d8ff;font-weight:700}
.codeAttr{color:#ffcf8a}
.codeValue{color:#9fe5b4}
.codePunct{color:#7d93a6}
@media (max-width:430px){.countdownBand{padding:16px 8px 14px}
#shareBrick{padding:18px 12px 12px;border-radius:18px}
#shareBrick:before{top:18px;left:8px;width:38px;height:38px}
#shareBrick h2{padding-left:50px;font-size:20px}
.shareChip{padding:8px 11px;font-size:12.5px}
}
#firstBrick .maiNap{display:block;margin:2px 0 8px;font-size:34px;line-height:1.05;font-weight:900;letter-spacing:-1.2px;font-family:"Space Grotesk",Arial,Helvetica,sans-serif;color:#8a5a18}
.home #firstBrick h1{margin-bottom:6px}
.home #firstBrick .firstHint{margin-bottom:14px}
#firstBrick .progressLabel em{color:#8a5a18}
#firstBrick .agoUnit{color:#a5762c}
#firstBrick .dayChip.weekChip{color:#8a5a18;border-color:#e4d5b0;background:#faf4e4}
#firstBrick .progressFill{background:linear-gradient(90deg,#263f6f,#8a5a18)}
#birthdayBrick,.brick>div#birthdayBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:24px 18px 16px;border:1px solid rgba(142,198,255,.35);border-radius:20px;background:#123e73;color:#e8f1fb;font-family:Arial,Helvetica,sans-serif;box-shadow:0 14px 34px rgba(0,0,0,.35);box-sizing:border-box}
#birthdayBrick *{box-sizing:border-box}
.birthdayAvatar{position:relative;display:block;margin:6px 0 14px;text-align:center}
.birthdayAvatar img{display:inline-block;width:260px;height:260px;border-radius:13px;object-fit:cover;border:3px solid rgba(142,198,255,.7);box-shadow:0 0 30px rgba(142,198,255,.28),0 14px 30px rgba(0,0,0,.5)}
#birthdayBrick .birthdayList{list-style:none;margin:0;padding:0;text-align:left}
.birthdayRow{position:relative;margin:0;padding:12px 6px 12px 70px;border-bottom:1px solid rgba(232,241,251,.11);font-size:14.5px;line-height:1.45;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.birthdayRow:last-child,.ismertetoTabla tr:last-child td{border-bottom:0}
.birthdayRow:hover{background:linear-gradient(90deg,rgba(142,198,255,.16),rgba(142,198,255,.02) 72%);transform:translateX(4px);box-shadow:inset 3px 0 0#8ec6ff}
.bdYear{position:absolute;left:2px;top:12px;display:block;width:56px;padding:7px 0 6px;border-radius:11px;text-align:center;font-size:14.5px;font-weight:900;letter-spacing:-.3px;background:linear-gradient(135deg,#d3e8ff,#5d9fdd);box-shadow:0 5px 14px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.35);text-decoration:none;transition:transform .22s ease,box-shadow .22s ease}
.bdYear,a.bdYear,a.bdYear:link,a.bdYear:visited{color:#0b2a52}
a.bdYear:hover{transform:scale(1.08);box-shadow:0 8px 20px rgba(142,198,255,.4),inset 0 1px 0 rgba(255,255,255,.4)}
.bdText{display:block;min-width:0}
.bdAge,.bdName{display:inline-block}
.bdName{font-size:16px;font-weight:900;letter-spacing:-.2px;text-decoration:none}
a.bdName,a.bdName:link,a.bdName:visited{color:#fff}
a.bdName:hover{color:#ffcf6b}
.bdAge{margin-left:8px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#9dc8f0}
.bdBlurb{display:block;margin-top:3px;color:rgba(232,241,251,.82)}
@media (max-width:430px){#birthdayBrick{padding:16px 12px 12px;border-radius:18px}
.birthdayAvatar img{width:200px;height:200px;border-radius:11px}
.birthdayRow{padding:11px 4px 11px 62px;font-size:13.5px}
.bdYear{width:50px;font-size:13px}
.bdName{font-size:15px}
}
.avatarName{display:block;margin-top:8px;font-size:18px;font-weight:900;color:#fff}
#birthdayBrick{text-align:center}
.partyHat{position:absolute;left:58%;top:-34px;margin-left:-96px;width:100px;height:94px;transform:rotate(-15deg);z-index:2;pointer-events:none;filter:drop-shadow(0 4px 7px rgba(0,0,0,.45))}
.partyHat svg{display:block;width:100%;height:100%}
@media (max-width:430px){.partyHat{width:78px;height:73px;margin-left:-74px;top:-26px}
}
@media (prefers-reduced-motion:reduce){#birthdayBrick h2{animation:none}
}
#birthdayBrick h2.betuFuzer{position:relative;display:block;margin:3px 0 38px;padding:16px 4px 0;border-radius:0;background:0 0;box-shadow:none;font-size:0;text-align:center;animation:none}
.bdAlcim{display:block;margin-top:0;margin-bottom:18px;font-size:17px;font-weight:900;letter-spacing:0;color:#bad9f6}
@media (max-width:430px){.bdAlcim{margin-bottom:14px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){.betu .betuLap{animation:none}
}
@media (max-width:430px){.betu:nth-child(2n){top:5px!important}
.betu:nth-child(3n){top:2px!important}
}
.betuSor{position:relative;display:block;height:52px;margin:0 0 6px}
.huzal{position:absolute;left:0;top:0;display:block;width:100%;height:30px;overflow:visible}
.betu,.betu .betuLap{display:block;transform-origin:top center}
.betu{position:absolute;top:2px;transform:translateX(-50%)}
.betu .betuLap{min-width:27px;padding:8px 7px 7px;border-radius:9px;background:linear-gradient(180deg,#c3e2ff 0,#66a9e8 52%,#3b7fc4 100%);box-shadow:0 8px 14px rgba(0,0,0,.42),inset 0 2px 0 rgba(255,255,255,.55),inset 0-3px 7px rgba(0,0,0,.25);color:#0a2c55;font-family:"Space Grotesk",Arial,Helvetica,sans-serif;font-size:22px;font-weight:900;line-height:1;text-align:center;text-shadow:0 1px 0 rgba(255,255,255,.4);animation:betuLenges 4.8s ease-in-out infinite}
.betu:nth-of-type(6n+1) .betuLap{background:linear-gradient(180deg,#ffb3e2 0,#e067c0 52%,#bd48a4 100%);color:#3d0b2e}
.betu:nth-of-type(6n+2) .betuLap{background:linear-gradient(180deg,#ffe9a8 0,#f8c53f 52%,#dfa41c 100%);color:#4a3200}
.betu:nth-of-type(6n+3) .betuLap{background:linear-gradient(180deg,#d3f7bf 0,#76c95f 52%,#4ea544 100%);color:#123a0f}
.betu:nth-of-type(6n+4) .betuLap{background:linear-gradient(180deg,#c2f0ff 0,#54c8ea 52%,#2f9fc7 100%);color:#06303c}
.betu:nth-of-type(6n+5) .betuLap{background:linear-gradient(180deg,#ffd0a6 0,#ff9a5c 52%,#ef7a34 100%);color:#4a1c00}
@media (max-width:430px){.betuSor{height:44px}
.betu .betuLap{min-width:21px;padding:6px 5px 5px;font-size:17px;border-radius:7px}
}
@media (prefers-reduced-motion:reduce){.betu .betuLap{animation:none}
}
.avatarGomb{display:inline-block;padding:0;margin:0;border:0;border-radius:0;background:0 0;box-shadow:none;text-shadow:none;line-height:0;cursor:pointer;transition:transform .28s ease}
.avatarGomb:focus,.avatarGomb:hover{background:0 0;box-shadow:none;transform:translateY(-3px) scale(1.05)}
.avatarGomb:active{background:0 0;transform:translateY(-1px) scale(1.02)}
.avatarGomb:focus-visible{outline:3px solid #8ec6ff;outline-offset:5px}
.avatarGomb img{transition:border-color .28s ease,box-shadow .28s ease,filter .28s ease}
.avatarGomb:focus img,.avatarGomb:hover img{border-color:#ffcf6b;box-shadow:0 0 34px rgba(255,207,107,.45),0 14px 26px rgba(0,0,0,.5);filter:saturate(1.12)}
.avatarGomb.nincsCel{cursor:default}
.avatarGomb.nincsCel:hover{transform:none}
.avatarGomb.nincsCel:hover img{border-color:rgba(142,198,255,.7);box-shadow:0 0 26px rgba(142,198,255,.3),0 10px 22px rgba(0,0,0,.45);filter:none}
.birthdayRow.kiemelve{background:linear-gradient(90deg,rgba(255,207,107,.3),rgba(142,198,255,.1) 72%);box-shadow:inset 4px 0 0#ffcf6b,0 0 24px rgba(255,207,107,.22);transform:translateX(5px)}
.birthdayRow.kiemelve .bdName{color:#ffcf6b}
.birthdayRow.kiemelve .bdYear{transform:scale(1.07);box-shadow:0 8px 20px rgba(255,207,107,.4),inset 0 1px 0 rgba(255,255,255,.4)}
.bdAge.bdHalt{color:#a6c2df;letter-spacing:.02em;text-transform:none;font-size:12.5px}
.bdLink{min-height:120px;position:relative;display:block;padding:14px 6px 14px 94px;text-decoration:none;color:inherit}
.honapBrick .birthdayRow{min-height:120px;padding:0}
.bdLink:focus-visible{outline:3px solid #8ec6ff;outline-offset:-3px;border-radius:12px}
.honapBrick .bdName{display:inline-block;color:#fff;transition:color .25s ease}
.honapSor:hover .bdName{color:#ffcf6b}
.honapSor:hover .bdArckep{border-color:#ffcf6b;box-shadow:0 0 24px rgba(255,207,107,.4),0 8px 18px rgba(0,0,0,.5);transform:translateY(-2px)}
.honapSor:hover .bdNapSzam{color:#ffcf6b}
.honapSor:hover .bdYear{transform:scale(1.07);box-shadow:0 8px 20px rgba(142,198,255,.4),inset 0 1px 0 rgba(255,255,255,.4)}
.bdArckep,.bdNap{display:block;width:82px}
.bdNap{position:absolute;left:2px;top:14px;text-align:center;text-decoration:none}
.bdArckep{height:82px;border-radius:13px;object-fit:cover;border:2px solid rgba(142,198,255,.7);box-shadow:0 0 18px rgba(142,198,255,.22),0 8px 18px rgba(0,0,0,.45);transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.bdNapSzam{display:block;margin-top:6px;font-size:12px;font-weight:900;letter-spacing:.02em;color:#bad9f6;transition:color .25s ease}
.honapBrick .bdYear{position:static;display:inline-block;width:auto;margin-right:7px;padding:4px 9px 3px;font-size:12.5px;vertical-align:2px;transition:transform .22s ease,box-shadow .22s ease}
@media (max-width:430px){.bdLink,.honapBrick .birthdayRow{min-height:100px}
.bdLink{padding:12px 4px 12px 78px}
.bdNap{width:68px;top:12px}
.bdArckep{width:68px;height:68px;border-radius:11px}
.bdNapSzam{margin-top:4px;font-size:11.5px}
}
#deathsBrick,.brick>div#deathsBrick{position:relative;overflow:hidden;max-width:500px;margin:10px;padding:58px 24px 19px;border:1px solid rgba(18,22,28,.55);border-radius:235px 235px 22px 22px;background:radial-gradient(120% 85%at 30% 10%,rgba(255,255,255,.14),rgba(255,255,255,0) 55%),radial-gradient(95% 70%at 78% 85%,rgba(0,0,0,.28),transparent 60%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='sz'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncA type='linear' slope='.14'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23sz)'/%3E%3C/svg%3E"),linear-gradient(160deg,#7d8697 0,#616a78 45%,#4a525f 100%);color:#d6dbe3;font-family:Arial,Helvetica,sans-serif;box-shadow:0 22px 44px rgba(0,0,0,.5),inset 0 2px 1px rgba(255,255,255,.22),inset 0-4px 10px rgba(0,0,0,.38),inset 0 0 70px rgba(0,0,0,.16);box-sizing:border-box}
#deathsBrick *{box-sizing:border-box}
#deathsBrick:after{content:"";position:absolute;left:0;right:0;bottom:0;height:64px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='130' height='64' viewBox='0 0 130 64'%3E%3Cpath d='M0 64 q4 -70 8 0 q3 -50 7 0 q4 -84 8 0 q3 -44 7 0 q4 -64 8 0 q4 -76 8 0 q3 -48 7 0 q4 -68 8 0 q4 -88 8 0 q3 -52 7 0 q4 -72 8 0 q4 -60 8 0 q3 -46 7 0 q4 -80 8 0 q4 -66 8 0 q3 -50 7 0 q4 -58 8 0 z' fill='%232f4a2c'/%3E%3Cpath d='M0 64 q3 -44 7 0 q3 -34 6 0 q3 -52 7 0 q3 -30 6 0 q3 -40 7 0 q3 -48 7 0 q3 -32 6 0 q3 -42 7 0 q3 -56 7 0 q3 -36 6 0 q3 -46 7 0 q3 -38 7 0 q3 -30 6 0 q3 -44 7 0 q3 -34 6 0 q3 -50 7 0 q3 -40 7 0 q3 -32 6 0 q3 -44 7 0 q2 -28 4 0 z' fill='%233f6236'/%3E%3Cpath d='M0 64 q2 -24 5 0 q2 -16 4 0 q3 -30 6 0 q2 -20 5 0 q2 -14 4 0 q3 -26 6 0 q2 -34 5 0 q2 -18 4 0 q3 -22 6 0 q2 -28 5 0 q2 -16 4 0 q3 -32 6 0 q2 -20 5 0 q2 -24 4 0 q3 -18 6 0 q2 -30 5 0 q2 -14 4 0 q3 -26 6 0 q2 -22 5 0 q2 -16 4 0 q3 -28 6 0 q2 -20 5 0 q2 -14 4 0 q3 -24 6 0 q2 -18 5 0 q2 -22 5 0 z' fill='%2356813f'/%3E%3C/svg%3E")repeat-x left bottom;background-size:130px 64px;pointer-events:none}
#deathsBrick h2,#deathsBrick h2:before{font-weight:700;color:#3f4754;text-shadow:0 1px 0 rgba(255,255,255,.25),0-1px 1px rgba(0,0,0,.5)}
#deathsBrick h2{position:relative;margin:0 0 24px;padding:0;text-align:center;font-family:Georgia,"Times New Roman",serif;font-size:28px;line-height:1.05;letter-spacing:2.5px;text-transform:uppercase}
#deathsBrick h2:before{content:"RIP";display:block;margin:0 auto 14px;font-size:34px;line-height:1;letter-spacing:6px;text-indent:6px}
.dtAlcim,.sirFelirat{display:block;font-size:14px}
.sirFelirat{margin-bottom:10px;font-style:italic;font-weight:400;letter-spacing:1.5px;text-transform:none;color:#49525f}
.dtAlcim{margin-top:10px;font-weight:700;letter-spacing:4px;color:#4d5663}
.deathAvatar{position:relative;display:block;margin:2px 0 18px;text-align:center}
.deathAvatar img{display:inline-block;width:200px;height:200px;border-radius:3px;object-fit:cover;border:9px solid #14171c;box-shadow:0 0 0 1px rgba(255,255,255,.16),inset 0 0 0 1px rgba(0,0,0,.6),0 16px 32px rgba(0,0,0,.55);filter:grayscale(.4)}
.ripGomb:focus img,.ripGomb:hover img{border-color:#000;box-shadow:0 0 0 1px rgba(255,255,255,.3),inset 0 0 0 1px rgba(0,0,0,.6),0 18px 34px rgba(0,0,0,.6);filter:grayscale(0)}
.ripGomb.nincsCel:hover img{border-color:#14171c;box-shadow:0 0 0 1px rgba(255,255,255,.16),inset 0 0 0 1px rgba(0,0,0,.6),0 16px 32px rgba(0,0,0,.55);filter:grayscale(.4)}
.ripGomb:focus-visible{outline-color:#e7ecf3}
.ripName{color:#f4f7fb;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.avatarYears{display:block;margin-top:2px;font-size:13px;font-weight:700;letter-spacing:.08em;color:#c3ccd8;text-shadow:0 1px 2px rgba(0,0,0,.4)}
#deathsBrick .deathsList{list-style:none;margin:0;padding:0 0 8px;text-align:left}
.deathRow{position:relative;margin:0;padding:13px 6px 13px 76px;border-bottom:1px solid rgba(0,0,0,.3);box-shadow:0 1px 0 rgba(255,255,255,.08);font-size:14.5px;line-height:1.5;transition:background .25s ease,transform .25s ease,box-shadow .25s ease}
.deathRow:last-child{border-bottom:0;box-shadow:none}
.deathRow:hover{background:linear-gradient(90deg,rgba(255,255,255,.1),rgba(255,255,255,.015) 72%);transform:translateX(4px);box-shadow:inset 3px 0 0#c8d2df,0 1px 0 rgba(255,255,255,.08)}
.deathRow:last-child:hover{box-shadow:inset 3px 0 0#c8d2df}
.dtYear{position:absolute;left:2px;top:13px;display:block;width:60px;padding:8px 0 7px;border-radius:10px;border:1px solid rgba(0,0,0,.5);text-align:center;font-size:14.5px;font-weight:900;letter-spacing:-.3px;background:linear-gradient(160deg,#454e5c,#2a303a);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0-6px 12px rgba(0,0,0,.4),0 1px 0 rgba(255,255,255,.12);text-decoration:none;transition:transform .22s ease,box-shadow .22s ease}
.dtYear,a.dtYear,a.dtYear:link,a.dtYear:visited{color:#e7ecf3}
a.dtYear:hover{transform:scale(1.07);box-shadow:0 6px 16px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.2)}
.dtText{display:block;min-width:0}
.dtAge,.dtName{display:inline-block}
.dtName{font-size:16px;font-weight:900;letter-spacing:-.2px;text-decoration:none}
a.dtName,a.dtName:link,a.dtName:visited{color:#f4f7fb}
.deathRow.kiemelve .dtName,a.dtName:hover{color:#ffcf6b}
.dtAge{margin-left:8px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#b3bfce}
.dtBlurb{display:block;margin-top:3px;color:rgba(214,219,227,.85)}
.deathRow.kiemelve{background:linear-gradient(90deg,rgba(231,236,243,.26),rgba(255,255,255,.02) 72%);box-shadow:inset 4px 0 0#e7ecf3,0 0 24px rgba(0,0,0,.3);transform:translateX(5px)}
.deathRow.kiemelve .dtYear{transform:scale(1.07);box-shadow:0 8px 20px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.2)}
.brick>div#deathsBrick.honapBrick{padding-bottom:64px}
.dtLink{min-height:120px;position:relative;display:block;padding:14px 6px 14px 94px;text-decoration:none;color:inherit}
.honapBrick .deathRow{min-height:120px;padding:0}
.dtLink:focus-visible{outline:3px solid #e7ecf3;outline-offset:-3px;border-radius:12px}
.honapBrick .dtName{display:inline-block;color:#f4f7fb;transition:color .25s ease}
.honapSor:hover .dtName{color:#ffcf6b}
.honapSor:hover .dtArckep{border-color:#000;box-shadow:0 0 0 1px rgba(255,255,255,.3),0 10px 20px rgba(0,0,0,.6);transform:translateY(-2px);filter:grayscale(0)}
.honapSor:hover .dtNapSzam{color:#f4f7fb}
.honapSor:hover .dtYear{transform:scale(1.07);box-shadow:0 8px 20px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.2)}
.dtArckep,.dtNap{display:block;width:82px}
.dtNap{position:absolute;left:2px;top:14px;text-align:center;text-decoration:none}
.dtArckep{height:82px;border-radius:3px;object-fit:cover;border:5px solid #14171c;box-shadow:0 0 0 1px rgba(255,255,255,.16),0 8px 18px rgba(0,0,0,.45);filter:grayscale(.4);transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease,filter .25s ease}
.dtNapSzam{display:block;margin-top:6px;font-size:12px;font-weight:900;letter-spacing:.02em;color:#b3bfce;transition:color .25s ease}
.honapBrick .dtYear{position:static;display:inline-block;width:auto;margin-right:7px;padding:4px 9px 3px;font-size:12.5px;vertical-align:2px;transition:transform .22s ease,box-shadow .22s ease}
@media (max-width:430px){#deathsBrick{padding:46px 14px 64px;border-radius:185px 185px 18px 18px}
#deathsBrick:after{height:50px;background-size:104px 50px}
#deathsBrick h2{font-size:23px;letter-spacing:2px}
#deathsBrick h2:before{font-size:28px;letter-spacing:5px;text-indent:5px;margin-bottom:11px}
.deathRow{padding:11px 4px 11px 66px;font-size:13.5px}
.dtYear{width:54px;font-size:13px}
.dtName{font-size:15px}
.deathAvatar img{width:170px;height:170px;border-width:7px}
.dtLink,.honapBrick .deathRow{min-height:100px}
.dtLink{padding:12px 4px 12px 78px}
.dtNap{width:68px;top:12px}
.dtArckep{width:68px;height:68px;border-width:4px}
.dtNapSzam{margin-top:4px;font-size:11.5px}
}
.ismerteto{max-width:900px;margin:26px auto 34px;padding:30px 30px 26px;border:1px solid #ccd5e6;border-radius:18px;background:#fff;color:#414b63;font-family:Arial,Helvetica,sans-serif;font-size:16.5px;line-height:1.6;box-shadow:0 8px 22px rgba(38,63,111,.09)}
.ismerteto,.ismerteto *{box-sizing:border-box}
.ismerteto p,.ismertetoCim{margin:0 0 14px}
.ismertetoCim{padding-bottom:12px;border-bottom:3px solid #e4d5b0;font-size:30px;line-height:1.12;font-weight:900;letter-spacing:-.6px;color:#1b2a49}
.ismertetoAlcim{margin:30px 0 12px;padding-left:14px;border-left:5px solid #263f6f;font-size:21px;line-height:1.2;font-weight:900;letter-spacing:-.3px;color:#1b2a49}
.ismertetoBevezeto{font-size:18px;color:#3c4763}
.ismertetoKep{margin:0 0 16px}
.ismertetoHasonlat,.ismertetoKep img{border:1px solid #e4d5b0;border-radius:12px}
.ismertetoKep img{display:block;width:100%;height:auto}
.ismertetoHasonlat{position:relative;margin:0 0 20px;padding:14px 18px 14px 46px;border-left:5px solid #8a5a18;background:#faf4e4;font-size:16.5px;font-style:italic;color:#5c4a2a}
.ismertetoHasonlat:before{content:"“";position:absolute;top:6px;left:14px;font-family:Georgia,serif;font-size:42px;line-height:1;font-style:normal;color:#c9a15f}
.ismertetoSzamok{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 8px}
.szamKartya{flex:1 1 230px;display:block;padding:16px 18px;border:1px solid #ccd5e6;border-top:4px solid #263f6f;border-radius:12px;background:#f6f9fd}
.szamErtek{display:block;font-size:40px;line-height:1;font-weight:900;letter-spacing:-1.5px;color:#8a5a18}
.szamFelirat{display:block;margin-top:7px;font-size:13.5px;line-height:1.4;color:#5f6a85}
.teglaLista{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));align-items:start;gap:14px;margin:16px 0 8px}
.teglaKartya{padding:15px 17px 13px;border:1px solid #ccd5e6;border-left:4px solid #8a5a18;border-radius:12px;background:#f6f9fd}
.teglaKartya p{margin:0;font-size:15px;line-height:1.52;color:#4b5570}
.teglaCim{margin:0 0 7px;font-size:16.5px;line-height:1.25;font-weight:900;letter-spacing:-.2px;color:#263f6f}
.teglaUgro{position:relative;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.teglaUgro:focus-within,.teglaUgro:hover{transform:translateY(-2px);background:#eef4fc;box-shadow:0 8px 18px rgba(38,63,111,.16)}
.teglaUgro:focus-within{outline:2px solid #263f6f;outline-offset:2px}
.teglaUgro:active{transform:translateY(0);box-shadow:none}
.ismerteto .teglaLink,.ismerteto .teglaLink:hover{color:inherit;font-weight:inherit;text-decoration:none}
.teglaLink:focus{outline:0}
.teglaLink:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px}
.teglaUgro .teglaCim:after{content:"↑";display:inline-block;margin-left:7px;color:#8a5a18;font-size:15px;transition:transform .15s ease}
.teglaUgro:hover .teglaCim:after{transform:translateY(-3px)}
@media (prefers-reduced-motion:reduce){.teglaUgro,.teglaUgro .teglaCim:after{transition:none}
.teglaUgro:focus-within,.teglaUgro:hover,.teglaUgro:hover .teglaCim:after{transform:none}
#notableTimelineSection.kiemelve,#worldMapSection.kiemelve,#yearHomePicker.kiemelve,.brick.kiemelve>div,.countdownBand.kiemelve{animation:none;outline-color:rgba(138,90,24,.85)}
}
.ismertetoLista{margin:0 0 14px;padding:0;list-style:none}
.ismertetoLista li{position:relative;margin:0 0 9px;padding:0 0 0 30px}
.ismertetoLista li:before{content:"";position:absolute;top:.55em;left:8px;width:9px;height:9px;border-radius:50%;background:#9fb4d6}
.utPelda{display:inline-block;padding:1px 8px;border:1px solid #e4d5b0;border-radius:6px;background:#faf4e4;font-family:Consolas,Monaco,monospace;font-size:14.5px;color:#8a5a18;white-space:nowrap}
.ismertetoTabla{width:100%;margin:0 0 14px;border-collapse:collapse;font-size:15.5px}
.ismertetoTabla th{padding:11px 12px;border-bottom:2px solid #263f6f;text-align:left;font-size:12.5px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#263f6f}
.ismertetoTabla td{padding:11px 12px;border-bottom:1px solid #e0e8f4;vertical-align:top}
.ismertetoTabla tbody tr:nth-child(odd){background:#f6f9fd}
.ismertetoTabla td:last-child{font-weight:700;color:#8a5a18;white-space:nowrap}
.ismertetoGyik{margin-top:4px;padding:6px 0 0}
.gyikKerdes{margin:16px 0 6px;font-size:17px;line-height:1.3;font-weight:900;color:#263f6f}
.gyikKerdes:before{content:"?";display:inline-block;width:22px;height:22px;margin-right:9px;border-radius:50%;background:#263f6f;color:#fff;font-size:14px;line-height:22px;text-align:center;vertical-align:1px}
.gyikValasz{margin:0 0 14px;padding-left:31px;color:#4b5570}
.ismerteto a{color:#8a5a18;font-weight:700}
.ismerteto a:hover{color:#3b3222}
@media (max-width:640px){.ismerteto{margin:16px 10px 24px;padding:20px 16px 18px;font-size:15.5px}
.ismertetoCim{font-size:24px}
.ismertetoAlcim{margin-top:24px;font-size:19px}
.ismertetoBevezeto{font-size:16.5px}
.szamErtek{font-size:34px}
.ismertetoTabla{font-size:14px}
.ismertetoTabla td,.ismertetoTabla th{padding:9px 8px}
.ismertetoTabla td:last-child{white-space:normal}
.gyikValasz{padding-left:0}
}
@media screen and (max-width:430px){#breadcrumb{padding:57px 5px 10px;min-height:38px}
.home #header{padding:65px 5px 8px}
div#logoBrick{display:none}
.grid{overflow-x:hidden}
}

/* =====================================================================
   THE WORLD MAP PANEL

   Was map.css, a file of its own fetched only once the visitor scrolled
   this far. It now rides along with the rest of the stylesheet, so the
   frame is styled before the map section is anywhere near the window and
   the loader in index.php has one less thing to fetch. The panel is still
   only *filled* on demand - see initWorldMap() at the end of db.js.

   Everything lives inside #mapapp and every selector is namespaced, which
   is what let it merge in here without touching a line above:
     - no bare element selectors outside #mapapp
     - no html/body rules at all
     - custom properties are declared on #mapapp, not :root
   Layout is block / inline-block only - no flexbox, no grid.

   #mapapp fills the box the host page gives it (.worldMapFrame, which is
   position:relative and has a height of its own), rather than the window:
   the map is one panel of a long page, not a page of its own.
   ===================================================================== */

#mapapp{
  --map-ink:#000;
  --map-brown:#8a5a18;
  --map-navy:#123e73;
  --map-bg:#fff;
  --map-line:rgba(18,62,115,.22);
  --map-hover:rgba(18,62,115,.07);
  --map-mute:#63748c;
  --map-groove:#e8eef6;
  --map-mono:ui-monospace,Consolas,"SF Mono",Menlo,monospace;

  position:absolute;top:0;left:0;right:0;bottom:0;
  background:var(--map-bg);color:var(--map-ink);
  font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
}
#mapapp,#mapapp *{box-sizing:border-box}

/* ------------------------------------------------------------------ bar */
/* z-index so the bar's drop shadow falls on the map, not under it. */
#mapbar{position:absolute;top:0;left:0;right:0;z-index:5;
  background:linear-gradient(#fff 0,#f4f7fb 100%);
  border-bottom:1px solid var(--map-line);
  box-shadow:0 2px 12px rgba(18,62,115,.08);
  padding:10px 16px 9px;
  -webkit-user-select:none;user-select:none}

/* font-size:0 kills the whitespace between inline-blocks so the margins below
   are the only thing setting the gaps. Every child restores its own size. */
#maprow1{position:relative;text-align:center;font-size:0;min-height:32px}

#mapapp button{display:inline-block;vertical-align:middle;
  font:600 12px/1 var(--map-mono);letter-spacing:.02em;
  color:var(--map-navy);background:linear-gradient(#fff,#eff3f9);
  border:1px solid var(--map-line);border-radius:7px;padding:8px 10px;cursor:pointer;min-width:38px;
  transition:background .12s,color .12s,box-shadow .12s}
#mapapp button:hover{background:linear-gradient(#fff,#e2eaf6);color:#0b2c55;
  border-color:rgba(18,62,115,.38)}
#mapapp button:active{transform:translateY(1px)}
#mapapp button:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(18,62,115,.18)}

/*
  A stepper with nowhere left to go - see paintSteps() in map.js, which turns
  them off at the ends of the timeline. Written after the states above rather
  than with more weight than them: [disabled] and :hover tie on specificity, so
  the one further down the file is the one that lands.

  The two !importants are the exception to this stylesheet's rule of never
  raising its voice. The host page paints every disabled button on the site red
  - background-color and background-image, both !important - which is meant for
  a form that will not submit, not for a stepper at the end of a timeline. Only
  an !important can answer one, and specificity settles the rest: an id beats a
  bare attribute selector.
*/
#mapapp button[disabled],#mapapp button[disabled]:hover{
  color:#9fb0c6;border-color:rgba(18,62,115,.13);cursor:default;opacity:1;
  background-color:#f6f9fc!important;
  background-image:linear-gradient(#fbfcfe,#f3f6fa)!important}
#mapapp button[disabled]:active{transform:none}

/*
  The two pills that book-end row 1: the zoom toggle on the left, the way on to
  the year now on screen on the right. Both are 30px tall, the same as the
  steppers between them, and both read as solid navy so the pale segmented
  control in the middle is clearly the thing you scrub with.

  Written as #mapapp .mappill rather than .mappill because #mapapp button above
  would otherwise outrank it - and .mapon needs two classes for the same reason.
*/
#mapapp .mappill{
  height:30px;line-height:28px;padding:0 12px;min-width:0;
  font:700 11px/28px var(--map-mono);letter-spacing:.09em;text-transform:uppercase;
  text-decoration:none;white-space:nowrap;color:#fff;
  background:linear-gradient(#1d5290,#123e73);
  border:1px solid #0d2f5c;border-radius:7px;
  box-shadow:0 1px 3px rgba(18,62,115,.30);
  transition:background .12s,box-shadow .12s}
#mapapp .mappill:hover{background:linear-gradient(#24619f,#153f77);color:#fff;
  border-color:#0d2f5c;box-shadow:0 2px 8px rgba(18,62,115,.42)}
#mapapp .mappill:active{transform:translateY(1px)}
#mapapp .mappill:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(18,62,115,.25)}
/* Zoomed to 1:1: the same pill in sepia and pressed in, so the one control on
   the bar that latches says so in the map's other colour rather than in a
   darker navy nobody would read as a state. */
#mapapp .mappill.mapon{background:linear-gradient(#6d4611,#8a5a18);
  border-color:#573809;
  box-shadow:0 2px 5px rgba(45,28,4,.45) inset}
#mapapp .mappill.mapon:hover{background:linear-gradient(#7d5214,#9a661d);
  border-color:#573809;
  box-shadow:0 2px 5px rgba(45,28,4,.45) inset}
#mapapp .mappill.mapon:focus-visible{outline:none;
  box-shadow:0 2px 5px rgba(45,28,4,.45) inset,0 0 0 3px rgba(138,90,24,.30)}

/* The steppers read as one segmented control: borders collapse into each
   other and only the outer corners are rounded. */
.mapgrp{display:inline-block;vertical-align:middle;font-size:0;
  border-radius:7px;box-shadow:0 1px 2px rgba(18,62,115,.10)}
.mapgrp button{margin-left:-1px;border-radius:0}
.mapgrp button:first-child{margin-left:0;border-radius:7px 0 0 7px}
.mapgrp button:last-child{border-radius:0 7px 7px 0}
.mapgrp button:hover{position:relative;z-index:1}

/* The year reads navy like the rest of the bar, so sepia is left to mean one
   thing only: the zoom pill's latched state. Spelled out in hex rather than
   through the custom properties above. */
#mapyear{display:inline-block;vertical-align:middle;margin:0 10px;
  font:700 15px/1 ui-monospace,Consolas,"SF Mono",Menlo,monospace;letter-spacing:.05em;
  width:110px;text-align:center;color:#123e73;
  background:#fff;border:1px solid rgba(18,62,115,.22);border-radius:7px;padding:7px 4px;
  box-shadow:0 1px 2px rgba(18,62,115,.07) inset}
#mapyear:hover{border-color:rgba(18,62,115,.45)}
#mapyear:focus{outline:none;border-color:#123e73;
  box-shadow:0 0 0 3px rgba(18,62,115,.15)}

/* Both sides of row 1 ride the edges out of the normal flow so nothing can
   push the year off centre. The readout and the way on share the right
   corner; the options have the left one. */
#mapmeta{position:absolute;right:0;top:0;height:32px;line-height:32px;
  font:600 10px/32px var(--map-mono);letter-spacing:.10em;text-transform:uppercase;
  color:var(--map-mute);white-space:nowrap}
#mapmeta b{font-weight:700;letter-spacing:.04em;color:var(--map-brown)}
#mapmeta i{font-style:normal;color:var(--map-navy);opacity:0}
#mapbar.mapplaying #mapmeta i{opacity:1}

/* Takes the readout's place - same corner, same height as the steppers next to
   it - the moment the visitor travels away from the year the map opened on.
   Only ever one of the two is on screen, so the corner never grows. */
#mapback{position:absolute;right:0;top:1px;display:none}
#mapback.mapshow{display:inline-block}
#mapback b{font-weight:700;letter-spacing:.04em;color:#ffd9a3}
#mapback::after{content:'\2192';margin-left:8px;opacity:.75}

#mapopts{position:absolute;left:0;top:0;height:32px;line-height:32px;font-size:0}

.mapchk{display:inline-block;vertical-align:middle;margin-right:14px;
  font:600 10px/1 var(--map-mono);letter-spacing:.10em;text-transform:uppercase;
  color:var(--map-mute);cursor:pointer;white-space:nowrap}
.mapchk:hover{color:var(--map-navy)}
.mapchk input[type=checkbox]{vertical-align:middle;margin:0 6px 0 0;
  accent-color:var(--map-navy);cursor:pointer}

/* The blend slider, flat: no border, no shadow and no ring at any state, on
   the input itself or on either of its two pseudo-elements. */
.mapchk input[type=range]{-webkit-appearance:none;appearance:none;
  vertical-align:middle;width:78px;height:14px;margin:0 0 0 8px;
  background:transparent;border:0;box-shadow:none;cursor:pointer}
.mapchk input[type=range]:focus,
.mapchk input[type=range]:focus-visible{outline:none;box-shadow:none}
.mapchk input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;
  border:0;box-shadow:none;background:linear-gradient(90deg,#eae1d1,#8a5a18)}
.mapchk input[type=range]::-moz-range-track{height:4px;border-radius:2px;
  border:0;box-shadow:none;background:linear-gradient(90deg,#eae1d1,#8a5a18)}
.mapchk input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:12px;height:12px;margin-top:-4px;border-radius:50%;background:#8a5a18;
  border:0;box-shadow:none}
.mapchk input[type=range]::-moz-range-thumb{width:12px;height:12px;border-radius:50%;
  background:#8a5a18;border:0;box-shadow:none}

/* --------------------------------------------------------- timeline bar */
/*
  Geometry, top-down inside #maptrack (height 42):
      0..26  the real <input type=range>, transparent, sits over everything
      9..17  the groove, and the fill that tracks the thumb
     10..16  the change marks - one hairline per year that has a snapshot
      4..22  the thumb
     24..28  the tick line under each dated label
     29..40  the tick label itself, and the hover bubble that covers it

  #mapinner is inset by half a thumb on both sides, so a percentage inside it
  lands exactly where the browser puts the thumb for that value. Every mark,
  tick and bubble is positioned as a percentage of it - only the collision
  pass and the two pixel widths below have to be redone on resize.
*/
#maptrack{position:relative;height:42px;margin-top:9px}
/* Depth from the inset shadow alone - no ring around the outside. */
#mapgroove{position:absolute;left:0;right:0;top:9px;height:8px;border-radius:4px;
  background:var(--map-groove);
  box-shadow:0 1px 2px rgba(18,62,115,.14) inset}
#mapinner{position:absolute;left:9px;right:9px;top:0;bottom:0}

#mapfill{position:absolute;left:-9px;top:9px;height:8px;width:9px;border-radius:4px;
  background-image:linear-gradient(90deg,#b58c50 0,#8a6a53 38%,#2a5b96 78%,#123e73 100%);
  background-repeat:no-repeat;background-size:100% 100%;
  box-shadow:0 1px 3px rgba(18,62,115,.30)}

/* Network activity, on the bar's own bottom edge: no layout shift, visible at
   every width, and gone the moment the map has caught up. */
#mapbusy{position:absolute;left:0;right:0;bottom:-2px;height:3px;overflow:hidden;
  opacity:0;transition:opacity .25s;pointer-events:none}
#mapbar.mapbusy #mapbusy{opacity:1}
#mapbusy i{position:absolute;top:0;left:-38%;width:38%;height:3px;
  background:linear-gradient(90deg,rgba(18,62,115,0),var(--map-navy),rgba(18,62,115,0));
  box-shadow:0 0 6px rgba(18,62,115,.45);
  animation:mapsweep 1.15s ease-in-out infinite}
@keyframes mapsweep{
  0%{left:-38%}
  100%{left:100%}
}

#mapbar.mapplaying #mapfill{animation:mappulse 1.2s ease-in-out infinite}
@keyframes mappulse{
  0%,100%{box-shadow:0 1px 3px rgba(18,62,115,.30)}
  50%{box-shadow:0 1px 3px rgba(18,62,115,.30),0 0 10px 2px rgba(18,62,115,.35)}
}

#mapticks{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none}
#mapticks b{position:absolute;top:24px;padding-top:6px;transform:translateX(-50%);
  font:600 10px/1 var(--map-mono);letter-spacing:.04em;color:var(--map-mute);
  white-space:nowrap}
#mapticks b::before{content:'';position:absolute;left:50%;top:0;width:1px;height:4px;
  background:rgba(18,62,115,.30)}
#mapticks b.mapmajor{color:var(--map-navy);font-weight:700}
#mapticks b.mapmajor::before{height:6px;background:rgba(18,62,115,.55)}
#mapticks b.mapt0{transform:translateX(0)}
#mapticks b.mapt0::before{left:0}
#mapticks b.mapt1{transform:translateX(-100%)}
#mapticks b.mapt1::before{left:auto;right:0}

#mapbubble{position:absolute;top:22px;transform:translateX(-50%);
  font:700 10px/1 var(--map-mono);letter-spacing:.06em;color:#fff;
  background:var(--map-navy);border-radius:4px;padding:5px 7px;white-space:nowrap;
  box-shadow:0 2px 6px rgba(18,62,115,.35);
  pointer-events:none;opacity:0;transition:opacity .12s}
#mapbubble::before{content:'';position:absolute;left:50%;top:-4px;margin-left:-4px;
  width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-bottom:4px solid var(--map-navy)}
#mapbubble.mapshow{opacity:1}

/* The thumb, flat: the same no-border, no-shadow, no-ring treatment as the
   blend slider. It is a plain navy disc on a pale groove, which is contrast
   enough without a white rim and a drop shadow to lift it off. */
#mapslider{-webkit-appearance:none;appearance:none;display:block;
  position:absolute;left:0;top:0;width:100%;height:26px;margin:0;
  background:transparent;border:0;box-shadow:none;cursor:pointer}
#mapslider:focus,#mapslider:focus-visible{outline:none;box-shadow:none}
#mapslider::-webkit-slider-runnable-track{height:26px;border:0;box-shadow:none;
  background:transparent}
#mapslider::-moz-range-track{height:26px;border:0;box-shadow:none;
  background:transparent}
#mapslider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:18px;height:18px;margin-top:4px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#4b81c4 0,#123e73 72%);
  border:0;box-shadow:none}
#mapslider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#4b81c4 0,#123e73 72%);
  border:0;box-shadow:none}

/* -------------------------------------------------------------- viewport */
/* top is set from the bar's measured height in layout() - no magic number. */
#mapviewport{position:absolute;left:0;right:0;bottom:0;top:0;
  overflow:hidden;background:var(--map-bg)}
#mapviewport.mappan{overflow:auto;cursor:grab}
#mapviewport.mappan.mapdrag{cursor:grabbing}
/* Focusable so the arrow keys can drive the timeline - see the keydown
   handler in map.js, which only claims them while the focus is in here.
   Clicking the map counts as asking for them; tabbing to it says so out loud. */
#mapviewport:focus{outline:none}
#mapviewport:focus-visible{outline:2px solid var(--map-navy);outline-offset:-2px}

/* Block-level with a known width, so margin:0 auto centres it horizontally;
   layout() sets margin-top for the vertical half. */
#mapsizer{position:relative;margin:0 auto}
#mapstage{position:absolute;top:0;left:0;width:2000px;height:1140px;
  transform-origin:0 0;background:#8ba4c4}
#mapstage img{position:absolute;top:0;left:0;width:2000px;height:1140px;display:block;
  -webkit-user-drag:none;-webkit-user-select:none;user-select:none}
/* Holds the two overlay layers. Its opacity is the blend setting; the layers
   inside only ever dissolve between 0 and 1. */
#mapfade{position:absolute;top:0;left:0;width:2000px;height:1140px}
#mapfade img{transition:opacity .3s ease}
#mapareas2{opacity:0}

#maplabels{position:absolute;top:0;left:0;width:2000px;height:1140px;pointer-events:none}
#maplabels.mapoff{display:none}
#maplabels span{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;
  font:700 11px/1 Arial,Helvetica,sans-serif;color:#fff;
  text-shadow:1px 1px 0 #000,-1px 1px 0 #000,1px -1px 0 #000,-1px -1px 0 #000,0 0 3px rgba(0,0,0,.85)}
/* drawLabels() emits the copyright line last, so it is always the final span. */
#maplabels span:last-child{opacity:.5}

#maperr{position:absolute;top:0;left:0;right:0;bottom:0;z-index:30;display:none;
  padding:40px 30px;background:var(--map-bg);color:var(--map-ink);font-size:15px;line-height:1.7}
#maperr code{color:var(--map-brown);font-family:var(--map-mono)}

/*
  Row 1 gives way in two stages, because its two corners run out of room at
  very different widths: the options are three controls wide and start
  crowding the steppers just past 1000px, while the readout is one short line
  and is still comfortable at half that.

  First stage: the options take a centred line of their own above the
  steppers - source order, so no reordering is needed - and the readout drops
  to the bottom of the row, staying in its corner beside them.
*/
@media (max-width:1040px){
  #mapopts{position:static;display:block;height:auto;line-height:1;
    text-align:center;margin-bottom:10px}
  #mapmeta{top:auto;bottom:0}
  #mapback{top:auto;bottom:1px}
}

/* Second stage: no corner left worth keeping, so the readout goes and the way
   on takes a centred line of its own under the steppers. paintBack()
   re-runs layout() when it appears, because the bar getting taller moves the
   top of the map. The tick labels thin themselves out - cullTicks() measures. */
@media (max-width:760px){
  #mapmeta{display:none}
  #mapback{position:static;margin:9px auto 0;
    width:-webkit-max-content;width:max-content}
  #mapback.mapshow{display:block}
  .mapchk{margin:0 7px}
}
