/* latin */
@font-face {
    font-family: 'ximiNova-regular';
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-Regular.otf);
}
/* latin */
@font-face {
    font-family: 'ximiNova-regular-italic';
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-RegularItalic.otf);
}
/* latin */
@font-face {
    font-family: 'ximiNova-sbold';
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-Sbold.otf);
}
/* latin */
@font-face {
    font-family: 'ximiNova-sbold-italic';
    font-style: normal;
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-SboldItalic.otf);
}

/* latin */
@font-face {
    font-family: 'ximiNova-semibold';
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-Semibold.otf);
}

/* latin */
@font-face {
    font-family: 'ximiNova-semibold-italic';
    src: url(https://roborock.s3.amazonaws.com/forum/themes/Cloudy/design/fonts/ProximaNova-SemiboldItalic.otf);
}

body {
    overflow-x:hidden;
    background:#EFEFEF;
    background-size:cover;
    /*padding-bottom: 120px;*/
    font-family: 'ximiNova-regular';
}
header {
    padding:0;
    margin-bottom:0;
    border-radius:3px 3px 0 0;
    position:relative;
    background-color: #fff;
    margin-bottom: 20px;
}
.norow {
    margin:0!important;
}
.whitespace {
    padding:0;
    width:1200px;
    margin:0 auto;
}
input, input:hover, input:focus {
    outline:0
}
input[type="checkbox"]:focus, input[type="radio"]:focus {
    outline:0
}
a.Close:hover {
    text-decoration:none
}
.logocol {
    padding: 0;
    width: 10%;
}
.logocol a {
    display:block;
    font-size:36px;
    font-weight:500;
    color:#333;
    transition:all .3s;
    letter-spacing:-3px;
    text-transform:uppercase;
    font-weight:500;
    display:inline-block;
    color:#000
}
#sign_button {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    height: 22px;
    -webkit-border-radius: 14px;
    -moz-border-radius: 14px;
    border-radius: 14px;
    background-color: #52BD8A;
    color: #fff;
    font-size: 14px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -ms-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    padding:0 10px;
    max-width: 120px;
    margin-left: 40px;
    min-width: 80px;
    justify-content: center;
}
#sign_button .sign_img {
    position: absolute;
    width: 35px;
    height: 35px;
    top: 0;
    right: 100%;
    background-image: url(./coins_icon.png);
    background-size:2500% 100%;
    background-position: left;
    background-repeat: no-repeat;
    transform: translateY(-14px);
}
#sign_button.isCheckin .sign_img {
    animation-timing-function: steps(24);
    animation-name: stepsV1;
    animation-duration: 0.85s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    background-position: right;
    transition: all 0.2s ease-out 0s;
}

#sign_button:hover {
    background-color: #3EAB77;
}
#sign_button .num {
    position: absolute;
    top: -10px;
    right: 0;
    color: #F7BA13;
    font-size: 12px;
    font-style: normal;
    opacity: 0;
}
#sign_button .num.isShow {
    -webkit-animation: getOresAnimation 1.5s 0.3s ease-out;
    -o-animation: getOresAnimation 1.5s 0.3s ease-out;
    animation: getOresAnimation 1.5s 0.3s ease-out;
}
@keyframes getOresAnimation {
    from {
        color: #F7BA13;
        top: -10px;
        opacity: 1;
    }
    to {
        color: #F1E3B9;
        top: -20px;
        opacity: 0;
    }
}
#sign_button .diamond-icon {
    position: absolute;
    top: 50%;
    left: 10px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 20px;
    height: auto;
}
#sign_button.isCheckin {
    background-color: #F7B500;
}

.ores {
    cursor: pointer;
    font-size: 14px;
    color: #999;
    font-family: 'ximiNova-regular';
    position: relative;
    height: 60px;
    line-height: 60px;
}
.ores_rules {
    background-color: #F9F9F9;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    padding:0 20px;
    width: 293px;
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
}
.ores_rules .center-content {
    max-width: 1200px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.ores_rules.show {
    max-height: 1000px;
    height: auto;
}
.ores_rules .rules-item {
    padding-top: 24px;
}
.ores_rules .rules-item:nth-last-child(1){
    padding-bottom: 20px;
}
.ores_rules .rules-item .title img {
    width: 18px;
}
.ores_rules .rules-item .title {
    line-height: 2em;
    font-size: 14px;
}
.ores_rules .rules-item ul li {
    color: #333333;
    line-height: 1.5em;
    font-size: 12px;
}
.ores:hover {
    color: #52BD8A;
}
.ores span {
    color: #7e7f84;
    font-family: 'ximiNova-regular';
    font-size: 14px;
}
.logocol a img {
    width: 40px;
    height: 40px;
}
body#vanilla_discussions_index .FilterMenu {
    display:none
}
.SignInPopupi.gray:before {
    font-size:12px;
    line-height:12px;
    margin-right:4px;
    content:"\e802";
    font-family:'Linearicons-Free'
}
.black.steamjq:before {
    margin-right:4px;
    line-height:11px;
    content:"\e867";
    font-family:'Linearicons-Free'
}
.footerwidets .col-md-6 {
    padding-left:22px
}
a.demarket {
    text-align:center
}
body.Section-PostDiscussion div.steam-line {
    display:none
}
#searching {
    height:220px;
    background-size:cover;
    border-bottom:1px solid #EFEFEF
}
#adz {
    text-align:center;
    padding:30px;
    background:url(steam/99.png) left;
    background-size:cover;
    display:none
}
#Frame {
    background-color: #efefef;
}
.Button.Primary.Action.NewDiscussion.BigButton {
    background:#333;
    color:#fff;
    text-align:center;
    font-size:15px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    margin-bottom: 0;
}
.Button.Primary.Action.NewDiscussion.BigButton:hover {
    opacity: 1;
}
.BoxCategories h4:before {
    font-family:'fontawesome';
    content:"\f02c";
}
.BoxCategories h4 {
    position:relative
}
.BoxCategories h4:after {
    width:0;
    position:absolute;
    bottom:-7px;
    left:20px;
    content:"";
    height:0;
    border-left:7px solid transparent;
    border-right:7px solid transparent;
    border-top:7px solid #65c178
}
.Media {
    margin:5px 0 60px
}
.searchio {
    z-index:0;
    position: relative;
    width: 60%;
}
.searchio .Button {
    position:absolute;
    top:50%;
    right:10px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index:1;
    font-size:0;
    background: url(https://roborock.s3.amazonaws.com/images/forum/search.png) center no-repeat;
    vertical-align: middle;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    padding: 0;
    width: 16px;
    height: 16px;
}
.searchio .Button:hover, .searchio .Button:focus {
    opacity: 1;
}
.searchio .InputBox {
    border-radius:100px;
    background:#fff;
    padding-left: 20px;
    padding-right:50px!important;
    color:#333;
    border:1px solid #EFEFEF;
    transition:all .3s;
    font-size:13px;
    margin-bottom: 0px;
}
.searchio i {
    position:absolute;
    top:17px;
    right:17px;
    font-size:26px;
    color:#fff;
    z-index:0
}
.BreadcrumbsWrapper {
    position:relative;
    top:25px
}
.Discussions .Item, .Item.Read {
    background:none;
    border:none;
    padding:30px;
    padding:18px;
    padding-left:0;
    padding-bottom:0
}
li.iop {
    transition:all 3.3s;
    position:absolute;
    min-height:100%;
    width:1px;
    border-right:1px dotted rgba(187, 187, 187, 1);
    left:30px;
    top:30px
}
.PhotoWrap img {
    background:#fff;
    border-radius:50px;
    height:58px;
    width:58px
}
.Bottom .steam-btn {
    display:none
}
.PhotoWrap-Category, ul.Discussions .PhotoWrap {
    float:left;
    margin-right:24px;
    position:relative;
    background:#fff
}
.ItemDiscussion .Meta {
    margin-left:75px;
    padding-bottom:20px;
    position: relative;
    display: block;
}
.ItemDiscussion .Meta:after {
    position: absolute;
    bottom: 0;
    content: '';
    width: 100%;
    height: 1px;
    background-color: #EEEFEF;
    right: 0;
}
.ItemDiscussion .Voter .VoteUp {
    cursor: default;
}
ul.Discussions li:last-child {
    background:#fff;
    padding-top:0;
    margin-top:30px
}
.Options ul.MenuItems li:last-child {
    margin-top: 0;
}
body.Section-DiscussionList ul.Discussions li:last-child {
    margin-top:0
}
body.Section-DiscussionList ul.Discussions li:first-child {
    padding-top: 0;
}

ul.Discussions li:last-child .Meta {
    border-bottom:none
}
.Item.Read {
    opacity:1
}
.Tag-Announcement {
    cursor:help;
    position:relative;
    background-color: #52BD8A;
    font-size: 11px;
    padding: 2px 8px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.DataList .Item .Title, .Item.Read .Title {
    color: rgba(51,51,51,1);
    font-size: 14px;
    overflow: hidden;
    line-height: 1;
}
.DataList .Item .Title, .Item.Read .Title:hover {
    text-decoration: none;
}
.DataList.Discussions {
    padding: 35px 30px;
}
ul.CategoryList {
    margin-top:40px
}
ul.CategoryList>.Item {
    margin-top: 40px;
}
ul.CategoryList li {
    padding-top:5px!important;
    padding-left:0!important;
    background:none!important;
    border:none!important
}
ul.CategoryList li.iop {
    border-right:1px dotted rgba(187, 187, 187, 1)!important
}
ul.CategoryList li:last-child {
    background:#fff!important;
    padding-top:0!important
}
ul.CategoryList li:last-child .Meta {
    border-bottom:none
}
.CategoryDescription {
    max-height:30px;
    overflow:hidden;
    color:#666;
    font-size: 13px;
    margin-bottom: 9px;
}
ul.CategoryList li:last-child {
    max-height:147px;
    min-height:147px
}
.GuestBox {
    margin-top:35px;
    margin-bottom:35px
}
.GuestBox #FacebookAuth img {
    display:none
}
.GuestBox #FacebookAuth:after {
    transition:all .3s;
    display:block;
    padding:12px;
    margin:0 42px 5px;
    text-align:center;
    color:#fff;
    background:#2D4486;
    border-radius:4px;
    content:"Login with Facebook"
}
.GuestBox #FacebookAuth:hover:after {
    background:#1D3372
}
.GuestBox #TwitterAuth:hover:after {
    background:#008FCC
}
.GuestBox #TwitterAuth img {
    display:none
}
.GuestBox #TwitterAuth:after {
    transition:all .3s;
    display:block;
    padding:12px;
    margin:0 42px;
    text-align:center;
    color:#fff;
    background:#00A5EC;
    border-radius:4px;
    content:"Sign in with Twitter"
}
.GuestBox a:hover, .GuestBox a:focus {
    text-decoration:none
}

