/**
Theme Name: Skinnytaste by SHM
Author: SHM
Author URI: https://swifthorsemarketing.com/
Description: This is a highly customized child theme developed by Swift Horse Marketing.  It is configured and optimized to create super fast Food Blogger websites.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

html {
  scroll-behavior: smooth;
}

/* MISC */
.clearfix::after {
	content: '';
	display: table;
	clear: both;
}
.clear::after {
	content: '';
	display: table;
	clear: both;
	height: 0;
	float: none;
}
.ast-grid-common-col .ast-float {
	float: none;
}
.no-padding {
	padding: 0 !important;
}
.button {
	display: inline-block;
	text-decoration: none !important;
}

/* PRIMARY CONTAINER */
@media (max-width:921px) {
	.ast-separate-container.ast-right-sidebar #primary, .ast-separate-container.ast-left-sidebar #primary, .ast-separate-container #primary, .ast-plain-container #primary {
		margin-top: 0;
	}
}

/* SIDEBAR */
html .ast-right-sidebar #primary {
	border-right: none;
}
html .ast-right-sidebar #secondary {
	border-left: none;
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
}
@media screen AND (min-width:330px){
	html .ast-right-sidebar #secondary {
		min-width: 310px;
	}
}
@media screen AND (min-width:922px){
	html .ast-right-sidebar #secondary {
		padding-left: 10px;
	}
}
@media screen AND (min-width:993px) {
	html .ast-right-sidebar #primary {
		padding-right: 40px;
	}
}

/* SEARCH OVERLAY */
.ast-search-box.full-screen .ast-search-wrapper .search-form {
	width: 100%;
	max-width: 800px;
	margin: 20px auto;
}
html .ast-search-box.full-screen .ast-search-wrapper {
	top: 20%;
}
html .ast-search-box.full-screen .ast-search-wrapper .search-field {
	text-align: left;
}

/* GLOBAL COLUMN ADJUSTMENT */
html .ast-row {
	margin-left: -10px;
	margin-right: -10px;
}
html .ast-row > .ast-grid-common-col, html .ast-grid-common-col {
	padding-left: 10px;
	padding-right: 10px;
}

/* REDUCE CONTAINER PADDING ON MOBILE */
@media screen AND (max-width:976px){
	html .ast-container {
		padding-left: 10px;
		padding-right: 10px;
	}
}

/* Fix theme odd styling */
.ast-plain-container .ast-grid-4 .ast-article-post:last-child {
	margin-bottom: 1em;
}

/* Fix Archive Pagination Arrows */
html .ast-pagination .prev.page-numbers {
	float: none;
}
@media screen AND (max-width:420px) {
	html .ast-pagination .prev.page-numbers, html .ast-pagination .next.page-numbers {
		width: auto;
	}
}

/* ASTRA MOBILE/TABLET COLUMNS */

@media screen AND (min-width:545px) AND (max-width:1023px){
	.mobile-two-column .ast-row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.tablet-four-column .ast-row .ast-article-post {
		width: 25%;
	}
	.tablet-two-column .ast-row .ast-article-post {
		width: 50%;
	}
}

@media screen AND (max-width:544px){
	
	html .mobile-two-column .ast-row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
	}
	html .mobile-two-column .ast-row .ast-article-post {
		width: 50%;
	}
		
}

/* FLEX GRID STYLES */

.grid-container {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;	
}
.grid-container.grid-container-padded {
	margin: 0 -10px;
}
.grid-container.grid-container-padded-small {
	margin: 0 -6px;
}
.grid-item-pad {
	padding-left: 10px;
	padding-right: 10px;
}
.grid-item-pad-small {
	padding-left: 6px;
	padding-right: 6px;
}

