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;
}
}