#nprogress .bar {
  background: red !important;
  height: 3px !important;
}

#nprogress .peg {
  box-shadow: 0 0 10px red, 0 0 5px red !important;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  color: red;
  font-size: 12px;
}

.post-content {
  margin: 0;
}

.posts-container {
  height: 110dvh;
}

.btn-post,
.highlight {
  background-color: red;
}
.alert,
.btn-post {
  border-radius: 10px;
}
.tooltip-box .tooltip-remove-img-btn,
.tooltip-box .tooltip-text {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
  text-align: center;
  z-index: 1;
}
.tags-container {
  scrollbar-width: none;
}
html {
  scrollbar-width: thin;
}
.post-external-link a,
.tags-container span {
  font-size: 14px;
  text-decoration: none;
  user-select: none;
}
#current_image,
.addon-check,
.characters-limit,
.navbar-brand,
.post img,
.post-header,
.tags-container,
.tags-container span,
.text-muted,
.toast-container,
.tooltip-remove-img-btn,
label {
  user-select: none;
}
:focus {
  outline: 0;
}
.already-access:hover,
.post-menu-dropdown-list span:hover {
  color: #8b0000;
}
.highlight {
  color: #fff;
}
html {
  -ms-overflow-style: none;
}
body,
pre {
  font-family: Arial, Helvetica, Lato, sans-serif;
}
.container {
  max-width: 540px;
}
.post-bottom-row {
  margin-top: 10px;
}
.btn-post {
  color: #fff;
  padding: 1px 15px;
  transition: 0.2s, color 0.1s;
}
.input-tags,
.tooltip-text input {
  background-color: transparent;
  color: #fff;
}
.btn-change-modal:active,
.btn-change-modal:hover,
.btn-post:active,
.btn-post:hover,
.zoom-icon:hover {
  background-color: #8b0000;
}
.input-tags {
  border: none;
  border-bottom: 1px solid red;
}
.tooltip-box {
  font-size: 18px;
  position: relative;
  display: inline-block;
}
.tooltip-box .tooltip-text {
  width: 120px;
  background-color: #555;
  color: #fff;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  bottom: 110%;
  left: 50%;
  margin-left: -60px;
}
.tooltip-box .tooltip-remove-img-btn {
  width: 3ch;
  background-color: #222;
  color: red;
  border-radius: 100%;
  border: none;
  padding: 2px 0;
  position: absolute;
  bottom: 125%;
  right: -85px;
  text-decoration: none;
  cursor: pointer;
}
.tooltip-text input {
  width: 80%;
  border: none;
}
.tooltip-box .tooltip-text::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent;
}
.tooltip-text ::file-selector-button {
  width: 0.01px;
  margin: 0;
  padding: 0;
  overflow: clip;
  border: none;
  background-color: red;
  color: #555;
}
.characters-limit {
  position: absolute;
  right: 12px;
  bottom: 5px;
  color: gray;
}
.addon-check {
  position: absolute;
  bottom: 17px;
  right: -5px;
  padding: 0 3px;
  background-color: #999;
  border-radius: 100%;
  text-align: center;
  font-size: 8px;
}
.tags-container {
  margin-top: 5px;
  overflow: scroll;
  white-space: nowrap;
  -ms-overflow-style: none;
}
.tags-container::-webkit-scrollbar {
  display: none;
}
.tags-container span {
  font-weight: 500;
  /* cursor: pointer; */
  /* border-radius: 10px; */
  font-size: 15px;
  pad: 0.3em 0.5em;
  background-color: red;
  color: #fff;
}
.search-bar::placeholder {
  color: #bbb !important;
}
.post {
  padding: 15px 20px;
  border-radius: 10px;
  margin-bottom: 10px;
}
.post-external-link {
  text-decoration: none;
  display: block;
}
.post-external-link a {
  color: red;
}
.post pre {
  white-space: break-spaces;
  font-size: 16px;
  word-break: break-word;
  /* line-height: 20px; */
}
.post-img-container {
  position: relative;
  width: 100%;
  max-height: 250px;
  margin-bottom: 7px;
  margin-top: 3px;
}
.post-img-overlay,
.zoom-icon {
  opacity: 0;
  position: absolute;
  cursor: pointer;
  transition: 0.2s;
}
.post img {
  object-fit: cover;
  width: 100%;
  max-height: 250px;
  transition: 0.2s;
}
.post-img-overlay {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  background-color: #000;
}
.post-img-container:hover .post-img-overlay {
  opacity: 0.7;
}
.post-img-container:hover .zoom-icon {
  opacity: 0.9;
}
.zoom-icon {
  color: #fff;
  font-size: 20px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  background-color: red;
  border-radius: 100%;
  padding: 4px 10px;
}
.post-header {
  position: relative;
  color: gray;
}
.post-menu {
  cursor: pointer;
  border-radius: 100%;
  padding: 0 5px;
}
.post-menu:hover {
  background-color: #444;
  transition: 0.2s;
}
.post-menu:active {
  background-color: #333;
}
.post-menu-dropdown-list {
  /* box-shadow: 1px 1px #111; */
  z-index: 1;
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background-color: #222;
  border-top: none;
  padding: 10px 12px;
  border-radius: 10px;
}
.clear-search,
.clear-search-tags {
  z-index: 10;
  pointer-events: auto;
  cursor: pointer;
}
.post-menu-dropdown-list span {
  display: block;
  color: red;
  cursor: pointer;
  font-size: 16px;
}
.sort-posts-by-date {
  cursor: pointer;
}
.post-date {
  font-size: 14px;
}
.fixed-button-create {
  z-index: 10;
  display: none;
  border-radius: 100%;
  background-color: #8b0000;
  padding: 17px;
  position: fixed;
  bottom: 10px;
  border: none;
  right: 10px;
}
.fixed-button-create:hover {
  background-color: #690000;
}
.fixed-button-create i {
  color: red;
  font-size: 30px;
}
@media (max-width: 768px) {
  .fixed-button-create {
    display: block;
  }
}
.clear-search {
  display: none;
  right: 20px;
  top: 9px;
  background-color: gray;
  border-radius: 100%;
  padding: 3px 8px;
  font-size: 12px;
  color: #555;
}
.clear-search-tags {
  top: 0;
  right: -5px;
  color: red;
}
.clear-search-tags i {
  padding: 5px 7px;
  border-radius: 100%;
  background-color: #222;
}
::-ms-clear {
  display: none;
}
.btn-change-modal {
  background-color: red;
  transition: 0.2s;
}
#current_image {
  text-decoration: none;
  color: red;
}
.temporarily_disabled {
  background-color: #000;
}
.read-more {
  cursor: pointer;
  text-decoration: none;
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  border-radius: 0.375rem;
  background-clip: border-box;
}

