www.gusucode.com > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板 > 51:【198-3365】仿寻模板网页模板下载素材销售下载站平台织梦模板/templets/css/home.css

    /*首页*/
a { color: #34495e; }
a:hover, a.active { color: #3498db; }
a.avatar img { width: 100%; height: 100%; border-radius: 50%; }
a.thumb img { width: 100%; height: 100%; }
.lang-btn:hover { color: #fff; }

/*!
 * 主站轮播图
 * 2015-03-20
 */
.ui-slide-box {width:100%; overflow:hidden;}
.ui-slide {width:1180px;position: relative; margin:0 auto; height:350px;}
.ui-slide > ul > li{width:1180px; height:350px; position: absolute;}
.arrows > a{position:absolute; width:1180px; height:350px; background:#fff; top:0px; z-index:99; opacity:0.75;}
.arrows > a.prev { left: -1180px; }
.arrows > a.next { right: -1180px; }
.arrows > a > i { display: none; position: absolute; right: -20px; font-size: 200px; line-height: 350px; }
.arrows > a > i.icon-arrows-right { left: -20px; }

/*首页分类导航*/
.home-tit { margin: 20px 0; height: 40px; line-height: 40px;}
.sub-nav { float: left;} 
.sub-nav a { font-size: 14px; margin-right: 20px;  }
/*滚动新闻*/
.news { float: right; width: 550px; }
.news { font-size: 13px; height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; background: #ffedc7; color: #6b3612; border-radius: 2px;}
.news i { font-size: 20px; color: red; float: left; margin-right: 5px; line-height: 40px; }
.news em { float: left; line-height: 40px; }
.news .news-cont {float: left; width: 470px; height: 19px; color: #6b3612; padding-left: 10px; margin-top: 10px; overflow: hidden; position: relative;}
.news .news-cont .news_li,
.news .news-cont .swap { line-height:19px; display:inline-block; position:absolute; top:0; left:10px;}
.news .news-cont .swap { top:19px; }
.news .news-cont .news_li a { color: #6b3612;}
.news .news-cont .news_li a:hover { text-decoration: underline;}
.home-btn { float: right; margin-left: 20px; }
.home-btn .lang-btn { display: block;}

/*未登录用户底部弹出提醒*/
.login-notify { display: block; position: fixed; left: 0; right: 0; bottom: 0; background-color: rgba(44, 62, 80, 0.75); padding: 20px 0; }
.login-notify i.icon-close-bold { position: absolute; top: 10px; right: 20px; font-size: 14px; color: #b6c3cd; cursor: pointer; }
.login-notify i.icon-close-bold:hover { color: #e8f3fa; }
.login-notify-cont { padding: 10px 0; color: #fff; text-align: center; font-size: 14px; }
.login-notify-cont a {color: #FFF; margin-left: 10px; font-size: 12px; display: inline-block; padding: 6px 16px; background: #3499DA; border-radius: 2px;}


/*评论修改2015-04-01 START*/
/*
* 首页推荐 精彩评论 活跃会员
*/
.recommend { border-top: #eff2f5 solid 1px; background: url('../img/hotcomm.png') repeat-x 0 0;}
.recommend-l { float: left; width: 880px; padding-top: 20px; border-right: #e4e9ee solid 1px; color: #5d6d7e; }
.recommend-r { float: left; width: 300px; margin-top: 20px; color: #5d6d7e; }
.recommend h1 { font-weight: bold; font-size: 24px; line-height: 1.5;}
/*精彩评论*/
.comment { margin-top: 20px; margin-bottom: 20px; }
.comment li { position: relative; border-bottom: #eff2f5 dashed 1px; padding: 10px 0; }
.comment .thumb { position: absolute; top: 10px; left: 0; width: 107px; height: 80px; }
.comment .avatar { position: absolute; top: 10px; left: 123px; width: 25px; height: 25px; }
.comment-cont { margin-left: 160px; }
.comment-cont .user { margin-bottom: 6px; }
.comment-cont .user a { color: #34495e; font-size: 14px; font-weight: bold; }
.comment-cont .user a:hover { color: #3498db; }
.comment-cont .text { color: #555; font-size: 14px; line-height: 1.57142858; min-height: 26px; padding-right: 10px;  word-break: break-word; overflow: hidden; }
.comment-cont .text a { color: #3498db; font-size: 14px; }
.comment-cont .text a:hover { text-decoration: underline; }
.comment-cont .data { margin-top: 5px; }
.comment-cont .data time { color: #bdbdbd; margin-right: 10px; font-size: 12px; }
.comment-cont .data .oper { display: none; }
.comment-cont .data .oper a { margin-right: 10px; font-size: 12px; color: #3498db; }
.comment-cont .data .oper a:hover { text-decoration: underline; }

/*详情页评论*/
.comment-inner .avatar { top: 15px; left: 10px; width: 60px; height: 60px; }
.comment-inner .comment-cont { margin-left: 80px; }

/*活跃设计师*/
.member { margin-top: 20px; }
.member li { padding: 12px 0; margin-left: 15px; min-height: 100px; }
.member li a.avatar-sm { float: left; margin-right: 10px; }
.member-cont { float: left; width: 215px; }
.member-cont .user { font-weight: normal; }
.member-cont .user a { color: #3498db; font-size: 14px; }
.member-cont .text { color: #7f8c8d; font-size: 14px; line-height: 20px; }
.member-cont .date { color: #D9E1E5; font-size: 14px; line-height: 20px; }

/*
* 详情页下评论 更多作品 上传作品
*/
.works-info { display: block; margin-top: 40px; }
.works-info .side { width: 360px; float: right; }
.works-info .main { width: 800px; float: left; }

/*未登陆下不能评论提醒*/
.comment-login p { font-size: 14px; color: #34495e; }

/* 评论输入框 */
.comment-form textarea { width: 100%; height: 100px; padding: 18px; color: #6d6d6d; margin: 0; font-size: 14px; background: #eff4f5; border: 1px solid #eff4f5;}
.comment-form textarea:focus { border: 1px solid #3da2e3; }
/*验证码*/
.comment-code { width: 148px; height: 40px; margin-right: 10px; }
.comment-code img { width: 100%; height: 100%; }
.comment-code-input { width: 100px; height: 40px;border: 1px solid #ccc;padding: 5px 10px;font-size: 14px; }
.comment-code-input:focus { border-color: #3da2e3;}

/*回复评论框*/
.comment-form-inner { margin-top: 10px; }
.comment-form-inner textarea { height: 72px; padding: 13px 18px; }

/* 更多作品展示 */
.works-more { width: 360px; overflow: hidden; display: block; }
.works-more li { float: left; width: 160px; height: 120px; margin-left: 20px; margin-bottom: 20px; }
.works-more li a { display: block; overflow: hidden; background-color: #eff4f5; transition: all 0.2s ease-in-out 0s; width: 160px; height: 120px; }
.works-more li a img { width: 160px; height: 120px; display: block; }
.works-more li a:hover img { opacity: 0.95; }
/* 更多作品按钮 */
.works-more li .more-last {position: relative; line-height: 120px; color: #b8c4ce; text-align: center; font-size: 16px; background-color: #eff4f5; text-decoration: none; }
.works-more li .more-last:hover { color: #FFF; background: #3498db }
.works-more li .more-last i { position: absolute; font-size: 68px; line-height: 120px; text-indent: -15px;}
.works-more li .more-last:hover i { color: #fff;}

/* 我也要上传作品 */
.works-add a { font-size:18px; text-align:left; width:340px; height:120px; display: block; line-height: 120px; color:#b8c4ce; cursor:pointer; text-indent:70px; text-decoration: none; transition: all 0.3s ease-in-out 0s; margin-left: 20px;
	background: #eff4f5 url("../img/upload-add.png") no-repeat 220px -65px;
	background-image: -webkit-image-set(url("../img/upload-add.png") 1x, url("../img/@2x/upload-add@2x.png") 2x);
    background-image: -moz-image-set(url("../img/upload-add.png") 1x,url("../img/@2x/upload-add@2x.png") 2x);
    background-image: -ms-image-set(url("../img/upload-add.png") 1x,url("../img/@2x/upload-add@2x.png") 2x);
    background-image: -o-image-set(url("../img/upload-add.png") 1x,url("../img/@2x/upload-add@2x.png") 2x);
    background-position: 220px -65px;
}
.works-add a:hover { color: #FFF; background-position: 220px 35px; background-color: #3498db; }


/*uicn.css样式*/
.recommend *, .works-info *
{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
/*用户头像*/
.avatar-xs { display: inline-block; width: 32px; height: 32px; }
.avatar-sm { display: inline-block; width: 60px; height: 60px; }
.avatar-md { display: inline-block; width: 100px; height: 100px; }
.avatar-lg { display: inline-block; width: 148px; height: 148px; }
.avatar img,
.avatar-xs img, 
.avatar-sm img, 
.avatar-md img,
.avatar-lg img { width: 100%; height: 100%; border-radius: 50%; }
input,
textarea { border: 1px solid #b8c4ce; border-radius: 2px; }

input:focus,
textarea:focus {
	outline: none;
	border-color: #3498db;
    box-shadow: 0 0 4px rgba(41, 128, 185, 0.4);
    -webkit-transition: border-color ease-in-out .2s, -webkit-box-shadow ease-in-out .2s;
         -o-transition: border-color ease-in-out .2s, box-shadow ease-in-out .2s;
            transition: border-color ease-in-out .2s, box-shadow ease-in-out .2s;
}
/**
 * 按钮 Buttons 
 **/
.btn {
	display: inline-block;
	padding: 10px 20px;
	height: 40px;
	line-height: 1.42857143;
	letter-spacing: 1px;
	font-size: 14px;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;   /*禁止选择文字*/
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	border: none;
	border-radius: 2px;
}
.btn:hover { transition:all 0.2s ease-in-out; color: #fff; }
.btn:focus, .btn:active:focus { outline: none; }

/*禁用按钮*/
.btn.disabled {
  pointer-events: none;
  cursor: not-allowed;
  filter: alpha(opacity=60);
  -webkit-box-shadow: none;
          box-shadow: none;
  opacity: .60;
}

/*蓝色按钮*/
.btn-primary { color: #fff; background-color: #3498db; }
.btn-primary:hover{ color: #fff; background-color: #3da2e3; }
.btn-primary:active{ background-color: #298fd3; }

/*灰色按钮*/
.btn-gray { color: #fff; background-color: #b8c4ce; }

/*无背景按钮*/
.btn-nature { color: #2c3e50; background-color: transparent; }
.btn-nature:hover { color: #fff; color: #3498db; }

/*橙色按钮-小米主题站*/
.btn-orange { color: #fff; background-color: #ff7920; }
.btn-orange:hover { color: #fff; background-color: #ff8d41; }
.btn-orange:active { background-color: #ee6f1a; }

/*定义按钮高度*/
.btn-mini { height: 30px; padding: 5px 20px; }
.btn-big { height: 50px; line-height: 1.5; padding: 13px 30px; font-size: 16px; }

/*定义按钮宽度*/
.btn-fixed-n { width: 80px; padding-left: 0; padding-right: 0; }
.btn-fixed-m { width: 120px; padding-left: 0; padding-right: 0; }
.btn-fixed-w { width: 160px; padding-left: 0; padding-right: 0; }
.btn-block { display: block; width: 100%; padding-left: 0; padding-right: 0; }
/*评论修改2015-04-01 END*/