/* 
--------------------------------------------------
	MES CSS DOCUMENT
	Author: Nalurita 
	Date: Apr, 2008

	TABLE OF CONTENT
	01 - GLOBAL BROWSER RESET
	02 - COMMON STYLE
	03 - LAYOUT, HEADLINE & PARAGRAPH
	04 - NAVIGATION
	05 - FORM
	
-------------------------------------------------- 
*/

/* 01 - GLOBAL BROWSER RESET */
html, body, div, 
h1, h2, p, blockquote, ol, ul, li, 
form, label, input, select {
	margin: 0;
	padding: 0;
}

img, a img {
	border: none;
	outline: none;
}

/* 02 - COMMON STYLE */

body {
	margin:0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#5d857c;
	
}
a {
	text-decoration:none;
	color:#FF851D;
}
a:hover {
	color: #6e6e6e;
}
a:visited {
	text-decoration: none;
}

h2 {
	color:#205247;
	font-size:12px;
}
h1, .video h1{
			font-size:18px;			
			color:#FF9900;
			padding:20px 0 25px 60px;
			margin-bottom:20px;
			background:url(../images/web/icon.jpg) left no-repeat;
			border-bottom:1px solid #dddddd;
		}
.left {
	float: left;
}
.right {
	float: right;
}
.txtcenter {
	text-align:center;
}
.hidden {
	display: none;
}
.clearfloat {
	clear:both;
}

/* 03 - LAYOUT */	
	