.BoxCategories {
    margin:0px;
}
.BoxCategories h4 {
    margin-top:-5px;
    background:#65c178;
    padding:16px;
    color:#fff;
    border-radius:3px;
    text-transform:capitalize;
    font-weight:400;
    font-size:15px
}
.PanelCategories li a {
    color:#777;
}
.PanelCategories li img {
    width: 100%;
    height: auto;
}
.PanelCategories li a:hover, .PanelCategories li a:focus {
    text-decoration:none
}
.PanelCategories .Aside {
    float:left;
    margin-right:7px
}
.relative {
    position:relative
}
.steam-line {
    width:1px;
    position:absolute;
    top:0;
    left:349px;
    background:#EFEFEF;
    height:100%;
    min-height:100%
}
.footitle {
    color:#fff;
    font-weight:600;
    margin:10px 0 20px;
    font-size:14px;
    border-bottom:1px dotted rgba(255, 255, 255, .2);
    padding-bottom:12px
}
.footerw p {
    opacity:1;
    color:rgba(255, 255, 255, .6);
    font-weight:400
}
.marginate {
    margin:27px 0 20px
}
.marginate img {
    filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter:gray;
    -webkit-filter:grayscale(100%);
    transition:all .3s;
    -moz-transition:all .3s
}
.marginate img:hover {
    filter:none;
    transition:all .3s;
    -moz-transition:all .3s;
    filter:none;
    -webkit-filter:grayscale(0%)
}
.lbflinks {
    margin-top:-3px
}
.footerw {
    line-height:24px;
    opacity:1
}
h3.opb {
    opacity:0
}
#social ul {
    list-style:none;
    margin:12px 0 0;
    float:right
}
#social li {
    padding-bottom:5px;
    border-radius:100%;
    display:inline;
    float:left;
    margin-left:4px;
    overflow:hidden
}
#social a {
    color:#333;
    line-height:0;
    transition:all .1s ease;
    text-align:center
}
#social a:hover {
    opacity:1
}
#social li:hover {
    opacity:1
}
#social li a:hover {
    opacity:1
}
#social li:hover a {
    opacity:1
}
.fa-facebook, .fa-twitter, .fa-dribbble, .fa-google-plus, .fa-rss {
    background:rgba(255, 255, 255, 0.70);
    transition:all .5s;
    height:30px;
    width:30px;
    padding:6px 5px 5px 6px;
    color:#21242C;
    border-radius:100%;
    font-size:20px
}
.fa-facebook:hover {
    background:#3C5A98;
    color:#fff
}
.fa-twitter:hover {
    background:#14C4FF;
    color:#fff
}
.fa-dribbble:hover {
    background:#F26798;
    color:#fff
}
.fa-google-plus:hover {
    background:#DD4835;
    color:#fff
}
.fa-rss:hover {
    background:#F90;
    color:#fff
}
#social i {
    font-size:20px;
    position:relative;
    top:1px
}
.fa-facebook:hover, .fa-twitter:hover, .fa-dribbble:hover, .fa-google-plus:hover, .fa-rss:hover {
    opacity:1
}
.Pager {
    font-weight:400;
    text-align:center;
    float:none
}
.Pager a {
    color:#333
}
#orifooter {
    border-radius:0 0 3px 3px
}
.Count {
    display:inline-block!important;
    width:21px!important;
    background:#65c178;
    border-radius:50px;
    padding:3px 0;
    text-align:center;
    font-size:11px
}
.steam-panel .GuestBox {
    display:none
}
.GuestBox {
    text-align:center
}
.GuestBox h4 {
    font-size:17px;
    font-family:'Roboto';
    font-weight:500;
    text-transform:capitalize
}
.GuestBox p {
    color:#AFAFAF;
    text-align:left;
    font-size:14px
}
.black {
    background:#333
}
.black:hover, .gray:hover {
    background:#818181
}
.Button {
    border-radius:3px;
    font-size:14px
}
body.Section-Profile .fulix {
    transition:all .3s;
    border-radius:5px;
    padding:10px;
    border:1px solid #ccc;
    margin-bottom:7px
}
body.Section-Profile .fulix label {
    transition:all .3s;
    color:#A5A5A5;
    padding:0;
    margin:0 0 5px;
    display:block;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase
}
body.Section-Profile .fulix input, body.Section-Profile .fulix textarea {
    background:none;
    transition:all .3s;
    color:#333;
    padding:0;
    margin:0;
    display:block;
    font-size:14px;
    font-weight:400;
    border:none
}
body.Section-Profile .fulix textarea {
    border:none!important
}
body.Section-Profile .fulix input:hover, body.Section-Profile .fulix input:focus, body.Section-Profile .fulix textarea:hover, body.Section-Profile .fulix textarea:focus {
    background:none
}
body.Section-Profile .fulix:hover {
    border:1px solid #8D8D8D
}
body.Section-Profile .fulix:hover label {
    color:#595959
}
body.Profile.EditMode #Content form {
    padding: 0;
    background:none
}
body.Profile.EditMode ul li label, div.Popup form ul li label {
    margin:0;
    font-size:13px;
    margin-bottom:5px
}
body.Section-Profile h2 {
    margin-bottom:20px
}
body.Profile .Box.GuestBox {
    display:none
}
body.Section-Profile .col-md-4 .Buttons input {
    margin-bottom:100px
}
body.Section-Profile .fulix .col-md-4 .Buttons input {
    margin-bottom:10px;
    background:#039DDB;
    padding:15px;
    color:#fff
}
.olaq {
    margin:-80px 0 10px
}
body.Section-Profile div.steam-line {
    min-height:0;
    height:-moz-calc(100%);
    height:-webkit-calc(100%);
    height:-o-calc(100%);
    height:calc(100%)
}
li.Gender.User-Gender {
    margin-top:20px
}
body.Section-Profile .UserBox {
    text-align:center;
    background-color: #fff;
    position: relative;
    padding-bottom: 20px;
}
body.Section-Profile .UserBox .PhotoWrap {
    margin: 0;
    margin-bottom: 20px;
    position: relative;
}
body.Section-Profile .UserBox .signature {
    margin-bottom: 10px;
    color: #9B9B9C;
    font-size: 12px;
    padding: 0 20px;
    padding-top: 10px;
    word-break: break-word;
}
body.Section-Profile .UserBox .bgimage {
    width: 100%;
    height: 80px;
    position: absolute;
    object-fit: cover;
}
body.Profile .PanelColumn .UserBox .PhotoWrap img {
    height:80px;
    width:80px;
    margin-top: 40px;
}
body.Section-Profile h4, .Preferences h3 {
    font-size:14px;
    font-family:'Roboto';
    font-weight:700;
    text-transform:uppercase
}
.Preferences h3 {
    margin:36px 0 7px
}
table.PreferenceGroup td.Depth_1 {
    padding-left:10px
}
table.PreferenceGroup tbody tr td {
    transition:all .3s
}
table.PreferenceGroup tbody tr:hover td {
    background:#efefef
}
.UserBox .WhoIs {
    min-height:40px;
    line-height:1.7
}
.ActivateSlider {
    display:inline-block;
    background:#E7E7E7;
    box-shadow:none
}
.Connection-Connect .Button {
    transition:all .3s
}
.Connection-Connect .Button:hover {
    background:#65c178;
    opacity:1
}
.ore {
    background:#65c178;
    margin-top:7px
}
.Info {
    padding:12px
}
ul.DataList-Connections li.Item {
    margin:20px 0
}
table.PreferenceGroup {
    width:100%
}
table.PreferenceGroup th, table.PreferenceGroup td, #Form_Invitation th, #Form_Invitation td {
    padding:10px 0;
    border-bottom:1px solid #ECECEC
}
.ProfileOptions {
    margin-top: 20px;
    margin-right: 20px;
}

.ProfileOptions .ProfileButtons {
    position:relative
}
.ProfileOptions a.ProfileButtons {
    color:#333
}
.ProfileOptions a.ProfileButtons:hover {
    color:#999
}
body.EditMode .ProfileOptions .ProfileButtons:before {
    content:"\f0a8";
    position:absolute;
    top:-3px;
    left:-17px;
    margin-right:7px;
    font-family:'FontAwesome';
    color:#039ddb;
    font-size:17px
}
#ConversationForm label {
    display:block;
    text-align:left;
    color:#666;
    font-size:14px;
    font-weight:700;
}
body.Section-Conversation #Panel .Button {
    background-color: #eb0028;
    padding: 10px 0;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}
