body{
	background: -webkit-linear-gradient(left, rgba(30,87,153,0) 0%,rgba(30,87,153,0.8) 15%,rgba(30,87,153,1) 19%,rgba(30,87,153,1) 20%,rgba(41,137,216,1) 50%,rgba(30,87,153,1) 80%,rgba(30,87,153,1) 81%,rgba(30,87,153,0.8) 85%,rgba(30,87,153,0) 100%); /* Chrome10+,Safari5.1+ */
	font-family: 'Comic Sans MS','新細明體','Courier New';
	color: rgba(20,20,20); 
	font-size: 12pt;
}

.page{
	width:1000px;
	margin: 0 auto 0 auto;
	background-color: rgb(255,255,255);
	padding: 10px;
	background-attachment: scroll; 
	background-image: url(../images/good1.png);
	background-repeat: no-repeat;
	background-position: 80% 85%;
	box-shadow: 0 0 5px 5px black;
	overflow: auto;
}

header{
	width: 96%;
	background-color: rgb(255,255,255);
	
	border-radius: 10px;
	margin: 0 auto 0 auto;	
	text-align: center;
}
.new{
    width: 90%;
	border: 0px solid gray ;/* 寬度 形狀 顏色 */
	margin-left: 30px;
	text-align: center;
	position: relative;
	z-index: 100;
}

.new  ul{
padding: 1;
margin: 1 auto 1 auto;
}
.new ul li{
		display: inline-block;
		width: 18%%;
		text-align:center;
		padding: 1px;
		margin: -6px;
	}


nav {
	width: 20%;
	min-height: 300px;
	margin-top: 45px;
	background-color: rgb(255,255,255);
	border: 0px dashed black;
	border-radius: 10px;
	float: left;
	
}

.menu{
	width: 98%;
	min-height: 250px;
	border: 0 solid gray;
	margin: 0 auto 0 auto;
}

.content{
	width: 75%;
	float: right;
	min-height: 100px;
	margin: 10px;
	border: 10px dotted black;
	border-radius: 10px;
	background-color: rgba(255,255,255,0.7);
}

.ul ul{
	width: 90%;
	list-style-type:none;
	padding: 0;
}

.ul li{
	width: 80%;
	background-color: rgb(170,86,239);
	color: white;
	padding: 5px;
	border-top: 2px solid darkblue;
	border-left: 2px solid darkblue;
	border-right: 2px solid white;
	border-bottom: 2px solid white;
}

.ul li:hover{
	background-color: rgb(197,138,244);
	border-top: 2px solid white;
	border-left: 2px solid white;
	border-right: 2px solid darkblue;
	border-bottom: 2px solid darkblue;
}

.ul ul li a{
	display: block;
	text-decoration: none;
	color: white;
}

footer{
	width: 100%;
	text-align: right;
	border-top: 5px dotted black;
	margin-right: 10px;
	margin: 0 auto 0 auto;
	float: right;
}
.strike{
	width:60px;
	height:60px;
	margin:0px auto;
	border:6px solid #333;
	border-radius:50%;
	background-size:30px 30px;
	background-repeat:no-repeat;
	background-position:
		left top,
		right top,
		right bottom,
		left bottom;
	background-image:
	-moz-radial-gradient(25px 25px, circle farthest-side, rgba(82,220,235,1) 70%,rgba(82,220,235,1) 95%),
	-moz-radial-gradient(0px 25px, circle farthest-side,rgba(0,0,0,1) 70%,rgba(80,80,80,1) 95%),
	-moz-radial-gradient(0px 0px, circle farthest-side,rgba(82,220,235,1) 70%,rgba(82,220,235,1) 95%),
	-moz-radial-gradient(25px 0px, circle farthest-side,rgba(0,0,0,1) 70%, rgba(80,80,80,1) 95%);
	background-image:
	-webkit-radial-gradient(25px 25px, circle farthest-side, rgba(82,220,235,1) 70%,rgba(82,220,235,1) 95%),
	-webkit-radial-gradient(0px 25px, circle farthest-side,rgba(0,0,0,1) 70%,rgba(80,80,80,1) 95%),
	-webkit-radial-gradient(0px 0px, circle farthest-side,rgba(82,220,235,1) 70%,rgba(82,220,235,1) 95%),
	-webkit-radial-gradient(25px 0px, circle farthest-side,rgba(0,0,0,1) 70%, rgba(80,80,80,1) 95%);
	box-shadow:0 0 5px #FFFFFF;}
.strike:hover{
	animation:roro 1s infinite linear;
	-webkit-animation:roro 1s infinite linear;}
@-moz-keyframes roro{
	0%{ transform:rotateZ(0deg);}
	100%{ transform:rotateZ(360deg);}
}
@-webkit-keyframes roro{
	0%{ -webkit-transform:rotateZ(0deg);}
	100%{ -webkit-transform:rotateZ(360deg);}
}