@charset "UTF-8";

body { min-width:auto !important; }
#extramenu { position:absolute; top:47px; left:0px; height:40px; width:765px; display:none; }

	
	
	/*=====================================================================================*/
		/* SPECIAL FOR IE TABLET VERSION */
			/*html.onie body { background:pink !important; }*/
			html.onie #header, 
			html.onie #navbar .menu, 
			html.onie div.submenuLayer, 
			html.onie #containerBox { width:880px; }
				
			html.onie div.submenuLayer { width:900px; margin-left:-54px; }
			html.onie #navbar .menu { width:880px !important; margin-left:21px !important; }
			html.onie #navbar ul li div.submenu { width:870px !important; margin-left:-54px; }
			html.onie #navbar ul { width:800px; margin-left:60px; }
			html.onie #navbar ul li div.submenu a { padding:0 7px; } 
			html.onie .submenuLayer {}
			
			html.onie #header div#logo { margin-left:-15px; }
			html.onie #header.shorten div#logo { margin-left:-50px; }
			html.onie #header .framemenu1 { left:160px; }
			html.onie #header.shorten .framemenu1 { left:110px; }
			html.onie #header .framemenu2 { top:10px; right:0px; width:210px; }
			html.onie #header.shorten .framemenu2 { top:-6px; right:0px; }
			html.onie #header .framemenu2 div.searchbox { width:90px; margin-left:-10px; }
			html.onie #header .framemenu2 a { padding:10px 5px; margin:1px; border:0px solid #aaa; background:none; }
			html.onie #submenubox div.submenu { width:870px; !important }
			html.onie #submenubox div.submenu a { padding:0px 7px; }
			html.onie #extramenu { position:absolute; top:47px; width:690px !important; }
			html.onie #mainboxFull { width:900px; }
			html.onie .boxPlain img,
			html.onie .boxWhite img { max-width:100%; }
	/*=====================================================================================*/
	
	
	



