::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 8px #fff;border:1px solid #999;border-top:0;border-bottom:0; 
  border-radius: 0px;
}
::-webkit-scrollbar-thumb {
  background: #24a99c; 
  border-radius: 0px;
}
::-webkit-scrollbar-thumb:hover {
  background: blue; 
}
input {border:1px solid #30d812;padding:5px 10px;}
img {max-width:100%;}
#mendaftar, #mendaf1 {border:1px solid #eee;}
.sekolah {
  font-family: Arial, Helvetica, sans-serif;
  color: #666;
  text-shadow: 1px 1px 0px #fff;
  background: #fff;
  border: #ccc 1px solid;
  
}
.dropdown-menu {max-height:360px;overflow-y:auto;overflow-x:hidden;}
.sekolah th {
  padding: 15px 5px;
  border-left:1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  background: #ededed;
  position: sticky;
  top: 0px;
}

.sekolah table th:first-child{  
  border-left:none;  
}

.sekolah tr {
  
  padding-left: 5px;
}

.sekolah  td:first-child {
  text-align: left;
  
  border-left: 0;
}

.sekolah  td {
  border-top: 1px solid #eee;
  border-bottom: 1px solid #e0e0e0;
  border-left: 1px solid #e0e0e0;
  background: #fefefe;padding:5px 10px;
  
}

.sekolah tr:last-child td {
  border-bottom: 0;
}

.sekolah tr:last-child td:first-child {
  -moz-border-radius-bottomleft: 3px;
  -webkit-border-bottom-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.sekolah tr:last-child td:last-child {
  -moz-border-radius-bottomright: 3px;
  -webkit-border-bottom-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.sekolah tr:hover td {
  background: #f2f2f2;
  background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
  background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0);
}
.loader1 {width:300px;position:fixed;background:#09aae7;left:50%;margin-left:-150px;top:48%;color:#fff;border-radius:1px;}
.textx {width: 92%;margin:10px auto;overflow: hidden;position:relative;}
.loader {height: 12px;width: 92%;margin:10px auto;overflow: hidden;position:relative;background-color: #79cae9;}
.loader:before{display: block;position: absolute;content: "";left: -100px;width: 100px;height: 12px;background-color: #fff;animation: loading 0.7s linear infinite;}
@keyframes loading {
from {left: -100px; width: 30%;}
50% {width: 30%;}
70% {width: 70%;}
80% { left: 50%;}
95% {left: 120%;}
to {left: 100%;}
}
.loaderx {height:1px;position:fixed;width: 100%;top:0;left:0;right:0;overflow: hidden;background-color: #09aae7;}
.loaderx:before{display: block;position: absolute;content: "";left: -100px;width: 100px;height: 1px;background-color: cyan;animation: loadingx 0.7s linear infinite;}
@keyframes loadingx {
 from {left: -100px; width: 30%;}
 50% {width: 30%;}
 70% {width: 70%;}
 80% { left: 50%;}
 95% {left: 120%;}
 to {left: 100%;}
}
.loader2 {position:fixed;z-index:999999999;width:150px;height:150px;left:50%;margin-left:-75px;top:50%;margin-top:-75px;}
@media (max-width: 767px) {
.sekolah {width:100%;}
.sekolah table, .sekolah thead, .sekolah tbody, .sekolahth, .sekolah td,.sekolah tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
.sekolah thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
.sekolah tr { border: 1px solid #ccc; }
	
.sekolah td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
.sekolah td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
}