/*
Theme Name: Shoreditch-Child
Theme URI: https://wordpress.com/themes/shoreditch/
Description: Shoreditch is a functional and responsive theme perfect for your business's online presence. Although its main purpose is business, Shoreditch looks great as a personal blog theme too.
Version: 1.2.2
Author: Automattic
Author URI: https://wordpress.com/themes/
Template: shoreditch
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shoreditch-child
Tags: two-columns, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, featured-images, flexible-header, full-width-template, rtl-language-support, sticky-post, theme-options, translation-ready, blog, education
*/
.site-branding {
	text-align: center;
}

.main-navigation a {
	font-family: Karma, Poppins, sans-serif, Lato, sans-serif;
	font-weight: 400;
	font-size: 115%;
}

.site-menu {
	max-width: 57%;
}

ul.primary-menu {
	justify-content: flex-end;
}


nav.main-navigation li {
	padding: 0;
}

.main-navigation .primary-menu > li:last-child {
	margin-right: 0.75em;
}

.site-title {
	font-size: 190%;
}

h1, h2, h3, h4, h5, h6, .site-title {
	font-family: Karma, Poppins, sans-serif;
	font-weight: 400;
	clear: both;
}

.gallery-columns-1 {
	float: left;
	max-width: 26vw;
	clear: both;
	margin: 0 3vw 3vw 1vw;
}

.gallery-columns-1 .gallery-item {
	padding: 0;
}

.gallery-columns-1 >iframe {
	height: calc(9/16*85vw);
}

.gallery-columns-1 img {
	width: 100%;
}


.alignleft {
	margin: -1em 3vw 2em 0;
}

.alignright {
	margin: -1em 0 2em 3vw;
}

.alignleft, .alignright {
	max-width: 32.5%;
}

.site .testimonial-entry-title {
	font-family: Karma, Poppins, sans-serif, Lato, sans-serif;
}

.entry-hero-wrapper, .hentry-wrapper, .site-content-wrapper, .site-footer-wrapper, .site-header-wrapper, .site-content-wrapper .has-post-thumbnail .entry-header-wrapper, .widget-area-wrapper {
	max-width: 1120px;
}

embed, iframe, object, video, .fb_iframe_widget, .wp-audio-shortcode {
	width: 100%;
	height: calc(9/16*71vw);
	margin-bottom: 0.526vw;
	margin-top: -7px;
}
/*use custom padding instead of column-first column-last */
.column-1-2.column {
	margin-right: 0.625%;
}
.column-1-3 {
	width: 32.5%;
	float: left;
}
.column-1-3, .column-1-3.column-first, .column-1-3.column-last{
	padding: 0;
	margin-right: 0.625%;
}
.column-1-3.column-first {
	clear: both;
}
column-1-3.column-last {
	margin-right: 0;
}

.column-1-2 > iframe {
	height: calc(9/16*34vw);
}

.column-1-3 > iframe {
	height: calc(9/16*70vw);
}


/* 2 videos in 1 column */

.column-2-1 {
	width: 65.5%;
}
.column-2-1 > iframe {
	height: calc(9/16*46vw);
}
.column-1-1 {
	width: 32.5%;
}
.column-1-1 > iframe {
	height: calc(9/16*92.5vw);
}





/* flex is tarted but not used. Prefix must be included and looks overly complicated */
div.three-flex {
	display: flex;
	flex-direaction: column;
	justify-content: space-evenly safe;
	align-content: space-around safe;
	
	
}

div.three-flex > * {
	flex: 1 1 auto; /* grow/shrink/basis */
}
/* end flex */


.tiled-gallery .gallery-row {
	margin: 0 auto;
}
/* Hide Title on Home Page */
#post-652 h1.entry-title {
	display: none;	
}

#main > .page {
	padding-top: 1vh;
}

ul.columns-2 {
	list-style: inside disc;
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
}

ul.columns-2 li {
		text-indent: -2rem;
}

ul li {
	padding: 0 2vw;
	break-inside: avoid-column;
}


/* this is a css counter to display a count number for elements. This is used to number images in a gallery, and may have other applications 
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_counter_styles/Using_CSS_counters#basic_example */
body{
	counter-reset: section;     /* Set a counter named 'section', and its initial value is 0. */
}
.display-css-counter > div > figure::before {
	counter-increment: section;         /* Increment the value of section counter by 1 */
 	content: "Item " counter(section) "";       /* Display counter value in default style (decimal) */
}

/* Contact Form clear */
.wpcf7 {
	clear: both;
}

/*
Default Category Changes
*/







/*
media queries
*/

	@media screen and (min-width: 768px) {
		ul.column-1-2 {
			width: 46%;
		}
		.column-1-2 {
			width: 49.25%;
		}
		
	}

	@media screen and (max-width: 1020px) {
		.entry-hero-wrapper {
			padding-bottom: 3em;
			padding-top: 9em;
		}
		ul.columns-2 {
			-webkit-columns: 1;
			-moz-columns: 1;
			columns: 1;
		}
		.alignleft, .alignright {
			max-width: 45%;
		}

	}
	@media screen and (max-width: 896px) {
		.custom-logo {
			max-width: 121px;
		}
	}
	@media screen and (max-width: 768px) {
		.gallery-columns-1 {
			max-width: 40vw;
			margin-right: 1vw;
		}
		.tiled-gallery .gallery-row:only-child,  .tiled-gallery .gallery-row:only-child .gallery-group, .tiled-gallery .gallery-row:only-child .tiled-gallery-item, .tiled-gallery .gallery-row:only-child .tiled-gallery-item img {
			width: 100% !important;
			height: auto !important;
		}
		.tiled-gallery .gallery-row:only-child .gallery-group {
			width: 100% !important;
			margin: 0 0.5vw 0.5vw 0;
		}
		ul.columns-2 {
			clear: both;
			-webkit-columns: 2;
			-moz-columns: 2;
			columns: 2;
		}
		.alignleft, .alignright {
			max-width: 100%;
			width: 100%;
		}
		.column-1-3  {
			width: 100%;
		}
		.column-1-2 > iframe {
			height: calc(9/16*90vw);
		}
		.column-1-2 > iframe,  .column-1-3 > iframe, iframe.short {
			height: calc(16/9*80vw);
		}
		#the-magic-of-art-therapy {
			height: calc(9/16*87vw);
		}
		.column-2-1 {
			width: 100%;
		}
		.column-1-1 {
			width: 100%;
		}
		
		
	}
	@media screen and (max-width: 600px) {
	}