@charset "utf-8";
body{font-family:Arial, 'LiHei Pro',微軟正黑體, 新細明體, sans-serif;}
#calendar{width:150px;height:150px;margin:0 auto;text-align:center;background-color:#333;border-radius:10px;margin-top:30px;position:relative;}
#calendar div:nth-child(1) span{color:#fff;font-size:18px;font-weight:bold;line-height:54px;}
#calendar div:nth-child(1){
	background-color:#f00;
	width:150px;
	height:50px;
	border-radius:10px 10px 0 0;
	border:3px solid #DB0000;
	background: #db0000; /* Old browsers */
	background: -moz-linear-gradient(top,  #db0000 0%, #990000 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #db0000 0%,#990000 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #db0000 0%,#990000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#db0000', endColorstr='#990000',GradientType=0 ); /* IE6-9 */
	box-shadow: 0px 4px 3px #444;
	position:relative;
/*	right:15px;*/
	z-index:1;
}
#calendar div:nth-child(2){
	width:138px;
	height:90px;
	margin:0 auto;
	background-color:#fff;
	position:relative;
/*	right:9px;	*/
	border-radius:0 0 8px 8px;
	box-shadow:
	  1px 0px 1px #fff, 0px 1px 1px #fff,
	 -1px 0px 1px #fff, 0px 1px 1px #fff,
	 
	 2px 1px 1px #333, 1px 2px 1px #fff,
	 -2px 1px 1px #333, -1px 2px 1px #fff,
	 
	 3px 2px 1px #fff, 2px 3px 1px #fff,
	 -3px 2px 1px #fff, -2px 3px 1px #fff,
	 
	 4px 3px 1px #333, 3px 4px 1px #fff,
	 -4px 3px 1px #333, -3px 4px 1px #fff,
	 
	 5px 4px 1px #777, 4px 5px 1px #fff,
	 -5px 4px 1px #777, -4px 5px 1px #fff;
}
#calendar div:nth-child(2) span:nth-child(1){
	font-size:80px;
	color:#000;
	font-weight:bold;
	line-height:95px;
}
a:hover{text-decoration: none;}
#calendar div:nth-child(2) span:nth-child(2){
	display:inline-block;
	width:42px;
	height:39px;
	background:url(../img/shadow.png) center center no-repeat;
	background-size:contain;
	position:absolute;
	top:53px;
	right:-2px;
	z-index:10;
}
#calendar > span{display:inline-block;width:10px;height:10px;border-radius:8px;background-color:#333;position:absolute;z-index:3;top:5px;border:1px solid #999;}
#calendar span:nth-child(3){left:25px;}
#calendar span:nth-child(4){right:25px;}
#calendar > span:before{
	display:inline-block;
	width:7px;
	height:25px;
	background-color:#666;
	position: relative;
   	top: -18px;
   	border-radius:5px;
	 /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#606060+1,ffffff+16,adadad+45,000000+100 */
	background: rgb(96,96,96); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(96,96,96,1) 1%, rgba(255,255,255,1) 16%, rgba(173,173,173,1) 45%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(96,96,96,1) 1%,rgba(255,255,255,1) 16%,rgba(173,173,173,1) 45%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(96,96,96,1) 1%,rgba(255,255,255,1) 16%,rgba(173,173,173,1) 45%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#606060', endColorstr='#000000',GradientType=0 ); /* IE6-9 */



	content:"";}
/*--------------------------------------------------------------------------------------------------------------------------------------------*/