.card-body {
  padding: 1.5rem;
  flex: 1 1 auto;
}

.card-title {
  margin-bottom: 1.25rem;
}

.icon {
  width: 3rem;
  height: 3rem;
}

.icon i {
  font-size: 2.25rem;
}

.icon-shape {
  display: inline-flex;
  padding: 12px;
  text-align: center;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
}

.icon-shape i {
  font-size: 1.25rem;
}

@media (max-width: 600px) {
  .tooltip-box .tooltip-text:last-child {
    left: 40px;
  }
  .tooltip-box .tooltip-text:last-child::after {
    left: 25%;
  }
}

.post-footer {
  display: flex;
  justify-content: space-between;
  align-items: end;
}

.tags-container {
  margin-right: 10px;
}
.edit-content-limit {
  color: gray;
}
.post-content code {
  font-family: Consolas,"courier new";
  color: crimson !important;
  background-color: #f1f1f1;
  border-radius: 5px;
  padding: 2px;
  display: table;
  word-break: break-word;
}
.post-content a {
  text-decoration: none;
  color: red;
}
#edit_content{
 scrollbar-width: thin;
}

.posts-info {
 font-size: .9rem;
}

.search-bar {
 font-size: .9rem;
}

.dropdown-search {
 font-size: .9rem;
}

.dropdown-button {
 font-size: .9rem;
}

.clear-search-tags {
 visibility: hidden;
}