@import url("font-awesome.css");
body{margin:0;overflow-y: scroll;overflow-x: hidden;}
p{font-family: 'Roboto', sans-serif;color: #303030;line-height: 18px;}
th{font-family: 'Roboto', sans-serif;color: #303030;font-size: 14px;font-weight: 400}
td{font-family: 'Roboto', sans-serif;color: #303030;font-size: 13px;}
/* Styling dasar untuk tombol */
.pulse-button {
    background-color: #ff6600;
    color: white;
    padding: 10px 20px;
    font-size: 16px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    outline: none;
    position: relative;
    transition: background-color 0.3s;
}

.pulse-button:hover {
    background-color: #cc5200;
}

/* Efek pulse */
.pulse-button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    background: rgba(255, 102, 0, 0.5);
    border-radius: 50%;
    transform: translate(-50%, -50%) scale(1);
    opacity: 0;
    animation: pulse 1.5s infinite;
}

@keyframes pulse {
    0% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.7;
    }
    100% {
        transform: translate(-50%, -50%) scale(2.5);
        opacity: 0;
    }
}

/*menu//*/
.menudtl ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #242933;
}

.menudtl ul li {
  float: left;
}

.menudtl ul li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.menudtl ul li a:hover:not(.active) {
  background-color: #111;
}

