@media all
{
	.widget ul.grid_columns
	{
		gap: 1%;
		list-style: none;
		padding: 0;
	}

		.widget.masonry ul.grid_columns
		{
			column-count: 3;
		}
			
		.widget.square ul.grid_columns
		{
			display: flex;
			flex-wrap: wrap;
		}

		.widget ul.grid_columns li
		{
			background: #fff;
			border-radius: .5em;
			box-shadow: 0 .2em .4em rgba(0, 0, 0, .15);
			flex: 0 1 auto;
			margin: 0 0 .6em;
			overflow: hidden;
			position: relative;
		}

			.widget.masonry ul.grid_columns li
			{
				page-break-inside: avoid;
				break-inside: avoid;
			}
			
			.widget.square ul.grid_columns li
			{
				flex: 0 1 auto;
				width: 32.333333333333%;
			}

			.widget ul.grid_columns li .image
			{
				background: rgba(0, 0, 0, .03);
				overflow: hidden;
			}

				.widget ul.grid_columns li .image img
				{
					display: block;
					object-fit: cover;
					transition: all 1s ease;
					width: 100%;
				}

					.widget ul.grid_columns li:hover .image img
					{
						transform: scale(1.1);
					}

			.widget ul.grid_columns .content
			{
				padding: 1em;
				position: relative;
			}

				.widget ul.grid_columns .meta
				{
					background: #fff;
					border-radius: .5em;
					font-size: .7em;
					opacity: 1;
					padding: .5em 1em;
					position: absolute;
					top: -4em;
					transition: all 1s ease;
				}

					.widget ul.grid_columns li:hover .meta
					{
						opacity: 0;
					}

					.widget ul.grid_columns .date
					{
						color: #ccc;
						font-size: .9em;
					}

				.widget ul.grid_columns .content a
				{
					text-decoration: none;
				}

				.widget ul.grid_columns .content > a
				{
					font-weight: bold;
				}

				/*.widget ul.grid_columns .content p
				{
					margin: 0;
				}*/

				.widget ul.grid_columns .content .wp-block-button
				{
					margin-top: .5em;
					text-align: right;
				}

					.widget ul.grid_columns .content .wp-block-button__link
					{
						font-size: .9em;
						padding: .5em 1em;
					}
}@media screen and (min-width: 930px) and (max-width: 1199px)
	{
		.widget.masonry ul.grid_columns
		{
			column-count: 2;
		}

		.widget.square ul.grid_columns li
		{
			width: 49%;
		}
	}@media screen and (max-width: 929px)
	{
		.widget.masonry ul.grid_columns
		{
			column-count: 1;
		}

		.widget.square ul.grid_columns li
		{
			width: 100%;
		}
	}