body .ui-panel .ui-panel-titlebar {
  padding: 5px 15px;
}


.bg-back {
background-repeat: no-repeat;
background-color: #fff;
background-origin: content-box;
width: 100%;
min-height: 100%;
position: absolute;
top: 0;
left: 0;
margin-left:0;
padding: 60px 0 60px 180px;
background-size:contain;
background-position: left;
background-image: url("../img/ilustrasi_logo_sakti.svg");
}

.bg-backnew {
background-repeat: no-repeat;
background-color: #fff;
background-origin: content-box;
width: 100%;
min-height: 100%;
position: absolute;
top: 0;
left: 0;
margin-left:0;
z-index: 100;
}

.bg-renja {
background-image: url("../img/ilustrasi_modul.svg");
}

.ui-card-body {
background:#0B57B2;
padding: 1.5em;
}
#extr-page {
/* background-image: url("../img/background_sakti.png") !important; */
/* login krisna */
background-image: url("../img/ilustrasi_modul.svg") !important;
background-size: contain !important;
height: 100%;
}

:host ::ng-deep button {
margin-right: .25em;
}
:host ::ng-deep .ui-widget-content {
border: 1px solid #fff;
}

:host ::ng-deep .custom-toast .ui-toast-message {
color: #ffffff;
background: #FC466B;
background: -webkit-linear-gradient(to right, #3F5EFB, #FC466B);
background: linear-gradient(to right, #3F5EFB, #FC466B);
}

:host ::ng-deep .custom-toast .ui-toast-close-icon {
color: #ffffff;
}

@keyframes ui-progress-spinner-color {
100%,
0% {
   stroke: #d62d20;
}
40% {
   stroke: #0057e7;
}
66% {
   stroke: #008744;
}
80%,
90% {
   stroke: #ffa700;
}
}

.loading-indicator {
position: fixed;
z-index: 999;
height: 2em;
width: 2em;
overflow: show;
margin: auto;
top: 0;
left: 0;
bottom: 0;
right: 0;
}

/* Transparent Overlay */
.loading-indicator:before {
content: '';
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.53);
}

td {
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 max-width: 150px;
}

.main-info {
background:rgba(103,178,232,0.34);
opacity: 0.9;
padding:10px;
border-radius: 4px;
text-align: justify;
}

.logo-auth {
position: absolute;
top: 20px;
left:50px;
width: auto;
height: 65px
}

@media only screen and (max-width: 600px) {
.main-info {
   background:rgba(173, 221, 255, 0.9);
   font-size:10px;
}

.bg-back {
   position: relative;
   height: 100vh;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
   background-image: none;
   background-color: transparent;
}

.bg-backnew {
   position: relative;
   height: 100vh;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
   background-color: transparent;
}

.bg-back::before {
   content: "";
   position: absolute;
   top: 0px;
   right: 0px;
   bottom: 0px;
   left: 0px;
   opacity: 0.25;
   background-image: url("../img/logo_sakti_polos.svg");
   background-size:auto 80%;
   background-position: center;
   background-repeat: no-repeat;
   z-index: -1;
   background-color: #ffffff;
}

.logo-auth {
   left: auto;
}

}