.width-in {
  width: 88%;
  opacity: 0;
  animation: width-in 0.33s cubic-bezier(0.42, 0, 0.85, 0.17) forwards;
  animation-delay: 0.33s;
}

@keyframes width-in {
  from {
    opacity: 0;
    transform: scale(1.12, 1.12) translate(-4%, 6%);;
  }
  to {
    opacity: 1;
    transform: scale(1, 1);
  }
}

/*@keyframes width-in {*/
/*  from {*/
/*    opacity: 0;*/
/*    width: 88%;*/
/*  }*/
/*  to {*/
/*    opacity: 1;*/
/*    width: 75%;*/
/*  }*/
/*}*/

.slide-in {
  opacity: 0;
  transform: translateX(-100%);
  animation: slide-in 0.5s ease-in-out 1s forwards;
  animation-delay: 0.86s;
  
}

@keyframes slide-in {
  from {
    opacity: 0;
    transform: translateX(-100%);
  }
  to {
    opacity: 1;
    transform: translateX(0%);
  }
}

.modal-in {
  opacity: .92;
  transform: translate(5%, 40%);
  animation: modal-in 0.76s ease-in-out 1s forwards;
  animation-delay: 0.46s;
}

@keyframes modal-in {
  from {
    opacity: 0;
    transform: translate(-100%, 40%);
  }
  to {
    opacity: .92;
    transform: translate(5%, 40%);
  }
}

.zoom-in-out-box {
  animation: zoom-in-zoom-out 1s ease infinite;
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: scale(1.4, 1.4);
  }
  50% {
    transform: scale(1.5, 1.5);
  }
  100% {
    transform: scale(1.4, 1.4);
  }
}

.statistic {
    background-image: url('/html/stat.png');
    background-size: cover;
    background-position: center;
	transform: scale(1.4);
}
.random {
    background-image: url('/html/changes.png');
    background-size: cover;
    background-position: center;
	transform: scale(1.4);
}
.donate {
    background-image: url('/html/donate.png');
    background-size: cover;
    background-position: center;
	transform: scale(1.4);
}

.telegram {
    background-image: url('/html/telegram.png');
    background-size: cover;
    background-position: center;
	transform: scale(1.4);
}

.games {
    background-image: url('/html/games.png?cache');
    background-size: cover;
    background-position: center;
        transform: scale(1.4);
}

.space {
    background-image: url('/html/space.png?cache192');
    background-size: cover;
    background-position: center;
        transform: scale(1.4);
}

.tube {
    background-image: url('/html/youtube.png?cache19');
    background-size: cover;
    background-position: center;
        transform: scale(1.4);
}

.map {
    background-image: url('/html/map.png?cache21');
    background-size: cover;
    background-position: center;
        transform: scale(1.4);
}

.trtv {
    background-image: url('/html/trtv.png?cache11');
    background-size: cover;
    background-position: center;
        transform: scale(1.4);
}

.statistic:hover {
	transform: scale(1.32);
	transition: .2s ease-in-out;
}
.random:hover {
	transform: scale(1.32);
	transition: .2s ease-in-out;
}
.donate:hover {
	transform: scale(1.32);
	transition: .2s ease-in-out;
}
.telegram:hover {
	transform: scale(1.32);
	transition: .2s ease-in-out;
}

.games:hover {
        transform: scale(1.32);
        transition: .2s ease-in-out;
}

.map:hover {
        transform: scale(1.32);
        transition: .2s ease-in-out;
}
.space:hover {
        transform: scale(1.32);
        transition: .2s ease-in-out;
}

.tube:hover {
        transform: scale(1.32);
        transition: .2s ease-in-out;
}

.trtv:hover {
        transform: scale(1.32);
        transition: .2s ease-in-out;
}
