a {
    color: var(--colors-text-soft);
}

.iconstart, .textcontent {
    position: relative;
    font-weight: 500
}

.iconstart {
    width: 20px;
    line-height: 20px
}

.textcontent {
    color: var(--colors-text-soft);
    font-size: 16px;
    line-height: 24px;
    font-family: Manrope
}

.iconstart1, .textcontent1 {
    position: relative;
    font-weight: 500
}

.iconstart1 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent1 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart2, .textcontent2 {
    position: relative;
    font-weight: 500
}

.iconstart2 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent2 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart3, .textcontent3 {
    position: relative;
    font-weight: 500
}

.iconstart3 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent3 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart4, .textcontent4 {
    position: relative;
    font-weight: 500
}

.iconstart4 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent4 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart5, .textcontent5 {
    position: relative;
    font-weight: 500
}

.iconstart5 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent5 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart6, .textcontent6 {
    position: relative;
    font-weight: 500
}

.iconstart6 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent6 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart7, .textcontent7 {
    position: relative;
    font-weight: 500
}

.iconstart7 {
    width: 20px;
    line-height: 20px;
    display: none
}

.textcontent7 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart8, .textcontent8 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.textcontent8 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.iconstart9, .textcontent9 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.textcontent9 {
    font-size: 16px;
    text-decoration: underline;
    line-height: 24px;
    font-family: Manrope
}

.bg {
    position: absolute
}

.bg {
    height: 100vh;
    width: 100vw;
    top: 0;
    right: 0;
    position: fixed;
    background-color: var(--colors-fill-bgsoft);
    z-index: -1
}

.avatar-icon {
    width: 40px;
    height: 40px;
    object-fit: cover
}

.avatar-icon, .icon, .username {
    position: relative
}

