td.center {
	font-family:Arial;
	font-size:12px;
	color:#666666;
	text-align:left;
	/*padding:10px;*/
}

td.center2 {
	font-family:Arial;
	font-size:11px;
	color:#666666;
	text-align:left;
	padding:10px 0px 10px 0px;
}

td.right {
	font-family:Arial;
	font-size:11px;
	color:#666666;
	text-align:left;
	padding:10px 0px 0px 0px;
}

td.left {
	font-family:trebuchet ms;
	font-size:11px;
	color:#666666;
	text-align:left;
}

td {
	font-family:trebuchet ms;
	font-size:12px;
	color:#666666;
	padding:0px; 
	text-align:left;
}

td.content {
	font-family:trebuchet ms; line-height:15px;
	font-size:14px;
	color:#999999;
	padding:0px; 
	text-align:left;
}

td.titlecontent {
	font:bold 14px/12px trebuchet ms,arial,verdana; color:#007cc3;
	text-transform:uppercase;
}


form
{
	margin:0px;
}

body
{
background-color:#FFFFFF; margin:0px; padding:0px; background-image:url(../images/bg.jpg); background-position:top; background-repeat:repeat-x; 
}

IMG.sampleborder {
	BORDER-RIGHT: #cccccc 1px solid; BORDER-TOP: #cccccc 1px solid; BORDER-LEFT: #cccccc 1px solid; BORDER-BOTTOM: #cccccc 1px solid
}
IMG.garis {
	margin-right:12px; margin-bottom:0px;
}
IMG.garis2 {
	BORDER-RIGHT: #CCCCCC 1px solid;
	BORDER-TOP: #CCCCCC 1px solid;
	BORDER-LEFT: #CCCCCC 1px solid;
	BORDER-BOTTOM: #CCCCCC 1px solid;
	margin-right:12px; margin-bottom:10px;
}


IMG {
margin:0px; 
}

A:link {
	COLOR: #007cc3; TEXT-DECORATION: none; 
}
A:visited {
	COLOR: #007cc3; TEXT-DECORATION: none; 
}
A:hover {
	LEFT: 1px; COLOR: #007cc3; TOP: 1px; TEXT-DECORATION: none; 
}

