@charset "utf-8"; /*** * baobeita blue style **/ /* ---------- index sub header ---------- */ .sub_header .category_panel { width: 670px; padding-right: 150px; margin: 0px auto; overflow: hidden; } .category_panel .title_bar { float: left; width: 670px; height: 45px; background-color: #75b0c6; } .category_panel .title_bar .title{ float: left; height: 45px; line-height: 45px; color: #fff; font-size: 16px; font-weight: bold; padding: 0 20px; } .category_panel .title_bar .search{ float: right; padding: 10px 20px; } .category_panel .title_bar .search input{ float: left; width: 200px; height: 25px; line-height: 25px; font-size: 12px; color: #999; outline: none; border: none; padding: 0 5px; } .category_panel .title_bar .search button{ float: left; width: 65px; height: 25px; background: url(/uploads/image/rbimages/header_search.png); cursor: pointer; border: none; margin-left: 5px; } .category_panel .container { float: left; width: 670px; background-color: #fff; margin-bottom: 15px; padding-bottom: 10px; } .category_panel .container dl { padding: 10px 50px 0px 20px; line-height: 25px; overflow: hidden; } .category_panel .container dl dt { float: left; width: 70px; text-align: right; color: #75b0c6; font-size: 14px; font-weight: bold; } .category_panel .container dl dd { float: right; width: 520px; white-space: nowrap; overflow: hidden; } .category_panel .container dl dd a { float: left; padding: 0px 8px; color: #666; } .category_panel .container dl dd a:hover { color: #333; text-decoration: underline; } /* ---------- index banner ---------- */ .banner { overflow: hidden; position: relative; } .banner .prev, .banner .next { width: 45px; height: 50px; position: absolute; top: 200px; right: 10px; z-index: 100; background: #555 url(/uploads/image/rbimages/slider_nav.gif) -45px 0 no-repeat; filter: alpha(opacity = 60); -moz-opacity: 0.60; opacity: 0.60; display: none; } .banner .prev { left: 10px; background: #555 url(/uploads/image/rbimages/slider_nav.gif) 0 0 no-repeat; } .banner:hover .prev, .banner:hover .next { display: block; } .banner .banner_item_list { height: 410px; overflow: hidden; } .banner .banner_item { height: 410px; } .banner .banner_item .container { width: 1200px; height: 410px; margin: 0px auto; position: relative; } .banner .banner_item .container a.find_dog_link { position: absolute; bottom: 60px; right: 400px; font: italic 14px/26px 'microsoft yahei'; color: #fff; background-color: #88abda; padding: 0 20px 0 30px; border-radius: 20px; } .banner .banner_item .container a.find_dog_link:hover { background-color: #ff977c; } .banner .banner_item .container .article_list{ position: absolute; bottom: 60px; right: 40px; width: 300px; height: 254px; background-color: #535353; } .banner .banner_item .container .article_list li a{ color: #fff; width: 260px; height: 50px; line-height: 50px; padding: 0 20px; border-bottom: 1px solid #7b7b7b; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; display: block; } .banner .banner_item .container .article_list li a:hover{ background-color: #71a9c4; } /* ---------- index poster ---------- */ .poster { border-top: 1px solid #fff; background-color: #eee; overflow: hidden; } .poster .container { width: 1200px; padding: 40px 0; margin: 0px auto; overflow: hidden; } .poster .container a.tile { float: left; width: 200px; height: 220px; background-image: url(/uploads/image/rbimages/index_poster.gif); } .poster .container a.tile:hover { transition:all .8s 0s; -webkit-transition:all .8s 0s; -moz-transition:all .8s 0s; -webkit-transform:scale(1.05); -moz-transform:scale(1.05); -ms-transform:scale(1.05); transform:scale(1.05); } .poster .container a.t1 { background-position: 0px 0px; } .poster .container a.t2 { background-position: -200px 0px; } .poster .container a.t3 { background-position: -400px 0px; } .poster .container a.t4 { background-position: -600px 0px; } .poster .container a.t5 { background-position: -800px 0px; } .poster .container a.t6 { background-position: -1000px 0px; } .poster .container a.t7 { width: 300px; height: 205px; background-position: 0px -220px; } .poster .container a.t8 { width: 300px; height: 205px; background-position: -300px -220px; } .poster .forum { float: left; width: 600px; height: 205px; background-color: #fff; } .poster .forum .forum_link { float: left; width: 150px; height: 90px; margin-top: 40px; display: block; background: url(/uploads/image/rbimages/index_poster.gif) -600px -260px no-repeat; } .poster .forum ul { padding: 22px 0; overflow: hidden; } .poster .forum li { width: 415px; height: 32px; line-height: 32px; } .poster .forum li:hover { background-color: #faefe6; } .poster .forum li .post { float: left; width: 300px; height: 32px; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; display: block; } .poster .forum li .post:before { content: 'ยท'; color: #7bc8b5; font-family: arial; font-weight: bold; padding: 0 8px; } .poster .forum li .username { float: right; width: 70px; text-align: right; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; } .poster .forum li .headimage { } .poster .forum li .headimage img { float: right; width: 25px; height: 25px; margin: 3px 5px; border-radius: 50%; }