/* CSS Document */
*{
	margin:0;
	padding:0;
	outline:none;
}

body{
	font-size:13px;
	font-family:Arial, Helvetica, sans-serif;
	color:#6F6F6F;
	
	background:#FFFFFF;
	background-image: url("images/bg.jpg");
	/*
	background:#558c89;
	*/
	/*
	background:#74afad;
	*/
	/*
	background:#f5f3ee;
	*/
	/*
	#7d1935 - red
	#4a96ad - blue
	#f5f3ee - gray
	#FFFFFF - white
	*/
}

a{
	color:#4a96ad;
	text-decoration:none;
}
a:hover{
	color:#7d1935;
	text-decoration:none;
}
p{
	margin:0;
	padding:10px;
	line-height:18px;
}

z{
	color:#4a96ad;
	margin:0;
	padding:10px;
	line-height:18px;
	font-size:20px;
	font-family:Arial;
}

table{
	margin:0;
	width:100%;
	border-collapse:collapse;
	display:block;
}
td{
	padding:0 10px;
	border-bottom:1px solid #DDDDDD;
}

tr:nth-child(odd){
	background:#FFFFFF;
}
tr:nth-child(even){
	background:#F4F4F4;
}

tr.head{
	height:40px;
	font-weight:bold;
	color:#000;
	background:-moz-linear-gradient(top, #E5F1FF 3%, #BDDBFD 3%, #90C3FC 100%);
	border-top:1px solid #89C7EA;
	border-bottom:1px solid #64B0DB;
	text-shadow:0px 1px 0px #DEF1FB;
}
tr.data{
	height:50px;
	width:950px;
	color:#000;
}
tr.no-data{
	height:40px;
	font-weight:bold;
	color:#ff0000;
	text-align:center;
}
tr.pdf{
	height:35px;
	color:#ffffffff;
}


ol,ul{
	list-style-type:none;
}

textarea,
select[type="text"],
select[type="date"],
input[type="text"],
input[type="date"],
input[type="checkbox"],
input[type="password"]{
	margin:0;
	padding:10px;
	border-radius:4px;
	box-shadow:0px 0px 0px 4px #EFEFEF;
	border:1px solid #C6C6C6;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}

input[type="radio"]{
	margin:0;
	padding:15px 15px;
	border-radius:4px;
	box-shadow:0px 0px 0px 2px #EFEFEF;
	border:5px solid #C6C6C6;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
}

textarea:focus,
select[type="date"]:focus,
select[type="text"]:focus,
input[type="text"]:focus,
input[type="date"]:focus,
input[type="password"]:focus{
	box-shadow:0px 0px 0px 4px #D6E8FC;
	border:1px solid #A5C6EB;
}


input[type="submit"],
input[type="reset"]{
	margin:0;
	padding:6px 20px;
	border-radius:4px;
	box-shadow:0px 0px 0px 2px #CFE4FB;
	
	border:1px solid #6EA9EB;
	font-size:16px;
	font-family:'calibri';
	font-weight:bold;
	cursor:pointer;
	background:#4a96ad;
	color:#FFFFFF;
	text-shadow:0px 1px 0px #CDE2FA;
}

.login-box{
	margin:auto;
	top:5%;
	left:0;
	bottom:25%;
	right:0;
	position:absolute;
	width:400px!important;
}
.login-logo{
	
	margin:0 0 20px 0;
	text-align:center;
}
.login-form{
	margin:auto;
	border:1px solid #80ADE0;
	background:#FFFFFF;
	box-shadow:0px 0px 0px 5px #C1DCF9;
	border-radius:10px;
}
.login-info{
	margin:0;
	padding:15px 20px;
	border-bottom:1px solid #C0C0C0;
	background:-moz-linear-gradient(top, #FFFFFF 3%, #F5F5F5 3%, #EBEBEB 100%);
	font-size:14px;
	text-align:center;
	border-radius:10px 10px 0 0;
	text-shadow:0px 1px 0px #fff;
	color:#000;
}
.login-form form{
	margin:0;
	padding:20px;
}
.login-form form input[type="text"],
.login-form form input[type="password"]{
	width:88%;
	margin:0 0 20px 0;
	padding:10px 0 10px 40px;
}
.login-form form input[type="text"]{
	background: url('../images/icon-1.png') no-repeat 2%;
}
.login-form form input[type="password"]{
	background: url('../images/icon-2.png') no-repeat 2%;
}
.error-login{
	margin:0;
	padding:13px 20px;
	background:-moz-linear-gradient(top, #FFFFFF 3%, #F5F5F5 3%, #EBEBEB 100%);
	text-align:center;
	font-size:14px;
	font-weight:bold;
	color:#FF0000;
	border-top:1px solid #C0C0C0;
	border-radius:0 0 10px 10px;
	text-shadow:0px 1px 0px #fff;
}
.copy{
	font-size:11px;
	text-align:center;
	text-shadow:0px 1px 0px #fff;
	margin:15px 0 0 0;
}

.top{
	float:top;
	height:50px;
}

.welcome{
	
	height:150px;
	width:1200px!important;
}

.wrap{
	margin:20px auto;
	width:1200px!important;
	text-align:justify;
}

.pdfwrap{
	margin:20px auto;
	width:1200px!important;
	text-align:justify;
	background:#FFFFFF;
	
}

.header{
	height:150px;
	border-bottom:1px solid #CCDCEC;
	box-shadow:0px 1px 0px #F5F9FD;
}

.h-left{
	float:left;
	width:550px!important;
}

.h-right{
	float:right;
	width:400px!important;
}

.clear{
	clear:both;
}

.u-title{
	float:right;
	width:400px;
	font-size:35px;
	padding:0 0 0 15px;
	color:#4a96ad;
}
.u-info{
	float:right;
	position:relative;
	margin:20px 0 0 0;
}
.u-foto{
	float:left;
	width:100px!important;
}

.u-foto img{
	border-radius:6px;
}
.u-text{
	float:right;
	width:250px!important;
}
.u-name{

	font-size:20px;
	font-weight:normal;
	padding:0 0 5px 0;
}
.u-link{
	
	padding:0 0 10px 0;
}

.page{
	margin:20px 0;
	padding:0;
}
.p-left{
	float:left;
	width:230px;
}
.p-right{
	float:right;
	width:950px!important;
}
.box{
	width:100%;
	margin:0 3px 20px 3px;
	font-family:Arial, Helvetica, sans-serif;
	border:1px solid #B8AFAF;
	background:#FFFFFF;
	box-shadow:0px 0px 0px 2px #4a96ad;
	border-radius:5px;
}
.box h1{
	margin:0;
	padding:10px 10px;
	border-bottom:1px solid #C0C0C0;
	background:#7d1935;
	font-size:16px;
	border-radius:0px 0px 0 0;
	color:#FFFFFF;
}

.box h2{
	margin:0;
	padding:30px 10px 10px 5px;
	border-bottom:3px solid #7d1935;
	background:#FFFFFF;
	font-size:16px;
	border-radius:0px 0px 0 0;
	color:#7d1935;
	width:97%;
}

.box .nav li{
	line-height:20px;
}
.box .nav li a{
	display:block;
	padding:9px 0 9px 30px;
	font-weight:bold;
	font-size:12px;
	border-bottom:1px solid #C0C0C0;
	background:url('../images/b_minus.png') no-repeat 5% 15px;
	transition:all .25s ease-in-out;
}
.box .nav li a:hover{
	padding:9px 0 9px 40px;
}
.box .nav li:last-child a{
	border-bottom:none;
}
.box .form{
	margin:0;
	padding:10px 20px;
}

.box .form textarea,
.box .form select[type="text"],
.box .form select[type="password"],
.box .form select[type="checkbox"],
.box .form select[type="date"],
.box .form input[type="checkbox"],
.box .form input[type="text"],
.box .form input[type="password"],
.box .form input[type="date"],
.box .form input[type="submit"]
{
	margin:7px 0 10px 4px;
}

.box .form input[type="radio"]{
	margin:10px 0 15px 7px;
}

.box .form textarea{
	width:95%;
}

.box .form input#tanggung,
.box .form input#kata,
.box .form input#tgl1,
.box .form input#tgl2,
.box .form input#4dx{
	width:71%;
}

.box .form input#software,
.box .form input#hardware{
	width:81%;
}

.box .form input#enama,
.box .form input#etelp,
.box .form input#namapasangan,
.box .form input#namaayah,
.box .form input#namaibu,
.box .form input#namaanak,
.box .form input#namaanak1,
.box .form input#namaanak2,
.box .form input#namaanak3,
.box .form input#namaanak4,
.box .form input#namasaudara,
.box .form input#namasaudara1,
.box .form input#namasaudara2,
.box .form input#namaref,
.box .form input#telpref,
.box .form input#exnama,
.box .form input#exalamat,
.box .form input#extelp,
.box .form input#telp,
.box .form input#telp_ttp{
	width:25%;
}

.box .form input#ilmupasangan,
.box .form input#ilmuayah,
.box .form input#ilmuibu,
.box .form input#ilmuanak,
.box .form input#ilmuanak1,
.box .form input#ilmuanak2,
.box .form input#ilmuanak3,
.box .form input#ilmuanak4,
.box .form input#ilmusaudara,
.box .form input#ilmusaudara1,
.box .form input#ilmusaudara2,
.box .form input#umurayah,
.box .form input#umuribu,
.box .form input#umuranak,
.box .form input#umuranak1,
.box .form input#umuranak2,
.box .form input#umuranak3,
.box .form input#umuranak4,
.box .form input#umursaudara,
.box .form input#umursaudara1,
.box .form input#umursaudara2{
	width:7%;
}

