/*your custom css goes here*/ 
.qpay-button{
    display: none;
}
@media only screen and (max-width: 600px) {
    .qpay-button{
        display: block;
    }
}

.storepay{
    background: #2750cc;
}

.pocket{
    background: #e72d52;
}


.titlePocket {
    font-weight: 400;
    color: #4b4b4d;
    font-size: medium;
  }
  
  .pocket-option {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
  }
  
  .pocket-option-1 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
  }
  
  .labl > input {
    /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
  }
  .labl > input + div {
    /* DIV STYLES */
    cursor: pointer;
    display: flex;
    padding: 7px;
    background-color: #dadae2;
    border-radius: 7px;
  }
  .labl > input:checked + div {
    /* (RADIO CHECKED) DIV STYLES */
    background-color: #ec3155;
    color: white;
  }
  
  .labl-2 > input {
    /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
  }
  .labl-2 > input + div {
    /* DIV STYLES */
    cursor: pointer;
    display: flex;
    padding: 7px;
    background-color: transparent;
    border-radius: 7px;
  }
  
  .pocket-3x {
    cursor: pointer;
    display: flex;
    padding: 7px;
    background-color: #dadae2;
    border-radius: 7px;
  }
  
  .pocket-divide-title {
    font-weight: 500;
    font-size: medium;
  }
  
  .pocket-circle {
    width: 8px;
    height: 8px;
    background-color: white;
    border: 1px solid white;
    border-radius: 100%;
  }
  
  .pocket-help-list {
    list-style: outside;
    padding-left: 6px;
    position: relative;
  }
  
  .pocket-card {
    padding: 20px 25px;
    border: 1px solid rgba(118, 119, 120, 0.3);
    border-radius: 10px;
  }
  
  .pocket-help-list:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 7px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 10px;
  }
  
  .pocket-help-list li {
    padding-left: 5px;
    font-weight: 400;
  }
  
  .pocket-help-list li::marker {
    content: "\2022";
    color: rgba(255, 0, 0, 0.5);
    font-weight: bold;
    display: inline-block;
    width: 5px;
    position: absolute;
    top: 0;
    left: 0;
  }
  
  .title2Pocket {
    font-size: 15px;
    color: #4b4b4d;
  }
  .videoPocket {
    font-size: 15px;
    margin-bottom: 0rem;
    color: #4485fd;
  }

  @media (max-width: 575px) {
    .modal-pocket{
        position: relative;
        top: 50px;
        height: 140%;
        float:right;
        max-width: 100%;
        width: 100%;
    }
    .modal-pocket-title {
        display: none;
    }
    .modal-body {
        padding: 10px !important;
    }
    .pocket-option-1 {
        grid-template-columns: repeat(2, 1fr);
    }
    .pocket-option {
        grid-template-columns: repeat(2, 1fr);
        gap: 1px;
    }
    .pocket-option img {
        height: 35px;
        width: 35px;
    }
    .pocket-option span {
        font-size: small;
    }
    .pocket-3x-content img {
        height: 20px;
        width: 20px;
    }
    .pocket-3x-content .pocket-3x {
        flex-direction: column;
    }
    .pocket-3x-content .pocket-3x div {
        display: flex;
        justify-content: center;
    }
    .pocket-3x-content span {
        font-size: small !important;
    }
    .modal-pocket-footer {
        font-size: small !important;
    }
    .modal-pocket-footer img {
        height: 20px !important;
        width: 60px !important;
    }
    .p1 {
        display: inline-block;
        padding-left: 10px;
        padding-top: 18px;
      }
      .p1 :first-child{
        vertical-align: none;
      }
      .p2 {
        font-size: 12px;
        display: inline-block;
        padding-left: 10px;
        width: 69.5%;
          vertical-align: -webkit-baseline-middle;
      }

      .titleP{
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          overflow: hidden;
      }
}
@media screen and (max-height: 800px) and (max-width: 575px) {
    .titlePocket{
        font-weight: 0;
        font-size: 18px;
        color: #4B4B4D;
        margin-bottom: 10px;

    }
    .title2Pocket{
        font-size: 13px;
        margin-bottom: 0rem;
        /* үндсэн grey */

        color: #4B4B4D;

    }
    .videoPocket{
        font-size: 13px;
        margin-bottom: 0rem;
        color: #4485FD;
        text-align: left;
    }
}