.ClearConversation {
    background:#1F1F1F;
    margin-bottom:40px!important
}
.ClearConversation:hover {
    background:#333
}
.MeBox .PhotoWrap {
    margin-right:7px;
    margin-top:-5px;
    display: none;
}
.MeBox .Username {
    display: none;
}
.UserBox, .MeBox {
    margin: 0;
}
body.Section-Conversation .Conversation .Item .PhotoWrap {
    padding:4px;
    padding-left:0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
}
body.Section-Conversation .Conversation .Item.Mine  .PhotoWrap {
    justify-content: flex-start;
    flex-direction: row-reverse;
}
body.Section-Conversation .Conversation .Item .message-content {
    text-align: right;
    padding: 2px 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #e6e6e6;
    margin-right: 10px;
}
body.Section-Conversation .Conversation .Item.Mine .message-content {
    text-align: left;
    max-width: 70&;
}
body.Section-Conversation .Message p {
    margin: 0;
}
body.Section-Conversation .PhotoWrap img {
    position:relative;
    top:-4px;
    left:0
}
body.Section-Conversation .Meta {
    margin:0
}
body.Section-Conversation .DataList .Meta {
    border:none
}
body.Section-Conversation .fulix {
    margin-bottom:70px
}
body.Section-Conversation .fulix input {
    background:#039ddb;
    color:#fff
}
body.Section-Conversation .fulix textarea {
    margin-bottom:20px
}
body.Section-Conversation .Message {
    padding:15px 0;
    padding-left: 15px;
    margin-right:20px;
    margin-top: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
body.Section-Conversation .Mine .Message {
    justify-content: flex-start;
    flex-direction: row-reverse;
}
body.Section-Conversation .Message .sendMessageUser {
    color: rgba(0,0,0,.3);
}
.messageBox ul.Conversation>li {
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}
.messageBox ul.Conversation>li .userContent .message-content {
    -webkit-transition: all .2s linear;
    -moz-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition: all .2s linear;
    transition: all .2s linear;
    margin-left: 10px;
    text-align: left;
}
.messageBox ul.Conversation>li:hover .userContent .message-content{
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

.messageBox .H>a {
    color: #eb0029;
}
body.Section-Conversation ul.Conversation .Author a.Name {
    position:relative;
    top:15px
}
body.Section-Conversation .fulix input:hover {
    background:#039ddb;
    opacity:.8
}
ul.Conversation {
    position:relative;
}
ul.Conversation li:last-child .Message {
    border:none
}
.olm .CommentForm .FormWrapper, .olt {
    padding-left:10px!important
}
.olm {
    margin-top:50px
}
.col-md-4 .Buttons input {
    padding:14px;
    width:100%
}
body.Section-PostConversation h1 {
    margin-bottom:36px
}
body.Section-PostConversation .steam-line {
    display:none
}
body.Section-PostConversation .ContentColumn .Button {
    background:#eb0029;
    border:none;
    box-shadow:none;
    text-shadow:none;
    color:#fff;
    font-size:13px;
    border-radius:50px;
    margin-left:0
}
body.Section-PostConversation .ContentColumn .Button:first-child {
    margin-right: 20px;
}
.fulix {
    transition:all .3s;
    border-radius:5px;
    padding:10px;
    border:1px solid #ccc;
    margin-bottom:7px
}
.fulix label {
    transition:all .3s;
    color:#A5A5A5;
    padding:0;
    margin:0 0 5px;
    display:block;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase
}
.fulix textarea {
    background:none;
    transition:all .3s;
    color:#333;
    padding:0;
    margin:0;
    display:block;
    font-size:14px;
    font-weight:400;
    border:none
}
.fulix textarea, .fulix .FormWrapper-Condensed {
    border:none!important;
    padding-top:10px!important;
    padding-left:0!important;
    background:#fafafa;
    padding-bottom:10px
}
.fulix textarea {
    border:none!important;
    background:#fafafa;
    border-radius:3px;
    padding:0 10px 10px!important
}
body.Section-Conversation .fulix .row {
    height:50px
}
.fulix textarea:hover, .fulix textarea:focus {
    background:none
}
.fulix:hover {
    border:1px solid #8D8D8D
}
.fulix:hover label {
    color:#595959
}
.fulix img {
    display:none
}
.AddPeople {
    transition:all .3s;
    border-radius:5px;
    padding:10px;
    border:1px solid #ccc;
    margin-bottom:7px
}
.AddPeople h4 {
    transition:all .3s;
    color:#A5A5A5;
    padding:0;
    margin:0 0 5px;
    display:block;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase
}
.AddPeople textarea {
    background:#FAFAFA;
    transition:all .3s;
    color:#333;
    padding:0;
    margin:0;
    display:block;
    font-size:14px;
    font-weight:400;
    border:none
}
.AddPeople textarea, .AddPeople .FormWrapper-Condensed {
    margin-bottom:0!important;
    padding:10px;
    border:none!important;
    padding-left:10px!important
}
.AddPeople:hover {
    border:1px solid #8D8D8D
}
.AddPeople:hover label {
    color:#595959
}
.AddPeople img {
    display:none
}
.AddPeople .Buttons {
    margin:0;
    padding:10px 50px
}
.AddPeople .Buttons input {
    width:100%
}
.Errors ul li {
    background:#65c178!important;
    color:#fff!important;
    text-align:left
}
.Errors ul {
    background:#65c178!important;
    border:1px solid #65c178!important;
    padding:14px;
    display:block;
    border-radius:3px;
    -moz-border-radius:3px;
    min-height:42px;
    -webkit-border-radius:3px;
    position:relative;
    padding-left:50px
}
.Errors ul:before {
    content:"\f00d";
    font-family:'FontAwesome';
    position:absolute;
    top:7px;
    left:16px;
    font-size:25px;
    color:#fff
}
body.Section-Entry .MultipleEntryMethods .MainForm {
    width:100%
}
body.Section-Entry .fulix:hover .Gloss {
    color:#595959
}
body.Section-CategoryList .DataList .Meta, body.Section-DiscussionList .DataList .Meta {
    margin-left:78px;
    margin-right:0
}
body.Section-DiscussionList .DataList .Meta {
    padding-bottom:20px;
    display: block;
}
.underlin a {
    text-decoration:underline;
    transition:all .3s
}
a.ForgotPassword {
    text-decoration:none;
    transition:all .3s
}
.underlin a:hover, a.ForgotPassword:hover {
    opacity:.7
}
.Gloss {
    transition:all .3s;
    font-size:12px;
    margin-top:-6px;
    font-weight:400;
    color:#CCC;
    margin-bottom:5px
}
.PasswordStrength .StrengthText {
    padding-top:5px
}
.rright {
    margin-top:10px
}
.chekco {
    margin-top:0
}
.FormWrapper {
    background:#fff;
    padding:0
}
.clearme {
    clear:both
}
.discusx .Reactions {
    display:none
}
.ItemDiscussion .Message {
    border-bottom:1px solid #ECECEC;
    padding-bottom:16px;
    position:relative;
    font-size: 16px;
    color: #000;
    margin-bottom: 20px;
    margin-top: 20px;
}
.ItemDiscussion .Message p {
    font-family: 'ximiNova-regular';
    margin-top: 0;
    margin-bottom: 0;
}
.discusx {
    position:relative
}
div.iop {
    position:absolute;
    min-height:100%;
    width:1px;
    border-right:1px dotted rgba(187, 187, 187, 1);
    left:27px;
    top:30px
}
.DiscussionHeader .PhotoWrap, .CommentHeader .PhotoWrap {
    float:left;
    position:relative;
    top:0px;
    padding:5px 0;
    background:#fff
}
.DiscussionForm {
    margin-bottom:40px
}
#DiscussionForm h1 {
    padding: 0 30px;
}
.nocommentwrap {
    background:#039ddb;
    border-radius:100%;
    border:5px solid #F0F0F0;
    text-align:center;
    height:62px;
    width:62px;
    transition:all .3s
}
.nocommentwrap:hover {
    background:#65c178
}
.DataBox-Comments:hover .nocommentwrap {
    background:#65c178
}
.nocommentwrap i {
    color:#fff;
    font-size:30px;
    margin:0!important;
    padding-top:10px;
    padding-left:10px
}
.sja {
    font-size:21px;
    color:#6F6F6F;
    transition:all .4s ease;
    float:left;
    margin:0;
    margin-top:15px
}
.ncwrap {
    float:left;
    margin-right:13px;
    position:relative;
    top:-7px;
    left:-2px;
    padding:10px 0;
    background:#fff
}
.Note {
    transition:all .3s;
    background:#039ddb;
    margin:0 25px 50px 72px;
    color:#fff;
    position:relative
}
.Note:before {
    font-family:'FontAwesome';
    position:absolute;
    color:#fff;
    font-size:38px;
    top:11px;
    left:16px;
    content:"\f05a"
}
.Note {
    font-size:14px;
    font-weight:400;
    padding:10px 10px 10px 62px;
    min-height:60px;
    border-radius:4px;
    line-height:40px
}
.Note a {
    color:#fff;
    font-weight:400
}
.Note:hover {
    background:#65c178
}
.PageDescription {
    background:#039ddb;
    margin:45px 18px 0 0;
    color:#fff;
    position:relative;
    display: none;
}
.PageDescription:before {
    font-family:'FontAwesome';
    position:absolute;
    color:#fff;
    font-size:38px;
    top:32%;
    left:16px;
    content:"\f0e8"
}
.PageDescription {
    font-size:14px;
    font-weight:400;
    padding:10px 10px 10px 62px;
    min-height:60px;
    border-radius:4px;
    line-height:40px
}
.PageDescription a {
    color:#fff;
    font-weight:400
}
.PageDescription {
    font-size:14px;
    font-weight:400;
    padding:18px 18px 18px 68px;
    min-height:60px;
    border-radius:4px;
    line-height:25px
}
.Empty {
    background:#f3f3f3;
    margin:30px 18px;
    color:#000;
    position:relative
}
.Empty:before {
    font-family:'FontAwesome';
    position:absolute;
    color:#000;
    font-size:38px;
    top:14px;
    left:16px;
    content:"\f00d"
}
.Empty {
    font-size:14px;
    font-weight:400;
    padding:14px 14px 14px 62px;
    min-height:60px;
    border-radius:4px;
    line-height:40px
}
.Empty a {
    color:#000;
    font-weight:400
}
body.Discussion ul.Comments {
    width:100%;
    top:-33px;
}
body.Discussion ul.Comments li {
    background:none;
    border:none;
    padding-left:0;
    margin-top: 40px;
}
body.Discussion ul.Comments li:after {
    content: '';
    height: 1px;
    background-color: #eeefef;
    position: absolute;
    bottom: 0;
    width: 90%;
    right: 0;
    left:70px;
}
body.Discussion ul.richEditor-menuItems li:after {
    background: none;
}
li.iopo {
    height:-moz-calc(100% - 100px);
    height:-webkit-calc(100% - 100px);
    height:-o-calc(100% - 100px);
    height:calc(100% - 100px);
    position:absolute;
    min-height:100%;
    min-height:0;
    width:1px;
    border-right:1px dotted rgba(187, 187, 187, 1)!important;
    left:30px;
    top:30px
}
li.ItemComment .Meta {
    padding-bottom:0;
    border:none;
    position:relative;
    top:-12px;
    margin:0;
    margin-left:65px;
    display: block;
}
li.ItemComment .Reactions {
    margin-top: 0;
    padding-bottom: 26px;
    border-bottom: 1px solid #eee;
}
li.ItemComment .Reactions a {
    color: #9B9B9C;
    font-size: 12px;
}
li.ItemComment .Message {
    margin-top:5px;
    margin-left:70px;
}
.PageTitle .Reactions .ReactButton {
    color: #fff;
    font-size: 16px;
    position: relative;
    padding-left: 25px;
    font-family: 'ximiNova-regular';
}
.PageTitle .Reactions .ReactButton:before {
    content: '';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    background: url(https://roborock.s3.amazonaws.com/images/forum/page_title_edit@3.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    width: 16px;
    height: 16px;
}
.Reactions .ReactButton {
    color: #9B9B9C;
    font-size: 12px;
    padding-left: 19px;
    position: relative;
}
.DataBox-Comments .Reactions .ReactButton:before {
    position: absolute;
    top: 50%;
    left: 0;
    width: 16px;
    height: 16px;
    content: '';
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    background: url(https://roborock.s3.amazonaws.com/images/forum/edit_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
body.Section-Discussion li.ItemComment .Message {
    margin-right:20px;
    margin-top: 0;
    margin-bottom: 0px;
}
.MItem a, time {
    opacity: 1;
}
body.Section-Discussion li.ItemComment .Message p {
    margin: 0;
    font-family: 'ximiNova-regular';
    line-height: 20px;
}
.comment_bottom_btn .childVoteUp {
    color: #9B9B9C;
    font-size: 12px;
    position: relative;
    padding-left: 25px;
    margin-right: 20px;
}
.comment_bottom_btn .childVoteDown {
    color: #9B9B9C;
    font-size: 12px;
    position: relative;
    padding-left: 25px;
    margin-right: 20px;
    font-family: 'ximiNova-regular';
}
body.Section-Discussion .fulix, .Section-Conversation .fulix {
    margin-right:20px
}
.Message {
    font-size:13px;
    font-family:'Roboto';
    line-height:25px
}
.CommentHeader .PhotoWrap {
    padding:10px 0 10px;
    margin-right: 15px;
}
.Comment img {
    position:relative;
}
li.ItemComment .Author a.Username {
    line-height:50px;
    font-family: 'ximiNova-sbold';
}
body.Discussion ul.MenuItems li {
    margin-top: 0;
}
body.Discussion ul.Comments li:first-child{
    margin-top: 0;
}
body.Discussion ul.Comments li:last-child {
    padding-top:0
}
body.Discussion ul.Comments li.richEditor-menuItem {
    margin-top: 0px;
}
body.Discussion ul.Comments li.richEditor-menuItem:first-child {
    margin-top: 0px;
}
body.Discussion ul.Comments li.richEditor-menuItem:last-child {
    background:transparent !important;
    padding-top:0
}
body.Discussion ul.Comments li:last-child .Message {
    border:none
}
body.Section-Discussion .fulix .Back {
    margin-left:18px
}
body.Section-Discussion .fulix {
    transition:all .3s;
    border-radius:5px;
    padding:10px;
    border:1px solid #ccc;
    margin-bottom:40px
}
body.Section-Discussion .fulix label {
    transition:all .3s;
    color:#A5A5A5;
    padding:0;
    margin:0 0 5px;
    display:block;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase
}
body.Section-Discussion .fulix textarea {
    background:none;
    transition:all .3s;
    color:#333;
    padding:0;
    margin:0;
    display:block;
    font-size:14px;
    font-weight:400;
    border:none;
    border:none!important
}
body.Section-Discussion .fulix textarea:hover, body.Section-Discussion .fulix textarea:focus {
    background:none
}
body.Section-Discussion .fulix:hover {
    border:1px solid #8D8D8D
}
body.Section-Discussion .fulix:hover label {
    color:#595959
}
.tozp {
    margin-top:-20px
}
.InThisConversation {
    margin-bottom:50px
}
.InThisConversation ul.PanelInfo .PhotoWrap img {
    width:45px;
    height:45px
}
.InThisConversation ul.PanelInfo li, .InThisConversation ul.PanelInfo .PhotoWrap {
    padding:0;
    background-color: transparent;
}
#Panel .InThisConversation ul.PanelInfo li {
    border:none;
    margin-bottom:15px;
    background-color: transparent;
}
#Panel .InThisConversation ul.PanelInfo li a{
    color: #333;
}
#Panel .InThisConversation ul.PanelInfo li .Conversation-User .ProfilePhoto {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.InThisConversation ul.PanelInfo li .UserLink {
    position:relative;
    left:12px;
    top:9px
}
.InThisConversation h4 {
    margin-bottom:20px;
    border-top:1px solid #ECECEC;
    padding-top:35px;
    font-size:14px;
    font-family:'Roboto';
    font-weight:700;
    text-transform:uppercase
}
body.Section-Conversation .MeBox .PhotoWrap img {
    position:relative;
    top:-20px;
    left:0
}
body.Section-Profile .Activities li .Meta {
    border-bottom:1px solid #ECECEC;
    padding-bottom:15px;
    margin-bottom:20px;
    margin-left:22px!important;
    margin-right:0!important;
    opacity:1
}
body.Section-Profile .Activities li:last-child .Meta {
    border-bottom:none
}
body.Section-Profile ul.Activities {
    margin-bottom:75px
}
body.Section-Discussion .fulix textarea {
    padding-left:18px;
    padding-top:5px
}
.tozp img {
    left:3px;
    top:0
}
ul.Activities {
    position:relative;
    overflow:hidden
}
ul.Activities li:last-child .Meta {
    border:none
}
ul.Activities li:last-child {
    background:#fff
}
body.Section-ActivityList ul.Activities {
    margin-top:25px;
    margin-bottom:50px
}
body.Section-ActivityList ul.Activities li {
    padding-top:10px
}
ul.Activities .PhotoWrap {
    margin-right:15px;
    position:relative;
    top:-5px;
    padding:5px 0;
    background:#fff
}
body.Section-DiscussionList .DataList .Meta {
    margin-top:0
}
li.ol, li.iop {
    min-height:0;
    display:none;
    height:-moz-calc(100% - 100px);
    height:-webkit-calc(100% - 100px);
    height:-o-calc(100% - 100px);
    height:calc(100% - 100px)
}
body.Section-DiscussionList ul.Discussions li {
    padding-top:26px
}
body.Section-DiscussionList ul.Discussions {
    margin-top:0px;
    margin-bottom: 0;
}
.Comment .Message {
    font-size:16px!important;
    font-family:'Roboto';
    line-height:25px;
    color: #000;
}
.footercopy {
    color:rgba(255, 255, 255, .6)
}
.footercopy a {
    color:rgba(255, 255, 255, .6);
    transition:all .3s
}
.footercopy a:hover {
    color:rgba(255, 255, 255, 1.0)
}
.DataList .Meta {
    position: relative;
}
body.Search .ContentColumn .SearchForm {
    display:none
}
ul.SearchResults {
    margin-top:20px;
    overflow:hidden
}
ul.SearchResults .colrme {
    position:relative;
    top:-17px;
    margin-left:70px
}
ul.SearchResults .colrme a, ul.SearchResults .colrme time {
    font-size:13px;
    display:inline
}
ul.SearchResults .colrme i {
    margin-left:0
}
ul.SearchResults .ItemContent {
    padding-left:73px
}
ul.SearchResults .ItemContent a.Title {
    margin-bottom:9px
}
ul.SearchResults .Message {
    font-size:14px;
    font-family:'Roboto';
    line-height:25px;
    border-bottom:1px solid #ECECEC;
    padding-bottom:16px;
    margin-right:30px
}
.uiusx a {
    line-height:57px
}
ul.SearchResults .colrme a {
    line-height:0
}
ul.SearchResults {
    position:relative
}
ul.SearchResults li:last-child {
    background:#fff
}
.uiusx a.PhotoWrap {
    padding:10px 0;
    background:#fff
}
.uiusx a.PhotoWrap img {
    position:relative;
    top:-1px
}
.PageControls {
    margin:0 0 55px;
    min-height:24px
}

#ProgressBar>div {
    display: none;
}
.NumberedPager {

}
.Pager a {
    color:#333;
    float:none;
    margin-left:10px
}
.PhotoWrap img {
    transition:all .3s
}
.PhotoWrap img:hover, .fesb img:hover {
    border:5px solid #ccc;
    opacity:.9
}
div.pol {
    left:30px
}
.AuthorWrap a, .uiusx a, a.blackit {
    transition:all .3s
}
.AuthorWrap a:hover, .uiusx a:hover {
    color:#65c178
}
.AuthorWrap .Username {
    font-size: 14px;
    color: #333;

 }
