.BST1-Payment-payicons { display: flex; flex-direction: row; justify-content: space-around; } .BST1-Payment-onlypay { display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 0.5rem; } .BST1-Payment-structure { display: flex; flex-direction: column; gap: 5px; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .payment-div { display: flex; justify-content: space-evenly; gap: 0.3rem; } .received-button { width: 100px; height: 40px; border-radius: 8px; border: 0px solid none; font-size: 18px; font-weight: 600; background-color: #dbdbdb; color: #696969; border: none; text-align: center; } .received-button1 { width: 100px; height: 40px; border-radius: 8px; border: 1px solid #ff4d4f; font-size: 18px; font-weight: 600; background-color: #fff; color: #696969; text-align: center; } .received-button1:focus-visible { width: 100px; height: 40px; border-radius: 8px; outline: 0.5px solid #ff4d4f; font-size: 18px; font-weight: 600; background-color: #fff; color: #696969; text-align: center; } .price-button { border-radius: 8px; border: 0px solid none; font-size: 24px; font-weight: 600; background-color: var(--SELECTED_COLOR); color: #fff; border: none; width: max-content; padding: 0px 12px; cursor: pointer; } .price-button-disabled { border-radius: 8px; border: 0px solid none; font-size: 24px; font-weight: 600; background-color: var(--SELECTED_COLOR); color: #fff; border: none; width: max-content; padding: 0px 12px; cursor: pointer; pointer-events: none; opacity: 0.5; } .Balance-button { width: 100px; height: 40px; border-radius: 8px; border: 0px solid none; font-size: 18px; font-weight: 600; background-color: #e3ffd5; color: #555555; border: none; text-align: center; } .payment-div-0 { display: flex; flex-direction: row; align-items: center; justify-content: space-around; gap: 0.5rem; } .payment-div-subdiv-select { width: max-content; cursor: pointer; height: 40px; border-radius: 8.3px; background-color: #ffffff; } .payment-div-subdiv-select1 { width: max-content; height: 40px; border-radius: 8.3px; } .payment-div-0-Hold { width: 80px; height: 40px; border-radius: 8.3px; border: none; display: flex; font-weight: 600; cursor: pointer; align-items: center; text-align: center; justify-content: center; gap: 0.2rem; background-color: #dbdbdb; font-family: 'Poppins', sans-serif; } .payment-div-0-userplus { font-size: 25px; } .payment-div-0-hand { font-size: 18px; } .Table1-payment-mode { display: flex; justify-content: space-between; column-gap: 0.5rem; } .BST1-Payment-onlyicons { display: flex; flex-direction: row; // gap: 1rem; justify-content: center; //naresh column-gap: 0.5rem; } @media (min-width: 500px) and (max-width: 768px) { .Table1-payment-mode { column-gap: 0.5rem !important; } } @media (max-width: 499px) { .Balance-button { font-size: 16px; width: 80px; } .received-button { font-size: 16px; width: 80px; } .price-button { font-size: 16px; width: 80px; } .payment-div-subdiv-select { width: 80px; height: 40px; } .payment-div-subdiv-select1 { width: 80px; height: 40px; } .BST1-Payment-payicons { // flex-direction: column; flex-direction: row; align-items: center; justify-content: space-evenly; } .BST1-Payment-onlyicons { display: flex; flex-direction: row; // gap: 1rem; justify-content: center; } .Table1-payment-mode { margin: 0.5rem 0rem; column-gap: 0.5rem !important; } } @media all and (max-width: 800px) { .BSBTOverall1-Default-summary .BST1-Payment-structure { display: none !important; } } .Order { background-color: var(--SELECTED_COLOR); } .ChairClrRed { color: red; } .ChairClrGreen { color: var(--SELECTED_COLOR); }