body, body *, p {
         font-family: "Roboto", sans-serif;
         font-size: 15px;
         line-height: 25px;
         font-weight: 500;
         }
         .orange-header {
         background-color: #f36f21;
         color: #fff;
         padding: 15px;
         text-align: center;
         font-weight: bold;
         }
         .gold-card {
         border: 1px solid #eee;
         border-radius: 10px;
         padding: 15px;
         background: #fff;
         box-shadow: 0 1px 3px rgba(0,0,0,0.1);
         }
         .gold-card .rate {
         font-size: 24px;
         color: #d32f2f;
         font-weight: 900;
         }
         .range-bar {
         display: flex;
         height: 40px;
         border-radius: 5px;
         overflow: hidden;
         margin-bottom: 10px;
         position: relative;
         }
         .range-progress {
         position: absolute;
         height: 100%;
         background-color: rgba(255, 215, 0, 0.5);
         top: 0;
         left: 0;
         z-index: 1;
         pointer-events: none;
         }
         input[type=range] {
         position: absolute !important;
         }
         .range-indicator-line {
         position: absolute;
         width: 2px;
         height: 100%;
         background-color: orange;
         z-index: 2;
         }
         .range-segment {
         flex-grow: 1;
         display: flex;
         align-items: center;
         justify-content: center;
         font-weight: bold;
         color: #fff;
         font-size: 14px;
         position: relative;
         z-index: 0;
         }
         .seg-1 { background: #1a632a; width: 22.72%; }
         .seg-2 { background: #348a44; width: 22.72%; }
         .seg-3 { background: #7ac943; width: 22.72%; color: #333; }
         .seg-4 { background: #b5e07c; width: 22.72%; color: #333; }
         .seg-5 { background: #e6f4d7; width: 9.12%; color: #333; }
         .arrow {
         position: absolute;
         top: calc(100% + -23px);   /* Just below the bar */
         left: 0;
         width: 0;
         height: 0;
         border-left: 8px solid transparent;
         border-right: 8px solid transparent;
         border-bottom: 28px solid orange; /* Downward arrow */
         z-index: 10;
         transition: left 0.2s ease;
         pointer-events: none;
         }
         .value-label {
         position: absolute;
         top: calc(100% - 39px);  /* Slightly above the bar edge */
         left: 0;
         /*background: #fff;*/
         padding: 2px 6px;
         border-radius: 3px;
         font-size: 17px;
         font-weight: bold;
         color: #333;
         z-index: 10;
         transition: left 0.2s ease;
         pointer-events: none;
         }
         .range-progress,
         .range-indicator-line,
         .arrow,
         .value-label {
         transition: all 0.2s ease;
         }
         .range-slider-track {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         opacity: 0;
         z-index: 4;
         }
         .range-labels {
         display: flex;
         justify-content: space-between;
         font-size: 14px;
         margin-bottom: 15px;
         }
         .benefit-output-box {
         border: 1px solid #ddd;
         border-radius: 10px;
         padding: 7px 10px 7px 10px;
         font-size: 20px;
         font-weight: bold;
         color: #333;
         background: #fff;
         }
         .benefit-output-box .small{
         font-weight: 500;
         font-size: 14px;
         margin-right:5px;
         }
         .benefit-output-box  #weightGet{
         font-weight: 900;
         font-size:16px;
         margin-top:0px;
         margin-right:5px;
         }
         .benefit-output-box  #amountGet{
         font-weight: 900;
         margin-top:0px;
         font-size:16px;
         margin-right:5px;
         }
         .benefit-output-box p{
         padding: 0px;
         margin: 0px 0px 5px 0px;
         /*transform: translateY(-50%);*/
         text-align: right;
         }
         .benefit-output-box p span{
         border-radius: 5px;
         padding: 3px 10px;
         font-weight: 800;
         background: green;
         color: white;
         }
         .benefit-output-box .benefit-text {
         font-size: 13px;
         color: grey;
         font-weight:600;
         /*text-align: right;*/
         margin-bottom:10px;
         margin-top:6px;
         }
         .benefit-output-box {
         text-align: right;
         font-weight:800;
         }
         .benefit-output-box .benefit-text span{
         font-size: 14px;
         color: green;
         font-weight:800;
         /*text-align: right;*/
         /*padding-left:11px;*/
         background:#dae8da;
         padding:0px 3px; 
         border-radius:6px;
         /*margin-right:10px;*/
         }
         .benefit-output-box .benefit-text #amountBenefit{
         }
         .btn-qty {
         background: #f36f21;
         color: #fff;
         font-weight: bold;
         border: none;
         width: 35px;
         height: 30px;
         line-height: 30px;
         text-align: center;
         border-radius: 6px;
         padding:0px;
         order: 1;
         /*margin-right: 8px;*/
         margin-top: 6px;
         }
         #weightDisplay, #amountDisplay {
         order: 1;
         font-family: 'Material Design Icons';
         width:95px;
         font-size:15px !important;
         color:black;
         font-weight:800 !important;;
         margin-top:13px;
         margin-bottom:13px;
         margin-right:5px;
         background:white;
         padding:10px 5px;
         border-radius:6px;
             border-bottom: 0px !important;
         }
         #weightDisplay  input{
         font-size:22px;
         color:black;
         font-weight:800;
         border:none;
         }
         #amountDisplay input{
         font-size:22px;
         color:black;
         font-weight:800;
         border:none;
         }
         .d-flex.align-items-center {
         display: flex;
         }
         .toheader {
         background: linear-gradient(135deg, #a80087, #d19b08);
         color: #fff;
         margin-top:5px;
         padding: 25px 10px 15px 10px;
         text-align: center;
         font-weight: 600;
         font-size: 1.25rem;
         }
         .card-box {
         background: #fff;
         border-radius: 12px;
         padding: 15px 15px 10px 15px;
         box-shadow: 0 3px 10px rgba(0,0,0,0.05);
         margin-bottom: 20px;
         }
         .highlight {
         color: #e67e22;
         font-weight: 600;
         font-size: 1.4rem;
         }
         .payment-section-area .paym-head h6{
         font-family: serif;
         font-style:italic;
         margin-top:0px;
         font-size: 17px;
         line-height:40px;
         }
         .payment-section-area .paym-head h6 strong{
         background: #c02822;
         color:white;
         padding:5px 10px;
         font-style: normal;
         font-size: 18px;
         }
         .paym-head h5 span{
         font-size: 21px;
         font-weight:900;
         color:black;
         }
         .payment-section-area .card-box h6{
         margin-top:0px;
         margin-bottom:0px;
         color:black;
         font-weight: 800;
         }
         .payment-section-area  .card-box h4{
         margin-top:0px;
         margin-bottom:0px;
         color:#c02822;
         font-weight: 900;
         font-size: 22px;
         }
         .payment-section-area  .card-box p{
         margin-top:0px;
         margin-bottom:0px;
         font-weight:800;
         padding:0px 0px 0px 15px;
         }
         .payment-section-area .cpay-img{
         margin-top:20px;
         }
         .payment-section-area .sec-pay{
         margin:15px 0px;
         }
         .payment-section-area  .wggt{
         border:2px solid #c0bdb5;
         padding: 5px 5px;
         border-radius:6px;
         background: 	#dfd0a8;
         }
         .payment-section-area  .wggt .tit{
         font-weight:800;
         transform: translateY(-50%);
         text-align: left;
         }
         .payment-section-area  .wggt .tit span{
         border-radius:50px;
         padding:5px 10px;
         font-weight:800;
         background: #ae1774;
         color:white;
         }
         .payment-section-area  .amt .tit span{
         border-radius:50px;
         padding:5px 10px;
         font-weight:800;
         background: #ae1774;
         color:white;
         }
         .payment-section-area  .amt .tit{
         font-weight:800;
         transform: translateY(-50%);
         text-align: left;
         }
         .payment-section-area .amt{
         border:2px solid #c0bdb5;
         padding: 5px 5px;
         border-radius:6px;
         background: 	#dfd0a8;
         }
         .btn-group-vertical {
         display: flex;
         flex-direction: column;
         gap: 5px;
         }
         .payment-section-area p strong{
         font-weight:800;
         }
         .m-0{
         margin:0px;
         font-weight:800;
         color:black;
         text-transform:uppercase;
         }
         .gold-card .card-im{
         margin-top:5px;
         text-align:center;
         }
         .py-head{
             padding:0px;
             margin:15px 0px 5px 0px;
             font-size:16px;
             font-weight:800;
         }
          .py-head strong{
         font-size:16px;
         font-weight:900;
         color:black;
         }
         .py-sub{
             font-weight:800;
             margin-top: 0px;
         }
         .py-sub strong{
             font-weight:900;
         }
         .py-subhd{
          font-weight:800;
          margin:20px 0px;
          padding-bottom:10px;
          font-size:16px;   
         }
          .py-subhd span{
         font-weight:900;
         font-size:16px;
          }
          .wggt .tit .osp{
              font-weight:500;
              padding:0px;
              font-size:14px;
          }
          .amt .tit .osp{
              font-weight:500;
              padding:0px;
              font-size:14px;
          }
          .ast .row .col {
   padding: 0px 1px;
          }