.activem {
  background-color: #04AA6D;
}
.activem1 {
  border-bottom: 2px solid orange;
}
.menuatas{font-family: 'Roboto', sans-serif;font-size: 14px;font-weight: 600;text-transform: uppercase;}
.m-p-20{padding-top: 15px;}
.m-p-10{padding-top: 10px;}
.p-d-20{padding:20px;}
.form-control{border:1px solid#333;}
.field-icon {
	float: right;
	left: -10px;
	margin-top: -25px;
	position: relative;
	z-index: 2;
	cursor: pointer;
	}
#bgheader{
	background: url('../img/header.jpg') no-repeat fixed center;
    background-size: cover;  
    padding-top: 10px; 
    padding-bottom: 15px;
}
#bgheader h1{
	font-family: 'Roboto', sans-serif;
	font-size: 60px;
	font-weight: 700;
	color: #303030;
	line-height: 70px;
	margin:100px 0 130px 0;
}
.bgpage{
	background: url('../img/bgpage.jpg') no-repeat fixed center;
    background-size: cover;
    padding: 60px 0 60px 0;
    margin-top: 70px;
}
.bgpopup{
	background: url('../img/bgpopup.jpg') no-repeat fixed center;
	width: 100%;
	height: 100px;
}
.bg-daftar{
	background-color: #F1F0F5;width: 100%;padding:50px 0 50px 0;
}
.bg-daftar h3{
	font-family: 'Roboto', sans-serif;color: #303030;
	font-size: 36px;
	font-weight: 700;
	margin-top: 80px;
}
.bg-daftar p{
	font-family: 'Roboto', sans-serif;color: #303030;
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
}
.bgfooter-atas{
	background: url('../img/awan.png') no-repeat fixed center;
	width: 100%;
	height: 250px;
	background-repeat: no-repeat;
	background-position: center;
}
.img-footer{width: 60%;margin-bottom:20px;}
.bg-section{padding:50px 0 50px 0}
.bg-section1{padding:100px 0 50px 0}
.judulfaq{
  font-family: 'Roboto', sans-serif;
  font-weight:600;
  font-size: 16px;
  color: #444;
  line-height: 30px;
  text-transform: capitalize;


}
.ket{
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 13px;
	line-height: 15px;
	color: #444;
}
.judul-faq2{
	font-family: 'Roboto', sans-serif;
	  font-weight:600;
	  font-size: 14px;
	  color: #444;
	  line-height: 30px;
	  text-transform: capitalize;
}
.judul-faq2 span{
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	font-size: 12px;
	line-height: 15px;
	color: #444;
}
.kotak-yt{
	width: 100%;
	height: 200px;
	margin-bottom: 10px;
	
}
.info{background-color: }
.infopopup{width: 100%;height: auto;padding-top: 20px;}
.infopopup h2{font-family: 'Roboto', sans-serif;color:#303030;margin-bottom: 10px;
font-size: 20px;margin-top: 10px;}
.infopopup p{font-family: 'Roboto', sans-serif;color:#303030;font-size: 13px;line-height: 20px}
.kiri{border-left: 2px solid#ABABAB}
.isi{width: 100%;height: auto;background: #fff;padding: 40px 0 40px 0}
.judulpage{font-family: 'Roboto', sans-serif;color: #fff;font-size: 34px;
text-align: center;text-transform: capitalize;
font-weight: 600;}
.judul{font-family: 'Roboto', sans-serif;color: #fff;font-size: 24px;font-weight: bold;}
.judul2{font-family: 'Roboto', sans-serif;color: #303030;font-size: 20px;font-weight: bold;}
.judul small{font-family: 'Roboto', sans-serif;color: #fff;font-size: 16px;
}
.judulbaru{width: auto;border-left: 5px solid#EB2F00;padding-left: 10px;
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: #303030;
	margin-bottom: 10px;
}
.judulbaru2{
	font-family: 'Roboto', sans-serif;
	font-size: 24px;
	font-weight: 700;
	color: #303030;
	margin-bottom: 10px;
	text-align: center;
}
.judulbaru3{
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #303030;
	margin-bottom: 10px;
	margin-top:20px;
}
.judulbaru4{
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	font-weight: 700;
	color: #303030;
}
.info h1{
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: #303030;
	margin-bottom: 10px;
}
.info span{
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	color: #333;
}
.info p{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	color: #303030;
	line-height: 18px;
	text-align: justify;
}


.ket2{
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #303030;
	line-height: 18px;
}
.alur{width: 100%;height: auto;background: #fff;padding: 60px 0 60px 0}
.alur h2{font-family: 'Roboto', sans-serif;
	font-size: 46px;
	color: #303030;
	text-transform: capitalize;
	font-weight: 700;
	margin-bottom: 20px;
	margin-top: 50px;
	}
.alur p{font-family: 'Roboto', sans-serif;
	font-size: 14px;
	color: #303030;
	line-height: 20px;	
	}
.alur td{
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	color: #303030;
	font-weight:400;
}
.pengajuan{width: 100%;height: auto;background: #F7F7F7;padding: 50px 0 50px 0}
.pengajuan h1{font-family: 'Roboto', sans-serif;
	font-size: 26px;
	color: #303030;
	text-align: center;
	text-transform: capitalize;
	font-weight: bold;
	margin-bottom: 30px;
	}
.pengajuan p{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	color: #303030;
	text-align: center;
	line-height: 20px;
	margin-bottom: 40px;	
}
.footernya td{
	font-family: 'Roboto', sans-serif;
	font-size: 12px;	
	color: #303030;
	line-height: 20px;
	padding-bottom:5px;
	
}
.footernya td i{
	font-size: 18px;
	color: red;
	margin-right: 5px;
}
.footer-bawahnya{
	background-color: red;
	width: 100%;
	height: auto;
	padding: 10px;
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
	font-weight: 400;	
	color: #fff;
	text-align: center;

}
.bok-menu{width: 100%;height: 100px;background: #EB2F00;padding: 20px 5px 20px 5px;margin-bottom: 10px;border-radius: 10px;}
.bok-menu h4{font-family: 'Roboto', sans-serif;color:#fff;text-transform: uppercase;
font-weight: bold;font-size: 16px;}
.bok-menu h5{font-family: 'Roboto', sans-serif;color:#fff;font-size: 14px;}
.bok-menu img{border-radius: 50%;padding:3px;border:3px solid#EB6544;}
.padd0{padding-left: 0px;padding-right:0px}
.text-white{color: #fff}
.login{text-transform: uppercase;padding: 6px 20px;text-align: center;
	border-radius: 20px;color: #fff;background: #F83A3A;text-decoration: none;}
.login:hover{background: #EF7A1D;color: #fff }
.radius{border-radius: 20px}
.pejelasan p,a,li{font-family: 'Roboto', sans-serif;color:#303030;font-size: 14px;line-height: 20px;
text-align: left; }
.nomor{padding:5px 10px;text-align: center;background-color: #FE0000;color: #fff;
	font-size: 14px;font-weight: bold;}
.bok-lap{width: 100%;height: 300px;padding: 10px;
	background: #EBEBEB;
	box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
-webkit-box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
}
.bok-lap td{font-family: 'Roboto', sans-serif;color:#000; font-size: 14px;}
.bok-pemohon{background: #EBEBEB;height:350px;padding:10px;width: 100%;margin-bottom: 20px;
	box-shadow: 11px 14px 5px -7px rgba(82,81,81,0.75);
-webkit-box-shadow: 11px 14px 5px -7px rgba(82,81,81,0.75);
-moz-box-shadow: 11px 14px 5px -7px rgba(82,81,81,0.75);
}
.bok-pemohon h2{
	font-family: 'Roboto', sans-serif;color:#303030;font-size: 16px;font-weight: bold;
	text-transform: uppercase;
}
.bok-pemohon h3{
	font-family: 'Roboto', sans-serif;color:#303030;font-size: 12px;font-weight: bold;
	text-transform: uppercase;line-height: 20px;text-align: justify;
}
.bok-pemohon p{
	font-family: 'Roboto', sans-serif;color:#303030;font-size: 13px;line-height: 20px;
text-align: left;
}
.bok-pemohon td{
	font-family: 'Roboto', sans-serif;color:#303030;font-size: 12px;line-height: 20px;
text-align: left;padding-bottom: 3px;padding-right: 3px;
}
.bok-pemohon img{width: 30px;background: #fff;padding:5px;border-radius: 50%;border:1px solid#FE0000;}
.judullap{
	font-family: 'Roboto', sans-serif;color:#0055CB;font-size: 24px;margin-bottom: 10px;font-weight: bold;
}
.loginbok{width: 100%;height: auto;}
.loginbok h1{
	font-family: 'Roboto', sans-serif;color:#000;font-size: 18px;font-weight: bold;
}
.loginbok h2{
	font-family: 'Roboto', sans-serif;color:#FE0000;font-size: 18px;font-weight: bold;
}
.loginbok p{
	font-family: 'Roboto', sans-serif;color:#000;font-size: 14px;
}
.vertical-menu {
  width: 100%;
}

.vertical-menu a {
  background-color: #eee;
  color: black;
  display: block;
  padding: 12px;
  text-decoration: none;
}

.vertical-menu a:hover {
  background-color: #ccc;
}

.vertical-menu a.active {
  background-color: #04AA6D;
  color: white;
}
.activel{background: #FE0000;color: #fff}
.activem{color: orange}
.besar{font-weight: bold;}
.keterangan{
	width: 100%;font-family: 'Roboto', sans-serif;color:#303030;
}
.keterangan h1{font-size: 16px;text-transform: uppercase;font-weight: bold;
	margin-top: 10px;margin-bottom: 15px;text-align: center;line-height: 20px;}
.keterangan h2{font-size: 14px;text-transform: uppercase;font-weight: bold;
	margin-top: 10px;margin-bottom: 15px;}
.keterangan p,td{font-size: 13px;line-height: 20px;text-align: justify;}
.wrapper {
	  position: relative;
	  display: inline-block;
	  border: none;
	  font-size: 14px;
	  margin:auto;
	  width:100%;
	  margin-left:10%;
	  transform: translateX(-50%);
	}
.wrapper input {
  border: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
  position: absolute !important;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  opacity: 0;
  margin-bottom: 10px;
}

.wrapper label {
  position: relative;
  float: right;
  color: #C8C8C8;
}

.wrapper label:before {
  margin: 5px;
  content: "\f005";
  font-family: FontAwesome;
  display: inline-block;
  font-size: 1.5em;
  color: #ccc;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.wrapper input:checked ~ label:before {
  color: #FFC107;
}

.wrapper label:hover ~ label:before {
  color: #ffdb70;
}

.wrapper label:hover:before {
  color: #FFC107;
}






@media only screen and (min-width:350px) and (max-width:767px){
	.kiri{border:none;padding-top: 20px;}
	.pejelasan p,a,li{font-family: 'Roboto', sans-serif;color:#303030;font-size: 14px;
	line-height: 20px;
	text-align: justify; }
	.judullap{
	font-family: 'Roboto', sans-serif;color:#0055CB;font-size: 16px;margin-bottom: 10px;font-weight: bold;
	}
	.padd0{padding-left:11px;padding-right:11px;}
	.bgpage{
		background: url('../img/bgpage.jpg') no-repeat fixed center;
	    background-size: cover;
	    padding: 20px 0 20px 0;
	    margin-top: 70px;
	}
	.footer h3{
		font-family: 'Roboto', sans-serif;
		font-size: 25px;
		color: #fff;
		font-weight: bold;
		line-height: 30px;
		text-align: center;	
		margin-bottom: 30px;
	}
	.footer h4{
		font-family: 'Roboto', sans-serif;
		font-size: 14px;
		color: #fff;
		font-weight: bold;
		line-height: 20px;
		text-align: center;	
	}
	.sosmed{text-align: center;}
	.alur h2{font-family: 'Roboto', sans-serif;
		font-size: 20px;
		color: #303030;
		text-align: center;
		text-transform: capitalize;
		font-weight: bold;
		margin-bottom: 20px;
	}
	.pengajuan h2{font-family: 'Roboto', sans-serif;
		font-size: 20px;
		color: #303030;
		text-align: center;
		text-transform: capitalize;
		font-weight: bold;
		margin-bottom: 20px;
	}
	#bgheader h1{
		font-family: 'Roboto', sans-serif;
		font-size: 40px;
		color: #303030;
		line-height: 50px;
		margin:50px 0 100px 0;
	}
	.judul{font-family: 'Roboto', sans-serif;color: #fff;font-size: 18px;font-weight: bold;}
	.judul small{font-family: 'Roboto', sans-serif;color: #fff;font-size: 14px;}
	.menu-header-bawah{
		margin-top: 70px;
	}
	.bok-lap{width: 100%;height: 350px;padding: 10px;
		margin-bottom: 15px;
		background: #EBEBEB;
		box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
	-webkit-box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 9px 13px 0px 0px rgba(0,0,0,0.75);
	}
	.bok-lap td{font-family: 'Roboto', sans-serif;color:#000;font-size: 14px;}
	.judullap{
		font-family: 'Roboto', sans-serif;color:#0055CB;font-size: 18px;
		margin-bottom: 10px;font-weight: bold;
	}
	.footer_copy p{
		font-family: 'Roboto', sans-serif;text-align: center;
		font-size: 13px;
	}
	.bok-menu img{width: 100%;}
	.judulbaru{width: auto;border-left: 5px solid#EB2F00;padding-left: 10px;
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 700;
		color: #303030;
		margin-bottom: 10px;
	}
	.judulbaru2{
		font-family: 'Roboto', sans-serif;
		font-size: 18px;
		font-weight: 700;
		color: #303030;
		margin-bottom: 10px;
		text-align: center;
	}
	.judulbaru3{
		font-family: 'Roboto', sans-serif;
		font-size: 14px;
		font-weight: 700;
		color: #303030;
		margin-bottom: 10px;
		margin-top:20px;
	}
	.judulbaru4{
		font-family: 'Roboto', sans-serif;
		font-size: 14px;
		font-weight: 700;
		color: #303030;
	}
	.bg-daftar h3{
		font-family: 'Roboto', sans-serif;color: #303030;
		font-size: 24px;
		font-weight: 700;
		margin-top: 0px;
	}
	p{
		text-align: justify;
		line-height: 18px;
		font-size: 13px;
	}
	.judulpage{font-family: 'Roboto', sans-serif;color: #fff;font-size: 24px;
text-align: center;text-transform: capitalize;
font-weight: 600;}



}