body{
  font-size:0.95rem;
  background-color:#0e1423!important;
  color:rgba(0,0,0,.87);
  margin:0;
  padding:0;
  font-weight:400;
  line-height:1.43;
  letter-spacing:.01071em;  
  font-family:ui-sans-serif, system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",Arial,sans-serif,"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}

option {
  background-color: #0e1423;
}

@media print{
  body{
      background-color:#fff
  }
}

a {
  color: #5e63b7;
  text-decoration: none;
}
.App{
  color:#fcfcfd;
  text-align:center;
}
html{
  box-sizing:border-box;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  tab-size: 4;
}
*,::after,::before{
  box-sizing:inherit;
  border-width: 0;
  border-style: solid;
  border-color: #e5e7eb;
}

.ButtonBase-root{
  color:inherit;
  border:0;
  cursor:pointer;
  margin:0;
  display:inline-flex;
  outline:0;
  padding:0;
  position:relative;
  align-items:center;
  user-select:none;
  border-radius:0;
  vertical-align:middle;
  -moz-appearance:none;
  justify-content:center;
  text-decoration:none;
  background-color:transparent;
  -webkit-appearance:none;
  -webkit-tap-highlight-color:transparent
}
.ButtonBase-root::-moz-focus-inner{
  border-style:none
}
@media print{
  .ButtonBase-root{
      -webkit-print-color-adjust:exact
  }
}
.Chip-root{
  color:#fff;
  border:none;
  cursor:default;
  height:32px;
  display:inline-flex;
  outline:0;
  padding:0;
  font-size:.8125rem;
  box-sizing:border-box;
  transition:background-color .3s cubic-bezier(.4,0,.2,1) 0s,box-shadow .3s cubic-bezier(.4,0,.2,1) 0s;
  align-items:center;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  white-space:nowrap;
  border-radius:16px;
  vertical-align:middle;
  justify-content:center;
  text-decoration:none;
  background-color:#e0e0e0
}
.Chip-clickable{
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent
}
.Chip-clickable:focus,.Chip-clickable:hover{
  background-color:#cecece
}
.Chip-clickable:active{
  box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)
}
.Chip-label{
  overflow:hidden;
  white-space:nowrap;
  padding-left:12px;
  padding-right:12px;
  text-overflow:ellipsis
}
.Typography-root{
  margin:0
}
.Typography-h3{
  font-size:2rem;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:400;
  line-height:1.167;
  letter-spacing:0;
  margin: 32px 0px;
}
.Typography-gutterBottom{
  margin-bottom:.35em
}
.top-space{
  margin-top:7vh;
  margin-bottom:1vh
}
.root-1{
  color:#fff;
  height:100%;
  flex-grow:1;
  background:#141416
}
.chip-5{
  height:40px;
  padding:5px;
  font-size:14px;
  font-weight:700;
  border-color:#353945;
  border-width:2px;
  word-spacing:1.1px;
  border-radius:20px;
  letter-spacing:1.1px
}
.body-7{
  justify-content:center;
  margin-left:200px;
  margin-right:200px;
  margin-bottom:100px
}
.title-12{
  font-weight:medium;
  padding-top:50px;
  word-spacing:1.1px;
  letter-spacing:1.1px
}
*,::after,::before{
  box-sizing:inherit
}
.Paper-elevation4{
  box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)
}
.AppBar{
  background-color:#141416
}
.Toolbar-root{
  display:flex;
  position:relative;
  align-items:center
}
.Toolbar-gutters{
  padding-left:16px;
  padding-right:16px
}
@media (min-width:600px){
  .Toolbar-gutters{
      padding-left:24px;
      padding-right:24px
  }
}
.Toolbar-regular{
  min-height:56px
}
@media (min-width:0px) and (orientation:landscape){
  .Toolbar-regular{
      min-height:48px
  }
}
@media (min-width:600px){
  .Toolbar-regular{
      min-height:64px
  }
}
.logo-group {
  display: flex;
  align-items: center;
  padding: 0px 8px;
  border-radius: 4px;
}
.ButtonBase-root{
  color:inherit;
  border:0;
  cursor:pointer;
  margin:0;
  display:inline-flex;
  outline:0;
  padding:0;
  position:relative;
  align-items:center;
  user-select:none;
  border-radius:0;
  vertical-align:middle;
  -moz-appearance:none;
  justify-content:center;
  text-decoration:none;
  background-color:transparent;
  -webkit-appearance:none;
  -webkit-tap-highlight-color:transparent
}
.ButtonBase-root::-moz-focus-inner{
  border-style:none
}
@media print{
  .ButtonBase-root{
      -webkit-print-color-adjust:exact
  }
}
.Button-root{
  color:rgba(0,0,0,.87);
  padding:6px 16px;
  font-size:.875rem;
  min-width:64px;
  box-sizing:border-box;
  transition:background-color 250ms cubic-bezier(.4,0,.2,1) 0s,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0s,border 250ms cubic-bezier(.4,0,.2,1) 0s;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:500;
  line-height:1.75;
  border-radius:4px;
  letter-spacing:.02857em;
  text-transform:uppercase
}
@media (hover:none){
  .Button-root:hover{
      background-color:transparent
  }
}
.Button-label{
  width:100%;
  display:inherit;
  align-items:inherit;
  justify-content:inherit
}
.Button-text{
  padding:6px 8px
}
.header-navButtons-3{
  font-size:20px;
  margin-right:8px;
  text-transform:none
}
.header-left-4{
  margin-left:16px
}
.header-empty-6{
  flex-grow:1
}
.header-space-8{
  margin-right:16px
}
.header-vertical-9{
  height:35px;
  border-left:.5px solid #fff;
  margin-right:16px
}
.header-logo-11{
  margin-right:1px;
  height:80px;
  width:85px
}
.header-logo-text{
  font-size:20px
}
.header-appBar-13{
  height:80px;
}
*,::after,::before{
  box-sizing:inherit
}
.form-InputBase-root{
  cursor:text;
  display:inline-flex;
  position:relative;
  font-size:1rem;
  box-sizing:border-box;
  align-items:center;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:400;
  line-height:1.1876em;
  letter-spacing:.00938em
}
.form-InputBase-fullWidth{
  width:100%
}
.form-InputBase-input{
  font:inherit;
  color:currentColor;
  width:100%;
  border:0;
  height:1.1876em;
  margin:0;
  display:block;
  padding:6px 0 7px;
  min-width:0;
  background:0 0;
  box-sizing:content-box;
  animation-name:mui-auto-fill-cancel;
  letter-spacing:inherit;
  animation-duration:10ms;
  -webkit-tap-highlight-color:transparent
}
.form-InputBase-input::-webkit-input-placeholder{
  color:currentColor;
  opacity:.42;
  transition:opacity .2s cubic-bezier(.4,0,.2,1) 0s
}
.form-InputBase-input::-moz-placeholder{
  color:currentColor;
  opacity:.42;
  transition:opacity .2s cubic-bezier(.4,0,.2,1) 0s
}
.form-InputBase-input:-ms-input-placeholder{
  color:currentColor;
  opacity:.42;
  transition:opacity .2s cubic-bezier(.4,0,.2,1) 0s
}
.form-InputBase-input::-ms-input-placeholder{
  color:currentColor;
  opacity:.42;
  transition:opacity .2s cubic-bezier(.4,0,.2,1) 0s
}
.form-InputBase-input:focus{
  outline:0
}
.form-InputBase-input:invalid{
  box-shadow:none
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input::-webkit-input-placeholder{
  opacity:0!important
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input::-moz-placeholder{
  opacity:0!important
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input:-ms-input-placeholder{
  opacity:0!important
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input::-ms-input-placeholder{
  opacity:0!important
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input:focus::-webkit-input-placeholder{
  opacity:.42
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input:focus::-moz-placeholder{
  opacity:.42
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input:focus:-ms-input-placeholder{
  opacity:.42
}
label[data-shrink=false]+.form-InputBase-formControl .form-InputBase-input:focus::-ms-input-placeholder{
  opacity:.42
}
.PrivateNotchedOutline-root-60{
  top:-5px;
  left:0;
  right:0;
  bottom:0;
  margin:0;
  padding:0 8px;
  overflow:hidden;
  position:absolute;
  border-style:solid;
  border-width:1px;
  border-radius:inherit;
  pointer-events:none
}
.form-OutlinedInput-root{
  position:relative;
  border-radius:4px;
}
.form-OutlinedInput-root:hover .form-OutlinedInput-notchedOutline{
  border-color:white
}
/* @media (hover:none){
  .form-OutlinedInput-root:hover .form-OutlinedInput-notchedOutline{
      border-color:rgba(0,0,0,.23)
  }
} */
.form-OutlinedInput-notchedOutline{
  border-color:rgb(48, 52, 54)
}
.form-OutlinedInput-root:focus-within .form-OutlinedInput-notchedOutline{
  border-color:white
}
.upload-container{
  width:100%;
  text-align:left
}
.upload{
  padding:18.5px 0!important;
  width:220px;
  height:70px;
  overflow:hidden
}
.form-OutlinedInput-input{
  padding:18.5px 14px
}
.form-FormControl-root{
  border:0;
  margin:0;
  display:inline-flex;
  padding:0;
  position:relative;
  min-width:0;
  flex-direction:column;
  vertical-align:top
}
.form-FormControl-marginNormal{
  margin-top:16px;
  margin-bottom:8px
}
.form-FormControl-fullWidth{
  width:100%
}
.form-Typography-root{
  margin:0
}
.form-Typography-h3{
  font-size:3rem;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:400;
  line-height:1.167;
  letter-spacing:0
}
.form-Typography-subtitle1{
  font-size:1rem;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:400;
  line-height:1.75;
  letter-spacing:.00938em
}
.form-Typography-gutterBottom{
  margin-bottom:.35em
}
.form-Toolbar-root{
  display:flex;
  position:relative;
  align-items:center
}
.form-Toolbar-gutters{
  padding-left:16px;
  padding-right:16px
}
@media (min-width:600px){
  .form-Toolbar-gutters{
      padding-left:24px;
      padding-right:24px
  }
}
.form-Toolbar-regular{
  min-height:56px
}
@media (min-width:0px) and (orientation:landscape){
  .form-Toolbar-regular{
      min-height:48px
  }
}
@media (min-width:600px){
  .form-Toolbar-regular{
      min-height:64px
  }
}
.form-ButtonBase-root{
  color:inherit;
  border:0;
  cursor:pointer;
  margin:0;
  display:inline-flex;
  outline:0;
  padding:0;
  position:relative;
  align-items:center;
  user-select:none;
  border-radius:0;
  vertical-align:middle;
  -moz-appearance:none;
  justify-content:center;
  text-decoration:none;
  background-color:transparent;
  -webkit-appearance:none;
  -webkit-tap-highlight-color:transparent
}
.form-ButtonBase-root::-moz-focus-inner{
  border-style:none
}
@media print{
  .form-ButtonBase-root{
      -webkit-print-color-adjust:exact
  }
}
.form-Chip-root{
  color:#fff;
  border:none;
  cursor:default;
  height:32px;
  display:inline-flex;
  outline:0;
  padding:6px 8px;
  font-size:20px;
  box-sizing:border-box;
  transition:background-color .3s cubic-bezier(.4,0,.2,1) 0s,box-shadow .3s cubic-bezier(.4,0,.2,1) 0s;
  align-items:center;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  white-space:nowrap;
  border: radius 4px;
  vertical-align:middle;
  justify-content:center;
  text-decoration:none;
  background-color:rgba(94, 99, 183, 1)
}
.form-Chip-clickable{
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color:transparent
}
.form-Chip-clickable:focus,.form-Chip-clickable:hover{
  background-color:rgba(94, 99, 183, 0.5)
}
.form-Chip-clickable:active{
  box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)
}
.form-Chip-label{
  overflow:hidden;
  white-space:nowrap;
  padding-left:12px;
  padding-right:12px;
  text-overflow:ellipsis
}
.form-Button-root{
  color:rgba(0,0,0,.87);
  padding:6px 16px;
  font-size:.875rem;
  min-width:64px;
  box-sizing:border-box;
  transition:background-color 250ms cubic-bezier(.4,0,.2,1) 0s,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0s,border 250ms cubic-bezier(.4,0,.2,1) 0s;
  font-family:Roboto,Helvetica,Arial,sans-serif;
  font-weight:500;
  line-height:1.75;
  border-radius:4px;
  letter-spacing:.02857em;
  text-transform:uppercase
}
.form-Button-root:hover{
  text-decoration:none;
  background-color:rgba(0,0,0,.04)
}
@media (hover:none){
  .form-Button-root:hover{
      background-color:transparent
  }
}
.form-Button-label{
  width:100%;
  display:inherit;
  align-items:inherit;
  justify-content:inherit
}
.form-Button-text{
  padding:6px 8px
}
.makeStyles-root-87{
  color:#fff;
  height:120vh;
  flex-grow:1;
  background:#141416
}
.makeStyles-chip-91{
  height:40px;
  padding:5px;
  font-size:14px;
  font-weight:700;
  border-color:#353945;
  border-width:2px;
  word-spacing:1.1px;
  border-radius:20px;
  letter-spacing:1.1px
}
.makeStyles-navButtons-92{
  color:#777e90;
  font-size:14px;
  margin-right:8px;
  text-transform:none
}
.minter-container{
  width:40vw;
  margin-bottom:10vh
}
.makeStyles-subhead-102{
  text-align:left
}
*,::after,::before{
  box-sizing:inherit
}
.gallery-view{
  margin-bottom:30px;
  width:50vw;
  margin-left:25vw
}
.lds-ellipsis{
  display:inline-block;
  position:relative;
  width:80px;
  height:80px
}
.lds-ellipsis div{
  position:absolute;
  top:33px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#fff;
  animation-timing-function:cubic-bezier(0,1,1,0)
}
.lds-ellipsis div:nth-child(1){
  left:8px;
  animation:lds-ellipsis1 .6s infinite
}
.lds-ellipsis div:nth-child(2){
  left:8px;
  animation:lds-ellipsis2 .6s infinite
}
.lds-ellipsis div:nth-child(3){
  left:32px;
  animation:lds-ellipsis2 .6s infinite
}
.lds-ellipsis div:nth-child(4){
  left:56px;
  animation:lds-ellipsis3 .6s infinite
}
@keyframes lds-ellipsis1{
  0%{
      transform:scale(0)
  }
  100%{
      transform:scale(1)
  }
}
@keyframes lds-ellipsis3{
  0%{
      transform:scale(1)
  }
  100%{
      transform:scale(0)
  }
}
@keyframes lds-ellipsis2{
  0%{
      transform:translate(0,0)
  }
  100%{
      transform:translate(24px,0)
  }
}

.author-logo{
  height:60px;
  width:60px;
  border-radius:50%;
  border:1px solid #fff;
  position:absolute;
  margin-top:0;
  margin-left:0;
  cursor: pointer;
}
.author-logo-small{
  height:40px;
  width:40px;
  border-radius:50%;
  border:1px solid #fff;
  position:absolute;
  margin-top:0;
  margin-left:0
}
.post-info{
  line-height:.5em
}

.post-top-row {
  display: flex;
  justify-content: space-between;
}

.mkttip-info{
  line-height:.5em;
}
.bio-info{
  line-height:.5em;
  margin-left: 70px;
  margin-top: 20px;
}
.author-info{
  margin: 20px 0 0 70px;
}
.author-name{
  font-weight:700;
  font-size: 20px;
  cursor: pointer;
}

.top-hover-menu{
  padding:10px;
  text-align:left;
  position:relative;  
  display: flex;
}

.author-join-hover-menu{
  margin: 20px 0 20px 70px;
}
.author-name-hover-menu{
  font-weight:700;
  font-size: 20px;
}
.other-info-hover-menu{
  font-weight:200;  
  font-size:15px;
}
.bio-name{
  font-weight:700;
}
p.bio-name{
  margin-top:1rem;
}

.post-title{
  font-weight:700;
  font-size: 18px;
  margin-top: 1rem;
}
.post-stat{
  line-height:normal;
  font-weight:lighter;
  display: flex;
  align-items: center;
  gap: 2vw;
}
.post-title-stat{
  /* margin-left: 70px; */
  font-weight:700;
  font-size: 20px;
  cursor: pointer;
  display: flex;
}
.trade-title-stat{
  /* margin-left: 70px; */
  font-weight:700;
  font-size: 15px;
  /* cursor: pointer; */
  display: flex;
}

.stat-space{
  margin-left: 5px;
}
.reply-message{
  border-top:.5px solid;
  border-bottom:.5px solid;
  padding:10px;
  box-shadow:none;
  text-align:left;
  position:relative
}
.reply-title{
  font-weight:400;
  color:rgba(197,192,192,.505)
}

/* all button hovers */
.icon:hover, .logo-group:hover, .Button-root:hover, .sidebar-icon:hover{
  background-color:rgba(181,178,178,.2)
}

.flex-container {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 2vw;
}

.main-left {
  /* flex-grow: 1; */
  border: 0px solid;
  padding: 10px;
}

.main-center {
  /* flex-grow: 8; */
  padding: 10px
}

.main-right {
  /* flex-grow: 1; */
  border: 0px solid;
  padding: 10px;
}
/* 
.d-flex {
  flex-direction: column;
} */

.icon {
  display: flex;
  align-items: center;
  border-radius: 8px;
  padding: 2.5px;
  cursor: pointer;
}

.article {
  position: relative;
  border: 0.5px solid;
  padding: 2rem 4rem;
}

h3 {
  margin: 0px;
}

/* background color for areas including side bars, top bar, forum, etc */
.area-container {
  background-color: #1f2937;    
  width: 100%;
}

.left-side-bar {
  line-height: 3rem;
}

.right-side-bar {
  line-height: 2rem;
}

.sidebar-catagory-name {
  font-size: 1.5rem;
  text-align: left;
  margin-left: 20px;  
}

.sidebar-icon {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5vw;
  padding-left: 25px;
}

.sidebar-icon.selected{
  background-color: rgba(181,178,178,.2);
}

.sidebar-user-logo {
  height:40px;
  width:40px;
  border-radius:50%;
  border:0px solid #fff;
  /* position:absolute; */
  margin-top:0;
  margin-left:0
}

.compose-button {
  background-color:rgba(94, 99, 183, 1);
}

.compose-button a {
  color: white;
}

.compose-button:hover {
  background-color:rgba(94, 99, 183, 0.2);
}

.post-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 40px;
  cursor: pointer;
}

.post-text {
  line-height: 1;
}

.internet-computer-logo {
  height: 0.75rem;
  margin-right: 0.5rem;
}

textarea {
  min-height: 150px;
}

.reply-to-author-name-color {
  color: blue;
}

.post-content h4 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 5px;
}
.post-content p {
  margin: 0;
  line-height: 1.5;
}

.post-content strong {
  font-weight: bold;
}

.post-content i {
  font-style: italic;
}

.post-content u {
  text-decoration: underline;
}

.post-content code {
  /* font-family: monospace; */
  font-family: "Ubuntu", cursive;  
  background-color: #f0f0f0;
  padding: 2px;
  border-radius: 3px;
  display:inline;
  color: red;
}

.post-image {
  width: 100%;
  margin: 1rem 0;
}

.selection-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}

.selection-container button {
  margin-right: 10px;
  padding: 5px 10px;
  background-color: #ddd;
  border: none;
  cursor: pointer;
}

.selection-container button:hover,  .selection-container button:focus {
  background-color: rgba(94, 99, 183, 1);
  color: #fff;
}

.sort-button {
  margin-right: 10px;
  padding: 5px 10px;
  background-color: #ddd;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.sort-button:hover,  .sort-button:focus {
  background-color: rgba(94, 99, 183, 1);
  color: #fff;
}

.info-column {
  width: 100%;
}

.trade-spans:first-child{
  margin-left: 0px;
}

.hover-menu-container {
  position: relative;
  display: inline-block;
}

.person-name {
  cursor: pointer;
}

.hover-menu {
  position: absolute;
  background-color: #1f2937;   
  /* background-color: white; */
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  z-index: 1;
  width: 250px;
  top: 10px;
  right: -40px;
}

.hover-menu button {
  position: relative;
  width: 200px;
  height: 2rem;
  background-color: rgba(94, 99, 183, 1);
  color: #fff;
  font-size: 14px;
  border: none;
  border-radius: 4px;
  padding: 4px 8px;
  cursor: pointer;
}

.hover-menu button span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.hover-menu button:hover {
  background-color:#cecece
}

.hover-menu button:active {
  box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12)
}

.hover-menu-content {
  font-weight: 700;
}

.header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}

.left-sidebar {
  position: fixed;
  top: 80px;
  left: 0;
  z-index: 100;
  height: calc (100% - 80px);
}

.content-container {
  margin-top: 80px;
  height: calc(100% - 80px);
  display: flex;
  width: 100%;
}

.custom-row {
  /* display: flex; */
  flex-direction: row;
  height: calc(100%-80px);
  /* justify-content: center; */
  /* margin-top: 80px; */
}

.post-content-height {
  overflow: hidden;
  /* max-height: calc(50vh - 80px); */
  max-height: 250px;  
  transition: max-height 0.3s ease;
}

.post-content-height.expanded {
  max-height: none;
}

.mkttip-content-height {
  overflow: hidden;
  /* max-height: calc(50vh - 80px); */
  max-height: 0px;  
  transition: max-height 0.3s ease;
}

.mkttip-content-height.expanded {
  max-height: 0px;
}

.blur-effect {
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  height: 20px;
  background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0.8));
}

