/* CSS Document */

@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 300;
  src: local('Oswald Light'), local('Oswald-Light'), url(./../fonts/HqHm7BVC_nzzTui2lzQTDT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

@font-face {
  font-family: 'Oswald-Bold';
  font-style: normal;
  font-weight: 700;
  src: local('Oswald Bold'), local('Oswald-Bold'), url(./../fonts/bH7276GfdCjMjApa_dkG6T8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}



body{
	background-color:#FFFFFF;
	/*text-align:left;*/
	padding-top:0px;
    padding-bottom: 0px;	
	scrollbar-face-color:#000000;
    scrollbar-shadow-color:#FFFFFF;
    scrollbar-highlight-color:#FFFFFF;
    scrollbar-3dlight-color:#CECECE;
	scrollbar-darkshadow-color:#000000;
    scrollbar-track-color:#CECECE;
    scrollbar-arrow-color:#FFFFFF;	
	background: url("./../image/wood.jpg") repeat scroll 50% top #ffffff;
}




.content{
	padding-left:10px;
	padding-right:10px;
}


.footer{
	width:auto;
	height:20px;
	clear: both;
	text-align:center;
}

.tabel {
	padding:5px 5px 5px 5px;
	border:#666666 1px solid;
	background-color:#FFFFFF;
}


.judul {
	font-family:Arial;
	color:#000066;
	font-weight:bold;
	margin-bottom:10px;
	margin-top:5px;
}


/*************************************************** data table *********************************************************/
.yu tbody td {	
	padding: 3px 10px 3px 10px;
	border-bottom: solid 1px #999999;
	height:auto;
}

.yu thead th{
	border: 1px solid #7f7f7f;
	cursor:pointer;
	text-decoration: none;
	height:auto;
	text-align: center;    	
    font-weight:bold;
    /*white-space:nowrap;*/
    background-color:#0066CC;
	color:#ffffff;
}
.yu thead td{
    vertical-align:middle;
    background-color: #0066CC;
    border:none;
	padding: 3px 10px 3px 10px;
}

.tabel_header {
	background-color:#0066CC;
	color:#FFFFFF;
	
}

.ket_tabel{
	border-radius:7px; 
	box-shadow: 5px 5px 8px #CCC;
}


.ket_tabel1{
	box-shadow: 5px 5px 8px #CCC;
}

@media (max-width: 200px) {
	body{
		font-size:7px;
	 	font-family: 'Oswald'; 	
	}
	.tabel_header {
		font-size:9px; 
		font-family: 'Oswald';
	}
	.ket_tabel{
		font-size:9px; 
		font-family: 'Oswald';
	}	
	.footer{		
		font-family: 'Oswald';
		font-size:6px;	
	}
}


@media (min-width: 201px) and (max-width: 600px) {
	body{
		font-size:10px;
	 	font-family: 'Oswald'; 	
	}
	.tabel_header {
		font-size:12px; 
		font-family: 'Oswald';
	}
	.ket_tabel{
		font-size:12px; 
		font-family: 'Oswald';
	}	
	.footer{		
		font-family: 'Oswald';
		font-size:9px;	
	}
}



@media (min-width: 601px) and (max-width: 900px) {
	body {
		font-size:12px; font-family: 'Oswald';
 	
	}.tabel_header {
		font-size:14px; 
		font-family: 'Oswald-Bold';
	}
	.ket_tabel{
		font-size:14px; 
		font-family: 'Oswald-Bold';
	}
	.footer{		
		font-family: 'Oswald';
		font-size:11px;	
	}	

}


@media (min-width: 901px) and (max-width: 1400px) {
	body{
		font-size:16px; font-family: 'Oswald';
 	
	}
	.tabel_header {
		font-size:18px; 
		font-family: 'Oswald-Bold';
	}
	.ket_tabel{
		font-size:16px; 
		font-family: 'Oswald-Bold';
	}	
	.footer{		
		font-family: 'Oswald';
		font-size:12px;	
	}
}



@media (min-width: 1401px) {
	body{
		font-size:16px; font-family: 'Oswald';
 	
	}
	.tabel_header {
		font-size:18px; 
		font-family: 'Oswald-Bold';
	}
	.ket_tabel{
		font-size:16px; 
		font-family: 'Oswald-Bold';
	}	
	.footer{		
		font-family: 'Oswald';
		font-size:12px;	
	}
}