#topbannerflash {
	float:right; 
	padding-right:15px;
}
#wrapper {
	width:848px;
	padding:10px; 
	background-color:#fff;
	border:1px solid #ddd;
	margin: 0 auto;	
	/*line-height: 1.6em;*/
}
 /* 03a - LAYOUT ON LEFTCONTENT*/

 #leftcontent{
	width:165px; 
	margin:20px 0 0 0; 
	text-align:center;
	vertical-align:text-top;
 }
	#leftcontent .bannerreg {
		
	}
	#leftcontent .jadwalsholat{
		margin:15px 2px 0 2px;	
	}
		.jadwalsholat ul{
			background-color:#BDDB85;
			font-size:10px;
			line-height:15px;
			color:#205247;		
			padding-top:5px;
			text-align:center;
			list-style-type:none;		
		}	
		.jadwalsholat li{
			text-align:left;
			text-indent:5px;
			color:#51978D;
			background-color:#EEF3EC;
			font-weight:bold;
			border:1px solid #BDDB85;
			line-height:20px;		
		}	
		.jadwalsholat .titlejadwal{		
			font-size:12px;
			color:#205247;
			font-weight:bold;
		}
	#leftcontent .polling{
		text-align:left;
		margin:15px 2px 0 2px;		
		padding:0px 0 10px 4px;
		line-height:14px;
		font-size:10px;
		color:#fff;
		background-color:#2c4b45;
	}
		
		.polling h2 {
			font-size:12px;
			font-weight:normal;
			letter-spacing:2px;
			line-height:30px;
			color:#fff;
		}
		
 /* 03b ------------------------------------
  		LAYOUT ON MAINCONTENT - INDEX
  ----------------------------------------*/
 
 #maincontent {
 	float:left;
	width:468px;
	background:#fff;
	padding:0 0 0 15px;
	margin:20px 15px 0 0px; 
 }
  #maincontent2 {
 	float:left;
	background:#fff;
	padding:0 0 0 0px;
	margin:20px 0px 0 0px; 
 }
 	
	img.topbanner {
			border:0px solid #ddd;
			text-align:center;
			margin-bottom:40px;
		}
 
 	#maincontent .mainline {
		background:url(../images/web/line01.gif) left no-repeat;
		height:12px;	
		margin:10px 0 10px 0;
		clear:both;
	}
 	#maincontent .mainnews {
		line-height:16px;
	}
		.mainnews h2 {
			color:#205247;
			font-size:14px;
			font-weight:bold;
			line-height:30px;
			letter-spacing:2px;
		}
		.mainnews img {
			float:left;
			padding:5px;
			margin:10px;			
			border:1px solid #d2e3c7;			
		}
	#maincontent .ketnews {
		color:#51978e;
		width:460px;
		padding:5px;
		margin:20px 0 0px 0;
		background-color:#eef3eb;
		font-size:10px;
	}
	#maincontent .news {
		line-height:16px;
		float:left;
		width:260px;
	}
		.news h2 {
			color:#205247;
			font-size:11px;
			font-weight:bold;			
			letter-spacing:1px;
		}
		.news img {
			float:left;
			padding:3px;
			margin:5px;			
			border:1px solid #d2e3c7;			
		}
	#maincontent .kons {
		width:190px;
		float:right;
		color:#51978e;
		font-size:10px;
		line-height:14px;		
		background-color:#eef3eb;
		
	}
		.kons .topkons {
			height:50px;
			background:url(../images/web/top_kons.gif) left bottom no-repeat;
		}
			.topkons h2 {
			color:#205247;
			font-size:12px;
			font-weight:bold;
			line-height:50px;
			text-indent:45px;
			}
		.kons .contkons {
			padding:0 5px 0 5px;
			border-left:1px solid #dde7d8;
			border-right:1px solid #dde7d8;
		}
		.kons .btmkons {
			height:15px;
			background:url(../images/web/btm_kons.gif) left bottom no-repeat;
		}
		
	#maincontent .gallery {		
		width:450px; 	
		margin:0 0 15px 0; 		
		background:url(../images/web/bg_gallery.gif) repeat-y;
	}
		.gallery .topgal {
			background:url(../images/web/top_gallery.gif) left bottom no-repeat;
			height:16px;
		}
		.gallery .contgal {
			padding: 0 25px 0 25px;			
			font-size:9px;
		}
			.contgal h2 {
				color:#FF851D;
			}
			.contgal img {
				padding: 3px;
				background-color:#fff;
				border: 1px solid #c0ba57;
			}
			.contgal ul{
				float:left;
				width:120px;
				padding:4px;
			}
			.contgal ul li{
				list-style-type:none;
			}
		.gallery .btmgal {
			background:url(../images/web/btm_gallery.gif) left bottom no-repeat;
			height:16px;
		}
		
 	 /* ------------------------------------------------------
	    03b - LAYOUT ON MAINCONTENT - GALLERY - ARTIKEL
	 --------------------------------------------------------*/
	 	/*added 07feb09*/
	 
	 	.dt_maingal1, .dt_maingal2, .dt_maingal3, .dt_maingal4, .dt_artikel1{
			width:450px; 
			padding:10px 0px;
			border:1px solid #bddead;
	 	}
				
		 .dt_artikel1{
		 	background-color:#fffff5;
			padding:0 0 10px
		 }
		   .dt_artikel1 img {
				float:left;
				border: 1px solid #dfe8dc;
				padding:3px;
				margin:5px 10px;
			}
			
			.titleartikel {
				padding:0 0 0 15px
			}
			
			.titleartikel h2 b{
				font-size:16px
			}
			
			.titleartikel h2{
				text-transform:uppercase;
				float:left;				
				width:225px
			}
						
			.titleartikel span {
				padding:10px;
				background:#d6efbd;
				float:right;
				width:180px
			}
		 		
			 div.ttl{
				background:#fff url(../images/web/ttl-kat.jpg) left no-repeat;
				height:22px;
				color:#FF851D;
				font-weight:600;
				line-height:22px;
				padding:0 10px
			 }
		  
			 table.listArtikel{
				background:#fffff5;
				border:1px solid #bddead;						
				text-align:left;
				width:450px
			 }
			 table.listArtikel a{
			 	color:#5a847b
			}
		 	 table.listArtikel td, table.listArtikel th{			 
				padding:8px		
			 }
			 
			 table.listArtikel th{
			 	font-size:13px;
				text-decoration:underline
			 }
			 
			  table.listArtikel td.r2,  table.listArtikel td.r2 a{			 
				color:#a2c95f			
			 }
			 
		/*end added 07feb09*/
		 .dt_maingal3{
		 	background-color:#eef3eb
		}		
		
		.dt_maingal4{
		 	border:0;
		}
			.dt_maingal1 img {
				float:left;
				border: 1px solid #dfe8dc;
				margin:5px;
			}
			.dt_maingal3 img {
				width:230px;
				height:135px;
				border: 8px solid #666;
				margin:10px 15px 5px 5px;
				float:left;
			}
			.dt_maingal1 .thumb1 {
				float:left;				
				width:160px;
				margin-top:5px;
			}
				.thumb1 img {
					float:left;				
					margin:3px;
					height:50px; 
					width:70px;
					border: 1px solid #dfe8dc;
				}
				.thumb1 h2, p {								
					margin:10px 5px 0 5px;
				}
			
			 .dt_maingal2 img {
			 	float:left;
			 	width:110px;
				height:85px;
				margin: 0 15px 10px 5px;
			 }
			  .dt_maingal4 .judul {
			 	float:left;
				background-color:#BDDB85;
			 	width:450px;
				line-height:20px;
				text-indent:20px;
				margin: 0;
			 }
			  .dt_maingal4 img{
			 	float:left;
				margin:15px;
				padding:5px;
				background:#fff;
				border:1px solid #ddd;
				width:100px;
				height:70px;
			 }
			  .dt_maingal4 img a:hover{			 	
				background:#aaa;				
			 }
			 .dt_maingal4  .pagenating{
			 	float:right;
			 	text-align:right;
			 }
			 .dt_maingal2 .grs {
			 	clear:both;
			 	size:1px;
				border:1px solid #eef3eb;
				width:425px;
			 }
			 
	.subline, .subline2 {
		background:url(../images/web/line_b1.gif) left no-repeat;
		height:11px;	
		margin:5px 0 0px 0;
		clear:both;
	}
	.subline2 {
		background:url(../images/web/line_b2.gif) left no-repeat;
	}
	
		/* 03b ---------------------------------------
				LAYOUT ON MAINCONTENT - IKLAN 
			------------------------------------------*/
			
			.grs {
			 	clear:both;
			 	size:1px;
				margin:10px 0;
				border:1px solid #51968e;
				width:445px;
			 }
			
			
			.iklan1{
				width:450px; 
				margin:10px 0;			
				background-color:#072c24;					
			}
			.ktgr_iklan1{
				color:#ffffff;
				font-weight:bold;
				padding:10px;
			}
			.content1, .content2, .content3{
				padding:10px;
			}
	 		.content1 .jdl a{
				line-height:25px;
				border-bottom:1px dashed #FF851D ;
			}
			
				.iklan2{
					width:450px; 
					margin:10px 0;			
					background-color:#eef3eb;					
				}
				.ktgr_iklan2, .ktgr_iklan3{
					font-weight:bold;
					padding:10px;
				}				
				.content2 .jdl a, .content3 .jdl a{
					color:#0f4b3e;
					line-height:25px;
					border-bottom:1px dashed #205247;
				}
				.content2 .jdl a:hover, .content3 .jdl a:hover  {
					color:#51968e;
				}
	 	.iklan3{
			width:450px; 
			margin:10px 0;			
			background-color:#bdda85;					
		}
		
		
		/* 03b -----------------------------------
			 LAYOUT ON MAINCONTENT - PERBANKAN
			 ------------------------------------*/
		.perbankan h3{
			font-size:18px;
			font-family:Verdana, Arial, Helvetica, sans-serif;
			color:#FF9900;
			line-height:30px;
		}
		.perbankan a{			
			color:#205247;		
		}
		.perbankan a:hover{			
			color:#FF9900;
		}
		
		/* 03c -----------------------------------
             LAYOUT ON MAINCONTENT - KONSULTASI
             ------------------------------------*/
       .konsultasi img {
            margin:0 0px 20px 10px;
        }
        .konsultasi ul{
            list-style-type:none;
        }
        .konsultasi ul li{
            list-style-type:none;
            padding: 10px 0 0 15px;           
        }
        .konsultasi h3{
			margin:-42px 0 0 60px; 
        }
        .konsultasi h3 a{
            background:#EEF3EB;
            padding:5px 15px;
            display:block;
            width:440px;
            font-size:12px;
        }
        .konsultasi h3 a:hover{
              background:#5d857c;
              color:#EEF3EB;
            }
        .konsultasi a{
              color:#5d857c;
            }


		/* -----------------------------------
				   tambahan pada form
					 ------------------------------------*/
		.fsearch {
				margin-left:10px;
				line-height:16px;
				color:#41c3c3;   
			}   
			.fsearch .txtsearch {       
				line-height:16px;
				color:#205247;
				font-size:10px;
			}

		.forminput legend{
			font-size:14px;
			font-weight:600;
			color:#51968e;
		  }
		  .forminput fieldset{
			border:1px solid #51968e;
			padding:15px;
			margin:20px 0
		  }
		  form.forminput p label{
			width:100px;
			float:left
		  }
		
		/* 03c -----------------------------
			 LAYOUT ON MAINCONTENT - VIDEO
			 ------------------------------*/
			 
		.video {
			margin-left:20px;
			width:550px;			
		}
		.video .marq{
			line-height:30px;
			border-top:1px solid #eee;
			border-bottom:4px solid #eee;
			color:#666;
		}
		.video .videocontent{
			margin:30px 0 30px 0;
		}
		
		.jdl_list {
		padding-top:10px;
		color:#FF9933;
		font-weight:bold;
		font-size:14px;
		line-height:20px;
		}
		.alist a{
			color:#666;
			line-height:20px;
		}
		
 /* 03C ---------------------------
 	 LAYOUT ON RIGHTCONTENT
	 -----------------------------*/
 
 #rightcontent {
  	float:right;
	width:180px; 
	margin:20px 0 0 0; 
 } 
 
  #rightcontent .line {
		background:url(../images/web/line02.gif) left no-repeat;
		height:12px;	
		margin:10px 0 10px 0;
		clear:both;
  }
  	#rightcontent .movingadv {
 	 	background:url(../images/web/bgadv.gif) left no-repeat;
		height:180px;
		width:177px;	
			
  	}
		.movingadv .contmovadv {
				padding:10px 5px 0px 5px;
				height:160px;
				width:170px
		}
		.movingadv p {
				padding-top:10px;
				font-size:10px;
		}
	#rightcontent .mnadv {
		background-color:#eef3eb;
		width:161px;	
		padding:15px 5px 15px 5px;
		border:3px solid #d2e3c7;
	}
		.mnadv ul {
			list-style-type:circle;
			margin-left:10px;
		}
		.mnadv ul li{
			margin-left:15px;		
			line-height:16px;
		}
	#rightcontent .agenda, #rightcontent .milis {
		margin-bottom:10px;
		font-size:9px;
		color:#51978e;
	}
		.agenda h2, .milis h2{
			line-height:22px;
		}
		.agenda p, .milis p{
			margin-bottom:8px;
		}
		.agenda a {
			color:#51978e;
		}
		.agenda a:hover{
			color:#ff871d;
		}
		
	#rightcontent .kurs {
		font-size:10px;
	}
		.kurs .kursdate {
		background-color:#072c24;
		text-align:center;		
		width:160px;
		line-height:30px;
		color:#e7ffb9;
		margin:0 0 5px 10px;
		}
		.kurs table {
			width:160px;
			border:0;
			background-color:#bdda85; 
			margin:0 0 0 10px;
		}
		.kurs td, .kurs th {
			background-color:#eef3eb;
			line-height:20px;
		}
		.kurs th.first {
			background-color:#bdda85; 
		}
	
	
 /* 03C - LAYOUT ON RIGHTCONTENT - iklan baris */	
	
	#rightcontent .jdlktgr {
		width:175px;
		border-bottom:1px dashed #FF851D ;
		color:#FF851D ;
		font-weight:bold;
		margin-top:22px;
	}
	#rightcontent ul.ktgr {
		margin:10px 0 20px 20px;
		list-style-type:circle;
	}
	 ul.ktgr li a{
		line-height:18px;
		color:#5d857c;
	}
