.toggle {
   background: #fff;
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
   border-radius: 10px;
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: hidden;
   visibility: hidden;
}

.toggle span {
   position: absolute;
   width: 40px;
   height: 4px;
   background: transparent;
   border-radius: 4px;
   transition: 0.5s;
}
.toggle span:nth-child(1) {
   transform: translateY(-15px);
   width: 25px;
   /*left: 15px;*/
}
.toggle.active span:nth-child(1) {
   width: 40px;
   transform: translateY(0px) rotate(45deg);
   transition-delay: 0.125s;
}
.toggle span:nth-child(2) {
   transform: translateY(15px);
   width: 15px;
   /*left: 15px;*/
}
.toggle.active span:nth-child(2) {
   width: 40px;
   transform: translateY(0px) rotate(315deg);
   transition-delay: 0.25s;
}
.toggle.active span:nth-child(3) {
   transform: translateX(60px);
}

@media (max-width:991px) {
   .toggle {
      visibility: visible;
   }
   .toggle span {
      background: #1863FF;
   }
}