/* Grid layout */
/* Added base-60 styles for GL compatibilit */
.grid-6 { width: 16.66%; flex-basis: 16.66%; }
.grid-5 { width: 20%; flex-basis: 20%; }
.grid-4 { width: 25%; flex-basis: 25%; }
.grid-3 { width: 33.33%; flex-basis: 33.33%; }
.grid-2 { width: 50%; flex-basis: 50%; }
.grid-1 { width: 100%; flex-basis: 100%; }

@media screen AND (min-width:545px) AND (max-width:1023px){
	.tablet-grid-2 {
		width: 50%;
		flex-basis: 50%;
	}
	.tablet-grid-3 {
		width: 33.33%;
		flex-basis: 33.33%;
	}
	.tablet-grid-4 {
		width: 25%;
		flex-basis: 25%;
	}
	.tablet-grid-5 {
		width: 20%;
		flex-basis: 20%;
	}
	.tablet-grid-6 {
		width: 16.66%;
		flex-basis: 16.66%;
	}
	.tablet-grid-limit-4 .post-grid-container .post-grid-post:nth-of-type(n+5),
	.tablet-grid-limit-4 .grid-container .post-grid-post:nth-of-type(n+5) {
		display: none;
	}
}
@media screen AND (max-width:544px){
	.grid-6, .grid-5, .grid-4, .grid-3, .grid-2 {
		width: 100%;
		flex-basis: 100%;
	}
	.mobile-two-column .grid-6, .mobile-two-column .grid-5, .mobile-two-column .grid-4, .mobile-two-column .grid-3, .mobile-two-column .grid-2 {
		width: 50%;
		flex-basis: 50%;
	}
	.mobile-grid-2 {
		width: 50%;
		flex-basis: 50%;
	}
	.mobile-grid-3 {
		width: 33.33%;
		flex-basis: 33.33%
	}
}

/* Limit articles to 4 on mobile grid */
@media screen AND (max-width:544px){
	.uagb-post-grid.mobile-grid-limit-4 .uagb-post__items > article:nth-child(n+5),
	.mobile-grid-limit-4 .post-grid-container .post-grid-post:nth-of-type(n+5),
	.mobile-grid-limit-4 .grid-container .post-grid-post:nth-of-type(n+5),
	.mobile-grid-limit-4 .ast-row article:nth-of-type(n+5),
	.mobile-grid-limit-4 .grid-item:nth-of-type(n+5) {
		display: none;
	}
}

/* Limit articles to 5 on tablet grid */
@media screen AND (min-width:545px) AND (max-width:921px){
	.tablet-grid-limit-5 .grid-container .grid-image-item:nth-of-type(n+6),
	.tablet-grid-limit-5 .grid-item:nth-of-type(n+6) {
		display: none;
	}
	.tablet-grid-limit-5 .grid-container .grid-6 {
		width: 20%;
		flex-basis: 20%;
	}
}

/* GRID COLUMN STYLES */

.grid-cols {
	display: grid;
}
.grid-cols-1 {
	grid-template-columns: auto;
}
.grid-cols-2 {
	grid-template-columns: repeat(2, auto);
}
.grid-cols-3 {
	grid-template-columns: repeat(3, auto);
}
.grid-cols-4 {
	grid-template-columns: repeat(4, auto);
}
@media screen AND (min-width:545px) AND (max-width:1023px){
	.tablet-grid-cols-1 {
		grid-template-columns: auto;
	}
	.tablet-grid-cols-2 {
		grid-template-columns: repeat(2, auto);
	}
	.tablet-grid-cols-3 {
		grid-template-columns: repeat(3, auto);
	}
	.tablet-grid-cols-4 {
		grid-template-columns: repeat(4, auto);
	}
}
@media screen AND (max-width:544px){
	.mobile-grid-cols-1 {
		grid-template-columns: 1fr;
	}
	.mobile-grid-cols-2 {
		grid-template-columns: repeat(2, auto);
	}
	.mobile-grid-cols-3 {
		grid-template-columns: repeat(3, auto);
	}
	.mobile-grid-cols-4 {
		grid-template-columns: repeat(4, auto);
	}
}