/* 04 - NAVIGATION */

.topmenu, .topmenu a{
	color:#E8FFBB; 
	font-family: tahoma,verdana, arial; 
	font-size:11px; 
	font-weight:bold;
	text-decoration:none;
}
	.topmenu a:hover{
	color:#fff;
	}
#menulang {
	font-size:11px; 
	text-decoration:none;
	margin:0 175px 0 0;
}


.mainmenu {
	margin:5px 0 0 5px;
	text-align:left;
}
	.mainmenu ul{			
		padding-top:10px;
		font-family:verdana, tahoma, arial; 
		font-size:12px;
		color:#FF851D;		
		/*list-style-type:disc;*/
		list-style-type:none;
		line-height:22px;
	}
	.mainmenu ul li{
		margin-left:1px;
		text-align:left;
		list-style-type:none;
		padding-left:5px;
		background:url(../images/web/btn.gif) left top no-repeat;
		/*list-style-type:disc;*/
		line-height:16px;
	}
	.mainmenu a{
		font-family:verdana, tahoma, arial; 
		font-size:11px; 
		line-height:16px;
		color:#E8FFBB;
		text-decoration:none;
	}
	.mainmenu a:hover{
	color:#588d42;
	}
	
/* 05 - form */
	.fsearch {
		margin-left:10px;
		line-height:16px;
		color:#41c3c3;	
	}	
	.fsearch .txtsearch {		
		line-height:16px;
		color:#205247;
		font-size:10px;
	}