/* SMALL TABLET */
@media screen and (max-width: 1140px) {
	#header, #navbar .menu, div.submenuLayer, #containerBox { width:880px; }
	div.submenuLayer { width:900px; margin-left:-54px; }
	#navbar .menu { width:880px !important; margin-left:21px !important; }
	
	#navbar ul li div.submenu { width:870px !important; margin-left:-54px; }
	#navbar ul { width:800px; margin-left:60px; }
	#navbar ul li div.submenu a { padding:0 7px; } 
	.submenuLayer {}
	
	#header div#logo { margin-left:-15px; }
		#header.shorten div#logo { margin-left:-50px; }
	#header .framemenu1 { left:160px; }
		#header.shorten .framemenu1 { left:110px; }
	#header .framemenu2 { top:10px; right:0px; width:210px; }
		#header.shorten .framemenu2 { top:-6px; right:0px; }
		#header .framemenu2 div.searchbox { width:90px; margin-left:-10px; }
		#header .framemenu2 a { padding:10px 5px; margin:1px; border:0px solid #aaa; background:none; }
	#submenubox div.submenu { width:870px; !important }
	#submenubox div.submenu a { padding:0px 7px; }
	
	
	#extramenu { position:absolute; top:47px; width:690px !important; }
	#mainboxFull { width:900px; }
	
	
	.boxPlain img,
	.boxWhite img { max-width:100%; }
}
/* DESKTOP */
@media screen and (min-width: 1141px) { 
	#header, #navbar .menu, div.submenuLayer, #containerBox { width:980px; }
	div.submenuLayer { width:980px; margin-left:auto; }
	#navbar .menu { width:980px !important; margin-left:auto !important; }
	
	#navbar ul li div.submenu { width:950px; margin-left:auto; }
	#navbar ul { left:0px; width:800px; margin-left:0px; }
	#navbar ul li div.submenu a { padding:0 12px; } 
	#header div#logo { margin-left:-35px; }
	#header.shorten div#logo { margin-left:-20px; }
	#header .framemenu1 { left:150px; }
	#header .framemenu2 { top:11px; right:0px; width: 252px; }
	#header .framemenu2 div.searchbox { width:120px; margin-left:2px; }
	#header .framemenu2 a { border-radius:5px; padding:8px 8px; margin:1px; font-size:11px !important; border:1px solid #aaa; background:#f2f2f2; 
				background: -moz-linear-gradient(top, #f5f5f5btn 0%, #dedede 100%); /* FF3.6+ */
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#dedede)); /* Chrome,Safari4+ */
				background: -webkit-linear-gradient(top, #f5f5f5 0%,#dedede 100%); /* Chrome10+,Safari5.1+ */
				background: -o-linear-gradient(top, #f5f5f5 0%,#dedede 100%); /* Opera 11.10+ */
				background: -ms-linear-gradient(top, #f5f5f5 0%,#dedede 100%); /* IE10+ */
				background: linear-gradient(to bottom, #f5f5f5 0%,#dedede 100%); /* W3C */
				/*box-shadow:inset 0 -1px 1px rgba(0,0,0,0.3);*/ float:left; }
	
	#submenubox div.submenu { width:950px; }
	#submenubox div.submenu a { padding:0px 12px; }
	
	
	#extramenu { position:absolute; top:47px; width:765px; }
	#mainboxFull { width:100%; }
}





/* SMALL TABLET */
	/*
	@media screen\0, screen and (max-width: 1140px) {
		
		#frameHeader { top:40px; }
		#menu_float.shorten { top:0; }
		#menu_float ul { width:6000px !important; }
		
		#menu_float .navTop { background:url(../images/icon-global.png) no-repeat 60px top; background-position:-96px -352px; height:40px !important; width:50px; }
		#menu_float .active { background-position:-116px -304px !important; }
		#menu_float .navEnd { background-position:-20px -350px; display:none; }
		
		#menu_float ul li { float:left; width:110px; border:0; border-left:1px solid #3e4455; border-right:1px solid #222a37; height:25px; padding-top:7px; }
		#menu_float ul li .icon { width:20px; height:20px !important; position:absolute; top:8px; left:25px !important; margin-left:-20px !important; }
		#menu_float ul li p { color:white; margin:0; margin-top:2px; width:100%; padding:0; display:block; }
		
		#menu_float ul li div.icon-promo,
		#menu_float ul li div.icon-bill,
		#menu_float ul li div.icon-shop,
		#menu_float ul li div.icon-fanpage { margin:-3px 5px; width:30px; height:30px; background-size:150px 450px; float:left; }
		#menu_float ul li div.icon-promo { background-position:0px 0px; }
		#menu_float ul li div.icon-bill { background-position:0px -37.5px; }
		#menu_float ul li div.icon-shop { background-position:0px -75px; }
		#menu_float ul li div.icon-fanpage { background-position:0px -112.5px; }
		#menu_float ul li div.icon-reddot { margin-left:20px; }
		#menu_float #fn-vip { padding-left:13px; }
		#menu_float #fn-vip img.userimg { width:29px; height:29px; position:absolute; top:5px; left:5px;  }
		
		
				#menu_float { top:0; width:100%; height:40px; background:#303a4a; border-radius:0; }
				#menu_float div.iconInstruction { display:none; }
				
				
	}
	*/
	
	
		/*=====================================================================================*/
			/* SPECIAL FOR IE TABLET VERSION */
				html.onie #menu_float.shorten { top:38px; }
				html.onie #menu_float .navTop { background:url(../images/icon-global.png) no-repeat 60px top; background-position:-96px -352px; height:40px; width:50px; display:none; }
				html.onie #menu_float .active { background-position:-96px -352px !important; }
				html.onie #menu_float .navEnd { background-position:-20px -350px; display:none; }
				html.onie #menu_float ul { width:250px; height:340px; display:block; background:#fff; box-shadow:1px 2px 8px rgba(0,0,0,0.4); padding:5px; border-radius:5px; margin:52px 10px auto 8px; opacity:0; display:none; border:1px solid #ccc; }
				html.onie #menu_float ul li { float:left; width:80px; border:0; height:70px; background:none; display:inline-block; }
				html.onie #menu_float ul li .icon { width:40px; height:40px; position:absolute; top:8px; left:20px !important; }
				html.onie #menu_float ul li p { color:#333; margin:0; margin-top:48px; text-shadow:none; width:100%; padding:0; display:block; }
				html.onie #menu_float ul li:hover { background:#eee !important; }
				html.onie #menu_float ul li:hover p { text-decoration:underline; color:#ea5700; }
				
				html.onie #menu_float ul li div.icon-promo,
				html.onie #menu_float ul li div.icon-bill,
				html.onie #menu_float ul li div.icon-shop,
				html.onie #menu_float ul li div.icon-fanpage { margin:-3px 5px; width:30px; height:30px; background-size:150px 450px; float:left; }
				html.onie #menu_float ul li div.icon-promo { background-position:0px 0px; }
				html.onie #menu_float ul li div.icon-bill { background-position:0px -37.5px; }
				html.onie #menu_float ul li div.icon-shop { background-position:0px -75px; }
				html.onie #menu_float ul li div.icon-fanpage { background-position:0px -112.5px; }
				html.onie #menu_float ul li div.icon-reddot { margin-left:20px; }
				
				html.onie #menu_float #fn-vip { background:none; color:#333; }
				/*html.onie #menu_float #fn-vip:hover { background:#eee !important; }*/
				
				html.onie #menu_float #fn-login { background:none; color:#333; }
				/*html.onie #menu_float #fn-login:hover { background:#eee !important; }
				html.onie #menu_float #fn-login:hover p { text-decoration:underline; color:#ea5700; }*/
				html.onie #menu_float { top:61px; width:43px; height:47px; border-radius:0; box-shadow:none; background:#303a4a; }
				html.onie #menu_float div.iconInstruction { display:none; }
		/*=====================================================================================*/
	
	
	
	
	@media screen\0, screen and (max-width: 1140px) {
		#menu_float.shorten { top:38px; }
		#menu_float .navTop { background:url(../images/icon-global.png) no-repeat 60px top; background-position:-96px -352px; height:40px; width:50px; display:none; }
		#menu_float .active { background-position:-96px -352px !important; }
		#menu_float .navEnd { background-position:-20px -350px; display:none; }
		
		#menu_float ul { width:250px; height:340px; display:block; background:#fff; box-shadow:1px 1px 15px rgba(0,0,0,0.4); padding:5px; border-radius:5px; margin:52px 10px auto 8px; opacity:0; display:none; border:1px solid #ccc; }
		#menu_float ul li { float:left; width:80px; border:0; height:70px; background:none; display:inline-block; }
		#menu_float ul li .icon { width:40px; height:40px; position:absolute; top:8px; left:20px; }
		#menu_float ul li p { color:#333; margin:0; margin-top:48px; text-shadow:none; width:100%; padding:0; display:block; }
		
		#menu_float ul li:hover { background:#eee !important; }
		#menu_float ul li:hover p { text-decoration:underline; color:#ea5700; }
		
		
		#menu_float ul li div.icon-promo,
		#menu_float ul li div.icon-bill,
		#menu_float ul li div.icon-shop,
		#menu_float ul li div.icon-fanpage { margin:-3px 5px; width:30px; height:30px; background-size:150px 450px; float:left; }
		#menu_float ul li div.icon-promo { background-position:0px 0px; }
		#menu_float ul li div.icon-bill { background-position:0px -37.5px; }
		#menu_float ul li div.icon-shop { background-position:0px -75px; }
		#menu_float ul li div.icon-fanpage { background-position:0px -112.5px; }
		#menu_float ul li div.icon-reddot { margin-left:20px; }
			
			#menu_float #fn-vip { background:none; color:#333; }
			/*#menu_float #fn-vip:hover { background:#eee !important; }*/
			
			#menu_float #fn-login { background:none; color:#333; }
			/*
			#menu_float #fn-login:hover { background:#eee !important; }
			#menu_float #fn-login:hover p { text-decoration:underline; color:#ea5700; }
			*/
			
				#menu_float { top:61px; width:43px; height:47px; border-radius:0; box-shadow:none; background:#303a4a; }
				#menu_float div.iconInstruction { display:none; }
				
				
	}
	
	
	/* DESKTOP */
	@media screen\0, screen and (min-width: 1141px) { 
	
		
		#menu_float .navTop { background:url(../images/icon-global.png) no-repeat; background-position:0px -300px; height:46px; width:100%; display:block; }
		#menu_float .active { background-position:-100px -300px !important; }
		#menu_float .navEnd { background-position:0px -350px; display:block; }
		
		#menu_float ul { list-style-position:outside; 
		width:100%; height:auto; display:block; background:none; box-shadow:none; padding:0; border-radius:0; margin:0; opacity:1; border:0; }
		#menu_float ul li { float:none; border:0; background-color:#303a4a; border-top:1px solid #3e4455; border-bottom:1px solid #222a37; }
		#menu_float ul li { padding-top:4px; }
		#menu_float ul li .icon { width:40px; height:40px; left:0; position:relative; top:0; }
		#menu_float ul li p { margin-top:10px; width:100%; padding:0; display:block; text-align:center; color:white; }
		
		
		#menu_float ul li div.icon-promo,
		#menu_float ul li div.icon-bill,
		#menu_float ul li div.icon-shop,
		#menu_float ul li div.icon-fanpage { margin-left:20px; width:40px; height:40px; background-size:200px 600px; }
		#menu_float ul li div.icon-promo { background-position:0px 0px; }
		#menu_float ul li div.icon-bill { background-position:0px -50px; }
		#menu_float ul li div.icon-shop { background-position:0px -100px; }
		#menu_float ul li div.icon-fanpage { background-position:0px -150px; }
		#menu_float ul li div.icon-reddot { margin-left:30px; }
			
			#menu_float #fn-vip { 
				background: -moz-linear-gradient(top, #515d78 0%, #384254 100%); /* FF3.6+ */
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#515d78), color-stop(100%,#384254)); /* Chrome,Safari4+ */
				background: -webkit-linear-gradient(top, #515d78 0%,#384254 100%); /* Chrome10+,Safari5.1+ */
				background: -o-linear-gradient(top, #515d78 0%,#384254 100%); /* Opera 11.10+ */
				background: -ms-linear-gradient(top, #515d78 0%,#384254 100%); /* IE10+ */
				background: linear-gradient(to bottom, #515d78 0%,#384254 100%); /* W3C */
				color:white;
			}
			/*#menu_float #fn-vip:hover { background:#27303d; }*/
			
			#menu_float #fn-login { 
				background: -moz-linear-gradient(top, #515d78 0%, #384254 100%); /* FF3.6+ */
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#515d78), color-stop(100%,#384254)); /* Chrome,Safari4+ */
				background: -webkit-linear-gradient(top, #515d78 0%,#384254 100%); /* Chrome10+,Safari5.1+ */
				background: -o-linear-gradient(top, #515d78 0%,#384254 100%); /* Opera 11.10+ */
				background: -ms-linear-gradient(top, #515d78 0%,#384254 100%); /* IE10+ */
				background: linear-gradient(to bottom, #515d78 0%,#384254 100%); /* W3C */
				color:white;
			}
			/*
			#menu_float #fn-login:hover { background:#27303d; }
			#menu_float #fn-login:hover p { text-decoration:underline; color:white; }
			*/
			
				#menu_float { top:61px; width:80px; background:none; }
				#menu_float div.iconInstruction { display:block; }
	}
	
	
	
	/*=====================================================================================*/
		/* SPECIAL FOR IE TABLET VERSION */
			html.onie #containerBox { width:900px; }
			html.onie #mainbox, html.onie #mainboxright { width:690px; }
			html.onie .boxBasicHalf1, html.onie .boxBasicHalf2 { width:340px; }
			html.onie #rightbox, 
			html.onie #leftbox,
			html.onie div.float_quicklink { width:200px; }
			html.onie .boxBasicBanner { height:75px; }
			html.onie #breadcrumbFooter { width:870px; }
			/*html.onie .navCon { width:200px; }*/
			html.onie .bbox-right { width:380px; }
	/*=====================================================================================*/

	/* SMALL TABLET */
	@media screen\0, screen and (max-width: 1140px) {
		
		
		#containerBox { width:900px; }
		#mainbox, #mainboxright { width:690px; }
		.boxBasicHalf1, .boxBasicHalf2 { width:340px; }
		#rightbox, #leftbox,
		div.float_quicklink { width:200px; }
		.boxBasicBanner { height:75px; }
		#breadcrumbFooter { width:870px; }
		
		/*.navCon { width:200px; }*/
		
		.bbox-right { width:380px; }
	}
	/* DESKTOP */
	@media screen\0, screen and (min-width: 1141px) { 
	
		#containerBox { width:980px; padding-top:120px; }
		#mainbox, #mainboxright { width:764px; }
		.boxBasicHalf1, .boxBasicHalf2 { width:376px; }
		#rightbox, #leftbox,
		div.float_quicklink { width:200px; }
		.boxBasicBanner { height:90px; }
		#breadcrumbFooter { width:950px; }
		
		.navCon { width:250px; }
		
		.bbox-right { width:450px; }
	}