@charset "UTF-8";
.lds-ring {
  display: inline-block;
   position:absolute;
   left:48%;
   top:40%;
  width: 64px;
  height: 64px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 51px;
  height: 51px;
  margin: 6px;
  border: 6px solid #cef;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #cef transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.loader{
        position:absolute;
        width:320px;
        height:240px;
        left:50%;
        top:50%;
        margin-left:-160px;
        margin-top:-120px;
        border-radius:4px;
        transition:opacity 400ms;
}

@keyframes pulse{
    0%{
      height:0%;
      box-shadow:0 0 4px rgba(0,0,0,1.0);
    }
    20%{
      background:rgba(255,255,255,0.5);
      height:100%;
      box-shadow:0 0 8px rgba(255,255,255,0.0);
    }
    50%{
      background:rgba(17,217,255,1);
      box-shadow:0 0 8px rgba(17,217,255,0.8);
    }
    80%{
      background:rgba(255,255,255,0.5);
      height:100%;
      box-shadow:0 0 8px rgba(255,255,255,0.0);
    }
    100%{
      height:0%;
      box-shadow:0 0 4px rgba(0,0,0,1.0);
    }
}

.loader > ul{
    list-style:none;
    position:absolute;
    width:120px;
    height:120px;
    left:50%;
    top:50%;
    margin:-60px -80px;
}

.loader li{
 width:4px;
 height:30px;
 border-radius:2px;
 background:#050505;    
 position:absolute;
 left:50%;
 top:10px;
 margin-left:-2px;
 transform-origin:2px 50px;
    box-shadow:1px 0 0 rgba(255,255,255,0.1);
}

.loader li div{
    border-radius:2px;
    width:4px;
    background:rgba(255,255,255,0.5);
    position:absolute;
    bottom:0px;
    left:0px;
    animation:pulse 6s normal infinite;
}

.loader  ul>li:nth-of-type(1){
 transform:rotate(0deg);   
 box-shadow:0 1px 0 rgba(255,255,255,0.1);
}

.loader  ul>li:nth-of-type(1)>div{
 animation-delay:100ms;   
}

.loader  ul>li:nth-of-type(2){
 transform:rotate(30deg);   
}

.loader  ul>li:nth-of-type(2)>div{
 animation-delay:200ms;   
}


.loader  ul>li:nth-of-type(3){
 transform:rotate(60deg);   
}

.loader  ul>li:nth-of-type(3)>div{
 animation-delay:300ms;   
}


.loader  ul>li:nth-of-type(4){
 transform:rotate(90deg);   
}

.loader  ul>li:nth-of-type(4)>div{
 animation-delay:400ms;   
}


.loader  ul>li:nth-of-type(5){
 transform:rotate(120deg);   
}

.loader  ul>li:nth-of-type(5)>div{
 animation-delay:500ms;   
}


.loader  ul>li:nth-of-type(6){
 transform:rotate(150deg);   
}

.loader  ul>li:nth-of-type(6)>div{
 animation-delay:600ms;   
}


.loader  ul>li:nth-of-type(7){
 transform:rotate(180deg);   
 box-shadow:0 -1px 0 rgba(255,255,255,0.1);
}

.loader  ul>li:nth-of-type(7)>div{
 animation-delay:700ms;   
}


.loader  ul>li:nth-of-type(8){
 transform:rotate(210deg);   
 box-shadow:-1px 0 0 rgba(255,255,255,0.1);
}

.loader  ul>li:nth-of-type(8)>div{
  animation-delay:800ms;   
}


.loader  ul>li:nth-of-type(9){
 transform:rotate(240deg);   
 box-shadow:-1px 0 0 rgba(255,255,255,0.1);
}
.loader  ul>li:nth-of-type(9)>div{
 animation-delay:900ms;   
}


.loader  ul>li:nth-of-type(10){
 transform:rotate(270deg);   
 box-shadow:-1px 0 0 rgba(255,255,255,0.1);
}
.loader ul>li:nth-of-type(10)>div{
 animation-delay:1000ms;   
}



.loader ul>li:nth-of-type(11){
 transform:rotate(300deg);   
 box-shadow:-1px 0 0 rgba(255,255,255,0.1);
}

.loader ul>li:nth-of-type(11)>div{
 animation-delay:1100ms;   
}


.loader ul>li:nth-of-type(12){
 transform:rotate(330deg);   
 box-shadow:-1px 0 0 rgba(255,255,255,0.1);
}

.loader ul>li:nth-of-type(12)>div{
 animation-delay:1200ms;   
}
.loader{

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050505', endColorstr='#101010',GradientType=1 );

    position:absolute;
    width:320px;
    height:240px;
    left:50%;
    top:50%;
    margin-left:-160px;
    margin-top:-120px;
    border-radius:4px;
}

.loader::after{
background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.03) 49%, rgba(255,255,255,0.02) 50%, rgba(255,255,255,0.02) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,0.03)), color-stop(49%,rgba(255,255,255,0.03)), color-stop(50%,rgba(255,255,255,0.02)), color-stop(100%,rgba(255,255,255,0.02)));
background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 49%,rgba(255,255,255,0.02) 50%,rgba(255,255,255,0.02) 100%);
background: -o-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 49%,rgba(255,255,255,0.02) 50%,rgba(255,255,255,0.02) 100%);
background: -ms-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 49%,rgba(255,255,255,0.02) 50%,rgba(255,255,255,0.02) 100%);
background: radial-gradient(ellipse at center,  rgba(255,255,255,0.03) 0%,rgba(255,255,255,0.03) 49%,rgba(255,255,255,0.02) 50%,rgba(255,255,255,0.02) 100%);
    position:absolute;
    width:100%;
    height:100%;
    background-size:200% 240%;
    top:0px;
    left:0px;
    z-index:4;
    content:' ';
}

.loader h4{
   text-align:center;
   width:100%;
   position:absolute;
   bottom:0px;
   font-family:'Source Sans',sans-serif;
   font-weight:300;
}


#loadingBlock{
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	overflow-y: hidden;
	background-color: rgba(1,1,1,0.2);
}

#loadingMent{
   display: inline-block;
   position:absolute;
   /* left:0%; */
   top:100%;
   font-size:40px;
   color:azure;
}

.package-body{
	width:100%;
	background-color:lightgray;
	
}