.table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 5px;
}
.table > thead > tr > th,
.table > thead > tr > td,
.table > tbody > tr > th,
.table > tbody > tr > td,
.table > body > tr > th,
.table > body > tr > td,
.table > tfoot > tr > th,
.table > tfoot > tr > td {
font-size:10pt;
  padding: 2px; 
  margin-bottom: 2px;
  padding-bottom: 2px;
  border-bottom: 2px;
  vertical-align: top;
  border-top: 1px solid #ddd;
 line-height:1.7;
}

.table > tbody > tr > th {
 background-color:#efefef;
 line-height:1.7;
}
.table-hover > tbody > tr:hover {
  border-left: 2px solid #1b4f72;
  background-color: #e5e8e8;
}
.bor_ra1,
.bor_ra2,
.bor_tgl,
.bor_nota,
.w-10{ font-size:11pt; border-radius: 0px;}

.bor_ra1 {width: 180px;}
.bor_ra2 {width: 300px;}
.bor_tgl {width: 120px;}
.bor_nota {width: 50px;}
.w-25 {width: 25px;}
.w-50 {width: 50px;}
.w-75 {width: 75px;}
.w-100 {width: 100px;}
.w-125 {width: 125px;}
.w-150 {width: 150px;}
.w-175 {width: 175px;}
.w-200 {width: 200px;}
.w-225 {width: 225px;}
.w-250 {width: 250px;}
.w-275 {width: 275px;}
.w-300 {width: 300px;}

.kotaklogin{
	  margin: 0 auto;
	  position: fixed;
	  top: 20%;
	  left: 50%;
	  -moz-transform: translate3d(-50%, 0, 0);
	  -ms-transform: translate3d(-50%, 0, 0);
	  -webkit-transform: translate3d(-50%, 0, 0);
	  transform: translate3d(-50%, 0, 0);
	  width: 450px;
	  padding: 20px;
	  overflow: hidden;
	  background-color: rgba(3, 79, 132, 0.7);
	  border: 1px solid rgba(152, 221, 222, 0.4);
	  -moz-border-radius: 0px;
	  -webkit-border-radius: 0px;
	  border-radius: 0px;
    color: white;
   box-shadow: 0px 0px 50px grey;
  }
.kotakloginbos{
	  margin: 0 auto;
	  position: fixed;
	  top: 20%;
	  left: 50%;
	  -moz-transform: translate3d(-50%, 0, 0);
	  -ms-transform: translate3d(-50%, 0, 0);
	  -webkit-transform: translate3d(-50%, 0, 0);
	  transform: translate3d(-50%, 0, 0);
	  width: 450px;
	  padding: 20px;
	  overflow: hidden;
	  background-color: rgba(0, 0, 0, 0.7);
	  border: 1px solid rgba(0, 0, 0, 0.4);
	  -moz-border-radius: 12px;
	  -webkit-border-radius: 12px;
	  border-radius: 12px;color: white;
   box-shadow: 0px 0px 50px grey;
  }
.btn-border{
  align-content: left;
	border-radius:0px;
	border:0px;
	margin:0px;
	padding:0px;
}
.tomnav{
	height:50px;
	background-color:transparent;
	border:0px;
	color: rgba(3, 79, 132, 0.7);
	}
.tomnav-b{
  height:50px;
  background-color:#3498db;
  border:0px;
  color: white;
  }
.btn-navtrans{
 background-color:transparent;border-color:transparent;color:white;border-radius:0px;}
