.userspacetop {
    height: 168px;
	position: absolute;
    width: calc(100% - 72px);
}
.userspacecontent {
    margin-top: 168px;
	background-color: #f0f0f0;
}
.mod_content {
    background-color: #e9e9e9;
}
.userspacetop::before {
    content: '';
    pointer-events: none;
    position: absolute;
    z-index: 2;
    background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(rgba(208 208 208, 1)));
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(208 208 208) 100%);
    height: 168px;
    width: 100%;
    left: 0;
    top: 0;
}
.userspacetop::after {
    content: '';
    pointer-events: none;
    position: absolute;
    z-index: 2;
    background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), to(rgba(249 249 250, 1)));
    background: linear-gradient(360deg, rgba(255, 255, 255, 0) 0%, rgb(249 249 250) 100%);
    height: 168px;
    width: 100%;
    left: 0;
    top: 0;
}
#userspace-nav .modal-dialog .topavatar {
    top: -48px;
}
.topavatar .badge {
    bottom: -12px;
    right: -12px;
}
.topavatar .gd-primary {
    color: #fff;
    border: none;
    background: linear-gradient(45deg, #0088fd 0%, #003bff 50%, #001faa 100%);
}

.userspace-description {
    color: #99a0ac;
    font-family: "acumin-pro-wide", "Acumin Pro Wide", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.68;
    margin: 0 auto;
    letter-spacing: 2px;
	text-align: justify;
}
#followmod {
    width: 108px;
}
#grid {
    top: 8px;
}
.topavatar {
    position: absolute;
    top: -48px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .topavatar {
   position: absolute;
   top: 20px !important;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .w-96 {
   width: 64px;
   height: 64px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.userspaceaside {
   margin-top: 70px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .userspaceaside {
   margin-top: 20px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.userspacexa {
   width: 0px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .userspacexa {
   width: 88px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.userspaceen {
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .userspaceen {
   display: none;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .userspacesticky {
   top: 60px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.topavatar .badge {
   padding: 3px 5px 3px 5px;
   font-size: 12px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.scroll-up .topavatar .badge {
   padding: 2px 4px 2px 4px;
   font-size: 10px;
   transition: all .85s;
   -webkit-transition: all .85s;
}
.userspacelist1 {
   width: 80px;
}
.nav-active-border .badge {
   margin-right: 15px;
}
.nav-active-border {
   background-color: #f0f0f0;
   transition: all .25s;
   -webkit-transition: all .25s;
}
.scroll-up .nav-active-border {
   background-color: #f0f0f0;
   top: 15px;
   transition: all .25s;
   -webkit-transition: all .25s;
}
.nav-active-border .nav-link:before, .nav-active-border li>a:before {
    border-bottom-width: 1px;
}
.nav-active-border .nav-link.active:before, .nav-active-border li>a.active:before {
    border-bottom-color: #192039;
}

.w-96 {
    width: 96px;
    height: 96px;
}
.px-6 {
    padding-left: 2.5rem !important;
}