html { overflow-x: hidden; } @media screen and (max-width:1230px) { * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .container { width: 100%; padding: 0 2%; } .post-item { padding: 25px; } .post-large-image { padding: 25px; } .page-content, .single_post { padding: 25px; } .fullwidth-content-area { padding: 25px; } .sidebar .widget { padding: 25px; } .site-content { padding-top: 30px; } .empty-magazine-homepage, .tc_magazine_posts_lists, .tc-magazine-posts-grid, .tc-magazine-posts-columns, .tc_magazine_posts_boxed { padding: 25px; } .post-item .thumbnail { margin-right: 18px; } .page-header .archive-title, .page-header .page-title { padding-left: 25px; } .breadcrumb { margin-bottom: 30px; padding-left: 25px; } .back-to-top { width: 40px; height: 40px; line-height: 40px; } .back-to-top i { width: 40px; height: 40px; line-height: 40px; } .ads-468x60 { margin: 0 0 30px 0; } } @media screen and (max-width: 970px) { .site-branding { float: none; text-align: center; } span.menu-toggle { position: relative; color: #000; padding: 14px 0; line-height: 24px; font-size: 14px; display: block; cursor: pointer; } span.menu-toggle:before { position: absolute; content: "\f0c9"; font-family: FontAwesome; display: inline-block; right: 0; } .custom-logo-link { float: none; margin-right: 0; display: block; } .site-title { margin-top: 0; } .main-navigation ul { display: none; } .main-navigation { display: none; } #mobile-menu-wrapper { position: fixed; top: 0; right: 0; width: 60%; height: 100%; min-height: 100%; max-height: 100%; overflow: scroll; background: #fff; -ms-transform: translate(100%,0); -webkit-transform: translate(100%,0); transform: translate(100%,0); -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; overflow-x: hidden; z-index: 9; } #page { -webkit-transition: -webkit-transform 500ms ease; transition: transform 500ms ease; position: relative; top: 0; } .mobile-menu-active #mobile-menu-wrapper { -ms-transform: translate(0,0); -webkit-transform: translate(0,0); transform: translate(0,0); } .mobile-menu-active #page { -ms-transform: translate(-60%,0); -webkit-transform: translate(-60%,0); transform: translate(-60%,0); position: fixed; top: 0; width: 100%; } #mobile-menu-wrapper.wpadminbar-active { top: 45px; } .top-nav { display: none; } #mobile-menu-wrapper .arrow-menu-toggle { position: absolute; right: 0; top: 0; color: #222; line-height: 35px; border-left: 1px solid #e5e5e5; width: 34px; text-align: center; } .arrow-main-menu { display: none; } #toggle-navbar .arrow-menu{ display: none; } .mobile-only, .arrow-menu { display: block; } .sidebar .arrow-menu { display: none; } .secondary-menu .category-navigation { display: none; } .secondary-menu .category-navigation li .arrow-main-menu { display: none; } #mobile-menu-wrapper ul li { width: 100%; display: block; line-height: 24px; position: relative; border-bottom: 1px solid #f0f0f0; } #mobile-menu-wrapper ul ul li:last-child { border-bottom: 0; } #mobile-menu-wrapper ul ul { border-top: 1px solid #f0f0f0; } #mobile-menu-wrapper .arrow-menu { position: absolute; right: 0; top: 0; color: #000; line-height: 44px; border-left: 1px solid #f0f0f0; width: 44px; font-size: 14px; text-align: center; } #mobile-menu-wrapper ul li a { color: #333; font-size: 16px; display: inline-block; width: 100%; padding: 10px; } #mobile-menu-wrapper ul ul li a { padding-left: 15px; } #mobile-menu-wrapper ul ul ul li a { padding-left: 20px; } .right-post .post-thumbnail, .left-post .post-thumbnail { width: 47.9042%; } } @media screen and (max-width: 880px) { body, body > div { font-size: 18px; font-size: 1.1rem; } .right-post .post-thumbnail, .left-post .post-thumbnail { width: inherit; } .content-area { width: 100%; max-width: 100%; margin-bottom: 30px; } .sidebar { width: 100%; float: none; margin-left: auto; margin-right: auto; } .left-sidebar .sidebar { float: none; } .sticky-social { display: none; } #load-more-wrap, .pagination, .posts-navigation { margin-bottom: 0; } .page-content, .single_post { margin: 0; } .single_post .entry-footer { margin-bottom: 25px; } .author-bio { padding: 30px 0; } .post-large-image:last-child, .post-item:last-child { margin-bottom: 0; } } @media screen and (max-width: 800px) { .footer-widget { padding-left: 15px; padding-right: 15px; } .col-3 { width: 48%; max-width: 100%; margin-right: 4%; } .col-3:nth-child(even) { margin-right: 0; } .col-3.last { clear: left; } } @media screen and (max-width: 767px) { .post-item { padding: 20px; } .page-header .archive-title, .page-header .page-title { padding-left: 20px; } .breadcrumb { padding-left: 20px; padding-right: 20px } .tc-magazine-posts-columns, .tc_magazine_posts_boxed { padding: 25px 20px; } .post-large-image { padding: 20px; } .fullwidth-content-area, .page-content, .single_post { padding: 20px; } .post-item .thumbnail { width: 40%; } .related-posts ul.related li { margin-right: 5%; } } @media screen and (max-width: 660px) { .widget-magazine-posts .large-post .entry-content { display: none; } .magazine-posts-boxed-horizontal .large-post .post-thumbnail { margin-right: 15px; } .magazine-posts-columns-post-list .large-post .post-thumbnail, .magazine-posts-boxed-vertical .large-post .post-thumbnail { width: 48%; float: left; margin-top: 6px; margin-right: 15px; margin-bottom: 0; } .magazine-posts-boxed-vertical .large-post { width: 100%; float: none; margin-bottom: 28px; } .magazine-posts-boxed-vertical .small-posts { width: 100%; float: none; } .magazine-posts-columns { width: 100%; float: none; margin-right: 0; margin-bottom: 40px; } .magazine-posts-columns:last-child { margin-bottom: 0; } .right-post .post-thumbnail, .left-post .post-thumbnail { width: 47.9042%; } .left-post .entry-content, .right-post .entry-content { display: none; } } @media screen and (max-width: 600px) { .comment-list .children { padding-left: 14%; } } @media screen and (max-width: 480px) { .container { padding: 0 5%; } .site-content { padding-top: 20px; } .post-item .thumbnail { width: 100%; margin: 0 0 20px 0; } .featured-thumbnail img { width: 100%; } .post-item .entry-content { overflow: visible; float: left; margin-bottom: 20px; } .single-title { font-size: 32px; line-height: 1.2; } .comments-title { font-size: 24px; padding: 20px 25px; } .pagination .nav-links span, .pagination .nav-links a { margin-right: 5px; } .related-posts ul.related li { width: 100%; margin-right: 0; } .related-posts ul.related li .thumbnail { width: 40%; margin-right: 10px; margin-bottom: 0; } .comment-meta .vcard img { width: 60px; } .comment-meta { width: 100%; margin-bottom: 5px; float: left; } .comment-content { overflow: visible; display: inline-block; } .comments-area .reply { padding-left: 10px; } #comments .avatar { margin-right: 10px; } .comment-metadata { margin-top: 5px; } .bio-avatar { width: 24%; margin-right: 20px; } .bio-name { font-size: 20px; } .bio-desc { overflow: visible; } .magazine-posts-boxed-horizontal .large-post .post-thumbnail { width: 100%; float: none; margin-top: 0; margin-right: 0; margin-bottom: 10px; } .widget-magazine-posts .large-post .entry-content { display: block; } .magazine-posts-boxed-horizontal .medium-posts .medium-post { width: 100%; float: none; margin-right: 0; margin-bottom: 28px; box-sizing: border-box; } .magazine-posts-boxed-horizontal .medium-posts .medium-post:last-child { margin-bottom: 0; } .magazine-posts-columns-post-list .large-post .post-thumbnail, .magazine-posts-boxed-vertical .large-post .post-thumbnail { width: 100%; float: none; margin-top: 0; margin-right: 0; margin-bottom: 10px; } .magazine-posts-boxed-horizontal .medium-posts .post-thumbnail { width: 30%; float: left; margin-right: 10px; margin-bottom: 0; } .medium-posts .entry-title a { font-size: 18px; } .post-thumbnail img { width: 100%; } .col-3 { width: 100%; margin-right: 0; float: none; } .col-2 { width: 100%; margin-right: 0; float: none; } .right-post .post-thumbnail, .left-post .post-thumbnail { width: 100%; float: none; margin-top: 0; margin-bottom: 10px; } .left-post .entry-content, .right-post .entry-content { display: block; } .right-post .post-thumbnail { margin-left: 0; } .tc_magazine_posts_lists .left-post .post-content, .tc_magazine_posts_lists .right-post .post-content { overflow: visible; } }