.blackit a:hover i {
    transition:all .3s
}
.blackit a i {
    transition:all 0;
}
.NoResults {
    font-size:19px;
    margin-bottom:300px;
    color:#333;
    margin-top:32px;
    font-weight:700;
    transition:all .4s ease;
    font-family:'Roboto', 'Roboto', 'Arial', sans-serif
}
.blackit a {
    color:#333
}
.blackit a:hover, .blackit a:focus {
    color:#979797;
    text-decoration:none
}
.blackit a:hover i {
    color:#039ddb
}
.MenuItems {
    line-height:100%;
    font-size:13px;
    border:1px solid #D9D9D9;
    border-radius:2px;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    background:#fff;
    padding:0;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none
}
.Popin {
    position:relative
}
.Flyout:before, .Flyout:after, .Popin:before, .Popin:after {
    border-bottom:7px solid #D9D9D9;
    border-left:7px solid transparent;
    border-right:7px solid transparent;
    content:"";
    position:absolute;
    top:-7px
}
.OptionsMenu .Flyout {
    top:30px;
    right:0;
}
.Options .OptionsMenu .OptionsMenu .Flyout li {
    margin-top: 0 !important;
}
.MenuItems a, .MenuItems a:link, .MenuItems a:visited, .MenuItems a:active {
    display:block;
    text-decoration:none;
    white-space:nowrap;
    color:#333!important;
    padding:7px 25px;
    line-height:18px
}
.MenuItems a:hover {
    background:#eb0028!important;
    color:#fff!important
}
.MenuItems hr {
    border:0;
    margin:0;
    border-bottom:1px solid #ddd
}
.MenuItems ul {
    margin:0
}
.PopList .Empty:before {
    font-family:'FontAwesome';
    position:absolute;
    color:#000;
    font-size:18px;
    top:0;
    left:8px;
    content:"\f00d";
    display:none
}
ul.PopList {
    margin:0
}
.PopList .Empty {
    border:none;
    margin:0
}
.PopList .Item {
    background:#fff;
    border-radius:0
}
.PopList .Item:hover {
    background:#fff
}
.FlyoutMenu {
    width:300px;
    overflow:hidden;
    background:#fff;
    color:#000;
    border-radius:2px;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    box-shadow:none;
    -moz-box-shadow:none;
    -webkit-box-shadow:none;
    border:solid 1px #D9D9D9
}
.PopList .Item.Title {
    font-size:13px;
    padding:10px
}
.PopList .Item.Title a {
    float:right;
    font-size:13px
}
.PopList .Center {
    padding:5px;
    font-size:13px
}
.PopList .ItemContent {
    margin:0 0 0 75px;
    line-height:1.4
}
.Flyout .Author .PhotoWrap {
    margin:0;
    position:relative;
    top:10px;
    left:2px
}
.PopList .Item {
    background:#fff;
    border-radius:0;
    padding:10px
}
body.Section-PostConversation .Buttons {
    margin-bottom:100px
}
.FlyoutMenu .PhotoWrap img {
    position:relative;
    top:-12px
}
#conversations_messages_leave #Body #Content {
    padding: 35px 30px;
}
#conversations_messages_index {
    background-color: #F7F7F7;
}
.user_conversation {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
#conversations_messages_all .user_conversation {
    flex-wrap: nowrap;
}
#conversations_messages_all .user_conversation .conversation-index-container .H {
    text-align: center;
    padding: 20px 0;
}
#conversations_messages_index .user_conversation {
    flex-wrap: nowrap;
}
#conversations_messages_index .content-container .H {
    border-top: 1px solid rgba(151,151,151,.2);
    border-right: 1px solid rgba(151,151,151,.2);
}
#Body .user_conversation .chat_title .H {
    margin: 0;
    height: 42px;
    line-height: 42px;
    padding: 0 30px;
    background-color: #f5f5f5;
    border-bottom: 1px solid #DEDEDE;
    text-align: center;
}
#Body .user_conversation .chat_title .H a{
    color: #000;
    font-size: 24px;
}
#conversations_messages_index #Body .content-container {
    background-color: #F7F7F7;
}
ul.Conversations {
    position:relative;
    margin-top: 20px;
}
ul.Conversations li.iop {
    position:absolute
}
ul.Conversations li .PhotoWrap {
    padding:7px 7px 7px 0;
    background:#fff
}
ul.Conversations li:last-child {
    background:#fff
}
ul.Conversations li .Meta {
    margin-left:77px;
    margin-top:30px
}
.fox a {
    font-size:15px!important;
    color:#333;
    font-weight:600;
    font-family:'Roboto', 'Roboto', 'Arial', sans-serif;
    margin-left:0!important;
    display:block!important;
    position:relative;
    top:15px
}
body.Section-ConversationList div.Conversation .Message {
    font-size:13px!important;
    color:#333
}
.HasNew {
    background:#65c178;
    color:#fff;
    padding:2px 12px;
    float:right;
    position:relative;
    top:4px
}
ul.PopList li .Meta {
    margin-left:0;
    margin-top:10px
}
body.Section-ConversationList div.Conversation .Excerpt i {
    font-size:22px;
    line-height:0;
    color:#333;
    top:18px;
    position:relative;
    margin-right:3px
}
.Section-ConversationList h1.H {
    margin-bottom:0;
    margin-top: 0;
}
body.Section-Profile .PanelInfo li {
    padding:0
}
body.Section-Profile .PanelInfo li a {
    color:#333;
    padding:15px;
    display:block
}
body.Section-Profile .PanelInfo li.Active a {
    background:#333;
    color:#fff
}
body.Section-Profile .PanelInfo li a:hover {
    text-decoration:none;
    background:#039ddb;
    color:#fff
}

body.Section-Conversation .PanelInfo li {
    padding:0
}

body.Section-Conversation .PanelInfo li a {
    color:#333;
    padding:15px;
    display:block
}
body.Section-Conversation .PanelInfo li.Active a {
    background:#333;
    color:#fff
}
body.Section-Conversation .PanelInfo li a:hover {
    text-decoration:none;
    background:#039ddb;
    color:#fff
}
body.Section-ConversationList .PanelInfo li {
    padding:0
}

body.Section-ConversationList .PanelInfo li a {
    color:#333;
    padding:15px;
    display:block
}
body.Section-ConversationList .PanelInfo li.Active a {
    background:#333;
    color:#fff
}
body.Section-ConversationList .PanelInfo li a:hover {
    text-decoration:none;
    background:#039ddb;
    color:#fff
}

.respcfulix {
    display:inline
}
.resmobifulix {
    display:none
}
@media (max-wiclth: 860px) {
    .respcfulix {
        display:none
    }
    .resmobifulix {
        display:inline
    }
}
.blockdit {
    display:block!important;
    opacity:1!important;
    top:105px!important;
    text-align:left!important
}
.thecover {
    position:fixed;
    top:0;
    right:0;
    left:0;
    bottom:0;
    width:100%;
    height:800px;
    z-index:1;
    display:none
}
.theblock {
    display:block!important
}
.Tag-Closed {
    background:#696969;
    cursor:help;
    position:relative;
    padding:3px 3px 3px 21px
}
.Tag-Closed:before {
    content:"\f023";
    position:absolute;
    font-family:FontAwesome;
    top:4px;
    left:7px;
    color:#fff;
    z-index:200;
    font-size:14px
}
.advertise {
    margin:13px;
    margin-top:20px;
    border-top:1px solid #ECECEC;
    padding-top:13px
}
.advertise p {
    font-size:13px;
    margin:0 0 15px
}
.advertise h4 {
    font-size:14px;
    font-family:'Roboto';
    font-weight:700;
    margin-bottom:10px;
    text-transform:uppercase
}
.advertise img {
    max-width:100%;
    max-height:100%;
    margin-top:5px
}
.middles {
    text-align:center
}
a.cube-btn {
    color:#039ddb;
    border:1px solid #039ddb;
    display:block;
    border-radius:3px;
    background:#fff;
    padding:13px;
    list-style:none;
    font-weight:600;
    transition:all .3s;
    margin:7px 26px;
    text-align:center
}
a.cube-btn:hover {
    text-decoration:none;
    opacity:.8;
    background:#039ddb;
    color:#fff
}
body.Section-ActivityList .advertise {
    margin-top:45px
}
body.Section-ActivityList .fulix .row {
    height:55px
}
.fulix .col-md-4 .Button input {
    margin-bottom:20px
}
.DataList a.Delete {
    height:auto;
    padding:2px 5px 1px;
    border-radius:3px
}
body.Section-DiscussionList ul.Flyout li {
    padding-top:0
}
.Pager a.next {
    float:none
}
.endsteam {
    display:none
}
body.NoPanel .steam-line {
    display:none
}
.SplashMessage .SplashInfo {
    margin:150px auto
}
#cssmenu > ul > li {
    text-align:center
}
#cssmenu > ul > li > i {
    top:7px;
    position:relative;
    z-index:10;
    font-size:39px;
    color:#039ddb
}
#cssmenu > ul > li > a:hover {
    color:#eb0029;
}
ul.coloritd li a {
    background:#524a88;
    color:#fff!important
}
ul.coloritd li i {
    color:#fff!important
}
#cssmenu ul ul li img {
    width: 35px;
    height: 35px;
    margin-right: 18px;
}
#cssmenu > ul > li {
    cursor:pointer
}

