  /* for chat box  */
  .chatbox {
      width: 100%;
      max-height: 700px;
      height: 600px;
      border: 1px solid #ddd;
      border-radius: 10px;
      display: flex;
      flex-direction: column;
      background: #f8f8f8;
      font-family: Arial, sans-serif;
      overflow: hidden;
  }

  .chat-header {
      background: #075E54;
      color: white;
      padding: 10px;
      font-weight: bold;
      text-align: center;
  }

  .chat-messages {
      flex: 1;
      padding: 10px;
      overflow-y: auto;
      background: #e5ddd5;
  }

  .chat-message {
      margin: 5px 0;
      display: flex;
  }

  /* Other member message */
  .chat-message .member-bubble {
      background: #fff;
      padding: 8px 12px;
      border-radius: 8px;
      max-width: 100%;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
      align-self: flex-start;
      position: relative;
  }

  .message-time {
      position: absolute;
      padding: 2px;
      bottom: 5px;
      right: 2px;
      /* background-color: red; */
      height: 12px;
      width: 60px;
      font-size: 11px;
  }

  .membermessage .message-date {
      position: absolute;
      padding: 2px;
      top: 1px;
      right: 5px;
      /* background-color: red; */
      height: 12px;
      width: 60px;
      font-size: 11px;
  }

  .membermessage .messagetoogle {
      position: absolute;
      padding: 2px;
      top: 10px;
      right: 5px;
      display: none;
  }

  .member-bubble:hover .messagetoogle {
      display: block;
  }

  .my-bubble:hover .messagetoogle {
      display: block;
  }

  .membermessage .dropdown-toggle::after {
      display: none !important;
  }

  /* My message */
  .chat-message.user {
      justify-content: flex-end;
  }

  .my-bubble {
      background: #dcf8c6;
      padding: 8px 12px;
      border-radius: 8px;
      max-width: 100%;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
      align-self: flex-end;
      position: relative;
  }

  .chat-input {
      display: flex;
      border-top: 1px solid #ddd;
      background: white;
  }

  .chat-input input {
      flex: 1;
      border: none;
      padding: 10px;
      font-size: 14px;
  }

  .chat-input button {
      background: #075E54;
      color: white;
      border: none;
      padding: 10px 15px;
      cursor: pointer;
  }

  .chat-input input:focus {
      outline: none;
  }

  /* for management message  */
  .management-header {
      padding: 15px;

  }

  .management-header h2 {
      font-family: Arial, Helvetica, sans-serif;
      text-align: left;
      text-transform: uppercase !important;
      color: #099cf4;
  }

  .management-img img {
      max-height: 400px;
      height: 350px;
      width: 100%;
      padding: 10px
  }

  .managment-details .name {
      font-size: 20px;
      padding-top: 10px;
      font-weight: 700;
  }

  .managment-details h5 {
      font-size: 15px;
      padding-top: 10px;
      font-weight: 700;
  }

  .managment-details h6 {
      font-size: 15px;
      padding-top: 5px;
      font-weight: 600;
  }

  /* end  */

  .no-radius {
      border-radius: 0 !important;
      margin-bottom: 1px;
  }

  .form-control.custominput {
      height: 20px;
      font-size: 12px;
  }

  .form-check-input:focus {
      box-shadow: none !important;
      outline: none !important;
  }

  .customselect {
      height: 20px;
      font-size: 12px;
      padding: 0 5px;
  }

  .form-select:focus {
      box-shadow: none !important;
      outline: none !important;
  }

  /* Focus border/shadow remove */
  .custominput:focus {
      border-color: #ced4da !important;
      box-shadow: none !important;
      outline: none !important;
  }

  /* for member section  */
  .member-card {
      display: flex;
      background: #fff;
      padding: 10px;
      border-radius: 10px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
      gap: 10px;
  }

  .member-img img {
      height: 70px;
      width: 65px;
      object-fit: contain;
      border-radius: 10px;
  }

  .member-img:hover img {
      transform: scale(1.2);

  }

  .member-info {
      font-size: 10px;
      overflow: hidden;
  }

  .member-name {
      font-size: 12px;
      margin-bottom: 2px;
      font-weight: 600;
  }

  .designation,
  .company,
  .phone {
      margin: 0;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
  }

  .loginsection.coursedes p {
      margin-bottom: 0px;

  }

  /* for header drop down  */
  .dropdown-toggle::after {
      display: none !important;
  }

  .notice-img {
      max-width: 100%;
      height: 100px;
      object-fit: contain;
      float: left;
  }

  @media (max-width: 1100px) {
      .custom-col {
          flex: 0 0 100% !important;
          max-width: 100% !important;
          margin-bottom: 5px;
      }

      .card-col {
          order: 2;
      }

      .slider-col {
          order: 1;
      }
  }


  @media (max-width:1200px) {
      .loginsection {
          margin-right: 40px !important;
      }

  }