.username {
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon {
    font-size: 20px;
    line-height: 20px;
    /*font-weight: 600;*/
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.icon-filled {
    font-variation-settings:
            'FILL' 1;
}

.inlineusername {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon1, .location {
    position: relative;
    font-weight: 600
}

.icon1 {
    line-height: 16px
}

.location {
    flex: 1;
    font-size: 14px;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinelocation {
    width: 176px;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px
}

.userinfo {
    gap: 16px;
    text-decoration: none;
    color: var(--colors-text-base);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
}

.userinfo.has-story {
    box-shadow: 0 0 0 2px var(--colors-fill-bgmain), 0 0 0 4px var(--colors-fill-primary);
}

.userinfo.is-live {
    box-shadow: 0 0 0 2px var(--colors-fill-bgmain), 0 0 0 4px var(--colors-fill-secondary);
}

.timestamp {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.iconclass {
    position: relative;
    line-height: 24px
}

.btnicon {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    text-align: left;
    font-size: 24px;
    font-family: "Material Symbols Outlined"
}

.inlinetimestamp-icon, .postheader {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlinetimestamp-icon {
    justify-content: flex-end;
    gap: 20px;
    text-align: right;
    font-size: 14px;
    color: var(--colors-text-soft);
    position: relative;
}

.postheader {
    align-self: stretch;
    background-color: var(--colors-fill-bgmain);
    justify-content: space-between;
    padding: 16px 20px 4px;
    border-radius: 16px 16px 0 0;
}

.some-text-for {
    color: var(--colors-text-base);
    flex: 1;
    position: relative;
    line-height: 24px;
    font-weight: 500
}

.postcopytext {
    align-self: stretch;
    background-color: var(--colors-fill-bgmain);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px 16px 12px
}

/*.cardimg-icon {*/
/*    position: absolute;*/
/*    height: 100%;*/
/*    width: 100%;*/
/*    top: 0;*/
/*    right: 0;*/
/*    bottom: 0;*/
/*    left: 0;*/
/*    max-width: 100%;*/
/*    overflow: hidden;*/
/*    max-height: 100%;*/
/*    object-fit: cover*/
/*}*/

.vjs-theme-forest .vjs-big-play-button {
    background-repeat: no-repeat !important;
    background: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 42 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 0.5C9.67816 0.5 0.5 9.67816 0.5 21C0.5 32.3218 9.67816 41.5 21 41.5C32.3218 41.5 41.5 32.3218 41.5 21C41.5 9.67816 32.3218 0.5 21 0.5Z' fill='%23F3F3F4' fill-opacity='0.55'/%3E%3Cpath d='M21 0.5C9.67816 0.5 0.5 9.67816 0.5 21C0.5 32.3218 9.67816 41.5 21 41.5C32.3218 41.5 41.5 32.3218 41.5 21C41.5 9.67816 32.3218 0.5 21 0.5Z' stroke='white'/%3E%3Cpath d='M16.3333 29.1V12.8333L29.1 20.9667L16.3333 29.1ZM18.1667 25.7333L25.6667 20.9667L18.1667 16.2V25.7333Z' fill='%2328292A'/%3E%3C/svg%3E");
    background-position: 50%;
}
.vjs-theme-forest.vjs-big-play-button:focus, .vjs-theme-forest:hover .vjs-big-play-button {
    background-repeat: no-repeat !important;
    background: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 42 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 0.5C9.67816 0.5 0.5 9.67816 0.5 21C0.5 32.3218 9.67816 41.5 21 41.5C32.3218 41.5 41.5 32.3218 41.5 21C41.5 9.67816 32.3218 0.5 21 0.5Z' fill='%23F3F3F4' fill-opacity='0.55'/%3E%3Cpath d='M21 0.5C9.67816 0.5 0.5 9.67816 0.5 21C0.5 32.3218 9.67816 41.5 21 41.5C32.3218 41.5 41.5 32.3218 41.5 21C41.5 9.67816 32.3218 0.5 21 0.5Z' stroke='white'/%3E%3Cpath d='M16.3333 29.1V12.8333L29.1 20.9667L16.3333 29.1ZM18.1667 25.7333L25.6667 20.9667L18.1667 16.2V25.7333Z' fill='%2328292A'/%3E%3C/svg%3E");
    background-position: 50%;
}

.iconcontent {
    position: relative;
    line-height: 32px;
    font-weight: 300
}

.primitivesbtnmediacontrolsp {
    position: absolute;
    top: calc(50% - 21px);
    left: calc(50% - 21px);
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    font-size: 32px
}

.icon2, .location1 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location1 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.tagmediacontrolcounter {
    position: absolute;
    bottom: 12px;
    left: calc(50% - 24px);
    border-radius: 4px;
    background-color: rgba(243, 243, 244, .55);
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 4px;
    gap: 4px;
    font-size: 16px;
    color: var(--colors-text-base)
}

.iconcontent1 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.btnmediacontrolsnext {
    position: absolute;
    top: calc(50% - 15px);
    right: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    color: var(--colors-text-base)
}

.iconcontent2 {
    position: relative;
    line-height: 20px;
    font-weight: 500;
    opacity: .5
}

.btnmediacontrolsnext1 {
    position: absolute;
    top: calc(50% - 15px);
    left: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-neutralbase);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px
}
.media-container {
    width: 100%;
    height: 100%;
    max-height: 1000px;
    flex: 1;
    position: relative;
    text-align: center;
    font-size: 20px;
    color: var(--colors-text-soft);
    font-family: Manrope;
    max-width: 100vw;
    width: 100%;
    overflow: hidden;
}

.media-container .slick-slider {
    max-width: 100vw;
    width: 100%;
    overflow: hidden;
}

.media-container .slick-slide {
    width: auto;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.media-container .slick-track {
    display: flex;
    flex-direction: row-reverse;
    width: min-content !important;
}

.icon3, .textcontent10 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent10 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.postfooter button, .postfooter1 button, .postfooter2 button {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px;
    border-radius: 4px;
    background-color: transparent;
    border: none
}

.postfooter button .icon, .postfooter1 button .icon, .postfooter2 button .icon {
    font-size: 24px;
    line-height: 24px;
    color: var(--colors-fill-primary);
    font-family: "Material Symbols Outlined"
}

.icon4, .textcontent11 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent11 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost1, .inlinestart {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.btnghost1 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    padding: 4px;
    gap: 4px
}

.inlinestart {
    gap: 8px
}

.icon5, .textcontent12 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent12 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost2 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon6, .textcontent13 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent13 {
    width: 66px;
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left;
    display: none
}

.btnghost3 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.btnghost3, .inlineend, .postfooter {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlineend {
    justify-content: flex-start;
    gap: 8px
}

.postfooter {
    align-self: stretch;
    background-color: var(--colors-fill-bgmain);
    justify-content: space-between;
    padding: 12px 16px;
    text-align: center;
    font-size: 24px;
    color: var(--colors-fill-primary);
    font-family: "Material Symbols Outlined";
    border-radius: 0 0 16px 16px;
}

.cardpostvertical-max {
    width: 100%;
    border-radius: 16px;
    background-color: var(--colors-fill-bgmain);
    border: 1px solid var(--colors-border-neutrallight);
    box-sizing: border-box;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    position: relative;
}

.avatar-icon1 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover;
    border-radius: 50%;
}

.username1 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon7 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername1 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon8, .location2 {
    position: relative;
    font-weight: 600
}

.icon8 {
    line-height: 16px
}

.location2 {
    flex: 1;
    font-size: 14px;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinelocation1 {
    width: 176px;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata1, .userinfo1 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px
}

.userinfo1 {
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.timestamp1 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.iconclass1 {
    position: relative;
    line-height: 24px
}

.btnicon1 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    text-align: left;
    font-size: 24px;
    font-family: "Material Symbols Outlined"
}

.inlinetimestamp-icon1, .postheader1 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlinetimestamp-icon1 {
    justify-content: flex-end;
    gap: 20px;
    text-align: right;
    font-size: 14px;
    color: var(--colors-text-soft)
}

.postheader1 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 16px 20px 4px
}

.some-text-for1 {
    flex: 1;
    position: relative;
    line-height: 24px;
    font-weight: 500
}

.postcopytext1 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px 16px 12px
}

.bg1 {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: var(--colors-fill-disabledHigh)
}

.lock-heat-icon {
    width: 64px;
    position: relative;
    height: 64px;
    object-fit: cover
}

.click-to-unlock, .price-20-tkn {
    position: relative;
    line-height: 27px
}

.price-20-tkn {
    font-size: 16px;
    line-height: 24px;
    color: var(--colors-text-base)
}

.content, .stackedtext {
    display: flex;
    flex-direction: column;
    align-items: center
}

.stackedtext {
    justify-content: flex-start;
    padding: 12px 8px
}

.content {
    position: absolute;
    top: calc(50% - 70px);
    left: calc(50% - 72px);
    justify-content: center
}

.media-container1 {
    width: 600px;
    flex: 1;
    position: relative;
    text-align: center;
    font-size: 18px;
    color: var(--colors-text-link)
}

.icon9, .textcontent14 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent14 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost4 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon10, .textcontent15 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent15 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost5, .inlinestart1 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.btnghost5 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    padding: 4px;
    gap: 4px
}

.inlinestart1 {
    gap: 8px
}

.icon11, .textcontent16 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent16 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost6 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon12, .textcontent17 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent17 {
    width: 66px;
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left;
}

.btnghost7 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.btnghost7, .inlineend1, .postfooter1 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlineend1 {
    justify-content: flex-start;
    gap: 8px
}

.postfooter1 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 12px 16px;
    text-align: center;
    font-size: 24px;
    color: var(--colors-fill-primary);
    font-family: "Material Symbols Outlined"
}

.cardpostvertical-max1 {
    width: 600px;
    border-radius: 16px;
    background-color: var(--colors-text-base_inverted);
    border: 1px solid var(--colors-fill-disabledHigh);
    box-sizing: border-box;
    height: 548px;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.avatar-icon2 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username2 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon13 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon14, .location3 {
    position: relative;
    font-weight: 600
}

.icon14 {
    line-height: 16px
}

.location3 {
    flex: 1;
    font-size: 14px;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinelocation2 {
    width: 176px;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata2, .userinfo2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px
}

.userinfo2 {
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.timestamp2 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.iconclass2 {
    position: relative;
    line-height: 24px
}

.btnicon2 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    text-align: left;
    font-size: 24px;
    font-family: "Material Symbols Outlined"
}

.inlinetimestamp-icon2, .postheader2 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlinetimestamp-icon2 {
    justify-content: flex-end;
    gap: 20px;
    text-align: right;
    font-size: 14px;
    color: var(--colors-text-soft)
}

.postheader2 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 16px 20px 4px
}

.some-text-for2 {
    flex: 1;
    position: relative;
    line-height: 24px;
    font-weight: 500
}

.postcopytext2 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px 16px 12px
}

.cardimg-icon1 {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: 100%;
    overflow: hidden;
    max-height: 100%;
    object-fit: cover
}

.iconcontent3 {
    position: relative;
    line-height: 32px;
    font-weight: 300
}

.primitivesbtnmediacontrolsp1 {
    position: absolute;
    top: calc(50% - 21px);
    left: calc(50% - 21px);
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    font-size: 32px
}

.icon15, .location4 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location4 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.tagmediacontrolcounter1 {
    position: absolute;
    bottom: 12px;
    left: calc(50% - 24px);
    border-radius: 4px;
    background-color: rgba(243, 243, 244, .55);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 4px;
    gap: 4px;
    font-size: 16px;
    color: var(--colors-text-base)
}

.iconcontent4 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.btnmediacontrolsnext2 {
    position: absolute;
    top: calc(50% - 15px);
    right: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    color: var(--colors-text-base)
}

.iconcontent5 {
    position: relative;
    line-height: 20px;
    font-weight: 500;
    opacity: .5
}

.btnmediacontrolsnext3 {
    position: absolute;
    top: calc(50% - 15px);
    left: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-neutralbase);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px
}

.media-container2 {
    width: 600px;
    flex: 1;
    position: relative;
    text-align: center;
    font-size: 20px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.icon16, .textcontent18 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent18 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-base);;
    text-align: left
}

.btnghost8 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon17, .textcontent19 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent19 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost9, .inlinestart2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.btnghost9 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    padding: 4px;
    gap: 4px
}