#cssmenu ul ul li:hover > a {
    color: #333;
}
#cssmenu > ul > li > a {
    position:relative;
    font-family:'ximiNova-regular';
    color: #999;
    letter-spacing: 1px;
    font-size: 14px;
}
#cssmenu > ul > li > i.icon-direction {
    font-size:44px
}
#cssmenu > ul > li > i.icon-eq0 {
    font-size:44px
}
body.Section-Entry .BreadcrumbsWrapper {
    display:none
}
body.Section-Entry .CheckBoxLabel {
    float:right
}
.emid {
    margin-bottom:7px;
    text-align:left
}
.emid h3 {
    letter-spacing:-2px;
    text-transform:uppercase;
    font-weight:700;
    display:inline-block;
    color:#000
}
.emid span {
    font-size:18px;
    font-weight:300;
    line-height:30px;
    position:relative;
    top:-3px;
    color:#000
}
.footerw {
    font-family:'Roboto';
    font-size:14px;
    color:#666
}
.footerw strong {
    color:#039ddb
}
.footercopy {
    font-size:14px;
    color:#333;
    font-weight:600
}
.footcop {
    font-size:14px;
    color:#666;
    opacity:.9;
    font-weight:400
}
.footdw {
    margin-top:30px
}
.footitle {
    color:#333;
    font-weight:600;
    margin:23px 0 10px;
    font-size:15px
}
.lbflinks a:link, .lbflinks a:visited {
    color:#666;
    display:block;
    font-size:14px;
    font-weight:400;
    line-height:25px;
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -o-transition:all .4s ease;
    -ms-transition:all .4s ease;
    transition:all .4s ease
}
.lbflinks a:hover {
    padding-left:6px;
    color:#039ddb
}
.lbflinks a i {
    padding-right:5px
}
.lbflinks a:hover i {
    padding-right:10px
}
a.fixf {
    color:#666;
    margin:0
}
#social ul {
    list-style:none;
    margin:0
}
#social li {
    display:inline;
    float:right;
    margin-left:4px
}
#social a {
    color:#333;
    font-size:32px;
    line-height:0;
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -o-transition:all .4s ease;
    -ms-transition:all .4s ease;
    transition:all .4s ease
}
#social a:hover {
    color:#039ddb;
    text-decoration:none
}
.username-coloured {
    font-weight:400;
    display:inline!important;
    padding:0!important
}
.wh {
    color:#fff
}
.eredu {
    padding-bottom:20px
}
.foldbottom {
    margin-top:-36px;
    margin-bottom:1px;
    background:#00dcb1
}
.e1 {
    background:#00dcb1
}
.e2 {
    border-bottom:16px solid rgba(0, 0, 0, 0.20)
}
.e3 {
    border-bottom:15px solid #005F4D
}
.mouc {
    font-size:13px;
    display:block;
    margin-top:7px;
    opacity:.5
}
.InfoMessage {
    background:#F6F6F6;
    border:1px solid #F6F6F6
}
.footerwidets {
    border-top:1px solid #EFEFEF;
    padding-top:15px;
    padding-bottom:26px
}
@media (max-wiclth: 1090px) {
    #cssmenu > ul > li > a {
        padding:69px 10px 20px;
        position:relative;
        top:-50px;
        font-size:14px;
        min-width:70px;
        font-family:'Roboto'
    }
    #cssmenu {
        padding-right:0
    }
}
@media (max-wiclth: 990px) {
    #cssmenu > ul > li > a {
        padding:18px 10px 20px;
        position:static;
        font-size:12px
    }
}
@media (max-wiclth: 860px) {
    .respcfulix {
        display:none
    }
    .resmobifulix {
        display:inline
    }
    #cssmenu > ul > li {
        min-width:100px;
        height:123px
    }
    #cssmenu > ul > li > ul::after {
        top:-12px;
        right:30px;
        left:auto
    }
    #cssmenu ul ul {
        left:auto;
        right:0;
        display:none
    }
    #cssmenu > ul > li:hover > ul {
        display:inline
    }
}
#cssmenumob {
    float:right
}
#cssmenumob > ul > li {
    text-align:center
}
#cssmenumob > ul > li > i {
    top:7px;
    position:relative;
    z-index:10;
    font-size:39px;
    color:#039ddb
}
ul.coloritd li a {
    background:#818181;
    color:#fff!important
}
ul.coloritd li i {
    color:#fff!important
}
#cssmenumob ul ul li a {
    color:#606060!important
}
#cssmenumob > ul > li {
    cursor:pointer
}
#cssmenumob ul ul li:hover > ul > li:hover > a {
    color:#333!important;
    background:#fff
}
#cssmenumob > ul > li > a {
    padding:68px 20px 20px;
    position:relative;
    top:-50px;
    font-size:14px;
    min-width:106px;
    font-family:'Roboto'
}
#cssmenumob > ul > li:hover > ul {
    top:110px
}
#cssmenumob > ul > li > i.icon-direction {
    font-size:44px
}
#cssmenumob > ul > li > i.icon-eq {
    font-size:44px
}
body.Section-Entry #cssmenumob, body.Section-Entry #searching, body.Section-Entry #adz, body.Section-Entry .steam-line {
    display:none
}
#cssmenumob > ul > li > a {
    padding-top:69px
}
@media (max-wiclth: 1090px) {
    #cssmenumob > ul > li > a {
        padding:69px 10px 20px;
        position:relative;
        top:0;
        font-size:14px;
        min-width:70px;
        font-family:'Roboto'
    }
    #cssmenumob {
        padding-right:0
    }
}
@media (max-wiclth: 990px) {
    #cssmenumob > ul > li > a {
        padding:0 10px 20px;
        font-size:12px
    }
}
@media (max-wiclth: 860px) {
    .respcfulix {
        display:none
    }
    .resmobifulix {
        display:inline
    }
    #cssmenumob > ul > li {
        min-width:100px;
        height:123px
    }
    #cssmenumob > ul > li > ul::after {
        top:-11px;
        right:44px;
        left:auto
    }
    #cssmenumob ul ul {
        left:auto;
        right:0;
        display:none
    }
    #cssmenumob > ul > li:hover > ul {
        display:inlinep
    }
}
#Panel .PanelInfo li .category_info_container {
    padding: 20px;
    padding-top: 20px;
    box-sizing: border-box;
    padding-bottom: 0;
}
.PanelCategories li a {
    display:block;
    font-size: 11px;
    color: #333;
}
.PanelCategories li .ItemLink {
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #EEEEEF;
    font-family: 'ximiNova-sbold';
    text-align: center;
    font-weight: 700;
}
#cssmenu > ul > li:last-child a {
    margin-right: 0;
}
#cssmenu ul ul li a:before {
    display:inline;
    float:left;
    margin-right:5px;
    font-size:15px;
    font-family:'fontawesome';
    position:relative;
    top:-1px
}
#cssmenu > ul > li.steamlogin a:before {
    content:'\e808'
}
#cssmenu > ul > li.steamreg a:before {
    content:'\e802'
}
@media (max-wiclth: 990px) {
    #cssmenumob > ul > li > a {
        padding:30px 10px 22px;
        top:3px;
        font-size:12px
    }
    #cssmenumob > ul > li > a:before {
        content:'\e80b';
        font-family:'steamfont';
        font-size:39px;
        color:#039ddb;
        display:block;
        margin-bottom:15px;
        transition:all .3s
    }
}
div.Popup .Body {
    padding:25px 40px;
    border:1px solid #ccc;
    border-radius:5px;
    box-shadow:0 0 20px rgba(0, 0, 0, 0.18)
}
.pou .row:first-child {
    padding-bottom:30px
}
.pou .footdw:first-child {
    padding-bottom:0!important
}
body.Section-DiscussionList .DataList .Meta {
    margin-left:0
}
.AddPicture {
    margin-top:20px;
    text-decoration:none
}
.AddPicture:before {
    content:"\f03e";
    display:block;
    font-size:40px;
    font-family:'fontawesome';
    text-align:center;
    color:#333
}
.AddPicture:hover {
    text-decoration:none
}
a.ChangePicture:hover {
    color:#fff
}
body#dashboard_home_error {
    padding:0!important
}
body#dashboard_home_error #searching, body#dashboard_home_error #cssmenu {
    display:none
}
body#dashboard_home_error .logocol {
    width:100%;
    text-align:center
}
#Panel {
    float:none;
    width: 100%;
    padding: 0;
}
#Panel .steam-panel .BoxFilter {
    /*display: none;*/
}
#advanceContent .company_event_item {
    background-color: #fff;
    margin-bottom:20px;
}
#advanceContent .company_event_item .title {
    padding: 0 19px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    height: 40px;
    line-height: 40px;
    border-bottom: 1px solid #EBEBEB;
}
#advanceContent .company_event_item .content {
    padding:19px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#advanceContent .company_event_item .content ul {
    margin-bottom: 0;
}
#advanceContent .company_event_item .content .evalution_img {
    width: 100%;
    height: 100%;
}
#advanceContent .company_event_item .content .item {
    border-bottom: 1px solid #EEEEEF;
    padding-bottom: 17px;
}
#advanceContent .announcements_box .content .item {
    margin-bottom: 10px;
    border-bottom: 1px solid #EEEEEF;
    padding-bottom: 0;
}
#advanceContent .company_event_item .content .item .item_img {
    width: 100%;
    height: 100%;
}
#advanceContent .company_event_item .content .item .item_text {
    margin: 10px 0;
    color: #333333;
    font-size: 13px;
}