.read-more-btn {
  position: absolute;
  bottom: 15px;
  right: 15px;
  padding: 5px 10px;
  border: none;
  border-radius: 3px;
  background-color: #344355;
  color: white;
  font-size: 14px;
  cursor: pointer;
}

.read-more-btn:hover {
  background-color: gray
}

.following-data {
  height: 7rem;
  display: flex;
}

.followee-name {
  margin: 20px 0 0 70px;
  font-weight:700;
  font-size: 20px;
  cursor: pointer;  
}

.following-img {
  margin-top: 20px;
}

.editor-alignment {
  text-align: left;
}

.search-container {
  position: relative;
}

.search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 200px;
  overflow-y: scroll;
  background-color: #fff;
  border: 1px solid #ccc;
  z-index: 1;
}

.search-results p {
  padding: 5px 10px;
  margin: 0;
  cursor: pointer;
}

.search-results p:hover {
  background-color: #f1f1f1;
}

.security-symbol,
.security-name,
.security-exchange {
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000;
  text-align: left;
}

.security-symbol {
  width: 10ch;
  font-weight: bold;
}

.security-name {
  width: 35ch;
  margin-left: 5px;
}

.security-exchange {
  width: 10ch;
  margin-left: 5px;
}

.no-results {
  padding: 8px;
  font-style: italic;
  color: #777;
}

