main {
    display: flex;
    flex-direction: column;
	margin-top: var(--top-bar-height);
}

#header {
  background: #015d14;
}

#hero .hero-container {
	background-color: #008d1e;
	color: #fff;
	padding: 1em 20em 1em 20em;
}

.navbar li {
  margin-left: 1em;
  font-weight: 700;  
}

/*********************************
6. Input
*********************************/
.input
{
	width: 50%;
	margin-left: 50px;
	margin-right: 50px;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 125%;
/*	padding: 0 15vh 0 15vh	*/
}

.bushou
{
	width: 100%;
	padding-top: 50px;
	padding-bottom: 25px;
	font-size: 125%;
}

.browse
{
	width: 100%;
	padding-top: 25px;
	padding-bottom: 25px;
	font-size: 125%;
}

/*********************************
    Query
*********************************/

.word-item
{
	list-style-type: none;
	margin-left: 20px;
}

.query
{
	width: 70%;
	margin-left: 250px;
	margin-right: 250px;
	margin-top: 5px;
	padding-top: 5px;
	padding-bottom: 10px;
}

.query-record
{
	padding-top: 2em;
}

.ucs {
	height: 1.08em;
	margin-top: -0.15em;
}

.phonetic {
	font-family: "Arial Phonetic";
}

.img_thumbnail {
	width: 300px;
}

.img_detail {
	width: 1024px;
}

.finish {
	display: hidden;
}

.load-more {
	cursor: pointer;
}

:root {
    --footer-height: 80px;