/*master tabel*/
/* ---- TABS ---- */
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none !important;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif;
    font-size: 12px;
}
.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 1px;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
}
.ui-tabs-nav a, .ui-tabs-nav a span {
    float: left; /* fixes dir=ltr problem and other quirks IE */
    padding: 0 19px;
    background: url(../images/web/tabs.png) no-repeat;
}
.ui-tabs-nav a {
    margin: 6px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    background-position: 100% 0;
    text-decoration: none;
    white-space: nowrap; /* @ IE 6 */
    outline: 0; /* @ Firefox, prevent dotted border after click */
}
.ui-tabs-nav a:link, .ui-tabs-nav a:visited {
    color: #545454;
}
.ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 2px;
    z-index: 2;
    margin-top: 0;
    background-position: 100% -23px;
}
.ui-tabs-nav a span {
    padding-top: 1px;
    padding-right: 0;
    height: 20px;
    background-position: 0 0;
    line-height: 20px;
}
.ui-tabs-nav .ui-tabs-selected a span {
    padding-top: 0;
    height: 27px;
    background-position: 0 -23px;
    line-height: 27px;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited,
.ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    /*opacity: .4;
    filter: alpha(opacity=40);
	*/
}
.ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited {
    color: #000;
}
.ui-tabs-panel {
    border: 1px solid #eee;
    padding: 10px;
    background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
}
/*.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}*/

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* auto clear @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}

