/* Responsive CSS Style */ @media only screen and (max-width: 1119px) { .breadcrumbs.is_zhuanti h1 { top: 20px; } #featured-grid .thumbnail-link img { height: auto; } .primary-block-7 .post-big .entry-meta { display: none; } } @media only screen and (min-width: 1080px) and (max-width: 1119px) { .container { width: 1060px; } .sf-menu li a { font-size: 14px; padding: 0 10px; } #primary { width: 748px; } #featured-slider, #featured-slider.slider-with-grid { float: none; width: 100%; margin-bottom: 10px; } #featured-grid { float: none; width: 100%; margin-bottom: 12px; } #featured-grid ul li { float: left; width: 32.33333%; margin-right: 1.5%; margin-bottom: 0; } #featured-grid ul li:last-child { margin-right: 0; } #featured-grid .thumbnail-link img { height: auto; } .content-list .thumbnail-link { width: 210px; } .content-list .entry-title { margin-bottom: 10px; } .content-list .entry-summary { font-size: 14px; line-height: 1.6; } } @media only screen and (min-width: 960px) and (max-width: 1079px) { .container { width: 940px; } #primary-menu { margin-left: 10px; } .sf-menu li a { font-size: 14px; padding: 0 10px; } .header-right li { font-size: 14px; } #primary { float: none; width: 100%; } #secondary { display: none; } #featured-slider, #featured-slider.slider-with-grid { float: none; width: 100%; margin-bottom: 10px; } #featured-grid { float: none; width: 100%; margin-bottom: 12px; } #featured-grid ul li { float: left; width: 32.33333%; margin-right: 1.5%; } #featured-grid ul li:last-child { margin-right: 0; } #featured-grid .thumbnail-link img { height: auto; } } /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) { body { background-color: #fff; } .container { width: 97%; margin-left: auto; margin-right: auto; } .header-toggles { display: block; } .top-bar { display: none; } .bx-controls-direction { display: none; } .site-header { height: auto; box-shadow: none; } .site-header .header-search-icon { top: -10px; } .site-header .search-icon { margin-right: 0; } .search-icon { display: block; } .site-branding { height: 60px; } .site-branding #logo { height: 60px; } .site-branding img { max-height: 54px; } .site-title { line-height: 60px; } .site-desc { font-size: 12px; top: 16px; } .header-right { position: absolute; top: 0; right: 10px; line-height: 60px; } .header-search { background-color: #f5f5f5; border: none; border-radius: 0; display: none; width: 100%; height: 38px; top: 60px; left:1%; margin-left:0px; } .header-search .search-input { width: 90%; } .header-search .search-input:focus { background-color: #f0f0f0; } .header-search .search-submit { border-radius: 0; top: 0; right: 0; height: 38px; line-height: 38px; } #primary-menu { float: none; margin: 0 !important; padding: 9px 0; } #primary-menu:after { clear: both; content: " "; display: block; } #primary-menu .fa { display: none; } .sf-menu { clear: both; float: none; } .sf-menu ul { display: none !important; } .sf-menu li { line-height: 1.5; } .sf-menu li a, .sf-menu li a:hover { color: #fff !important; } .sf-arrows .sf-with-ul:after { display: none !important; } #primary { float: none; width: 100%; } .sidebar { display: none; } #featured-slider, #featured-slider.slider-with-grid { float: none; width: 100%; margin-bottom: 10px; } #featured-grid { float: none; width: 100%; margin-bottom: 0; } #featured-grid ul li { float: left; width: 32.33333%; margin-right: 1.5%; } #featured-grid ul li:last-child { margin-right: 0; } .home-zhuanti-section { margin-bottom: 10px; } .site-content { margin-top: 10px; padding-bottom: 10px; } #secondary { display: none; } .single-breadcrumbs { background-color: transparent; border: none; margin-bottom: 0; } .footer-content { margin-bottom: 10px; } .icon-contact, .icon-weixin, .icon-weibo { display: none; } .bottom-right { bottom: 5px; } .bottom-right .bottom-icon { border: none; box-shadow: 0 0 1px rgba(0, 0, 0, 0.3); } #site-bottom { text-align: center; } #site-bottom .footer-left { float: none; width: 100%; } .primary-block-2 .post-small { padding-right: 0; } .primary-block-2 .post-small .entry-meta { display: none; } .primary-block-3 .post-small { padding-right: 0; } .primary-block-3 .post-small .entry-meta { display: none; } .primary-block-6 .post-small { max-height: 100%; padding-right: 0; } .primary-block-6 .post-small .entry-meta { display: none; } } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { #primary-nav.tablet_menu_col_1 ul li { width: 100%; } #primary-nav.tablet_menu_col_2 ul li { width: 50%; } #primary-nav.tablet_menu_col_3 ul li { width: 33.3333%; } #primary-nav.tablet_menu_col_4 ul li { width: 25%; } #primary-nav.tablet_menu_col_5 ul li { width: 20%; } #primary-nav.tablet_menu_col_6 ul li { width: 16.6666%; } #primary-nav.tablet_menu_col_7 ul li { width: 14.2857%; } #primary-nav.tablet_menu_col_8 ul li { width: 12.5%; } .site-footer { margin: 0; } #featured-grid .entry-meta, .popular-content .entry-meta, .related-content .entry-meta { display: none; } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { .home-header-ad { margin-top: 10px; margin-bottom: -2px; } #primary-nav.phone_menu_col_1 ul li { width: 100%; } #primary-nav.phone_menu_col_2 ul li { width: 50%; } #primary-nav.phone_menu_col_3 ul li { width: 33.3333%; } #primary-nav.phone_menu_col_4 ul li { width: 25%; } #primary-nav.phone_menu_col_5 ul li { width: 20%; } #primary-nav.phone_menu_col_6 ul li { width: 16.6666%; } #primary-nav.phone_menu_col_7 ul li { width: 14.2857%; } #primary-nav.phone_menu_col_8 ul li { width: 12.5%; } .home-zhuanti-list { padding: 10px 10px 0 10px; } .ribbon { display: none !important; } .breadcrumbs, .recent-heading, .zhuanti-heading { padding: 0 10px; } .content-ad { padding: 10px; } .content-list .entry-header { margin-bottom: 5px; } .content-list .hentry { padding: 10px; } .content-list .entry-title { line-height: 1; } .content-list .entry-category { display: none; } .single-breadcrumbs { padding-bottom: 0; } .single #primary .entry-author { display: none; } .single #primary .entry-footer .entry-tags { float: none; } .single #primary .entry-footer .entry-tags .tag-links span { display: none; } .single #primary .entry-footer .entry-footer-right { float: none; margin-top: 10px; } .entry-content p { text-indent: 0 !important; } .custom-share:before, .related-content ul li .entry-meta { display: none; } .site-footer { margin: 0; } .footer-area { float: none; width: 100%; padding: 0; } .footer-area:after { clear: both; content: " "; display: block; } .error-404 .page-content .search-form input.search-field { width: 200px; } .breadcrumbs.is_zhuanti { padding: 10px; } .breadcrumbs.is_zhuanti h1 { top: 10px; left: 10px; } .footer-partners .partner-title, .friend .friend-title { padding-right: 10px; padding-left: 20px; } .footer-partners .partner-title:before, .friend .friend-title:before { left: 10px; } .friend-nav { padding: 0 0 0 10px; } .primary-block-1 .post-big { float: none; width: 100%; margin: 0 0 10px 0; max-height: 120px; overflow: hidden; } .home-full-area .primary-block-4 .post-big, .home-full-area .primary-block-5 .post-big, .primary-block-4 .post-big, .primary-block-5 .post-big { width: 49%; } .home-full-area .primary-block-4 .post-big:nth-of-type(4n), .home-full-area .primary-block-5 .post-big:nth-of-type(4n), .primary-block-4 .post-big:nth-of-type(4n), .primary-block-5 .post-big:nth-of-type(4n) { margin-right: auto; } .home-full-area .primary-block-4 .post-big:nth-of-type(4n+1), .home-full-area .primary-block-5 .post-big:nth-of-type(4n+1), .primary-block-4 .post-big:nth-of-type(4n+1), .primary-block-5 .post-big:nth-of-type(4n+1) { clear: auto; } .home-full-area .primary-block-4 .post-big:nth-of-type(2n), .home-full-area .primary-block-5 .post-big:nth-of-type(2n), .primary-block-4 .post-big:nth-of-type(2n), .primary-block-5 .post-big:nth-of-type(2n) { margin-right: 0; } .home-full-area .primary-block-4 .post-big:nth-of-type(2n+1), .home-full-area .primary-block-5 .post-big:nth-of-type(2n+1), .primary-block-4 .post-big:nth-of-type(2n+1), .primary-block-5 .post-big:nth-of-type(2n+1) { clear: left; } .primary-block-7 .post-big { padding: 10px; } .primary-block-7 .post-big img { float: none; width: 100%; margin: 0 0 10px 0; } .home-full-area .primary-block-7 .post-big { width: 50%; } .home-full-area .primary-block-7 .post-big:nth-of-type(3n) { border-right: 1px solid #f0f0f0; } .home-full-area .primary-block-7 .post-big:nth-of-type(3n+1) { clear: none; } .home-full-area .primary-block-7 .post-big:nth-of-type(1), .home-full-area .primary-block-7 .post-big:nth-of-type(2) { border-top: none; } .home-full-area .primary-block-7 .post-big:nth-of-type(3) { border-top: 1px solid #f0f0f0; } .home-full-area .primary-block-7 .post-big:nth-of-type(2n) { border-right: none; } .home-full-area .primary-block-7 .post-big:nth-of-type(2n+1) { clear: clear; } .primary-block-10 .post-big .entry-title { font-size: 1em; } .primary-block-10 .post-big .entry-meta { display: none; } .primary-block-10 .post-big .entry-summary { display: table; font-size: 0.9em; line-height: 1.5; } .primary-block-6 { margin-left: 0; margin-right: 0; } .primary-block-3 .my-block, .my-block.ztbb_grid_1_2, .my-block.ztbb_grid_1_3 { float: none; width: 100%; padding: 0; margin-bottom: 12px; } .primary-block-3 .my-block:last-child, .my-block.ztbb_grid_1_2:last-child, .my-block.ztbb_grid_1_3:last-child { margin-bottom: 0; } .primary-block-9 .tab-content .entry-title { float: none; width: 100%; } .content-block .block-list, .primary-block-2 .block-content .posts-wrap, .primary-block-3 .block-content .posts-wrap, .primary-block-6 .block-content .posts-wrap, .primary-block-10 .post-big { padding: 10px; } .primary-block-9 .tab-content .entry-title { padding: 0 10px 0 20px; } .primary-block-9 .tab-content .entry-title:before { left: 10px; } .footer-content { display: none; } .friend .friend-nav { padding-left: 0; } .friend ul li { width: 49%; margin: 0 2% 4px 0; padding: 0; } .friend ul li:nth-of-type(2n) { margin-right: 0; } .mini-page { width: 100%; } .mini-page ul li { padding-right: 0; } .mini-page ul li em { display: none; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) { .content-list .thumbnail-link { width: 32%; margin-right: 15px; } .content-list .entry-title { font-size: 1.1em; line-height: 1.4; } .content-list .entry-meta { display: none; } .content-list .entry-meta .entry-date, .content-list .entry-meta .entry-category { display: none; } .content-list .gallery-list { margin: 10px 0; } .content-list .entry-summary { font-size: 13px; margin-top: 0; } .single .site-main { padding: 20px; } } /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { .no-mobile-desc { display: none; } .site-title { font-size: 24px; } .sf-menu li a { font-size: 14px; } #featured-slider, #featured-slider.slider-with-grid { margin-bottom: 6px; } #featured-slider .bx-wrapper .bx-pager, #featured-slider.slider-with-grid .bx-wrapper .bx-pager { right: 10px; bottom: 9px; } #featured-slider .featured-slide .entry-header, #featured-slider.slider-with-grid .featured-slide .entry-header { height: 36px; } #featured-slider .featured-slide .entry-title, #featured-slider.slider-with-grid .featured-slide .entry-title { font-size: 0.95em; padding: 0 70px 0 8px; line-height: 36px; } #featured-slider { margin-bottom: 10px; } #featured-grid .entry-title { font-size: 12px; } #site-bottom { padding: 10px; } .content-ad { padding: 12px 0; } .content-list .hentry { padding: 12px 0 12px; margin-bottom: 0; } .content-list .hentry:hover { background-color: transparent; } .content-list .thumbnail-link { width: 32%; margin: 0 10px 0 0; } .content-list .entry-header { margin-bottom: 0; } .content-list .entry-title { font-size: 1em; font-weight: normal; line-height: 1.5; margin-bottom: 0; } .content-list .gallery-list { margin: 10px 0 5px 0; } .content-list .entry-summary, .content-list .entry-date, .content-list .entry-category { display: none; } .content-list .entry-meta { font-size: 12px; } .content-list .entry-meta .entry-category, .content-list .entry-meta .entry-like, .content-list .entry-meta .entry-comment { margin-left: 0; margin-right: 10px !important; } .breadcrumbs.is_zhuanti { margin: 0; padding: 0; } .breadcrumbs.is_zhuanti h1 { font-size: 1em; padding: 0 10px; height: 30px; line-height: 30px; left: 0; top: 0; } .recent-heading, .breadcrumbs.no_zhuanti { border: 1px solid #eaeaea; } .home-zhuanti-list { padding: 10px 10px 0 10px; } .site-main { border: none; } .zhuanti-heading .desc, .friend .friend-desc, .author-box .avatar, .related-content .entry-meta, .single-breadcrumbs-title { display: none; } .custom-share { display: none !important; } .pagination { border: none; border-top: 1px solid #eaeaea; } .pagination .page-numbers { font-size: 13px; padding: 0 6px; height: 30px; line-height: 30px; } .page-title, .single h1.entry-title, .page h1.entry-title { font-size: 1.2em; margin-bottom: 10px; } .single .site-main, .page .site-main { padding: 10px; } .single-breadcrumbs { background-color: #f9f9f9; padding: 8px 10px; margin: 10px 1.5% 0; } .single #primary .entry-header { margin-bottom: 10px; } .single .gallery-slider li img { margin-bottom: 0; } .single .gallery-slider li .image-desc { background-color: #333; position: static; padding-left: 3%; padding-right: 3%; width: 94%; } .bx-wrapper .bx-controls-direction { display: none; } .entry-tags { float: none; text-align: center; } .entry-tags span span { display: none; } .entry-tags .tag-links a { font-size: 12px; } .custom-share { float: none; } #comments .comment-metadata, .comment-respond .comment-metadata { display: none; } .comment-form .comment-form-author, .comment-form .comment-form-email, .comment-form .comment-form-url { width: 100%; margin: 0 0 10px 0; } .modal-content { width: 290px; padding-left: 15px; padding-right: 15px; } .entry-source, .footer-partners { display: none; } .friend { padding-bottom: 0; } .footer-content { padding: 0 0 10px 0; } .friend-nav li { margin-right: 10px; } #site-bottom .footer-nav li { margin-right: 10px; } .bottom-content { padding: 30px; } .bottom-content h3 { font-size: 24px; } .bottom-content .bottom-buttons a { margin: 0 5px; } .primary-block-10 .post-big .thumbnail-link { display: block; max-height: 120px; margin-bottom: 10px; overflow: hidden; } .primary-block-10 .post-big img { float: none; width: 100%; margin: 0; } .primary-block-10 .post-big .entry-title { font-size: 1em; } .primary-block-10 .post-big .entry-meta { display: block; } .primary-block-10 .post-big .entry-summary { display: table; font-size: 0.9em; line-height: 1.5; } } @media only screen and (max-width: 359px) { .content-list .entry-meta .entry-like { display: none; } }