   
/* default styles */
/*a { color: #3434FF; text-decoration:none; FONT-FAMILY: 'Muli'; FONT-SIZE: 11px;}
a:hover { color: red; text-decoration:none; FONT-FAMILY: 'Muli'; FONT-SIZE: 11px;}
a:active { color: red; text-decoration: none; FONT-FAMILY: 'Muli'; FONT-SIZE: 11px;}*/

.hrf-1 {
	FONT-SIZE: 10px; COLOR: black; FONT-FAMILY: 'Muli'}
.hrf-2 {
	FONT-SIZE: 10px; COLOR: blue; FONT-FAMILY: 'Muli'}
.hrf-3 {
	FONT-SIZE: 10px; COLOR: white; FONT-FAMILY: 'Muli'}
.hrf-4 {
	FONT-SIZE: 10px; COLOR: red; FONT-FAMILY: 'Muli'}
.hrf-5 {
	FONT-SIZE: 16px; COLOR: black; FONT-FAMILY: 'Muli'}
.hrf-6 {
	FONT-SIZE: 10px; COLOR: white; FONT-FAMILY: 'Muli'}
.hrf-7 {
	FONT-SIZE: 10px; COLOR: black; FONT-FAMILY: 'Muli'}	
		
.button { padding: 4px; font: 10px 'Muli'; COLOR: black; }
	
<!--untuk tabel-->
p, td, th {
    font:'Muli';
}

.datatable {
    border: 1px solid #00a6e2;
    border-collapse: collapse;
}
.datatable td{
    border: 1px solid #00a6e2;
    padding: 5px;
	font-family:'Montserrat';
	font-size:11px;
	color: #5e5e5e;
}
.datatable tr{
    border: 1px solid #00a6e2;
    padding: 5px;
	font-family:'Montserrat';
	font-size:11px;
	color: black;
}

.datatable input, textarea{
    border: 1px solid #D6DDE6;
	padding: 3px;
	font-family:'Montserrat';
	font-size:10px;
	color: black;
}
.datatable select, option{
    border: 1px solid #D6DDE6;
	font-family:'Muli';
	font-size:11px;
	color: black;
}
.datatable th {
    border: 1px solid #828282;
    background-color: #BCBCBC;
    font-weight: bold;
    text-align: left;
    padding-left: 4px;
	padding-right: 0px;
	text-align:center;
	font-family:'Muli';
	font-size:11px;
}

.datatableprint {
    border: 1px solid #000000;
    border-collapse: collapse;
}
.datatableprint td {
    border: 1px solid #000000;
    padding: 5px;
	font-family:'Muli';
	font-size:8px;
	color: black;
}

.datatableprint th {
    border: 1px solid #000000;
    background-color: #BCBCBC;
    font-weight: bold;
    text-align: left;
    padding-left: 4px;
	padding-right: 0px;
	text-align:center;
	font-family:'Muli';
	font-size:10px;
}

.datatablelogin {
    border: 0px solid #000000;
    border-collapse: collapse;
}
.datatablelogin td {
    border: 0px solid #000000;
    padding: 3px;
	font-family:'Open Sans';
	font-size:11px;
	color: #666;
}

.datatablesitus {
    border: 0px solid #000000;
    border-collapse: collapse;
}
.datatablesitus td {
    border: 0px solid #000000;
    padding: 2px 8px 2px 0px;
	font-family:'Montserrat';
	color: #666;
}

.datatablelogin input, textarea{
    border: 1px solid #D6DDE6;
	padding: 2px;
	font-family:'Open Sans';
	font-size:11px;
	color: black;
}



@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 300;
  src: local('Muli Light'), local('Muli-Light'), url(_fUwxgthNvUM9WCtMyMvbA.woff) format('woff');
}
@font-face {
  font-family: 'Muli';
  font-style: italic;
  font-weight: 400;
  src: local('Muli Italic'), local('Muli-Italic'), url(9pglA9mmygCxuxvISUrc-g.woff) format('woff');
}
@font-face {
  font-family: 'Muli';
  font-style: italic;
  font-weight: 300;
  src: local('Muli Light Italic'), local('Muli-LightItalic'), url(Q5N_zd0042xOVES9NXt9Qj8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: local('Muli'), url(kU4XYdV4jtS72BIidPtqyw.woff) format('woff');
}
@font-face {
  font-family: 'Passion One';
  font-style: normal;
  font-weight: 700;
  src: local('Passion One Bold'), local('PassionOne-Bold'), url(feOcYDy2R-f3Ysy72PYJ2jqR_3kx9_hJXbbyU8S6IN0.woff) format('woff');
}
@font-face {
  font-family: 'Passion One';
  font-style: normal;
  font-weight: 400;
  src: local('Passion One'), local('PassionOne-Regular'), url(fY6k21F1QT2c_Oc3HRNDwobN6UDyHWBl620a-IRfuBk.woff) format('woff');
}
.bg-footer-pemetaan{
	height:20px; 
	background-color: #3f3f3f; 
	background-repeat: repeat-y;
	background: -webkit-gradient(linear, left top, right top, from(#3f3f3f), to(#686868)); 
	background: -webkit-linear-gradient(left, #3f3f3f, #686868); 
	background: -moz-linear-gradient(left, #3f3f3f, #686868); 
	background: -ms-linear-gradient(left, #3f3f3f, #686868); 
	background: -o-linear-gradient(left, #3f3f3f, #686868);
	
	position:absolute;
	z-index:999999; bottom: 0; width:100%; line-height:20px;
	font-size:11px; color:#FFF; text-shadow:1px 1px 1px #000;
}

/*****SIDEBAR******/
.blog-categories {
	margin:0;
	padding:0;
}
.blog-categories li{
	background-color:#fff;
	border: 1px solid #00a6e2;
	margin-top:5px;
	text-transform:normal;
}
.blog-categories li:first-child{
	margin-top:0;
}
.blog-categories li.active a{
	color:#000;
}
.blog-categories li a{
	color:#00a6e2;
	font-weight:bold;
	line-height:30px;
	display:block;
}
.blog-categories li a:hover{
	color:#5e5e5e;
}
.blog-cat-icon {
	display:block;
	float:left;
	margin-right: 5px;
	height:29px;
	width:30px;
	background-color:#00a6e2;
	background-image: url(next-small.png);
	background-repeat: no-repeat;
	background-position: center center;
	transition: all 0.3s ease 0s;
	-webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}
.blog-categories li a:hover .blog-cat-icon{
	background-color:#5e5e5e;
	transition: all 0.3s ease 0s;
	-webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: ease;
}
.blog-categories li.active .blog-cat-icon{
	background-color:#5e5e5e;
}

.contentx input[type=text], .contentx input[type=password], .contentx textarea {
	border:1px solid #fff;
	box-shadow:0 0 0 1px #cecece;
	font-size:11px;
	padding:3px 4px;
}
.contentx input[type=password], .contentx input[type=text], .contentx textarea {
	color:#000;
}
.contentx {
	min-height:0px
}
.contentx input[type=text] {
	background:#fafafa
}
.contentx input[type=password]:focus {
	background:#fff
}
.contentx input[type=password] {
	background:#fafafa
}
.contentx input[type=text]:focus {
	background:#fff
}
.contentx textarea {
	background:#fafafa;
	height:100px
}
.contentx textarea:focus {
	background:#fff
}