$color2: #9d9d9d; .artbox_list_container { p { font-size: 13px; margin-top: 10px; margin-bottom: 0; color: #f26522; } } .input_bl { //@include wfl; @extend .input-wr; padding-left: 0; padding-right: 0; } .submit_btn { margin-top: 20px; button { @extend .btn_; width: 156px; margin: 0 auto; float: none; //border: 1px solid $link-color; font-size: 11px; text-transform: uppercase; &:hover { border: 1px solid $blocks-color-hover; } } } .comments-wr, .artbox_item_container, .artbox_item_info { @include wfl; } .comment-answer, .comments-wr { padding-bottom: 14px; border-bottom: 1px solid #e1e1e1; } .comments-wr { margin-top: 18px; } .artbox_item_container{ margin-top: 20px; } .artbox_item_info { position: relative; } //$widthIcoUser:48; $widthIcoUser:80; .user-ico { width: $widthIcoUser + px; height: $widthIcoUser + px; float: left; overflow: hidden; //border-radius: 50%; position: absolute; left: 0; top: 0; text-transform: uppercase; text-align: center; line-height: $widthIcoUser + px; background: #e0e2e7; font-size: 24px; color: #fff; img { width: 100%; height: 100%; } } .user_data, .user_name, .user_rating, .user_txt, .artbox_item_tools { //padding-left: $widthIcoUser + 20 + px; @include wfl; font-size: 13px; font-weight: 700; margin-top: 13px; } .artbox_item_tools { margin-top: 0; } .user_data { margin-top: -5px; color: $color2; } .user_name { font-weight: 700; } .artbox_children_container { @include wfl; padding-left: 20 + px; position: relative; &:before { width: 14px; height: 11px; background: url(../images-new/ico-61.png) no-repeat; position: absolute; content: ''; top: -1px; z-index: 2; left: 136px; } } .artbox_comment_container { padding-bottom: 20px; .rateit { cursor: pointer; } label { font-size: 13px; } .empty { color: $color2; margin-top: 20px; } } .artbox_item_reply { //padding-left: 100px; @include wfl; } .artbox_child_info { @extend .artbox_item_info; } .artbox_child_tools { @extend .artbox_item_tools; } .artbox_child_container { @include wfl; margin-top: 20px; } .btn-comm-answer { font-size: 11px; } .artbox_child_reply, .artbox_item_reply { button { display: block; float: left; cursor: pointer; outline: none !important; line-height: 34px; padding: 0 15px; height: 34px; font-size: 11px; text-transform: uppercase; margin-top: 10px; } button[type="submit"] { background: $blocks-color; color: #fff; border: 1px solid $blocks-color; &:hover { background: #fff; color: $blocks-color-hover; } &:active { background: $blocks-color-active; color: #fff; border: 1px solid$blocks-color-active; } } $colorCancelRed:#de3b1b; $colorCancelRedActive: #862315; button[type="button"] { float: right; color: $colorCancelRed; border: 0; background: none; &:hover { background: $colorCancelRed; color: #fff; } &:active { background: $colorCancelRedActive; color: #fff; } } } .comment_form_name { font-weight: 500; font-size: 18px; } .form-comm-wr { width: 100%; background: #f5f5f5; padding: 16px 20px 30px; float: left; border-radius: 4px; } .form-comm-wr .input_bl { width: 100%; float: left; margin-top: 17px; } .artbox_item_container label, .form-comm-wr label { position: relative; font-size: 13px; color: #888; float: left; } .artbox_form_container { margin-top: 30px; } @media (max-width: 992px) { .user_data, .user_name, .user_rating, .user_txt, .artbox_item_tools, .artbox_child_tools { //padding-left: 60px; } } @media (max-width: 900px) { .artbox_child_reply, .artbox_item_reply { button { padding: 0 10px; } } } @media (max-width: 767px) { .artbox_child_reply button[type="button"], .artbox_item_reply button[type="button"] { padding: 0 !important; background: none !important; color: #de3b1b !important; } } @media (max-width: 405px) { .artbox_child_reply button[type="button"], .artbox_item_reply button[type="button"] { float: left; } }