 html {
  scroll-behavior: smooth;
}
 .sliderx {
      max-width: 100%;
      width: 100%;
      height: auto;
      position: relative;
      overflow: hidden;
      border-radius: 12px;
  }

  .slidex {
      width: 100%;
      display: none;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      padding: 20px;
      box-sizing: border-box;
      background-color: #fff;
      animation: fade 1s ease-in-out;
  }

  .slidex.active {
      display: flex;
      display: flex;
      justify-content: space-around;
  }

  .slidex img {
      width: 300px;
      max-width: 100%;
      height: auto;
      border-radius: 10px;
  }

  .text-box {
      min-width: 250px;
      margin: 10px;
  }

  .text-box h2 {
      font-size: 40px;
      margin-bottom: 10px;
      font-weight: bold;
      color: #FF725E;
  }

  .text-box p {
      font-size: 16px;
      color: #666;
  }

  .dots {
      position: absolute;
      bottom: 15px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 10px;
  }

  .dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background-color: #ccc;
      cursor: pointer;
  }

  .dot.active {
      background-color: #333;
  }

  .panel-slider {
      display: flex;
      justify-content: center;
  }

  .Navba-home {
      padding: 25px;
  }

  .page-welcom {
      display: flex;
      justify-content: space-around;

  }

  .toman {
      font-size: 10px;
  }

  .slidserveis {
      height: 195px;
      margin-top: 10px;
      display: flex;
      justify-content: center;
  }

  .serveis {
      width: 100%;
      height: 100px;
      text-align: center;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
  }

  .slidserveis .bod {
      width: 300px;
      height: 100px;
      margin-top: 80px;
      float: right;
      margin: 40px;
  }

  .serveis a {
      width: 80px;
      margin-top: 120px;
      margin-right: -128px;
      text-decoration: none;
      background: #ffffff;
      padding: 5px;
      border-radius: 20px;
  }

  .btred {
      background-color: #ffffff;
      border: #FF725E 1px solid;
      color: #FF725E;
  }

  .btred:hover {
      background: #FF725E;
      color: white;
  }

  .red {
      background-color: #FF725E;
  }

  .textred {
      color: #FF725E;
  }

  .circle {
      width: 164px;
      height: 100px;
      background: rgb(255, 255, 255);
      border-top-right-radius: 100px;
      float: left;
      margin-top: 42px;
  }

  .circle img {
      margin-top: 5px;
      width: 145px;
      float: left;
  }

  .serveis label {
      color: #ffffff;
      font-size: 15px;
      float: right;
      margin: 20px;

  }

  .gard {
      padding: 30px;
      float: right;
      margin-left: auto;
      margin-right: auto;
  }

  .expertises {
      font-size: 12px;
  }

  fieldset {
      width: 100%;
      text-align: right;
  }

  legend {
      padding-right: 18px;
      padding-bottom: 10px;
  }

  @media screen and (max-width: 1105px) {
      .slidserveis .bod {
          width: 300px;
          height: 100px;
          margin-top: 80px;
          float: right;
          margin: 10px;
      }
  }

  @media screen and (max-width: 800px) {
      .textwelcom {
          width: 267px;
          margin-right: 35px;
          margin-top: 55px;
          text-align: right;
      }

      .textwelcom h1 {
          font-size: 40px;
      }

      .discerption {
          font-size: 18px;
          color: #777777;
          margin-top: 30px;
          margin-right: 5px;
          width: 300px;
          line-height: 35px;
          text-align: right;

      }

      .imgwelcom {
          float: none;
          width: 300px;
          margin-left: 0px;
      }

      .slidserveis {
          display: block;
      }

      .slidserveis .bod {

          width: 45%;
          height: 150px;
          margin-top: 20px;
      }

      .serveis {
          text-align: center;
          border-radius: 10px;
      }
  }

  @media screen and (max-width: 640px) {
      .page-welcom {
          display: flex;
          flex-direction: column;
          align-items: flex-start;
          margin-right: 50px;
      }

      .imgwelcom {
          width: 100%;
      }

      .slidserveis .bod {
          width: 90%;
          height: 150px;
          margin-top: 20px;
          margin-right: 5%;
      }

      .menu {
          display: inline-block;
      }

      .textwelcom {

          margin-top: auto;
      }

      @media screen and (max-width: 460px) {
          .textwelcom h1 {
              font-size: 25px;
          }

          .sliddocter {
              display: grid;
              float: none;
          }

          .page-welcom {
              margin: 5px;
          }
      }
  }

  

  @keyframes fade {
      from {
          opacity: 0;
      }

      to {
          opacity: 1;
      }
  }

  .sliderx {
      max-width: 100%;
      width: 100%;
      height: auto;
      position: relative;
      overflow: hidden;
      border-radius: 12px;
  }

  .slidex {
      width: 100%;
      display: none;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      padding: 20px;
      box-sizing: border-box;
      background-color: #fff;
      animation: fade 1s ease-in-out;
  }

  .slidex.active {
      display: flex;
      display: flex;
      justify-content: space-around;
  }

  .slidex img {
      width: 300px;
      max-width: 100%;
      height: auto;
      border-radius: 10px;
  }

  .text-box {
      min-width: 250px;
      margin: 10px;
  }

  .text-box h2 {
      font-size: 40px;
      margin-bottom: 10px;
      font-weight: bold;
      color: #FF725E;
  }

  .text-box p {
      font-size: 16px;
      color: #666;
  }

  .dots {
      position: absolute;
      bottom: 15px;
      left: 50%;
      transform: translateX(-50%);
      display: flex;
      gap: 10px;
  }

  .dot {
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background-color: #ccc;
      cursor: pointer;
  }

  .dot.active {
      background-color: #333;
  }

  @keyframes fade {
      from {
          opacity: 0;
      }

      to {
          opacity: 1;
      }
  }

  @media (max-width: 600px) {
      .slidex {
          flex-direction: column;
          text-align: center;
      }

      .slidex img {
          margin-bottom: 15px;
      }

      .text-box h2 {
          font-size: 20px;
      }

      .text-box p {
          font-size: 14px;
      }
  }