/*
Author: Jonath Lee
Website: www.jonathlee.com
Client: Jabatan Bomba Malaysia, Negeri Perak.
Version: 1.1 
Validation: Validated as Css 2.1 
Type: Single compilation

*/

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,
b, u, i, center,
dl, dt, dd, ol, ul, li,
table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;	padding: 0;	border: 0;	outline: 0;	vertical-align: baseline;	background: transparent;}

ol, ul {list-style: none;}
blockquote, q {	quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {	content: '';content: none;}

label {
	float:left;
	text-align:right;
	margin-right:1em;
	width:8em;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
	
}
td{vertical-align: top;}

body {	font-family: "Trebuchet MS", Arial, Verdana;	font-size: 12px;	background-color: #203146;}


/* DEFAULT TEXT STYLING */
h1{	font-size: 20px;	font-weight: bold;	color: #C00;	text-decoration: none;	;}
h2{
	color: #000;
	font-size: 18px;
}
h3{}
h4{}
h5{}

/* DEFAULT TEXT LINKS STYLING */
a:link, a:visited {	color: #039;	text-decoration: none;}
a:hover{color: #09C;}
a:active{}

/* WEBSITE STRUCTURE */
#wrapper {margin: 0 auto;	width: 960px;}
#header {color: #333;	width: 960px;	float: left;	height: 160px;	background-image: url(img/header.png);	background-repeat: repeat-x;	background-position: left top;	background-color: #900;}
#headerLeft{
	height:122px;
	width:270px;
	float:left;
}
#headerCenter{
	height:94px;
	width:500px;
	float:left;
	font-style: normal;
	font-weight: bold;
	color: #FFF;
	text-decoration: none;
	text-align: left;
	padding-top: 28px;
	font-family: "Times New Roman", Times, serif;
}
#headerCenter h1{
	font-size:19px;
	color: #FFF;
	font-style: italic;
}
#headerCenter h2{
	font-size:22px;
	color: #FFF;
}
#headerCenter h3{
	font:20px;
	float: right;
}
#headerRight{
	height:122px;
	width:190px;
	float:left;
}

#flashHeader {	float: left;	width: 960px;	color: #333;	background-color:#000;	height: 260px;	z-index: 1;	position: relative;	margin-bottom: 10px;}
#flash{	width:710px;	height:260px;	z-index: 2;}
#tipsColumn{	width:230px;	height:240px;	padding: 10px;}

#leftcolumn {	color: #333;	background:#FFF;	width: 180px;	float: left;	padding-bottom: 10px;	margin-bottom: 10px;	border-right: solid 1px #E6E6E6;}
#content {	float: left;	color: #333;	background:#FFF;	width: 528px;	display: inline;}
#contentColumn{	width:488px;	padding:10px 20px;	margin-bottom: 10px;	color: #666;}
.contentSection {
	border-bottom:solid 1px #EBEBEB;
	margin-bottom: 20px;
	padding-bottom: 20px;
	text-align: justify;
}
#rightcolumn {	width: 240px;	float: left;	margin-left: 10px;}
#footer {	width: 940px;	clear: both;	color: #FFF;	background-image: url(img/footerBG.png);	background-repeat: repeat-x;	background-position: left top;	height: 54px;	padding: 0 10px;	margin-bottom: 20px;}


/* SEDIA MENYELAMAT LOGO - HEADER RIGHT */
#contact999{
	height: 122px;
	width: 190px;
	background-image: url(img/dial.jpg);
	background-repeat: no-repeat;
	background-position: right top;
}

/* BREADCRUMB */
#breadcrumb{	width:96%;	background-color:#F0F0F0;	padding: 5px 10px;}
#breadcrumb a:link, #breadcrumb a:visited{	color:#C00;	font-size: 12px;	text-decoration: none;}
#breadcrumb a:hover{	color:#F00;	text-decoration: underline;}

/* TIPS SECTION - RED*/
#tips1{	width:230px;	height:110px;	background-image: url(img/tipsR.png);	background-repeat: no-repeat;	background-position: left top;	font-weight: bold;	color: #FFF;	margin-bottom: 20px;}
#tips1 span{	font-size: 24px;	margin-left: 50px;	line-height: 130%;}
#tips1 a{	display: block;	text-decoration: none;	padding: 10px;	color: #FFF;}
#tips1 a:link, #tips1 a:active{	color: #FFF;	display: block;}
#tips1 a:hover{	color: #000;}