col-lg-9 {
  width: 100%;
}

.forum-buttons {
  display: flex;
  justify-content: center;
  padding-top: 1rem;
}

.left-align {
  text-align: left;
}

/* the next three items are for the performance ranking in the right panel */
.cardContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  margin-bottom: 20px;
  border-radius: 10px;
  /* background-color: #202020; */
  background-color: #1f2937;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.cardHeader {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background-color: #ff5c33;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding: 10px 0;
}

.cardTitle {
  font-size: 18px;
  font-weight: bold;
  color: #fff;
}

.makeStyles-chipBlue-888 {
  background-color: rgba(94, 99, 183, 1);
  color: #fff;  
  /* color: #5f64b5; */
  height: 50px;
  padding: 5px;
  font-size: 16px;
  margin-top: 40px;
  margin-right: 1rem;
  border-radius: 25px;
  /* background-color: rgba(55, 114, 255, 0.1); */
}

.mkttip {
  border:.5px solid;
  padding:10px;
  box-shadow:none;
  text-align:left;
  position:relative;
  /* background-color: #3F0071; */
}

.author-image-container {
  flex: 0 0 60px;
  margin-right: 10px;
}

.author-post {
  border: 0.5px solid;
  padding: 10px;
  box-shadow: none;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.author-image {
  height: 60px;
  width: 60px;
  border-radius: 50%;
  border: 1px solid #fff;
  cursor: pointer;
}

.author-details {
  line-height: 1.5em;
  flex: 1;
}

.author-info-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 10px;
}

