
.informasi{
	background: rgba(0,0,0,.44);
	position: fixed;
	z-index: 99999;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	display: none;
}

.informasiSukses .informasiJudul:before{
	content: '\f058 ';
	display: inline-block;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	margin-right: 10px;
	-webkit-animation: pulse-aqua 1s infinite;
	animation: pulse-aqua 1s infinite;
	-webkit-box-shadow: 0 0 0 0 #8DC63F;
			box-shadow: 0 0 0 0 #8DC63F;
	background: #8DC63F;
	border-radius: 100%;
	height: 12px;
	width: 12px;
	padding: 0px;
	text-align: center;
	z-index: 1;
}
.informasiAlert .informasiJudul:before{
	content: '\f129 ';
	display: inline-block;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	margin-right: 10px;
	-webkit-animation: pulse-aqua 1s infinite;
	animation: pulse-aqua 1s infinite;
	-webkit-box-shadow: 0 0 0 0 yellow;
			box-shadow: 0 0 0 0 yellow;
	background: yellow;
	border-radius: 100%;
	height: 12px;
	width: 12px;
	text-align: center;
	padding: 0px;
	z-index: 1;
}
.informasiGagal .informasiJudul:before{
	content: '\f071 ';
	display: inline-block;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	margin-right: 10px;
	-webkit-animation: pulse-aqua 1s infinite;
	animation: pulse-aqua 1s infinite;
	-webkit-box-shadow: 0 0 0 0 #bc1e2d;
			box-shadow: 0 0 0 0 #bc1e2d;
	background: #bc1e2d;
	border-radius: 100%;
	height: 12px;
	width: 12px;
	text-align: center;
	padding: 0px;
	z-index: 1;
}
.informasiHideClose .informasiJudul{
	font-size: 16px;
	top: -5px;
	position: relative;
}
.informasiHideClose .informasiDeskripsi{
	display: none;
}
.informasiHideClose .informasiTutup{
	display: none;
}
.informasiHideClose .informasiIsiKonten{
	padding-top: 0px;
	min-height: 0px;
}
.informasiHideClose .informasiJudul{
	top: 0px;
}
.informasi table,
.informasi table tr,
.informasi table tr td{
	width: 100%;
	height: 100%;
	vertical-align: middle;
	text-align: center;
	box-sizing: border-box;
}
.informasiIsiKonten{
	display: inline-block;
	min-width: 350px;
	min-height: 50px;
	box-sizing: border-box;
	background: #fff;
	position: relative;
	texdt-align: left;
}
.informasiTombolTutup{
	color: #aaa;
	font-size: 16px;
	position: absolute;
	top: 0px;
	right: 0%;
	padding: 10px 15px;
	background: transparent;
	cursor: pointer;
	transition: 0.3s;
	font-weight: normal;
}
.informasiTombolTutup:hover{
	color: #f00000;
}
.informasiTombolTutup *{
	color: #aaa;
}
.informasiTombolTutup:hover *{
	color: #f00000;
}
.informasiTombol{
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	border-top: 1px #000 solid;
	position: absolute;
	top: 100%;
	left: 0%;
	background: #303030;
	text-align: right;
	display: none;
}
.informasiTombol button{
	background: #ff7200;
	padding: 10px 20px;
	border: none;
	color: #fff;
	font-weight: bold;
	cursor: pointer;
	transition: 0.3s;
}
.informasiJudul{
	font-size: 14px;
	color: #aaa;
	text-align: left;
	background: #f6f7f9;
    border-bottom: 1px solid #e5e5e5;
    border-radius: 3px 3px 0 0;
    padding: 10px 12px;
}
.informasiIsi{

}
.informasiDeskripsi{
	text-align: center;
	color: #aaa;
	padding: 15px;
}

.containerLoading{
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.64);
	box-sizing: border-box;
	overflow: hidden;
	z-index: 999998;
}
.cssload-loader {
		width: 49px;
		height: 49px;
		border-radius: 50%;
		margin: 3em;
		display: inline-block;
		position: relative;
		vertical-align: middle;
}