.inlinestart2 {
    gap: 8px
}

.icon18, .textcontent20 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent20 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost10 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon19, .textcontent21 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent21 {
    width: 66px;
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left;
    display: none
}

.btnghost11 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.btnghost11, .inlineend2, .postfooter2 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlineend2 {
    justify-content: flex-start;
    gap: 8px
}

.postfooter2 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 12px 16px;
    text-align: center;
    font-size: 24px;
    color: var(--colors-fill-primary);
    font-family: "Material Symbols Outlined"
}

.cardpostvertical-max2 {
    width: 600px;
    border-radius: 16px;
    background-color: var(--colors-text-base_inverted);
    border: 1px solid var(--colors-fill-disabledHigh);
    box-sizing: border-box;
    height: 788px;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.avatar-icon3 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username3 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon20 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon21, .location5 {
    position: relative;
    font-weight: 600
}

.icon21 {
    line-height: 16px
}

.location5 {
    flex: 1;
    font-size: 14px;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinelocation3 {
    width: 176px;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata3, .userinfo3 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 4px
}

.userinfo3 {
    flex-direction: row;
    align-items: center;
    gap: 16px
}

.timestamp3 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.iconclass3 {
    position: relative;
    line-height: 24px
}

.btnicon3 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    text-align: left;
    font-size: 24px;
    font-family: "Material Symbols Outlined"
}

.inlinetimestamp-icon3, .postheader3 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlinetimestamp-icon3 {
    justify-content: flex-end;
    gap: 20px;
    text-align: right;
    font-size: 14px;
    color: var(--colors-text-soft)
}

.postheader3 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 16px 20px 4px
}

