.wpc-payment-methods-container { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 80px; background-color: #f5f5f5; padding: 3rem 1rem; } .wpc-payment-methods-title { font-size: 2rem; text-align: center; font-weight: bold; } .wpc-payment-methods-cards { display: grid; grid-template-columns: 200px 400px; justify-items: center; align-items: center; justify-content: center; } .wpc-payment-methods-cards-transfer, .wpc-payment-methods-cards-credit { position: relative; display: flex; justify-content: space-evenly; align-items: center; height: 80px; background-color: #fff; border: 1px solid #c9d0f0; border-radius: 12px; } .wpc-payment-methods-cards-transfer img, .wpc-payment-methods-cards-credit img { scale: .8; } .wpc-payment-methods-cards-credit::before { content: "Plataformas de Pago"; position: absolute; top: -45px; font-size: 1.5rem; } .wpc-payment-methods-cards-credit-devider { width: 2px; background-color: #000; height: 75%; } @media (width <=1279px) { .wpc-payment-methods-container { gap: 50px } .wpc-payment-methods-title { font-size: 1.7rem; } .wpc-payment-methods-cards-credit::before { top: -35px; font-size: 1.2rem } .wpc-payment-methods-cards-credit-devider { width: 1px; } } @media (width <=767px) { .wpc-payment-methods-container { gap: 30px } .wpc-payment-methods-title { margin: 0 1rem; font-size: 1.5rem; } .wpc-payment-methods-cards { grid-template-columns: 1fr; gap: 50px; width: 100%; } .wpc-payment-methods-cards-credit::before { font-size: 1rem; top: -25px; } .wpc-payment-methods-cards-transfer, .wpc-payment-methods-cards-credit { height: 56px; width: 330px; } .wpc-payment-methods-cards-transfer img, .wpc-payment-methods-cards-credit img { scale: 1; } }
