.dark {
  background-color: #808080;
  height: 45px;
  padding: 15px;
  text-align: center;

  box-shadow: inset 0 0 25px rgba(0,0,0,.5);
   
  border: 1px solid #494a4e;
  border-radius: 10px;
  background: -webkit-linear-gradient(bottom, #444549 0%, #343539 100%);
  background: linear-gradient(#444549 0%, #343539 100%); 
}

/* Styles for the track-progress-bar directive element */
.progress-bar-bkgd {
 background-color: #2a2b2f;
  box-shadow: inset 0 5px 15px rgba(0,0,0,.6);
 width: 99%;
  height: 15px;
  overflow: hidden;
  padding: 3px;
  border-radius: 5px;
  margin-bottom: 20px;
  margin-left: 0;
 
  /*
 
  border: none;
  margin: 0 2px 0 2px;
  background-color: #3e3e3e;*/
}


.progress-bar-marker {
  /*width: 0px;
  background-color: #00ff21;
  height: 100%;
  color: #fff;
  font-weight: normal*/
  border-radius: 4px;
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  color: white;
  text-align: center;
  text-indent: -9999px;
  background-color: #428bca;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}



.p_tow_col {
width:49.5%;
display:inline-block;
padding:5px;
vertical-align:top;
}
.p_grp_out { 
margin-top:5px;
width:99.5%;
}
.p_grp_tx { 
    width:26.5%;font-size:0.9em;text-align:left;
}
.p_grp_in {
   
}
.boya {
   
    height:800px;
}

.bakRed{
    background-color:#ff4f4f; 
}
.phv-card{
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
     padding:5px;
     border-radius:5px;
}

.pcenter {
position:absolute;
top:14%;
left:20%;
transform:translate(-50%,-50%);
}
input[type = "checkbox"] {
position:relative;
width:100px;
height:30px;
-webkit-appearance:none;
 background:linear-gradient(0deg,#333 , #000);
 outline:none !important;
 border-radius:15px;
 box-shadow:0 0 0 4px #353535 ,0 0 0 5px #3e3e3e , inset 0 0 10px rgba(0,0,0,1) , 0 5px 20px rgba(0,0,0,.5)
 , inset 0 0 15px rgba(0,0,0,2);
}
input:checked[type = "checkbox"] {
     background:linear-gradient(0deg,#6dd1ff , #20b7ff);
     box-shadow:0 0 2px #6dd1ff,0 0 0 4px #353535 ,0 0 0 5px #3e3e3e , inset 0 0 10px rgba(0,0,0,1) , 0 5px 20px rgba(0,0,0,.5)
 , inset 0 0 15px rgba(0,0,0,2);
}
input[type = "checkbox"]:before {
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:60px;
    height:30px;
 background:linear-gradient(0deg,#000 , #6b6b6b);
 border-radius:20px;
 box-shadow:0 0 0 1px #232323;
 transform:scale(.98,.96);
 transition: .5s;  
    }
  
  input:checked[type = "checkbox"]:before {
        left:40px;
    }  

input[type = "checkbox"]:after {
    content:'';
    position:absolute;
    top: 13px;
    left:40px;
    width:4px;
    height:4px;
  background:linear-gradient(0deg, #6b6b6b,#000) ;
  border-radius:50%;
  transition: .5s;

    }
  
  input:checked[type = "checkbox"]:after {
        left:80px;
        background:#63cdff;
        box-shadow:0 0 5px #13b3ff,0 0 5px #13b3ff;
    }  
 .scale-in-tr {
	-webkit-animation: scale-in-tr 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-tr 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
 
@-webkit-keyframes scale-in-tr {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes scale-in-tr {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
    opacity: 1;
  }
}
 
.fade-in {
	-webkit-animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
	        animation: fade-in 1.2s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}
 
@-webkit-keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.scale-out-horizontal {
	-webkit-animation: scale-out-horizontal 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: scale-out-horizontal 0.5s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
} 
@-webkit-keyframes scale-out-horizontal {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
}
@keyframes scale-out-horizontal {
  0% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
}
.scale-in-hor-center {
	-webkit-animation: scale-in-hor-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: scale-in-hor-center 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
} 
@-webkit-keyframes scale-in-hor-center {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
}
@keyframes scale-in-hor-center {
  0% {
    -webkit-transform: scaleX(0);
            transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
            transform: scaleX(1);
    opacity: 1;
  }
}
.slide-in-fwd-tr {
	-webkit-animation: slide-in-fwd-tr 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in-fwd-tr 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
 
@-webkit-keyframes slide-in-fwd-tr {
  0% {
    -webkit-transform: translateZ(-1400px) translateY(-800px) translateX(1000px);
            transform: translateZ(-1400px) translateY(-800px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0) translateY(0) translateX(0);
            transform: translateZ(0) translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-fwd-tr {
  0% {
    -webkit-transform: translateZ(-1400px) translateY(-800px) translateX(1000px);
            transform: translateZ(-1400px) translateY(-800px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0) translateY(0) translateX(0);
            transform: translateZ(0) translateY(0) translateX(0);
    opacity: 1;
  }
}


.lds-roller {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #63cdff;
  margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 71px;
  left: 32px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.spinner {
  margin: 100px auto;
  width: 50px;
  height: 40px;
  text-align: center;
  font-size: 10px;
}

.spinner > div {
  background-color: #333;
  height: 100%;
  width: 6px;
  display: inline-block;
  
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}

 .hoverWrapper:hover #hoverShow1 {
 display: block;
}

.hoverWrapper #hoverShow1 {
 display: none;
  background-color:white;
    border:solid 2px #b6ff00;
    position: fixed;
    z-index: 998999;
    margin-top:-120px;
    margin-left:100px;
 width: 250px;
 min-height: 250px;  
 padding:5px;
  -webkit-box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
-moz-box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
border-radius:5px;
}
.reportViewOne {
 background-color:white;
    border:solid 2px #b6ff00;
    position: fixed;
    z-index: 998999;
     
 padding:5px;
  -webkit-box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
-moz-box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
box-shadow: 5px 5px 5px 3px rgba(181,18,181,0.7);
border-radius:5px;
}