:root{--background:white;--text-color:black;--dark-bg:#121212;--dark-text-color:#ffffffa1;--dark-button-bg:#333333}body.dark-theme{background-color:var(--dark-bg);color:var(--dark-text-color)}body.dark-theme .nav-button{color:var(--dark-text-color);background-color:var(--dark-button-bg)}body.dark-theme .nav-button:hover{box-shadow:0 0}body.dark-theme li{background-color:#292929;border-color:#292929;color:hsl(calc(var(--hue)*360/20),50%,65%)}body.dark-theme a{color:var(--dark-text-color)}body.dark-theme .single-card{box-shadow:0 0;background-color:#292929}body{color:var(--text-color);background-color:var(--background);font-family:monospace;line-height:1.5;margin:auto;max-width:768px}.single-card{box-shadow:0 2px 4px grey;padding:1rem;border:none}main{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:20dvh;min-height:100dvh}.header-buttons{box-sizing:content-box;margin:2rem}header{height:fit-content;display:flex;justify-content:space-between;flex-direction:row-reverse}footer{border-top:1px solid #222;margin-top:1rem}a{text-decoration:none;color:var(--text-color)}.buttons{display:flex;gap:1rem}.nav-button{color:var(--text-color);text-decoration:none;text-align:center;padding:.5rem;width:7rem;height:1rem;background-color:var(--background);border:1px solid var(--text-color);border-radius:4px;font-size:12px}.nav-button:active{box-shadow:2px 2px}button:active{box-shadow:2px 2px}ol{margin:0;list-style:none;padding:0;--hue:1;--unit:1rem}.event-date{margin:0 0 .25rem;font-weight:700}.event-description{margin:0}li{--height:7rem;position:relative;display:block;background-color:hsl(calc(var(--hue)*360/20),90%,65%);border-color:hsl(calc(var(--hue)*360/20),90%,65%);padding:1rem;margin:2rem 0;color:#000}li::before{content:"";background-color:inherit;position:absolute;display:block;width:var(--unit);height:var(--unit);top:100%;left:calc(50% - (var(--unit)/2))}li::after{content:"";position:absolute;display:block;top:calc(100% + var(--unit));left:calc(50% - (var(--unit)));border:var(--unit)solid transparent;border-top-color:inherit}li:last-child::before,li:last-child::after{content:none}li:nth-child(20n+1){--hue:20}li:nth-child(20n+2){--hue:19}li:nth-child(20n+3){--hue:18}li:nth-child(20n+4){--hue:17}li:nth-child(20n+5){--hue:16}li:nth-child(20n+6){--hue:15}li:nth-child(20n+7){--hue:14}li:nth-child(20n+8){--hue:13}li:nth-child(20n+9){--hue:12}li:nth-child(20n+10){--hue:11}li:nth-child(20n+11){--hue:10}li:nth-child(20n+12){--hue:9}li:nth-child(20n+13){--hue:8}li:nth-child(20n+14){--hue:7}li:nth-child(20n+15){--hue:6}li:nth-child(20n+16){--hue:5}li:nth-child(20n+17){--hue:4}li:nth-child(20n+18){--hue:3}li:nth-child(20n+19){--hue:2}li:nth-child(20n+20){--hue:1}@media(max-width:492px){.buttons{flex-direction:column}header{flex-direction:column-reverse}.header-buttons{margin:.4rem 0 0 .2rem}.single-card{margin:.5rem}}@media(min-width:500px) and (max-width:899px){li{margin:1rem;width:calc(50% - 4rem);float:left;min-height:var(--height)}li:nth-child(4n+3),li:nth-child(4n+4){float:right}li:nth-child(4n+1)::before{top:calc(var(--height)/2 + var(--unit)/2);left:100%}li:nth-child(4n+1)::after{top:calc(var(--height)/2);left:calc(100% + (var(--unit)));border:var(--unit)solid transparent;border-left-color:inherit}li:nth-child(4n+3)::before{top:calc(var(--height)/2 + var(--unit)/2);left:-1rem}li:nth-child(4n+3)::after{top:calc(var(--height)/2);left:-3rem;border:var(--unit)solid transparent;border-right-color:inherit}}@media(min-width:900px){li{margin:1rem;width:calc(33.33% - 4rem);float:left;min-height:7rem}li:nth-child(6n+4),li:nth-child(6n+5),li:nth-child(6n+6){float:right}li:nth-child(6n+1)::before,li:nth-child(6n+2)::before{top:calc(var(--height)/2 + var(--unit)/2);left:100%}li:nth-child(6n+1)::after,li:nth-child(6n+2)::after{top:3.5rem;left:calc(100% + (var(--unit)));border:var(--unit)solid transparent;border-left-color:inherit}li:nth-child(6n+4)::before,li:nth-child(6n+5)::before{top:calc(var(--height)/2 + var(--unit)/2);left:-1rem}li:nth-child(6n+4)::after,li:nth-child(6n+5)::after{top:calc(var(--height)/2);left:-3rem;border:var(--unit)solid transparent;border-right-color:inherit}}