@import "reset.css";

/* 
--------------------------------------------------
	SPEEDUP CSS DOCUMENT
	Author: RynetASP
	Last Update: Jan, 2009
-------------------------------------------------- 
	01 - GLOBAL BROWSER RESET
	02 - COMMON STYLE 
	03 - TABLE
	04 - MAIN NAVIGATION
	05 - FORM 
	06 - HEADLINE & PARAGRAPH 	

 01 - GLOBAL BROWSER RESET 
 02 - COMMON STYLE */

html {height: 100%;}

* html #Wrapper{height: 95%; }

body {	
	color:#555;
  font-family: "Trebuchet MS", Trebuchet, Verdana, Sans-Serif;
	font-size:64.5%;
	width:990px;
	min-width:990px;
	width:auto!important;	
	height:100%
	}	

h1, h2 {
	font-variant: small-caps;
}

h2 {
	font-size: 160%;
}

.lipsum p{
font-family: "Trebuchet MS", Trebuchet, Verdana, Sans-Serif;
}

	.Red {
		background:#f3f3f3 url(../images/top-red.gif) top repeat-x;
		}
	.Orange {
		background:#f3f3f3 url(../images/top-orange.gif) top repeat-x;
		}
	.Blue {
		background:#f3f3f3 url(../images/top-blue.gif) top repeat-x;
		}
	.Green {
		background:#f3f3f3 url(../images/top-green.gif) top repeat-x;
		}
	.Black {
		background:#f3f3f3 url(../images/top-black.gif) top repeat-x;
		}
	.Grey {
		background:#f3f3f3 url(../images/top-grey.gif) top repeat-x;
		}

.Clear {
	clear:both
	}

#Wrapper {
	border:0px solid #aaa;
	margin-left:2.4%;
	padding:0;
	width:95%;
	min-height: 95%;
	height:95%;
	position: relative;
	}

a {
	color:#960;
	text-decoration:none
	}

p {
	font-size:1.1em;
	line-height:1.8em;
	padding:7px 0
	}
	
.flLeft{
	float:left
	}
	
.flRight{
	float:right
	}

.comparelink{
  cursor:hand;
  cursor:pointer
}
/* - @ header - */
#Header {	
	margin:0 0 0 4px;
	border:0px solid #933;
	padding:0;
	height:127px
	}

	.logo {
		display:block;
		float:left;
		height:90px;
		text-align:right;
		width:100%
		}
		
	h1#hlogo {		
		display:block;
		height:50px;
		float:left;
		padding-top:0px
		}
		
		/*.Red .logo{
			background:url(../images/logo-red.gif) bottom left no-repeat;
		}
		.Orange .logo{
			background:url(../images/logo-orange.gif) bottom left no-repeat;
		}
		.Blue .logo{
			background:url(../images/logo-blue.gif) bottom left no-repeat;
		}
		.Green .logo{
			background:url(../images/logo-green.gif) bottom left no-repeat;
		}
		.Black .logo{
			background:url(../images/logo-black.gif) bottom left no-repeat;
		}
		.Grey .logo{
			background:url(../images/logo-grey.gif) bottom left no-repeat;
		}*/
	
	h1#hlogo span {
		display:none
		}
		
	.logo img {
		margin:10px 25px 0 0px;
		padding:0
		}
	
/* - @ Content - */

.WrapContent {
	background:#fff url(../images/bg-lf.gif) left repeat-y;
	padding:0 0 0 5px;
	border:0px solid #333;	
	height:70%
	}

#Content {
	background:#fff url(../images/bg-rg.gif) right repeat-y;
	padding:0;
	height:100%
	}

.SubTtl{
	border-bottom:5px solid #E6E6E6;
	height:30px;
	margin:0 0 20px 0
	}
	
.SplashFlash {
	z-index:1
	}

