@charset "UTF-8";
/*======= 
Hotlink Maxis Games Unlimited
Version 1.0 (25/07/08)
http://www.gamesunlimited.com.my
=======*/

/*=== reset ===*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
:focus { outline: 0; }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
blockquote:before, blockquote:after,
q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

body { font: 62.5% arial, helvetica, san-serif; background: #fff; color: #656565; text-align: center; margin: 0 auto; }
a { color: #ff0000; }
h1, h2 { text-indent: -9999px; line-height: .1em; font-size: .1em; }

/*=== the main building blocks ===*/
#wrapper { width: 993px; text-align: left; margin: 0 auto; }
#header { width: 993px; height: 142px; background: url(../images/gamesunlimited.jpg) top left no-repeat; }
#nav { width: 993px; height: 65px; background: url(../images/nav-bg.jpg) top left no-repeat; }
#breadcrumbs { width: 993px; }
#content { width: 993px; }
#footer { width: 993px; height: 183px; background: url(../images/footer-bg.jpg) top left repeat-x; margin: 20px 0 0 0; }

/*=== header and logos ===*/
#header h1 a { position: absolute; display: block; width: 575px; height: 78px; margin-left: 235px; top: 54px; border: none; }
#header h2 a { display: block; position: absolute; width: 150px; height: 45px; border: none; top: 74px; border: none; }
#header h2.hotlink a { margin-left: 15px;  }
#header h2.maxis a { margin-left: 870px; width: 110px; }
#header p.bookmark a { display: block; position: absolute; top: 2px; width: 110px; height: 15px; background: url(../images/bookmark.jpg) top left no-repeat; color: #909090; font-size: 9px; line-height: 9px; text-decoration: none; padding: 4px 0 0 25px; }
#header p.bookmark a:hover { text-decoration: underline; }
#header #for-ie-7 { top: 0; float: right; width: 340px; height: 40px; } 

/*=== oh-so-super sexy navigation ===*/

#main-nav { float: left; width: 580px; position: relative; margin: 0 0 0 20px; padding: 0; font-size: 1.155em; top: 16px; left: auto; font-weight: bold; color: #666; z-index: 100px; }
#main-nav span { padding: 0 0 0 3px; line-height: 20px; }
#main-nav ul { height: 20px; background: none; }
#main-nav ul li { float: left; height: 20px; line-height: 20px; padding: 0 .1em 0 .1em; }
#main-nav ul ul li { display: block; width: 110px; height: auto; position: relative; line-height: 1em; padding: 0; }
#main-nav a, #nav a:visited { display: block; float: left; height: 100%; text-decoration: none; color: #666; background: none; padding: 6px 7px 7px 7px; width: auto; font-size: .96em; }
#main-nav ul ul a, #nav ul ul a:visited { display: block; background: #333333; color: #fff; width: 110px; height: 100%; line-height: 1.12em; padding: 5px 10px 5px 31px; font-size: .96em; font-weight: normal; margin: 0 0 0 6px; }
#main-nav ul table ul a, #nav ul table ul a:visited { width: 120px;  w\idth: 100px; }
#main-nav table { position: absolute;  left: 0;  top: 0;  font-size: 1em;  z-index: -1; }
#main-nav ul ul table { lef\t: 2px; }
#main-nav li:hover { position: relative; }
* html #nav a:hover { position: relative; }

#main-nav a:hover, #main-nav :hover > a { color: #fff; text-decoration: none; background: #3d3d3d; }
#main-nav a.none:hover { background: none; color: #666; text-decoration: underline; }
#main-nav ul ul a:hover, #main-nav ul ul :hover > a { color: #fff; text-decoration: none; background: #666 url(../images/nav-hover.jpg) top left no-repeat; }
#main-nav ul ul { visibility: hidden; position: absolute; height: 0; top: 30px; left: .1em; width: 163px; margin: 0; padding: .5em 0;  background: #3d3d3d; }

#main-nav ul ul a, #main-nav ul ul a:hover { border-top: none; }
#main-nav ul li:hover ul, #main-nav ul a:hover ul { visibility: visible;  height: auto;  }