/* ---- CSS Table --- */
.filter {
	padding: 3px 0 3px 0;
	margin-bottom: 3px;
	background: #F0F0F0;
	border: 1px solid;
}
.tbl_list {
    border-spacing:1px;
	border: 1px solid #666;
    color: #666;
	width: 100%;
}

.tbl_list thead th {
	background:#F0F0F0 none repeat scroll 0 0;
	border-bottom:1px solid #999999;
	border-left:1px solid #FFFFFF;
	color:#666666;
	text-align:center;
	padding: 4px;
}

.tbl_list tbody tr {
    background-color: #fff;
    text-align: left;
}

.tbl_list tbody tr.row1 {
    background: #f9f9f9;
    border-top: 1px solid #fff;
}

.tbl_list tbody tr.row0:hover td,
.tbl_list tbody tr.row1:hover td {
        background-color: #ffd ;
}

.tbl_list tbody tr td {
        height: 25px;
        background: #fff;
        border: 1px solid #fff;
}

.tbl_list tbody tr.row1 td {
        background: #f9f9f9;
        border-top: 1px solid #FFF;
}

a,img {
	margin:0;
	padding:0;
	border: 0;
}
img {
	vertical-align:middle;
	/*behavior: url("images/iepngfix.htc");*/
    border: none;
    cursor: pointer;
}
input,select {
	border: 1px solid #000;
}

.paging_wrap {
	text-align: center;
	padding: 3px 0 3px 0;
	margin-top: 3px;
	background: #F0F0F0;
	border: 1px solid;
}
#maincontent1 {
 	float:left;
	width:355px;
	background:#fff;
	padding:0 0 0 15px;
	margin:10px 5px 0 0px; 
 }
#rightcontent1 {
	float:right;
	width:300px; 
	margin:20px 0 0 0; 
} 
#maincontentaudio {
 	float:left;
	width:660px;
	background:#fff;
	padding:0 0 0 15px;
	margin:10px 5px 0 0px; 
 }
#rightcontentaudio {
	float:right;
	width:120px; 
	margin:20px 0 0 0; 
} 
#mran {
	background:#C1F589;
	font-size: 14px;
	font-weight:bold;
}