.cssload-loader {
		width: 49px;
		height: 49px;
		border-radius: 50%;
		margin: 3em;
		display: inline-block;
		position: relative;
		vertical-align: middle;
}
.cssload-loader,
.cssload-loader:before,
.cssload-loader:after {
		animation: 0.5s infinite ease-in-out;
		-o-animation: 0.5s infinite ease-in-out;
		-ms-animation: 0.5s infinite ease-in-out;
		-webkit-animation: 0.5s infinite ease-in-out;
		-moz-animation: 0.5s infinite ease-in-out;
}
.cssload-loader:before,
.cssload-loader:after {
		width: 100%; 
		height: 100%;
		border-radius: 50%;
		position: absolute;
		top: 0;
		left: 0;
}

.cssload-loader:before,
.cssload-loader:after {
		content: "";
}
.cssload-loader:before {
		border: 1px solid rgba(240,0,0,0.98);
		top: -1px;
		left: -1px;
		opacity: 0;
		animation-name: cssload-pulse;
		-o-animation-name: cssload-pulse;
		-ms-animation-name: cssload-pulse;
		-webkit-animation-name: cssload-pulse;
		-moz-animation-name: cssload-pulse;
}
.cssload-loader:after {
		background-color: rgb(240,0,0);
		animation-name: cssload-pulse-2;
		-o-animation-name: cssload-pulse-2;
		-ms-animation-name: cssload-pulse-2;
		-webkit-animation-name: cssload-pulse-2;
		-moz-animation-name: cssload-pulse-2;
}


@-webkit-keyframes pulse-aqua {
	0% {
	-webkit-transform: scale(1);
	transform: scale(1);
	}
	70% {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-box-shadow: 0 0 0 25px rgba(19, 227, 244, 0);
			box-shadow: 0 0 0 25px rgba(19, 227, 244, 0); 
	background: transparent;
	}
	100% {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-box-shadow: 0 0 0 0 rgba(19, 227, 244, 0);
			box-shadow: 0 0 0 0 rgba(19, 227, 244, 0); 
	background: transparent;
	}
}

@keyframes pulse-aqua {
	0% {
	-webkit-transform: scale(1);
	transform: scale(1);
	}
	70% {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-box-shadow: 0 0 0 25px rgba(19, 227, 244, 0);
			box-shadow: 0 0 0 25px rgba(19, 227, 244, 0); 
	background: transparent;
	}
	100% {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-box-shadow: 0 0 0 0 rgba(19, 227, 244, 0);
			box-shadow: 0 0 0 0 rgba(19, 227, 244, 0); 
	background: transparent;
	}
}

@keyframes cssload-pulse {
	0% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.3); opacity: 0; }
	100% { transform: scale(1.3); opacity: 0; }
}

@-o-keyframes cssload-pulse {
	0% { -o-transform: scale(1); opacity: 1; }
	50% { -o-transform: scale(1.3); opacity: 0; }
	100% { -o-transform: scale(1.3); opacity: 0; }
}

@-ms-keyframes cssload-pulse {
	0% { -ms-transform: scale(1); opacity: 1; }
	50% { -ms-transform: scale(1.3); opacity: 0; }
	100% { -ms-transform: scale(1.3); opacity: 0; }
}

@-webkit-keyframes cssload-pulse {
	0% { -webkit-transform: scale(1); opacity: 1; }
	50% { -webkit-transform: scale(1.3); opacity: 0; }
	100% { -webkit-transform: scale(1.3); opacity: 0; }
}

@-moz-keyframes cssload-pulse {
	0% { -moz-transform: scale(1); opacity: 1; }
	50% { -moz-transform: scale(1.3); opacity: 0; }
	100% { -moz-transform: scale(1.3); opacity: 0; }
}

@keyframes cssload-pulse-2 {
	0% { transform: scale(1); }
	50% { transform: scale(0.7); }
	100% { transform: scale(1); }
}

@-o-keyframes cssload-pulse-2 {
	0% { -o-transform: scale(1); }
	50% { -o-transform: scale(0.7); }
	100% { -o-transform: scale(1); }
}

@-ms-keyframes cssload-pulse-2 {
	0% { -ms-transform: scale(1); }
	50% { -ms-transform: scale(0.7); }
	100% { -ms-transform: scale(1); }
}

@-webkit-keyframes cssload-pulse-2 {
	0% { -webkit-transform: scale(1); }
	50% { -webkit-transform: scale(0.7); }
	100% { -webkit-transform: scale(1); }
}

@-moz-keyframes cssload-pulse-2 {
	0% { -moz-transform: scale(1); }
	50% { -moz-transform: scale(0.7); }
	100% { -moz-transform: scale(1); }
}