  /* mobaile */
  
  @media (max-width:768px) {
      #hero .hero-info h2 {
          font-size: 22px;
          line-height: 2;
      }
      .navbar a,
      .navbar a:focus {
          font-size: 15px;
      }
      .navsub2 {
          font-size: 16px !important;
      }
      .img_client {
          width: 50%;
      }
      .counts .counters span {
          font-size: 30px;
      }
      #header {
          padding: 0 0;
      }
      .text_carousel {
          font-size: 25px;
      }
      .carousel-caption {
          right: 15%;
          left: 15%;
          top: 8.25rem;
          bottom: auto;
      }
      .img_carousel {
          max-width: 100%;
      }
      /* corcel */
       :root {
          --diameter: 100px;
      }
      .slider {
          width: 411px;
          height: 60vh;
      }
      .navbar-toggler {
          display: block !important;
      }
      .navbar-nav,
      .nav-right {
          display: none !important;
      }
      .container-nav {
          width: 100%;
          justify-content: space-around;
          margin: 0 10px;
          gap: 200px;
      }
      .sidepanel {
          width: 220px;
          height: 60vh;
      }
      .slider .list .item .content {
          top: 20%;
          right: 12%;
          text-align: center;
          grid-template-columns: 300px 200px;
      }
      .slider .list .item .content h2 {
          font-size: 2.5em;
          line-height: 1.1em;
      }
      .slider .list .item .content p {
          margin-top: 100px;
          font-size: 30px;
          text-align: left;
          padding-right: 20%;
          transform: translateY(-60px);
      }
      .arrrows {
          width: 80%;
          bottom: 100px;
      }
      /* corcel */


      .text_sm_center{
        text-align: center;
    }
    .text_sm_hidden {
        display: none;
      }

    
  }