#advanceContent .company_event_item .content a {
    color: #333;
}
#advanceContent .company_event_item .content a:hover {
    text-decoration: none;
}
#advanceContent .norow {
    width: 100%;
    margin: 0;
}
#Body {
    position: relative;
}
#Body .content-container {
    display: flex;
    justify-content: space-between;
    flex-wrap : wrap;
}
#Body .advanceContent {
    width: 230px;
}
.category_banner {
    flex:0 0 100%;
    padding: 0;
    margin-bottom: 20px;
    margin-top: -20px;
}
.category_banner img {
    width: 100%;
    object-fit: contain;
}
.CreateAccount {
    margin:30px 0
}
body#dashboard_entry_signin h1, body#dashboard_entry_register h1 {
    margin:30px 0
}
body#dashboard_entry_signin .Buttons, .Popup.SignInPopup .Buttons {
    position:relative;
    padding-top:40px
}
body#dashboard_entry_register .Buttons {
    position:relative;
    padding-top:0;
    margin-top:100px;
    margin-bottom:50px
}
body#dashboard_entry_signin .Buttons label, body#dashboard_entry_rgister .Buttons label, .Popup.SignInPopup .Buttons label {
    position:absolute;
    top:0;
    left:0
}
body#dashboard_entry_signin .Buttons input.Form_SignIn, body#dashboard_entry_register .Buttons input.Form_SignIn, .Popup.SignInPopup .Buttons input.Form_SignIn {
    position:absolute;
    top:20px;
    left:0;
    width:100%;
    display:block
}
body#dashboard_entry_signin .Buttons input.Button.Primary, body#dashboard_entry_register .Buttons input.Button.Primary, .Popup.SignInPopup .Buttons input.Button.Primary {
    width:100%;
    padding:17px;
    font-size:15px
}
body#dashboard_entry_signin a.ForgotPassword, .Popup.SignInPopup a.ForgotPassword {
    margin-left:0
}
body#dashboard_entry_signin a.ForgotPassword:before {
    font-size:12px;
    content:"\f064";
    margin-left:1px;
    margin-right:4px;
    font-family:'fontawesome'
}
li.Buttons a.ForgotPassword {
    margin:10px 0 30px;
    display:block
}
body#dashboard_entry_signin li.Buttons a.ForgotPassword:before {
    content:"\f112"
}
body#dashboard_entry_signin #Form_User_Password .Buttons {
    position:relative;
    padding-top:0
}
body#dashboard_entry_register .CheckBoxLabel {
    display:block;
    width:100%
}
.Item.Item-Search h3 {
    margin-bottom:10px
}
.stm-contact {
    padding-left:30px;
    position:relative;
    margin-bottom:20px
}
.stm-contact i {
    position:absolute;
    left:0;
    top:5px;
    font-size:17px
}
.lbflink a {
    margin-right:7px;
    font-size:25px;
    color:#333
}
.lbflink a:hover {
    opacity:.7
}
div.Popup .Body .Content {
    min-width:300px
}
.steam-panel .PhotoWrap {
    float:none;
    text-align:center;
    width:100%;
    margin-bottom:50px
}
.FilterMenu a {
    display:block;
    padding:15px;
    margin-bottom:0
}
.FilterMenu a:hover, a:focus {
    text-decoration:none
}
#Panel .FilterMenu li {
    border:none!important;
    border-radius:0;
    margin-bottom:0;
    border-bottom:1px solid #ECECEC!important
}
.emid h3 img {
    max-height:50px
}
.coloritd a:before {
    color:#fff!important
}
body.Section-CategoryList .DataList .Meta {
    margin-left:87px;
    position: relative;
    padding-bottom: 24px;
    margin-bottom: 21px;

}
body.Section-CategoryList .DataList .Meta:after {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 85%;
    height: 1px;
    background-color: #efefef;
    content: '.';
}
body.Section-CategoryList .DataList .Meta .MItem {
    color: #9B9B9C;
    font-size: 12px;
}
.DataList.CategoryList {
    margin-top:0px
}
.ContentColumn .Button {
    text-align: center;
    font-family: 'ximiNova-sbold';
    margin-top: 0;
    background-color: #333;
    color: #fff;
    width: 179px;
    height: 40px;
    border-radius: 20px;
    font-size: 14px !important;
}
.BreadcrumbsWrapper {
    margin-bottom:50px;
    display:block
}
.ItemDiscussion {
    margin-bottom:0;
}
.col-md-6 {
    width:50%;
    float:left;
}
.col-md-3 {
    width:25%;
    float:left;
}
.banner {
    width: 100%;
    padding: 0;
}
.banner .swiper-container {
    height: 460px;
    margin-bottom: 20px;
}
.nav-first-row {
    box-sizing: border-box;
    margin: 0;
    position: relative;
    display: flex;
    align-items: center;
    height: 60px;
    justify-content: space-between;
}
.right-choose-btn {
    display: flex;
    justify-content: flex-end;
    width: 15%;
    align-items: center;
    z-index: 9;
    flex: 1;
}
.UserBox .WhoIs, .MeBox .WhoIs {
    min-height: auto;
    line-height: normal;
}
.tag_label a{
    display: inline-block;
    padding: 0 8px;
    color: #fff;
    background-color: #52BD8A;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    font-size: 16px;
}
#Panel .PanelInfo li:hover {
    background-color: #fff;
}
#Panel .PanelInfo li {
    margin-top: 15px;
    background-color: #fff;
    font-weight: 400;
}
#Panel .PanelInfo li:hover >.ItemLink {
    color: #333;
}
#Panel .PanelInfo li .time_label {
    color: #9B9B9C;
    font-size: 10px;
    margin-bottom: 5px;
}
#Panel .PanelInfo li .content_label  {
    padding-bottom: 17px;
    color: rgba(51,51,51,1);
    font-size: 13px;
    word-wrap: break-word;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    border-bottom: 1px solid #EEEEEF;
    font-family: 'ximiNova-regular';
}
#Panel .PanelInfo li:last-child .content_label {
    border-bottom: none;
}
#Panel .PanelInfo li .more_btn {
    display: block;
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 11px;
    border-top: 1px solid #eeeeef;
    color: #333;
}
#Panel .PanelInfo li.MyFriendsLink.hasUnRead {
    position: relative;
}
#Panel .PanelInfo li.MyFriendsLink.hasUnRead:after {
    position: absolute;
    right:0px;
    top: 0px;
    width: 10px;
    height: 10px;
    content: '';
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-color: #eb0028;
}
.DataList .Excerpt {
    word-wrap: break-word;
    max-height: 66px;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    font-size: 13px;
    color: #666;
    margin: 0;
    margin-top: 5px;
    margin-bottom: 15px;
    line-height: 20px;

}
.DataList .Excerpt a {
    font-family: 'ximiNova-regular';
}
.Title a {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: inline-block;
    line-height: 1;
    margin-right: 8px;
    max-width: 90%;
    font-size: 18px;
    font-family:'ximiNova-sbold';
}
.ItemDiscussion .ItemContent .Title a {
    font-family:'ximiNova-regular';
    font-weight: 400;
    color: #000;
}
.Discussions .ItemContent {
    padding-left: 80px;
}
.Discussions .ItemContent .tag_label_box {
    margin-bottom: 7px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.Discussions .ItemContent .tag {
    display: inline-block;
    padding: 0 12px;
    border-radius: 20px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    margin-right: 10px;
    height: 18px;
    line-height: 20px;
    font-family: 'ximiNova-regular';
}
#Item_0 .tag.isTop img{
    width: 26px;
    height: 26px;
}
.Discussions .ItemContent .isTop {
    width: 26px;
    height: 26px;
    background-color: #fff;
    padding: 0;
    vertical-align: bottom;
}
.Discussions .ItemContent .isTop img {
    width: 100% !important;
    height: 100% !important;
}
.Discussions .ItemContent .isNew {
    vertical-align: middle;
    position: relative;
    width: 30px;
    height: 20px;
    display: inline-block;
}
.Discussions .ItemContent .isNew img {
    width: 100% !important;
    height: auto !important;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.MItem {
    position: relative;
    padding-left: 17px;
    margin-left: 0;
    margin-right: 30px;
}
.MItem a {
    color: #9B9B9C;
    font-family: 'ximiNova-regular';
}
.MItem {
    color: #9B9B9C;
}
.MItem:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.LastCommentBy:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/firstuser_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.LastCommentDate:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/clock_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.ViewCount:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/views_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    width: 15px;
    height: 15px;
    top: -2px;
}
.CommentCount:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/comments_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    width: 15px;
    height: 15px;
    top: -1px;
}
.LikeCount:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/likescount.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.createUser:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/firstuser_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.DateCreated:before {
    background: url(https://roborock.s3.amazonaws.com/images/forum/clock_icon.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.CommentInfo .DateCreated:before {
    background: none;
}
.CommentInfo .DateCreated {
    padding-left: 0;
}
.customer_user_icon {
    display: inline-block;
    width: 15px;
    height: 15px;
    vertical-align: top;
    background: url(https://roborock.s3.amazonaws.com/images/forum/profile.png) center no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.commentPageUserInfo {
    width: 230px;
    background-color: #fff;
}
.Discussion .PageTitle h1 {
    font-size: 18px;
    margin-top: 0;
    word-break: break-all;
    padding-right: 170px;
    font-family: 'ximiNova-sbold';
    font-weight: 700;
}
#Body .ContentColumn {
    padding: 0;
    box-sizing: border-box;
    background-color: #fff;
    margin: 0;
    width: 948px;
    position: relative;
}
.MessageList.Discussion ,.CommentsWrap{
    padding: 35px 30px;
    padding-bottom: 20px;
}
.greyLine {
    width: 100%;
    height: 20px;
    background-color: #efefef;
}
.CommentFormWrap {
    padding: 40px 48px;
    width: 890px;
    box-sizing: border-box;
    background-color: #F8F8F8;
    display: flex;
    justify-content: space-around;
    border-radius: 5px;
    margin: 0 auto;
}
.CommentForm .FormWrapper {
    width: 100%;
    padding: 0;
    background-color: #F8F8F8;
}
.Form-Header .Author .PhotoWrap {
    margin: 0;
    margin-right: 30px;
}
input.SmallInput:focus, input.InputBox:focus, textarea:focus {
    background-color: #fff;
}
.ContentColumn .Button.profile_button {
    opacity: 0.3;
}
.FormWrapper-Condensed .Buttons {
    padding: 0;
}
.TextBoxWrapper #Form_Body {
    margin-bottom: 0;
    height: 110px !important;
    border-color: #D9D9D9 !important;
}
.Form-BodyWrap {
    width: 100%;
}
@media (min-width: 700px) {
    body.hasRichEditor .CommentForm .richEditor {
        padding: 0;
    }
    body.hasRichEditor .CommentForm .CommentFormWrap .Form-HeaderWrap {
        display: block;
    }
}
.richEditor .richEditor-frame {
    border: none;
    min-height: auto;
    background-color: #F8F8F8;
}
.richEditor-textWrap {
    border: 1px solid #D9D9D9;
    min-height: 100px;
}
.richEditor-textWrap .userContent {
    height: 100px;
    overflow: auto;
}
.richEditor-text {
    min-height: 100px;
    background-color: #fff;
}
.InlineTags,.Meta {
    display: none;
}
.commentPageUserInfo .user_bg_img {
    width: 100%;
    height: 80px;
    position: relative;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
.commentPageUserInfo .user_bg_img a {
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(50%);
    -moz-transform: translateX(-50%) translateY(50%);
    -ms-transform: translateX(-50%) translateY(50%);
    -o-transform: translateX(-50%) translateY(50%);
    transform: translateX(-50%) translateY(50%);
    width: 83px;
    height: 83px;
    border-radius: 50%;
    border: 3px solid #fff;
    background-color: #eee;
}
.commentPageUserInfo .user_bg_img .userAvatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}
.commentPageUserInfo .user_name {
    text-align: center;
    font-size: 14px;
    color: #333;
    margin-top: 60px;
    padding: 0 25px;
    font-family: 'ximiNova-sbold';
}
.commentPageUserInfo .user_intro {
    color: #9B9B9C;
    font-size: 12px;
    text-align: center;
    padding: 25px;
    padding-top: 10px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: 'ximiNova-regular';
    word-wrap: break-word;
}
.handle_area {
    display: flex;
    justify-content: flex-end;
    box-sizing: border-box;
}
.handle_area .touchGood,.handle_area .touchLike {
    cursor: pointer;
    position: relative;
    text-decoration: none;
}
.handle_area .Bookmark,.Bookmarked {
    position: relative;
    overflow: visible;
    margin-right: 20px;
}

.handle_area .Bookmark:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -11px;
    width: 34px;
    height: 34px;
    background: url("./like-3.png") left no-repeat;
    background-size: 2200% 100%;
}
.handle_area .Bookmarked:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -11px;
    width: 34px;
    height: 34px;
    background: url("./like-3.png") left no-repeat;
    background-size: 2200% 100%;
}
.handle_area .Bookmark span{
    font-size: 20px;
}
.handle_area .Bookmark {
    padding-left: 40px;
    font-size: 20px;
    text-decoration: none;
}
.VoteUp {
    position: relative;
    padding-left: 27px;
}
.VoteDown {
    position: relative;
    padding-left: 27px;
}
.childVoteUp {
    position: relative;
    padding-left: 27px;
}
.childVoteDown {
    position: relative;
    padding-left: 27px;
}
.LikeUp {
    position: relative;
    padding-left: 27px;
}
.VoteUp i.ArrowSprite {
    display: none;
}
.VoteDown i.ArrowSprite {
    display: none;
}
.DiscussionMeta .VoteUp {
    padding-left: 20px;
}
.DiscussionMeta .VoteDown {
    padding-left:20px;
}
.DiscussionMeta .VoteUp:before {
    width: 25px;
    height: 25px;
    top: -13px;
    left: -3px;
    background-size: 2200% 100%;
}
.DiscussionMeta .VoteDown:before {
    width: 25px;
    height: 25px;
    top: -12px;
    background-size: 2200% 100%;
}
.childrenVote {
    cursor: pointer;
}
.childVoteUp.childrenVote:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -15px;
    width: 25px;
    height: 25px;
    background: url("./dianzan.png") left no-repeat;
    background-size:2200% 100%;
}
.children_comment .comment_bottom_btn .childVoteUp.childrenVote:before  {
    top: -13px;
}
.childVoteDown.childrenVote:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -15px;
    width: 25px;
    height: 25px;
    background: url("./dianzan.png") left no-repeat;
    background-size: 2200% 100%;
}
.children_comment .comment_bottom_btn .childVoteDown.childrenVote:before {
    top: -13px;
}
.VoteUp:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -17px;
    width: 35px;
    height: 35px;
    background: url("./dianzan.png") left no-repeat;
    background-size: 2200% 100%;
}
.handle_area .VoteUp:before {
    left: 0;
    top: -20px;
    width: 45px;
    height: 45px;
    background: url("./dianzan-3.png") left no-repeat;
    background-size: 2200% 100%;
}
.handle_area .touchGood .dianzanBtn {
    display: flex;
    justify-content: center;
    cursor: pointer;
    padding-left: 40px;
    font-size: 30px;
}
.handle_area .touchGood .dianzanBtn #ScoreVal {
    font-size: 20px;
}
.VoteDown:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -17px;
    width: 30px;
    height: 35px;
    background: url("./dianzan.png") left no-repeat;
    background-size: 2200% 100%;
}
.handle_area .VoteDown:before {
    left: 0;
    top: -20px;
    width: 45px;
    height: 45px;
    background: url("./dianzan-3.png") left no-repeat;
    background-size: 2200% 100%;
}
.LikeUp:before {
    display: inline-block;
    content: " ";
    position: absolute;
    left: 0;
    top: -15px;
    width: 30px;
    height: 35px;
    background: url("./like.png") left no-repeat;
    background-size: 580px 25px;
}

