/* Globals ________________________________________________________________________ */

body,
html {
}

a {
}
a:hover {
	opacity: 0.8;
}

p,
ul,
ol,
blockquote,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 1.5rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
}

h1.entry-title {
	margin: 0 0 1.5rem;
}

h2 {
	font-size: 3rem;
}

blockquote {
	font-size: inherit;
	font-family: inherit;
	font-style: italic;
}
blockquote strong {
	font-style: normal;
}

.wp-template {
	position: fixed;
	left: 10px;
	top: 100px;
	z-index: 11;
	font-weight: bold;
	display: inline-block;
	padding: 0.25rem 0.5rem;
	background: #000;
	color: #fff;
}

.wp-template span {
	display: block;
	font-size: 1.1rem;
	text-transform: uppercase;
	margin-bottom: 0.25rem;
}

.wp-block-button {
	text-align: center;
}

.text-center {
	text-align: center;
}

/* Footer  */

.site-footer p {
	line-height: 1.3;
}

/* Lists & grids */

ul.list {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	width: 100%;
	display: block;
	float: left;
}
ul.list li {
	list-style: none;
}
ul.people {
	margin-left: -15px;
	margin-right: -15px;
	display: flex;
	flex-wrap: wrap;
	float: none;
}

ul.people li {
	width: 33.33%;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 30px;
}

@media (max-width: 997px) {
	ul.people li {
		width: 50%;
	}
}

@media (max-width: 767px) {
	ul.people li {
		width: 100%;
	}
}

ul.people li a {
	text-decoration: none;
}
ul.people.barristers li a {
	display: block;
}
ul.people li img {
	width: 100%;
	margin: 0 0 0.75rem;
}
ul.people li span {
	display: block;
	text-align: center;
}
ul.people li span.name {
}
ul.people li span.meta {
	color: black;
	font-size: 80%;
}

/* Pages & posts */

.page-template-people .full-width-image {
	display: none;
}


/* Homepage  ________________________________________________________ */


.hero-section, .front-page-1, .front-page-2, .front-page-3 {
	z-index: 99;
}



/* Profiles */

.single-barrister .breakthrough-page-title,
.single-clerk .breakthrough-page-title,
.single-area .breakthrough-page-title {
	display: none;
}
.single-barrister img.wp-post-image,
.single-clerk img.wp-post-image {
	max-width: 45%;
	float: right;
	margin: 0 0 1.5rem 1.5rem;
}

.years,
.jobtitle {
	font-weight: bold;
}
.years,
.contacts {
	font-size: 1.4em;
	margin: 0 0 3rem;
}

ul.key-details {
	list-style: none;
	padding: 0.5rem 1rem;
	background: #eee;
	margin: 0 0 3rem;
	float: left;
	width: 100%;
}
ul.key-details li {
	list-style: none;
}
ul.key-details li a {
	text-decoration: none;
}

.title-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.pdf-submit {
	-webkit-appearance: none;
	text-decoration: none;
}
.contact-container {
	display: flex;
	margin-bottom: 20px;
	justify-content: space-between;
}
.contact-container > .picture {
	/* flex-basis: 200px; */
	/* min-height: 250px; */
	background-size: cover;
	background-position: center top;
	margin-right: 50px;
	background-repeat: no-repeat;
}
img.barrister-picture {
	min-height: 150px;
}

.page-template-barristers .full-width-image {
	display: none;
}
select {
	width: auto;
	padding: 5px 7px;
}

form#filter-by-area {
	text-align: right;
}

.filter-barrister {
	margin: 10px 0 20px;
}
.pdf-submit {
	width: 100%;
}


/* Tables  ________________________________________________________ */

table.pricing { word-break: normal; }
table.pricing tr:nth-child(even) {background: #EEE; }
table.pricing td { padding: 0.5rem; vertical-align: top;  line-height: 1.3;  } 
table.pricing td:first-child { font-weight: bold; }
table.pricing td:last-child { width: 300px; text-align: right; }


/* MEDIA QUERIES _____________________ */

/* Small __________________ */

@media only screen {
	.contact-container > .picture {
		min-height: auto;
		margin-right: 20px;
		background-size: cover;
	}
} /* Define mobile styles */


@media only screen and (max-width: 40em) {


	.content .entry-content {
		padding: 0;
	}


	.contact-container {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	/*
	.contact-container > div {
	flex-grow: 1;
	flex-basis: 0;

}
	*/

	.contact-container > .picture {
		min-height: auto;
		padding-right: 5px;
		background-size: cover;
		flex: 0 0 150px;
	}

	.contact-container > .details {
		flex: 1;
	}


	ul.key-details {
		padding: 0.3rem;
		margin-bottom: 1rem;
		text-align: center;
	}

	ul.key-details li a { color: black; }

	.call {
		margin-bottom: 0.5em;
	}
	.hide-for-small {
		display: none;
	}

	.pdf-submit {
		font-size: 1.2rem;
		letter-spacing: normal;
	}
} /* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* Medium __________________ */

@media only screen and (min-width: 40.063em) {

	/*
	Added by CA on August 7th while working on barrister profiles
	Disabled by TS on Sep 3rd when debugging page layout issue

	.content .entry-content {
	padding: 0;
}

	*/


	.contact-container > .picture {
		min-height: auto;
		/* margin-right: 5px; */
		background-size: cover;
	}
	ul.key-details {
		padding: 0.3rem;
		margin-bottom: 0;
	}
	.call {
		margin-bottom: 0;
	}
	.details {
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
	}
} /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) {
	.contact-container > .picture {
		min-height: auto;
		margin-right: 5px;
		background-size: cover;
	}
	.details {
		display: flex;
		flex-direction: column;
		justify-content: space-around;
	}
	img.barrister-picture {
		min-height:175px;
		height: 100%;
	}
	ul.key-details{
		margin:10px 0;
	}
} /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Large __________________ */

@media only screen and (min-width: 64.063em) {
	.details {
		display: block;
	}
	ul.key-details{
		margin:10px 0;
	}
} /* min-width 1025px, large screens */

@media only screen and (min-width: 64.063em) and (max-width: 90em) {
	img.barrister-picture {
		min-height: 250px;
	}
	.contact-container > .picture{margin-right: 50px;}
	.call{
		margin-bottom: 1.5rem;
	}
	ul.key-details{
		margin-bottom: 3rem;
		padding: 0.5rem 1rem;

	}

} /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

/* X Large __________________ */

@media only screen and (min-width: 90.063em) {
	img.barrister-picture {
		min-height: 250px;
	}
	.contact-container > .picture{margin-right: 50px;}
	.call{
		margin-bottom: 1.5rem;
	}
	ul.key-details{
		margin-bottom: 3rem;
		padding: 0.5rem 1rem;

	}

} /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) {
	img.barrister-picture {
		min-height: 250px;
	}
	.contact-container > .picture{margin-right: 50px;}
	.call{
		margin-bottom: 1.5rem;
	}
	ul.key-details{
		margin-bottom: 3rem;
		padding: 0.5rem 1rem;

	}
} /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

/* XX Large __________________ */

@media only screen and (min-width: 120.063em) {
} /* min-width 1921px, xxlarge screens */

.date {
	font-size: 14px;
}

ul.lists.logo .image-logo .logo {
	max-height: 100px;
}
ul.lists.logo {
	display: flex;
	justify-content: center;
	justify-items: center;
}
div#front-page-logos .flexible-widgets .wrap{
	padding:10px;
	margin:0 auto;
}