body {
    background: url('bcg.jpg');
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    font-size: 16px;
    color: #545454;
    padding: 20px;
}
h1, .year {
    text-align: center;
    font-weight: bold;
    font-size: 32px;
    line-height: 1.2em;
    margin: 0;
}
h2 {
	font-size: 24px;
	text-align: center;
	margin: 0;
}

.year {
	margin-bottom: 30px;
}

a,
a:link {
	text-decoration: none;
	color: blue;
}

a:hover {
	color: purple;
}

.homelink {
	margin: auto;
	width: 200px;
	font-weight: bold;
    background: #e8ffe8;
    padding: 10px;
    display: block;
    text-align: center;
    border: 2px solid #a9bbfb;
    border-radius: 3px;
    margin-bottom: 20px;
}

.homelink:hover {
	background: #c2f9cc;
}

.contact {
	font-weight: bold;
	text-align: center;
	font-size: 18px;
	margin: 8px;
}

ul.nav  {
	list-style: none;
	display: flex;
	justify-content: center;
	padding: 0;
}

.nav a {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 18px;
}

p.details {
	text-align: center;
	font-weight: bold;
	font-size: 1.3rem;
	margin: 0;
}



#main {
    max-width: 1200px;
    margin: auto;
}

#main > div {
	background: #f8faff;
	padding: 16px;
	border-radius: 3px;
	max-width: 800px;
	margin: 20px auto;
}


.info {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	margin-bottom: 40px;
}

#main > .notice {
    background: #f3f7ff7a;
}


.talks ul {
	padding: 0;
	margin: 20px auto;
}

.talks li {
	display: flex;
	border-top: 1px solid #ececec;
	padding: 10px 0;
	flex-wrap: wrap;
}

.talks .date, 
.talks .links {
	flex-basis: 15%;
}

.talks .date {
	font-weight: bold;
}

.talks .speaker {
	flex-basis: 25%;
}

.talks .title {
	flex-basis: 60%;
	font-weight: bold;
}

.talks .abstract {
	font-weight: normal;
}

.talks .note,
.talks .links {
	flex-basis: 100%;
	padding-left: 40%;
	font-style: italic;
	margin-top: 0;
}


#main > .archive {
    width: 660px;
    padding: 10px 0;
    margin: 20px auto;
    background: #f3f7ff7a;
}

.archive ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}
.archive li {
    flex-basis: 110px;
}
.archive li a {
    font-weight: bold;
    text-decoration: none;
    display: block;
    padding: 3px;
}


.click-open {
    font-weight: bold; 
    cursor: pointer; 
    color: blue;
} 
.click-open:hover {
	color: purple;
}
.click-open:after {
    content: '►';
    margin-left: 5px;
}
.click-open.open:after {
    content: '▼';
}
.click-open + div {
    display:none; 
    margin-bottom: 20px;
}

.click-open.open + div {
    display: block;
}


@media only screen and (max-width: 600px) {
	.talks li {
		flex-wrap: wrap;
	}

	.talks .date, 
	.talks .links,
	.talks .speaker,
	.talks .title  {
		flex-basis: 100%;
		margin: 3px;
	}
}