@import 'variables';
@import 'mixins';

@include wide-laptop-landscape {
	.qodef-blog-holder{
		&.qodef-masonry-full-width{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 23.5%;
			}
		}

		&.qodef-blog-type-masonry {
			article {
				&.format-quote,
				&.format-link {
					.qodef-post-text {
						padding: 40px 20px 30px;
					}
					.qodef-post-mark{
						width: 40px;
					}
				}
			}
		}
	}
}

@include ipad-landscape {
	.qodef-blog-holder{
		&.qodef-masonry-full-width.qodef-has-sidebar{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 48%;
			}
		}

	}

	.qodef-blog-holder {
		&.qodef-blog-type-narrow {
			article,
            .qodef-pagination {
				width:80%;
			}
		}
	}

    .qodef-blog-holder {
        &.qodef-blog-type-gallery {
            .qodef-post-title {
                padding: 0;
            }
        }
    }
}

@include ipad-portrait {
	.page-template-blog-masonry-full-width {
		.qodef-column2 {
			.qodef-sidebar {
				margin: 7%;
			}
		}

	}
	.qodef-blog-holder{
		&.qodef-blog-type-masonry{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 49%;
			}
		}
		&.qodef-masonry-full-width{
			&.qodef-has-sidebar {
				margin: 7%;
				article,
				.qodef-blog-masonry-grid-sizer{
					width: 47.5%;
				}
			}
		}

        &.qodef-blog-type-gallery {
            article,
            .qodef-blog-gallery-grid-sizer {
                width: 50%;
            }
        }
		&.qodef-masonry-full-width{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 49%;
			}
		}
		&.qodef-blog-single{
			.qodef-related-posts-holder .qodef-related-post {
				width: calc((100% - 15px)/2);
                margin-bottom: 40px;
				&:nth-child(2n){
					margin-right: 0;
				}
				&:nth-child(2n+1){
					clear: both;
				}
                &:last-child {
                    margin-bottom: 0;
                }
			}
		}
		&.qodef-blog-type-narrow {
			article,
            .qodef-pagination{
				width:90%;
			}
		}
	}

	.qodef-column1,
	.qodef-column2{
		.qodef-blog-holder.qodef-blog-single{
			.qodef-related-posts-holder .qodef-related-post {
				width: calc((100% - 30px)/2);
				&:nth-child(2n){
					margin-right: 0;
				}
				&:nth-child(2n+1){
					clear: both;
				}
			}
		}
	}


}

@media only screen and (min-width: $phone-landscape) and (max-width: $ipad-landscape) {
    .qodef-blog-holder{
        &.qodef-blog-type-masonry{
            article.format-quote .qodef-post-text {
                padding: 30px 10px 15px;
            }
        }
    }
}

@include phone-landscape {
	.qodef-blog-holder{
		&.qodef-blog-type-masonry{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 100%;
			}
		}
		&.qodef-masonry-full-width{
			article,
			.qodef-blog-masonry-grid-sizer{
				width: 100%;
			}
			&.qodef-has-sidebar {
				article,
				.qodef-blog-masonry-grid-sizer{
					width: 100%;
				}
			}
		}
		&.qodef-blog-single{
			.qodef-blog-single-navigation{
				.qodef-blog-single-prev,
				.qodef-blog-single-next{
					display: none;
				}
			}
			article{
				.qodef-blog-tags-info-holder{
					display: block;

					.qodef-single-tags-holder,
					.qodef-post-info{
						display: block;
						text-align: left;
					}

				}
			}
		}
		article{
			.qodef-post-info{
				&.qodef-bottom-section {

					display: block;

					.qodef-left-section,
					.qodef-right-section {
						display: block;
						text-align: left;
					}
					.qodef-right-section{
						padding-left: 0;
						margin: 10px 0 0;
					}
				}
			}
		}

		&.qodef-blog-type-narrow {
			article,
            .qodef-pagination{
				width:100%;

				.qodef-post-excerpt {
					padding:0 20px;
				}
			}
		}

	}
}

@include phone-portrait {

	.qodef-related-posts-holder .qodef-related-post {
		width: 100% !important;
		margin-right: 0 !important;
        margin-bottom: 15px !important;
	}

	.qodef-blog-holder.qodef-blog-type-gallery article,
	.qodef-blog-holder.qodef-blog-type-gallery .qodef-blog-gallery-grid-sizer {
		width:100%;
	}

	.qodef-related-posts-holder .qodef-related-posts-title h3:before,
	.qodef-related-posts-holder .qodef-related-posts-title h3:after{
		display: none !important;
	}

    .qodef-author-description-inner,
    .qodef-author-description-image,
    .qodef-author-description-text-holder {
        display: block !important;
    }

}