.wallets { .slides { .swiper-container { width: 85% !important; overflow: visible; } .card { max-width: 350px; box-shadow:$subtle-box-shadow; padding:0; border-radius: 6px; @media (min-width: 500px) { & { width: 350px; position: relative; margin: 1.5rem auto 0; } } .item{ padding: calc(100vh - 99vh) calc(100vw - 93vw) calc(100vh - 97vh) calc(100vw - 95vw); i{left:auto;} span{ clear:both; width: 100%; display: inline-block; &.wallet-name{ margin-top:10px; margin-bottom:5px; font-size:13px; } &.wallet-number{ visibility: hidden; } &.visible{ visibility: visible !important; } } .big-icon-svg{ & > .bg{padding:.3rem;width: 40px;height:40px;} } } } .swiper-slide { width: 100% !important; max-width: 450px; @media (min-width: 500px) { & { margin: 0 auto; display: block; float: none; max-width: none; } &.swiper-slide-next .card { float: left; } &.swiper-slide-prev .card { float: right; } } &.swiper-slide-prev, &.swiper-slide-next { opacity: .3; transform: scale(.8); } &.swiper-slide-prev { left: 10vw; } &.swiper-slide-next { left: -10vw; } } } .swiper-pagination { visibility: hidden; } } .platform-browser { .wallets { .slides { .swiper-slide { &.swiper-slide-prev, &.swiper-slide-next { &:hover { opacity: 1; } } } } } }