a {color:#00fffa;}
	body {
  background-color: rgba(76,76,76,1)!important;
  margin: 0;
  padding: 0rem;
}

.container {
color:bisque!important;
  display: grid;
  grid-template-columns: 5fr 2fr;
  gap: 1rem;
}



.column {
  width: 100%;
  
}


@media (max-width: 1024px) {
  .container {
    grid-template-columns: 1fr;
  }
}

.depan {
  display: inline-block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  width: 120px;
  margin: 3px;
  padding: 0 0 3px;
  overflow: hidden;
  border: none;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font: normal normal bold 16px/1 "Trebuchet MS", Helvetica, sans-serif;
  color: rgba(255,255,255,1);
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
background: rgba(45,45,45,1);
  -webkit-box-shadow: 4px 4px 7px 2px rgba(0,0,0,0.2) ;
  box-shadow: 4px 4px 7px 2px rgba(0,0,0,0.2) ;
}






.judul{
padding: 0px;
margin: 5px;
	font: normal normal 11px/1 "Trebuchet MS", Helvetica, sans-serif;
 color: rgba(255,255,255,1);
text-align: center;
-o-text-overflow: clip;
text-overflow: clip;
white-space: nowrap;}

.tanggal{	font: normal normal 9px/1 "Trebuchet MS", Helvetica, sans-serif;
}

.halaman {
  display: inline-block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  cursor: pointer;
  padding: 10px 20px;
  border: none;
  font: normal normal bold 16px/normal Tahoma, Geneva, sans-serif;
  color: rgba(255,255,255,0.9)!important;
  -o-text-overflow: clip;
  text-overflow: clip;
  background: #c60000;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
  text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ;
  -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
}

.footer {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 6px;
  border: none;
  color: rgba(255,255,255,1);
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background: rgba(28,27,27,1);
}

.label {
    display: inline-block;
    margin: 2px;
    width:170px;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding: 5px 8px;
  border: none;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  color: rgba(255,255,255,1);
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background: rgba(127,0,163,1);
  text-align: left;
}

.label:hover {
  background: rgba(75,0,96,1);
  text-decoration:none!important;
  color:#00fffa!important;
}

.label:active {
  display: inline-block;
  background: rgba(33,0,43,1);
}
.paging {
  display: inline-block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  cursor: pointer;
  margin: 2px;
  padding: 10px 13px 10px 10px;
  border: none;
  font: normal normal bold 16px/normal "", Times, serif;
  color: rgba(255,255,255,0.9);
  -o-text-overflow: clip;
  text-overflow: clip;
  background: #bf000c;
  -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
  text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ;
  -webkit-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 300ms cubic-bezier(0.42, 0, 0.58, 1);
}

.chapter {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  width: 100%;
  padding-top: 0px;
  margin: 5px 10px 0 0;

  overflow: hidden;
  border: none;
  font: normal 16px/1 "Times New Roman", Times, serif;
  color: rgba(255,255,255,1);
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background: #496e7c;
  -webkit-box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
  box-shadow: 1px 1px 1px 0 rgba(0,0,0,0.3) ;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.2) ;
}
.nomor {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  float: left;
  width: 15px;
  margin: 0 10px 0 0;
  padding: 9px;
  border: none;
  font: normal 23px/normal "Times New Roman", Times, serif;
  color: rgba(255,255,255,0.9);
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  background: #143d68;
  text-shadow: 0 0 0 rgba(15,73,168,0.66) ;
}

.isichap {
height: auto;
padding: 5px;
margin: 0 10px 0 0;
display: block;
float: left;
font: normal 12px/normal "Courier New", Courier, monospace;
z-index: auto;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
position: static;
opacity: 1;
cursor: pointer;}

.chap {

font: normal 18px/normal "", Courier, monospace;
  color: rgba(255,255,255,1)!important;}

.download {
  display: inline-block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  float: right;
  width: 15px;
  cursor: pointer;
  margin: 4px 10px 0 0;
  padding: 8px;
  border: none;
  font: normal 17px/normal "Courier New", Courier, monospace;
  color: rgba(255,255,255,0.9);
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  background: #143d68;
  text-shadow: 0 0 0 rgba(15,73,168,0.66) ;
}

.download:hover {
  background: #440072;
}

