@import url("../fonts/displayfonts.css");
html {
  font-size: 62.5% !important;
}
@media only screen and (min-width: 2560px) {
  html {
    font-size: 64% !important;
  }
}
@media only screen and (max-width: 1200px) {
  html {
    font-size: 60% !important;
  }
}
@media only screen and (max-width: 900px) {
  html {
    font-size: 58% !important;
  }
}
@media only screen and (max-width: 600px) {
  html {
    font-size: 56% !important;
  }
}

.he-editor {
  width: 100%;
}
.he-editor .note-editor .note-editable {
  font-family: sans-serif !important;
  /* Replace with your desired font */
}

*:focus {
  outline: none;
}

.top-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: auto;
  z-index: 10;
  padding: 10px;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.8);
  box-shadow: 0 0 4px #000;
  box-sizing: border-box;
  color: #ccc;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}

#version {
  width: 300px;
  margin: 0px auto;
  font-size: small;
  color: #333;
  font-style: italic;
  text-align: center;
}

#container {
  width: 960px;
  margin: 90px auto;
}

.github-link {
  z-index: 100;
  position: absolute;
  top: 0;
  right: 0;
  border: 0;
}

.medium-editor-element,
.summernote-editor,
.note-editable,
.thank-message,
.detail-content {
  font-family: Arial !important;
  font-size: 1.6rem;
  line-height: 1.55 !important;
  color: #050505;
  padding: 0;
  margin: 0;
  font-weight: 400 !important;
}
.medium-editor-element img,
.summernote-editor img,
.note-editable img,
.thank-message img,
.detail-content img {
  max-width: 100% !important;
}
.medium-editor-element *,
.summernote-editor *,
.note-editable *,
.thank-message *,
.detail-content * {
  float: none !important;
  word-break: break-word !important;
  word-wrap: break-word !important;
  white-space: word-wrap !important;
  max-width: 100dvw !important;
}
.medium-editor-element li,
.summernote-editor li,
.note-editable li,
.thank-message li,
.detail-content li {
  overflow-x: unset !important;
  overflow-y: unset !important;
}
.medium-editor-element .popup,
.summernote-editor .popup,
.note-editable .popup,
.thank-message .popup,
.detail-content .popup {
  height: 0px !important;
  display: none;
}
.medium-editor-element .image-resizable .popup,
.summernote-editor .image-resizable .popup,
.note-editable .image-resizable .popup,
.thank-message .image-resizable .popup,
.detail-content .image-resizable .popup {
  height: auto !important;
  display: block;
}
.medium-editor-element .medium-insert-embeds,
.summernote-editor .medium-insert-embeds,
.note-editable .medium-insert-embeds,
.thank-message .medium-insert-embeds,
.detail-content .medium-insert-embeds {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.medium-editor-element pre,
.summernote-editor pre,
.note-editable pre,
.thank-message pre,
.detail-content pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}
.medium-editor-element .table,
.summernote-editor .table,
.note-editable .table,
.thank-message .table,
.detail-content .table {
  border-collapse: collapse;
  width: 100% !important;
  overflow-x: auto;
  border: 0.1rem solid #6c6868;
}
.medium-editor-element .table th,
.summernote-editor .table th,
.note-editable .table th,
.thank-message .table th,
.detail-content .table th {
  border: 1px solid #6c6868;
  padding: 5px 3px;
}
.medium-editor-element .table th *,
.summernote-editor .table th *,
.note-editable .table th *,
.thank-message .table th *,
.detail-content .table th * {
  white-space: nowrap;
}
.medium-editor-element .table td,
.summernote-editor .table td,
.note-editable .table td,
.thank-message .table td,
.detail-content .table td {
  border: 1px solid #6c6868;
  padding: 5px 3px;
}
.medium-editor-element .table td *,
.summernote-editor .table td *,
.note-editable .table td *,
.thank-message .table td *,
.detail-content .table td * {
  white-space: nowrap;
}
.medium-editor-element .post-text-box,
.summernote-editor .post-text-box,
.note-editable .post-text-box,
.thank-message .post-text-box,
.detail-content .post-text-box {
  padding: 0px 0.5rem;
}
.medium-editor-element p,
.summernote-editor p,
.note-editable p,
.thank-message p,
.detail-content p {
  color: inherit !important;
  line-height: 1.55 !important;
  font-weight: 400 !important;
}
.medium-editor-element i,
.summernote-editor i,
.note-editable i,
.thank-message i,
.detail-content i {
  color: inherit !important;
}
.medium-editor-element i:hover,
.summernote-editor i:hover,
.note-editable i:hover,
.thank-message i:hover,
.detail-content i:hover {
  color: inherit !important;
}
.medium-editor-element h1,
.summernote-editor h1,
.note-editable h1,
.thank-message h1,
.detail-content h1 {
  font-size: 2.5rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h1 *,
.summernote-editor h1 *,
.note-editable h1 *,
.thank-message h1 *,
.detail-content h1 * {
  font-size: inherit !important;
}
.medium-editor-element h1 i,
.summernote-editor h1 i,
.note-editable h1 i,
.thank-message h1 i,
.detail-content h1 i {
  color: inherit;
}
.medium-editor-element h1 i b,
.summernote-editor h1 i b,
.note-editable h1 i b,
.thank-message h1 i b,
.detail-content h1 i b {
  color: inherit;
}
.medium-editor-element h2,
.summernote-editor h2,
.note-editable h2,
.thank-message h2,
.detail-content h2 {
  font-size: 2rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h2 *,
.summernote-editor h2 *,
.note-editable h2 *,
.thank-message h2 *,
.detail-content h2 * {
  font-size: inherit !important;
}
.medium-editor-element h2 i,
.summernote-editor h2 i,
.note-editable h2 i,
.thank-message h2 i,
.detail-content h2 i {
  color: inherit;
}
.medium-editor-element h2 i b,
.summernote-editor h2 i b,
.note-editable h2 i b,
.thank-message h2 i b,
.detail-content h2 i b {
  color: inherit;
}
.medium-editor-element h3,
.summernote-editor h3,
.note-editable h3,
.thank-message h3,
.detail-content h3 {
  font-size: 1.8rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h3 *,
.summernote-editor h3 *,
.note-editable h3 *,
.thank-message h3 *,
.detail-content h3 * {
  font-size: inherit !important;
}
.medium-editor-element h3 i,
.summernote-editor h3 i,
.note-editable h3 i,
.thank-message h3 i,
.detail-content h3 i {
  color: inherit;
}
.medium-editor-element h3 i b,
.summernote-editor h3 i b,
.note-editable h3 i b,
.thank-message h3 i b,
.detail-content h3 i b {
  color: inherit;
}
.medium-editor-element h4,
.summernote-editor h4,
.note-editable h4,
.thank-message h4,
.detail-content h4 {
  font-size: 1.6rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h4 *,
.summernote-editor h4 *,
.note-editable h4 *,
.thank-message h4 *,
.detail-content h4 * {
  font-size: inherit !important;
}
.medium-editor-element h4 i,
.summernote-editor h4 i,
.note-editable h4 i,
.thank-message h4 i,
.detail-content h4 i {
  color: inherit;
}
.medium-editor-element h4 i b,
.summernote-editor h4 i b,
.note-editable h4 i b,
.thank-message h4 i b,
.detail-content h4 i b {
  color: inherit;
}
.medium-editor-element h5,
.summernote-editor h5,
.note-editable h5,
.thank-message h5,
.detail-content h5 {
  font-size: 1.4rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h5 *,
.summernote-editor h5 *,
.note-editable h5 *,
.thank-message h5 *,
.detail-content h5 * {
  font-size: inherit !important;
}
.medium-editor-element h5 s i,
.summernote-editor h5 s i,
.note-editable h5 s i,
.thank-message h5 s i,
.detail-content h5 s i {
  color: inherit;
}
.medium-editor-element h5 s i b,
.summernote-editor h5 s i b,
.note-editable h5 s i b,
.thank-message h5 s i b,
.detail-content h5 s i b {
  color: inherit;
}
.medium-editor-element h6,
.summernote-editor h6,
.note-editable h6,
.thank-message h6,
.detail-content h6 {
  font-size: 1.2rem !important;
  font-weight: bold;
  margin: 1.5rem 0;
}
.medium-editor-element h6 *,
.summernote-editor h6 *,
.note-editable h6 *,
.thank-message h6 *,
.detail-content h6 * {
  font-size: inherit !important;
}
.medium-editor-element h6 i,
.summernote-editor h6 i,
.note-editable h6 i,
.thank-message h6 i,
.detail-content h6 i {
  color: inherit;
}
.medium-editor-element h6 i b,
.summernote-editor h6 i b,
.note-editable h6 i b,
.thank-message h6 i b,
.detail-content h6 i b {
  color: inherit;
}
.medium-editor-element p,
.summernote-editor p,
.note-editable p,
.thank-message p,
.detail-content p {
  margin: 1.5rem 0;
}
.medium-editor-element a,
.summernote-editor a,
.note-editable a,
.thank-message a,
.detail-content a {
  color: #007bff !important;
  text-decoration: none;
}
.medium-editor-element a i,
.summernote-editor a i,
.note-editable a i,
.thank-message a i,
.detail-content a i {
  color: inherit;
}
.medium-editor-element a i b,
.summernote-editor a i b,
.note-editable a i b,
.thank-message a i b,
.detail-content a i b {
  color: inherit;
}
.medium-editor-element a b,
.summernote-editor a b,
.note-editable a b,
.thank-message a b,
.detail-content a b {
  color: inherit;
}
.medium-editor-element a b i,
.summernote-editor a b i,
.note-editable a b i,
.thank-message a b i,
.detail-content a b i {
  color: inherit;
}
.medium-editor-element a *,
.summernote-editor a *,
.note-editable a *,
.thank-message a *,
.detail-content a * {
  color: inherit !important;
}
.medium-editor-element a:hover,
.summernote-editor a:hover,
.note-editable a:hover,
.thank-message a:hover,
.detail-content a:hover {
  text-decoration: underline;
}
.medium-editor-element ol,
.summernote-editor ol,
.note-editable ol,
.thank-message ol,
.detail-content ol {
  list-style-type: decimal;
  margin: 1.5rem 0;
  padding-left: 4rem;
}
.medium-editor-element ul,
.summernote-editor ul,
.note-editable ul,
.thank-message ul,
.detail-content ul {
  list-style-type: disc;
  margin: 1.5rem 0;
  padding-left: 4rem;
}
.medium-editor-element li,
.summernote-editor li,
.note-editable li,
.thank-message li,
.detail-content li {
  margin: 0.5rem 0;
  list-style-position: initial !important;
}
.medium-editor-element blockquote i:hover,
.summernote-editor blockquote i:hover,
.note-editable blockquote i:hover,
.thank-message blockquote i:hover,
.detail-content blockquote i:hover {
  color: inherit !important;
}
.medium-editor-element blockquote b,
.summernote-editor blockquote b,
.note-editable blockquote b,
.thank-message blockquote b,
.detail-content blockquote b {
  color: inherit;
}
.medium-editor-element blockquote *,
.summernote-editor blockquote *,
.note-editable blockquote *,
.thank-message blockquote *,
.detail-content blockquote * {
  color: inherit !important;
}
.medium-editor-element blockquote,
.summernote-editor blockquote,
.note-editable blockquote,
.thank-message blockquote,
.detail-content blockquote {
  background: url(https://cdn.hubengage.com/assets/images/6cf6f0fb-6ba2-4102-adf0-05823d7d32c3.png) left 4px no-repeat !important;
  margin: 5px 0 !important;
  padding-left: 2.4rem !important;
  font-style: italic !important;
  box-shadow: none !important;
  color: #9e9e9e !important;
  font-size: 1.6rem !important;
  font-weight: 600 !important;
}
.medium-editor-element .giphy-container,
.summernote-editor .giphy-container,
.note-editable .giphy-container,
.thank-message .giphy-container,
.detail-content .giphy-container {
  display: inline-block;
  position: relative;
}
.medium-editor-element .giphy-container img,
.summernote-editor .giphy-container img,
.note-editable .giphy-container img,
.thank-message .giphy-container img,
.detail-content .giphy-container img {
  vertical-align: middle !important;
}
.medium-editor-element .post-card .post-text-box,
.summernote-editor .post-card .post-text-box,
.note-editable .post-card .post-text-box,
.thank-message .post-card .post-text-box,
.detail-content .post-card .post-text-box {
  padding: 0px 5px !important;
}
.medium-editor-element .table-wrapper,
.summernote-editor .table-wrapper,
.note-editable .table-wrapper,
.thank-message .table-wrapper,
.detail-content .table-wrapper {
  width: 100%;
  overflow-x: auto;
  min-height: 30px !important;
}
.medium-editor-element .table-wrapper table,
.summernote-editor .table-wrapper table,
.note-editable .table-wrapper table,
.thank-message .table-wrapper table,
.detail-content .table-wrapper table {
  border-collapse: collapse;
  width: 100% !important;
  overflow-x: auto;
  border: 0.1rem solid #6c6868;
}

font * {
  color: inherit !important;
}

.note-editable img {
  min-width: 100px !important;
  min-height: 100px !important;
  max-width: 100%;
  /* Prevents the image from exceeding the editor width */
}

.hub-interaction-cell {
  height: 100% !important;
  width: 100% !important;
}

.mobile-cell {
  height: 100dvh !important;
  width: 95dvw !important;
  padding: 5px !important;
}

/*# sourceMappingURL=editor.demo.css.map */