.author-info-piece {
  cursor: pointer;
  margin-right: 20px;
}

.author-info-label {
  margin-right: 5px;
}

.author-info-piece:last-child {
  margin-right: 0;
}

.author-info-content {
  font-weight: 700;
}

.author-id {
  font-weight: 700;
  font-size: 20px;
}

.author-joined {
  font-size: 16px;
  opacity: 0.7;
}

.special-tip-container {
  /* position: absolute; */
  margin-bottom: auto;
}

.tip-icon {
  width: 40px;
  height: 40px;
  fill: #ffcc00;
}

.author-info-container {
  display: flex;
  height: 60px;
  align-items: baseline;
}

.post-container {
  border: 0.5px solid;
  padding: 10px;
  box-shadow: none;
  text-align: left;
  position: relative;
}

.author-info-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.author-image-container {
  margin-right: 10px;
}

.author-avatar {
  height: 60px;
  width: 60px;
  border-radius: 50%;
  border: 1px solid #fff;
  cursor: pointer;
}

.mkttip-author-info {
  margin-left: 10px;
}

.mkttip-author-group {
  display: flex;
  align-items: center;
}

.author-name {
  font-weight: 700;
  font-size: 20px;
  cursor: pointer;
}

.post-content-container {
  margin-top: 10px;
  /* display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 40px;
  cursor: pointer;   */
}

.post-title {
  font-weight: 700;
  font-size: 18px;
  margin-top: 1rem;
}

.mkttip-post-content {
  overflow: hidden;
  max-height: 250;
  transition: max-height 0.3s ease;
  cursor: pointer;  
}

.mkttip-post-content.expanded {
  max-height: none;
}

.loader {
  display: flex;
  align-items: center;
  justify-content: center;
}