.credit-card{background:#fff;border-radius:.875rem;padding:1.125rem;display:flex;flex-direction:column}.credit-card__first-block{flex:1}.credit-card__image{display:inline-block;position:relative;border-radius:.875rem;background:url(data:image/svg+xml;base64,Cjxzdmcgd2lkdGg9IjkxcHgiIGhlaWdodD0iOTRweCIgdmlld0JveD0iMCAwIDkxIDk0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgoJPHJlY3QgaWQ9ImJnIiBmaWxsPSIjMzgzQTQ1IiB4PSIwIiB5PSIwIiB3aWR0aD0iOTEiIGhlaWdodD0iOTQiPjwvcmVjdD4KCTxnIGlkPSJwYXR0ZXJuIj4KCQk8cGF0aCBkPSJNNzIuNjY5LDcyLjk1MzggQzcxLjE4Myw3NC40ODgxIDcxLjE4Myw3Ni45NzYgNzIuNjY5LDc4LjUxIEw3NS4wNTksODAuOTc5IEM3NS4yMjQsODEuMTUgNzUuMjI0LDgxLjQyNiA3NS4wNTksODEuNTk3IEM3NC44OTQsODEuNzY3IDc0LjYyNyw4MS43NjcgNzQuNDYyLDgxLjU5NyBMNzIuMDcxLDc5LjEyNyBDNzAuMjU1LDc3LjI1MiA3MC4yNTUsNzQuMjExNyA3Mi4wNzEsNzIuMzM2NCBMNzQuNDYyLDY5Ljg2NjkgQzc0LjYyNyw2OS42OTY1IDc0Ljg5NCw2OS42OTY1IDc1LjA1OSw2OS44NjY5IEM3NS4yMjQsNzAuMDM3NCA3NS4yMjQsNzAuMzEzOCA3NS4wNTksNzAuNDg0MyBMNzIuNjY5LDcyLjk1MzggWiIgaWQ9IlBhdGgiIGZpbGw9IiNGRkE1NTIiPjwvcGF0aD4KCQk8cGF0aCBkPSJNMzEuMzgyLDc4LjM5MiBDMzIuODY3LDc2Ljg1NyAzMi44NjcsNzQuMzY5NiAzMS4zODIsNzIuODM1MyBMMjguOTkxLDcwLjM2NTggQzI4LjgyNiw3MC4xOTUzIDI4LjgyNiw2OS45MTg5IDI4Ljk5MSw2OS43NDg1IEMyOS4xNTYsNjkuNTc4IDI5LjQyNCw2OS41NzggMjkuNTg5LDY5Ljc0ODUgTDMxLjk3OSw3Mi4yMTc5IEMzMy43OTUsNzQuMDkzMiAzMy43OTUsNzcuMTM0IDMxLjk3OSw3OS4wMDkgTDI5LjU4OSw4MS40NzggQzI5LjQyNCw4MS42NDkgMjkuMTU2LDgxLjY0OSAyOC45OTEsODEuNDc4IEMyOC44MjYsODEuMzA4IDI4LjgyNiw4MS4wMzEgMjguOTkxLDgwLjg2MSBMMzEuMzgyLDc4LjM5MiBaIiBpZD0iUGF0aCIgZmlsbD0iIzI5OUY1NSI+PC9wYXRoPgoJCTxwYXRoIGQ9Ik01NC4yNzIsNTAuMTQ1IEM1Mi43ODcsNDguNjEgNTAuMzc5LDQ4LjYxIDQ4Ljg5Myw1MC4xNDUgTDQ2LjUwMiw1Mi42MTQgQzQ2LjMzNyw1Mi43ODUgNDYuMDcsNTIuNzg1IDQ1LjkwNSw1Mi42MTQgQzQ1Ljc0LDUyLjQ0NCA0NS43NCw1Mi4xNjcgNDUuOTA1LDUxLjk5NyBMNDguMjk1LDQ5LjUyNyBDNTAuMTExLDQ3LjY1MiA1My4wNTUsNDcuNjUyIDU0Ljg3LDQ5LjUyNyBMNTcuMjYxLDUxLjk5NyBDNTcuNDI2LDUyLjE2NyA1Ny40MjYsNTIuNDQ0IDU3LjI2MSw1Mi42MTQgQzU3LjA5Niw1Mi43ODUgNTYuODI4LDUyLjc4NSA1Ni42NjMsNTIuNjE0IEw1NC4yNzIsNTAuMTQ1IFoiIGlkPSJQYXRoIiBmaWxsPSIjRkM2MzYzIj48L3BhdGg+CgkJPHBhdGggZD0iTTMuODkzLDU0LjMxOTggQzUuMzc5LDU1Ljg1NDEgNy43ODcsNTUuODU0MSA5LjI3Miw1NC4zMTk4IEwxMS42NjMsNTEuODUwMyBDMTEuODI4LDUxLjY3OTggMTIuMDk2LDUxLjY3OTggMTIuMjYxLDUxLjg1MDMgQzEyLjQyNiw1Mi4wMjA4IDEyLjQyNiw1Mi4yOTcyIDEyLjI2MSw1Mi40Njc3IEw5Ljg3LDU0LjkzNzEgQzguMDU1LDU2LjgxMjQgNS4xMTEsNTYuODEyNCAzLjI5NSw1NC45MzcxIEwwLjkwNSw1Mi40Njc3IEMwLjc0LDUyLjI5NzIgMC43NCw1Mi4wMjA4IDAuOTA1LDUxLjg1MDMgQzEuMDcsNTEuNjc5OCAxLjMzNyw1MS42Nzk4IDEuNTAyLDUxLjg1MDMgTDMuODkzLDU0LjMxOTggWiIgaWQ9IlBhdGgiIGZpbGw9IiM1MzhEQzIiPjwvcGF0aD4KCQk8cGF0aCBkPSJNNzYuNzM4LDMxLjI0NSBDNzguMjIzLDI5LjcxMDYgNzguMjIzLDI3LjIyMyA3Ni43MzgsMjUuNjg4NyBMNzQuMzQ3LDIzLjIxOTIgQzc0LjE4MiwyMy4wNDg4IDc0LjE4MiwyMi43NzI0IDc0LjM0NywyMi42MDE5IEM3NC41MTIsMjIuNDMxNCA3NC43OCwyMi40MzE0IDc0Ljk0NSwyMi42MDE5IEw3Ny4zMzYsMjUuMDcxMyBDNzkuMTUxLDI2Ljk0NjYgNzkuMTUxLDI5Ljk4NyA3Ny4zMzYsMzEuODYyMyBMNzQuOTQ1LDM0LjMzMTggQzc0Ljc4LDM0LjUwMjMgNzQuNTEyLDM0LjUwMjMgNzQuMzQ3LDM0LjMzMTggQzc0LjE4MiwzNC4xNjEzIDc0LjE4MiwzMy44ODQ5IDc0LjM0NywzMy43MTQ0IEw3Ni43MzgsMzEuMjQ1IFoiIGlkPSJQYXRoIiBmaWxsPSIjMjk5RjU1Ij48L3BhdGg+CgkJPHBhdGggZD0iTTI3LjAyNSwyNS44MDczIEMyNS41NCwyNy4zNDE2IDI1LjU0LDI5LjgyOTMgMjcuMDI1LDMxLjM2MzYgTDI5LjQxNiwzMy44MzMgQzI5LjU4MSwzNC4wMDM1IDI5LjU4MSwzNC4yNzk5IDI5LjQxNiwzNC40NTA0IEMyOS4yNTEsMzQuNjIwOSAyOC45ODMsMzQuNjIwOSAyOC44MTgsMzQuNDUwNCBMMjYuNDI3LDMxLjk4MDkgQzI0LjYxMiwzMC4xMDU3IDI0LjYxMiwyNy4wNjUyIDI2LjQyNywyNS4xOSBMMjguODE4LDIyLjcyMDUgQzI4Ljk4MywyMi41NSAyOS4yNTEsMjIuNTUgMjkuNDE2LDIyLjcyMDUgQzI5LjU4MSwyMi44OTEgMjkuNTgxLDIzLjE2NzQgMjkuNDE2LDIzLjMzNzkgTDI3LjAyNSwyNS44MDczIFoiIGlkPSJQYXRoIiBmaWxsPSIjRkZBNTUyIj48L3BhdGg+CgkJPHBhdGggZD0iTTQ5LjI0OSw3LjE3MzEgQzUwLjczNSw4LjcwNzQgNTMuMTQzLDguNzA3NCA1NC42MjgsNy4xNzMxIEw1Ny4wMTksNC43MDM3IEM1Ny4xODQsNC41MzMyIDU3LjQ1Miw0LjUzMzIgNTcuNjE3LDQuNzAzNyBDNTcuNzgyLDQuODc0MSA1Ny43ODIsNS4xNTA1IDU3LjYxNyw1LjMyMSBMNTUuMjI2LDcuNzkwNSBDNTMuNDEsOS42NjU4IDUwLjQ2Nyw5LjY2NTggNDguNjUxLDcuNzkwNSBMNDYuMjYxLDUuMzIxIEM0Ni4wOTYsNS4xNTA1IDQ2LjA5Niw0Ljg3NDEgNDYuMjYxLDQuNzAzNyBDNDYuNDI2LDQuNTMzMiA0Ni42OTMsNC41MzMyIDQ2Ljg1OCw0LjcwMzcgTDQ5LjI0OSw3LjE3MzEgWiIgaWQ9IlBhdGgiIGZpbGw9IiM1MzhEQzIiPjwvcGF0aD4KCQk8cGF0aCBkPSJNOC45ODQ4LDIuODUxOCBDNy40OTkzLDEuMzE3NSA1LjA5MSwxLjMxNzUgMy42MDU2LDIuODUxOCBMMS4yMTQ4LDUuMzIxMiBDMS4wNDk4LDUuNDkxNyAwLjc4MjIsNS40OTE3IDAuNjE3MSw1LjMyMTIgQzAuNDUyMSw1LjE1MDggMC40NTIxLDQuODc0NCAwLjYxNzEsNC43MDM5IEwzLjAwNzksMi4yMzQ0IEM0LjgyMzQsMC4zNTkxIDcuNzY2OSwwLjM1OTEgOS41ODI0LDIuMjM0NCBMMTEuOTczLDQuNzAzOSBDMTIuMTM4LDQuODc0NCAxMi4xMzgsNS4xNTA4IDExLjk3Myw1LjMyMTIgQzExLjgwOCw1LjQ5MTcgMTEuNTQxLDUuNDkxNyAxMS4zNzUsNS4zMjEyIEw4Ljk4NDgsMi44NTE4IFoiIGlkPSJQYXRoIiBmaWxsPSIjRkM2MzYzIj48L3BhdGg+Cgk8L2c+Cjwvc3ZnPg==) repeat -40% -29%;padding-bottom:62.5%;min-width:100%;max-width:100%}.credit-card__image-container{margin-left:auto;margin-right:auto}.credit-card__number{font-size:1rem;position:absolute;padding:.4em;background-color:#383a45;color:#fff;-webkit-user-select:none;user-select:none;bottom:24%;left:1.2rem}.credit-card__delete-button{display:block;width:100%;margin-top:1rem}.credit-card--empty{display:flex;align-items:center;justify-content:center}.credit-card__add-card{font-size:.875rem;text-align:center;color:#299f55;padding:.4rem;border-radius:.875rem;border:2px solid rgba(0,0,0,0);transition:border-color .2s;cursor:pointer}.credit-card__add-card-icon{font-size:2.25rem;vertical-align:-0.35em;margin-right:.2rem}.credit-card__add-card:focus,.credit-card__add-card:hover{outline:none}@media(hover: hover){.credit-card__add-card:focus,.credit-card__add-card:hover{opacity:.8}.is-tabbing .credit-card__add-card:focus,.is-tabbing .credit-card__add-card:hover{border-color:#299f55}}