#nav-search { float: right; width: 330px; margin: 15px 20px 0 0; }
#nav-search form { text-align: right; }
#nav-search label.gone, #nav-search form fieldset legend { display: none; }
#nav-search form fieldset { border: none; }
#nav-search form a { color: #333; }
#nav-search form a:hover { color: #666; background: none; text-decoration: underline; }
#nav-search form select { font-size: 10px; width: 83px; padding: 1px 0 1px 10px; }
#nav-search form input.keyword { width: 156px; font: 10px arial, helvetica, sans-serif; }
#nav-search form input.go { font: 10px arial, helvetica, sans-serif; text-align: center; width: 30px; height: 16px; background: url(../images/go-button.jpg) top left no-repeat; color: #fff; border: none; cursor: pointer;}
#nav-search form p { display: inline-block; padding: 3px 0 0 0; }

/*=== breadcrumbs ===*/
#breadcrumbs { height: 45px; text-align: left; margin: 0 auto; padding: 2px 0 13px 0; color: #545454; }
#breadcrumbs ul { padding: 10px 0 0 25px; }
#breadcrumbs ul li { float: left; font: normal 11px arial, helvetica, sans-serif; color: #999; margin: 0 5px 0 0; }
#breadcrumbs ul li a { color: #545454; text-decoration: none; }
#breadcrumbs ul li a:hover { text-decoration: underline; }

#breadcrumbs #login { float: right; width: auto; margin: 0 10px 0 0; }
	#login p { font: 11px arial, helvetica, sans-serif; color: #6a7498; }
	#login p a { font-weight: bold; text-decoration: none; color: #000; }

/*=== content placements ===*/
#rightpanel { float: left; width: 189px; margin: 0 12px 0 5px; }
#middlepanel { float: left; width: 578px; }
#leftpanel { float: right; width: 189px; margin: 0 5px 0 0; }