.some-text-for3 {
    flex: 1;
    position: relative;
    line-height: 24px;
    font-weight: 500
}

.postcopytext3 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px 16px 12px
}

.cardimg-icon2 {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: 100%;
    overflow: hidden;
    max-height: 100%;
    object-fit: cover
}

.iconcontent6 {
    position: relative;
    line-height: 32px;
    font-weight: 300
}

.primitivesbtnmediacontrolsp2 {
    position: absolute;
    top: calc(50% - 21px);
    left: calc(50% - 21px);
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    font-size: 32px
}

.icon22, .location6 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location6 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.tagmediacontrolcounter2 {
    position: absolute;
    bottom: 12px;
    left: calc(50% - 24px);
    border-radius: 4px;
    background-color: rgba(243, 243, 244, .55);
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 4px;
    gap: 4px;
    font-size: 16px;
    color: var(--colors-text-base)
}

.iconcontent7 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.btnmediacontrolsnext4 {
    position: absolute;
    top: calc(50% - 15px);
    right: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-deep);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    color: var(--colors-text-base)
}

.iconcontent8 {
    position: relative;
    line-height: 20px;
    font-weight: 500;
    opacity: .5
}

.btnmediacontrolsnext5 {
    position: absolute;
    top: calc(50% - 15px);
    left: 11px;
    border-radius: 9999px;
    background-color: rgba(243, 243, 244, .55);
    border: 1px solid var(--colors-border-neutralbase);
    overflow: hidden;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px
}

.media-container3 {
    width: 600px;
    flex: 1;
    position: relative;
    text-align: center;
    font-size: 20px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.icon23, .textcontent22 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent22 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost12 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon24, .textcontent23 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent23 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost13, .inlinestart3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.btnghost13 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    padding: 4px;
    gap: 4px
}

.inlinestart3 {
    gap: 8px
}

.icon25, .textcontent24 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent24 {
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left
}

.btnghost14 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.icon26, .textcontent25 {
    position: relative;
    line-height: 24px;
    font-weight: 600
}

.textcontent25 {
    width: 66px;
    font-size: 16px;
    font-family: Manrope;
    color: var(--colors-text-soft);
    text-align: left;
    display: none
}

.btnghost15 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    justify-content: flex-start;
    padding: 4px;
    gap: 4px
}

.btnghost15, .inlineend3, .postfooter3 {
    display: flex;
    flex-direction: row;
    align-items: center
}

.inlineend3 {
    justify-content: flex-start;
    gap: 8px
}

.postfooter3 {
    align-self: stretch;
    background-color: var(--colors-text-base_inverted);
    justify-content: space-between;
    padding: 12px 16px;
    text-align: center;
    font-size: 24px;
    color: var(--colors-fill-primary);
    font-family: "Material Symbols Outlined"
}

