body { background-color: #f0f0f0; }

body * { box-sizing: border-box; font-family: "Noto Sans TC", Arial, sans-serif; }

#app { width: 1280px; margin: 0 auto; padding: 70px 60px; }

select { border: 3px solid #000; width: 350px; height: 56px; font-size: 16px; padding-left: 4%; font-weight: bold; }

.theme-header { display: flex; justify-content: space-between; align-items: flex-end; }

.theme-header .md-header h1 { font-size: 40px; font-weight: bold; line-height: 2; }

table { border-collapse: collapse; }

table td { width: 122px; height: 54px; text-align: center; border: 3px solid #000000; background-color: #fff; vertical-align: middle; }

.aqi1 { background: #95F084; }

.aqi2 { background: #FFE695; }

.aqi3 { background: #FFAF6A; }

.aqi4 { background: #FF5757; }

.aqi5 { background: #9777FF; }

.aqi6 { background: #AD1774; }

h2 { display: flex; margin: 30px 0; position: relative; justify-content: space-between; align-items: center; }

h2 hr { border: 2px dotted #000; flex: 1 1 auto; margin: 0 20px; }

h2 .city { position: relative; font-size: 36px; font-weight: bold; flex: 0 0 auto; background: #f0f0f0; }

h2 .update { flex: 0 0 auto; }

.md-site { display: flex; }

.md-site .show { flex: 1; }

.md-site .show .site { margin: 0; }

.md-site .show ul { width: 350px; padding: 30px; border: 3px solid #000; border-top: 0px; background: #fff; }

.md-site .show ul li { display: flex; align-items: flex-end; justify-content: space-between; padding: 20px 0; font-size: 24px; font-weight: bold; border-bottom: 1px solid #000; }

.md-site .show ul li .en { font-size: 16px; font-weight: normal; flex: 1 1 auto; margin-left: 5px; }

.md-site .show ul li:last-child { flex: 0 0 auto; }

.item { flex: 2; }

.item ul { display: flex; flex-wrap: wrap; align-content: stretch; }

.site { display: flex; margin-left: 30px; width: 350px; margin-bottom: 30px; justify-content: space-around; border: 3px solid #000; }

.site span { display: block; text-align: center; width: 100%; line-height: 95px; }

.site span.name { font-size: 36px; font-weight: bold; background-color: #fff; }

.site span.aqi { font-size: 48px; font-weight: bold; }

.site span:not(:last-child) { border-right: 3px solid #000; }
