﻿/**
 * Created by guangtian on 16/5/12.
 * source: components/floatBarRight/floatBarRight.css
 */
.CCC-float-bar-right {
    width: 62px;
    border: 1px solid #D9D9D9;
    position: fixed;
    bottom: 40px;
    left: 50%;
    /*margin-left: 603px;*/
    /*display: none;*/
}

.CCC-float-bar-right .CCC-fbr-box {
    margin: 0;
    width: 62px;
    height: 62px;

    display: block;
    background: #f7f7f7;
    border-bottom: 1px solid #ff8500;
    position: relative;
}

.CCC-float-bar-right .CCC-fbr-box:hover {
    background-color: #ff8500;
    background-repeat: no-repeat;
    background-position: -62px 0;
}

.CCC-float-bar-right .CCC-fbr-to-top {
    border-bottom: none;
}

.CCC-float-bar-right .CCC-fbr-home {
    background: url(../images/2aca2ac7dc216e4a2f210a0238faf339.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-home:hover {
    background-image: url(../images/2aca2ac7dc216e4a2f210a0238faf339.png);
}

.CCC-float-bar-right .CCC-fbr-comment {
    background: url(../images/1c0f5db4fe97b035ecdb43a91e492961.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-comment:hover {
    background-image: url(../images/1c0f5db4fe97b035ecdb43a91e492961.png);
}



.CCC-float-bar-right .CCC-fbf-preventComment{
    background-color: #d9d9d9;
}
.CCC-float-bar-right .CCC-fbf-preventComment:hover{
    background-color: #d9d9d9;
    background-position: 0 0;
    cursor: default;
}



.CCC-float-bar-right .CCC-fbr-share {
    background: url(../images/40b6e9494c042dc1cb8682aac0e174d0.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-share:hover {
    background-image: url(../images/40b6e9494c042dc1cb8682aac0e174d0.png);
}

.CCC-float-bar-right .CCC-fbr-rel-read {
    background: url(../images/9bda1595692833a35266d0166794579a.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-rel-read:hover {
    background-image: url(../images/9bda1595692833a35266d0166794579a.png);
}

.CCC-float-bar-right .CCC-fbr-rec-read {
    background: url(../images/9bda1595692833a35266d0166794579a.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-rec-read:hover {
    background-image: url(../images/9bda1595692833a35266d0166794579a.png);
}

.CCC-float-bar-right .CCC-fbr-share-weibo {
    background: url(../images/b2dc9d062dfa9b83e7d014f78058f61c.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-share-weibo:hover {
    background-image: url(../images/b2dc9d062dfa9b83e7d014f78058f61c.png);
}

.CCC-float-bar-right .CCC-fbr-share-weixin {
    background: url(../images/76eca8efdc993ebd26e02a8f03c27baf.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-share-weixin:hover {
    background-image: url(../images/76eca8efdc993ebd26e02a8f03c27baf.png);
}

.CCC-float-bar-right .CCC-fbr-to-top {
    background: url(../images/41b1c76ccf09dc08379eb9dbaa818d5f.png) no-repeat 0 0;
}

.CCC-float-bar-right .CCC-fbr-to-top:hover {
    background-image: url(../images/41b1c76ccf09dc08379eb9dbaa818d5f.png);
}

.CCC-float-bar-right .CCC-fbr-title {
    position: absolute;
    bottom: 7px;
    display: inline-block;
    width: 62px;
    text-align: center;
    font-size: 12px;
    color: #7b7b7b;
}

.CCC-float-bar-right .CCC-fbr-box:hover .CCC-fbr-title {
    color: #fff;
}

.CCC-float-bar-right .CCC-fbf-preventComment:hover .CCC-fbr-title{
    color: #7b7b7b;
}

.CCC-float-bar-right .CCC-fbr-box .CCC-fbr-dian {
    position: absolute;
    width: 14px;
    height: 14px;
    background: url(data:image/gif;base64,R0lGODlhDAAMAJEDAP/U1f/Fx+k0O////yH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxOTVERTM2QzBBQTQxMUU2ODk4NUMwM0U4NUMyNEY2NSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoxOTVERTM2RDBBQTQxMUU2ODk4NUMwM0U4NUMyNEY2NSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjE5NURFMzZBMEFBNDExRTY4OTg1QzAzRTg1QzI0RjY1IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE5NURFMzZCMEFBNDExRTY4OTg1QzAzRTg1QzI0RjY1Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEBQ8AAwAsAAAAAAwADAAAAhGcj6nLKC8WhGq+avGUtPnfFAAh+QQJDwADACwCAAIACAAIAAACD9yAYLesfV5DMFYlmUmvAAAh+QQJDwADACwAAAAADAAMAAACJZyPGcsaYMA6U1gxZgb3ShMMnZWB4lhuo/BlYedST6TJTJjkRwEAIfkECQ8AAwAsAAAAAAwADAAAAiCcg2mnk8HWQg4OgQWjOVfbYdEVbmT3gV7FSu2zWTFlFAAh+QQJCAADACwAAAAADAAMAAACIJyDaavTHhaLyIgrjsIYxsFdmhVqUZglHzdWEjR9j/kUACH5BAUIAAMALAAAAAAMAAwAAAIgnINpizt9gotPDoFFtDnT22mVEYpQuZHeCDltO7pJWwAAOw==) no-repeat 0 0;
    right: 8px;
    top: 5px;
}

.CCC-float-bar-right .CCC-fbr-box:hover .CCC-fbr-dian {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0Q0U2NTJBNDE3NTMxMUU2OURBMkU4OERCRDczNjRCMCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0Q0U2NTJBNTE3NTMxMUU2OURBMkU4OERCRDczNjRCMCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjRDRTY1MkEyMTc1MzExRTY5REEyRTg4REJENzM2NEIwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjRDRTY1MkEzMTc1MzExRTY5REEyRTg4REJENzM2NEIwIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+ECszHgAAAFpJREFUeNpi/P//PwMpgImBRICuYRoQ/0fD05AVsKApznxlaoNigtjpI5lQZhaIYETyw390xUiawGqp4gfaapgOdSs290+HC4A8jYSn/ccE05DVMNI8pgECDAA2XkSDwAbgdAAAAABJRU5ErkJggg==) no-repeat 0 0;
}/**
 * Created by guangtian on 16/5/12.
 * source: components/floatBarRight/weixinBox.css
 */
.CCC-weixin-box {
    left: 50%;
    top: 50%;
    margin-left: -110px;
    margin-top: -123px;
    position: fixed;
    height: 246px;
    width: 220px;
    z-index: 100000001;
    font-size: 12px;
    border: 6px solid #7f7f7f;
    border-radius: 5px;
    display: none;
}

.CCC-weixin-box .CCC-wxb-top {
    width: 100%;
    color: #666;
    background: #f2f2f2;
    height: 24px;
    line-height: 24px;
    border-bottom: 1px solid #e8e8e8;
}

.CCC-weixin-box .CCC-wxb-close {
    top: 0;
    right: 15px;
    cursor: pointer;
    position: absolute;
    z-index: 10000000;
    color: #666;
    font-weight: bold;
    font-family: Helvetica, Arial;
    font-size: 14px;
    line-height: 24px;
}

.CCC-weixin-box .CCC-wxb-top span {
    margin-left: 15px;
}

.CCC-weixin-box .CCC-wxb-qrcode-box {
    background-color: #fff;
    height: 220px;
    width: 220px;
}

.CCC-weixin-box .CCC-wxb-qrcode-box img {
    width: 178px;
    height: 178px;
    margin: 21px;
}.CCC-comment-box {
    width: 937px;
    position: fixed;
    display: none;
    top: 0;
    right: -937px;
    z-index: 90001;
}

.CCC-comment-mode .CCC-comment-box {
    right: 0;
    -webkit-animation: showComment .5s forwards;
    animation: showComment .5s forwards;
    display: block;
}

.CCC-comment-box .CCC-comment-close {
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 37px;
    overflow: hidden;
    background: url("../images/comment_close.png") no-repeat 6px center #fff;
    border: 1px solid #D8D8D8;
    border-right: 0;
    text-indent: -9999px;
    border-radius: 3px 0 0 3px;
    z-index: 100;
}

.CCC-comment-box .CCC-comment-wrap {
    margin-left: 21px;
    border-top: 0;
}

@-webkit-keyframes showComment {
    0% {
        right: -100%
    }
    60% {
        right: -2%
    }
    80% {
        right: -1%
    }
    100% {
        right: 0
    }
}

@keyframes showComment {
    0% {
        right: -100%
    }
    60% {
        right: -2%
    }
    80% {
        right: -1%
    }
    100% {
        right: 0
    }
}