.box .form input#umurpasangan{
	width:4%;
}

.box .form input#ealamat,
.box .form input#alamatref{
	width:37%;
}
.box .form input#gaji_utama,
.box .form input#gol_kar,
.box .form input#no_rek,
.box .form input#alamat,
.box .form input#alamat_ttp{
	width:50%;
}

.salah{
	margin:0;
	padding:13px 20px;
	background:-moz-linear-gradient(top, #FFFFFF 3%, #F5F5F5 3%, #EBEBEB 100%);
	text-align:center;
	font-size:14px;
	font-weight:bold;
	color:#FF0000;
	border-bottom:1px solid #C0C0C0;
	text-shadow:0px 1px 0px #fff;
}
.footer{
	margin:30px 0;
	padding:10px 20px;
	text-align:center;
	border:1px solid #B8AFAF;
	background:#FFFFFF;
	box-shadow:0px 0px 0px 3px #DFDBDB;
	border-radius:5px;
}

.fitur{
	padding:0;
	margin:10px 0;
}
.fitur li{
	line-height:20px;
	font-weight:bold;
	padding:10px 10px 10px 30px;
	transition:all .25s ease-in-out;
	color:#417A03;
	border-bottom:1px solid #4590DA;
	border-left:13px solid #72B8FD;
	position:relative;
}
.fitur li:nth-child(odd){
	background:#FBFBFB;
}
.fitur li:nth-child(even){
	background:#EEF6FE;
}
.fitur li:after{
	content:'';
	position:absolute;
	top:31%;
	left:0%;
	width:0;
	height:0;
	border-left:9px solid #72B8FD;
	border-top:9px solid transparent;
	border-bottom:9px solid transparent;
}
.fitur li:first-child{
	border-top:1px solid #A1CEFB;
}
.fitur li:hover{
	color:#000;
	padding:10px 10px 10px 40px;
	cursor:move;
	border-left:20px solid #4590DA;
	background:#EEEEEE;
}
.fitur li:hover:after{
	content:'';
	position:absolute;
	top:31%;
	left:0%;
	width:0;
	height:0;
	border-left:9px solid #4590DA;;
	border-top:9px solid transparent;
	border-bottom:9px solid transparent;
}