body {
	margin: 0px;
	padding: 0px;
	font-family: Thonburi;
	font-size: 62.5%;
	background: rgb(95,136,198);
}

.main {
	height: 4em;
	background: linear-gradient(to right, rgb(95, 136, 198),
	rgb(153, 189, 233));
	color: white;
}

header {
	width: 100%;
	top: 0;
}

.context {
	
}

.main div {
	height: 4em;
	float: left;
	margin: 0 auto;
}

.main .theme {
	width: 60%;
	text-align: center;
}

.main .theme .cn {
	line-height: 2em;
	font-size: 2.2em;
}

.header .theme .en {
	font-size: 0.8em;
}

.main .en, .menu {
	width: 20%;
}

.main .en img {
	position: relative;
	left: 0.5em;
	top: 0.5em;
	width: 3em;
	height: 3em;
}

.main .menu {
	text-align: right;
}

.main .menu span span {
	width: 3em;
	height: 0.2em;
	display: block;
	margin-bottom: 0.5em;
	background-color: white;
}

.main .menu .menu-btn {
	float: right;
	width: 3em;
	display: block;
	position: relative;
	top: 35%;
	right: 1em;
}

.menu-list-gradient {
	background: linear-gradient(to right, rgb(95, 136, 198),
		rgb(153, 189, 233));
}

.menu-list {
	height: 2em;
	color: white;
	border-top: 0.05em solid rgb(204, 222, 244);
	font-size: 1.4em;
	text-align: center;
	line-height: 1.8em;
}

.menu-selected {
	background-color: rgb(204, 222, 244);
	border-top: 0.1em solid rgb(204, 222, 244);
}

footer {
	height: auto;
	background: linear-gradient(to right, rgb(95, 136, 198),
		rgb(153, 189, 233));
	color: white;
	text-align: center;
}

footer .link-controll {
	margin-top: 2em;
	font-size: 1.6em;
}

footer label {
	display: inline-block;
}

footer .link-controll a {
	color: white;
	text-decoration: none;
}

footer .link-controll a:ACTIVE {
	color: white;
}

footer .copyright-cn {
	margin-top: 2.2em;
	font-size: 1.2em;
}

footer .copyright-en {
	font-size: 1em;
}

.verify {
	font-size: 1em;
	margin: 30px 0px 40px 0px;
}

.content {
	width: 100%;
}

.choose-subkey {
	width: 100%;
	/* height: 17em; */
	color: white;
}

.choose-subkey {
	background: rgb(95, 136, 198);
}

.split{
 position: relative;
  top: 3em;
  display: block;
  width: 100%;
  height: 0.1em;
  background: rgb(67, 118, 191);
}

.choose-subkey .subtitle {
	display: inline-block;
	font-size: 2em;
	width: 100%;
	text-align: center;
}

.choose-subkey .go-back {
	width: 4em;
	height: 2em;
	display: block;
	position: relative;
	top: 1.7em;
	left: 1em;
}

.choose-subkey .go-back img {
	width: 2em;
	height: 2em;
}

.function {
	height:12em;
}

.temperature-type{
	display: none;
}

.temperature-type ul{
	padding: 0em;
}
.temperature-type ul li{
	height:2em;
	width:33%;
	font-size:1.4em;
	color:rgb(204,222,244);
	list-style: none;
	float: left;
	text-align: center;
	
}
.wind-type{
	display: none;
}

.wind-type ul{
	padding: 0em;
}

.wind-type ul li{
	height:2em;
	width: 24.5%;
	font-size:1.4em;
	color:rgb(204,222,244);
	list-style: none;
	float: left;
	text-align: center;
}

.function ul {
	padding: 0em;
	width: 100%;
	height: 3em;
}

.function ul li {
	border: 1px solid rgb(95, 136, 198);
	border-radius: 0.5em;
	height: 2em;
	width: 18.5%;
	margin-left: 0.1em;
	line-height: 2em;
	vertical-align: middle;
	text-align: center;
	list-style: none;
	float: left;
	font-size: 1.8em;
	color: rgb(204, 222, 244);
}

.data-type{
	border-bottom: 0.1em solid rgb(67, 118, 191);
}
.data-type ul{
	padding: 0em;
	width: 100%;
	height: 2em;
}
.data-type ul li{
	height: 2em;
	width: 15.3%;
	margin-left: 0.1em;
	text-align: center;
	list-style: none;
	float: left;
	font-size: 1.4em;
	color:rgb(204,222,244);	
}

.rain-type{
	display: block;
}
.rain-type ul{
	padding: 0em;
	width: 100%;
}
.rain-type ul li{
	height: 2em;
	width: 13.5%;
	margin-left: 0.1em;
	text-align: center;
	list-style: none;
	float: left;
	font-size: 1.4em;
	color:rgb(204,222,244);	
}
.panel {
	width: 100%;
	background: rgb(95, 136, 198);
	color: white;
}

.panel div ul {
	padding: 0em;
	margin: 0em;
}

.panel div ul li {
	background:rgb(95,136,198);
}

.panel span {
	
}

.panel .temperature {
	height: 3em;
}

.panel .temperature li {
	height: 3em;
	line-height: 3em;
	vertical-align: middle;
	list-style: none;
	float: left;
	width: 33%;
	text-align: center;
	font-size: 1.4em;
}

.panel .wind {
	display: none;
	height: 3em;
}

.panel .wind li {
	height: 3em;
	line-height: 3em;
	vertical-align: middle;
	list-style: none;
	float: left;
	width: 25%;
	text-align: center;
	font-size: 1.4em;
}

.panel .autostation {
	display: none;
	height: 3em;
}

.panel .autostation li {
	height: 3em;
	line-height: 3em;
	vertical-align: middle;
	list-style: none;
	float: left;
	width: 50%;
	text-align: center;
	font-size: 1.4em;
}

.panel .area {
	display: none;
	height: 22em;
}

.panel .area li {
	height: 2.5em;
	line-height: 2.5em;
	vertical-align: middle;
	list-style: none;
	float: left;
	width: 20%;
	text-align: center;
	font-size: 1.4em;
}

.data-box-0 {
	width: 100%;
}

.data-box-0 img {
	width: 100%;
	/* height: 100%; */
}

.data-box {
	width: 100%;
}

.data-box img {
	/* width: 100%;
	height: 100%; */
}

.controller {
	width: 100%;
}

.controller ul {
	padding: 0;
	margin: 0;
	height: 4em;
}

.controller ul li {
	float: left;
	width: 33%;
	height: 3em;
	list-style: none;
	display: block;
}

.controller ul li img {
	width: 2em;
	height: 2em;
	display: block;
	margin: 1em auto;
}


.menu-choose-box{
	height: 42em;
	width:100%;
	background: rgb(255,255,255);
}
.menu-choose-box ul{
	padding: 0;
}
.menu-choose-box ul li{
	float: left;
	width: 49%;
	list-style: none;
	text-align: center;
	margin-top:0.5em;
}
.menu-choose-box ul li img{
	margin:0.5em auto;
	display:block;
	width: 8em;
	height: 8em;
}	
.menu-choose-box ul li span{
	font-size:2em;
		color:rgb(88,89,91);
}
.menu-choose-box ul li span:last-child{
	font-size:1.2em;

}