.flGallery {
	background:url(../images/ex-gal.jpg) top left no-repeat;
	padding:18px 30px;
	margin:5px 0 0 
	}
	
	.MainFrame {
		padding:1.5% 2% 0% 2%;
		width:95.5%;
		overflow:hidden;
		height:95%;
		position:relative
		}
	
	.BtmFrame {
		float:left;
		width:100%;
		display:block;
		height:30px;
		background:#f3f3f3 url(../images/bg-btm.gif) bottom repeat-x
		}
		.BtmFrame .L {
			width:30px;
			height:30px;
			float:left;
			background:#f3f3f3 url(../images/bg-lfbtm.gif) left bottom no-repeat
			}
		.BtmFrame .R {
			width:30px;
			height:30px;
			float:right;
			background:#f3f3f3 url(../images/bg-rgbtm.gif) right bottom no-repeat
			}

	.First{
		margin:0;
		padding:0;		
		border:0px solid #f12;
		position:relative;
		height:100%;
		}
	
	.BoxSplash {
		/*float:left;	
		position:absolute;
		padding:0 10px 0 0;
		width:660px*/
		
		float:left;		
		padding:0;
		margin-left:0;
		margin-right:0px;
		height:99%;
		width:660px	
		
		}
	
	.EventsWrapp{
	  /*background:#aaa;
		padding-left:670px;	
		margin-right:15px;
		*/
    
		margin-right:0;
		margin-left:670px;	
		line-height:1.5em;
		font-size:1.1em;
		height:300px;
	
		}
	
		.EventsWrapp2 {
			width:99%;
			height:300px;
			padding:0 0 10px 1%;
			background: url(../images/box.gif) top left no-repeat
			}
		
		.ChatWrapp {
	    width:99%;
	    height:60px;
	    text-align:center;
	    padding-top:10px;
    	margin:0 auto		
      }
      
    
		.Events {
			background:url(../images/box.gif) top right repeat-x;
			height:310px;
			margin-left:5px
			}	
		
		.ContentBox {	
			width:100%;
			padding:0 0px 0px 0px;
			float:left;
			}
		
		.TxtBox{
			overflow:scroll;
			overflow-x:hidden;
			margin:13px 0 0;
			height:169px;
			width:98%;
			}
			
			.Chats .TxtBox{
				height:120px;
				overflow:hidden
				}

			.ContentBox ul {
				margin:0px 0 0
				}
			
			.ContentBox ul li{
				margin:10px 0
				}
			
			.ContentBox ul li h6{
				font-size:1em
				}
			
			.ContentBox ul li p b{
				font-size:1em;
				color:#619718;
				font-weight:400
				}
			
			.ContentBox h3, h2.Title2 {
				color:#619718;
				font-size:1.2em;
				padding:15px 0 3px
				}		
      .ContentBox h3 {
				padding:15px 0 18px
				}		
			
			.Chats ul li{
				float:left;
				margin:0 10px;
				width:80px
				}	
				
			.Chats li a {
				float:left;
				line-height:1.6em;
				color:#275880;
				display:block;
				border-bottom:1px solid #B8D5E3	;
				width:80px			
				}	

	
	.LFixed {	
		margin:0;
		padding:0;		
		border:0px solid #f12;
		position:relative;
		height:100%;
		
		}
	
	.LFixed h2.Title, .LFixed  h2{
		color:#888;
		font-size:1.2em;
		font-weight:600;
		padding:10px 0 25px
		}		
		
	.LSide {	
		float:left;		
		padding:0;
		margin-left:0;
		margin-right:20px;
		height:99%;
		width:200px	
		}
		
		.LSide img{
      width:210px
    }
		.LSide p {
			line-height:1.2em;
			padding:6px 0
			}	
		.Lmenu {
			background:#C5C5C5 url(../images/bg-mn.gif) top no-repeat ;
			margin:0;
			padding:3px 0 20px 10px;
			width:200px;
			height:93%
			}
		.Btm-Lmenu {
			background: url(../images/btm-mnL.gif) top no-repeat;
			height:6px;
			width:210px
			}	
	
	.RSide {		
		margin-left:225px;	
		line-height:1.5em;
		font-size:1.1em;
		height:100%;
	
		}

	.GalPg ul li{
		display:block;
		margin:0 10px 0 20px;
		float:left;	
		padding:10px 0 10px 0;
		width:270px;
		overflow:hidden
	}
	
	.GalPg ul li span{	
    border-bottom:1px solid #ddd;
  }
	
  .GalPg ul li img{
		background:url(../images/bgPicGal.gif) no-repeat;
		border:0;
		padding:8px;
		float:left;
		height:80px;
		width:125px
	}
	

	

	.BlueBox {
		background:#fff;
		}
	
	.BlueBox .BlueL {
		background:url(../images/bgGreyL.gif) top left repeat-x;
		height:30px;
		float:left;
		width:30px
		}
		
	.BlueBox .BlueR {
		background:url(../images/bgGreyR.gif) top right repeat-x;
		height:30px;
		float:right;
		width:30px
		}	
		
	.RSide span.Title{	
		background:url(../images/bg-title.gif) top left repeat-x;		
		display:block;
		padding:0
		}
		
		.RSide span.Title b{		
			background:url(../images/bg-titleL.gif) left top no-repeat;
			padding:10px 0 20px 15px ;
			display:block
			}
		
		span.Title h2{	
		background:url(../images/bg-titleR.gif) right top no-repeat;
		color:#555;
		padding:0;
		}
	
	.RSide span.tblue{	
		background:url(../images/bg-title2.gif) top left repeat-x		
		}
		
		.RSide span.tblue b{		
			background:url(../images/bg-titleL2.gif) left top no-repeat
			}
		
		span.tblue h2{	
			background:url(../images/bg-titleR2.gif) right top no-repeat;
			color:#fff
			}
	
		.RSide .SubCont {
			position:relative;/*for ie so gallery can follow form*/
			padding:15px;
			margin:0 0 20px;
			height:78%;
			overflow:scroll;
			overflow-x:hidden;
			
			}
			
			.SubCont .img-map{
				width:635px;
				}
			
		.RSide .txtProd{					
			margin-left:250px
			}
			
			.txtProd{
				font-size:1em
				}
			
			span.status{
				background:#fff;
				font-weight:600;
				margin:10px 0 20px;
				border:1px solid #96A1BD;
				color:#1A61B9;
				padding:6px 10px
				}
			
			a.dlLink{
				background:url(../images/icon-dl.gif) left no-repeat;
				padding:5px 0 5px 20px;
				font-size:1.1em;
				font-weight:600;
				color:#96A1BD				
				}
		
		.RSide h3 {
			color:#daad1c;
			font-size:1.5em
			}
		
		.RSide h4 {
			color:#555;
			font-size:1.3em;
			font-weight:400
			}
		
		.RSide h6 {
			font-size:0.9em	
			}
		
		.RSide a{
			color:#912323;
			}
		
		.RSide img {
			background:#eee;
			border:1px solid #ddd;
			padding:4px;			
			margin:5px 15px 5px 0;
			float:left
			}
	
	.CompAdd dl{
		border-left:1px dotted #aaa;
		margin:20px 15px 20px 0;
		padding:0 0 0 20px;
		float:left;
		height:160px;
		overflow:hidden;
		width:260px
		}		
	.CompAdd dt {
		padding:10px 0 0;
		width:60px;
		float:left
		}
		
	.CompAdd dd {		
		padding:0;
		float:left;
		width:200px;
		margin:10px 0 0
		}	
	
	.prodList dl{		
		color:#666;	
		font-size:0.9em;
		font-weight:400;
		width:210px;
		height:100px;
		margin:0 10px 40px 0;
		padding:0 ;
		overflow:hidden;
		float:left;
		}		
	.prodList dt {
		padding:10px 0 0;
		width:100px;
		float:left;
		}
		
		.prodList dt img{			
			float:left;
			width:65px;
			height:65px;			
			padding:0px;
			margin:0 3px 0 5px;
			border:0px solid #eee
			}
		.prodList .bmark{
			float:left;
			margin-top:30px
			}
			
	.prodList dd {	
		padding:0;
		float:left;
		margin:0;
		width:90px
		}
		.prodList dd h4, .prodList dd h4 a{
			color:#E09700;
			font-size:1.1em
			}	
		.prodList dd h4 a:hover{
			color:#619718
			}
			
			
	.Litlist a{
		color:#E6901F;
		line-height:1.8em
		}
	
	a.ttl {
		color:#367909
		}