/*=== the "red box" ===*/
h3 { color: #fff; background: url(../images/h3-bg.jpg) top left no-repeat; width: 174px; height: 18px; font: 12px arial, helvetica, sans-serif; padding: 6px 0 0 15px; }
.panelbox { width: 189px;  background: #fff url(../images/h3-cap.jpg) bottom left no-repeat; padding: 0 0 9px 0; margin: 0 0 10px 0; }
.panelbox.extra { padding: 0 0 9px 0; }

	/*=== "red box" form styles ===*/
	.panelbox form { width: 187px; border-right: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; padding: 10px 0 15px 0; }
	.panelbox form p { margin: 0 15px; line-height: 11px; }
	.panelbox form p.fineprint { font-size: 9px; margin: 0 10px 0 15px; }
	.panelbox form fieldset { border: none; }
	.panelbox form legend, .panelbox form label { display: none; }
	.panelbox form select { display: block; width: 145px; font-size: 11px; margin: 10px 0 10px 15px; }
	.panelbox form label.display { display: block; float: left; }
	.panelbox form label.display-inline { font-size: 11px; display: inline; padding: 0 8px 0 0; line-height: 1; margin: 0; vertical-align: top; }
	.panelbox form input.data { float: right; width: 115px; font-size: 9px; }
	.panelbox form input.normal { font-weight: bold; font-size: 10px; background: #fff; border: none; color: #900; margin: 2px 0 0 0; }
	.panelbox form input.confirm {/* width: 150px; height: 27px; background: url(../images/panel-button.jpg) top left no-repeat; color: #fff; font: bold 14px arial, helvetica, sans-serif; border: none;*/ overflow: visible; margin: 0 0 0 15px; /*text-align: left;*/ padding: 0 5px; }
	.panelbox form div.pad { margin: 0 7px; padding: 5px 0; text-align: right; }
	.panelbox form div.pad-left { margin: 0 7px; padding: 10px 0 5px 0; text-align: left; }
	.panelbox form div.pad-left input.radio { font-size: 9px; margin: 0 2px 0 7px; padding: 0; line-height: 1; }
	.panelbox form div.pad select { float: left; width: 110px; margin: 0; padding: 0; }
	.panelbox form input.checkbox { float: left; margin: 0 5px 10px 0; padding: 0; }

.panelbox.extra .after-login-data { padding: 15px 15px 11px 15px; }
.panelbox .after-login-data { margin: 0; border-right: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; color: #666; min-height: 70px; height: auto !important; height: 70px; padding: 5px 15px; }
.panelbox .after-login-data.clear { border-right: none; border-left: none; }
.panelbox .after-login-data img { float: left; margin: 0 5px 0 0; }
.panelbox .after-login-data strong { font-size: 14px; display: block; padding: 0 0 3px 0; }
.panelbox .after-login-data em { font-weight: bold; font-size: 12px; font-style: normal; }
.panelbox .after-login-data p { padding: 10px 0 0 0; font-size: 10px; color: #333; }
.panelbox .after-login-data p.filler { line-height: 12px; padding: 8px 0 10px 0; }
.panelbox.solid { background: none; }
.panelbox p.section { display: block; font-weight: bold; font-size: 11px; color: #444; background: #efefef url(../images/section-arrow.jpg) right top no-repeat; padding: 4px 0 0 15px; height: 18px; }

.panelbox p.section-bottom { display: block; font-weight: bold; font-size: 11px; color: #444; background: url(../images/section-cap.jpg) left top no-repeat; padding: 6px 0 0 15px; height: 29px; }
.panelbox p.section-bottom a, .panelbox p.section a { color: #444; text-decoration: none; }
	.panelbox p.aux-link { border-right: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; padding: 2px 0; }
	.panelbox p.aux-link a { display: block; /*background: url(../images/grey-arrow.jpg) top left no-repeat;*/ height: 14px; padding: 2px 0 0 /*23px*/ 0; margin: 0 0 0 15px; font-size: 10px; color: #394676; text-decoration: underline; line-height: 11px; }

	/*=== listing in the "red box" ===*/
	.panelbox ul { width: 187px; border-right: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; padding: 10px 0; }
	.panelbox ul li { display: block; margin: 0 10px; padding: 10px 0; border-bottom: 1px solid #c9c9c9; color: #444; font-size: 11px; }
	.panelbox ul li .placement { float: left; width: 15px; margin: 0 5px; }
	.panelbox ul li .title { float: left; width: 87px; margin: 0 5px 0 0 ; }
	.panelbox ul li .title strong { display: block; }
	.panelbox ul li .title strong a { color: #444; text-decoration: none; }
	.panelbox ul li .external-links { float: left; width: 40px; }
		.panelbox ul li .external-links a.console { float: left; width: 20px; height: 16px; display: block; text-indent: -9999px; background: url(../images/controller.jpg) top left no-repeat; }
		.panelbox ul li .external-links a.cart { float: left; width: 20px; height: 16px; display: block; text-indent: -9999px; background: url(../images/cart.jpg) top left no-repeat; }

.panelbox p.more-games a { color: #444; text-decoration: none; display: block; text-align: right; padding: 10px 30px 10px 0; font-weight: bold; font-size: 11px; }
.pushy p.section { cursor: pointer; }

/*=== the "green box" ===*/
h4 { color: #fff; background: url(../images/h4-bg.jpg) top left no-repeat; width: 563px; height: 18px; font: 12px arial, helvetica, sans-serif; padding: 6px 0 0 15px; }
h4.bluel { color: #fff; background: url(../images/blue_light.jpg) top left no-repeat; width: 563px; height: 18px; font: 12px arial, helvetica, sans-serif; padding: 6px 0 0 15px; }
h4.grey { background: url(../images/h4-grey-bg.jpg) top left no-repeat; }
.middlebox { width: 578px; background: #fff url(../images/h4-bottom-bg.jpg) bottom left no-repeat; padding: 0; margin: 0 0 10px 0; font-size: 10px; }
.middlebox a { color: #009933; }

	/*=== listing in the "green box" ===*/
	.middlebox ul { width: 576px; border-right: 1px solid #e8e8e8; border-left: 1px solid #e8e8e8; }
	.middlebox ul li { display: block; margin: 0; padding: 10px 0; background: #eee; height: 64px; }
	.middlebox ul li.even { display: block; margin: 0; padding: 10px 0; background: #fff; }
	.middlebox ul li .image-display { float: left; width: 64px; margin: 0 5px; }
	.middlebox ul li strong { display: block; line-height: 11px; }
	.middlebox ul li p { padding: 10px 0 0 0; line-height: 10px; }
	.middlebox ul li .data-first { float: left; width: 200px; margin: 0 20px 0 0; }
	.middlebox ul li .data-second { float: left; width: 200px; }

.middlebox p.view-more { text-align: right; display: block; background: url(../images/red-arrow.jpg) 560px 4px no-repeat; height: 16px; padding: 4px 22px 0 0; }
.middlebox p.view-more a { color: #333; text-decoration: none; }

/*=== paginate styles ===*/
ul.searchpaginate { padding: 2px 0 0 5px; }
ul.searchpaginate-off { padding: 0 0 0 15px; }
ul.searchpaginate li { display: block; float: left; }
ul.searchpaginate li a { display: block; background: url(../images/paginate-pipe.jpg) right 2px no-repeat; padding: 2px 15px 2px 7px; color: #000; text-decoration: underline; line-height: 11px; width: 2px; }
ul.searchpaginate li.last a { background: none; }
ul.searchpaginate li a.previous { display: block; width: 17px; height: 18px; text-indent: -9999px; background: url(../images/previous.jpg) top left no-repeat; padding: 0; text-decoration: none; }
ul.searchpaginate li a.next { display: block; width: 17px; height: 18px; text-indent: -9999px; background: url(../images/next.jpg) top left no-repeat; padding: 0; text-decoration: none; }



ul.paginate { padding: 2px 0 0 5px; }
ul.paginate-off { padding: 0 0 0 15px; }
ul.paginate li { display: block; float: left; }
ul.paginate li a { display: block; background: url(../images/paginate-pipe.jpg) right 2px no-repeat; padding: 2px 10px 2px 7px; color: #000; text-decoration: underline; line-height: 11px; width: 2px; }
ul.paginate li.last a { background: none; }
ul.paginate li a.previous { display: block; width: 17px; height: 18px; text-indent: -9999px; background: url(../images/previous.jpg) top left no-repeat; padding: 0; text-decoration: none; }
ul.paginate li a.next { display: block; width: 17px; height: 18px; text-indent: -9999px; background: url(../images/next.jpg) top left no-repeat; padding: 0; text-decoration: none; }

/*=== footer ===*/
#stay-informed { float: left; width: 400px; border-right: 1px solid #8f9090; margin: 15px 0 0 15px; padding: 0 0 10px 0; }
#stay-informed h5 { font: bold 22px arial, helvetica, sans-serif; color: #990000; }
	#stay-informed form { width: 350px; padding: 10px 0 0 0; }
	#stay-informed form p { color: #333; font-weight: bold; font-size: 14px; line-height: 15px; padding: 0 0 5px 0; }
	#stay-informed form fieldset { border: none; }
	#stay-informed form legend, #stay-informed form label { display: none; }
	#stay-informed form input.newsletter { width: 166px; font-size: 9px; padding: 2px 0 2px 2px; color: #333; }
	#stay-informed form input.subscribe { color: #fff; font-size: 10px; line-height: 9px; font-weight: bold; background: url(../images/submit-button.jpg) center no-repeat; width: 80px; height: 22px; border: none; padding: 0 0 1px 0; overflow: visible; text-align: center; cursor: pointer; }
	
	
	#stay-informed ul { color: #333; padding: 15px 0 0 0; }
	#stay-informed ul li { float: left; display: inline-block; padding: 0 10px 0 0; background: url(../images/pipe.jpg) right top no-repeat; }
	#stay-informed ul li.last { background: none; }
	#stay-informed ul li a { padding: 0 0 0 4px; color: #990000; text-decoration: underline; }

#external-links { float: left; width: 500px; margin: 15px 0 0 15px; color: #444; line-height: 12px; }
#external-links p strong { color: #990000; font-size: 11px; }
#external-links ul { padding: 5px 0 0 0; }
#external-links a { color: #444; text-decoration: none; }
#external-links a:hover { text-decoration: underline; }
#external-links p a { text-decoration: underline; }
	#linkage { float: left; width: 105px; margin: 0 5px 0 0; padding: 0 0 0 55px; background: url(../images/links-bg.jpg) top left no-repeat; min-height: 55px; height: auto !important; height: 55px; }
	#advanced-search { float: left; width: 110px; margin: 0 5px 0 0; padding: 0 0 0 55px; background: url(../images/search-bg.jpg) top left no-repeat; min-height: 55px; height: auto !important; height: 55px; }
	#support { float: left; width: 105px; margin: 0 5px 0 0; padding: 0 0 0 55px; background: url(../images/support-bg.jpg) top left no-repeat; min-height: 55px; height: auto !important; height: 55px; }
	
#footer .other-sites form { clear: both; width: 950px; text-align: right; }
#footer .other-sites form fieldset { border: none; }
#footer .other-sites form legend, #footer .other-sites form label { display: none; }
#footer .other-sites form select { font-size: 10px; padding: 2px 0 2px 2px; width: 192px; } 


/*=== clearfix ===*/
.clearfix:after {  
	content: ".";  
	display: block;  
	clear: both;  
	visibility: hidden;  
	line-height: 0;  
	height: 0;  
	}  

.clearfix { display: inline-block; }  
html[xmlns] .clearfix { display: block; }  
* html .clearfix { height: 1%; }  

.button {
cursor: pointer;
}