/*Preloader*/
.holder {
  position: fixed;
  left: 0px;
  top: 0px;
  bottom: 0px;
  right: 0px;
  width: 100%;
  height: 100%;
  background-color: #d7d7d9;
  z-index: 1000;
}
.marTopActii{
  margin-top: 45px;
}
.preloader {
  /* size */
  width: 120px;
  height: 120px;
  position: absolute;
  left: 50%;
  top: 50%;
  /*background: url(../images/logo.png) no-repeat center center;*/
  transform: translateX(-50%) translateY(-50%);
  /*animation: rotatePreloader 2s infinite ease-in;*/
}
.preloader img{
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 40;
}

@keyframes rotatePreloader {
  0% {
    transform: translateX(-50%) translateY(-50%) rotateZ(0deg);
  }
  100% {
    transform: translateX(-50%) translateY(-50%) rotateZ(-360deg);
  }
}
.preloader div {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
}
.descriptionSlider-nav img{
  border: 2px solid orange;
}
.preloader div{
	background:#3677a7;
	width: 10px;
	height: 10px;
}
/*.preloader div:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0%;
  width: 10%;
  height: 10%;
  background-color: #ffffff;
  transform: translateX(-50%);
  border-radius: 50%;
}*/

.preloader div:nth-child(1) {
	/*height: 100%;*/
  /*transform: rotateZ(0deg);*/
  animation: rotateCircle1 4s infinite linear;
  z-index: 9;
}

@keyframes rotateCircle1 {
  0% {
    opacity: 1;
  }
  0% {
  	opacity: 1;
    left: 0%;
    top: 0;
    width: 10px;
    height: 100%;
  }
  12.5% {
  	width: 10px;
  	height: 10px;
 	left: 0%;
    top: calc(100% - 10px);

  }
  25% {
  	height: 10px;
  	left: 0%;
   	top: calc(100% - 10px);
   	width: 100%;
   
  }
  37.5%{
	height: 10px;
  	left: calc(100% - 10px);
   	top: calc(100% - 10px);
   	width: 10px;
  }

  50% {
  	height: 100%;
  	left: calc(100% - 10px);
   	top: 0;
   	width: 10px;
    opacity: 1;
  }

  62.5% {
  	height: 10px;
  	left: calc(100% - 10px);
   	top: 0;
   	width: 10px;
    opacity: 1;
  }

  75% {
  	height: 10px;
  	left: 0%;
   	top: 0;
   	width: 100%;
    opacity: 1;
  }

  87.5% {
  	left: 0%;
    top: 0;
    width: 10px;
    height: 10px;
    opacity: 1;
  }

  100% {
  	left: 0%;
    top: 0;
    width: 10px;
    height: 100%;
    opacity: 1;
  }

}
.preloader div:nth-child(2) {
  /*transform: rotateZ(36deg);*/
  animation: rotateCircle2 4s infinite linear;
  z-index: 8;
}

@keyframes rotateCircle2 {
  0% {
    opacity: 1;
  }
  0% {
    opacity: 1;
     height: 10px;
    left: 0%;
    top: calc(100% - 10px);
    width: 100%;
  }
  12.5% {
    height: 10px;
    left: calc(100% - 10px);
    top: calc(100% - 10px);
    width: 10px;

  }
  25% {
   height: 100%;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
    opacity: 1;
   
  }
  37.5%{
    height: 10px;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
    opacity: 1;
  }

  50% {
    height: 10px;
    left: 0%;
    top: 0;
    width: 100%;
    opacity: 1;
  }

  62.5% {
     left: 0%;
    top: 0;
    width: 10px;
    height: 10px;
    opacity: 1;
  }

  75% {
    left: 0%;
    top: 0;
    width: 10px;
    height: 100%;
    opacity: 1;
  }

  87.5% {
   opacity: 1;
    width: 10px;
    height: 10px;
  left: 0%;
    top: calc(100% - 10px);

  }

  100% {
    opacity: 1;
     height: 10px;
    left: 0%;
    top: calc(100% - 10px);
    width: 100%;
  }

}

.preloader div:nth-child(3) {
  /*transform: rotateZ(72deg);*/
  animation: rotateCircle3 4s infinite linear;
  z-index: 7;
}

@keyframes rotateCircle3 {
  0% {
    opacity: 1;
  }
  0% {
    opacity: 1;
     height: 100%;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
    
  }
  12.5% {
    height: 10px;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
    opacity: 1;

  }
  25% {
   height: 10px;
    left: 0%;
    top: 0;
    width: 100%;
    opacity: 1;
   
  }
  37.5%{
    left: 0%;
    top: 0;
    width: 10px;
    height: 10px;
    opacity: 1;
  }

  50% {
    left: 0%;
    top: 0;
    width: 10px;
    height: 100%;
    opacity: 1;
  }

  62.5% {
     opacity: 1;
    width: 10px;
    height: 10px;
  left: 0%;
    top: calc(100% - 10px);
  }

  75% {
    opacity: 1;
     height: 10px;
    left: 0%;
    top: calc(100% - 10px);
    width: 100%;
  }

  87.5% {
   height: 10px;
    left: calc(100% - 10px);
    top: calc(100% - 10px);
    width: 10px;

  }

  100% {
    opacity: 1;
     height: 100%;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
  }

}

.preloader div:nth-child(4) {
  /*transform: rotateZ(72deg);*/
  animation: rotateCircle4 4s infinite linear;
  z-index: 7;
}

@keyframes rotateCircle4 {
  0% {
    opacity: 1;
  }
  0% {
   height: 10px;
    left: 0%;
    top: 0;
    width: 100%;
    opacity: 1;    
  }

  12.5% {
    left: 0%;
    top: 0;
    width: 10px;
    height: 10px;
    opacity: 1;
  }
  
  25% {
   left: 0%;
    top: 0;
    width: 10px;
    height: 100%;
    opacity: 1;
   
  }
  37.5%{
     opacity: 1;
    width: 10px;
    height: 10px;
  left: 0%;
    top: calc(100% - 10px);
  }

  50% {
    opacity: 1;
     height: 10px;
    left: 0%;
    top: calc(100% - 10px);
    width: 100%;
  }

  62.5% {
     height: 10px;
    left: calc(100% - 10px);
    top: calc(100% - 10px);
    width: 10px;
  }

  75% {
    opacity: 1;
     height: 100%;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
  }

  87.5% {
    height: 10px;
    left: calc(100% - 10px);
    top: 0;
    width: 10px;
    opacity: 1;


  }

  100% {
    height: 10px;
    left: 0%;
    top: 0;
    width: 100%;
    opacity: 1;
  }

}


/*END Preloader*/