body { background-color: white; color: black; font-family: Helvetica, Arial, sans-serif; font-size: 0.8em; margin: 4em 1em 4em 2em; }
h1 { font-size: 2em; }
h1. h2 { margin-bottom: 0.2em; }
h1 a, h2 a { text-decoration: none; }
a { color: black; }
img { vertical-align: middle; }
button { background-color: transparent; border: none; cursor: pointer; }
select { width: 15em; font-size: .9em; min-height: 1em; margin: 0; color: black; border: 1px solid black; outline: none; }
blockquote { font-style: italic; }
svg { vertical-align: middle; }
svg line { stroke: black; }
svg text { fill: #888; font-size :0.75em; }

#flexbox { display: flex; flex-wrap: wrap; }
#left { flex: auto; margin-right: 2em; }
#logo { height: 25px; }
#right { width: 34em; }

table { margin-bottom: 1em; }
th { white-space: nowrap; padding: 1px 0.5em 0px 0.5em; }
td { white-space: nowrap; padding: 0px 0.5em 0px 0.5em; }
tr:nth-child(even) { background: #eee; }
tr:nth-child(odd) { background: white; }

#header a { font-weight: bold; }

#portfolio td:nth-child(2), #portfolio td:nth-child(n+4) { text-align: right; }

#market_trends ol { column-width: 16em; padding: 0; }
#market_trends li { list-style-type: none; white-space: nowrap; height: 1.2em; }
#market_trends span { display: inline-block; width: calc(100% - 85px); overflow: hidden; text-overflow: ellipsis; vertical-align: middle; margin-right: 0.5em; }
#market_trends img[src$=".svg"] { vertical-align: top; }
#market_trends button { font-size: 0.75rem; }

#sentiment img#sentiment_image { border-radius: 20px; width: 100%; }
#sentiment td { text-align: right; }
#tradinghours td:nth-child(1) { text-align: right; }
#holidaycalendar td:nth-child(1) { text-align: right; }
#information td:nth-child(1) { text-align: right; }
#information td:nth-child(2) { white-space: normal; }
#sticker img { width: 100%; border-radius: 20px; }

#details td:nth-child(1) { text-align: right; }
#trends td { text-align: right; }

#comet img { width: 100%; }
#comet td { text-align: right; }
#comet td:nth-child(3n+3) { background: white; }

#comet_flex { display: flex; flex-wrap: wrap; }
#comet_table { flex: auto; margin-right: 2em; }

#legend { width: 34em; }
#legend img { width: 100%; }


#company_profile { max-width: 800px; min-width: 400px; }
#metrics td:nth-child(1) { text-align: right; }
#financials td { text-align: right; }
#financials .graph { width: 240px; }
#correlation td:nth-child(3) { background: white; }

#report td:nth-child(1) { text-align: right; }

.trend { width: 16px; height: 16px; }

.indices { display: inline-block; text-align: center; }
.indices a { text-decoration: none; }
.indices .country_icon { width: 80px; margin-bottom: 0.25em; }

.graph { width: 100%; box-sizing: border-box; }
.graph .seperator { stroke: #bbb; }
.graph .sep_axis { stroke: #b88; }
.graph .seperator, .graph .sep_axis { stroke-width: 1; stroke-linecap: round; stroke-dasharray: 2,2; }

@media (prefers-color-scheme: dark) {
	body { background-color: black; color: white; }
	button { color: white; }
	a { color: white; }
	tr:nth-child(even) { background: #333; }
	tr:nth-child(odd) { background: black; }
	svg, img[src$=".svg"] { filter: invert(1); }
	.button { border-color: white; }
	.trend, #logo { filter: none !important; }
	#correlation td:nth-child(3) { background: black; }
	#comet td:nth-child(3n+3) { background: black; }
}