.cardpostvertical-max3 {
    width: 600px;
    border-radius: 16px;
    background-color: var(--colors-text-base_inverted);
    border: 1px solid var(--colors-fill-disabledHigh);
    box-sizing: border-box;
    height: 588px;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.iconstart10 {
    font-size: 20px;
    line-height: 20px
}

.iconend, .iconstart10, .label {
    position: relative
}

.label {
    line-height: 24px;
    font-weight: 600;
    font-family: Manrope
}

.iconend {
    width: 16px;
    line-height: 16px;
    display: none
}

.btnoutlined, .colstackedposts {
    display: flex;
    align-items: center
}

.btnoutlined {
    border-radius: 9999px;
    background-color: var(--colors-text-base_inverted);
    border: 2px solid var(--colors-border-primary);
    flex-direction: row;
    justify-content: center;
    padding: 8px 20px;
    gap: 8px;
    font-family: "Material Symbols Outlined"
}

.colstackedposts {
    flex-direction: column;
    justify-content: flex-start;
    padding: 40px 0 64px;
    gap: 20px
}

.menusidebar, .wrappertopmargin {
    position: sticky;
    top: 80px
}

.iconstart11, .textcontent26 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.iconstart {
    font-family: "Material Symbols Outlined";
    color: var(--colors-text-base);
}

.iconstart.active {
    color: var(--colors-fill-primary)
}

.textcontent26 {
    font-size: 16px
}

.counter {
    position: relative;
    line-height: 16px
}

.badgeend, .nav-itemsidebar {
    border-radius: 4px;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend {
    width: 20px;
    background-color: var(--colors-fill-primary-accent);
    color: var(--colors-text-base);
    height: 20px;
    justify-content: center;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-itemsidebar {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    display: flex;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px;
    color: var(--colors-text-base)
}

.nav-itemsidebar:hover {
    color: var(--colors-fill-primary);
}

.nav-itemsidebar:hover .iconstart {
    color: var(--colors-fill-primary);
}

.left-menu-active {
    background: var(--colors-fill-bgmain);
    color: var(--colors-text-base);
}

.iconstart12, .textcontent27 {
    position: relative;
    line-height: 20px
}

.iconstart12 {
    font-family: "Material Symbols Outlined"
}

.textcontent27 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter1 {
    position: relative;
    line-height: 16px
}

.badgeend1, .nav-itemsidebar1 {
    border-radius: 4px;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend1 {
    width: 20px;
    background-color: var(--colors-fill-primary-accent);
    height: 20px;
    display: none;
    justify-content: center;
    padding: 4px;
    font-size: 12px;
    color: var(--colors-text-base)
}

.nav-itemsidebar1 {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    display: flex;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.iconstart13, .textcontent28 {
    position: relative;
    line-height: 20px
}

.iconstart13 {
    font-family: "Material Symbols Outlined"
}

.textcontent28 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter2 {
    position: relative;
    line-height: 16px
}

.badgeend2, .nav-itemsidebar2 {
    border-radius: 4px;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend2 {
    width: 20px;
    background-color: var(--colors-fill-primary-accent);
    height: 20px;
    display: none;
    justify-content: center;
    padding: 4px;
    font-size: 12px;
    color: var(--colors-text-base)
}

.nav-itemsidebar2 {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    display: flex;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.iconstart14, .textcontent29 {
    position: relative;
    line-height: 20px
}

.iconstart14 {
    font-family: "Material Symbols Outlined"
}

.textcontent29 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter3 {
    position: relative;
    line-height: 16px
}

.badgeend3, .nav-itemsidebar3 {
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend3 {
    width: 20px;
    background-color: #F86308;
    height: 20px;
    justify-content: center;
    padding: 4px;
    font-size: 12px;
    color: white;
}

.nav-itemsidebar3 {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.iconstart15, .textcontent30 {
    position: relative;
    line-height: 20px
}

.iconstart15 {
    font-family: "Material Symbols Outlined"
}

.textcontent30 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter4 {
    position: relative;
    line-height: 16px
}

.badgeend4, .nav-itemsidebar4 {
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend4 {
    width: 28px;
    background-color: #F86308;
    height: 20px;
    justify-content: center;
    padding: 4px;
    font-size: 12px;
    color: white;
}

.nav-itemsidebar4 {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.iconstart16, .textcontent31 {
    position: relative;
    line-height: 20px
}

.iconstart16 {
    font-family: "Material Symbols Outlined"
}

.textcontent31 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter5 {
    position: relative;
    line-height: 16px
}

.badgeend5, .nav-itemsidebar5 {
    border-radius: 4px;
    flex-direction: row;
    align-items: center;
    box-sizing: border-box
}

.badgeend5 {
    width: 20px;
    background-color: var(--colors-fill-primary-accent);
    height: 20px;
    display: none;
    justify-content: center;
    padding: 4px;
    font-size: 12px;
    color: var(--colors-text-base)
}

.nav-itemsidebar5 {
    width: 280px;
    background-color: var(--colors-fill-bgsoft);
    display: flex;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.iconstart17, .textcontent32 {
    position: relative;
    line-height: 20px
}

.iconstart17 {
    font-family: "Material Symbols Outlined"
}

.textcontent32 {
    font-size: 16px;
    font-weight: 500;
    color: var(--colors-text-soft)
}

.counter6 {
    position: relative;
    line-height: 16px
}

.badgeend6 {
    width: 20px;
    border-radius: 4px;
    background-color: var(--colors-fill-primary-accent);
    height: 20px;
    display: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 4px;
    box-sizing: border-box;
    font-size: 12px;
    color: var(--colors-text-base)
}

.nav-barvertical, .nav-itemsidebar6 {
    display: flex;
    justify-content: flex-start
}

.nav-itemsidebar6 {
    width: 280px;
    border-radius: 4px;
    background-color: var(--colors-fill-bgsoft);
    flex-direction: row;
    align-items: center;
    padding: 8px 12px;
    box-sizing: border-box;
    gap: 12px
}

.nav-barvertical {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px
}

.iconstart18 {
    position: relative;
    font-size: 20px;
    line-height: 20px
}

.label1 {
    position: relative;
    line-height: 24px;
    font-weight: 600;
    font-family: Manrope
}

.iconend1 {
    width: 16px;
    position: relative;
    line-height: 16px;
    font-weight: 500;
    display: none
}

.btnprimary {
    align-self: stretch;
    border-radius: 9999px;
    background-color: var(--colors-fill-primary);
    border: 2px solid var(--colors-border-primary);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 8px 20px;
    gap: 8px
}

.iconstart19 {
    position: relative;
    font-size: 20px;
    line-height: 20px
}

.label2 {
    position: relative;
    line-height: 24px;
    font-weight: 600;
    font-family: Manrope
}

.iconend2 {
    width: 16px;
    position: relative;
    line-height: 16px;
    font-weight: 500;
    display: none
}

.btnsecondary {
    align-self: stretch;
    border-radius: 9999px;
    background-color: var(--colors-fill-secondary);
    border: 2px solid var(--colors-border-secondary);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 8px 20px;
    gap: 8px
}

.menusidebar, .stackedbtncreate {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start
}

.stackedbtncreate {
    align-self: stretch;
    gap: 20px;
    text-align: left;
    font-size: 16px;
    color: var(--colors-text-base);
    font-family: "Material Symbols Outlined"
}

.menusidebar {
    gap: 32px;
    min-width: 280px;
}

.suggestions {
    flex: 1;
    position: relative;
    line-height: 27px
}

.iconclass4 {
    position: relative;
    line-height: 24px;
    color: var(--colors-text-soft)
}

.blocktitle, .btnicon4 {
    display: flex;
    align-items: center
}

.btnicon4 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    flex-direction: column;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blocktitle {
    align-self: stretch;
    flex-direction: row;
    justify-content: flex-start;
    padding: 12px 0 2px;
    gap: 12px
}

.avatar-icon4 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username4 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon27 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername4 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon28, .location7 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location7 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinephotos {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon29, .location8 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location8 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinevideos {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.blockuserdata4, .inlinestats {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.inlinestats {
    flex-direction: row;
    gap: 8px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata4 {
    flex: 1;
    flex-direction: column;
    gap: 4px
}

.iconclass5 {
    position: relative;
    line-height: 24px
}

.btnicon5, .cardsuggestionhorizontal {
    background-color: var(--colors-fill-bgmain);
    display: flex;
    align-items: center
}

.btnicon5 {
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.cardsuggestionhorizontal {
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--colors-border-neutrallight);
    flex-direction: row;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.avatar-icon5 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username5 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon30 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername5 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon31, .location9 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location9 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinephotos1 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon32, .location10 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location10 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinevideos1 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.blockuserdata5, .inlinestats1 {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.inlinestats1 {
    flex-direction: row;
    gap: 8px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata5 {
    flex: 1;
    flex-direction: column;
    gap: 4px
}

.iconclass6 {
    position: relative;
    line-height: 24px
}

.btnicon6, .cardsuggestionhorizontal1 {
    background-color: var(--colors-text-base_inverted);
    display: flex;
    align-items: center
}

.btnicon6 {
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.cardsuggestionhorizontal1 {
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--colors-fill-disabledHigh);
    flex-direction: row;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.avatar-icon6 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username6 {
    flex: 1;
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon33 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername6 {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon34, .location11 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location11 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinephotos2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon35, .location12 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location12 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinevideos2 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.blockuserdata6, .inlinestats2 {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.inlinestats2 {
    flex-direction: row;
    gap: 8px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata6 {
    flex: 1;
    flex-direction: column;
    gap: 4px
}

.iconclass7 {
    position: relative;
    line-height: 24px
}

.btnicon7, .cardsuggestionhorizontal2 {
    background-color: var(--colors-text-base_inverted);
    display: flex;
    align-items: center
}

.btnicon7 {
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.cardsuggestionhorizontal2 {
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--colors-fill-disabledHigh);
    flex-direction: row;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.avatar-icon7 {
    width: 40px;
    position: relative;
    height: 40px;
    object-fit: cover
}

.username7 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon36 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername7 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon37, .location13 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location13 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinephotos3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon38, .location14 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location14 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinevideos3 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.blockuserdata7, .inlinestats3 {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.inlinestats3 {
    flex-direction: row;
    gap: 8px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata7 {
    flex: 1;
    flex-direction: column;
    gap: 4px
}

.iconclass8 {
    position: relative;
    line-height: 24px
}

.btnicon8, .cardsuggestionhorizontal3 {
    background-color: var(--colors-text-base_inverted);
    display: flex;
    align-items: center
}

.btnicon8 {
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.cardsuggestionhorizontal3 {
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--colors-fill-disabledHigh);
    flex-direction: row;
    justify-content: flex-start;
    padding: 8px 12px;
    gap: 12px
}

.picture {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 9999px;
    background-color: var(--colors-border-neutralbase);
}

.avatar.has-story .picture {
    box-shadow: 0 0 0 2px var(--colors-fill-bgmain), 0 0 0 4px var(--colors-fill-primary);
}

.avatar.is-live .picture {
    box-shadow: 0 0 0 2px var(--colors-fill-bgmain), 0 0 0 4px var(--colors-fill-secondary);
}

.fawnstars-isotype-icon {
    position: absolute;
    height: 100%;
    width: 100%;
    border-radius: 50%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%;
    overflow: hidden;
    max-height: 100%
}

.avatar {
    width: 40px;
    min-width: 40px;
    position: relative;
    height: 40px
}

.username8 {
    position: relative;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.icon39 {
    position: relative;
    font-size: 20px;
    line-height: 20px;
    font-weight: 600;
    font-family: "Material Symbols Outlined";
    color: var(--colors-fill-secondary)
}

.inlineusername8 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon40, .location15 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location15 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinephotos4 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.icon41, .location16 {
    position: relative;
    line-height: 16px;
    font-weight: 600
}

.location16 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    font-family: Manrope;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.inlinevideos4 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 4px
}

.blockuserdata8, .inlinestats4 {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start
}

.inlinestats4 {
    flex-direction: row;
    gap: 8px;
    text-align: center;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.blockuserdata8 {
    flex: 1;
    flex-direction: column;
    gap: 4px
}

.iconclass9 {
    position: relative;
    line-height: 24px
}

.btnicon9 {
    border-radius: 4px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 4px;
    font-size: 24px;
    color: var(--colors-text-soft);
    font-family: "Material Symbols Outlined"
}

.cardsuggestionhorizontal4, .listedcards {
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.cardsuggestionhorizontal4 {
    border-radius: 8px;
    background-color: var(--colors-text-base_inverted);
    border: 1px solid var(--colors-fill-disabledHigh);
    flex-direction: row;
    padding: 8px 12px;
    gap: 12px
}

.listedcards {
    flex-direction: column;
    gap: 8px;
    font-size: 16px
}

.iconclass10 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.btnicon-sm {
    border-radius: 2px;
    background-color: var(--colors-text-base_inverted);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2px
}

.btnicon-sm .icon {
    color: var(--colors-text-base);
}

.icon42, .pagination1 {
    position: relative;
    line-height: 16px;
    font-weight: 500
}

.pagination1 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    font-family: Manrope
}

.labelpagination {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 16px;
    color: var(--colors-text-soft)
}

.iconclass11 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.btnicon-sm1, .pagination {
    display: flex;
    align-items: center;
    justify-content: center
}

.btnicon-sm1 {
    border-radius: 2px;
    background-color: var(--colors-text-base_inverted);
    flex-direction: column;
    padding: 2px;
    color: var(--colors-border-neutralbase)
}

.pagination {
    align-self: stretch;
    flex-direction: row;
    font-size: 20px;
    color: var(--colors-border-neutrallight);
    font-family: "Material Symbols Outlined";
    margin-top: 12px;
}

.pagination li a {
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    border: 1px solid var(--colors-fill-disabledHigh) !important;
}

.pagination li.disabled a {
    color: var(--colors-border-neutralbase)!important;
}

.pagination li:first-child a,
.pagination li:last-child a {
    font-family: "Material Symbols Outlined", sans-serif !important;
    border-radius: 4px;
    font-size: 24px !important;
    line-height: 24px !important;
}

.pagination li:first-child {
    margin-right: 12px;
}

.pagination li:last-child {
    margin-left: 12px;
}

.blocksuggestions, .wrappertopmargin {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start
}

.blocksuggestions {
    width: 280px;
    border-radius: 12px;
    gap: 12px
}

.wrappertopmargin {
    padding: 4px 0;
    text-align: left;
    font-size: 18px;
    max-width: 280px;
    color: var(--colors-text-base)
}

.suggest-slider {
    width: 100%;
}

.suggest-card-slider {
    display: flex!important;
    flex-direction: column;
    gap: 8px;
}

.pagebody {
    max-width: 1440px;
    padding: 0 100px;
    margin: 0 auto;
    text-align: left;
    font-size: 16px;
    color: var(--colors-text-base);
    font-family: Manrope;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 45px
}

.textcontent33 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.textcontent34, .textcontent35 {
    position: relative;
    line-height: 20px;
    font-weight: 500
}

.textcontent35 {
    font-size: 16px;
    line-height: 24px;
    font-family: Manrope;
    color: var(--colors-border-neutralbase)
}

.iconstart20 {
    line-height: 16px
}

.iconend3, .iconstart20, .textcontent36 {
    position: relative;
    font-weight: 500
}

.textcontent36 {
    line-height: 24px;
    font-family: Manrope
}

.iconend3 {
    line-height: 16px
}

.iconstart21 {
    line-height: 16px
}

.iconend4, .iconstart21, .textcontent37 {
    position: relative;
    font-weight: 500
}

.textcontent37 {
    line-height: 24px;
    font-family: Manrope
}

.iconend4 {
    line-height: 16px
}

.fawnstars-isotype-icon1 {
    width: 50.1px;
    position: relative;
    height: 48px
}

.creatoruser-home-desktop {
    width: 100%;
    position: relative;
    height: 3332px;
    text-align: center;
    font-size: 20px;
    color: var(--colors-text-link);
    font-family: "Material Symbols Outlined"
}

.feed-wrapper-right-top {
    padding-bottom: 12px;
}

/* Slider */

.pagination .slick-arrow.slick-disabled {
    pointer-events: none;
    opacity: .4;

}

.recommendation-suggestions {
    color: var(--colors-text-base) !important;
    font-family: Manrope;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 27px;
}

.main-container {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

.feed-wrapper-right {
    max-width: 280px;
}


@media screen and (max-width: 1200px) {
    /*.menusidebar {*/
    /*    !*position: absolute;*!*/
    /*    left: 150px;*/
    /*    z-index: 1;*/
    /*    width: 280px;*/
    /*    padding: 40px 0;*/
    /*    box-sizing: border-box;*/
    /*    gap: 32px;*/
    /*}*/
    .explore-posts {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

}
@media screen and (max-width: 1050px) {
    /*.menusidebar {*/
    /*    !*position: absolute;*!*/
    /*    left: 100px;*/
    /*    z-index: 1;*/
    /*    width: 280px;*/
    /*    padding: 40px 0;*/
    /*    box-sizing: border-box;*/
    /*    gap: 32px;*/
    /*}*/
}
@media screen and (max-width: 750px) {
    /*.menusidebar {*/
    /*    display: none;*/
    /*    !*position: absolute;*!*/
    /*    left: 50px;*/
    /*    z-index: 1;*/
    /*    width: 280px;*/
    /*    padding: 40px 0;*/
    /*    box-sizing: border-box;*/
    /*    gap: 32px;*/
    /*}*/

    .tip-word {
        display: none;
    }

    .feed-wrapper-right, .blocksuggestions {
        max-width: none;
        width: 100%;
    }
}
@media screen and (max-width: 450px) {
    .menusidebar {
        display: none!important;
    }

    .tip-word {
        display: none;
    }
    .blocksuggestions {
        width: 320px !important;
        border-radius: 12px;
        gap: 12px;
        display: contents;
    }

    .timestamp {
        display: none !important;
    }

    .timestamp-mobile {
        display: block !important;
    }

    .inlineusername {
        display: flex !important;
        flex-direction: column !important;
        align-items: start !important;
        justify-content: flex-start;
        gap: 4px
    }
}
/*Slider*/
.media-container {
    position: relative;
}

.media-container .carousel-item img {
    object-fit: contain;
}

.media-container .paid-post + .cardimg-icon,
.media-container .carousel-item.locked-item picture,
.media-container .carousel-item.locked-item img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.slider-arrow {
    border: 1px solid var(--colors-border-deep);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    background: var(--colors-overlay-backdrop);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--colors-text-base);
}

.slider-arrow:not(.slick-disabled):hover,
.slider-arrow:not(.slick-disabled):active,
.slider-arrow:not(.slick-disabled):focus {
    background: var(--colors-fill-bgmain);
}

.slider-arrow.slick-disabled {
    border-color: var(--colors-border-neutralbase);
    color: var(--colors-text-soft);
}

.slider-arrow.slick-disabled svg {
    opacity: 50%;
}

.prev-arrow {
    left: 12px;
}

.next-arrow {
    right: 12px;
}

.page-indicator {
    position: absolute;
    bottom: 12px;
    left: 50%;
    transform: translateX(-50%);
    padding: 2px 4px;
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--colors-text-base);
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
    background: var(--colors-overlay-backdrop);
    border-radius: 4px 4px 0 0;
}