/* - # footer - */
		
.Footer {
	line-height:20px;
	padding:10px 25px;
	color:#777;
	text-align:center
	}

.Footer a{
	color:#777
	}
.Footer a:hover{
	text-decoration:underline
	}

/*--------------------------------------------------------------
						03 - TABLE
--------------------------------------------------------------*/

table.BlueGrey td, th{
	background:#eee;
	border:0;
	border-bottom:1px solid #fff;
	padding:8px;
	text-align:left;
	line-height:1.5em
	}

table.BlueGrey tr.prodCompare th{
	background:#f7f7f7;
	color:#d90
	}
	
	tr.prodCompare img{
		padding:0;
		border:0;
		margin:0;
		}

	table.BlueGrey th{
		background:#DBE9F6
		}
		
tr.lineSpace td{
	background:transparent;
	height:10px
	}

table.BlueGrey tr.ttlSupport th{
	background:#fff;
	text-align:left
	}

table.BlueGrey td.fieldL,table.BlueGrey th.fieldL {
	border-right:5px solid #fff
	}

/*--------------------------------------------------------------
					   04 - MAIN NAVIGATION
--------------------------------------------------------------*/

/* - @ main nav - */
	ul#Nav {		
		z-index:2;
		display:block;
		min-width:900px;
		width:100%;
		float:left;
		padding:5px 0 0;		
		font-size:1.2em;		
		font-weight:400
		}
	
	ul#Nav li {	
		display: inline;
		position:relative;
		z-index:100;
		float:left;
		background:url(../images/grs-mainmn.gif) bottom right no-repeat		
		}	
	
	ul#Nav a{	
		color:#555;		
		display:block;
		float:left;
		height:25px;
		padding:5px 15px 2px		
		}
	
		.Red ul#Nav a:hover {	
			color:#c22;
			background:url(../images/grs-mainmn.gif) bottom right no-repeat
			}
			
			.Red ul#Nav li:hover ul li:hover a,
			.Red ul#Nav li:hover ul li:hover ul li:hover a,
			.Red ul#Nav li a:hover ul li a:hover {
				background:#f13838;
				color:#fff
				}
			
		.Orange ul#Nav a:hover {	
			color:#e70;
			background:url(../images/grs-mainmn.gif) bottom right no-repeat	
			}
			
			.Orange ul#Nav li:hover ul li:hover a,
			.Orange ul#Nav li:hover ul li:hover ul li:hover a,
			.Orange ul#Nav li a:hover ul li a:hover {
				background:#ffb26a;
				color:#fff
				}
			
			
		.Blue ul#Nav a:hover {	
			color:#27c
			}
			
			.Blue ul#Nav li:hover ul li:hover a,
			.Blue ul#Nav li:hover ul li:hover ul li:hover a,
			.Blue ul#Nav li a:hover ul li a:hover {
				background:#689cf9;
				color:#fff
				}
			
		.Green ul#Nav a:hover {	
			color:#692	
			}
			
			.Green ul#Nav li:hover ul li:hover a,
			.Green ul#Nav li:hover ul li:hover ul li:hover a,
			.Green ul#Nav li a:hover ul li a:hover {
				background:#76b92b;
				color:#fff
				}
		.Black ul#Nav a:hover {	
			color:#222	
			}
			
			.Black ul#Nav li:hover ul li:hover a,
			.Black ul#Nav li:hover ul li:hover ul li:hover a,
			.Black ul#Nav li a:hover ul li a:hover {
				background:#333;
				color:#fff
				}
		.Grey ul#Nav a:hover {	
			color:#555	
			}
			
			.Grey ul#Nav li:hover ul li:hover a,
			.Grey ul#Nav li:hover ul li:hover ul li:hover a,
			.Grey ul#Nav li a:hover ul li a:hover {
				background:#888;
				color:#fff
				}
		
		.Red  ul#Nav li:hover ul li:hover ul li a,
		.Orange  ul#Nav li:hover ul li:hover ul li a,
		.Blue  ul#Nav li:hover ul li:hover ul li a,
		.Green ul#Nav li:hover ul li:hover ul li a,
		.Black ul#Nav li:hover ul li:hover ul li a,
		.Grey ul#Nav li:hover ul li:hover ul li a {
			background:#e2e2e2;
			color:#555				
			}

		
			
