:root {
	font-size: 16px;
}
@font-face {
	font-family: 'Kanit-Bold';
	src: url('../style/font/Kanit-Bold.ttf');
}
@font-face {
	font-family: 'Stack-Sans-Regular';
	src: url('../style/font/StackSansText-Regular.ttf');
}
@font-face {
	font-family: 'Stack-Sans-Bold';
	src: url('../style/font/StackSansText-Bold.ttf');
}
@font-face {
	font-family: 'Stack-Sans-Light';
	src: url('../style/font/StackSansText-Light.ttf');
}
@font-face {
	font-family: 'Stack-Sans-ExtraLight';
	src: url('../style/font/StackSansText-ExtraLight.ttf');
}

body {
	margin: 0;
	padding: 0;
	background-color: #fff;
}

div.site-container {
	width: 100vw;
	
	@media (min-width: 1000px) {
		width: 1000px;
		margin: 0 auto;
	}
}

div.banner {
	padding: 0.5rem;
	background-color: transparent;
	font-family: 'Stack-Sans-Regular', sans-serif;
	font-size: 0.8rem;
	text-align: center;
}

header {
	width: 100%;
	display: flex;
	flex-direction: row;
	box-shadow: 0 1px 20px #ddd;
	background-color: #fff;
}

header img {
	width: 200px;
}

nav {
	margin: auto;
	width: 100%;
	align-content: bottom;
}

nav > ul {
	list-style-type: none;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	align-content: center;
	
	@media (min-width: 1000px) {
		flex-wrap: nowrap;
	}
}

nav > ul > li {
	flex: 1 1 auto;
	margin: 0;
	text-align: center;
}

nav > ul > li > a {
	font-family: 'Kanit-Bold';
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
	color: #333;
	font-size: 1.5rem;
	text-decoration: none;
}

nav > ul > li > a:hover {
	cursor: pointer;
	text-decoration: underline;
	text-decoration-color: #4ea1da;
	text-decoration-thickness: 0.1875rem;
}

nav > ul > li > a.active {
	text-decoration: underline;
	text-decoration-color: #4ea1da;
	text-decoration-thickness: 0.1875rem;
}
	
footer {
	padding: 1.0rem;
	font-family: 'Stack-Sans-ExtraLight';
	font-size: 0.7em;
	color: #111;
	text-align: center;
	align-content: center;
}

main {
	display: flex;
	flex-direction: column;
}

section > h1 {
	font-family: 'Kanit-Bold';
	font-weight: normal;
	text-transform: uppercase;
	color: #4ea1da;
	font-size: 1.5rem;
	margin: 1.0rem;
	text-shadow: 1px 1px 2px #ccc;
}
	
section p {
	font-family: 'Stack-Sans-Regular';
	font-size: 1.0rem;
	padding: 1.5rem;
	color: #222;
	border-radius: 0.5rem;
	background-color: #eee;
	margin: 1.0rem;
	box-shadow: 1px 2px 5px #ddd;
}

section > ul {
	font-family: 'Stack-Sans-Regular';
	font-size: 1.0rem;
	padding: 1.5rem;
	color: #222;
	border-radius: 0.5rem;
	background-color: #eee;
	margin: 1.0rem;
	list-style-position: inside;
	list-style-type: circle;
	box-shadow: 1px 2px 5px #ddd;
}

section figure {
	margin: 1.0rem;
	flex: 1 1 250px;
	text-align: center;
}

section img {
	height: 30vh;
	border-radius: 0.5rem;
	box-shadow: 1px 2px 10px #999;
	border: 2px solid #111;
}

section figure.large img {
	width: 90vw;
	height: initial;
	border-radius: 0.5rem;
	box-shadow: 1px 2px 10px #999;
	border: 2px solid #111;
	
	@media (min-width: 1000px) {
		height: 80vh;
		width: initial;
	}
}

section figcaption {
	font-family: 'Stack-Sans-ExtraLight';
	font-size: 0.8rem;
	color: #000;
}

div.generic-flex-row {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

div.conference-registration-banner {
	background-color: #fc0;
	text-align: center;
	border-radius: 0.5rem;
}

a.conference-registration-link {
	font-family: 'Kanit-Bold', sans-serif;
	font-size: 2.0rem;
}