body { font-family: "Lato", sans-serif; padding-top: 40px; }
header { background-image: url("CUHKNight.jpg"); background-repeat: no-repeat; background-size: 100%; background-position: 50% 43%; color: white; min-height: 220px; }
@media (max-width: 767px) { header { background-size: 768px; } }
header div { padding-top: 1em; }
h1 { font-weight: 300; font-size: 160%; text-align: center; color: white; }
h2:first-of-type { margin-top: 0; }
h2 { font-weight: 400; font-size: 140%; margin-top: 1em; }
h3 { font-weight: 300; font-size: 120%; margin-top: .5em; }
nav { background-color: #512957; }
a { color: #91499C; }
a:hover, a:focus { color: #C797CE; text-decoration: none; }
.navbar { font-weight: 300; }
.navbar > .container { padding-top: 0; }
.nav { display: flex; }
.navbar .nav-item { float: none; flex-shrink: 1; }
.nav > li > a { color: white; }
.nav > li > a:hover { color: #C797CE; }
#content { margin: 1em auto 1em auto; }
.home-workshop-item, .home-seminar-header { display: flex; flex-wrap: wrap; justify-content: space-between; }
.home-workshop-date, .home-seminar-date, .home-seminar-type { font-weight: 300; }
/* .home-seminar-title, .home-seminar-speaker { border-left-color: #512957; border-left-width: 2px; border-left-style: solid; padding-left: 1em; } */
.home-seminar-speaker { margin-bottom: 1em; }
.people-block { display: flex; margin-bottom: 1em; }
.people-photo { vertical-align: top; }
.people-photo-box { height: 110px; width: 75px; }
.people-desc { margin-left: 1em; }
.interests { font-size: small; color: rgb(139, 123, 139); margin-top: 1em; }
.panel { margin-bottom: .5em; }
.panel-heading { display: flex; text-align: center; }
.panel-heading hr { border-color: #ECDCEF; border-style: solid; border-width: 1px; flex-grow: 10; }
.panel-heading h2 { flex-grow: 1; }
/* .panel-heading:hover { background-color: #ECDCEF; } */
.panel-body { padding: .5em 0; }
/* @media (max-width: 767px) { .panel-body { padding: .5em; } } */
.workshop-date, .seminar-date, .visitor-date { vertical-align: top; text-align: right; padding-right: 1em; font-weight: 300; }
.seminar-type { font-weight: 300; }
.course-time { font-weight: 300; text-align: right; }
.visitor-name { font-weight: bold; }
.workshop-table td, seminar-table td, .visitor-table td { vertical-align: top; }
footer { background-color: #512957; color: white; padding: 1em 0 1em 0; font-weight: 300; }
footer a { color: white; }
.contacts { display: flex; flex-wrap: wrap; justify-content: space-between; }
.contact-icon { font-size: 120%; width: 1em; text-align: center; vertical-align: middle; }
.section-icon { padding-right: 1ex; }