body {
	font-family: arial;
	font-size: 11px;
}
	
	/* remove the list style */
.nav {
		margin:0; 
		padding:0; 
		list-style:none;
}	
	
		/* make the LI display inline */
		/* it's position relative so that position absolute */
		/* can be used in submenu */
.nav li {
	float: left;
	display: block;
	position: relative;
	z-index: 500;
	border: 2px solid #6A9AC5;
	margin-top: 7px;
	margin-right: 20px;
	margin-bottom: 7px;
	margin-left: 20px;
	text-indent: -9999px;
	/* [disabled]height: 20px; */
	width: 70px;
	background-repeat: no-repeat;
	background-position: center center;
}
		
		/* this is the parent menu */
.nav li a {
	display: block;
	height: 20px;
	text-decoration: none;
	color: #fff;
	text-align: center;
	padding-top: 1px;
	padding-right: 3px;
	padding-bottom: 1px;
	padding-left: 3px;
			
}

.nav li a:hover {
			color:#fff;
			padding-top:1px;
}
	
		/* you can make a different style for default selected value */
.nav a.selected {
			color:#f00;
}
	
		/* submenu, it's hidden by default */
.nav ul {
	position: absolute;
	visibility: hidden;
	margin-top: 2px;
	background-color: #6A9AC5;
	margin-left: -15px;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}
		
.nav ul li {
	width: 100px;
	float: left;
	display: block;
	text-align: left;
	padding: 0;
	margin: 0;
}
		
		/* display block will make the link fill the whole area of LI */
.nav ul li a {
	text-align:left;
			
}		


		
.nav ul li :hover {
	/* [disabled]background-color: #D96682; */
	border: 0;
	padding: 5px 1 1 1;
}
#menu{
	margin-left: 180px;
	padding-top: 2px;
}

		/* fix ie6 small issue */
		/* we should always avoid using hack like this */
		/* should put it into separate file : ) */
*html #nav ul {
			margin:0 0 0 -2px;
}

#LanguageSelect {
	background-image: url(../image/TCTop-2x.png);
	background-size:70px;
	height: 25px;
	width: 73px;
	float: right;
	background-repeat: no-repeat;
	margin-top: 8px;
	margin-right: 35px;
	font-family: "微軟正黑體";
}

#LanguageSelect:hover {
	background-image: url(../image/SCTopHover-2x.png);
	background-size:70px;
}
/*
#Menus1 {
	background-image: url(../image/menu/2x/Insight-2x.png);
	background-size: 59px;
}
*/
#Menus2 {
	background-image: url(../image/menu/2x/Shop-2x.png);
	background-size:59px;
}
#Menus3 {
	background-image: url(../image/menu/2x/About_Joiiup.png);
	background-size:59px;
}
#Menus4 {
	background-image: url(../image/menu/2x/Member-2x.png);
	background-size:59px;
}
#Menus5 {
	background-image: url(../image/menu/2x/Service-2x.png);
	background-size: 59px;
}
#Menus5_1 {
	background-image: url(../image/menu/2x/JoiiSports-2x.png);
	background-size:67px;
}
#Menus5_1:hover {
	background-image: url(../image/menu/2x/JoiiSports-2x.png);
	background-color: #D96682;
	background-size:67px;
}
#Menus5_2 {
	background-image: url(../image/menu/2x/JoiiHealth-2x.png);
	background-size:66px;
}
#Menus5_2:hover {
	background-image: url(../image/menu/2x/JoiiHealth-2x.png);
	background-color: #D96682;
	background-size:66px;
}
#Menus8 {
        background-image: url(../image/menu/2x/News-2x.png);
        background-size: 60px;
}



/* Retina圖片CSS放在這區塊中 */
@media screen and (-webkit-min-device-pixel-ratio: 2),
screen and (min--moz-device-pixel-ratio: 2)
{



    #logo 
	{
	background: url(../image/2x/Logo-2x.png);
	background-size: 94px;
    }
}