A.link:link {
	COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.link:visited {
	COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.link:hover {
	LEFT: 1px; COLOR: #FFFFFF; TOP: 1px; TEXT-DECORATION: underline; font-family:Arial; font-size:11px; font-weight:bold; 
}

A.linktitle:link {
	COLOR: #CCCCCC; TEXT-DECORATION: none; font-family:Arial; font-size:11px; 
}
A.linktitle:visited {
	COLOR: #CCCCCC; TEXT-DECORATION: none; font-family:Arial; font-size:11px; 
}
A.linktitle:hover {
	LEFT: 1px; COLOR: #CCCCCC; TOP: 1px; TEXT-DECORATION: underline; font-family:Arial; font-size:11px; 
}

A.linkmenu:link {
	COLOR: #007cc3; TEXT-DECORATION: none; font:bold 12px trebuchet ms,arial,verdana; 
}
A.linkmenu:visited {
	COLOR: #007cc3; TEXT-DECORATION: none; font:bold 12px trebuchet ms,arial,verdana;
}
A.linkmenu:hover {
	LEFT: 1px; COLOR: #000000; TOP: 1px; TEXT-DECORATION: none; font:bold 12px trebuchet ms,arial,verdana;
}

table.login {
	/*filter:alpha(opacity=75, finishopacity=75, style=1, startx=0, starty=0, finishx=200, finishy=500);*/
	filter:alpha(opacity=60); -moz-opacity: 0.60; opacity: 0.60;
}

A.linkfooter:link {
	COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.linkfooter:visited {
	COLOR: #FFFFFF; TEXT-DECORATION: none; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.linkfooter:hover {
	LEFT: 1px; COLOR: #FFFFFF; TOP: 1px; TEXT-DECORATION: underline; font-family:Arial; font-size:11px; font-weight:bold; 
}

A.linkheader:link {
	COLOR: #000000; TEXT-DECORATION: none; font-family:Arial; font-size:10px; font-weight:bold; 
}
A.linkheader:visited {
	COLOR: #000000; TEXT-DECORATION: none; font-family:Arial; font-size:10px; font-weight:bold; 
}
A.linkheader:hover {
	LEFT: 1px; COLOR: #000000; TOP: 1px; TEXT-DECORATION: underline; font-family:Arial; font-size:10px; font-weight:bold; 
}

A.readmore:link {
	COLOR: #7D001A; TEXT-DECORATION: underline; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.readmore:visited {
	COLOR: #7D001A; TEXT-DECORATION: underline; font-family:Arial; font-size:11px; font-weight:bold; 
}
A.readmore:hover {
	LEFT: 1px; COLOR: #7D001A; TOP: 1px; TEXT-DECORATION: none; font-family:Arial; font-size:11px; font-weight:bold; 
}


a.toplink:link, a.toplink:active, a.toplink:visited {border-left:4px solid #d6d6d6;padding:0px 25px 0px 4px;font:bold 14px/12px trebuchet ms,arial,verdana;color:#007cc3;display:block;float:left;text-decoration:none;text-transform:uppercase;}
a.toplink:hover {border-left:4px solid #7bd3f7;padding:0px 25px 0px 4px;font:bold 14px/12px trebuchet ms,arial,verdana;color:#007cc3;display:block;float:left;text-decoration:none;text-transform:uppercase;}
a.toplink_on:link, a.toplink_on:active, a.toplink_on:visited {border-left:4px solid #7bd3f7;padding:0px 25px 0px 4px;font:bold 14px/12px trebuchet ms,arial,verdana;color:#5281c8;display:block;float:left;text-decoration:none;text-transform:uppercase;}
a.toplink_on:hover {border-left:4px solid #7bd3f7;padding:0px 25px 0px 4px;font:bold 14px/12px trebuchet ms,arial,verdana;color:#5281c8;display:block;float:left;text-decoration:none;text-transform:uppercase;}

a.greenarrow, a.greenarrow:link, a.greenarrow:visited, a.greenarrow:active {font-weight:normal;background:url(../images/greenarrow.gif) no-repeat center left;padding-left:12px;text-decoration:none;color:#709b2c;}
a.greenarrow:hover {text-decoration:underline;}


.slideshowContainer {
	border: 0px solid #ccc;
	width: 450px;
	height: 300px;
	margin-bottom: 0px;
}

.loading {
	background: url(../images/loading.gif) center no-repeat;
}

.slideshowThumbnail {
	outline: none;
}

.slideshowThumbnail img {
	border: 0px solid white;
	padding: 4px;
}

a:hover.slideshowThumbnail img {
	border: 0px solid #ccc;
	padding: 4px;
}

.current img {
	border: 0px solid red;
	padding: 5px;
}

.outline {
	border: 0px solid orange;
	z-index: 0;
	position: absolute;
}

#thumbnails {
	/*width: 130px;
	float: left;*/
}

.droptab-new {position:absolute;top:12px;display:none;z-index:999;background:#fff;text-align:left;border-right:1px solid #d6d6d6;border-left:1px solid #c0c0c0;border-bottom:10px solid #d6d6d6;padding:5px 10px 10px 9px;}
a.dropnav:link, a.dropnav:active, a.dropnav:visited {font-size:11px;font-weight:bold;color:#999;text-decoration:none;padding:3px 25px 3px 0px;background:url(../images/linkbg.gif) repeat-x bottom left;display:block}
a.dropnav:hover {font-size:11px;font-weight:bold;color:#232325;text-decoration:none;padding:3px 25px 3px 0px;background:url(../images/linkbg.gif) repeat-x bottom left;display:block}
.dropnavlink {padding:3px 25px 3px 0px;background:url(../images/linkbg.gif) repeat-x bottom left;}
#top_nav-new {position:relative;top:0px;left:0px;width:520px;padding-top:0px;}



/*I am hiding all demo menus...*/
  .demo {display:none;}
/*...but I could have left them visible and set all image sizes to a standard 48px...*/
  .demo img {border:0px none; padding:0px; width:48px; height:48px; vertical-align:top;}

/*page switching buttons...*/
  #buttons {padding-top:3px;}
  #buttons input {margin-left:6px; border:1px solid #808080; font-size:12px;}
/*shadowbox links/buttons...*/
  #sboxbuttons {margin-top:3px;}
  #sboxbuttons ul {list-style-type:none; padding:0px; margin:0px;}
  #sboxbuttons li {float:left; padding:0px 0px 0px 6px; margin:0px;}
  #goDownload, a.sboxbtn {display:block; border:1px solid #808080; font-size:12px; padding:1px 6px;}
  #goDownload {border:1px solid #ffffff;}
  #goDownload:hover {text-decoration:underline;}

/*shadowbox content styling...*/
  #shadowbox_content.html {color:#333333; font-family:arial; font-size:12px;}
  #shadowbox_other_pages {position:absolute; top:10px; right:10px;}
  #shadowbox_other_pages .sboxbtn {float:left; margin-left:6px;}
  #shadowbox_other_pages .jqDkV {float:left; color:#0000ff; font-size:14px; padding-top:1px; font-weight:bold;}
  div.sbox {padding:0px 10px 10px 10px;}
  div.sbox pre {padding:4px; margin:0px; background-color:#ffffff; border:1px solid #999999; font-family:Courier New, Courier, monospace; font-size:11px;}
/*general...*/
  .hideThis {display:none;}
  .inset200 {padding-left:200px;}
  .inset130 {padding-left:130px;}
  .changesList, .optionsList, .faqslist, .faqslist ul {padding-left:8px; margin-left:8px;}
  .optionsList li, .faqslist li {padding-bottom:9px;}
  .faqslist ul li {padding-bottom:2px;}
  .grey {color:#999999;}
  .dgrey {color:#666666;}
  .red {color:#ff0000;}
  .small {font-size:12px;}
  .transformAdd {color:#0000ff;}
  .transformAddV {color:#9900cc;}
  .transformAddL {color:#009900;}
  .transformRemove {color:#ff0000;}
  
/***************************
**  JQDOCK : EXAMPLE CSS  **
***************************/
/*place the various demo menus around the screen (note: 1, 3, 4 and 7 are horizontal; 2, 5 and 6 are vertical)...*/
  #menu1 {position:absolute; top:0px; padding-left:0px;}
  /*...menu2 needs enough width to show the shrunken images + border, because it's positioned fully to the right...*/
  #menu2 {position:absolute; top:0px; left:20px; width:50px;}
  #menu3 {position:absolute; top:0px; padding-left:0px;}
  #menu4 {position:absolute; top:0px; left:0px;}
  /*if you want to space the images out you can pad them, BUT...
    (a) be aware that for any coefficient other than 1 (linear) this can (will) throw out calculation of the leading edge of the menu
    (b) use a DOCTYPE, otherwise IE will get the spacing wrong
	 (c) Opera v9.5 sometimes has problems with the main axis dimension that I haven't managed to solve yet
    for example...*/
  #menu4 img {padding:0px 4px;}
  #menu5 {position:absolute; top:0px; left:0px;}
  /*...menu6 has zero width, so it's actually the left-hand side of the dock that is 200px from the right-hand edge of the viewport...*/
  #menu6 {position:absolute; top:0px; right:0px; width:0px;}
  #menu7 {display:none; position:absolute; top:0px; left:0px;}

/*dock styling...*/
/*docks (div.jqDock) get absolute position, zero padding and margin, and visible overflow; width and height are calculated*/
  /*...set a default dock background colour...*/
  div.jqDock {background-color:transparent;}
  /*...override background colour and/or border for specific demo docks...*/
  #menu2 div.jqDock {border:0px solid #999999; border-right:0px none;}
  #menu3 div.jqDock {border:0px solid #ff9900;}
  #menu4 div.jqDock {background-color:#FFFFFF; border:0px solid #000000;}
  #menu5 div.jqDock {background-color:#FFFFFF;}
  #menu6 div.jqDock {background-color:#FFFFFF; border:0px solid #0000ff;}
  #menu7 div.jqDock {border:0px solid #0000cc;}

/*label styling...*/
/*labels (div.jqDockLabel) only get absolute position and zero margin (with top and left being calculated); the rest is up to you*/
  /*...let's set some defaults...*/
  div.jqDockLabel {border:0px none; padding:0px 4px; font-weight:bold; font-size:14px; font-style:italic; white-space:nowrap; color:#000000; background-color:transparent;}
  div.jqDockLabelLink {cursor:pointer;}
  div.jqDockLabelImage {cursor:default;}
  /*...and some overrides...*/
  /*...give the right-hand vertical a smaller, non-bold, deep red label, on a white background...*/
  #menu2 div.jqDockLabel {color:#cc0000; background-color:#ffffff; padding:1px; font-size:12px; font-weight:normal;}
  /*...and the left-hand vertical (with the black background) a white, smaller, label...*/
  #menu5 div.jqDockLabel {color:#ffffff; padding:0px;}
 