  body {
         background-image: url('pay-background.jpg');
         background-size: cover; /* This will make the background image cover the entire viewport */
         background-position: center; /* This will center the background image */
         position: relative; /* Add this for positioning the overlay */
         height: 100vh; /* Ensure the body takes the full height of the viewport */
         }
         /* Create a semi-transparent black overlay */
         body::before {
         content: "";
         background-color: rgba(0, 0, 0, 0.7); /* Adjust opacity by changing the last value (0.6 is 60% opacity) */
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         z-index: -1; /* Ensure the overlay is behind other content */
         }
         /* Centered content example */
         .centered {
         /*position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         text-align: left;*/
         }
         .seal img {
         max-height: 35px;
         }
         .pyop-collapsed {
         display: none;
         }
         .form-check{
         width: 100%;
         padding:20px;
         box-shadow:0 0 10px #00000050;
         margin:10px auto;
         padding-left:40px !important;
         }
        
         .card-pay{
         border: 1px solid #ced4da;
         padding: 0.85rem !important;
         }
         .card-pay:hover, .card-pay:active {
         color: #495057;
         background-color: #fff;
         border-color: #80bdff;
         outline: 0;
         box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25);
         }