/*************************/ /***** microBlogMenu *****/ /*************************/ #microBlogMenu { width: 650px; padding:14px 0px 0px 10px; background:url(../../web_images/bgMicroBlogMenu.png) no-repeat left top; height:36px; display:block; } #microBlogMenu a{ width:103px; height:34px;/*20-02-2010*/ display:block; float:left; margin-right:3px; } #microBlogMenu a span { text-align:center; display:block; width:103px; font-family:Verdana; font-size:18px; color:#7dd1f2; margin-top:5px; } #microBlogMenu a:hover,#microBlogMenu a.current{ font-family:Verdana; font-size:18px; color:#269bcf; background:url(../../web_images/tab-vr.png) no-repeat top left; } #microBlogMenu a:hover span,#microBlogMenu a.current span{ text-align:center; display:block; width:103px; font-family:Verdana; font-size:18px; color:#269bcf; } /*************************/ /***** wrapMicroBlog *****/ /*************************/ #wrapMicroBlog { display: block; width: 660px; padding:25px 0px 0px 0px; overflow: hidden; } #wrapMicroBlog .wrapMicroBlogTop{ display: block; width:660px; } #wrapMicroBlog .wrapMicroBlogTop p a{ float:left; color:#999; font-weight:bold; padding:0px 0px 0px 0px; margin:5px 0px 0px 0px; } #wrapMicroBlog .wrapMicroBlogTop p.following a{ padding-right: 5px; border-right:0px solid #bbbbbb; } #wrapMicroBlog .wrapMicroBlogTop p.follower a{ padding-left: 5px; border-left:1px solid #bbbbbb; } #wrapMicroBlog .wrapMicroBlogTop p a:hover,#wrapMicroBlog .wrapMicroBlogTop p a.active{ float:left; color:#269bcf; } #wrapMicroBlog .wrapMicroBlogTop .searchBox{ float:right; height:25px; width:450px; margin:0px 0px 0px 0px; background:none; } #wrapMicroBlog .wrapMicroBlogTop .searchBox a.refreshSearch{ text-indent:-9999px; background:url(../../web_images/iconRefresh.png) no-repeat left top; height:25px; width:69px; display:block; float:left; } #wrapMicroBlog .wrapMicroBlogTop .searchBox input.searchFollow{ border:1px solid #ebebeb; width:345px; height:19px; display:block; float:left; margin:0px 0px 0px 0px; padding:4px 2px 0px 2px; background:#FFF; font-size:12px; color:#333; } #wrapMicroBlog .wrapMicroBlogTop .searchBox button.searchButton{ background:url(../../web_images/iconSearch.png) no-repeat top right; height:24px; width:29px; margin:0px 0px 0px 0px; padding:0px 0px 0px 5px; display:block; float:left; cursor:pointer; } #wrapMicroBlog .wrapMicroBlogTop textarea.followText{ clear:both; float:left; margin:8px 0px 8px 0px; padding:8px; color:#888889; border:1px solid #53728D; display:block; width:642px; font-family:Tahoma; font-size:12px; } #wrapMicroBlog .wrapMicroBlogTop .tltComment{ background:url(../../web_images/tlt-comment.png) no-repeat; width:193px; height:30px; margin:20px 0 8px 0;} .lineComment{ border-bottom:#ebebeb solid 1px; margin:32px 0 -20px 0;} #wrapMicroBlog .wrapMicroBlogTop a.updateButton{ float:left; width:131px; height:34px; display:block; background:url(../../web_images/btn-ok.jpg) no-repeat; text-indent:-9999px; } #wrapMicroBlog .wrapMicroBlogTop a:hover.updateButton{ width:131px; height:34px; background:url(../../web_images/btn-ok.jpg) no-repeat 0 -34px; } /*28-01-2011*/#wrapMicroBlog .wrapMicroBlogTop .alertBoard{ float:left; font-size:12px; color:#FF0000; margin-bottom:20px;} /*28-01-2011*/#wrapMicroBlog .wrapMicroBlogTop .alertBoard a{ font-size:12px; color:#FF0000; } /*28-01-2011*/#wrapMicroBlog .wrapMicroBlogTop .alertBoard a:hover{ font-size:12px; color:#FF0000; text-decoration:underline;} /*28-01-2011*/#wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard{ float:right; margin-left:21px; width:500px; overflow:hidden; color:#666; font-size:11px; /*margin-top:6px;*/ text-align:right;} #wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard span{ } #wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard span a{color:#009bdf; text-decoration:underline; font-size:11px; margin:0 15px 0 0px;} #wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard span a:hover{color:#009bdf; text-decoration:none; font-size:11px;} /*#wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard span select{ color:#666; border:#bbb solid 1px; padding:2px 0px 2px 4px; font-size:11px;width:200px;}*/ /*28-01-2011*/#wrapMicroBlog .wrapMicroBlogTop .wrapRoomBoard span select{ float:right; background:url(../../web_images/webboard2011/bg_input.png) no-repeat; width:225px; height:30px; border:0; padding:4px 16px 9px 4px; font-size:12px; color:#555; margin-right:-10px;} #wrapMicroBlog .wrapMicroBlogBottom { display: block; width: 660px; padding:10px 0px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox{} #wrapMicroBlog .wrapMicroBlogBottom .followBox .userPic { float: left; height: 50px; width: 50px; padding-right: 20px; padding-top:14px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox { background-color: #FFF; display: block; width: 570px; border-bottom: 1px solid #ebebeb; float:left; padding:10px 10px 20px 10px;/*Add 27-04-2010*/ position:relative;/*Add 27-04-2010*/ } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox:hover { background-color: #fafafa; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox p.username { color: #269bcf; font-size:14px; font-weight:bold; float:left; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox p.username a{color: #269bcf;font-weight:bold;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox p.username a:hover{font-weight:bold; color:#50C3EF;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.keepLink { float:right; background: url(../../web_images/icon_fav.png) no-repeat top left;/* Add 9-02-2010 */ display: block; padding-left: 16px; padding-top:1px; color:#50c3ef; height:16px; font-size:11px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.keepLink:hover{color:#09c;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox p.comment { width:570px; float:left; padding:5px 0px 20px 0px; color:#888889; line-height:1.3em; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox p.comment span.time{ font-size:10px; color:#7ca500; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.answer { background: url(../../web_images/iconAnswer.png) no-repeat top left; padding-left: 18px; padding-right:5px; display: block; float:right; color:#50c3ef; font-size:11px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.answer:hover{color:#09c;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.forwardText { background: url(../../web_images/iconForward.png) no-repeat top left; padding-left: 20px; padding-right:5px; display: block; float:right; color:#50c3ef; font-size:11px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.forwardText:hover{ color:#09c;} /* Add 9-02-2010 */ #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.plusButton { background: url(../../web_images/iconPlus.png) no-repeat bottom right; display: block; height:14px; padding-right:16px; color:#50c3ef; text-align:right; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.plusButton:hover{color:#09c;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.minusButton { background: url(../../web_images/iconMinus.png) no-repeat bottom right; display: block; height:14px; padding-right:16px; color:#50c3ef; text-align:right; font-size:11px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox a.minusButton:hover{color:#09c;} /* End */ #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .answerCommentBox { background-color: #e7f7fc; clear:both; padding:10px; display:block; width:385px; margin:0px 0px 10px 0px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .answerCommentBox .userPic { float: left; height: 30px; width: 30px; padding-right: 10px; padding-top:4px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .answerCommentBox p.comment { width:310px; float:left; padding:5px 0px 0px 0px; color:#888; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .answerCommentBox p.comment a{ color:#8fbb25; font-weight:bold;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .answerCommentBox p.comment a:hover{ color:#668f04; font-weight:bold;} #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .notAnswerCommentBox { background-color: #f7f7f7; clear:both; padding:10px; display:block; width:385px; margin:0px 0px 10px 0px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .notAnswerCommentBox .userPic { float: left; height: 30px; width: 30px; padding-right: 10px; padding-top:0px; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .notAnswerCommentBox p.comment { width:310px; float:left; padding:5px 0px 0px 0px; color:#888; } #wrapMicroBlog .wrapMicroBlogBottom .followBox .commentBox .notAnswerCommentBox p.comment a{color:#8fbb25; font-weight:bold;} #wrapMicroBlog .moreButton { background-image: url(../../web_images/buttonMore.png); background-repeat: no-repeat; background-position: left bottom; display: block; float: right; width:97px; height:32px; text-indent:-9999px; margin:20px 0px 0px 0px; } #wrapMicroBlog .loginComm{ float:left; margin-top:20px;} #wrapMicroBlog .loginComm a{ background:url(../../web_images/loginPostComm.jpg) no-repeat; width:660px; height:172px; text-indent:-9999px; display:block;} #wrapMicroBlog .loginComm a:hover{background:url(../../web_images/loginPostComm.jpg) no-repeat 0 -172px; width:660px; height:172px;} /* Add 9-02-2010 */ .converMicro{ clear:both; margin-bottom:10px; font-size:11px;} /* End */ /******************/ /***** action *****/ /******************/ #action { display: block; width: 660px; padding:25px 0px 0px 0px; overflow: hidden; } #action .wrapAction .userPic { float: left; height: 50px; width: 50px; padding-right: 20px; padding-top:14px; } #action .wrapAction .wrapActionBox{ background-color: #FFF; display: block; width: 570px; border-bottom: 1px solid #ebebeb; float:left; padding:10px 10px 10px 10px; color:#bbbbbb; } #action .wrapAction .wrapActionBox:hover { background-color: #fafafa; } #action .wrapAction .wrapActionBox p.username { color: #269bcf; font-size:14px; font-weight:bold; float:left; font-family:Verdana; } #action .wrapAction .wrapActionBox p.username a{color: #269bcf;font-weight:bold;font-size:14px;} #action .wrapAction .wrapActionBox p.username a:hover{color: #7DD1F2; font-weight:bold;font-size:14px;} #action .wrapAction .wrapActionBox a.keepLink { float:right; background: url(../../web_images/icon-view.png) no-repeat top left; display: block; padding-left: 20px; padding-top:1px; color:#79cff0; } #action .wrapAction .wrapActionBox a:hover.keepLink{color:#269BCF;} #action .wrapAction .wrapActionBox .comment { width:330px; float:left; clear:both; padding:5px 0px 5px 0px; color:#888889; font-size:12px; font-family:Tahoma; } #action .wrapAction .wrapActionBox .comment a{color:#4C8BD8;} #action .wrapAction .wrapActionBox .comment a:hover{color:#3c6fad;} #action .wrapAction span.time{ font-size:11px; color:#7ca500; } #action .wrapAction a.readMore{ font-size:11px; color:#f79c1c; } #action .wrapAction a:hover.readMore{ font-size:11px; color:#FF6600; } #action .moreButton { background: url(../../web_images/buttonMore.png) no-repeat left bottom; display: block; float: right; width:97px; height:32px; text-indent:-9999px; margin:20px 0px 0px 0px; cursor:hand; } /** wrapPhoto **/ /** microblog-photo.html **/ #wrapPhoto { width:650px; padding:25px 5px 0px 5px; overflow:hidden; } #wrapPhoto .title { overflow:hidden; } #wrapPhoto .title .photoName{ float:left; clear:left; margin:5px 0px 0px 5px; } #wrapPhoto .title .photoName span { color:#008CD0; font-size:18px; font-weight:700; } #wrapPhoto .title .photoName span.number { color:#888889; font-size:11px; font-weight:400; } #wrapPhoto .title .photoName span.number span.numberPhoto { color:#666666; font-size:10px; font-weight:400; } #wrapPhoto .title .createNew{ float:right; clear:right; margin-right:5px; } #wrapPhoto .wrapGroupPhoto { width:283px; margin:5px; border:1px solid #ebebeb; float:left; padding:15px; position:relative; } #wrapPhoto .wrapGroupPhoto .pic { float:left; } #wrapPhoto .wrapGroupPhoto .detail { float:left; margin-left:10px; } #wrapPhoto .wrapGroupPhoto .detail p.albumName a { color:#666666; font-weight:700; font-size:14px; font-family:Verdana;} #wrapPhoto .wrapGroupPhoto .detail p.albumName a:hover { color:#008CD0; } #wrapPhoto .wrapGroupPhoto .detail p{ color:#666666; font-size:11px; padding:2px 0px; } #wrapPhoto .wrapGroupPhoto .linkEdit { position:absolute; bottom:15px; right:15px; color:#999; } #wrapPhoto .wrapGroupPhoto .linkEdit a{ color:#7ca500; font-size:12px; } #wrapPhoto .wrapGroupPhoto .linkEdit a:hover{ color:#578e00;} #wrapPhoto .formBox { width:650px; margin-top:10px; } #wrapPhoto .formBox form { width:580px; } #wrapPhoto .formBox .labelField { float:left; width:175px; color:#555; margin-bottom:10px; text-align:right; } #wrapPhoto .formBox .labelField label { color:#555; } #wrapPhoto .formBox .inputField { float:left; width:300px; color:#666; margin-bottom:10px; margin-left:20px; color:#666; } #wrapPhoto .formBox .inputField input { width:262px; color:#666;} #wrapPhoto .formBox .selectField { float:left; width:265px; color:#555; margin-bottom:5px; margin-left:10px; padding:1px; } #wrapPhoto .formBox .browseField { float:left; width:385px; color:#555; margin-bottom:10px; margin-left:20px;} #wrapPhoto .formBox .browseField input{} #wrapPhoto .formBox .browseField .browseFieldWidth{ width:500px;} #wrapPhoto .formBox .plusPhoto { background:url(../../web_images/icon-add-01.png) no-repeat left center; padding-left:20px; float:right; clear:both;} #wrapPhoto .formBox .plusPhoto a{ color:#0063DC;} #wrapPhoto .formBox .plusPhoto a:hover{ color:#428ae2;} #wrapPhoto .formBox .submitField { margin-top:10px; text-align:center; } #wrapPhoto .formBox .submitField input.upload { background:url(../../web_images/uploadButton.gif) no-repeat top left; width:92px; height:24px; text-indent:-9999px; border:0px none; margin-left:20px; } #wrapPhoto .formBox .submitField input.cancel { background:url(../../web_images/cancelButton.gif) no-repeat top left; width:84px; height:24px; text-indent:-9999px; border:0px none; margin-left:20px; } #wrapPhoto .formBoxFacebook { width:650px; margin-top:20px; } #wrapPhoto .formBoxFacebook form { padding:10px 0px; } #wrapPhoto .formBoxFacebook .labelField { float:left; width:100px; color:#555; margin-bottom:10px; text-align:left; } #wrapPhoto .formBoxFacebook .labelField label { color:#555; } #wrapPhoto .formBoxFacebook .inputField { float:left; width:485px; color:#555; margin-bottom:10px; margin-left:20px; } #wrapPhoto .formBoxFacebook .inputField input { width:480px; } #wrapPhoto .formBoxFacebook .selectField { float:left; width:480; color:#555; margin-bottom:10px; margin-left:20px; } #wrapPhoto .formBoxFacebook .submitField { margin-top:10px; text-align:center; } #wrapPhoto .formBoxFacebook .submitField input.upload { background:url(../../web_images/uploadButton.gif) no-repeat top left; width:92px; height:24px; text-indent:-9999px; border:0px none; margin-left:20px; cursor:pointer; } #wrapPhoto .formBoxFacebook .submitField input.cancel { background:url(../../web_images/cancelButton.gif) no-repeat top left; width:84px; height:24px; text-indent:-9999px; border:0px none; margin-left:20px; cursor:pointer; } #editAlbum { width:650px; padding:25px 5px 0px 5px; overflow:hidden; } #editAlbum .title {} #editAlbum .title .photoName{ float:left; clear:left; margin:5px 0px 0px 5px; } #editAlbum .title .photoName span { color:#269bcf; font-size:14px; font-weight:700; } #editAlbum .title .photoName span.number { color:#666666; font-size:10px; font-weight:400; } #editAlbum .title .photoName span.number span.numberPhoto { color:#666666; font-size:10px; font-weight:400; } #editAlbum .title .createNew{ float:right; clear:right; margin-right:5px; } #editAlbum div.checkBoxAll { margin:5px 0px; padding:0px 20px; } #editAlbum input.checkBoxAll { margin-left:0px; } #editAlbum .wrapEditAlbum { border:1px solid #ebebeb; width:610px; height:180px; padding:9px 19px; margin-bottom:20px; } #editAlbum div.deleteThis { margin-bottom:5px; } #editAlbum input.deleteThis { margin-left:0px; } #editAlbum .wrapEditAlbum .pic { float:left; } #editAlbum .wrapEditAlbum .wrapDetail { float:left; margin-left:20px; } #editAlbum .wrapEditAlbum .wrapDetail label { display:block; margin-bottom:5px; } #editAlbum .wrapEditAlbum .wrapDetail textarea { width:434px; height:122px; } #editAlbum .submitField { margin-top:10px; text-align:center; } #editAlbum .submitField input.saveChange { background:url(../../web_images/saveChangeButton.gif) no-repeat top left; width:96px; height:22px; text-indent:-9999px; border:0px none; margin-left:20px; cursor:pointer; } #editAlbum .submitField input.cancel { background:url(../../web_images/cancelButton2.gif) no-repeat top left; width:60px; height:22px; text-indent:-9999px; border:0px none; margin-left:20px; cursor:pointer; } #viewPhoto { width:650px; padding:25px 5px 0px 5px; overflow:hidden; } #viewPhoto .title {} #viewPhoto .title div.photoName{ float:left; clear:left; margin:5px 0px 0px 5px; } #viewPhoto .title .photoName span { color:#269bcf; font-size:14px; font-weight:700; } #viewPhoto .title .photoName span.number { color:#666666; font-size:10px; font-weight:400; } #viewPhoto .title .photoName span.number span.numberPhoto { color:#666666; font-size:10px; font-weight:400; } #viewPhoto .title .createNew{ float:right; clear:right; margin-right:5px; } #viewPhoto .wrapViewPhoto { width:600px; margin:10px 5px; padding:19px; border:1px solid #ebebeb; } #viewPhoto .wrapViewPhoto .linkBox { margin-bottom:10px; } #viewPhoto .wrapViewPhoto .linkBox a { color:#666666; } #viewPhoto .wrapViewPhoto .linkBox a.leftSide{ float:left; background:url(../../web_images/leftSide.gif) no-repeat center left; padding-left:15px; } #viewPhoto .wrapViewPhoto .linkBox a.rightSide{ float:right; background:url(../../web_images/rightSide.gif) no-repeat center right; padding-right:15px; } #viewPhoto .wrapViewPhoto .detailBox { background:url(../../web_images/bgEditPhoto.gif) no-repeat bottom left; width:500px; height:24px; padding:11px 50px; position:relative; } #viewPhoto .wrapViewPhoto .detailBox2 { background:url(../../web_images/bgEditPhoto.gif) no-repeat bottom left; width:500px; height:24px; padding:11px 50px 7px 50px; text-align:center; color:#666666; } #viewPhoto .wrapViewPhoto .detailBox input.textField { width:300px; } #viewPhoto .wrapViewPhoto .detailBox input { margin:0px 2px; } #viewPhoto .wrapViewPhoto .detailBox a.deletePhoto { background:url(../../web_images/iconDeletePhoto.gif) no-repeat center center; text-indent:-9999px; width:30px; height:30px; display:block; position:absolute; top:8px; right:10px; } #viewPhoto .wrapViewPhoto .detailBox img { } #viewPhoto .wrapViewPhoto .slidePhoto { width:600px; height:85px; position:relative; margin:20px 0px 10px 0px; } #viewPhoto .wrapViewPhoto .slidePhoto a.prevButton { background:url(../../web_images/prevButton.gif) no-repeat top left; display:block; width:30px; height:30px; text-indent:-9999px; position:absolute; left:0px; top:27px; } #viewPhoto .wrapViewPhoto .slidePhoto a.nextButton { background:url(../../web_images/nextButton.gif) no-repeat top left; display:block; width:30px; height:30px; text-indent:-9999px; position:absolute; right:0px; top:27px; } #viewPhoto .wrapViewPhoto .slidePhoto .wrapSlide { width:525px; height:85px; margin:0 auto; } #viewPhoto .wrapViewPhoto .slidePhoto .wrapSlide .pic { float:left; padding:4px; border:1px solid #ebebeb; margin:0px 10px; } #viewPhoto .wrapViewPhoto .photoWhere { color:#76bf00; text-align:right; } #commentArea { width:650px; padding:10px 5px 0px 5px; overflow:hidden; } #commentArea h1 { color:#666 !important;} #commentArea .commentBox { width:610px; padding:15px 19px; border-bottom:1px solid #ebebeb; } #commentArea .commentBox .pic { float:left; } #commentArea .commentBox .textBox { float:left; width:545px; position:relative; margin-left:15px; } #commentArea .commentBox .textBox p.username{ color:#269bcf; font-size:12px; font-weight:700; } #commentArea .commentBox .textBox p.username a{ color:#269BCF; font-size:14px; font-weight:bold; } #commentArea .commentBox .textBox p.time { position:absolute; right:0px; top:0px; color:#666; font-size:11px;} #commentArea .commentBox .textBox p.commentText { color:#666; font-size:12px; margin-top:10px; line-height:16px;} #commentArea .pageBar { float:right; clear:both; overflow:hidden; padding:5px 0px; margin-top:10px;} #commentArea .pageBar span { float:left; padding:2px; color:#666; font-size:11px;} #commentArea .pageBar a { float:left; padding:2px; color:#666; margin-right:2px; font-size:11px;} #commentArea .pageBar a:hover,#commentArea .pageBar a.active { float:left; padding:2px; color:#FFF; background:#999; margin-right:2px; font-size:11px;} #postComment { width:400px; padding:10px 5px 0px 5px; clear:both; } #postComment p { color:#666666; font-size:14px; margin:5px 0px; background: url(../../web_images/tlt-postComment.png) no-repeat; width:185px; height:16px; text-indent:-9999px;} #postComment textarea { width:350px; height:100px; margin:5px 0px 10px 0px; border:#dbdbdb solid 1px;} #postComment a.commentButton { background:url(../../web_images/btn-comment.jpg) no-repeat top left; width:95px; height:31px; border:0px none; text-indent:-9999px; cursor:pointer; display:block; } #postComment a.commentButton:hover { background:url(../../web_images/btn-comment-hover.jpg) no-repeat top left; width:95px; height:31px; border:0px none; text-indent:-9999px; cursor:pointer; display:block; } .blankPhoto{ margin:10px 0;} #profileBox { width:650px; padding:25px 5px 25px 5px; overflow:hidden; border-bottom:1px solid #ebebeb; margin-bottom:20px; } #profileDetail { position:relative; } #profileDetail .wrapPic { overflow:hidden; width:176px; float:left; margin-right:20px; } #profileDetail .wrapPic .pic { overflow:hidden; margin-bottom:5px; } #profileDetail .wrapPic .pic .topPic{ background:url(../../web_images/bg-profilePhotoTop.png) no-repeat top left; width:223px; height:11px; } #profileDetail .wrapPic .pic .midPic{ background:url(../../web_images/bg-profilePhotoCenter.png) repeat-y top left; width:200px; padding:1px 11px 1px 12px;} #profileDetail .wrapPic .pic .bottomPic{ background:url(../../web_images/bg-profilePhotoBottom.png) no-repeat top left; width:223px; height:11px; } #profileDetail .wrapPic p.statusOnline { background:url(../../web_images/icon-onLine-tn.png) no-repeat top left; height:18px; width:58px; margin-left:5px; float:left; text-indent:-9999px; } #profileDetail .wrapPic p.statusOffline { background:url(../../web_images/icon-offLine-tn.png) no-repeat top left; height:18px; width:58px; margin-left:5px; float:left; text-indent:-9999px; } #profileDetail .wrapPic p.userID { float:right; color:#666; font-size:11px;} #profileDetail .wrapPic .followBox { clear:both; margin:5px 0px; overflow:hidden; float:left; display:block; width:150px;} #profileDetail .wrapPic .followBox p { margin-left:5px; float:left; color:#666; font-size:11px;} #profileDetail .wrapPic .followBox p a {color:#4C8BD8; text-decoration:underline;} #profileDetail .wrapPic .followBox p a:hover {color:#4C8BD8; text-decoration:none;} #profileDetail .wrapPic .followBox p span { color:#4C8BD8; font-size:11px;} #profileDetail .wrapPic a.editPic { background:url(../../web_images/icon-photo.png) no-repeat top left; padding-left:20px; display:block; float:left; margin:5px 5px 0px 5px; } #profileDetail .wrapPic a.message { background:url(../../web_images/icon-mail.png) no-repeat top left; padding-left:20px; display:block; float:left; margin:5px 5px 0px 5px; } #profileDetail .detail { float:left; width:400px; padding-top:5px; position:relative; } #profileDetail .detail p.username { color:#ef75ac; font-size:16px; font-weight:700; line-height:24px; } #profileDetail .detail p { color:#000000; font-size:12px; font-weight:400; line-height:20px; } #profileDetail .detail a.editProfile { background:url(../../web_images/iconPencil.gif) no-repeat top left; padding-left:20px; display:block; position:absolute; top:5px; right:0px; } /* Add 8-03-2010 */ #profileDetail .username{ color:#269bcf; font-size:36px; float:left; width:340px; font-weight:700; } #profileDetail .editProfile{ color:#666; font-size:11px; width:105px; text-align:right; position:absolute; top:20px; right:0px; } #profileDetail .editProfile a { color:#269BCF;} #profileDetail .editProfile a:hover { color:#0084BE;} #profileDetail .goodBar { clear:both; margin-left:5px; font-size:11px; color:#666;} #profileDetail .diligentBar { clear:both; margin-left:5px; font-size:11px; color:#666;} #userAlbum { position:relative; width:650px; padding-bottom:10px; border-bottom:1px solid #ebebeb; overflow:hidden; margin-bottom:10px;} #userAlbum h1{ background:url(../../web_images/tlt-AlbumPhoto.png) no-repeat; width:87px; height:27px; text-indent:-9999px;} #userAlbum a.editProfile { background:url(../../web_images/iconPencil.gif) no-repeat top left; padding-left:20px; display:block; position:absolute; top:10px; right:0px; font-size:11px; color:#666;} #userAlbum a:hover.editProfile { color:#999;} #userAlbum a.viewAll { background:url(../../web_images/iconPlus.gif) no-repeat top left; padding-left:17px; display:block; position:absolute; top:10px; right:0px; font-size:11px; color:#269bcf;} #userAlbum a:hover.viewAll { color:#0084BE;} #userAlbum .wrapAlbum { float:left; overflow:hidden; margin:0 12px 10px 12px; } #userAlbum .wrapAlbum .pic {} #userAlbum .wrapAlbum .pic .topPic{ background:url(../../web_images/bg-profileThumbTop.png) no-repeat top left; height:8px; width:168px; } #userAlbum .wrapAlbum .pic .midPic{ background:url(../../web_images/bg-profileThumbCenter.png) repeat-y top left; width:150px; padding:1px 9px; } #userAlbum .wrapAlbum .pic .bottomPic{ background:url(../../web_images/bg-profileThumbBottom.png) no-repeat top left; height:8px; width:168px; } #userAlbum .wrapAlbum .detail { margin:5px; } #userAlbum .wrapAlbum .detail .albumName{ color:#666; font-size:12px; font-weight:bold;} #userAlbum .wrapAlbum .detail .albumName a{ color:#666; font-size:12px; font-weight:bold;} #userAlbum .wrapAlbum .detail .albumName a:hover{ color:#999; font-size:12px; font-weight:bold;} #userAlbum .wrapAlbum .detail .numberPhoto { font-size:11px; color:#666;} #userAlbum .wrapAlbum .detail .createDate{ font-size:11px; color:#666; margin-top:4px;} #userAlbum .wrapAlbum .detail .updateDate{ font-size:11px; color:#666; margin-top:4px;} #issueBox { margin-top:10px; float:left; margin-bottom:20px;} #issueBox .topissue{ background:url(../../web_images/bg-profileTop.png) no-repeat top left; width:323px; height:23px; } #issueBox .midissue{ background:url(../../web_images/bg-profileCenter.png) repeat-y top left; width:280px; padding:0px 21px 0px 22px; overflow:hidden; position:relative; color:#555;} #issueBox .midissue h1{ background:url(../../web_images/tlt-issue.png) no-repeat; width:87px; height:28px; text-indent:-9999px;} #issueBox .midissue h1.update{ background:url(../../web_images/tlt-diaryUpdate.png) no-repeat; width:150px; height:28px; text-indent:-9999px;} #issueBox .issueBoxWrap { width:288px; border-bottom:1px solid #dbdbdb; padding:15px 0px 5px 0px; overflow:hidden; } #issueBox .issueBoxWrap .userPic { float:left; } #issueBox .issueBoxWrap .detail { padding-bottom:5px; float:left; width:245px; padding-left:10px; } #issueBox .issueBoxWrap .detail a.username { color:#269bcf; font-weight:700; font-size:12px; padding-right:5px; } #issueBox .issueBoxWrap .detail a:hover.username{ color:#0084BE;} #issueBox .issueBoxWrap .detail a.message { color:#555; text-decoration:underline; font-size:12px; } #issueBox .issueBoxWrap .detail a.message:hover { color:#555; text-decoration:none; } #issueBox .issueBoxWrap .commentDetail { width:200px; overflow:hidden; padding-top:5px; color:#777;} #issueBox .issueBoxWrap .commentDetail div { display:inline; font-size:10px; color:#777;} #issueBox .issueBoxWrap .commentDetail div a { color:#777; } #issueBox .issueBoxWrap .commentDetail div a:hover { color:#000; } #issueBox .issueBoxWrap .commentDetail .likeBox img { float:left; } #issueBox .issueBoxWrap .commentDetail .likeBox span { float:left; margin:3px; font-size:10px; } #issueBox .midissue a.viewAllCol1 { background:url(../../web_images/iconPlus.gif) no-repeat top left; padding-left:17px; display:block; position:absolute; top:8px; right:20px; font-size:11px; color:#269BCF;} #issueBox .midissue a:hover.viewAllCol1{ color:#0084BE;} #issueBox .bottomissue{ background:url(../../web_images/bg-profileBottom.png) no-repeat top left; width:323px; height:23px; } #issueBox h1 { padding-bottom:0px !important; padding-top:0px !important; background:url(../../web_images/icon-issue.png) no-repeat top left; height:25px; padding-left:35px; } #issueBox .wrapIssue { margin:15px 0px; overflow:hidden; } #issueBox .wrapIssue p.headline { float:left; background:url(../../web_images/bullet-Green.gif) no-repeat left 5px; padding-left:15px; width:180px; } #issueBox .wrapIssue p.date{ float:right; width:80px; } #issueBox .linkEdit { float:right; margin-top:5px; } #issueBox a.editProfile { background:url(../../web_images/iconPencil.gif) no-repeat top left; padding-left:20px; display:block; float:left; padding-right:10px; } #BlogBox { margin-top:10px; float:right; } #BlogBox .topblog{ background:url(../../web_images/bg-profileTop.png) no-repeat top left; width:323px; height:23px; } #BlogBox .midblog{ background:url(../../web_images/bg-profileCenter.png) repeat-y top left; width:280px; padding:0px 21px 0px 22px; overflow:hidden; position:relative; } #BlogBox .midblog h1{ background: url(../../web_images/tlt-microblog.png) no-repeat; width:139px; height:25px; text-indent:-9999px;} #BlogBox .midblog h1.update{ background: url(../../web_images/tlt-microblogUpdate.png) no-repeat; width:186px; height:25px; text-indent:-9999px;} #BlogBox .midblog a.viewAllCol1 { background:url(../../web_images/iconPlus.gif) no-repeat top left; padding-left:17px; display:block; position:absolute; top:8px; right:20px; font-size:11px; color:#269BCF;} #BlogBox .midblog a:hover.viewAllCol1{ color:#0084BE;} #BlogBox .bottomblog{ background:url(../../web_images/bg-profileBottom.png) no-repeat top left; width:323px; height:23px; } #BlogBox h1 { padding-bottom:0px !important; padding-top:0px !important; background:url(../../web_images/icon-microblog.png) no-repeat top left; height:25px; padding-left:35px; } #BlogBox .wrapBlog { margin:15px 0px 10px 0px; overflow:hidden; position:relative; clear:both; } #BlogBox .wrapBlog .pic { float:left; width:30px; height:30px; } #BlogBox .wrapBlog .detail { float:left; padding-left:10px; width:230px; } #BlogBox .wrapBlog p.username { color:#269bcf; font-weight:700; font-size:12px; width:230px; } #BlogBox .wrapBlog p.username a{ color:#269bcf; font-weight:bold; font-size:12px;} #BlogBox .wrapBlog p.username a:hover{ color:#0084BE; font-weight:bold; font-size:12px;} #BlogBox .wrapBlog p.username a span{ margin-left:4px; font-size:10px;} #BlogBox .wrapBlog p.message{ width:150px; font-size:12px; } #BlogBox .wrapBlog span.date { font-size:10px; position:absolute; bottom:0px; right:0px; color:#7ca500; } #BlogBox .wrapBlog p.message2{ width:240px; font-size:12px; color:#555; } #BlogBox .wrapBlog p.message2 span{ margin-left:5px;} #BlogBox .wrapBlog span.date2 { font-size:10px; color:#7ca500; } #BlogBox .linkEdit { float:right; } #BlogBox a.editProfile { background:url(../../web_images/iconPencil.gif) no-repeat top left; padding-left:20px; display:block; float:left; padding-right:10px; } table#detailTable { width:450px; } table#detailTable td.topic { padding:5px 5px 3px 5px; width:90px; text-align:right; font-weight:700; vertical-align:middle; color:#666; font-size:12px; } table#detailTable td.message { padding:5px 5px 3px 5px; width:290px; color:#666; vertical-align:middle; font-size:12px; } table#detailTable td.message a { color:#4C8BD8; text-decoration:underline; } table#detailTable td.message a:hover { color:#5588DD; text-decoration:none; } .iconFav{ margin-top:3px;} /*CSS Scroll*/ #mbMoreList { width:660px; height:905px; position:relative; top:0;left:0; overflow:hidden; } #mask { width:100%; height:500%; overflow:hidden; } .content { width:660px; height:905px; top:20%; margin:0 auto; position:relative; } #profileDetail .goodBar span{ margin-left:13px;} /* Menu Community */ #CommunityMenu { clear:both; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat top left; height:48px; width:660px; overflow:hidden; margin-bottom:20px; } #CommunityMenu a.profile { float:left; height:48px; width:103px; text-indent:-9999px; margin-left:18px;} #CommunityMenu a.photo { float:left; height:48px; width:103px; text-indent:-9999px; } #CommunityMenu a.friend { float:left; height:48px; width:103px; text-indent:-9999px; } #CommunityMenu a.microblog { float:left; height:48px; width:119px; text-indent:-9999px; } #CommunityMenu a.issue { float:left; height:48px; width:97px; text-indent:-9999px; } #CommunityMenu a.mailbox { float:left; height:48px; width:99px; text-indent:-9999px; } #CommunityMenu a.profile:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -18px -48px;} #CommunityMenu a.photo:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -121px -48px;} #CommunityMenu a.friend:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -224px -48px;} #CommunityMenu a.microblog:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -327px -48px;} #CommunityMenu a.issue:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -446px -48px;} #CommunityMenu a.mailbox:hover { background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -543px -48px;} #CommunityMenu a.profile_active { float:left; height:48px; width:103px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -18px -48px; text-indent:-9999px; margin-left:19px;} #CommunityMenu a.photo_active { float:left; height:48px; width:103px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -121px -48px; text-indent:-9999px; } #CommunityMenu a.friend_active { float:left; height:48px; width:103px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -224px -48px; text-indent:-9999px; } #CommunityMenu a.microblog_active { float:left; height:48px; width:119px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -327px -48px; text-indent:-9999px; } #CommunityMenu a.issue_active { float:left; height:48px; width:97px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -446px -48px; text-indent:-9999px; } #CommunityMenu a.mailbox_active { float:left; height:48px; width:99px; background:url(../../web_images/tab-menuCommunity.jpg) no-repeat -543px -48px; text-indent:-9999px; } /* Add 26-03-2010 */ #profileDetail .wrapProfile { float:left; overflow:hidden; width:454px; position:relative; } #profileDetail .wrapBottom{ margin:10px 0 5px 0;} #profileDetail .wrapBottom .proFollow { background:url(../../web_images/btn-follow-profile.jpg) no-repeat; width:170px; height:37px;} #profileDetail .wrapBottom .proFollow a{ background:url(../../web_images/btn-follow-profile.jpg) no-repeat; width:170px; height:37px; text-indent:-9999px; display:block;} #profileDetail .wrapBottom .proFollow a:hover{ background:url(../../web_images/btn-follow-profile-hover.jpg) no-repeat; width:170px; height:37px;} #profileDetail .wrapBottom .proFollowing{ background:url(../../web_images/btn-following-profile.jpg) no-repeat; width:89px; height:37px; float:left; margin-right:8px;} #profileDetail .wrapBottom .proFollowing a{ background:url(../../web_images/btn-following-profile.jpg) no-repeat; width:89px; height:37px; text-indent:-9999px; display:block;} #profileDetail .wrapBottom .proFollowing a:hover{ background:url(../../web_images/btn-following-profile-hover.jpg) no-repeat; width:89px; height:37px;} #profileDetail .wrapBottom .proAddTop{ background:url(../../web_images/btn-addTopFriend-profile.jpg) no-repeat; width:73px; height:37px; float:left;} #profileDetail .wrapBottom .proAddTop a{ background:url(../../web_images/btn-addTopFriend-profile.jpg) no-repeat; width:73px; height:37px; text-indent:-9999px; display:block;} #profileDetail .wrapBottom .proAddTop a:hover{ background:url(../../web_images/btn-addTopFriend-profile-hover.jpg) no-repeat; width:73px; height:37px;} #profileDetail .wrapBottom .proMyTop{ background:url(../../web_images/btn-myTopFriend-profile.jpg) no-repeat; width:73px; height:37px; float:left;} #profileDetail .wrapBottom .proMyTop a{ background:url(../../web_images/btn-myTopFriend-profile.jpg) no-repeat; width:73px; height:37px; text-indent:-9999px; display:block;} #profileDetail .wrapBottom .proMyTop a:hover{ background:url(../../web_images/btn-myTopFriend-profile-hover.jpg) no-repeat; width:73px; height:37px;} #profileDetail .backAddFriend{ background:url(../../web_images/btn-friendAll.jpg) no-repeat; width:107px; height:38px; position:absolute; top:5px; right:0;} #profileDetail .backAddFriend a{ background:url(../../web_images/btn-friendAll.jpg) no-repeat; width:107px; height:38px; text-indent:-9999px; display:block;} #profileDetail .backAddFriend a:hover{ background:url(../../web_images/btn-friendAll-hover.jpg) no-repeat; width:107px; height:38px;} /* Action */ #wrapAction { display: block; width: 660px; padding:25px 0px 0px 0px; overflow: hidden; } #wrapAction .wrapActionTop{ display: block; width:660px; } #wrapAction .wrapActionTop p a{ float:left; color:#999; font-weight:bold; padding:0px 0px 0px 0px; margin:5px 0px 0px 0px; } #wrapAction .wrapActionTop p.following a{ padding-right: 5px; border-right:0px solid #bbbbbb; } #wrapAction .wrapActionTop p.follower a{ padding-left: 5px; border-left:1px solid #bbbbbb; } #wrapAction .wrapActionTop p a:hover,#wrapAction .wrapActionTop p a.active{ float:left; color:#269bcf; } #wrapAction .wrapActionTop .searchBox{ float:right; height:25px; width:450px; margin:0px 0px 0px 0px; background:none; } #wrapAction .wrapActionTop .searchBox a.refreshSearch{ text-indent:-9999px; background:url(../../web_images/iconRefresh.png) no-repeat left top; height:25px; width:69px; display:block; float:left; } #wrapAction .wrapActionTop .searchBox input.searchFollow{ border:1px solid #ebebeb; width:345px; height:19px; display:block; float:left; margin:0px 0px 0px 0px; padding:4px 2px 0px 2px; background:#FFF; font-size:12px; color:#333; } #wrapAction .wrapActionTop .searchBox button.searchButton{ background:url(../../web_images/iconSearch.png) no-repeat top right; height:24px; width:29px; margin:0px 0px 0px 0px; padding:0px 0px 0px 5px; display:block; float:left; cursor:pointer; } #wrapAction .wrapActionTop textarea.followText{ clear:both; float:left; margin:8px 0px 8px 0px; padding:8px; color:#888889; border:1px solid #ebebeb; display:block; width:642px; font-family:Tahoma; font-size:12px; } .tltMicroUpdate{ background:url(../../web_images/tlt-microblogUpdate.png) no-repeat; width:190px; height:26px; margin:-25px 0 15px 0; float:left;} .backMicroUpdate{ float:right; margin:-20px 0 10px;} .backMicroUpdate a{ color:#4C8BD8;font-size:11px;margin:0 3px;text-decoration:underline;} .backMicroUpdate a:hover{ color:#777;font-size:11px;margin:0 3px;text-decoration:underline;} .converMicroTool{ position:absolute; right:0; margin-bottom:10px; padding-right:8px; margin-top:10px; bottom:0;}/*Add 27-04-2010*/ /* Add 3-06-2010 */ #headTitleProfile { width:660px; overflow:hidden;} #headTitleProfile .profileTitle{ background:url(../../web_images/title-myProfile.png) no-repeat; width:234px; height:60px; float:left; margin:0 0 20px 0; border-right:#dbdbdb solid 1px;} #headTitleProfile .profileTitle h1{ text-indent:-9999px;} #headTitleProfile .profileTitleDesp{ color:#666; font-size:12px; float:left; width:413px; margin:10px 0; line-height:16px; padding-left:12px} #headTitlePhoto { width:660px; overflow:hidden;} #headTitlePhoto .photoTitle{ background:url(../../web_images/title-myPhoto.png) no-repeat; width:234px; height:60px; float:left; margin:0 0 20px 0; border-right:#dbdbdb solid 1px;} #headTitlePhoto .photoTitle h1{ text-indent:-9999px;} #headTitlePhoto .photoTitleDesp{ color:#666; font-size:12px; float:left; width:413px; margin:10px 0; line-height:16px; padding-left:12px} #headTitleDiary { width:660px; overflow:hidden;} #headTitleDiary .diaryTitle{ background:url(../../web_images/title-diary.png) no-repeat; width:234px; height:60px; float:left; margin:0 0 20px 0; border-right:#dbdbdb solid 1px;} #headTitleDiary .diaryTitle h1{ text-indent:-9999px;} #headTitleDiary .diaryTitleDesp{ color:#666; font-size:12px; float:left; width:413px; margin:10px 0; line-height:16px; padding-left:12px} #headTitleMailBox { width:660px; overflow:hidden;} #headTitleMailBox .mailBoxTitle{ background:url(../../web_images/title-mailbox.png) no-repeat; width:234px; height:60px; float:left; margin:0 0 20px 0; border-right:#dbdbdb solid 1px;} #headTitleMailBox .mailBoxTitle h1{ text-indent:-9999px;} #headTitleMailBox .mailBoxTitleDesp{ color:#666; font-size:12px; float:left; width:413px; margin:10px 0; line-height:16px; padding-left:12px} #headTitleFriend { width:660px; overflow:hidden;} #headTitleFriend .friendTitle{ background:url(../../web_images/title-myFriend.png) no-repeat; width:234px; height:60px; float:left; margin:0 0 20px 0; border-right:#dbdbdb solid 1px;} #headTitleFriend .friendTitle h1{ text-indent:-9999px;} #headTitleFriend .friendTitleDesp{ color:#666; font-size:12px; float:left; width:413px; margin:10px 0; line-height:16px; padding-left:12px}