.LikeUp.animate_step2:before {
    background-position: right;
}
.VoteUp.animate_step2:before {
    background-position: right;
}
.childVoteUp.animate_step2:before {
    background-position: right;
}
.VoteDown.animate_step2:before {
    background-position: right;
}
.childVoteDown.animate_step2:before {
    background-position: right;
}
.animate_step1:before {
    -webkit-animation-timing-function: steps(21);
    animation-timing-function: steps(21); -webkit-animation-name: stepsV1;
    animation-name: stepsV1;-webkit-animation-duration: .65s;
    animation-duration: .65s;-webkit-animation-iteration-count: 1;
    animation-iteration-count: 1; -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
@-webkit-keyframes stepsV1 {
    0% {
        background-position: left;
    }

    100% {
        background-position: right;
    }
}
@keyframes stepsV1 {
    0% {
        background-position: left;
    }

    100% {
        background-position: right;
    }
}
.handle_area img {
    width: 17px;
    height: auto;
}
#vanilla_post_discussion .commentPageUserInfo {
    display: none;
}
.embedExternal {
    width: 100%;
}
.embedImage .embedExternal-content {
    width: 100%;
    max-width: 100%;
}
.comment_bottom_btn {
    padding-left: 70px;
    margin-top: 10px;
}
.Reactions {
    margin-top: 0;
    width: 118px;
    height: 40px;
    line-height: 40px;
    background-color: #333;
    text-align: center;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    position: absolute;
    top:30px;
    right: 35px;
}
.fix_discussion_nav .Reactions {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.Item-BodyWrap .Item-Body .Reactions {
    position: static;
    display: inline-block !important;
    background-color: transparent;
    color: #333;
    width: auto;
    border: none;
    margin-left: 0;
}
.children_comment .comment_body .comment_bottom_btn .Reactions {
    position: static;
    display: inline-block !important;
    background-color: transparent;
    color: #333;
    width: auto;
    border: none;
    margin-left: 0;
    padding-bottom: 0;
    font-family: 'ximiNova-regular';
}

.ReactButton {
    line-height: inherit;
}
.Reactions .ReactSprite {
    display: none;
}
.Reactions a {
    color: #fff;
    font-size: 20px;
}
.Reactions a:hover {
    color: #fff;
    text-decoration: none;
}
.Voter span {
    color: #9B9B9C;
    font-weight: 400 !important;
}
#countFollow {
    color: #9B9B9C;
}
.children_comment:first-child .Comment{
    margin-top: 30px;
}
.children_comment .Comment {
    display: flex;
    justify-content: flex-start;
    margin-left: 75px;
    padding-bottom: 20px;
    position: relative;
}
.children_comment .handle_flyout {
    position: absolute;
    top: 0;
    right: 0;
}
.children_comment:first-child {
    margin-top: 0;
}
.children_comment .comment_bottom_btn {
    padding-left: 0;
}
.children_comment .user_photo {
    margin-right: 24px;
}
.children_comment .user_photo>img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.children_comment .comment_body .userName {
    color: #333;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 5px;
    font-family: 'ximiNova-sbold';
}
.children_comment .comment_body .userName .time {
    font-size: 12px;
    color: #666666;
    margin-left: 13px;
    font-weight: 400;
}
.loginBtn {
    margin-right: 30px;
    font-size: 14px;
}
.loginBtn .signInBtn {
    padding-right: 10px;
    margin-right: 10px;
    position: relative;
}
.loginBtn .signInBtn:after {
    position: absolute;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 1px;
    height: 13px;
    background-color: #9D9D9D;
    content: '';
}
.MeBox-SignIn {
    display: block;
}
.MeMenu {
    margin-left: 8px;
}
.comment_content p {
    word-break: break-word;
    font-family: 'ximiNova-regular';
    margin: 0;
}
.swiper-container {
    height: 100%;
}
.Activities .ItemContent {
    min-height: 100px;
    margin-top: 20px;
}
#dashboard_search_index #Body .ContentColumn {
    width: 100%;
}
#dashboard_search_index #Body .advanceContent {
    display: none;
}
#dashboard_entry_connect #Body .advanceContent {
    display: none;
}
#dashboard_entry_connect #Content {
    padding: 20px;
}
#vanilla_post_discussion #Body .advanceContent {
    display: none;
}
#vanilla_post_discussion #Body #Content {
    width: 100%;
}
.fix_discussion_nav {
    position: fixed;
    top: -100%;
    left: 0;
    background-color: #fff;
    width: 100%;
    -moz-box-shadow:0px 4px 18px #eee;
    -webkit-box-shadow:0px 4px 18px #eee;
    box-shadow:0px 4px 18px #eee;
    z-index: 999;
    padding: 30px 0;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
.fix_discussion_nav .center_box {
    margin: 0 auto;
    width: 1200px;
    height: 100%;
    position: relative;
}
.fix_discussion_nav .discussion_info_item {
    margin-top: 8px;
}
.fix_discussion_nav .discussion_info_item .VoteUp {
    cursor: default;
}
.fix_discussion_nav .discussion_info_item .VoteUp:before{
    width: 30px;
    height: 25px;
    top: -13px;
    background-size: 550px 30px;
}
.fix_discussion_nav .discussion_info_item .Voter .VoteUp {
    padding-left: 22px;
}
.ToggleFlyout.OptionsMenu {
    padding: 10px;
}
#vanilla_post_editdiscussion #advanceContent {
    display: none;
}
body.NoPanel #Content, body.Conversations.add #Content, body.Vanilla.Post #Content {
    width: 100%;
}
#LoadMore {
    text-align: center;
    width: 100%;
    color: #9B9B9C;
    height: 60px;
    line-height: 60px;
    background-color: #333333;
    cursor: pointer;
    position: absolute;
    bottom: -80px;
    left: 0;
    font-family: 'ximiNova-regular';
}
#LoadMore a{
    color: #9B9B9C;
    font-size: 11px;
    text-decoration: none;
    position: relative;
    padding-left: 20px;
}
#LoadMore a:before {
    content: '';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    width: 17px;
    height: 17px;
    background: url(https://roborock.s3.amazonaws.com/images/forum/loading.png) center no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
}
#LoadMore a.isloading:before {
    animation: loadingAnimate 1s linear infinite forwards;
}
@keyframes loadingAnimate {
    from{
        -webkit-transform: translateY(-50%) rotateZ(0);
        -moz-transform: translateY(-50%) rotateZ(0);
        -ms-transform: translateY(-50%) rotateZ(0);
        -o-transform: translateY(-50%) rotateZ(0);
        transform: translateY(-50%) rotateZ(0);
    }
    to{
        -webkit-transform: translateY(-50%) rotateZ(360deg);
        -moz-transform: translateY(-50%) rotateZ(360deg);
        -ms-transform: translateY(-50%) rotateZ(360deg);
        -o-transform: translateY(-50%) rotateZ(360deg);
        transform: translateY(-50%) rotateZ(360deg);
    }
}
#return_to_top {
    position: fixed;
    bottom: 150px;
    right: 50%;
    margin-right:-520px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    z-index: 20;
    cursor: pointer;
}
#return_to_top>img {
    width: 100%;
    height: 100%;
}
.get_more_reply {
    text-align: center;
    margin-top: 30px;
    color: #eb0028;
    cursor: pointer;
    padding-bottom: 20px;
}
#Content ul.Discussions .Options {
    z-index: 1;
}
ul.Discussions .Item .Options {
    top: 16px;
    margin: 0;
}
ul.Discussions .Item:first-child .Options {
    top: 0;
}
input[type="file"],.Hidden, .hidden {
    display: none;
}
.swiper-slide-button {
    opacity: 0;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    -ms-transition: all .2s ease-out;
    -o-transition: all .2s ease-out;
    transition: all .2s ease-out;
}
div.Profile {
    float: left;
    width: 100%;
    padding-right: 0;
}
dl.About {
    min-height: auto !important;
}
dl.About dt {
    background: none;
    padding-left: 0;
}
.profile_icon {
    width: 12px;
    height: auto;
    margin-right: 10px;
}
.About.P dl.About dd {
    color: #9B9B9C;
    height:32px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.About.P dl.About dt {
    font-weight: 400;
    height:32px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #333;
}
#searchBtn {
    padding: 3px 5px;
    cursor: pointer;
}
.search_nav {
    background-color: #fff;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: auto;
}
.searchMask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.7);
    z-index: 99;
    display: none;
}
.profile_title {
    border-bottom: 1px solid #ececec;
    padding-bottom: 10px;
    color: #333;
    padding-left: 50px;
}
#closeSearch {
    position: absolute;
    top: 50%;
    right: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: right;
    width: 20%;
}
a.Bookmark,a.Bookmarked, a.Bookmarking {
    background: none;
    padding-left: 22px;
    color: #9B9B9C;
    margin-right: 10px;
    text-indent: inherit;
}
.handle_area a.Bookmarked:before {
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    background-position: right;
    -webkit-animation-timing-function: steps(20);
    animation-timing-function: steps(20); -webkit-animation-name: stepsV1;
    animation-name: stepsV1;-webkit-animation-duration: .65s;
    animation-duration: .65s;-webkit-animation-iteration-count: 1;
    animation-iteration-count: 1; -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
}
#search-results h3 a {
    font-size: 14px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #333;
}

/* 点击reply按钮 输入框弹出*/
#ReactionsDiv {
    position: relative;
    display: none;
    z-index: 100;
}
#replyMask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.4);
    z-index: 99;
    display: none;
}
.profile_content_container {
    padding: 35px 30px;
}
.ShareThisButtonWrapper  {
    margin-bottom: 20px;
}
.shareTitle {
    color: #9B9B9C;
    font-size: 12px;
    margin-top: 10px;
}
#st-el-1 {
    display: none !important;
}
.ControlOptions, .Options {
    margin-top: 20px;
}
.User a {
    color: #007AFF;
}
.SpEditProfile {
    background: url(https://roborock.s3.amazonaws.com/images/forum/profile.png) center no-repeat;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    width: 15px;
    height: 15px;
}
.OptionsTitle {
    background: none;
    width: 3px;
    height: 3px;
    background-color: #333;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    position: relative;
    overflow: visible;
}
.OptionsTitle:before,.OptionsTitle:after {
    position: absolute;
    left: 0;
    width: 3px;
    height: 3px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    content: '';
    background-color: #333;
}
.OptionsTitle:before {
    top: -6px;
}
.OptionsTitle:after {
    top: 6px;
}
#ReactionsDivFloat {
    position: relative;
}
#ReactionsDivFloat #closeReplyBox {
    position: absolute;
    right: 0px;
    top: 0px;
    padding: 10px;
    font-size: 20px;
    cursor: pointer;
    display: inline-block;
}
#modals>div {
    z-index: 100;
}
.footer_box {
    max-width: 1000px;
    padding: 10px;
    padding-top: 120px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
}
.footer_link {
    display: flex;
    justify-content: flex-start;
    border-bottom: 1px solid rgb(214, 214, 214);
    padding: 0 10px;
}
.footer_link .links_item {
    text-align: left;
    width: 25%;
}
.footer_link .links_item .link_item a{
    color: #999;
    font-size: 12px;
    line-height: 1em;
    text-decoration: none;
}
.footer_link .links_item .link_item a:hover {
    color: #333;
}
.footer_link .links_item .main_link {
    color: #333;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 5px;
}
.footer_box .home_link a{
    color: #999;
    font-size: 12px;
    text-decoration: none;
}
.footer_box .home_link a:hover {
    color: #333;
}
.footer_box .home_link {
    padding: 0 10px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(214, 214, 214);
    margin-bottom: 15px;
}
.footer_box .copy_right {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    margin-top: 15px;
    color: #999;
    padding:0 10px;
}
ul.Discussions li .PhotoWrap img,.ProfilePhoto {
    float: none;
}
.UserPhotos {
    display: flex;
    justify-content: space-around;
}
.UserPhotos .photo-item img{
    width: 100px;
    height: 100px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.UserPhotos .photo-item img.isChecked {
    border: 2px solid #eb0028;
}
.UserPhotos .photo-item .hidden-radio {
    display: none;
}
#discussions_list,#mycomments,#myLikes,#bookmarks_list {
    padding: 0;
}
#closePreviewBox {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 20px;
    cursor: pointer;
}
/* 用戶私信 界面 UI*/
.messageBox {
    padding: 35px 30px;
    padding-top: 0;
    background-color: #f5f5f5;
    border-right: 1px solid rgba(151,151,151,.2);
    min-height: 600px;
    max-height: 1200px;
    overflow-y: scroll;
}
.addMessageWrap {
    background-color: #f5f5f5;
    border: 1px solid rgba(151,151,151,0.2);
    border-left: 0;
}
.addMessageWrap .MessageFormWrap .FormWrapper {
    background-color: #f5f5f5;
}

