.Layout8-master {
  width: 100vw;
  height: 100vh;
  background-color: #fff !important;
  padding: 1rem 1rem;
  font-family: 'Gilroy' !important;

  .boxCount-main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    background-color: #f3f3f4;
    border: 1px solid #00000030;
    height: 110px;
    padding: 10px 10px;
    border-radius: 10px;
    cursor: pointer;
  }

  .boxCount {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: space-between;

    > div:nth-child(1) {
      font-size: 12px;
      font-weight: 500;
      letter-spacing: 1px;
    }

    > div:nth-child(2) {
      font-size: 30px;
      font-weight: 600;
      letter-spacing: 0.5px;
    }
  }

  .boxCount-add-min {
    display: flex;
    flex-direction: column;
    justify-content: space-around;

    > div:nth-child(1) {
      background-color: #28aa3a;
      width: max-content;
      padding: 0px 10px;
      color: #fff;
      font-size: 28px;
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
      cursor: pointer;
    }

    > div:nth-child(2) {
      background-color: #ff7676;
      width: max-content;
      padding: 0px 10px;
      color: #fff;
      font-size: 28px;
      border-bottom-left-radius: 6px;
      border-bottom-right-radius: 6px;
      cursor: pointer;
    }
  }

  .rangeslider-div {
    width: 100%;
  }

  .dialpad-layout8-main {
    display: grid;
    grid-template-rows: repeat(4, 1fr);
    grid-auto-flow: column;
    gap: 1rem;
    width: 100%;
    padding: 2rem 2rem 2rem 1.5rem;
    justify-content: space-between;
    overflow: hidden !important;

    > div:nth-child(1) {
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px;
    }

    > div:nth-child(2) {
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px;
    }

    > div:nth-child(3) {
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px;
    }

    > div:nth-child(4) {
      border-top-left-radius: 8px;
      border-bottom-left-radius: 8px;
    }

    > div:nth-child(12) {
      border-top-right-radius: 8px;
      border-bottom-right-radius: 8px;
    }

    > div:nth-child(11) {
      border-top-right-radius: 8px;
      border-bottom-right-radius: 8px;
    }

    > div:nth-child(10) {
      border-top-right-radius: 8px;
      border-bottom-right-radius: 8px;
    }

    > div:nth-child(9) {
      border-top-right-radius: 8px;
      border-bottom-right-radius: 8px;
    }
  }

  .dialpadNo {
    background-color: #fff;
    // border: 1px solid #CCEAF0;
    text-align: center;
    padding: 10px 8px;
    font-size: 32px;
    font-weight: 500;
    cursor: pointer;
    // color: rgba(0, 0, 0, 0.8470588235);
    color: #000;
    width: 95px;
  }

  .modal-content-pozo {
    background-color: #000 !important;
  }

  .material-symbols-outlined {
    background-color: #000 !important;

    svg {
      color: #fff !important;
    }
  }

  .dialpad-inputvaluue {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: center;
    color: #fff;

    div {
      font-size: 32px;
      font-weight: 500;
      width: 100%;
      text-align: center;
    }
  }

  .dialpad-btn {
    display: flex;
    width: 100%;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 0rem 2rem;

    div {
      width: 100%;
      text-align: center;
      padding: 16px 58px;
      background-color: #28aa3a;
      border-radius: 6px;
      cursor: pointer;
      font-size: 16px;
      color: #fff;
      font-weight: 600;
      letter-spacing: 0.5px;
      text-transform: uppercase;
    }
  }
}