.btn-nav {background-color:#7ed6df;color: white;}
.btn-navtrans:hover {background-color:#7ed6df;}
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    color: #f1f1f1;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}
.btn-transparent{
 background-color:transparent;border-color:transparent;color:#7bbc42;border-radius:0px;}
.btn-transparent-red{
 background-color:transparent;border-color:transparent;color:#e74c3c;border-radius:0px;}
.btn-transparent-grey{
 background-color:transparent;border-color:transparent;color:#BDC3C7;border-radius:0px;}
.sidenav a,
.sidenav li {
	cursor:pointer;
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s
}
.sidenav a:hover, .offcanvas a:focus,
.sidenav li:hover, .offcanvas li:focus{
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

#main {
    transition: margin-left .5s;
    padding: 16px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
  .sidenav li {font-size: 18px;}
}
.pull-bottom{
	position: absolute;
    bottom: 0;
    left: 0;
}
.pull-bottom-center{
	position: absolute;
    bottom: 0;
    left: 45%;
}
.navbar{
  border-radius: 0px;
  border-color:transparent;
}
.navbar-inverse{
 /*background-color: rgba(3, 79, 132, 0.7);*/
 background-color: white;
}
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}
.progress {
  margin-bottom: 5px;
}
.pagination {
    display: inline-block;
}

.pagination td {
    color: black;
    float: left;
    padding: 0px 0px;
    text-decoration: none;
}
.pagination td.active {
    background-color: #4CAF50;
    color: white;
}
.pagination td:hover:not(.active) {background-color: #ddd;}
.caribarang{
  font-size: 10px;
  width: 600px; 
    background: white;
    color: black;
  border-radius : 1px;
    position: absolute;
    z-index: 99;
    box-sizing: border-box;
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);
}
.caripel{
  font-size: 5px;
}
.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}

.wallpaper-orange,  
.wallpaper-ungu,
.wallpaper-biru{
  width:100%;
  height:100%;
  padding: 0px; 
  margin: 0px;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0, finishopacity=100, style=3);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  -webkit-background-size: 100% 100%;}
  
.wallpaper-biru{
     background:#C2F3F8;
     background:-webkit-radial-gradient(center, ellipse, #C2F3F8 5%, #57B4C9 45%, #0568B1 100%);}
.wallpaper-ungu{
     background:#E0CAE8;
     background:-webkit-radial-gradient(center, ellipse, #E0CAE8 5%, #BF85D6 45%, #8D44AF 100%);}
.wallpaper-orange{
     background:#F9DBC8;
     background:-webkit-radial-gradient(center, ellipse, #F9DBC8 5%, #F5AD7E 45%, #D45300 100%);}
  
/*----TOMBOL INDEX UTAMA-----*/
.merah{background-color:rgba(225,112,67,1);}
.hijaucerah{background-color:rgba(45,204,112,1);}
.silver{background-color:rgba(190,195,199,1);}
.wetaspal{background-color:rgba(93,110,126,1);}
.kuning{background-color:rgba(231,126,35,1);}
.grey{background-color:rgba(149,165,165,1);}
.biru{background-color:rgba(36,113,163,1);}
.ungu{background-color:rgba(155,88,181,1);}
.hijau {background-color:rgba(25,189,155,1);}

.merah,
.hijaucerah,
.silver,
.wetaspal,
.kuning,
.grey,
.biru,
.ungu,
.hijau {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    box-shadow: 0 0 1px rgba(236,240,241,0.2);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;}
    
.merah:before,
.hijaucerah:before,
.silver:before,
.wetaspal:before,
.kuning:before,
.grey:before,
.biru:before,
.ungu:before,
.hijau:before {
  background-color:rgba(0,0,0,0.1);
  content: "";
  position: absolute;
  z-index: -2;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;}
    
.merah:hover, .merah:focus, .merah:active,
.hijaucerah:hover, .hijaucerah:focus, .hijaucerah:active,
.silver:hover, .silver:focus, .silver:active,
.wetaspal:hover, .wetaspal:focus, .wetaspal:active,
.kuning:hover, .kuning:focus, .kuning:active,
.grey:hover, .grey:focus, .grey:active,
.biru:hover, .biru:focus, .biru:active,
.ungu:hover, .ungu:focus, .ungu:active,
.hijau:hover, .hijau:focus, .hijau:active {
  color: rgba(236,240,241,0.7);}
  
.merah:hover:before, .merah:focus:before, .merah:active:before,
.hijaucerah:hover:before, .hijaucerah:focus:before, .hijaucerah:active:before,
.silver:hover:before, .silver:focus:before, .silver:active:before,
.wetaspal:hover:before, .wetaspal:focus:before, .wetaspal:active:before,
.kuning:hover:before, .kuning:focus:before, .kuning:active:before,
.grey:hover:before, .grey:focus:before, .grey:active:before,
.biru:hover:before, .biru:focus:before, .biru:active:before,
.ungu:hover:before, .ungu:focus:before, .ungu:active:before,
.hijau:hover:before, .hijau:focus:before, .hijau:active:before {
   -webkit-transform: scale(1);
   transform: scale(1);
  }

img.cover{
  height:50px;
  Width:50px;
  padding-top:0px;}
img.cover1{
    height:100px;
    Width:100px;
    padding-top:0px;}
.bayang{
  box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.3);}

.buttoncover{
    cursor:pointer;
    border-width:0px;
    -webkit-background-size: 100% 100%;
    cursor:pointer;
    width:232px;
    height:120px;
    color:transparent;
    border-radius: 4px;}
/*----END TOMBOL INDEX UTAMA----*/

.btn-logut,
.btn-logut:active,
.btn-logut.active,
.btn-logut[disabled],
fieldset[disabled] .btn-logut {
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.btn-logut,
.btn-logut:hover,
.btn-logut:focus,
.btn-logut:active {
  border-color: transparent;
  width: 100%;
  text-align: left;
}
.btn-logut:focus {
  color: #23527c;
  background-color: transparent;
}
.btn-logut:hover {
  color: white;
  background-color: #3498DB;
}
.btn-logut[disabled]:hover,
fieldset[disabled] .btn-logut:hover,
.btn-logut[disabled]:focus,
fieldset[disabled] .btn-logut:focus {
  color: #777;
  text-decoration: none;
}