body{
	font-family: 'Comic Sans Ms','微軟正黑體','Courier New';
	font-size: 12pt;
	margin: 0;
	width: 1340px;
	height:612px;
	background-image:url('../images/mainbackground---.jpg');
	background-repeat:no-repeat;
}

.page{
	background-image:url('');
	width: 1354px;
	height:625px;
	overflow: auto;
	border: 0px solid red;
	margin-top:150px;
}

nav{
	border: 0px solid blue;
	width: 25%;
	height:625px;
	background-image:url('../images/navbackground1--.png');
	font-size: 20pt;
	float:left;
	background-repeat:no-repeat;
}
nav ul.nav1{
	text-align: center;
	list-style: none;
}

nav ul.nav1 li{
	border: 0px solid gray;
	width: 195px;
	height:195px;
	border-radius: 100px;
	float:right;
	margin-right: 30px;
	margin-top: -16px;
	background-image:url('../images/tea.png');
	
}

nav ul.nav1 li a{
	display: block;
	width: 195px;
	height:195px;
	border-radius: 100px;
}

nav ul.nav1 li:hover{
	background-image:url(../images/tea1.png);
}

nav ul.nav2{
	text-align: center;
	list-style: none;
}

nav ul.nav2 li{
	border: 0px solid gray;
	width: 195px;
	height:195px;
	border-radius: 100px;
	float:right;
	margin-right: 140px;
	margin-top: -25px;
	background-image:url('../images/tea-222.png');
}

nav ul.nav2 li a{
	display: block;
	width: 195px;
	height:195px;
	border-radius: 100px;
}

nav ul.nav2 li:hover{
	background-image:url(../images/tea2.png);
}

nav ul.nav3{
	text-align: center;
	list-style: none;
}

nav ul.nav3 li{
	border: 0px solid gray;
	width: 195px;
	height:195px;
	border-radius: 100px;
	float:right;
	margin-right: -20px;
	margin-top: -85px;
	background-image:url('../images/tea-333.png');
}

nav ul.nav3 li a{
	display: block;
	width: 195px;
	height:195px;
	border-radius: 100px;
}

nav ul.nav3 li:hover{
	background-image:url(../images/tea3.png);
}

nav ul.nav4{
	text-align: center;
	list-style: none;
}

nav ul.nav4 li{
	border: 0px solid gray;
	width: 195px;
	height:195px;
	border-radius: 100px;
	float:right;
	margin-right: 120px;
	margin-top: -65px;
	background-image:url('../images/tea-444.png');
}

nav ul.nav4 li a{
	display: block;
	width: 195px;
	height:195px;
	border-radius: 100px;
}

nav ul.nav4 li:hover{
	background-image:url(../images/tea4.png);
}

.mainpage{
	border: 0px solid gray;
	width: 73%;
	height:98.55%;
	border-radius: 30px;
	background-color: rgba(255,255,255,0);
	margin-left:350px;
	text-align: center;
}

footer{
	width: 100%;
	margin-right: 10px;
	text-align: right;
	font-size: 12pt;
	color: rgb(50,50,50);
	font-size: 8pt;
	border: 0px solid gray;
	background-color:rgb(185,122,87);
}