/* Reply Box on ForumsDetail.html */
.note-editor.note-frame.panel.panel-default {
    color: #ffffff;
    background-color: #252525; /* Replace with your desired color */
    border-radius: 10px; /* Rounds the corners */
  }
  /* Change the color of the buttons in the toolbar */
  .note-editor .note-toolbar .note-btn {
    color: #ff0000; /* Replace with your desired color */
    max-height: auto;
    max-width: 20px;
  }
  /* Change the background color of the Summernote toolbar */
  .note-editor .note-toolbar {
    background-color: #131415; /* Replace with your desired color */
  }
  
  /* Change the color of the buttons in the toolbar */
  .note-editor .note-toolbar .note-btn {
    color: #333; /* Replace with your desired color */
  }
  
  /* Change the background color of the buttons on hover */
  .note-editor .note-toolbar .note-btn:hover {
    background-color: #252525; /* Replace with your desired color */
  }

  .note-editor .note-editing-area .note-editable {
    outline: none;
    background-color: grey;
    color: white;
}

  .note-editor .note-editing-area .note-editable {
    outline: none;
    color: #ffffff;
    background-color: #252525; /* Replace with your desired color */
    border-radius: 10px;
}
  
  
  /* Change the background color of the editing area */
  .note-editor .note-editing-area .note-editable {
    background-color: #252525; /* Replace with your desired color */
    color: white;
  }
  .modal-dialog {
    max-width: 80%; /* Adjust the percentage as needed */
    width: 80%; /* Ensure it takes up the specified width */
    max-height: 80vh; /* Set a maximum height relative to the viewport height */
    height: auto; /* Allow the height to adjust to the content */
    margin: 1.75rem auto; /* Center the modal */
}

.modal-content {
    max-height: 95%; /* Set a maximum height relative to the viewport height */
    overflow-y: auto; /* Enable vertical scrolling if content exceeds the height */
    height: auto;
}
.note-editor.note-frame.panel.panel-default {
    color: #ffffff;
    background-color: #252525;
    border-radius: 10px;
    height: 100%;
}

.note-editor.note-frame.panel.panel-default {
    color: #ffffff;
    background-color: #252525;
    border-radius: 10px;
    height: 80%; /* Make the editor take up the full height of its container */
}

.note-editor .note-editing-area {
    height: auto; /* Allow the editing area to adjust to the content */
}

.note-editor .note-editing-area .note-editable {
    height: 350px; /* Set a minimum height for the editable area */
    min-height: 350px;
    outline: none;
    color: #ffffff;
    background-color: #252525;
    border-radius: 10px;
}
  /* Style for Forum Posts */
  
.container {
    width: 98%;
    height: fit-content;
    margin-right: 20px;
    margin-left: 10px;
}
.container, .container-fluid {
    max-width: 100% !important;
    display: 0;
}
.modal-footer {
    background-color: #444;
    color: #fff;
}

.navbar-collapse {
    max-width: 25%;
}

.navbar-brand {
    display: flex;
    align-items: center;
    height: 100px;

}

.nav-item {
    text-align: center;
}
  .navbar-nav {
      flex-direction: column;
      align-items: center;
  }
  .logo-img{
    max-width: 150px;
    max-height: 150px;
  }

  .navbar {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: auto;
    padding: 0 15px;
}

body {
    background-color: #333;
    color: #fff;
  }
  
  .navbar {
    background-color: #222;
  }
  .navbar-light .navbar-nav .nav-link {
    color: rgb(255, 255, 255);
  }
  .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {
    color: rgb(255, 255, 255);
  }
  .navbar-light .navbar-brand {
    color: #fff;
  }