body {
    /* overflow-x: hidden; */
    
}

.Loading{
      position:fixed;
      z-index:9999;
      width:50px; /*image width */
      height:50px; /*image height */
      left:50%; 
      top:50%;
      margin-left:-25px; /*image width/2 */
      margin-top:-25px; /*image height/2 */
    }
/*
.modal-backdrop.am-fade {
  opacity: 0.1;
  transition: opacity .15s linear;
  &.ng-enter {
    opacity: 0;
    &.ng-enter-active {
      opacity: .5;
    }
  }
  &.ng-leave {
    opacity: .5;
    &.ng-leave-active {
      opacity: 0;
    }
  }
}
*/
.ng-cloak{
  display:none;
  
}

.popdown{
    background-color: gray;
}

  
.imageloading{  
  display:none !important;
}  

.LoadingFrame{
     margin-left: auto;
    margin-right: auto;
    width: 70px;
    height: 70px;
}


@-webkit-keyframes rotateplane {
  0% { -webkit-transform: perspective(120px) }
  50% { -webkit-transform: perspective(120px) rotateY(180deg) }
  100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes rotateplane {
  0% { 
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg) 
  } 50% { 
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) 
  } 100% { 
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}

.imageloadinganimation{
    -webkit-transform-style: preserve-3d;
    -webkit-transition: all 0.5s linear;
    opacity:1;
}
    
.DeviceStatus{   
    font-size: 31px;
    border: 10px solid #1A1A1A;
    /* box-shadow:  inset 0 0px 14px 0px rgb(0, 206, 0); */
    border-color: rgb(0, 0, 0);
    text-align: center;
}

.deviceBlok_table {
    margin-top: 15px;
}

.DeviceStatusName{
  background-color: black;
  color: white;
  font-weight: bold;
  text-align: center;
  padding: 10px;
}

.DeviceStatus span{
  word-wrap: break-word;
}

.DeviceStatus.Online{

}

.DeviceStatus.Pending{
  
}

.DeviceStatus.Offline{
  
}

.table .TabMiddel td{
  vertical-align: middle;
}


.animate-enter { 
    -webkit-animation: enter 600ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
    animation: enter 600ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
	display: block;
    position: relative;
} 
@-webkit-keyframes enter {
	from {
	    opacity: 0;
    	height: 0px;
    	left: -70px;
    }
    75% {
    	left: 15px;
    }
    to {
        opacity: 1;
    	height: 30px;
    	left: 0px;
    }
}
@keyframes enter {
	from {
	    opacity: 0;
    	height: 0px;
    	left: -70px;
    }
    75% {
    	left: 15px;
    }
    to {
        opacity: 1;
    	height: 30px;
    	left: 0px;
    }
}

.animate-leave { 
    -webkit-animation: leave 600ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
    animation: leave 600ms cubic-bezier(0.445, 0.050, 0.550, 0.950);
	display: block;
    position: relative;
} 
@-webkit-keyframes leave {
	to {
	    opacity: 0;
    	height: 0px;
    	left: -70px;
    }
    25% {
    	left: 15px;
    }
    from {
        opacity: 1;
    	height: 30px;
    	left: 0px;
    }
}
@keyframes leave {
	to {
	    opacity: 0;
    	height: 0px;
    	left: -70px;
    }
    25% {
    	left: 15px;
    }
    from {
        opacity: 1;
    	height: 30px;
    	left: 0px;
    }
}
/*
table {
  border-collapse: separate;
  border-spacing: 0 5px;
}

thead th {
  background-color: #006DCC;
  color: white;
}

tbody td {
  background-color: #EEEEEE;
}

tr td:first-child,
tr th:first-child {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}

tr td:last-child,
tr th:last-child {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}
*/


/* View Animate */
#ng-view {
    position:relative;
    top: 60px;
}

/* Animations */
.slide-animation.ng-enter {
    -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.9s;
    -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.9s;
    transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.9s;
    position:absolute;
    top:0;
    left:0;
    right:0;
    min-height:500px;
}

.slide-animation.ng-enter {
    opacity:0;
    left:100px;
}

.slide-animation.ng-enter.ng-enter-active {
    left:0;
    opacity:1;
}

md-toast{
    z-index: 99999999999 !important;
    position: fixed   !important;
    top:5px !important;
}

.gridListdemoBasicUsage md-grid-list {
  margin: 8px; }
.gridListdemoBasicUsage .gray {
  background: #f5f5f5; }
.gridListdemoBasicUsage .green {
  background: #b9f6ca; }
.gridListdemoBasicUsage .yellow {
  background: #ffff8d; }
.gridListdemoBasicUsage .blue {
  background: #84ffff; }
.gridListdemoBasicUsage .purple {
  background: #b388ff; }
.gridListdemoBasicUsage .red {
  background: #ff8a80; }
.gridListdemoBasicUsage md-grid-tile {
  transition: all 400ms ease-out 50ms; }

