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

nav{
	border: 0px solid blue;
	width: 25%;
	height:620px;
	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: 160px;
	height:160px;
	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: 160px;
	height:160px;
	border-radius: 100px;
}

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

.page{
	overflow: auto;
	border: 0px solid red;
	width:1340px;
}

header{
	margin:10px;
	background-color:rgba(255,255,255,0.4);
	border-radius: 30px;
}

.h1{
	width:950px;
	float:right;
	margin-right:10px;
	border-radius: 30px 30px 0 0;
	background-color:rgba(255,255,255,0.4);
	border: 5px solid rgb(239,161,24);
	
}


.text{
	width:950px;
	height:400px;
	
	float:right;
	margin: 10px 10px 0 0;
	margin-left:-100px;
	border-radius: 0 0 30px 30px;
	border: 1px solid red;
	padding:0px;
}

.mainpage{
	border: 0px solid gray;
	background-repeat:no-repeat;
	background-position:right center;
	height:612px;
	margin:5px 10px 0 0;
	background-image:url('../images/white-round2.png');
}



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);
}