/* Theme Name:Grace Theme URI:http://www.lmlblog.com/blog/4/ */ .btn { padding: 10px 25px; outline: none !important; box-shadow: none !important; background: transparent; border-radius: 2px; font-size: 14px; } .btn-default { border-color: #eaeaea; } .btn-default:hover { border-color: #282828; background-color: #282828; } .btn-primary { background-color: #00a7eb; border-color: #00a7eb; } .btn-default:hover, .btn-default:focus, .btn-default:active, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.focus, .btn-primary:active, .btn-primary:focus, .btn-primary:hover, .open > .dropdown-toggle.btn-primary, .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover { background-color: #282828 !important; border: 1px solid #282828 !important; outline: none !important; box-shadow: none !important; color: #FFF !important; } .thumbnail { border: 0; padding: 0; border-radius: 0; margin: 0; } .tips-error { font-size: 14px; margin-top: 10px; color: #f33838; display: none; } .suxing-radio { padding-left: 25px; position: relative; display: block; margin-top: 10px; margin-bottom: 10px; } .suxing-radio input[type="radio"] { opacity: 0; z-index: 1; position: absolute; margin-top: 4px \9; margin-left: -20px; } .suxing-radio label { display: block; vertical-align: middle; position: relative; cursor: pointer; font-size: 16px; } .suxing-radio input[type="radio"]:checked + label::after { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } .suxing-radio label em { display: block; font-style: normal; font-size: 12px; color: #666; margin-top: 3px; } .suxing-radio label::before { content: ""; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; top: 3px; margin-left: -25px; border: 1px solid #cccccc; border-radius: 50%; background-color: #fff; -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out; } .suxing-radio label::after { display: inline-block; position: absolute; content: " "; width: 11px; height: 11px; left: 3px; top: 6px; margin-left: -25px; border-radius: 50%; background-color: #555555; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -o-transform: scale(0, 0); transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); } .dropdown-menu { position: absolute; margin-top: -24px; background: #FFF; z-index: -100; border-radius: 5px; border: 1px solid #efefef; -webkit-box-shadow: 0 0px 15px 0px rgba(146, 146, 146, .2); -moz-box-shadow: 0 0px 15px 0px rgba(146, 146, 146, .2); box-shadow: 0 3px 12px 0px rgba(146, 146, 146, .3); z-index: -1; display: none; opacity: 0; left: auto; padding: 0; } .open .dropdown-menu { margin-top: -1px; z-index: 10; opacity: 1; display: block; } .dropdown-menu::before { content: ""; border-style: solid; border-width: 0 9px 9px 9px; border-color: transparent transparent #ffffff transparent; height: 0px; position: absolute; right: 20px; top: -9px; width: 0px; -webkit-transform: rotate(360deg); z-index: 1; } .dropdown-menu::after { content: ""; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #efefef transparent; height: 0px; position: absolute; right: 19px; top: -11px; width: 0px; -webkit-transform: rotate(360deg); margin-left: -10px; } .dropdown-menu-left::before { content: ""; border-style: solid; border-width: 0 9px 9px 9px; border-color: transparent transparent #ffffff transparent; height: 0px; position: absolute; left: 20px; right: auto; top: -9px; width: 0px; -webkit-transform: rotate(360deg); z-index: 1; } .dropdown-menu-left::after { content: ""; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #efefef transparent; height: 0px; position: absolute; left: 29px; right: auto; top: -11px; width: 0px; -webkit-transform: rotate(360deg); } @-webkit-keyframes fade-zoom-in { 0% { opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1) } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1) } } @-o-keyframes fade-zoom-in { 0% { opacity: 0; -o-transform: scale(1.1); transform: scale(1.1) } 100% { opacity: 1; -o-transform: scale(1); transform: scale(1) } } @keyframes fade-zoom-in { 0% { opacity: 0; -webkit-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1) } 100% { opacity: 1; -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1) } } @keyframes waver { 0 { transform: scale(1, 1) } 50% { transform: scale(1.5, 1.5) } 100% { transform: scale(1, 1) } } @-moz-keyframes waver { 0 { -moz-transform: scale(1, 1) } 50% { -moz-transform: scale(1.5, 1.5) } 100% { -moz-transform: scale(1, 1) } } @-webkit-keyframes waver { 0 { -webkit-transform: scale(1, 1) } 50% { -webkit-transform: scale(1.5, 1.5) } 100% { -webkit-transform: scale(1, 1) } } @-o-keyframes waver { 0 { -o-transform: scale(1, 1) } 50% { -o-transform: scale(1.5, 1.5) } 100% { -o-transform: scale(1, 1) } } @-webkit-keyframes rotate { from { -webkit-transform: rotate(0) } to { -webkit-transform: rotate(360deg) } } @-moz-keyframes rotate { from { -moz-transform: rotate(0) } to { -moz-transform: rotate(360deg) } } @-ms-keyframes rotate { from { -ms-transform: rotate(0) } to { -ms-transform: rotate(360deg) } } @-o-keyframes rotate { from { -o-transform: rotate(0) } to { -o-transform: rotate(360deg) } } @keyframes rotate { from { transform: rotate(0) } to { transform: rotate(360deg) } } #header { position: relative; width: 100%; background: #FFF; box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.08); } #header .container { position: relative } #header.navbar-fixed-top { position: fixed; right: 0; left: 0; z-index: 10; } #header .logo { position: relative; float: left; margin-right: 20px; } #header .logo a { transition: none; background-size: contain; background-position: left center; background-repeat: no-repeat; text-indent: -9999px; display: block; position: relative; width: 220px; height: 80px; } #header .logo img { max-height: 60px; height: auto } #header .logo i { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 30px; margin-left: 30px; color: #EF8B8B } #header .primary-menu { position: relative; z-index: 999; font-weight: 500; float: left } #header .primary-menu ul { margin: 0; padding: 0; list-style: none; display: inline-block; float: right } #header .primary-menu ul>li { margin: 0 10px; display: inline-block; position: relative; } #header .primary-menu ul>li.menu-item-has-children { margin: 0 15px 0 10px; } #header .primary-menu ul>li.menu-item-has-children>a::after { content: '\e93a'; font-family: fontello; font-weight: 400; display: inline-block; margin-left: 5px; transition: transform ease .3s; position: absolute; line-height: 1; top: 32px; } #header .primary-menu ul>li.menu-item-has-children>ul>li.menu-item-has-children { margin: 0; } #header .primary-menu ul>li.menu-item-has-children>ul>li.menu-item-has-children a::after { content: ''; } #header .primary-menu ul>li.menu-item-has-children>ul>li.menu-item-has-children::after { content: '\e93c'; font-family: fontello; font-weight: 400; display: inline-block; transition: transform ease .3s; position: absolute; right: 15px; bottom: 10px; font-size: 16px; } #header .primary-menu ul>li.menu-item-has-children>ul>li.menu-item-has-children:hover::after { transform: rotate(180deg); -webkit-transform: rotate(180deg) } #header .primary-menu ul>li.menu-item-has-children:hover>a::after { transform: rotate(180deg); -webkit-transform: rotate(180deg) } #header .primary-menu ul>li.menu-item-has-children>ul { position: absolute; background: #FFF; color: #555; left: -20px; top: 40px; text-align: left; width: 200px; opacity: 0; visibility: hidden; transition: all .2s ease; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .3); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .3); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .3); padding: 10px 0; } #header .primary-menu ul>li.menu-item-has-children>ul>li>ul { left: 100%; top: -10px } #header .primary-menu ul>li>ul>li { display: block; padding: 5px 30px 5px 25px; margin: 0; } #header .primary-menu ul>li>ul li a { font-size: 15px; font-weight: 400; color: #404040; line-height: 28px; height: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #header .primary-menu ul>li:hover>ul { opacity: 1; visibility: visible; top: 80px } #header .primary-menu ul>li>a { color: #404040; font-size: 15px; display: block; position: relative; line-height: 80px; height: 80px; } #header .primary-menu ul>li .sub-menu li a:hover, #header .primary-menu ul>li .sub-menu li.current-menu-item>a, #header .primary-menu ul>li.current-menu-ancestor>a, #header .primary-menu ul>li.current-menu-item>a, #header .primary-menu ul>li:hover>a, #header .primary-menu ul>li>a:hover { color: #19B5FE } #header .right-nav { line-height: 80px; } #header .js-toggle-message { display: inline-block; position: relative; margin-right: 10px; } #header .js-toggle-message .dropdown-menu { top: 95px; right: -10px; width: 320px; } #header .js-toggle-message .dropdown-menu .more-messages { text-align: center } #header .js-toggle-message .dropdown-menu .more-messages a { padding: 10px; background: #f5f5f5; display: block; color: #adadad; font-size: 12px; line-height: normal; } #header .js-toggle-message .dropdown-menu .more-messages a:hover { color: #282828 } #header .js-toggle-message .dropdown-menu ul { margin: 18px 24px 13px 80px; padding-left: 15px; border-left: 1px solid #F1F1F1; } #header .js-toggle-message .dropdown-menu li { position: relative; padding: 10px 0; line-height: normal; } #header .js-toggle-message .dropdown-menu li:before { content: ''; width: 7px; height: 7px; left: -19px; top: 15px; border-radius: 10px; background: #c5c5c5; position: absolute; } #header .js-toggle-message .dropdown-menu li a { color: #555 } #header .js-toggle-message .dropdown-menu li .time { padding-right: 10px; margin-right: 10px; position: absolute; font-size: 12px; left: -80px; margin-top: 2px; } #header .js-toggle-message .dropdown-menu li a:hover { color: #000 } #header .js-toggle-message .dropdown-menu li.first { color: #ff4a6a } #header .js-toggle-message .dropdown-menu li.first a { font-weight: 700; color: #ff4a6a } #header .js-toggle-message .dropdown-menu li.first .time { font-weight: bold; } #header .js-toggle-message .dropdown-menu li.first .time:after { background: #ff4a6a } #header .js-toggle-message button { display: inline-block; position: relative; background: none; font-size: 16px; } #header .js-toggle-message button i { margin-right: 5px; } #header .js-toggle-message button::after { content: ""; position: absolute; width: 1px; height: 12px; background: #E5E5E5; right: -10px; top: 6px; } #header .js-toggle-message button span { content: ""; background-color: #f73f60; right: 5px; width: 6px; height: 6px; top: 5px; position: absolute; border-radius: 100%; display: inline-block } #header .js-toggle-search { position: relative; font-size: 15px; cursor: pointer; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; color: #333; cursor: pointer; text-align: center; background: transparent; display: inline-block; padding: 0 10px; } #header .toggle-tougao { background: transparent; font-size: 15px; border: 1px solid #337ab7; border-radius: 40px; padding: 5px 16px; line-height: 1; color: #337ab7; margin-right: 10px; } #header .toggle-tougao:hover { background: #282828; border-color: #282828; color: #FFF; } #header .toggle-login { font-size: 15px; } #header span.line { height: 12px; display: inline-block; margin: 0 5px; border-right: 1px solid #E5E5E5; } #header .menu-top, .menu-bottom { position: absolute; left: 14px; background: #333; width: 20px; height: 2px; transition: .3s; } #header .menu-top { top: 19px } #header .menu-bottom { bottom: 19px } #top-content { background: #FFF; padding: 30px 0 } #page-content { padding: 105px 0 50px 0; } #page-content.page-content-110 { padding: 100px 0 20px 0; } .main-content { position: relative; width: 100% } .cat { position: relative } .cat .thumbnail-cat { overflow: hidden; } .cat .thumbnail-cat .image { position: relative; } .cat .thumbnail-cat .image .index-cat-box { height: 200px; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center center; width: 100%; } .cat .thumbnail-cat .image .iscat { position: absolute; height: 100%; width: 100%; top: 0; left: 0; z-index: 3; display: block; } .cat .thumbnail-cat .image .iscat .promo-overlay { position: absolute; padding: 10px 20px; font-size: 14px; top: 50%; z-index: 9; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background-color: #FFF; color: #282828; } .cat .thumbnail-cat .image .iscat .modulo_line { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0px; } .cat .thumbnail-cat .image .iscat .modulo_line:before, .cat .thumbnail-cat .image .iscat .modulo_line:after { position: absolute; top: 20px; right: 20px; bottom: 20px; left: 20px; content: ''; -webkit-transition: opacity 0.35s, transform 0.35s; transition: opacity 0.35s, transform 0.35s; } .cat .thumbnail-cat .image .iscat .modulo_line:before { border-top: 1px solid transparent; border-bottom: 1px solid transparent; border-color: rgba(255, 255, 255, 0.5); } .cat .thumbnail-cat .image .iscat .modulo_line:after { border-right: 1px solid transparent; border-left: 1px solid transparent; border-color: rgba(255, 255, 255, 0.5); opacity: 1; -webkit-transform: scale(1); transform: scale(1) } .cat .thumbnail-cat .image .iscat:hover .modulo_line:before { -webkit-transform: scale(0, 1); transform: scale(0, 1); opacity: 0; } .cat .thumbnail-cat .image .iscat:hover .modulo_line:after { -webkit-transform: scale(1, 0); transform: scale(1, 0); opacity: 0; } .cat .thumbnail-cat .image .istop { display: inline-block; width: 100%; height: 100% } .cat .thumbnail-cat .image .istop .title { position: absolute; top: 115px; padding: 20px 20px 0; left: 0; right: 0; } .cat .thumbnail-cat .image .istop .title h3 { color: #fff; font-size: 16px; max-height: 48px; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; } .cat .thumbnail-cat .image .istop .cat { position: absolute; top: 20px; left: 20px; padding: 7px 10px 6px 10px; background-color: rgba(0, 0, 0, .7); font-size: 12px; display: inline-block; text-shadow: none; line-height: 1; color: #FFF; border-radius: 2px; } .cat .thumbnail-cat .image .istopic .topic-title { display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; transition: all .5s; width: 100%; height: 100%; z-index: 2; padding: 0 20px; } .cat .thumbnail-cat .image .istopic .topic-title h3 { font-size: 16px; color: #FFF; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; margin: 10px 0; text-align: center; } .cat .thumbnail-cat .image .istopic .topic-title .btn-read-topic { background: transparent; font-size: 12px; border: 1px solid #FFF; border-radius: 40px; padding: 8px 16px; line-height: 1; color: #FFF; display: inline-block; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .cat .thumbnail-cat .image .istopic:hover .topic-title .btn-read-topic { background-color: #FFF; color: #282828; } .main-content:after, .main-content:before { display: table; content: " " } .blog-emtry { padding: 200px 0 300px 0; text-align: center; color: #DDD; } .blog-emtry i { font-size: 5em; margin-bottom: 20px; display: block; } .blog-emtry p { font-size: 2em; color: #DDD; } .content { position: relative; overflow: hidden; display: block; margin-bottom: 20px; background: #FFF; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } .content:hover { -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 8px 25px 0 rgba(146, 146, 146, 0.21); } .content-box { overflow: hidden; padding: 23px 20px; } .posts-default .content-box { padding: 23px 20px; } .overlay { width: 100%; height: 100%; background: #000; -webkit-transition: opacity .4s ease-in-out; transition: opacity .4s ease-in-out; position: absolute; opacity: .5; } .posts-default-img { position: relative; overflow: hidden; max-height: 300px; height: auto; width: 100%; } .posts-default-img a { position: relative; display: block } .posts-default-img img { width: 100% } .posts-default-img .overlay { opacity: 0 } .posts-default-img a:hover .overlay { opacity: .2 } .posts-default-box { padding: 22px 0 0; } .posts-default-title { position: relative; margin: 0 0 10px; } .posts-default-title h2 { position: relative; font-size: 20px; font-weight: 600; } .posts-default-content { position: relative; line-height: normal; } .posts-default-content .posts-text { font-size: 14px; line-height: 1.6; margin-bottom: 20px; color: #566573; } .posts-default-info { position: relative; } .posts-gallery-info { position: absolute; bottom: 28px; } .posts-default-info ul li { font-size: 12px; letter-spacing: .2px; padding: 0; margin: 0 5px 0 0; color: #748594; position: relative; line-height: 1.5; display: inline-block; } .posts-default-info ul li a { color: #748594 } .posts-default-info ul li.post-author { padding-left: 30px } .posts-default-info ul li .avatar { position: absolute; top: -2px; left: 0; width: 25px; } .posts-default-info ul li .avatar img { border: 1px solid #e5e5e5; border-radius: 50%; padding: 1px; width: 25px; height: 25px; } .posts-gallery-img { position: relative; float: left; width: 231.98px; height: 173.98px; overflow: hidden; } .posts-gallery-img img { width: 100%; height: auto; } .posts-gallery-content { margin-left: 250px; margin-top: -3px; } .posts-gallery-content h2 { position: relative; margin: 0 0 10px 0; font-size: 20px; font-weight: 600; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; } .posts-gallery-content .posts-gallery-text { font-size: 14px; margin-bottom: 0; color: #566573; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .post-style-tips { position: absolute; bottom: 32px; right: 28px } .post-style-tips a { padding: 6px 10px; line-height: 1; color: #FFF; background: #378DF7; display: inline-block; font-size: 12px } .post-style-tips span a:hover { background: #273746 } .post-images-item { margin-bottom: 20px } .post-images-item ul { overflow: hidden; margin-left: -5px; } .post-images-item ul li { float: left; width: 33.3333% } .post-images-item ul li .overlay { opacity: 0 } .post-images-item ul li a:hover .overlay { opacity: .3 } .post-images-item ul li .image-item { margin-left: 5px; max-height: 174px; position: relative; overflow: hidden; } .post-images-item ul li a img { width: 100%; height: auto; min-height: 174px } .state-new { padding: 3.2px 8px; margin-right: 10px; background-color: #F75252; color: #FFF; line-height: 12px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: 12px; vertical-align: middle; font-weight: 400; top: -3px; position: relative } .post-entry-categories { margin-bottom: 15px; } .post-entry-categories a { padding: 3px 5px; background-color: #19B5FE; color: #fff; font-size: 12px; line-height: 1; font-weight: 400; margin: 3px 5px 3px 0; display: inline-block; } .post-entry-categories a:nth-child(5n) { background-color: #898a94; } .post-entry-categories a:nth-child(5n+1) { background-color: #e86664; } .post-entry-categories a:nth-child(5n+2) { background-color: #e49184; } .post-entry-categories a:nth-child(5n+3) { background-color: #5fc7ab; } .post-entry-categories a:nth-child(5n+4) { background-color: #74bfe2; } .post-entry-categories a:hover { background-color: #1B1B1B; color: #FFF } .pic-posts { width: 25%; float: left; margin-bottom: 40px; border-radius: 5px; display: inline-block; height: 288px; overflow: hidden; position: relative; text-align: center } .pic-posts-box { margin-left: 35px; position: relative } .pic-posts-src { height: 288px; position: relative; border-radius: 5px } .pic-posts-box .pic-posts-src a { width: 100%; height: 100%; position: relative; display: block } .pic-posts-box .pic-posts-src .gradient { border-radius: 5px } .pic-posts-box .pic-posts-src:hover .gradient { opacity: .6 } .pic-posts-box .title { position: absolute; bottom: 10%; width: 100%; text-shadow: 1px 1px 2px #000 } .pic-posts-box .title h2 { padding: 10px; font-size: 17px; color: #FFF; text-shadow: 1px 1px 2px #000 } .pic-posts-box .title .post-views span { border: 1px rgba(0, 0, 0, .15) solid; padding: 6px 8px; cursor: pointer; background-color: rgba(25, 181, 254, .8); border-color: transparent; color: #fff; border-radius: 999em; vertical-align: bottom; height: 32px; line-height: 32px; font-size: 12px } .post-nav { margin-bottom: 15px } .post-nav span { cursor: pointer; position: relative; background: #FFF; display: inline-block; border-radius: 30px; padding: 9px 22px; margin-right: 15px; margin-bottom: 10px; font-weight: 600; border: 1px solid #eae9e9; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); box-shadow: 0 0 10px 0 rgba(146, 146, 146, .1); } .post-nav span.current, .post-nav span:hover { background: #282828; color: #FFF; border: 1px solid #282828 } .wait-tips { text-align: center; padding: 20px 0 } #ajax-load-posts { text-align: center; padding: 20px 0; } #ajax-load-posts a, .btn-contribute, #ajax-load-posts button { cursor: pointer; width: 150px; background: #00a7eb; border-radius: 2px; font-size: 16px; color: #fff; height: 46px; line-height: 46px; display: inline-block; margin: 0 8px; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; line-height: 0; } #ajax-load-posts a:hover, .btn-contribute:hover, #ajax-load-posts button:hover { background: #282828 } #footer { width: 100%; position: relative } .one-s-footer { background-color: #282828 } .one-s-footer { padding: 25px 0; color: #ababab; } .one-s-footer .footer-copyright { float: left; font-size: 14px; } .one-s-footer .footer-copyright p { color: #ababab; padding: 2px 0; } .one-s-footer .footer-copyright a { color: #ddd } .one-s-footer .footer-copyright a:hover { color: #FFF; color: #ddd } .one-s-footer .footer-social { float: right; margin-top: 0; position: relative } .one-s-footer .footer-social a { font-size: 20px; margin-left: 10px } .one-s-footer .footer-social a:first-child { margin-left: 0 } .two-s-footer .footer-box { background-color: #282828; padding: 35px 0 25px 0; } .item-footer { float: left; width: 33.3333%; display: inline-block } .item-b-f { padding-right: 40px } .dec-s { margin-top: 13px; padding-left: 5px } .dec-s p { font-size: 12px; color: #adadad } .item-footer h3 { font-size: 20px; color: #FFF; margin-bottom: 30px; margin-top: 15px } .links-b a { font-size: 14px; color: #F1F1F1; margin-right: 5px; display: inline-block } .two-s-footer .footer-box .nav-footer { margin-bottom: 15px; } .two-s-footer .footer-box .nav-footer a { color: #e0e0e0; margin-right: 10px; } .two-s-footer .footer-box .nav-footer a:hover { color: #FFF } .two-s-footer .footer-box .nav-footer span { margin: 0 10px } .two-s-footer .links-footer { font-size: 10px; color: #353e4a; padding: 15px 0 0; border-top: 1px solid rgba(255, 255, 255, .05); margin-top: 15px; } .two-s-footer .links-footer a, .two-s-footer .links-footer span { color: #696969; line-height: 1.2; margin: 0 4px 0 0; font-size: 12px } .two-s-footer .copyright-footer p { color: #828282; font-size: 12px; } .two-s-footer .copyright-footer a { color: #929292 } .social-footer { float: right } .social-footer a { position: relative; float: left; width: 40px; height: 40px; line-height: 40px; background-color: #343a40; text-align: center; border-radius: 20px; margin: 0 5px; color: #FFF; font-size: 16px } .social-footer a i { color: #c5c5c5 } .social-footer a:hover i { color: #FFF } .social-footer a.weiboii:hover { background-color: #f74864 } .social-footer a.ttweiboii:hover { background-color: #00A2FF } .social-footer a.mailii:hover { background-color: #e64c4c } .social-footer a.qqii:hover { background-color: #00C5FF } .social-footer a.wxii:hover { background-color: #35a999 } .dropdown-menu-part .footer-link { margin: 0 0 0 10px; display: inline-block; color: #d7d7d7 } .breadcrumbs { background: #fff; margin-bottom: 15px; padding: 15px 25px; border-top: 2px solid #748594; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .breadcrumbs span { color: #748594; font-size: 12px } .breadcrumbs span.sep { margin: 0 5px } .breadcrumbs span.current { color: #a5aeb5 } .post-title .breadcrumbs { padding: 0; border-top: 0; margin-bottom: 25px; box-shadow: none; } .post-timthumb { background-size: cover; background-position: center top; background-repeat: no-repeat; height: 380px; position: relative; } .post-timthumb h1 { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px; color: #FFF; font-size: 26px; letter-spacing: 2px; font-weight: 600; text-shadow: 0px 1px 4px #000; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease; background-image: -webkit-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: -moz-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: linear-gradient(180deg, rgba(0, 0, 0, .01) 0, rgba(0, 0, 0, .65) 100%); } .post { padding: 50px 38px; min-height: 500px; background: #fff; margin-bottom: 20px; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .post-content img { max-width: 100%; margin: 0 auto; height: auto; display: block; margin-bottom: 20px } .post-p-indent .post-content p { text-indent: 2em } .post-content p.post-abstract { padding: 20px; font-size: 14px; line-height: 24px; text-indent: 0; word-break: break-all; word-wrap: break-word; color: #666; border: 1px solid #efefef; background-color: #fbfbfb; border-radius: 2px } .post-content p.post-abstract .abstract-tit { color: #19b5fe } .post-content .wp-caption { max-width: 100%; display: block; margin-bottom: 20px; background-color: #F7F8F9; border: 1px solid #ECECEC; padding: 5px; } .post-content .wp-caption img { margin-bottom: 5px } .post-content .wp-caption p { text-align: center; margin-bottom: 0; font-size: 14px } .post-content { margin: 0 0 20px 0; line-height: 1.8; font-size: 16px; color: #3d464d } .post-title { position: relative; margin: 0 0 35px; padding: 0 0 35px; border-bottom: 1px solid #e7e7e7; } .post-title:after { content: ""; background-color: #282828; left: 0; width: 60px; height: 2px; bottom: -2px; position: absolute; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .post-title:hover:after { width: 75px; } .post-title .title { position: relative; font-size: 26px; display: block; letter-spacing: 2px; font-weight: 600; margin: 30px 0 35px; } .page .post-title .title { margin: 0 } .post-title .post_icon { color: #748594; font-size: 12px; display: block; } .post-title .post_icon span { margin-right: 10px; display: inline-block; position: relative; } .post-title .post_icon .postauthor img { width: 30px; height: 30px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; border: 1px solid rgba(216, 216, 216, 0.81); display: inline-block; margin-right: 10px; } .post-title .post_icon a:link, .post-title .post_icon a:visited { color: #748594 } .post-title .post_icon .postpublicity, .post-title .post_icon .postpublicity a { color: #19b5fe; } .post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5 { padding: 10px 0; margin-bottom: 18px; color: #555; font-weight: 700 } .post-content h1 { font-size: 24px; } .post-content h2 { font-size: 21px; } .post-content h3 { font-size: 18px; } .post-content h4 { font-size: 15px } .post-content h5 { font-size: 14px } .post-content p { margin-bottom: 25px; line-height: 1.8; font-size: 16px } .post-content blockquote { margin: 30px 30px; color: #999 } .post-content blockquote p { margin: 0; padding: 0; margin-bottom: 10px; font-size: 14px } .post-content p.text-indent { text-indent: 2em } .post-content p a:visited, .post-content p a { text-decoration: none; border-bottom: 1px solid #3d464d; padding-bottom: 2px; } .post-content p a:hover { border-bottom-color: #00A7EB } .post-content ol, .post-content ul { margin: 0 0 18px 10px; padding: 0 0 0 20px; } .post-content ul, .post-content ul li { list-style: disc; } .post-content ol, .post-content ol li { list-style: decimal; } .post-content li { margin-bottom: 8px; font-size: 14px; } .post-content .table { width: 100%; border-top: 1px solid #d8d8d8; border-left: 1px solid #d8d8d8; margin-bottom: 20px } .post-content .table th { text-align: center; background-color: #f6f5f2; font-weight: 400 } .post-content .table td, .post-content .table th { text-align: center; padding: 10px 15px; font-size: 14px; border-right: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8 } .post-content hr { background-color: #d1d1d1; border: 0; height: 1px; margin: 0 0 1.75em } .post-declare { margin-bottom: 20px; } .post-declare span { font-size: 20px; color: #000; position: absolute; left: 50%; top: -12px; background: #FFF; margin-left: -14px; display: inline-block } .post-declare p { font-size: 15px; line-height: 1.5; color: #999; margin-bottom: 0 } .post-declare a { color: #3d464d } .post-declare2 { border-top: 1px solid #efefef; border-bottom: 1px solid #efefef; padding: 20px 0; position: relative; margin-bottom: 20px } .post-declare2 span { font-size: 20px; color: #000; position: absolute; left: 50%; top: -12px; background: #FFF; margin-left: -14px; display: inline-block } .post-declare2 p { font-size: 15px; line-height: 1.5; color: #999; margin-bottom: 0 } .post-declare2 a { color: #3d464d } .post-options { padding: 30px 0 35px; position: relative; } .post-options .btn-likes { width: 130px; height: 40px; line-height: 40px; border: 1px solid #F74840; box-shadow: none; background: #fff; display: inline-block; text-align: center; margin: 0 2px; color: #F74840; font-size: 14px; text-decoration: none; border-radius: 0; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px } .post-options .btn-likes.like .icon-heart-filled { display: none; margin-top: -3px } .post-options .btn-likes.like.current { background-color: #F74840; color: #fff; border-color: #F74840; } .post-options .btn-likes.like i { vertical-align: middle; display: inline-block; margin-top: -2px; } .post-options .btn-likes.like.current .icon-heart-filled { display: inline-block; -webkit-animation: waver .3s linear 1; -moz-animation: waver .3s linear 1; -o-animation: waver .3s linear 1; animation: waver .3s linear 1 } .post-options .btn-likes.like.current .icon-heart { display: none } .post-options .btn-publicity { color: #19b5fe; border-color: #19b5fe; } .post-options .btn-publicity:hover { color: #FFF; background-color: #19b5fe } .panel-reward { position: relative; padding: 30px 0 0; display: none } .panel-reward ul li { display: inline-block; text-align: center; margin: 0 10px; padding: 5px; border: 1px solid #87ddff; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px } .panel-reward ul .weixinpay { border-color: #8ae0ac } .panel-reward ul li img { width: 120px; height: auto } .panel-reward ul li b { display: block; font-weight: 400; margin-top: 3px } .su-dropdown { position: relative; float: right; } .su-dropdown .pay-author, .su-dropdown .J_showAllShareBtn { width: 40px; height: 40px; line-height: 40px; border: 1px solid rgba(153, 153, 153, 0.31); box-shadow: none; background: #fff; display: inline-block; text-align: center; margin: 0 2px; color: #555; font-size: 14px; text-decoration: none; -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .su-dropdown .pay-author span { display: none; } .su-dropdown .pay-author:hover, .su-dropdown .J_showAllShareBtn:hover { border-color: #555; color: #232323 } .su-dropbox { position: absolute; left: 0; top: 30px; width: 160px; background: #fff; padding: 15px; border: 1px solid #efefef; z-index: -1; opacity: 0; display: none\9; -webkit-transition: 0.3s ease-out; -moz-transition: 0.3s ease-out; -o-transition: 0.3s ease-out; transition: 0.3s ease-out; -webkit-backface-visibility: hidden; border-radius: 4px; box-shadow: 0 5px 20px rgba(0, 34, 77, .1); } .su-dropdown.open .su-dropbox { margin-top: -1px; opacity: 1; z-index: 10; display: block\9; top: 60px; } .su-dropdown .su-dropbox::before { content: ""; border-style: solid; border-width: 0 9px 9px 9px; border-color: transparent transparent #ffffff transparent; height: 0px; position: absolute; left: 50%; top: -9px; width: 0px; -webkit-transform: rotate(360deg); z-index: 1; } .su-dropdown .su-dropbox::before { margin-left: -9px } .su-dropdown .su-dropbox::after { content: ""; border-style: solid; border-width: 0 10px 10px 10px; border-color: transparent transparent #efefef transparent; height: 0px; position: absolute; left: 50%; top: -10px; width: 0px; -webkit-transform: rotate(360deg); margin-left: -10px; } .paydropdown .su-dropbox { left: -57px; text-align: center; } .paydropdown .su-dropbox ul li img { width: 100%; } .paydropdown .su-dropbox ul li { float: left; width: 100%; padding: 5px; } .paydropdown .pay-allqr { width: 320px; left: -138px; } .paydropdown .pay-allqr ul li { float: left; width: 50%; padding: 5px; } .paydropdown .pay-allqr ul li img { width: 100%; } .socialdropdown .su-dropbox { width: 136px; left: -46px; } .socialdropdown .su-dropbox a { display: block; padding: 9px 8px; font-size: 15px; color: #777; cursor: pointer; } .socialdropdown .su-dropbox a.icon-weibo { color: #ff6363; border-color: #ff6363; } .socialdropdown .su-dropbox a.icon-wechat { color: #1cbd8f; border-color: #1cbd8f; } .socialdropdown .su-dropbox a.icon-qq { color: #65abff; border-color: #65abff; } .socialdropdown .su-dropbox a::before { margin-right: 10px; } .next-prev-posts { position: relative } .next-prev-posts .next-post, .next-prev-posts .prev-post { display: table; float: left; width: 50% } .next-prev-posts a { display: table-cell; vertical-align: middle; width: 100%; padding: 0 30px; text-align: left; text-decoration: none; position: relative; height: 158px } .next-prev-posts a.next { text-align: right } .next-prev-posts a.has-background span { color: #cecece; font-size: 14px; } .next-prev-posts a.has-background h4 { font-size: 16px; margin-top: 10px; color: #fff; } .next-prev-posts a h4, .next-prev-posts a span { position: relative; -webkit-transition-timing-function: cubic-bezier(.25, .1, .25, 1); -moz-transition-timing-function: cubic-bezier(.25, .1, .25, 1); -o-transition-timing-function: cubic-bezier(.25, .1, .25, 1); transition-timing-function: cubic-bezier(.25, .1, .25, 1); -webkit-transition-duration: .3s; -moz-transition-duration: .3s; -o-transition-duration: .3s; transition-duration: .3s; color: #606a6a; z-index: 1 } .next-prev-posts a:hover { border-color: #20252b } .next-prev-posts a:hover h4, .next-prev-posts a:hover span { color: #20252b } .next-prev-posts a.has-background { border: none; background-size: 100%; background-position: center center; -moz-background-size: cover; -webkit-background-size: cover; -o-background-size: cover; background-size: cover } .next-prev-posts a.has-background:after { content: ''; position: absolute; background-color: rgba(0, 0, 0, .46); left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; z-index: 0; opacity: .65; -webkit-transition-timing-function: cubic-bezier(.25, .1, .25, 1); -moz-transition-timing-function: cubic-bezier(.25, .1, .25, 1); -o-transition-timing-function: cubic-bezier(.25, .1, .25, 1); transition-timing-function: cubic-bezier(.25, .1, .25, 1); -webkit-transition-duration: .3s; -moz-transition-duration: .3s; -o-transition-duration: .3s; transition-duration: .3s } .next-prev-posts a.has-background:hover h4, .next-prev-posts a.has-background:hover span { color: #fff } .next-prev-posts a.has-background:hover:after { opacity: .2 } .related-post { margin-bottom: 25px } .related-post ul { margin-right: -15px; overflow: hidden } .related-post.last { margin-bottom: 0; padding-bottom: 0; border-bottom: none } .related-post li { width: 33.33333%; display: block; position: relative; float: left; margin-bottom: 15px } .related-post li .item { margin-right: 15px; position: relative; overflow: hidden } .related-post li .item a { position: relative; display: block; height: 161px; overflow: hidden; } .related-post li .item a img { height: 100%; width: 100%; } .related-post li .item a:hover .overlay { opacity: .3 } .related-post li .item h4 { position: absolute; bottom: 0; left: 0; right: 0; padding: 25px 20px; color: #FFF; font-size: 14px; } .related-post li .item h4 span { overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .sidebar { width: 33.33333%; float: right; position: relative; padding-left: 15px; padding-right: 15px } .widget { margin-bottom: 20px; position: relative; overflow: hidden; background: #FFF; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); padding: 35px 30px; } .widget widget_cjtz_img img { max-width: 100%; height: auto; border-radius: 0 } .widget h3 { font-size: 18px; color: #282828; font-weight: 600; margin: 0; text-transform: uppercase; padding-bottom: 15px; margin-bottom: 25px; position: relative; } .widget h3:after { content: ""; background-color: #282828; left: 1px; width: 50px; height: 2px; bottom: -2px; position: absolute; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .widget:hover h3::after { width: 70px; } .recent-posts-widget li { position: relative; margin-top: 20px; overflow: hidden; } .recent-posts-widget li.one a { position: relative; overflow: hidden; display: block; } .recent-posts-widget li.one a img { width: 100%; height: auto; } .recent-posts-widget li.one a .overlay { opacity: .4; } .recent-posts-widget li.one a:hover .overlay { opacity: .6 } .recent-posts-widget li.one .title { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px; } .recent-posts-widget li.one .title h4 { color: #fff; font-size: 15px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .recent-posts-widget li.one .title h4 { } .recent-posts-widget li.one .title span { font-size: 12px; color: #CCC; margin-bottom: 5px; display: block; } .recent-posts-widget li.others { height: 75px; } .recent-posts-widget li.others .image { float: left; width: 100px; height: auto; max-height: 75px; position: relative; } .recent-posts-widget li.others .image img { width: 100px; height: auto } .recent-posts-widget li.others .title { margin-left: 115px; height: 100%; position: relative; } .recent-posts-widget li.others .title h4 { font-size: 15px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .recent-posts-widget li.others .title span { font-size: 12px; color: #9A9A9A; position: absolute; bottom: 0; } .suxingme_social { overflow: initial } .social-widget-link { position: relative; margin-bottom: 10px; position: relative; display: block; font-size: 12px; background: #fff; color: #525252; line-height: 40px; padding: 0 14px; border: 1px solid #DDD; border-radius: 2px } .social-widget-link-count i { margin-right: 9px; font-size: 17px; vertical-align: middle } .social-widget-link-title { position: absolute; top: -1px; right: -1px; bottom: -1px; width: 100px; text-align: center; background: rgba(255, 255, 255, .08); transition: width .3s; border-radius: 0 3px 3px 0 } .social-widget-link:hover .social-widget-link-title { width: 116px } .social-widget-link a { position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .social-link-weibo { border-color: rgba(236, 61, 81, .39) } .social-link-weibo i { color: #ec3d51 } .social-link-weibo .social-widget-link-title { background-color: #ec3d51; color: #fff } .social-link-tencent-weibo { border-color: rgba(104, 166, 214, .39) } .social-link-tencent-weibo i { color: #68a6d6 } .social-link-tencent-weibo .social-widget-link-title { background-color: #68a6d6; color: #fff } .social-link-email { border-color: rgba(42, 179, 154, .4) } .social-link-email i { color: #2ab39a } .social-link-email .social-widget-link-title { background-color: #2ab39a; color: #fff } .social-link-qq { border-color: rgba(18, 170, 232, .39) } .social-link-qq i { color: #12aae8 } .social-link-qq .social-widget-link-title { background-color: #12aae8; color: #fff } .social-link-wechat { border-color: rgba(25, 152, 114, .4) } .social-link-wechat i { color: #199872 } .social-link-wechat .social-widget-link-title { background-color: #199872; color: #fff } .f-weixin-dropdown, .single-weixin-dropdown { position: fixed; height: 100%; width: 100%; top: 0; left: 0; background: #FFF; z-index: 9998; display: none; -webkit-animation: fade-zoom-in .3s forwards; -o-animation: fade-zoom-in .3s forwards; animation: fade-zoom-in .3s forwards; display: none; -webkit-backface-visibility: hidden; } .f-weixin-dropdown .qcode img, .single-weixin-dropdown .qcode img { width: 100%; height: auto; } .f-weixin-dropdown.is-visible, .single-weixin-dropdown.is-visible { display: block } .f-weixin-dropdown .tooltip-weixin-inner, .single-weixin-dropdown .tooltip-weixin-inner { max-width: 300px; padding: 0 20px; margin: auto; text-align: center; position: absolute; width: 100%; left: 0; right: 0; height: 320px; top: -150px; bottom: 0; } .f-weixin-dropdown .tooltip-weixin-inner h3, .single-weixin-dropdown .tooltip-weixin-inner h3 { color: #273746; font-size: 32px; font-weight: 300; margin-bottom: 10px; line-height: 1.3; } .f-weixin-dropdown .close_tip, .single-weixin-dropdown .close_tip { position: fixed; z-index: 99999; top: 80px; right: 80px; color: #BDBDBD; font-size: 36px; cursor: pointer; -webkit-transition: all .4s ease; transition: all .4s ease } .widget_cjtz { position: relative; display: block } .widget_cjtz_img { position: relative } .img-info { position: absolute; right: 10px; bottom: 10px; padding: 0; text-align: right; color: #fff } .img-info i { position: relative; width: 20px; height: 20px; display: inline-block; background: #000; border-radius: 50%; color: #d5d5d5; font-size: 12px; line-height: 19px; text-align: center; z-index: 9 } .img-info .info { position: absolute; bottom: 0; right: 5px; width: 0; padding: 5px 0 5px; overflow: hidden; background: #000; border-radius: 10px; line-height: 10px; text-align: center; font-size: 10px; color: #b1b1b1; white-space: nowrap } .widget_cjtz .img-info .info a { color: #d5d5d5; font-style: normal } .widget_cjtz .img-info .info a:hover { color: #fff } .widget_cjtz:hover .info { width: auto; padding: 5px 14px 5px 12px; -webkit-transition: all .2s cubic-bezier(0, .34, .71, 1.26) !important; -moz-transition: all .2s cubic-bezier(0, .34, .71, 1.26) !important; -ms-transition: all .2s cubic-bezier(0, .34, .71, 1.26) !important; -o-transition: all .2s cubic-bezier(0, .34, .71, 1.26) !important; transition: all .2s cubic-bezier(0, .34, .71, 1.26) !important; font-size: 12px } .suxingme_maillist form { padding-bottom: 10px } .suxingme_maillist form .rsstxt { float: left; padding-right: 8px; padding-left: 8px; width: 180px; height: 39px; border: 1px solid #E4E4E4; border-right-width: 0; background: #F5F6F9; color: #333; font-size: 12px; font-family: "Open Sans", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, Verdana, Tahoma, sans-serif } .suxingme_maillist form .rssbutton { width: 80px; height: 39px; border: 1px solid #282828; background: #282828; color: #fff; letter-spacing: 2px; font-size: 14px; font-family: "Open Sans", "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", Arial, Verdana, Tahoma, sans-serif; -webkit-transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; -moz-transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; cursor: pointer } .suxingme_maillist form .rssbutton:hover { border: 1px solid #19B5FE; background: #19B5FE } .widget_suxingme_comment ul li { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee } .widget_suxingme_comment ul li .message { margin-bottom: 8px } .widget_suxingme_comment ul li .message a { color: #333; font-size: 14px; } .widget_suxingme_comment ul li .meta { padding-left: 20px; position: relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #9A9A9A; } .widget_suxingme_comment ul li .meta .avatar { position: absolute; top: 1px; left: 0; width: 30px } .widget_suxingme_comment ul li .meta .avatar img { border: 1px solid #e5e5e5; border-radius: 50%; padding: 1px; width: 16px; height: 16px } .widget_suxingme_comment ul li .meta .link { font-size: 12px; color: #9A9A9A } .widge_tags a { display: inline-block; font-size: 12px; line-height: 1; padding: 6px 12px 4px 12px; margin: 0 8px 8px 0; border: 1px solid #e0e0e0; border-radius: 2px; color: rgba(0, 0, 0, .44); background-color: rgba(255, 255, 255, .97); } .widge_tags a.hot { border-color: #fdb2b2; color: #fd6161 } .widge_tags a.hot i { position: relative; top: -1px } .widge_tags a:hover { color: #FFF; background: #1B1B1B; border-color: #1B1B1B } .widget_suxingme_post li { display: block; position: relative; margin: 0 0 20px } .widget_suxingme_post li:last-child { margin-bottom: 0 } .widget_suxingme_post li a { display: block; } .widget_suxingme_post li a { position: relative; display: block; overflow: hidden; width: 100%; height: 175px } .widget_suxingme_post li a:hover .overlay { opacity: .6; } .widget_suxingme_post li a img { width: 100%; min-height: 100%; opacity: 1; -webkit-transition: -webkit-transform .3s ease-in-out, opacity .3s ease-in-out; -moz-transition: -moz-transform .3s ease-in-out, opacity .3s ease-in-out; transition: transform .3s ease-in-out, opacity .3s ease-in-out } .widget_suxingme_post li .title { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px; } .widget_suxingme_post li .title h4 { color: #fff; font-size: 15px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .widget_suxingme_post li .title .entry-meta { font-size: 12px; color: #CCC; margin-bottom: 5px; } .widget_suxingme_post li .title .entry-meta span { margin-right: 10px } .widget.affix { background: #fff; z-index: 99; margin-bottom: 0; width: 300px } .affix { position: fixed } .authors_profile { position: relative } .authors_profile .avatar-panel { position: relative; background: url(../images/img_usercard_bg.jpg) center center no-repeat; background-size: cover; height: 140px; margin: -35px -30px 46px; } .authors_profile .author_pic { width: 84px; height: 84px; border-radius: 50%; overflow: hidden; position: absolute; bottom: -42px; left: 50%; margin-left: -42px; border; border: 2px solid rgba(255, 255, 255, 0.25); box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); } .authors_profile .author_pic img { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 100%; height: 100%; } .authors_profile .author_name { font-size: 18px; display: block; margin-bottom: 10px; text-align: center; position: relative } .authors_profile .author_name span { font-size: 12px; display: inline-block; color: #fff; background-color: #19b5fe; padding: 3px 4px; border-radius: 4px; line-height: 1; border: 2px solid #fff; margin-left: 5px; position: absolute; top: 2px; right: inherit } .authors_profile .author_dec { text-align: center; font-size: 12px; padding: 0 15px 5px } .authors_profile .author_post_like { text-align: center } .authors_profile .author_post_like a { border: 1px rgba(0, 0, 0, .15) solid; padding: 8px 13px; cursor: pointer; background-color: #F74840; border-color: transparent; color: #fff; height: 34px; line-height: 34px; font-size: 12px; border-radius: 999em } .authors_profile .author_post_like a:hover { background-color: #282828; color: #fff } .authors_profile .side_count { position: relative; margin-bottom: 15px } .authors_profile .side_count .side_cardTotal { display: inline-block; position: relative; height: 40px; width: 45px; left: 28%; padding: 0 4px; color: #A09F9F; border-right: 1px solid #eceef1 } .authors_profile .side_count .side_cardTotal .card_number { display: block; height: 25px; position: absolute; top: -4px; left: -2px; width: 50px; text-align: center } .authors_profile .side_count .side_cardTotal .card_number a { text-decoration: none; font-size: 15px; color: #A09F9F } .authors_profile .side_count .side_cardTotal .card { display: block; position: absolute; top: 18px; left: 20% } .authors_profile .side_count .side_cardTotal .card a { text-decoration: none; color: #A09F9F } .authors_profile .side_count .side_comment { display: inline-block; position: absolute; left: 50%; top: 0; height: 30px; width: 40px; margin: 0 2px; color: #A09F9F; padding: 0 5px } .authors_profile .side_count .side_comment .comment_number { display: block; height: 18px; position: absolute; top: -4px; text-align: center; width: 36px } .authors_profile .side_count .side_comment .comment_number a { text-decoration: none; font-size: 15px; color: #A09F9F } .authors_profile .side_count .side_comment .comment { display: block; position: absolute; top: 18px; left: 20% } .authors_profile .side_count .side_comment .comment a { text-decoration: none; color: #A09F9F } .widget_links ul li { display: inline-block } .widget_links ul li a { font-size: 12px; margin-right: 5px; color: #7D7D7D; display: inline-block } .widget_suxingme_author_posts ul { padding: 0 0 0 20px } .widget_suxingme_author_posts ul li { margin-bottom: 10px; line-height: 19px; list-style-type: decimal } .page-links { text-align: center; margin: 30px 0 } .page-links a, .page-links span { color: #888; padding: 5px 10px; margin: 5px 2px; font-size: 12px; border-radius: 2px; background: #e5e5e5 } .page-links a:hover, .page-links span.current { color: #FFF; background: #19B5FE } #comments { position: relative } .related-post, .comments-box, .respond-box { position: relative; background-color: #fff; margin-bottom: 20px; border-color: #ebedf1; padding: 50px 38px 40px; background: #fff; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .related-post h3, .comments-title { font-size: 20px; color: #282828; font-weight: 600; margin: 0; margin-bottom: 30px; text-transform: uppercase; padding-bottom: 20px; position: relative; } .related-post h3::after, .comments-title::after { content: ""; background-color: #282828; left: 0; width: 60px; height: 2px; bottom: -2px; position: absolute; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .related-post:hover h3::after, .comments-box:hover .comments-title::after, .respond-box:hover .comments-title::after { width: 75px; } .comments-title #cancel-comment-reply { margin-left: 10px; font-size: 14px; color: #ddd } #loading-comments { display: none; text-align: center; font-size: 18px; color: #929292; margin-bottom: 20px } .commentlist { padding: 0 0 20px 0; clear: both } .commentlist li { clear: both; margin: 15px 0; border-bottom: 1px solid #eceef1; margin-left: 65px; position: relative; padding-bottom: 5px; margin-bottom: 20px } .commentlist li .comment-avatar { position: absolute; left: -65px } .commentlist li .comment-avatar .avatar { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; width: 50px; height: 50px; } .commentlist li .comment_author { position: relative } .commentlist li .comment_author .comment_floor { position: absolute; right: 0; top: 0; font-size: 12px; color: rgba(0, 0, 0, .4) } .commentlist li .comment_author .comment_floor span { font-size: 14px; color: rgba(0, 0, 0, .4) } .commentlist li .comment_author .comment_floor span.floor_first { padding: 2px 5px; color: #FFF; font-size: 12px; background: #EF5E63 } .commentlist li .comment_author .comment_floor span.floor_second { background: #FFA41F } .commentlist li .comment_author .comment_floor span.floor_third { background: #6698DE } .commentlist li .comment-text { padding: 10px 0; color: #282828 } .commentlist li .comment_reply { display: block; text-align: right; margin: 0; font-size: 12px; color: #757e91 } .commentlist li ul { padding: 10px 0 0 0 } .commentlist li ul.children li { margin-left: 0; padding: 12px; border-bottom-width: 0; border: 1px solid #E4E4E4; border-radius: 2px; background-color: #fbfbfb; margin-bottom: 10px; margin-top: 0 } .commentlist li ul.children li .comment-avatar { position: relative; left: initial; float: left } .commentlist li ul.children li .comment-avatar .avatar { width: 40px; height: 40px } .commentlist li ul.children li .comment-body { border-bottom-width: 0; margin: 0 0 0 55px; padding: 0 0 10px; position: relative } .commentlist li ul.children li .comment-body .comment_reply { position: absolute; right: 0; top: 0 } .commentlist li ul.children li .comment-body .comment-text { padding: 10px 0 0 0 } .commentlist em { padding-left: 6px; color: #A8A8A8; font-size: 12px; font-style: normal } #comments-navi { text-align: center; padding: 0 30px; padding-bottom: 30px } #comments-navi .prev { padding: 4px 4px !important; } #comments-navi .page-numbers { margin: 0 1px 2px 1px; padding: 4px 10px; color: #5F5F5F; white-space: nowrap; display: inline-block; font-size: 14px; background-color: #eff0f1; border-radius: 2px; } #comments-navi .page-numbers.dots { background-color: transparent; padding: 0; } #comments-navi .page-numbers.current, #comments-navi .page-numbers:hover { color: #FFF; background-color: #19B5FE; } #respond p { margin: 0 0 15px } #respond p.logged-in-as { color: #ccc } #respond p.logged-in-as i { color: #0068d2 } #respond p.logged-in-as img { float: left; padding-right: 6px } #respond p.logged-in-as a { color: #666 } #respond p.logged-in-as a:hover { color: #E00 } #respond #error, #respond #loading { margin-top: 5px; color: #666 } #respond #error { color: #e00 } #edita { padding: 8px 15px; font-size: 14px; font-weight: 700; color: #f60; background: #fff1df } #respond p.tips { margin: 0 0 20px; padding: 10% 10px; border: 2px solid #efefef; background: #F7F7F7; text-align: center } #respond p label { padding-right: 1px; color: #000 } #respond em { font-size: 11px; font-style: normal; color: #999 } .commentlist li #respond { margin: 0 auto; padding: 15px; background: #f5f6f9; margin: 10px 0; box-shadow: none } #commentform p em { padding-left: 5px; color: red } #commentform #author, #commentform #email, #commentform #url { width: 100%; margin-bottom: 20px; margin-top: 5px; padding: 10px 14px; border: 1px solid #eaeaea; } #commentform .logged-in-as { margin-bottom: 10px } #commentform .logged-in-as a i { font-style: normal; color: #989898 } #commentform .comment-form-textarea { margin-bottom: 20px } #commentform .comment-textarea-box { position: relative; margin-bottom: 15px } #commentform .comment-textarea-box textarea { display: block; padding: 18px 14px; color: #ccc; box-sizing: border-box; width: 100%; height: 100px; padding: 10px 14px; line-height: 1.5; -moz-box-sizing: border-box; box-sizing: border-box; border-color: #efefef } #commentform #author:focus, #commentform #author:hover, #commentform #comment:focus, #commentform #comment:hover, #commentform #email:focus, #commentform #email:hover, #commentform #url:hover, #url:focus { color: #666; -webkit-appearance: none } #commentform .form-submit { position: relative; } #commentform .form-submit button { font-size: 14px; padding: 0; border-radius: 0; } #commentform .form-submit .comment-form-smilies { width: 300px; margin-top: 10px; } #commentform .form-submit .btn-comment { -webkit-appearance: none; border-radius: 2px; background: #19B5FE; color: #fff; padding: 14px 0; border: 0; font-size: 16px; font-weight: bold; width: 120px; line-height: 1; height: auto; letter-spacing: .1em; text-transform: uppercase; -webkit-transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; -moz-transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; transition: color .2s ease-out, background .2s ease-out, border-color .2s ease-out; cursor: pointer; } #commentform .form-submit .btn-comment:hover { background: #282828 } img.wp-smiley { width: 25px !important; height: auto !important; max-height: none !important } .comment-form-smilies .smilies-box { padding: 10px } .comment-form-smilies .smilies-box a { cursor: pointer; height: 30px; width: 30px; text-align: center; display: inline-block; background: #FFF } .comment-form-smilies .smilies-box a:hover { position: relative; z-index: 2 } .comment_admin { background: #999898; padding: 1px 5px; color: #fff; border-radius: 2px; margin-left: 5px; line-height: 1; font-size: 12px } #comment-author-info label { color: #888; font-size: 14px } #comment-author-info { margin-top: 20px } #comment-author-info .comment-md-3 { float: left; width: 33.3333%; padding: 0 13px 0 0; font-size: 12px; color: #ccc; box-sizing: border-box; position: relative } #comment-author-info .comment-form-url { padding: 0 } #comment-author-info .required { color: #ff4b33; font-weight: 700; margin-left: 3px; vertical-align: middle } .hide { display: none } #comment_message { position: absolute; top: 0; left: 0; background: #F9F9F9; z-index: 2; text-align: center; font-size: 18px; color: #F74840; width: 100%; height: 100px; overflow: hidden } #comment_message p { margin: 6% 0 0 0; padding: 0 10px } .comt-error { background: #F9F9F9 !important } .comments-num { color: #666 } #commentform .form-submit #submit.disabled { cursor: not-allowed; opacity: .5; background: #282828 } #pagenavi { text-align: center; margin: 0 auto; margin-top: 30px; margin-bottom: 60px } #pagenavi .page-numbers, #pagenavi .pages { margin: 0; padding: 6px 14px; color: #B5B5B5; border: 1px solid #ddd; white-space: nowrap; display: inline-block; background: #fff } #pagenavi .page-numbers:hover { color: #FFF; background: #1B1B1B; border: 1px solid #1B1B1B } #pagenavi .current { color: #FFF !important; background: #282828; border: 1px solid #282828 } .navigation { margin: 0; padding: 20px; text-align: center; font-size: 12px; display: block } .navigation .screen-reader-text { display: none } .navigation .page-numbers { padding: 10px 18px; background: #FFF; color: #666; border-radius: 3px; margin: 2px; display: inline-block; border: 1px solid #E8E8E8; font-size: 16px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .05); -moz-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .05); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .05) } .navigation .current { background: #282828; color: #fff; border-color: #282828 } .navigation a:hover { border: 1px solid #282828; color: #FFF; background: #282828 } .smiley-box { display: none; position: relative; margin-left: 10px } .posts-cjtz, .posts-cjtz-min, .posts-top-cjtz, .posts-top-cjtz-mini, .posts-footer-cjtz, .posts-footer-cjtz-mini { position: relative } .posts-footer-cjtz { margin-bottom: 30px; } .posts-top-cjtz-mini, .posts-footer-cjtz-mini { margin-bottom: 5px; display: none; } .posts-cjtz img, .posts-cjtz-min img, .posts-top-cjtz img, .posts-top-cjtz-mini img, .posts-footer-cjtz img, .posts-footer-cjtz-mini img { width: 100% } .posts-cjtz { box-shadow: none } .posts-top-cjtz { margin-bottom: 15px } .posts-top-cjtz-mini { margin-bottom: 0 } #totop { display: none; position: fixed; bottom: 45px; padding: 8px 13px 11px 13px; background: #ccc; color: #fff; text-align: center; cursor: pointer; font-size: 15px; border-radius: 5px } #totop:hover { background: #00A7EB; color: #FFF } .fancybox-image, .fancybox-inner, .fancybox-nav, .fancybox-nav span, .fancybox-outer, .fancybox-skin, .fancybox-tmp, .fancybox-wrap, .fancybox-wrap iframe, .fancybox-wrap object { padding: 0; margin: 0; border: 0; outline: 0; vertical-align: top } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020 } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none } .fancybox-opened { z-index: 8030 } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, .5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, .5); box-shadow: 0 10px 25px rgba(0, 0, 0, .5) } .fancybox-inner, .fancybox-outer { position: relative } .fancybox-inner { overflow: hidden } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch } .fancybox-error { color: #444; margin: 0; padding: 15px; white-space: nowrap } .fancybox-iframe, .fancybox-image { display: block; width: 100%; height: 100% } .fancybox-image { max-width: 100%; max-height: 100% } #fancybox-loading, .fancybox-close, .fancybox-next span, .fancybox-prev span { background-image: url(../images/fancybox_sprite.png) } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -108px; opacity: .8; cursor: pointer; z-index: 8060 } #fancybox-loading div { width: 44px; height: 44px; background: url(../images/fancybox_loading.gif) center center no-repeat } .fancybox-close { position: absolute; top: -18px; right: -18px; width: 36px; height: 36px; cursor: pointer; z-index: 8040 } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url(../images/blank.gif); -webkit-tap-highlight-color: transparent; z-index: 8040 } .fancybox-prev { left: 0 } .fancybox-next { right: 0 } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden } .fancybox-prev span { left: 10px; background-position: 0 -36px } .fancybox-next span { right: 10px; background-position: 0 -72px } .fancybox-nav:hover span { visibility: visible } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important } .fancybox-lock { overflow: hidden } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url(../images/fancybox_overlay.png) } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0 } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll } .fancybox-title { visibility: hidden; position: relative; text-shadow: none; z-index: 8050 } .fancybox-opened .fancybox-title { visibility: visible } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: 0 0; background: rgba(0, 0, 0, .8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: 700; line-height: 24px; white-space: nowrap } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff } .fancybox-title-inside-wrap { padding-top: 10px } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8) } .box404 { margin: 120px 0 250px 0; text-align: center; } .page404-title { display: block } .page404-title h4 { font-size: 148px; line-height: 150px; word-wrap: break-word; -ms-word-wrap: break-word } .box404 .pull2-left { padding: 30px } .box404 .pull2-left a { padding: 12px 18px; color: #FFF; border-radius: 999px; font-size: 14px; background-color: #19B5FE; color: #fff; display: inline-block } .box404 .pull2-left a:hover { background: #282828; color: #fff } .to-top { display: none; color: #fff; background-color: #282828; display: inline-block; height: 50px; width: 50px; line-height: 50px; text-align: center; border-radius: 2px; z-index: 101 } .to-top:hover { color: #fff; background-color: #282828 } .mod-archive-list li { line-height: 30px; margin-bottom: 2px; list-style: disc } .mod-archive-list li span { color: #848484; font-size: 12px; float: right } .mod-archive-year { color: #19B5FE; font-family: Courier, Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 25px } .mod-archive-time { color: #666; font-size: 14px; margin-right: 10px } .mod-archive-list { padding-left: 30px; padding-top: 10px; padding-bottom: 30px } #page-content.page-single { padding: 0 0 30px } .page-single { padding-top: 81px; } .page-single .page-title { padding: 120px 0 90px; background-repeat: no-repeat; background-size: cover; background-position: center center; text-align: center; } .page-single .page-title h1 { font-size: 36px; color: #FFF; } .page-single .page-dec p { color: #E6E6E6; font-size: 16px; margin-top: 8px; line-height: 1.3 } .page-content { position: relative; min-height: 500px; margin: 50px 0; padding: 60px 48px; background: #fff; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .link-title { border-bottom: 1px solid #eee; padding-bottom: 15px; margin-bottom: 15px } .link-title span { font-size: 20px; color: #404040; position: relative; margin-right: 5px } .link-title span.link-description { color: #555 } .link-items { padding: 10px 0; overflow: hidden } .link-items li { float: left; width: 33.33333%; margin-bottom: 20px } .link-items li img { width: 30px; height: 30px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px } .link-items li span { margin-left: 10px; color: #19B5FE } .likepage { padding: 30px 0; } .like-post { margin-bottom: 30px; } .like-post-box { position: relative; background: #FFF; -webkit-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #e4ecf3; } .like-post-box:hover { transform: translateY(-6px); -webkit-transform: translateY(-6px); -moz-transform: translateY(-6px); box-shadow: 0 26px 40px -24px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 26px 40px -24px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 26px 40px -28px rgba(0, 0, 0, 0.3); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .like-post-box a { display: block; } .like-post-box .image { height: 200px; background-position: center top; background-repeat: no-repeat; background-size: cover; } .like-post-box .title { background: rgb(255, 255, 255); padding: 15px 13px; } .like-post-box .title h2 { font-size: 14px; height: 38px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .like-post-box .title h2 a { color: #FFF } .like-post-box .views { position: absolute; right: 15px; top: 15px; background: rgba(232, 40, 74, .8); color: #FFF; padding: 3px 8px; font-size: 12px; border-radius: 3px } .page-nav-items { color: #aaa; background: #FFF; padding: 20px; margin-bottom: 30px; position: relative; overflow: hidden; min-height: 660px; -webkit-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1); box-shadow: 0 5px 10px 0 rgba(146, 146, 146, .1) } .page-nav-items .item { margin: 0 0 30px; clear: both } .page-nav-items .item h2 { font-weight: 400; color: #FFF; margin-left: -20px; font-size: 18px } .page-nav-items .item h2 span { position: relative; left: 0; display: inline-block; margin: 10px 0; padding: 0 30px 0 25px; height: 45px; line-height: 45px; border-radius: 0 35px 35px 0; background: #333; color: #fff } .page-nav-items .item h2 span i { font-size: 12px; position: relative; top: -2px; margin-right: 8px } .page-nav-items .item li { float: left; position: relative; color: #adadad; width: 25% } .page-nav-items .item li .nav-item { margin: 15px; padding: 15px; height: 80px; cursor: pointer; border: 1px solid #eaeaea } .page-nav-items .item li .nav-item:hover { border-color: #19B5FE } .page-nav-items .item li .nav-item:hover a { color: #19B5FE } .page-nav-items .item li .nav-item a { margin-bottom: 5px; display: block; font-size: 15px; color: #333; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .page-nav-items .item li .nav-item p { color: #aab1b7; font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 0 } .pages { display: block; position: relative; padding: 0; margin-bottom: 50px } .pages-left { width: 20%; float: left; position: relative } .pages-left-menu { list-style: none; margin: 0 0 15px; padding: 0; border: 1px solid #eaeaea; background-color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 5px; overflow: hidden; position: relative } .pages-left-menu li { position: relative; border-bottom: 1px solid #eee; padding: 12px 20px 12px 35px; -webkit-transition: background .6s ease-out; -moz-transition: background .6s ease-out; transition: background .6s ease-out } .pages-left-menu li a { font-size: 16px; color: #8C8C8C; display: block } .pages-left-menu li a:hover { color: #000 } .pages-left-menu li.current-menu-item { background-color: #363b3f } .pages-left-menu li.current-menu-item a { color: #FFF } .tag-clouds { list-style: none; margin: 0 } .tag-clouds li { float: left; width: 25%; font-size: 12px; height: 115px; overflow: hidden; color: #999; border-bottom: 1px solid #eee; padding: 10px 0 } .tag-clouds .tagname { display: inline-block; margin-right: 5px; background-color: #e6e6e6; color: #666; padding: 2px 7px; margin-bottom: 4px } .tag-clouds strong { font-weight: 400; color: #999 } .tag-clouds a { color: #666; margin-right: 10px; display: inline-block; margin-top: 10px } .tag-clouds .tagname:hover { color: #fff; background-color: #19B5FE } .search-title { position: relative; display: block; margin-bottom: 30px; -moz-border-radius: 3px } .search-title h3 { margin-bottom: 0 } .recommend-content { position: relative; margin-bottom: 25px; } .top-slide { width: 100%; overflow: hidden; height: 430px; position: relative } .top-slide .item { position: relative; overflow: hidden; padding: 0 15px } .top-slide .owl-item .slider-image { float: left; position: relative; width: 70%; } .top-slide .owl-item .slider-image a { display: block; width: 100%; height: 450px; background-size: cover; background-position: center top; background-repeat: no-repeat; } .top-slide .owl-dots { position: absolute; bottom: 15px; width: 70%; text-align: center; } .top-slide .owl-dots .owl-dot.active span { background: #FFF } .top-slide .owl-dots .owl-dot span { width: 10px; height: 10px; border: 2px solid #FFF; background: 0 0; margin: 3px 3px; opacity: 1; display: block; } .top-slide .owl-item .slider-content { position: absolute; right: 0; width: 33.333333333%; padding: 0 15px; top: 0; bottom: 0 } .top-slide .owl-item .slider-content .slider-content-box { background: #FFF; height: 100%; padding: 40px 30px } .top-slide .owl-item .slider-content .post-categories { margin-bottom: 10px; } .top-slide .owl-item .slider-content .post-categories a { padding: 5px 14px; background-color: #19B5FE; color: #fff; font-size: 15px; line-height: 16px; font-weight: 400; display: inline-block; border-width: 0 } .top-slide .owl-item .slider-content .slider-title { margin-bottom: 20px; padding-bottom: 20px; position: relative; border-bottom: 1px solid #dedede; } .top-slide .owl-item .slider-content .slider-title h2 { font-size: 20px; position: relative; max-height: 96px; overflow: hidden; } .top-slide .owl-item .slider-content .slider-title:after { content: ""; background-color: #19B5FE; left: 0; width: 50px; height: 3px; bottom: -2px; position: absolute; } .top-slide .owl-item .slider-content .post-element { margin-bottom: 10px } .top-slide .owl-item .slider-content .post-element ul li { font-size: 12px; letter-spacing: -.2px; float: left; padding: 0; margin: 0 10px 0 0; color: #748594; position: relative } .top-slide .owl-item .slider-content .post-element ul li.post-slider-author { padding-left: 30px } .top-slide .owl-item .slider-content .post-element ul li.post-slider-author a { display: inline-block } .top-slide .owl-item .slider-content .post-element ul li.post-slider-author img { position: absolute; top: -2px; left: 0; width: 20px; height: 20px; border: 1px solid #e5e5e5; border-radius: 50%; padding: 1px; display: inline-block } .top-slide .owl-item .slider-content .slider-post-text { padding: 10px 0; } .top-slide .owl-item .slider-content .slider-post-text p { font-size: 14px; line-height: 1.6 } .top-slide .owl-item .slider-content .read-more { text-align: right; margin-top: 10px } .top-slide .owl-item .slider-content .read-more a { padding: 10px 22px; background-color: #282828; color: #FFF; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: 14px; position: relative; display: inline-block } .top-slide .owl-item .slider-content .read-more a:hover { background-color: #19B5FE } .top-content { position: relative; margin-bottom: 25px; } .top-slide-two { float: left; width: 66.66666%; padding: 0 15px; position: relative } .top-slide-two .item { position: relative } .top-slide-two .item a { display: block; } .top-slide-two .item .slider-content { height: 450px; background-repeat: no-repeat; background-size: cover; background-position: center top; } .top-slide-two .item .slider-content .slider-cat { position: absolute; top: 35px; left: 35px; padding: 8px 12px; background-color: rgba(0, 0, 0, .7); font-size: 14px; display: inline-block; text-shadow: none; line-height: 1; color: #FFF; border-radius: 2px; } .top-slide-two .item .slider-content .slider-content-item { position: absolute; bottom: 0; padding: 38px 38px 45px; left: 0; right: 0; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease; background-image: -webkit-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: -moz-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: linear-gradient(180deg, rgba(0, 0, 0, .01) 0, rgba(0, 0, 0, .85) 100%); } .top-slide-two .item .slider-content .slider-content-item h2 { color: #fff; display: block; font-size: 26px } .top-slide-two .owl-dots { position: absolute; text-align: center; bottom: 15px; left: 15px; right: 15px; } .top-slide-two .owl-dots button.owl-dot { } .top-slide-two .owl-dots button.owl-dot span { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; width: 20px; height: 3px; background: #fff; margin: 5px 4px; display: block; } .top-slide-two .owl-nav { } .top-slide-two .owl-nav button { border-radius: 0; position: absolute; top: 50%; width: 35px; height: 55px; cursor: pointer; line-height: 55px; font-size: 30px; text-align: center; margin: 0; margin-top: -30px; opacity: 0; -webkit-transition: all .3s ease; font-family: fontello; font-style: normal; font-weight: 400; background-color: #000 !important; } .top-slide-two .owl-nav button:after { font-family: fontello; font-style: normal; color: #fff } .top-slide-two .owl-nav button:after { font-family: fontello; font-style: normal; font-weight: 400; speak: none; display: inline-block; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none; font-size: 30px; } .top-slide-two .owl-nav button.owl-prev { left: 12% } .top-slide-two .owl-nav button.owl-prev:after { content: '\e93b' } .top-slide-two .owl-nav button.owl-next { right: 12% } .top-slide-two .owl-nav button.owl-next:after { content: '\e93c' } .top-slide-two:hover .owl-nav button { opacity: .4 } .top-slide-two:hover .owl-nav button.owl-prev { left: 15px } .top-slide-two:hover .owl-nav button.owl-next { right: 15px } .top-singles { position: relative; float: left; width: 33.33333%; padding: 0 15px } .top-singles .single-item { position: relative; margin-bottom: 30px } .top-singles .single-item:last-child { margin-bottom: 0 } .top-singles .single-item .image { height: 210px; background-repeat: no-repeat; background-size: cover; background-position: center top; position: relative; } .top-singles .single-item .image .cat { position: absolute; top: 20px; left: 20px; padding: 7px 10px 6px 10px; background-color: rgba(0, 0, 0, .7); font-size: 12px; display: inline-block; text-shadow: none; line-height: 1; color: #FFF; border-radius: 2px; } .top-singles .single-item .image .title { position: absolute; bottom: 0; padding: 22px 20px; left: 0; right: 0; } .top-singles .single-item .image .title h3 { color: #fff; display: block; font-size: 16px; max-height: 48px; overflow: Hidden } .top-singles .single-item .image .overlay { opacity: .3 } .top-singles .single-item .image a:hover .overlay { opacity: 0 } .hot-articles { position: relative; float: left; width: 33.33333%; padding: 0 15px } .hot-articles .hots-content { height: 450px; background: #FFF; border-top: 2px solid #404040; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .hot-articles .hots-content .hots-headline { padding: 14px 20px; font-size: 18px; color: #282828; font-weight: 600; } .hot-articles .hots-content .hots-item { position: relative } .hot-articles .hots-content .hots-item a { display: block } .hot-articles .hots-content .hots-item h3 { font-size: 15px; padding: 12px 22px 12px 35px; position: relative; color: #2e2d38; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .hot-articles .hots-content .hots-item h3 span { display: block; height: 40px; overflow: hidden; line-height: 1.3; vertical-align: middle; line-height: 40px } .hot-articles .hots-content .hots-item .hots-image { background-repeat: no-repeat; background-size: cover; background-position: center top; height: 200px; } .hot-articles .hots-content .hots-title { position: relative; padding: 12px 22px 12px 35px; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .hot-articles .hots-content .hots-title:last-child { border-width: 0 } .hot-articles .hots-content .hots-title a { height: 40px; display: block; color: #404040; font-size: 15px; vertical-align: middle; line-height: 40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .hot-articles .hots-content .hots-item h3:hover, .hot-articles .hots-content .hots-title:hover { background-color: #2e2d38; color: #FFF } .hot-articles .hots-content .hots-item h3 i, .hot-articles .hots-content .hots-title i { position: absolute; left: 10px; top: 24px; color: #2e2d38; font-size: 12px; } .hot-articles .hots-content .hots-item h3:hover i, .hot-articles .hots-content .hots-title:hover i { color: #FFF } .hot-articles .hots-content .hots-title:hover a { color: #FFF } .top-slide-three { width: 100%; margin-bottom: 25px; } .top-slide-three .owl-item .item { width: 1140px; } .top-slide-three .owl-item .item .read-slider { position: absolute; left: 0; right: 0; top: 0; bottom: 0; display: block; z-index: 0 } .top-slide-three .owl-item .item:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: .78; content: ''; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; background: #000; } .top-slide-three .owl-item.center .item:before { opacity: .3; } .top-slide-three .owl-item .item:hover:before { opacity: .45 } .top-slide-three .slider-content { height: 450px } .top-slide-three .slider-content .slider-content-box { padding: 0; height: 100%; display: table; width: 100%; position: relative } .top-slide-three .slider-content .slider-content-box .slider-content-item { position: static; display: table-cell; vertical-align: middle; text-align: center } .top-slide-three .slider-content .slider-content-box .slider-content-item .post-categories { padding: 6px 10px; background-color: #FFF; color: #282828; font-size: 12px; line-height: 1; display: inline-block; border-width: 0; border-radius: 2px; } .top-slide-three .slider-content .slider-title { width: 50%; margin: 0 auto; padding: 10px 0 } .top-slide-three .slider-content .slider-title h2 { font-size: 32px; color: #FFF; line-height: 1.2 } .top-slide-three .owl-dots { bottom: 15px; position: absolute; width: 100%; text-align: center; } .top-slide-three .owl-dots .owl-dot span { -webkit-border-radius: 0; margin: 5px 4px; border-radius: 0; width: 30px; height: 3px; background: rgba(255, 255, 255, 0.51); margin: 5px 4px; display: block; } .top-slide-three .owl-dots .owl-dot.active span { background: #FFF; } .top-slide-three .owl-nav button { border-radius: 0; position: absolute; top: 50%; width: 60px; height: 65px; cursor: pointer; line-height: 65px; font-size: 60px; text-align: center; margin: 0; margin-top: -35px; opacity: 0; -webkit-transition: all .3s ease; } .top-slide-three .owl-nav button:after { font-family: fontello; font-style: normal; font-weight: 400; speak: none; display: inline-block; text-decoration: inherit; width: 1em; text-align: center; font-variant: normal; text-transform: none } .top-slide-three .owl-nav button.owl-prev { left: 12%; cursor: pointer; line-height: 65px; font-size: 60px; color: #FFF; } .top-slide-three .owl-nav button.owl-prev:after { content: '\e93b' } .top-slide-three .owl-nav button.owl-next { right: 12%; cursor: pointer; line-height: 65px; font-size: 60px; color: #FFF; } .top-slide-three .owl-nav button.owl-next:after { content: '\e93c' } .top-slide-three:hover .owl-nav button { opacity: .8 } .top-slide-three:hover .owl-nav button.owl-prev { left: 10% } .top-slide-three:hover .owl-nav button.owl-next { right: 10% } .warp-post-embed { position: relative; overflow: hidden; max-height: 280px; padding: 22px 18px; color: rgba(0, 0, 0, .6); margin: 0 0 20px; border: 1px solid #f3f0f0; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .warp-post-embed:hover { -webkit-box-shadow: 0 0px 18px 0 rgba(146, 146, 146, 0.12); -moz-box-shadow: 0 0px 18px 0 rgba(146, 146, 146, 0.12); box-shadow: 0 0px 18px 0 rgba(146, 146, 146, 0.12); } .warp-post-embed .embed-content { margin-right: 200px; } .warp-post-embed .embed-content p { display: block; font-size: 12px; font-style: normal; color: #8E8E8E; line-height: 1.5; margin-bottom: 5px } .warp-post-embed .embed-content h2 { color: rgba(0, 0, 0, .8); display: block; margin-bottom: 8px; font-size: 18px; line-height: 1.4 } .warp-post-embed .embed-bg { float: right; width: 180px; height: 120px; background-size: cover; background-repeat: no-repeat; background-position: 50%; margin-left: 12px } .search-form { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #fff; -webkit-animation: fade-zoom-in .3s forwards; -o-animation: fade-zoom-in .3s forwards; animation: fade-zoom-in .3s forwards; display: none; z-index: 100; -webkit-backface-visibility: hidden; overflow: hidden } .search-form .search-form-inner { max-width: 640px; padding: 0 20px; margin: auto; position: absolute; width: 100%; left: 0; right: 0; height: 285px; top: -100px; bottom: 0 } .search-form-inner p { margin-top: 10px; color: #a0a0a0; text-align: center; font-size: 20px } .search-form.is-visible { display: block } .search-form .search-form-box { position: relative; margin-bottom: 40px } .search-form input { background: #fff; display: inline-block; line-height: 58px; height: 58px; color: #949494; font-size: 15px; border-radius: 3px; padding: 0 20px; width: 100%; border: 1px solid #e2e2e2; text-align: left; -webkit-appearance: none } .search-form button { background: #000; display: inline-block; line-height: 58px; height: 58px; width: 100px; color: #fff; font-size: 15px; padding: 0 25px; margin: 0; border-radius: 0 3px 3px 0; position: absolute; right: 0; top: 0 } .search-form input::-webkit-input-placeholder { color: #949494 } .search-form input:-moz-placeholder { color: #949494 } .search-form input::-moz-placeholder { color: #949494 } .search-form input:-ms-input-placeholder { color: #949494 } .search-commend { position: relative } .search-commend h4 { position: relative; font-size: 16px; margin: 0 0 20px } .search-commend ul li { display: inline-block; margin-bottom: 10px; margin-right: 10px } .search-commend ul li a { display: inline-block; line-height: 1; padding: 10px 20px; border: 1px solid #e2e2e2; border-radius: 2px; color: #949494 } .search-commend ul li a:hover { color: #273746; border-color: #273746 } .burger-menu { position: absolute; left: 0; top: 0; height: 80px; width: 50px; z-index: 2; cursor: pointer; text-align: center; line-height: 50px; display: none; font-family: FontAwesome } .overflow-hidden { overflow: hidden; height: 100% } .burger-menu { display: block } .body-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, .67); content: ""; z-index: 9; display: none; display: block; visibility: hidden; opacity: 0; -webkit-transition: visibility ease-in-out .3s, opacity ease-in-out .3s; -o-transition: visibility ease-in-out .3s, opacity ease-in-out .3s; transition: visibility ease-in-out .3s, opacity ease-in-out .3s; } .body-overlay.show-overlay { visibility: visible; opacity: 1; overflow: hidden } .nav-body { position: relative } .nav-menu { position: fixed; top: 0; left: -300px; bottom: 0; width: 300px; z-index: 12; background: #FFF; height: auto; overflow: auto; padding: 0; margin: 0; -webkit-transition: left ease-in-out .3s; -o-transition: left ease-in-out .3s; transition: left ease-in-out .3s; -webkit-overflow-scrolling: touch; overflow-scrolling: touch } .nav-menu.toggle-nav { left: 0 } .nav-menu .main-nav { padding: 60px 10px 20px } .nav-menu .main-nav li { display: block } .nav-menu .main-nav li a { line-height: 60px; color: #50514f } .nav-menu .main-nav li.has-children:after { content: '\f107'; line-height: 60px } .nav-menu .main-nav .sub-menu { position: relative; top: 0; width: 100%; height: auto; display: none; padding: 5px 0; border: 1px solid #DDD; border-top: 1px solid #616161 } .nav-menu .main-nav .sub-menu .sub-menu { left: 0 } .nav-menu .main-nav li .sub-menu li .sub-menu li:hover .sub-menu, .nav-menu .main-nav li .sub-menu li:hover .sub-menu, .nav-menu .main-nav li .sub-menu li:hover .sub-menu li .sub-menu, .nav-menu .main-nav li:hover .sub-menu, .nav-menu .main-nav li:hover .sub-menu li .sub-menu { display: none } .nav-menu .main-nav li .toggle-submenu { display: block } .nav-menu .main-nav .sub-menu li a { padding-left: 20px } .nav-menu .main-nav .sub-menu .sub-menu li a { padding-left: 40px } .nav-menu .main-nav .sub-menu .sub-menu .sub-menu li a { padding-left: 50px } .nav-menu .main-nav li.has-children.active:after { content: '\f106' } .nav-menu .main-nav .sub-menu li.has-children:after { content: "\f107" } .nav-menu .main-nav .sub-menu li.has-children.active:after { content: "\f106" } .close-nav { display: block; position: absolute; top: 0; left: 71%; width: 50px; height: 50px; cursor: pointer; background: #fff } .close-bottom, .close-top { position: absolute; left: 14px; background: #333; width: 22px; height: 2px; transition: .3s } .close-top { top: 19px } .close-bottom { bottom: 19px } .close-top { -webkit-transform: translate(0, 5px) rotate(225deg); transform: translate(0, 5px) rotate(225deg) } .close-bottom { -webkit-transform: translate(0, -5px) rotate(135deg); transform: translate(0, -5px) rotate(135deg) } .close-nav { display: block; position: absolute; top: 10px; left: 10px; width: 50px; height: 50px; cursor: pointer; background: #fff } .close-search, .close-weixin { display: block; position: absolute; top: 10%; right: 10%; width: 80px; height: 80px; cursor: pointer; background: #fff } .close-search .close-nav { display: block; position: absolute; top: 10px; left: 10px; width: 50px; height: 50px; cursor: pointer; background: #fff } .close-top .close-bottom, .close-top .close-top { position: absolute; left: 9px; background: #333; width: 60px; height: 1px; transition: .3s } .close-search .close-bottom, .close-search .close-top, .close-weixin .close-bottom, .close-weixin .close-top { width: 45px; left: 16px } .close-search .close-top, .close-weixin .close-top { top: 34px } .close-search .close-bottom, .close-weixin .close-bottom { bottom: 34px } .close-search:hover .close-top, .close-weixin:hover .close-top { -webkit-transform: translate(0, 5px) rotate(225deg); transform: translate(0, 5px) rotate(45deg) } .close-search:hover .close-bottom, .close-weixin:hover .close-bottom { -webkit-transform: translate(0, -5px) rotate(135deg); transform: translate(0, -5px) rotate(315deg) } .nav-menu { left: -100%; width: 70% } .nav-menu.toggle-nav { left: 0 } .close-nav { display: block } .page-contribute { position: relative; width: 70%; margin: 60px auto; } .contribute-item { position: relative; padding: 60px 48px; margin-bottom: 30px; background: #fff; -webkit-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); -moz-box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); box-shadow: 0 2px 5px 0 rgba(146, 146, 146, .1); } .contribute-item h3 { font-size: 18px; color: #282828; font-weight: 600; margin: 0; text-transform: uppercase; padding-bottom: 18px; margin-bottom: 28px; position: relative; } .contribute-item h3::after { content: ""; background-color: #282828; left: 1px; width: 50px; height: 2px; bottom: -2px; position: absolute; -webkit-transition: 0.5s; -moz-transition: 0.5s; -ms-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; } .contribute-item h3:hover::after { width: 70px; } .contribute-item .copy-meta { padding: 0px 0 10px } .contribute-item .copy-meta .form-group { margin: 8px 0 0; } .contribute-item .copy-meta .form-group .form-control { font-size: 14px; border: 1px solid #e5e7ec; padding: 13px; } .contribute-cat { } .contribute-cat li { display: inline-block; font-size: 14px; line-height: 1; padding: 10px 20px; margin: 10px 10px 0 0; border: 1px solid #DDD; border-radius: 4px; cursor: pointer; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .contribute-cat li:hover { border-color: #282828; color: #282828; } .contribute-cat li.is-visible { border-color: #282828; color: #fff; background: #282828 } .contribute-item .form-group { position: relative; margin-bottom: 20px; } .contribute-item .form-control-box { position: relative; } .contribute-item .form-group .form-control { width: 100%; padding: 0; border: 0; border-bottom: 1px solid #e5e7ec; font-size: 22px; height: auto; padding: 15px 0; box-shadow: none; } .contribute-item .form-group .wp-editor-container { border: 0; } .contribute-item .form-group .mce-toolbar-grp { border: 0; background: none; } .contribute-item .form-group .mce-toolbar-grp .mce-stack-layout { padding: 0 } .contribute-item .form-group .mce-edit-area { margin-top: 20px; border-width: 1px !important; border-color: #ecedf1; border-style: solid; } .contribute-item .form-group .mce-toolbar .mce-btn-group .mce-btn.mce-listbox { margin: 2px 0; } .contribute-item .form-group .mce-statusbar { display: none; } .contribute-item .form-control + .form-control-border { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; bottom: 0; background: #282828; height: 2px; -webkit-transition-property: left, right; transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .contribute-item .form-control:focus + .form-control-border { left: 0; right: 0; z-index: 1; } .form-upimg { position: absolute; display: inline-block; right: 0; top: 0; z-index: 1; font-size: 12px; padding: 4px 5px; margin: 2px; border: 1px solid rgb(226, 225, 225); -webkit-border-radius: 2px; border-radius: 2px; } .form-upimg:hover { border-color: #555d66 } .form-upimg input { position: absolute; left: 0; top: 0; opacity: 0; filter: Alpha(opacity=1); cursor: pointer; width: 100%; height: 100%; text-indent: -9999px; } .form-upimg span i { line-height: 20px; width: 20px; height: 20px; cursor: pointer; margin-right: 5px; } .navbar-collapse { overflow-x: visible; -webkit-overflow-scrolling: touch; border-top: 1px solid transparent; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1); } .navbar-collapse { right: calc((100vw - 74px) * -1); width: calc(100vw - 74px); } body.off-canvas-nav-left .navbar-collapse { left: calc((100vw - 74px) * -1); } body.off-canvas-nav-left .navbar-collapse { left: -300px; right: auto; border: none; border-right: 1px solid #e7e7e7; background: #FFF; margin: 0; } html.out { position: fixed; top: 0; left: 0; width: 100%; } body { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } body.out { -webkit-transform: translate3d(-300px, 0, 0); transform: translate3d(-300px, 0, 0); overflow: hidden; } body.off-canvas-nav-left.out { -webkit-transform: translate3d(300px, 0, 0); transform: translate3d(300px, 0, 0); } body.out .navbar-toggle { background-color: transparent; } .navbar-toggle { position: absolute; padding: 15px 13px; background-color: transparent; background-image: none; left: 10px; top: 12px; float: none; margin: 0; border-radius: 0; border: 0; display: block; } .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; background-color: #282828; -webkit-transition: all .2s ease-out; transition: all .2s ease-out; } .navbar-toggle .icon-bar:nth-of-type(1) { width: 22px; } .navbar-toggle .icon-bar:nth-of-type(2) { margin-top: 4px; } .navbar-toggle .icon-bar:nth-of-type(3) { width: 22px; margin-top: 4px; } .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: none; } .navbar-toggle .icon-bar { -webkit-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; } body.out .navbar-toggle .icon-bar:nth-of-type(1) { -webkit-transform: translate3d(0, 6px, 0) rotate(45deg); transform: translate3d(0, 6px, 0) rotate(45deg); } body.out .navbar-toggle .icon-bar:nth-of-type(2) { opacity: 0; filter: alpha(opacity=0); } body.out .navbar-toggle .icon-bar:nth-of-type(3) { -webkit-transform: translate3d(0, -6px, 0) rotate(-45deg); transform: translate3d(0, -6px, 0) rotate(-45deg); } .navbar-collapse { display: block !important; position: fixed; top: 0; right: -300px; bottom: 0; z-index: 10000; width: 300px; height: 100vh !important; margin: 0; background-color: inherit; border: none; box-shadow: none; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, transform; padding: 0; } body.out .navbar-collapse { opacity: 1; filter: alpha(opacity=100); } .navbar-nav { z-index: 10010; padding: 20px 0; margin: 0; float: none; } .navbar-nav li { border-bottom: 1px solid #f5f5f5; position: relative; } .navbar-nav li:last-child { border: 0 } .navbar-nav li a { display: block; font-size: 16px; height: 60px; line-height: 60px; padding-left: 70px; padding-right: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .navbar-nav li a i { color: #adb3bb; position: absolute; left: 25px; top: 0; font-size: 20px; } .navbar-nav li.menu-item-has-children { position: relative; } .navbar-nav li.has-children:after { font-family: fontello; font-style: normal; font-weight: 400; position: absolute; width: 20px; line-height: 60px; right: 20px; top: 0; text-align: center; color: #50514f; } .navbar-nav li.has-children:after { content: '\f107'; line-height: 60px; } .navbar-nav li.menu-item-has-children .sub-menu { display: none; } .navbar-nav li.menu-item-has-children .sub-menu li { border: 0 } .navbar-nav li.menu-item-has-children .sub-menu li a { font-size: 15px; padding-left: 70px; height: 50px; line-height: 50px; } .navbar-nav li.menu-item-has-children span.toggle-submenu { position: absolute; height: 60px; left: 0; right: 0; background: 0 0; content: ""; z-index: 3; cursor: pointer; display: block; } .navbar-fixed-top .navbar-collapse { max-height: none; } body.out .navbar-fixed-top .navbar-collapse { -webkit-transform: none; -ms-transform: none; transform: none; } #page-content.topic-plaza, #page-content.page-topic { padding: 80px 0 50px 0; } .topic-bg { position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; margin-bottom: 40px; } .topic-bg::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.45); } .topic-bg .container { padding: 100px 0 80px 0; position: relative; z-index: 2; text-align: center; } .topic-bg .container .title { color: #FFF; font-size: 28px; line-height: 1.6; margin-bottom: 5px; } .topic-bg .container span { display: inline-block; font-size: 12px; line-height: 1; color: #FFF; padding: 5px 12px; } .topic-bg .container .description { color: #FFF; font-size: 16px; margin-bottom: 5px; } .topic-featured { margin-bottom: 10px; margin-right: -10px; margin-left: -10px; } .topic-featured .topic-tag { padding: 0 10px; } .topic-featured .item { position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; height: 200px; } .topic-featured .item .title { position: absolute; bottom: 0; left: 0; right: 0; padding: 20px 20px 25px; color: #FFF; } .topic-featured .item .title h2 { color: #FFF; } .topic-featured .item .meta { font-size: 12px; margin-top: 5px; } .topic-featured .item .meta span { } .topic-featured .item .tag { position: absolute; right: 20px; top: 20px; } .topic-featured .item .tag span { display: block; background: rgba(0, 0, 0, 0.62); color: #FFF; padding: 3px 10px; font-size: 12px; border-radius: 30px; } .topic-featured .item a { position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; } .topic-featured .item a:hover .overlay { opacity: .3; } .topic-list { margin-right: -10px; margin-left: -10px; } .topic-list .topic-tag { padding: 10px; } .topic-list .item { position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; height: 160px; } .topic-list .item .title { position: absolute; bottom: 0; left: 0; right: 0; padding: 15px; color: #FFF; } .topic-list .item .title h2 { font-size: 14px; color: #FFF; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; } .topic-list .item .meta { font-size: 12px; margin-top: 5px; } .topic-list .item .meta span { } .topic-list .item .tag { position: absolute; right: 15px; top: 15px; } .topic-list .item .tag span { display: block; background: rgba(0, 0, 0, 0.62); color: #FFF; padding: 3px 10px; font-size: 12px; border-radius: 30px; } .topic-list .item a { position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; } .topic-list .item a:hover .overlay { opacity: .3; } .widget_suxingme_topic { } .widget_suxingme_topic li { position: relative; margin-top: 20px; overflow: hidden; } .widget_suxingme_topic li a { display: block; } .widget_suxingme_topic li a:hover .overlay { opacity: .6; } .widget_suxingme_topic li .image { background-position: center; background-repeat: no-repeat; background-size: cover; height: 180px; } .widget_suxingme_topic li .title { display: flex; flex-direction: column; justify-content: center; align-items: center; position: absolute; top: 0; left: 0; transition: all .5s; width: 100%; height: 100%; z-index: 2; padding: 0 20px; } .widget_suxingme_topic li .title h4 { color: #FFF; text-align: center; font-size: 15px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; margin-top: 5px; } .widget_suxingme_topic li .title .meta { margin-top: 10px; } .widget_suxingme_topic li .title .meta span { background: transparent; font-size: 12px; border: 1px solid #FFF; border-radius: 40px; padding: 8px 16px; line-height: 1; color: #FFF; display: inline-block; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -ms-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; } .widget_suxingme_topic li a:hover .title .meta span { background: #FFF; color: #282828; } .modal-content { border: 0; border-radius: 0; } .modal-header { padding: 25px; background: #282828; color: #FFF; border: 0; } .modal-title { color: #FFF; font-size: 16px; } .modal-header .close { color: #FFF; opacity: 1; } .modal-body { padding: 25px; } .modal-body .form-group:last-child { margin: 0 } .modal-body .form-control { width: 100%; height: 40px; border-radius: 2px; } .modal-body .control-label { font-size: 14px; font-weight: normal; } .modal-body .form-group .btn-default { height: 40px; width: 100%; } .modal-footer { padding: 25px; } .butterBar { margin-left: 36%; max-width: 640px; position: fixed; text-align: center; top: 0; width: 58%; z-index: 1051 } .butterBar--center { left: 50%; margin-left: -320px } .butterBar-message { background: #cc5454; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25), 0 0 1px rgba(0, 0, 0, 0.35); display: inline-block; font-size: 14px; margin-bottom: 0; padding: 12px 25px; color: #fff; } .butterBar.is-active { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 0s; transition-delay: 0s; visibility: visible; } /* Preloader -------------------------------------------------------*/ .loader-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; z-index: 99999; } .loader { position: absolute; left: 50%; top: 50%; width: 50px; height: 50px; font-size: 0; color: #282828; display: inline-block; margin: -25px 0 0 -25px; text-indent: -9999em; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .loader div { background-color: #282828; display: inline-block; float: none; position: absolute; top: 0; left: 0; width: 50px; height: 50px; opacity: .5; border-radius: 50%; -webkit-animation: ballPulseDouble 2s ease-in-out infinite; animation: ballPulseDouble 2s ease-in-out infinite; } .loader div div:last-child { -webkit-animation-delay: -1s; animation-delay: -1s; } @-webkit-keyframes ballPulseDouble { 0%, 100% { -webkit-transform: scale(0); transform: scale(0) } 50% { -webkit-transform: scale(1); transform: scale(1) } } @keyframes ballPulseDouble { 0%, 100% { -webkit-transform: scale(0); transform: scale(0) } 50% { -webkit-transform: scale(1); transform: scale(1) } } @media screen and (min-width:991px) and (max-width:1199px) { #header .logo { /* text-align: center; */ /* letter-spacing: 0; */ /* position: relative; */ /* margin: 0 auto; */ /* height: 66px; */ /* line-height: 66px; */ /* float: none; */ /* padding: 0; */ } #header .logo a { width: 190px; background-position: left center; } #header .right-nav { top: 10px; } #page-content { padding: 95px 0 50px 0; } #page-content.page-content-110 { padding: 66px 0 50px 0; } .page-single { padding-top: 66px; } .page-contribute { width: 100%; margin: 20px auto; } .contribute-item { padding: 30px 28px; margin-bottom: 1px; } .contribute-item .form-group .mce-toolbar-grp { padding-right: 95px; } .btn-contribute { display: block; margin: 25px auto; } .likepage { padding: 5px 0; } .like-post { padding: 5px; margin: 0; } .like-post-box .image { height: 150px; } } @media screen and (max-width:991px) { .top-slide { height: auto } .top-slide .owl-item .slider-content { transform: translateY(0); width: 100%; right: auto; padding: 0; padding-bottom: 0; bottom: 0; top: auto; position: absolute; -webkit-transition: all .2s ease; -moz-transition: all .2s ease; transition: all .2s ease; background-image: -webkit-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: -moz-linear-gradient(180deg, rgba(0, 0, 0, .01) 5%, rgba(0, 0, 0, .75) 100%); background-image: linear-gradient(180deg, rgba(0, 0, 0, .01) 0, rgba(0, 0, 0, .65) 100%); } .top-slide .owl-item .slider-content .slider-content-box { padding: 25px; } .top-slide .owl-item .slider-content .read-more, .top-slide .owl-item .slider-content .slider-post-text { display: none } .top-slide .owl-item .slider-content .post-categories { display: none; margin-bottom: 0; } .top-slide .owl-item .slider-content .post-categories a { padding: 4px 12px; font-size: 12px } .top-slide .owl-item .slider-content .slider-title:after { display: none } .top-slide .owl-item .slider-content .slider-title { margin-bottom: 0; border: 0; } .top-slide .owl-item .slider-content .slider-title h2 { border-bottom: 1px solid #eee; color: #FFF; } .top-slide .owl-item .slider-content .post-element { display: none; margin-bottom: 0; } .top-slide.owl-theme .owl-controls { bottom: 10px; position: absolute; text-align: center; padding-right: 0; width: 100%; margin: 0; } .top-slide.owl-theme .owl-controls .owl-dot span { border-width: 0; background: #D9D9D9; border-radius: 50%; margin: 2px; } .top-slide.owl-theme .owl-controls .owl-dot.active span { background: #777; } .panel-reward, .post-options .bdsharebuttonbox { padding-top: 10px; } .page-contribute { width: 100%; margin: 0 auto; } .contribute-item { padding: 20px 18px; margin-bottom: 5px; box-shadow: none; } .contribute-item .form-group .mce-toolbar-grp { padding-right: 95px; } .btn-contribute { display: block; margin: 25px auto; } .modal-footer { text-align: center } #header .js-toggle-message, .socialdropdown .su-dropbox a.bds_more { display: none; } } @media screen and (min-width:768px) and (max-width:991px) { .container { max-width: 750px; width: 100%; padding: 0 5px } .row { margin: 0 -5px } #page-content { padding: 66px 0 0 0 !important; } #header { padding: 0 } #header.navbar-fixed-top { z-index: 99 } #header .logo { text-align: center; letter-spacing: 0; position: relative; margin: 0 auto; height: 66px; line-height: 66px; float: none; padding: 0; } #header .logo a { display: inline-block; height: 66px; width: 190px; background-position: center; } #header .right-nav { top: 12px; right: 10px; color: #333; position: absolute; float: none !important; line-height: normal; } #header .js-toggle-search { padding: 10px; margin: 0; } #header .primary-menu { margin: 0; display: none; } #header .container { margin-top: 0; } #header .burger-menu { display: block; left: 0 } .page-content { margin: 0 0 15px; } .search-form .search-form-inner { height: auto; max-width: 700px; top: 0; padding: 150px 20px 0 } .close-search { top: 35px; right: 40px } .recommend-content, .top-content, .top-slide-three { margin-bottom: 15px } .cat .thumbnail-cat .image { padding: 0 5px } .cat .thumbnail-cat .image .promo-overlay span { padding: 8px 15px 8px 15px; font-size: 14px; } .top-slide .item { padding: 0 5px } .top-slide .owl-item .slider-image { width: 100%; position: relative; overflow: hidden; } .top-slide .owl-item .slider-image a { height: 300px; } .top-slide .owl-item .slider-content .slider-content-box { height: auto; background: none; text-align: center; } .top-slide .owl-item .slider-content .slider-title { width: 100% } .top-slide .owl-item .slider-content .slider-title h2 { font-size: 22px; line-height: 1.6; margin: 0; padding: 0; border-bottom-width: 0; } .top-slide .owl-item .slider-content .slider-title h2::after { height: 0 } .top-slide .owl-item .slider-content .slider-title h2 a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .top-slide-two.owl-carousel { width: 100%; padding: 0 5px } .hot-articles, .top-singles { display: none } .top-slide-two .item .slider-content { height: 300px } .top-slide-three.owl-carousel .owl-item .item { width: auto; } .top-slide-three .slider-content { height: 300px } .top-slide-three .slider-content .slider-title { width: 90% } .top-slide-three .slider-content .slider-title h2 { font-size: 22px; } .top-slide-three .owl-item .slider-content .read-more { margin-top: 0 } .top-slide-three.owl-theme .owl-controls .owl-dots { bottom: 5px; } .top-slide-three.owl-theme .owl-dots .owl-dot span { width: 15px; height: 2px; margin: 5px 2px; } .cat .thumbnail-cat .image .index-cat-box { height: 145px; } .post-nav { position: relative; margin-bottom: 0; box-shadow: none; background: #FFF; height: 50px; overflow: hidden; overflow-x: auto; white-space: nowrap; width: 100%; -webkit-box-pack: justify; } .post-nav::after { content: ""; background-color: #f5f4f4; left: 0; width: 100%; height: 2px; bottom: 0; position: absolute } .post-nav span { position: relative; padding: 0; height: 50px; line-height: 50px; font-size: 14px; border-radius: 0; box-shadow: none; margin: 0 5px 0 20px; color: #748594; border-width: 0; } .post-nav span.current, .post-nav span:hover { background: 0 0; color: #273746; border-width: 0 } .post-nav span.current::after { content: ""; background-color: #273746; left: 0; width: 100%; height: 2px; bottom: 0; position: absolute; z-index: 1 } .breadcrumbs { padding: 10px 25px; margin-bottom: 10px } .breadcrumbs span { font-size: 10px } .article, .pages { width: 100%; padding-left: 5px; padding-right: 5px } .content { margin-bottom: 5px; } .content-box { padding: 15px; } .posts-gallery-content { margin-left: 245px } .post-entry-categories a { padding: 2px 8px } .posts-default-title { margin-bottom: 20px } .posts-default-title h2, .posts-gallery-content h2 { } .posts-default-content .posts-text, .posts-gallery-content .posts-gallery-text { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; } .posts-img img { min-height: auto } .pages-left { width: 100% } .pages-left-menu { text-align: center; padding: 20px 5px } .pages-left-menu li { display: block; border-radius: 2px; border: 1px solid #dadada; float: left; width: 29%; margin: 5px 2%; padding: 0 } .pages-left-menu li a { display: block; font-size: 15px; line-height: 39px; margin: 0 } .sidebar { display: none } .pic-posts, .pic-posts-src { height: 191px } .pic-posts-box .title h2 { font-size: 15px } .pic-posts-box .title .post-views span { height: 22px; line-height: 22px; padding: 3px 8px } .posts-gallery-img { height: 172.49px; width: 229.98px } .page-single .container { padding: 0; width: 100% } .page-single { padding: 0; padding-top: 67px } .page-single .page-content { padding: 20px 25px 25px 25px; margin-bottom: 0; } .page-single .page-title h1 { font-size: 28px; text-align: center } .page-single .page-nav-items { margin-bottom: 0 } .page-nav-items .item li { width: 33.33333% } .page-single .page-title { margin-bottom: 10px; padding: 100px 0; } .tag-clouds li { width: 50% } .one-s-footer { text-align: center } .one-s-footer .footer-copyright, .one-s-footer .social-footer { float: none; display: block } .one-s-footer .social-footer { margin-bottom: 15px } .one-s-footer .social-footer a { float: none; display: inline-block; font-size: 12px; width: 30px; height: 30px; line-height: 30px } .two-s-footer .footer-box .social-footer { float: none; text-align: center; margin-bottom: 20px } .two-s-footer .footer-box .social-footer a { display: inline-block; margin-left: 0; float: none; margin: 0 5px } .copyright-footer, .two-s-footer .footer-box .nav-footer { text-align: center } .two-s-footer .footer-box .nav-footer a { display: inline-block; font-size: 14px } .two-s-footer .links-footer { text-align: center } .two-s-footer .links-footer a { display: inline-block } .likepage { padding: 0; } .like-post { padding: 5px; margin: 0; } .like-post-box .image { height: 150px; } } @media screen and (max-width:767px) { body { font-size: 14px } #header { padding: 0 } #header.navbar-fixed-top { z-index: 99 } #header .logo { text-align: center; letter-spacing: 0; position: relative; margin: 0 auto; height: 66px; line-height: 66px; float: none; padding: 0; } #header .logo a { display: inline-block; width: 150px; height: 66px; background-position: center; } #header .container { margin-top: 0; } #header .right-nav { top: 12px; right: 10px; color: #333; position: absolute; float: none !important; line-height: normal; } #header .js-toggle-search { padding: 10px; margin: 0; } .search-form { top: 0 } .close-search { width: 50px; height: 50px; top: 15px; right: 10px } .close-search .close-bottom, .close-search .close-top { width: 22px; left: 12px; height: 2px } .close-search .close-top { top: 19px } .close-search .close-bottom { bottom: 19px } .search-form .search-form-inner { padding: 75px 20px 0; height: auto; top: 0; border-top: 1px solid #f1efef } .search-form .search-form-box { margin-bottom: 20px } .search-form input { font-size: 15px; line-height: 45px; height: 45px } .search-form button { line-height: 45px; height: 45px; width: 80px } .search-commend { text-align: left } .search-commend h4 { font-size: 18px; margin: 0 0 15px } .search-commend ul li { display: inline-block; margin-bottom: 10px; margin-right: 10px } .search-commend ul li a { padding: 6px 10px; font-size: 12px } #page-content { padding: 66px 0 0 0 !important } .top-content { margin-bottom: 0 } .top-slide-two.owl-carousel { width: 100%; padding: 0 } .top-slide-two .item .slider-content { height: 220px; } .top-slide-two .item .slider-content .slider-cat { top: 20px; left: 20px; } .top-slide-two .item .slider-content .slider-content-item h2 { font-size: 15px } .top-slide-two .item .slider-content .slider-content-item { padding: 25px 20px 45px 20px; text-align: center; } .top-slide-two .item .slider-content .slider-content-item .slider-cat { font-size: 12px; padding: 3px 8px; margin: 0 0 10px; } .top-slide-two.owl-theme .owl-controls .owl-dots { bottom: 10px; } .top-slide-two.owl-theme .owl-controls .owl-dots .owl-dot span { width: 15px; } .recommend-content { margin-bottom: 5px; margin-top: 5px; } .cat { margin-bottom: 0 } .cat .thumbnail-cat { margin-left: 0; overflow-x: auto; white-space: nowrap; overflow-y: hidden; z-index: 0; -webkit-overflow-scrolling: touch; transform: translate3d(0, 0, 0); } .cat .thumbnail-cat .image { margin-bottom: 1px; display: inline-block; white-space: normal; float: none; vertical-align: top; width: 70%; padding: 0 3px 0 0; } .cat .thumbnail-cat .image:last-child { padding: 0 0 0 0; } .cat .thumbnail-cat .image .index-cat-box { height: 135px; margin-left: 0; width: 100%; } .cat .thumbnail-cat .image .istop .cat { top: 15px; left: 15px; } .cat .thumbnail-cat .image .istop .title { top: auto; bottom: 0; padding: 15px; } .cat .thumbnail-cat .image .istop .title span { margin: 0 5px 5px 0; padding: 4px 8px; } .cat .thumbnail-cat .image .istop .title h3 { font-size: 14px; max-height: 38px; } .cat .thumbnail-cat .image .iscat p { top: 35%; font-size: 17px } .cat .thumbnail-cat .image .iscat .modulo_line:before, .cat .thumbnail-cat .image .iscat .modulo_line:after { position: absolute; top: 10px; right: 10px; bottom: 10px; left: 10px; content: ''; -webkit-transition: opacity 0.35s, transform 0.35s; transition: opacity 0.35s, transform 0.35s; } .cat .thumbnail-cat .image .istopic .topic-title h3 { font-size: 14px; } .cat .thumbnail-cat .image .istopic .topic-title .btn-read-topic { font-size: 12px; padding: 6px 12px; } .top-slide { margin-bottom: 1px } .top-slide .item { padding: 0; } .top-slide .owl-item .slider-image { width: 100%; position: relative; overflow: hidden; } .top-slide .owl-item .slider-image a { height: 220px; } .top-slide .owl-item .slider-content .slider-content-box { height: auto; background: none; } .top-slide .owl-item .slider-content .slider-title { width: 100% } .top-slide .owl-item .slider-content .slider-title h2 { margin: 0; padding: 0; border-bottom-width: 0; font-size: 16px; text-align: center; border: 0; max-height: none; } .top-slide .owl-item .slider-content .slider-title h2 a { color: #FFF; } .top-slide .owl-dots { width: 100%; } .top-slide .owl-item .slider-content .slider-title h2:after { height: 0 } .top-slide-three { margin-bottom: 0 } .top-slide-three.owl-carousel .owl-item .item { width: auto } .top-slide-three .slider-content { height: 220px; } .top-slide-three .slider-content .slider-title { width: 95% } .top-slide-three .slider-content .slider-title h2 { font-size: 18px } .top-slide-three .owl-item .item:before{ opacity:.2; } .top-slide-three .owl-item .slider-content .read-more { display: none } .top-slide-three.owl-theme .owl-dots .owl-dot span { width: 15px; margin: 5px 2px } .container { width: auto; padding: 0 } .row { margin-left: 0; margin-right: 0 } #page-content .container { padding: 0 } .topic-bg .container, .topic-bg .container { padding: 80px 0 60px 0 !important; } .topic-bg { margin-bottom: 5px; } .topic-featured { margin-left: 0; overflow-x: auto; white-space: nowrap; overflow-y: hidden; z-index: 0; -webkit-overflow-scrolling: touch; transform: translate3d(0, 0, 0); margin-bottom: 0; padding-bottom: 5px; } .topic-featured .topic-tag { margin-bottom: 1px; display: inline-block; white-space: normal; float: none; vertical-align: top; width: 70%; padding: 0 3px 0 0; } .topic-featured .item { height: 140px; } .topic-featured .item .title { padding: 15px; } .topic-featured .item .tag { right: 10px; top: 10px; } .topic-featured .item .title h2 { text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; font-size: 14px; } .topic-list .topic-tag { padding: 0 5px 5px; } .page-single .container { padding: 0 } .centered-btns_tabs a { width: 6px; height: 6px } .article { padding-left: 0; padding-right: 0; } .search-posts { min-height: 500px } .search-title { margin: 0; padding: 15px } .search-title h3 { font-size: 15px } .breadcrumbs { border-top-width: 0; padding: 10px 25px; margin-bottom: 0; box-shadow: none; background: #FFF; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #a5aeb5; } .breadcrumbs span { font-size: 10px } .content { margin-bottom: 5px; border-bottom: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none !important; } .content-box, .posts-aside, .posts-default .content-box, .posts-image-box, .posts-gallery-box { padding: 12px 12px; } .posts-default-box { padding: 0 0 0; } .post-images-item { margin-bottom: 15px } .post-images-item ul { margin-left: -2px } .post-images-item ul li .image-item { margin-left: 2px; max-height: 88px; } .post-images-item ul li a img { min-height: 88px; } .post-images-item ul.images-style-two { margin-left: -1px } .post-images-item ul li.left { width: 55% } .post-images-item ul li.right { width: 45% } .post-images-item ul.images-style-two li .image-item { margin-left: 1px; max-height: 152px } .post-images-item ul.images-style-two li.left .image-item img { min-height: 152px; height: auto } .post-images-item ul li.right .image-item { height: 75.5px; margin-bottom: 1px } .post-images-item ul li.right .image-item img { position: relative; top: -25px } .post-images-item ul li.right:last-child .image-item { margin-bottom: 0 } .post-entry-categories a { padding: 3px 5px 2px; font-size: 10px; line-height: 1; margin: 3px 5px 3px 0; font-size: 11px; } .posts-aside .post-entry-categories { display: none } .posts-default-img { margin-bottom: 10px; max-height: 150px; } .posts-default-title { margin: 0 0 12px; } .posts-default-title .post-entry-categories { margin-bottom: 8px; } .posts-gallery-img { width: 33.3333%; height: auto; max-height: 89px; } .posts-gallery-img img { width: 100%; height: auto; min-height: 89px; } .posts-gallery-info .i-tgwz { padding: 0 6px; font-size: 10px; line-height: 1.6 } .posts-gallery-content { margin-left: 36%; margin-top: -1px; } .posts-gallery-content h2 { max-height: none; margin-bottom: 0; } .posts-default-title h2 { margin: 0 0 10px 0; border-bottom-width: 0; padding: 0; font-weight: 700; } .posts-default-title h2, .posts-gallery-content h2 { font-size: 15px; line-height: 1.3; font-weight: 700 } .posts-default-title h2:after { height: 0 } .posts-default-content .posts-text { display: none; line-height: 0 } .posts-aside .posts-text { display: block; line-height: normal; margin-bottom: 10px; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden; font-size: 12px; } .posts-gallery-content .posts-gallery-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 5px; display: none } .post-style-tips { bottom: 18px; right: 15px } .post-style-tips a { padding: 4px 6px; font-size: 10px } .posts-gallery-info { bottom: 15px; position: absolute } .posts-default-info ul li.post-author { padding-left: 30px; letter-spacing: .6px; } .posts-default-info ul li .avatar { width: 23px; top: -1px; } .posts-default-info ul li .avatar img { width: 23px; height: 23px; } .posts-default-info ul li { margin: 0 4px 0 0; font-size: 10px; } .posts-default-info ul li a { font-size: 12px; } .posts-cjtz-min { display: block; } .post-timthumb { height: 250px; } .post-timthumb h1 { padding: 20px 18px; font-size: 22px; } .post-title .post_icon span { margin-bottom: 10px; font-size: 12px; margin-right: 5px; } .post-title .post_icon a:link, .post-title .post_icon a:visited { font-size: 10px } .post-title .post_icon .postauthor img { width: 35px; height: 35px; display: inline-block; } .post-nav { position: relative; margin-bottom: 0; box-shadow: none; background: #FFF; height: 45px; overflow: hidden; overflow-x: auto; white-space: nowrap; width: 100%; -webkit-box-pack: justify } .post-nav::after { content: ""; background-color: #f5f4f4; left: 0; width: 100%; height: 2px; bottom: 0; position: absolute } .post-nav span { position: relative; padding: 0; height: 45px; line-height: 45px; font-size: 14px; border-radius: 0; box-shadow: none; margin: 0 5px 0 12px; color: #748594; border-width: 0; } .post-nav span.current, .post-nav span:hover { background: 0 0; color: #273746; border-width: 0 } .post-nav span.current:after { content: ""; background-color: #273746; left: 0; width: 100%; height: 2px; bottom: 0; position: absolute; z-index: 1 } .state-new { padding: 1px 5px 2px; margin-right: 5px; font-size: 12px } .link-items li { width: 50% } .readmore-a { float: none; padding: 8px 22px } .button.gray-outline { border: 1px solid #dfdfdf } .post-title .title { margin-bottom: 30px; font-size: 22px; } .next-prev-posts .next-post, .next-prev-posts .prev-post { width: 100% } .next-prev-posts .prev-post { margin-bottom: 2px } .next-prev-posts a.has-background { padding: 0 20px; height: 100px } .next-prev-posts a.has-background h4 { font-size: 14px; font-weight: 600; } .next-prev-posts a.has-background span { font-size: 12px; color: #cecece; } .next-prev-posts a.next { text-align: left } .article-title { margin: 0 auto 50px; padding-top: 10px } .article-title h3 { width: 60%; font-size: 22px } .content-pic { margin-left: -15px } .pic-posts-box { margin-left: 15px } .pic-posts, .pic-posts-src { width: 100%; height: 200px } .pic-posts { margin-bottom: 5% } .pages { width: 100% } .pages-left { width: 100% } .pages-left-menu { text-align: center; padding: 20px 5px } .pages-left-menu li { display: block; border: 1px solid #dadada; padding: 0; display: block; float: left; width: 45%; margin: 5px 2% } .pages-left-menu li a { display: block; font-size: 15px; line-height: 39px; margin: 0; border-radius: 2px } .post { padding: 20px 22px 22px 22px; margin-bottom: 5px; box-shadow: none !important; } .post-title { margin: 0 0 30px; padding: 0 0 20px; } .post-content { margin: 0 0 3% 0 } .post-content p.post-abstract { padding: 3%; font-size: 12px } .post-content .post-image { margin-left: -22px; margin-right: -22px; } .post-content img { margin-bottom: 15px } .post-content h5 { padding: 10px 0; margin-bottom: 18px; color: #555; font-weight: 700 } .post-content ol, .post-content ul { margin: 0 0 18px 38px; padding: 0 } .navigation .page-numbers { padding: 4px 12px; font-size: 12px; border-radius: 2px } .post-options .btn-publicity { display: block; margin: 0 0 20px } .warp-post-embed { padding: 15px; margin: 0 0 15px; } .warp-post-embed .embed-bg { width: 100px; height: 80px; margin-left: 6px } .warp-post-embed .embed-content { margin-right: 110px; } .warp-post-embed .embed-content h2 { font-size: 15px; font-weight: 700; margin: 10px 0; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; display: -webkit-box; -webkit-line-clamp: 2; padding: 0; } .post-options { padding: 0; text-align: center; } .post-options .btn-likes { border: 1px solid rgba(153, 153, 153, 0.31); color: #555; margin-bottom: 30px; } .paydropdown { float: none; display: inline-block; } .su-dropdown .pay-author { width: 100px; } .su-dropdown .pay-author span { display: inline-block } .paydropdown .su-dropbox { left: -29px; } .socialdropdown { float: none; } .socialdropdown .su-dropbox { position: relative; opacity: 1; left: auto; z-index: 1; width: 100%; box-shadow: none; border: 0; margin-bottom: 30px; padding: 0; background: none; top: auto; } .socialdropdown .su-dropbox a { display: inline-block; font-size: 20px; width: 50px; height: 50px; border: 1px solid #DDD; line-height: 50px; border-radius: 100%; text-align: center; padding: 0; margin: 0 5px; } .socialdropdown .su-dropbox a::before { margin-right: 3px; margin: 0; padding: 0 } .su-dropdown .su-dropbox::before, .su-dropdown .su-dropbox::after { border-color: transparent; } .next-prev-posts { padding: 0 } .related-post ul { margin-right: 0 } .related-post li { width: 100%; margin-bottom: 15px } .related-post li .item { margin-right: 0 } .related-post li .item a { width: 100%; height: auto; float: left } .related-post li .item a img { width: 108.33px; height: 81px; float: left } .related-post li .item a .overlay, .related-post li .item a:hover .overlay { opacity: 0 } .related-post li .item h4 { position: relative; bottom: auto; left: auto; right: auto; background: 0 0; color: #273746; margin-left: 120px; font-size: 15px; line-height: 1.3; font-weight: 700; padding: 0 } .related-post li .item h4 span { position: relative; overflow: hidden; height: 38px; display: block } .related-post, .comments-box, .respond-box { padding: 25px 22px 22px 22px; margin-bottom: 5px; -webkit-border-radius: 0; -webkit-background-clip: padding-box; -moz-border-radius: 0; -moz-background-clip: padding; border-radius: 0; overflow: hidden; box-shadow: none !important; } .related-post h3, .comments-title { margin: 0 0 30px 0; font-size: 18px; padding-bottom: 15px; } .related-post h3::after, .comments-title::after { width: 36px; } .commentlist li { margin-left: 45px; padding-bottom: 5px; margin-bottom: 5px } .commentlist li .comment-avatar { left: -45px } .commentlist li .comment-avatar .avatar, .commentlist li ul.children li .comment-avatar .avatar { width: 30px; height: 30px } .commentlist li .comment-text { padding: 5px 0 } .commentlist li .comment-text p { font-size: 14px } .commentlist li ul.children li { padding: 8px } .commentlist li ul.children li .comment-body { margin: 0 0 0 45px; padding: 0 } #comment-author-info .comment-md-3 { width: 100%; padding: 0 } #commentform #author, #commentform #email, #commentform #url { margin-bottom: 10px; padding: 8px 14px 8px 54px } #comment-author-info label { position: absolute; top: 15px; left: 10px } #commentform .form-submit .facetoggle { display: none } #commentform .form-submit input[type=submit] { width: 100%; display: block; padding: 12px 0; font-size: 12px } #comment-author-info p { width: 100% } #commentform .form-submit .comment-form-smilies { display: block; position: relative; width: auto; margin-top: 0; border-width: 0; margin-bottom: 20px; box-shadow: none; opacity: 1; z-index: 1; } #commentform .form-submit .comment-form-smilies::before, #commentform .form-submit .comment-form-smilies::after { display: none } #commentform .form-submit .comment-form-smilies .smilies-box { padding: 0 } .one-s-footer { text-align: center } .one-s-footer .footer-copyright, .one-s-footer .social-footer { float: none; display: block } .one-s-footer .social-footer { margin-bottom: 15px } .one-s-footer .social-footer a { float: none; display: inline-block; font-size: 12px; width: 30px; height: 30px; line-height: 30px } .one-s-footer .footer-copyright { font-size: 14px } .two-s-footer .footer-box .social-footer { float: none; text-align: center; margin-bottom: 20px } .two-s-footer .footer-box .social-footer a { display: inline-block; float: none } .copyright-footer, .two-s-footer .footer-box .nav-footer { text-align: center } .copyright-footer { padding: 0 25px } .copyright-footer p { font-size: 12px; } .two-s-footer .footer-box .nav-footer a { display: inline-block; font-size: 14px; margin: 2px 5px } .two-s-footer .links-footer { text-align: center } .two-s-footer .links-footer a { display: inline-block } .page-single { padding: 0; padding-top: 66px; } .page-single .page-content { padding: 10px; margin-bottom: 0; margin: 0; padding: 20px 25px 25px 25px; } .page-single .page-title h1 { font-size: 22px; text-align: center; } .page-single .page-dec p { font-size: 14px; } .page-single .page-nav-items { margin-bottom: 0 } .page-nav-items .item h2 { font-size: 14px } .page-nav-items .item h2 span { height: 35px; line-height: 35px } .page-nav-items .item li { width: 100%; height: auto; margin-top: 0; font-size: 12px } .page-nav-items .item li .nav-item { margin: 5px 0 } .page-nav-items .item li .nav-item a { font-size: 15px } .page-single .page-title { margin-bottom: 0; padding: 100px 0 0; height: 250px; } .mod-archive { padding-top: 5px } .mod-archive-list { padding-top: 0; padding-bottom: 20px; padding-left: 20px } .mod-archive-list li { line-height: 1.5; margin-bottom: 5px } .mod-archive-list li span, .mod-archive-time { font-size: 10px } .mod-archive-list li a { font-size: 12px; display: block } .mod-archive-list li span { float: none; margin-left: 10px } .likepage { padding: 5px } .like-post { padding: 0 0 2px 1px; margin: 0; } .like-post-box .image { height: 130px; } .tag-clouds li { width: 100%; height: auto } #ajax-load-posts { padding: 0 12px; } #ajax-load-posts a, #ajax-load-posts button { margin: 10px 0 15px 0; font-size: 14px; height: auto; width: 100%; line-height: 1; padding: 10px 30px; } .to-top { height: 35px; width: 35px; line-height: 35px; opacity: .8; filter: alpha(opacity=80); -webkit-filter: alpha(opacity=80); -ms-filter: alpha(opacity=80); -moz-filter: alpha(opacity=80); right: 8px !important } .f-weixin-dropdown .close_tip { top: 7%; right: 7%; font-size: 30px; color: #e2e2e2 } .f-weixin-dropdown .tooltip-weixin-inner h3 { font-size: 25px } .f-weixin-dropdown .qcode img { width: 80%; height: auto } .posts-top-cjtz-mini, .posts-footer-cjtz-mini { display: block; } .close-search, .close-weixin { top: 1%; right: 1%; } .butterBar { margin-left: 5%; width: 90%; left: 0; } .top-slide .owl-dots, .top-slide-two .owl-dots, .top-slide-three .owl-dots{ bottom: 5px; } .top-slide-two .owl-dots button.owl-dot span, .top-slide-three .owl-dots .owl-dot span{ width: 15px; margin: 2px 2px; } #header .logo i, #header .primary-menu ul, #header .search-box, #header .social-profiles, #header p, .author-a, .header-fixed #header .primary-menu, .ico-eye, .ico-like, .navigation .dots, .navigation a, .pic-posts-box a .title .post-views, .posttime-a, .sidebar, .one-s-footer .link, .ico-cat, .ico-like, .ico-eye, .su-dropdown .J_showAllShareBtn, .warp-post-embed .embed-content p, .posts-default-content p, .posts-gallery-content p, #commentform .form-submit button, .collapse, .paydropdown, .socialdropdown .su-dropbox a span, .posts-cjtz { display: none } } @media screen and (max-width:480px) { body.out { -webkit-transform: translate3d(-100vw, 0, 0) translate3d(74px, 0, 0); transform: translate3d(-100vw, 0, 0) translate3d(74px, 0, 0); } body.off-canvas-nav-left.out { -webkit-transform: translate3d(100vw, 0, 0) translate3d(-74px, 0, 0); transform: translate3d(100vw, 0, 0) translate3d(-74px, 0, 0); } .navbar-collapse { right: calc((100vw - 74px) * -1); width: calc(100vw - 74px); } body.off-canvas-nav-left .navbar-collapse { left: calc((100vw - 74px) * -1); } }