.no-feature-popup {
   position: absolute;
   top: -100%;
   left: calc(50% - (375px / 2));
   width: 375px;
   height: 100%;
   background-color: var(--popup-back);
   z-index: 11;
   opacity: 0;
   transition: opacity 0.5s ease;;
}

.no-feature-popup.active {
   top: 0;
   opacity: 1;
}
.no-feature-content {
   margin: auto;
   margin-top: 30vh;
   width: 90%;
   max-width: 343px;;
   background-color: var(--blue-shades-700);
   padding: 24px;
   text-align: center;
   box-shadow: 0px 3px 12px rgba(1, 3, 81, 0.2), 
               0px 12px 20px rgba(12, 13, 40, 0.4);
   border-radius: 32px;
}
.no-feature-content h5 {
   margin-bottom: 22px;
}
.no-feature-content p {
   margin-bottom: 35px;
}
.no-feature-content a {
   background-color: var(--buttons-primary-normal);
   border-radius: 120px;
   display: block;
   color: var(--white);
}
.no-feature-content button {
   background: rgba(46, 46, 46, 0.4);
   border-radius: 32px;
} 
.no-feature-content .button-wrapper:last-child {
   margin-top: 24px;
}

.button-lg {
   width: 100%;
   padding: 10px 0;
   color: var(--white);
}

@media (min-width:480px) {
   .no-feature-popup {
      width: 100%;
      left: 0;
   }
}