.non{
	display: none;
}

.tombol {
    background-color: #4CAF50; /* Green buat Refresh */
    border: none;
    color: white;
    padding: 10px 27px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
    margin: 4px 2px;
    cursor: pointer;
}
.tombol:hover {
    background-color: #558857; /* Green buat Refresh */
   
  
}
.tombollink {
    background-color: #1E81FF; /* biru buat link */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    padding: 5px;
}
.tombol-fs {
    text-transform: capitalize;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    padding: 8px;
    margin: 0 2px;
}
.tombol-lg {
    background-color: #3A3A3A; /* biru pink */
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    padding: 10px;
   
	
 
}
.tombol-lg:hover{
	 color: #EA1E39;
}
.tombollink:hover {
    background-color: #0055C3; /* biru buat link */
}

.tombolijo {background-color: #00CB39;} /* ijo terang*/
.tombolblue {background-color: #008CBA;} /* Blue tambah*/
.tombolred {background-color: #f44336;} /* Red buat keluar*/ 
.tombolgray {background-color: #e7e7e7; color: black;} /* Gray  cetak*/ 
.tombolblack {background-color: #555555;} /* Black */
.tombolorens {background-color: #ffb900; color: black;} /* Orange */
.tombolbirumuda {background-color: #ffe52d; color: #1A1A1A;} /* biru muda, jadi kuning simpan*/

.tombolijo:hover {background-color: #00AE30;} /* ijo terang*/
.tombolblue:hover {background-color: #006688;} /* Blue tambah*/
.tombolred:hover {background-color: #D4271B;} /* Red buat keluar*/ 
.tombolgray:hover {background-color: #BBBBBB; color: black;} /* Gray  cetak*/ 
.tombolblack:hover {background-color: #3E3939;} /* Black */
.tombolorens:hover {background-color: #D49A01; color: black;} /* Orange */
.tombolbirumuda:hover {background-color: #FFF18D; color: #1A1A1A;} /* biru muda, jadi kuning simpan*/

/*----------------------------------------- CSS Tombol*/
/*----------------------------------------- CSS Paging*/
.prev{
	padding: 5px 6px;  background-color:#90EE90; color: #016500; float: left;
}
.prev-p{
	padding: 5px 6px;  color: #016500; float: left;
}
.next{
	padding: 5px 6px;  background-color:#90EE90; color: #016500; float: right;
}
.next-p{
	padding: 5px 6px;  color: #016500; float: right;
}
.hal{
	margin: 1px; border: 1px solid #016500; color: #016500; 
}

.hal:hover{
	color: #FFF; background:#016500;
}

.notif{
	padding: 10px; text-align:center; color: #FF000A; border: #FF000A solid 1px;
}

input[type=text],input[type=number],input[type=password], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #717171;
    border-radius: 4px;
    box-sizing: border-box;
    background-color: #fff;
}


textarea {
    width: 100%;
	margin: 8px 0;
    padding: 5px 20px;
    box-sizing: border-box;
    border: 1px solid #717171;
    border-radius: 4px;
    background-color: #FFF;
    resize: none;
}
textarea:focus, input[type=text]:focus,input[type=number]:focus, select:focus {

    background-color: #D7F8FA;
  
}
input[type=radio]{
	display: inline-block;
	margin: 0 5px;
}


.tooltip {
    position: relative;
    display: block;

}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    z-index: 1;
    bottom: 100%;
    left: 50%;
  
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}
/*------------------ Properti POP UP ------------*/
.overlay{
	width:100%;
	height:100%;
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	z-index: 99999;
	background: rgba(0,0,0,0.7);
	text-align: center;
}

.resizable{
   display:block;
   width:50%;
   height:auto;
   background: #f3f3f3;
   padding: 30px;
   margin: 10% auto;
   position:relative;
  
   z-index: 103;
}
ul {
    list-style:none;
}
a{
	text-decoration: none;
}
.ui-resizable-helper { 
	border: 1px dotted gray; 
}
.resizable iframe{
 width:100%; height:100%; display:none;
}

a.boxclose{
    background-image: url(../image/can.png);
	margin-top: -10px;
	margin-right: -10px;
	cursor:pointer;
    float: right;
    height: 32px;
    width: 32px;
    z-index: 99999;
}

.rata{
	display: inline-block;
	margin: 10px 25px;

}
.float-r{
	float: right;
}
.space{
	padding: 25x; line-height: 10px;
}
.popup_ket{
	text-align: left;

}
.icon-pop_up:hover{
	background: #e4e4e4;
}
.icon-pop_up{
	padding: 10px;;
}

.pilih:hover{
	background: #FFFBC5;
	cursor:pointer;
}


/*------------------ Properti POP UP ------------*/
/*
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
  
	.menu{
		display:none;
	}
	.popup_ket{
		display:none;
	}
	.resizable{
	   display:block;
	   width:96%;
	   height:auto;
	   background: #f3f3f3;
	   padding: 30px;
	   margin: 10% auto;
	 
	  
	   z-index: 103;
	}
}
* ◄ Prev
* Next ►
*/ 


/*------------------ Properti POP UP ------------*/