/* TIPS SECTION - Yellow*/
#tips2{	width:230px;	height:110px;	background-image: url(img/tipsY.png);	background-repeat: no-repeat;	background-position: left top;	font-weight: bold;	color: #000;	text-align: center;	font-size: 13px;}
#tips2 span{	font-size: 26px;}
#tips2 a{	display: block;	text-decoration: none;	padding: 10px;	color: #000;}
#tips2 a:link, #tips1 a:active{	color: #000;	display: block;}
#tips2 a:hover{	color: #990;}


/* VERTICAL MENU */
.titleHeading{	background:url(img/columnHeader.png) repeat-x top left #C00; width:170px;	height:26px;	color:#fff;	font-size:16px;	font-weight: bold;	padding: 2px 0px 0px 10px;}
.buttonmenu{list-style-type: none;width: 180px;}
.buttonmenu li a{color: #333;	display: block;	width: 160px;	padding: 4px 10px;	text-decoration: none;	font-weight: bold;	background-color: #FFF;	text-decoration:none;	border-bottom: solid 1px #DCDCDC;}
.buttonmenu li a:visited{	color: #666;}
.buttonmenu li a:hover{	color: #C00;	background-color: #F0F0F0;}
.buttonmenu li a:active{color:#F00;}


/* NEWS BUTTONS */
.newsBox{list-style-type: none;width: 180px;}
.newsBox li a{color: #333;	display: block;	width: 160px;	padding: 4px 10px;	text-decoration: none;	font-weight: normal;	background-color: #FFF;	text-decoration:none;	border-bottom: solid 1px #DCDCDC;}
.newsBox li a:visited{	color: #666;}
.newsBox li a:hover{	color: #C00;	background-color: #F0F0F0;}
.newsBox li a:active{color:#F00;}

/*ETC*/
.statistics {padding:10px;}

/* SYNDICATE */
a.Rss, a.Digg{	height:29px;	background-position:center top;	width: 70px;}
a.Rss{	background-image:url(img/btnRss.jpg);	width:70px;	float: left;}
a.Digg{	background-image:url(img/btnDigg.jpg);	width:70px;	float: right;}
a.Rss:link, a.Digg:link ,a.Rss:visited, a.Digg:visited {	text-decoration: none;	display: block;}
a.Rss:hover, a.Digg:hover{	background-position: center bottom;}
a.Rss:active, a.Digg:active{ background-position: center bottom}
.button {display: block; background-repeat: no-repeat; background-position: 0px 0px; }
.hide{ display:none; margin:0; padding:0;}


/* VALIDATOR*/
a.xhtml, a.vcss{height:18px;	background-position:center bottom;}
a.xhtml{background-image:url(img/vxhtml.png);	width:79px;	float: left;}
a.vcss{	background-image:url(img/vcss.png);	width:59px;	float: right;	background-repeat: no-repeat;}
a.xhtml:link, a.vcss:link ,a.xhtml:visited, a.vcss:visited {	text-decoration: none;	display: block;}
a.xhtml:hover, a.vcss:hover{	background-position: center top;}
a.xhtml:active, a.vcss:active{ background-position: center bottom}

/* ALTERNATIVE BUTTONS */
.altNav{height: 24px;	color: #F99;	padding-top: 5px;}
.altNav a {color: #F00;	text-decoration: none;}
.altNav a:link, .altNav a:visited {	color: #FFF;}
.altNav a:hover {color: #FCC;}
.altNav a:active {color: #600;}


/* OPTION BAR */
#optionBar{	height: 70px;	width: 240px;	float: left;	margin-bottom: 10px;	background-image: url(img/optionBar.png);	background-repeat: repeat-x;	background-position: left top;}


/* LANGUAGE BAR*/
#languageBar{height: 25px;	text-align: center;	padding-top: 10px;}
#languageBar a {	color:#000;	text-decoration: none;	font-size: 12px;	font-weight: bold;}
#languageBar a:link, #languageBar a:visited {	color:#000;}
#languageBar a:hover {	color:#09C;}
#languageBar .current {	color:#C00;	text-decoration: underline;}

/* SEARCH BAR */
#searchBar{	width: 220px;	text-align: right;	float: right;	vertical-align: top;	height: 28px;	padding: 7px 20px 0px 0px;}
.searchInput{border: 1px solid #999;	background-color: #FFF;	height: 16px;	color: #333;}


/* MEMBERSHIP SYSTEM */
#membership{	border: solid 1px #B7CDD5;	float: left;	width: 238px;	background-color: #F5F5F5;	font-size: 12px;	color: #333;	text-align: center;	margin-bottom: 10px;}
.mbsHead{	background-image: url(img/columnHeader.png);	background-repeat: repeat-x;	background-position: left top;	width: 228px;	font-size: 16px;	font-weight: bold;	color: #FFF;	text-decoration: none;	height: 28px;	padding-left: 10px;	margin-bottom: 4px;	text-align: left;}
.mbsInput{	height: 14px;	margin-top: 2px;	margin-bottom: 2px;	width: 140px;	font-size: 12px;	color: #666;}

a.login, a.css{	height:30px;	background-position:center top;	background-image:url(img/mbs_login.png);	width:140px;	float: right;}
a.login:link, a.login:visited{	text-decoration: none;	display: block;}
a.login:hover{	background-position: center bottom;}
a.login:active{ background-position: center bottom}


a.register, a.css{	height:38px;	background-position:center bottom;	background-image:url(img/mbs_register.png);	width:238px;	float: right;	background-repeat: no-repeat;}
a.register:link, a.register:visited{	text-decoration: none;	display: block;}
a.register:hover{	background-position: center top;}
a.register:active{ background-position: center bottom}


/* ADDRESS PANEL ON RIGHT BOTTOM*/
#address{	width:220px;	height:106px;	color:#FFF;	background:url(img/addressBar.png) no-repeat top left #C00;	float: left;	padding: 10px;}
#address h1 {	font-size:14px;	font-weight:bold;	color: #FFF;}


/* TEXT STYLE */
.txtGreen{color:#0C0}
.txtBlue1{color:#06C}
.txtBlue2{color: #0CF;}
.txtBlue3{color: #0CF;}
.txtBlack{color: #000;}
.txtGrey1{color: #666;}
.txtGrey2{color: #999;}
.txtGrey3{color: #999;}
.txtRed1{color: #C00;}
.txtRed2{color: #F00;}
.txtWhite{color: #FFF;}
.txtArial{	font-family:Arial, Helvetica, sans-serif;	line-height: 130%;}
.txtTimes{ font:"Times New Roman", Times, serif;}

.txt14{	font-size: 14px;}
.txt16{	font-size: 16px;}

/* Media Player */
#mediaPlayer{	width:240px;	height:238px;	background-color: #FFF;	float: left;	margin-bottom: 10px;}
.mediaPlayerHead{	height:28px;	font-size: 18px;	padding-top: 4px;	background-image: url(img/optionBar.png);	background-repeat: repeat-x;	background-position: left top;	font-weight: bold;	color: #666;	text-align: center;	text-decoration: none;}
.mediaPlayerContent{	padding:10px 10px 0px 10px;}
.mediaTitle{	width:100%;	text-align:center;	color: #999;	margin-top: 5px;}

#infoSemasa{	width:240px;	height:358px;	background-color: #FFF;	float: left;	margin-bottom: 10px;}
.infoSemasaHead{	height:28px;	font-size: 18px;	padding-top: 4px;	background-image: url(img/optionBar.png);	background-repeat: repeat-x;	background-position: left top;	font-weight: bold;	color: #666;	text-align: center;	text-decoration: none;}
.infoSemasaContent{	padding:10px 10px 0px 10px;}

#contactUs{	width:240px;	height:158px;	background-color: #FFF;	float: left;	margin-bottom: 10px;}
.contactUsHead{	height:28px;	font-size: 18px;	padding-top: 4px;	background-image: url(img/columnHeader.png);	background-repeat: repeat-x;	background-position: left top;	font-weight: bold;	color: #FFFFFF;	text-align: center;	text-decoration: none;}
.contactUsContent{	padding:10px 10px 0px 10px;background-color: #F5F5F5;}
/* CONTENTS SECTION */


/* PERJAWATAN */
.tablePerjawatan{	border:solid 1px #CCC;	}
.tablePerjawatan td{	padding: 4px 8px;	border:solid 1px #CCC;}
.tableHeadPerjawatan{	padding:5px 0px;	color: #FFF;	text-decoration: none;	background-color: #069;	border: solid 1px #FFF;}

/* PANGKAT */
.tablePangkat{	border: solid 1px #CCC;}
.tdPangkatH1{
	padding: 6px 0px;
	background-color: #C00;
	color: #FFF;
	font-weight: bold;
	text-align: center;
}
.tdPangkatH2{	font-weight: bold;	color: #FFF;	text-decoration: none;	background-color: #069;	padding: 6px 10px;}
.tdPangkatItem{ padding:5px;}

/* FEEDBACK FORM */
.tableFeedback{	font-size: 13px;	color: #000000;	font-weight: bold;	text-decoration: none;}
.tableFeedback td{ padding:6px 10px;}
.InputFeedback{	height:16px;	font-size:12px;	border: solid 1px #CCC;}
.TextareaFeedback{}

/* KELAB 3K - COLOR TABLE*/
.tableKelab{ border:solid 1px #CCC;}
.tdKelabHead{ background-color:#FF3300; color:#FFFFFF;}
.tableKelab td{
	border:solid 1px #CCC;
	text-align:center;
	background-color:#FFF;
	color: #F60;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
}

/* CONTENTS TYPE */
.contentType{
	width:468px;
	color:#FFF;
	font-size: 20px;
	font-weight: bold;
	background-color: #004A92;
	background-image: url(img/contentstype.png);
	background-repeat: repeat-x;
	background-position: left top;
	padding: 2px 10px 4px 10px;
	margin-bottom: 10px;
}
/* LIBRARY FOR DYNAMIC CALL */
.left { float:left;}
.right { float:right;}
.clearL { clear:left;}
.clearR { clear:right;}
.clearB{ clear:both;}
.tdPadVer{	padding: 5px 0px;	text-align: left;	vertical-align: top;}
.tdPadHor{ padding: 0px 10px;}
.tdPad10{ padding:10px;}
.borderGrey {	border:solid 1px #CCC;	padding: 5px 0px;}
.borderGreyPad10 {	border:solid 1px #CCC;	padding: 10px;}
.tdYellow{	border:solid 1px #FFF;	background-color:#FC0;	color: #000;}

a.link01 {	color:#CCCCCC;}
a.lnk01:link, a.lnk01:visited {	color:#CCC;}
a.lnk01:hover{ text-decoration:underline;}

.subButton{	list-style-type: none;	width: 100%;}
.subButton li a{	color: #FFF; display: block;	width: 97%;	text-decoration: none;	font-weight: bold;	background-color: #C00;	text-decoration:none;	border-bottom: solid 1px #900;	padding: 4px 0px 4px 3%;	background-image: url(img/subArrow1.gif);	background-repeat: no-repeat;	background-position: left center;}
.subButton li a:visited{	color: #FFF;}
.subButton li a:hover{	color: #FF9;	background-color: #900;	background-image: url(img/subArrow2.gif);	background-repeat: no-repeat;	background-position: left center;}
.subButton li a:active{	color:#C00;	text-decoration: none;	background-color: #600;}

.backToTop{	width:100%;	height:20px;	color:#990000;	text-align:right;	font-weight: bold;	text-decoration: none;}
.backToTop a:link, .backToTop a:visited {
	width:80px;
	display:block;
	color:#FFF;
	background-color:#000;
	float:right;
	text-align: left;
	background-image: url(img/return.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 10px;
	height: 20px;
}
.frontlink{
	text-decoration:none;
	color:#666666;
}
.frontlink strong{
	color:#006699;
}
/* Table */
.mytable{
	border: 1px solid rgb(255, 255, 255);
}
.mytable th{ 	
	background-color: #C00;
	color: #FFF;
	font-weight: bold;
	text-align: center;
}
.mytable td{
	border-bottom: 1px solid #999999;
}

.odd td{
	background-color:#DFA7A6;
}
.event td{
	background-color:#EFD3D2C;
}
.tblbomba{
	border-top:1px solid #FFFFFF;
}
.tblbomba tr{
	border-bottom: 1px solid #FFFFFF;
	border-left:1px solid #FFFFF;
}
.tblbomba th{
	background-color:#CC3300;
	font-weight:bold;
	color:#000000;
}
.tblbomba td{
	border-right: 1px solid #FFFFFF;
	color:#000000;
}



/* List */
.ullist{
	display:list-item;	
	margin-left:12px;
}
.ullist li{
	padding-bottom:10px;
	list-style:square;
}
.ollist{
	display:list-item;	
	margin-left:12px;
}
.ollist li{
	padding-bottom:10px;
	list-style:decimal;
}
.sebutharga h1{
	color:#F00;
	font-size:11px;
	font-weight:bold;
}
.sebutharga h2{
	color:#36F;
	font-size:11px;
	padding-left:5px;
}
.sebutharga p{
	font-size:11px;	
}