.addMessageWrap.CommentForm .FormWrapper {
    padding: 36px;
}
.ConversationMessage .PhotoWrap {
    float: none;
}
.ConversationMessage .sendMessageUser {
    margin-left: 20px;
    color: #333;
}
.Mine .ConversationMessage .sendMessageUser {
    margin-left: 0;
    margin-right: 20px;
}

.conversation-index-container .Conversation .Users {
    display: flex;
    align-items: center;
}
.conversation-index-container .Conversation .Users a {
    color: #333;
    font-size: 12px;
}
ul.Conversations .Item {
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    margin-bottom: 10px;
    padding: 0 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ccc;
}
ul.Conversations .Item:last-child {
    border-bottom: 0;
}
ul.Conversations .Item:hover {
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}

.ConversationForm .H {
    padding-left: 36px;
}
ul.token-input-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    border-color: #d9d9d9;
}
.InformMessages .InformWrapper.HasIcon .InformMessage {
    background-color: #ccc;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);
}
.InformMessages .InformMessage a.Icon img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.InformMessages .InformMessage .Title {
    display: flex;
    align-items: center;
}
.InformMessages .InformMessage a:last-child {
    margin-right: 0;
    margin-left: 8px;
}
.InformMessages .InformMessage a {
    font-size: 12px;
    color: #fff;
}
.InformMessages .InformMessage .Excerpt {
    font-size: 20px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}
.Activity-ConversationMessage {
    -webkit-animation: messageAnimation .5s infinite alternate ease-out;
    -o-animation: messageAnimation .5s infinite alternate ease-out;
    animation: messageAnimation .5s infinite alternate ease-out;
}
@keyframes messageAnimation {
    from {
        -webkit-transform: translateY(-10px);
        -moz-transform: translateY(-10px);
        -ms-transform: translateY(-10px);
        -o-transform: translateY(-10px);
        transform: translateY(-10px);
    }
    to {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
}
#followUserBtn {
    text-align: center;
    color: #fff;
    height: 30px;
    line-height: 30px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    margin: 0 auto;
    background-color: #eb0029;
    margin-bottom: 20px;
    cursor: pointer;
    letter-spacing: 1.5px;
    display: block;
    width: 80%;
}
#followUserBtn,#sendMessage:hover {
    text-decoration: none;
}
#sendMessage {
    width: 80%;
    text-align: center;
    color: #fff;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    margin: 0 auto;
    background-color: #eb0029;
    margin-bottom: 20px;
    cursor: pointer;
    letter-spacing: 1.5px;
    display: inline-block;
}
#postMessage {
    width: 50%;
    text-align: center;
    color: #000;
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    margin: 0 auto;
    border: 0;
    display: block;
    background-color: #fff;
    border: 1px solid #ccc;
    font-size: 12px;
    margin-top: 10px;
}
#Form_ConversationMessage .sendMessage {
    display: inline-block;
    background-color: #eb0028;
    color: #fff;
    height: 40px;
    width: 150px;
    line-height: 40px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: none;
    outline: none;
}
.staff_label {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px;

}
.staff_label a {
    display: inline-block;
    background-color: #eb0028;
    color: #fff;
    padding: 0px 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.staff_label a:hover {
    text-decoration: none;
}
#comment_staff_lable {
    display: inline-block;
    background-color: #eb0028;
    color: #fff;
    padding: 0px 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-left: 10px;
}
#comment_staff_lable:hover {
    text-decoration: none;
}
#conversition_container {
    position: fixed;
    top: 100%;
    bottom: auto;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    width: 80%;
    z-index: 99;
}
#conversition_container .messageBox {
    width: 100%;
    max-height: 500px;
    overflow-y: scroll;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#conversition_container #MessageForm {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 0;
}
/* 设置滚动条的样式 */
::-webkit-scrollbar {
    width:12px;
    background-color: #fff;
}

/* 滚动槽 */
::-webkit-scrollbar-track {
    border-radius:10px;
}
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
    border-radius:10px;
    background:black;
}
::-webkit-scrollbar {
    width: 6px;
    background-color: #fff;
}

::-webkit-scrollbar-thumb {
    background-color: #444;
}
#conversition_container_closer {
    position: absolute;
    color: #333;
    font-size: 40px;
    cursor: pointer;
    right: 10px;
    top: 10px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
}
.conversation_notify {
    width: 100%;
    margin-bottom: 20px;
    background-color: #f1f1f1;
}
.handle_container {
    background-color: #fff;
    width: 280px;
    overflow: hidden;
    border-right: 1px solid rgba(151,151,151,.2);
}
.searchBox {
    position: relative;
    height: 42px;
    line-height: 42px;
    padding: 0 14px;
    border-bottom: 1px solid #DEDEDE;
}
.searchInfo {
    background-color: #D8D8D8;
    opacity: .6;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    height: 22px;
    line-height: 22px;
    border: 1px solid #f5f5f5;
    font-size: 12px;
    padding: 0 30px;
}
.searchBox .searchIcon {
    position: absolute;
    top: 50%;
    left: 20px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 13px;
    height: 13px;
}
.messageListContainer {
    width: 100%;
}

.messageListContainer ul .messageItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    color: #7e7f84;
    padding: 11px 14px;
    margin-bottom: 0;
    border-bottom: 1px solid #f1f1f1;
    cursor: pointer;
    position: relative;
}
.messageListContainer ul .messageItem:hover .handleBtn {
    top: 100%;
    z-index: 2;
    opacity: 1;
}
.messageListContainer ul .messageItem .handleBtn {
    position: absolute;
    background-color: #f1f1f1;
    right: 0;
    top: 90%;
    width: 100%;
    font-size: 12px;
    color: #000;
    opacity: 0;
    -webkit-transition: all 0.2s 0.2s;
    -moz-transition: all 0.2s 0.2s;
    -ms-transition: all 0.2s 0.2s;
    -o-transition: all 0.2s 0.2s;
    transition: all 0.2s 0.2s;
    z-index: 0;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -ms-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    -o-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
.messageListContainer ul .messageItem .handleBtn ul {
    display: flex;
    justify-content: space-around;
}
.messageListContainer ul .messageItem .handleBtn li {
    font-size: 12px;
    color: #7e7f84;
}
.messageListContainer ul .messageItem .handleBtn li:hover {
    color: #000;
}
.messageListContainer ul .messageItem .content {
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-height: 12px;
}
.messageListContainer ul .messageItem .userInfo {
    width: 75%;
}
.messageListContainer ul .messageItem img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
}
.messageListContainer ul .messageItem .userInfo .userName {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    width: 100%;
}
.messageListContainer ul .messageItem .userInfo .userName .name {
    color: #000;
    font-weight: 700;
}
.MessageListItem {
    font-size: 12px;
    color: #7e7f84;
}
.notification {
    width: 100%;
    background-color: #F7F7F7;
    padding-bottom: 10px;
}
.notification.isEmpty {
    padding: 0;
}
.notification .messagesList {
    margin-bottom: 0;
    background-color: #fff;
    overflow-y: scroll;
    max-height: 260px;
}
.notification .messagesList .item{
    width: 100%;
    padding: 19px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f7f7f7;
}
.notification .messagesList .item:after {
    border-bottom: 0;
}
.notification .messagesList .item .userInfoBox .userImg {
    width: 50px;
    height: 50px;
    margin-right: 11px;
}
.notification .messagesList .item .userInfoBox .userImg img {
    width: 100%;
    height: 100%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.notification .messagesList .item .userInfoBox {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
}
.notification .messagesList .item .userInfoBox .userInfo {
    display: inline-flex;
}
.notification .messagesList .item .userInfoBox .userInfo .info{
    display: inline-flex;
    flex-direction: column;
    margin-right: 20px;
}
.notification .messagesList .item .userInfoBox .userInfo .info .name {
    font-weight: 700;
    font-size: 20px;
}
.notification .messagesList .item .handle_btn {
    display: inline-flex;
    justify-content: space-around;
    align-items: center;
}
.notification .messagesList .item .handle_btn span {
    display: inline-block;
    cursor: pointer;
    width: 73px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    line-height: 32px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
    background-color: #eb0028;
    color: #fff;
}
.notification .messagesList .item .handle_btn span.refuse {
    margin-right: 20px;
    background-color: #D0D0D0;
}
.hasNewMessage {
    position: relative;
}
.hasNewMessage:after {
    position: absolute;
    top: 0;
    right: 0;
    content: '';
    width: 10px;
    height: 10px;
    background-color: #eb0028;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.friendApply {
    display: block;
    width: 50%;
    height: 30px;
    line-height: 30px;
    color: #fff;
    background-color: #eb0028;
    margin: 0 auto;
    cursor: pointer;
    border: none;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 12px;
}
.friendApply.isDisabled {
    opacity: 0.5;
    cursor: auto;
}
.social-container {
    float: left;
    width: 100px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.social-container .friendApply,.social-container #postMessage {
    width: 80%;
}
.startTalk {
    display: flex;
    justify-content: center;
    padding-top: 10px;
}
.startTalk .content {
    color: #fff;
    background-color: #ccc;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 0 30px;
    display: inline-block;
}
.commentUserContainer {
    display: flex;
    flex-direction: column;
    align-items: center;
    float: left;
    margin-right: 10px;
}
.commentUserContainer img {
    width: 58px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.agreement-container {
    max-width: 1200px;
    width: 80%;
    background: #fff;
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 10000;
    padding: 40px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    overflow: hidden;
}
.agreement-container .box {
    max-height: 400px;
    overflow-y: scroll;
    padding-bottom: 100px;
}
.agreement-container .content {
    position: relative;
}
.agreement-container .content:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    height: 93px;
    background: linear-gradient(360deg, #FFFFFF 21%, rgba(255, 255, 255, 0.68) 70%, rgba(255, 255, 255, 0) 100%);
    width: 100%;
}
.agreement-container .title {
    color: #4d4d4d;
    font-size: 40px;
    margin-bottom: 20px;
    position: relative;
    z-index: 2;
}
.agreement-container .handles {
    padding-top: 20px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.agreement-container .handles .btns {
    width: 100px;
    height: 30px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background-color: #fff;
    color: #4d4d4d;
    text-align: center;
    margin-left: 20px;
    border: 1px solid #000;
    outline: none;
}
.agreement-container .handles .btns.accept_btn {
    border: 0;
    background-color: #eb0028;
    color: #fff;
}
.agreement-mask {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,.5);
    z-index: 998;
}
.agreement-container .top_line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 126px;
    background: linear-gradient(180deg, rgba(100, 169, 255, 0.2) 0%, rgba(255, 255, 255, 0.53) 49%, #FFFFFF 89%);
    display: flex;
    justify-content: flex-end;
    padding: 0 20px;
}
.agreement-container .title>span {
    margin-right: 50px;
    cursor: pointer;
}
.agreement-container .title>.active {
    color: #eb0028;
    border-bottom: 1px solid #eb0028;
}
.close-btn {
    color: #4d4d4d;
    font-size: 30px;
    cursor: pointer;
}