/*=====================================================*/
	
	
	/* use the table to position the dropdown list */
	ul#Nav table,
	ul#Nav ul li table{
		margin:-1px; 
		position:absolute;
		border-collapse:collapse;
		z-index:100;
		left:0px;
		top:32px
		}
	
	/* style all the links */
	ul#Nav a, 
	ul#Nav a:visited {
		display:block;
		line-height:25px		
		}
	
	ul#Nav li a, ul#Nav li a:visited {
		display:block; 
		height:25px
		}
		
	ul#Nav li ul {
		font-weight:400;
		display: none
		}
	

	/* specific to non IE and IE7 browsers */
		
	ul#Nav li:hover ul li ul {
		display:none
		}
		
	ul#Nav li:hover ul {
		background:#e2e2e2;
		display:block;
		height:auto;
		left:0;
		margin-top:0;
		position:absolute;
		width:150px;
		z-index:100;
		}
	
	ul#Nav li:hover ul li a {
		background:#e2e2e2;
		border-bottom:1px solid #fff;	
		display:block;
		height:auto;
		line-height:18px;
		width:150px
		}
	
	/*style untuk submenu dengan submenu*/
	ul#Nav li:hover ul li a.submn2, 
	ul#Nav li a:hover ul li a.submn2  {
		background:#e2e2e2
		}
		
	
	
	ul#Nav li:hover ul li:hover ul {
		display:block;	
		left:180px;
		margin-top:-32px;
		position:absolute;
		width:150px
		}
	
	ul#Nav li:hover ul li:hover ul li a {
		background:#e2e2e2;
		border-bottom:1px solid #fff;
		width:150px;
		z-index:100;
		}
	
	/* for IE5.x and IE6 browsers only */
	ul#Nav li a:hover {
		background:transparent	
		}
	
	ul#Nav li a:hover ul {
		background:#e2e2e2;
		display:block;
		left:0;
		margin-top:1px;
		position:absolute;
		top:0
		}
	
	ul#Nav li a:hover ul li a {
		background:#e2e2e2;
		border-bottom:1px solid #fff;
		display:block;
		height:18px;
		line-height:18px;
		width:150px
		}
	
	
	ul#Nav li a:hover ul li a ul {
		height:0;
		position:relative;
		visibility:hidden;
		width:0
		}
	
	ul#Nav li a:hover ul li a.submn2:hover ul li a {
		border-bottom:1px solid #fff;	
		width:150px
		}
	
	ul#Nav li a:hover ul li a:hover ul {
		left:180px;
		position:absolute;
		top:-32px;
		visibility:visible;
		width:150px
		}



/*--------------------------------------------------------------
						05 - FORM
--------------------------------------------------------------*/

ul#Nav li.Search {
	background: url(../images/bg-src.jpg) left no-repeat;
	height:20px;
	padding:6px 20px 6px 6px;
	margin:0 0 0 50px;
	float:right;
	width:195px
}

ul#Nav li.Search input.SrcTxt{
	font-size:1.1em;
	border:0;
	color:#888;
	width:140px;
	margin:0 5px 0 5px;
	padding: 2px
}

ul#Nav li.Search input.BtnSubmit{
	width:25px;
	height:20px;
	cursor:pointer;
	cursor:hand;
	background:transparent;
	font-size:0;
	color:#fff;
	text-indent:-10000px
}


.contactF {
	
	}
	
.contactF input{
	border:1px solid #ccc;
	background:#f7f7f7;
	font-size:0.9em;
	padding:5px 2px;
	color:#444;
	font-size:1.1em
	}

input.txt{
	padding:4px 0;
	}

textarea{
	background:#f7f7f7;
	border:1px solid #ccc;
	height:70px;
	margin:0; 
	width:400px
	}

input.btnClick{
	background:url(../images/btn-submit.gif);
	border:0;
	height:30px;
	width:80px;
	cursor:pointer
	}
	
input.btnCompare{
	background:url(../images/btn-compare.gif);
	border:0;
	height:30px;
	width:80px;
	cursor:pointer
	}

	.contactF label {
		line-height:1.8em;
		float:left;
		width:200px
		}
	.contactF p{
		float:left;
		margin:3px 0;
		width:630px;
		padding:5px 15px 0 0
		}
		
	input.txtTitle{
		width:300px
		}
	.input2{
		width:400px
		}
	.noBorder {
		border:0
		}
		
		

/*--------------------------------------------------------------
		06 - HEADLINE & PARAGRAPH 
--------------------------------------------------------------*/


/* 07 - ADDED LAST */


#container-4{
  overflow:hidden;
  text-align:center
}