/*!
Theme Name: Jackie Bandha Homeopathy
Theme URI: https://www.staffshomeopathy.co.uk/
Author: Tom Kenning
Author URI: https://www.tomkenning.com/
Description: Bespoke theme for Jackie Bandha Homeopathy.
Version: 1.1.0
Text Domain: jackie-bandha-homeopathy

Jackie Bandha Homeopathy is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Layout
	## Header
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/

@-ms-viewport {
	width: device-width;
}

@viewport {
	width: device-width;
}

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

audio,
canvas,
progress,
video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],
template {
	display: none;
}

a {
	background-color: transparent;
}

a:active,
a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

mark {
	background: #ff0;
	color: #000;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 1em 40px;
}

hr {
	box-sizing: content-box;
	height: 0;
}

pre {
	overflow: auto;
}

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],
html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: bold;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Cinzel', serif;
	font-weight: normal;
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn, cite, em, i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", Courier, monospace;
	font-size: 15px;
	font-size: 0.9375rem;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code, kbd, tt, var {
	font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
	font-size: 15px;
	font-size: 0.9375rem;
}

abbr, acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark, ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
	box-sizing: border-box;
}

*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	box-sizing: inherit;
}

body {
	background: #fff;
	/* Fallback for when there is no custom background color defined. */
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul, ol {
	margin: 0 0 1.5em 1em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: bold;
}

dd {
	margin: 0 1.5em 1.5em;
}

.entry-content img {
	height: auto;
	/* Make sure images are scaled correctly. */
	max-width: 100%;
	/* Adhere to container width. */
	border: 5px solid #d54e0c;
}

figure {
	margin: 1em 0;
	/* Extra wide images within figure tags don't overflow the content area. */
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1;
	padding: .6em 1em .4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active, button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: #d54e0c;
	text-decoration: none;
}

a:visited {
	color: #d54e0c;
}

a:hover, a:focus, a:active {
	color: #d54e0c;
	text-decoration: underline;
}

a:focus {
	outline: thin dotted;
}

a:hover, a:active {
	outline: 0;
}

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
	display: block;
    margin: 0 auto;
	width: 100%;
    /*max-width: 90%;*/
    background: #173101;
    border-radius: 5px;
    border: 5px solid #173101;
    box-shadow: inset 0 0 0 1px #fff;
}

/*.menu {
	display: block;
	width: 100%;
}*/

.menu {
	width: 100%;
	list-style: none;
	margin: 0;
	padding-left: 0;
	text-align: center;
	font-family: 'Cinzel', serif;
    font-size: 22px;
    font-size: 1.375rem;
    text-transform: uppercase;
    line-height: normal;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	left: 100%;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.menu li {
	position: relative;
	display: block;
}

.menu li a {
	padding: 0.5em 0;
}

#footer-menu {
	display: block;
	margin: 1em 0;
}

/* #footer-menu li {
	display: inline-block;
	margin: 0.5em 1.5em;
}*/

.menu a {
	display: block;
	color: #fff;
}

#footer-menu a {
	color: #d54e0c;
}

.menu a:visited {
	color: #fff;
}

#footer-menu a:visited {
	color: #d54e0c;
}

.nav-previous {
	float: left;
	margin-bottom: 1em;
}

.nav-next {
	float: right;
	margin-bottom: 1em;
}

/*--------------------------------------------------------------
## Mobile Menu
--------------------------------------------------------------*/

.main-navigation #primary-menu {
	display: none;
}

.menu-toggle {
	display: block;
	width: 100%;
	background: none;
	font-family: 'Cinzel', serif;
    font-size: 22px;
    font-size: 1.375rem;
    text-transform: uppercase;
    line-height: normal;
	color: #FFF;
}

.main-navigation.toggled #primary-menu {
	display: block;
}

@media screen and (min-width: 42.5em) {
	.menu-toggle {
		display: none;
	}
	.main-navigation #primary-menu {
		display: block;
	}
	.menu li {
		display: inline-block;
		margin: 0.5em 1.5em;
	}
	.menu li a {
		padding: 0;
}
}

@media screen and (min-width: 60em) {
	.menu li {
		margin: 0.5em 0.3em;
	}
}

@media screen and (min-width: 67em) {
	.menu li {
		margin: 0.5em 0.8em;
	}
}

@media screen and (min-width: 77em) {
	.menu li {
		margin: 0.5em 1.3em;
	}
}

@media screen and (min-width: 85em) {
	.menu li {
		margin: 0.5em 1.8em;
	}
}

/*--------------------------------------------------------------
# Layout
--------------------------------------------------------------*/
.site {
	/*padding: 0 50px 0 50px;*/
}
/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/
.site-header {
	display: block;
	width: 100%;
	padding: 2em 5%;
	background-image: url("headerbg-mobile.jpg");
	background-repeat: no-repeat;
	background-position: left top;
	box-shadow: 0px -10px 30px 20px grey;
}
.site-branding {
	display: block;
	margin: 0 auto 3em auto;
	max-width: 850px;
	text-align: center;
	background: #173101;
	border-radius: 5px;
	border: 5px solid #173101;
	box-shadow: inset 0 0 0 1px #fff;
}

.site-title {
	font-family: 'Cinzel', serif;
	font-weight: normal;
	font-size: 40px;
	font-size: 2.5rem;
	line-height: normal;
	margin-top: 0;
	margin-bottom: 0;
}

.site-title a, .site-title a:visited {
	color: #fff;
	text-decoration: none;
}

.site-description {
	font-family: 'Cinzel', serif;
	font-size: 16px;
	font-size: 1rem;
	color: #fff;
	text-transform: uppercase;
	line-height: normal;
	margin-top: 0;
	margin-bottom: 0.5em;
}

@media screen and (min-width: 27em) {
	.site-title {
		font-size: 56px;
		font-size: 3.5rem;
	}
	.site-description {
		font-size: 22px;
		font-size: 1.375rem;
	}
}

@media screen and (min-width: 32.5em) {
	.site-title {
		font-size: 64px;
		font-size: 4rem;
	}
}

@media screen and (min-width: 42.5em) {
	.site-title {
		font-size: 72px;
		font-size: 4.5rem;
	}
}

@media screen and (min-width: 52.5em) {
		.site-header {
			background-image: url("headerbg.jpg");
			background-size: 100% auto;
			background-position: center;
			padding: 4em 5%;
	}
}
/*--------------------------------------------------------------
## Sidebar
--------------------------------------------------------------*/
.contact-details {
	display: block;
	margin: 0 0 0 0;
}

.contact-details-link  {
	position: relative;
    display: block;
	margin-bottom: 2.5em;
	font-size: 18px;
	font-size: 1.125rem;
	color: #d54e0c;
	text-decoration: none;
	clear: both;
	text-align: center;
}

.contact-details-link:hover, .contact-details-link:hover span, .contact-details-link:focus, .contact-details-link:focus span, .contact-details-link:active, .contact-details-link:active span {
	color: #d54e0c;
	text-decoration: underline;
}

.contact-details-link:visited, .contact-details-link span:visited {
	color: #d54e0c;
}

.contact-details-link span {
	display: block;
	margin-top: 0.5em;
	width: 100%;
}

.fa {
	font-size: 42px;
	font-size: 2.625rem;
	text-align: center;
	width: 100%;
	/*width: 0.92857142857em;
	
	margin-right: 0.5em;*/
}

.fa-envelope {
	font-size: 38px;
	font-size: 2.375rem;
	/*width: 1.02631578947em;*/
}

.widget {
	margin: 0 0 3em 0;
	overflow: auto;
}

.widget .image {
	display: block;
	margin: 0 auto;
}

.widget select {
	max-width: 100%;
}

@media screen and (min-width: 60em) {
	.contact-details-link  {
		float: left;
		text-align: left;
	}
	.contact-details-link span {
		float: left;
		width: auto;
	}
	.fa {
		width: 1.66666666667em;
		vertical-align: -15%;
		margin-right: 0;
	}
	.fa-envelope {
		width: 1.84210526316em;
	}
	.fa-map-marker {
		float: left;
	}
	.widget_media_image {
		margin-left: 1em;
	}
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
	display: inline;
	float: left;
	margin: 0.3em 1.5em 0.3em 0;
}

.alignright {
	display: inline;
	float: right;
	margin: 0.3em 0 0.3em 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin: 0.5em auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
.site-content {
	margin: 0 auto;
	width: 90%;
	position: relative;
	padding: 0;
}

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.hentry {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.entry-title {
	font-size: 32px;
	font-size: 2rem;
	color: #173101;
	margin: 2em 0 0 0;
	border-bottom: 1px solid #bec6b8;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

.entry-content h1,
.entry-summary h1,
.comment-content h1,
.textwidget h1 {
	font-size: 32px;
	font-size: 2rem;
	line-height: 1.25;
	margin-top: 2em;
	margin-bottom: 1em;
}

.entry-content h2,
.entry-summary h2,
.comment-content h2,
.textwidget h2 {
	font-size: 24px;
	font-size: 1.5rem;
	line-height: 1.5;
	margin-top: 2em;
	margin-bottom: 1em;
}

.entry-content h3,
.entry-summary h3,
.comment-content h3,
.textwidget h3 {
	font-size: 20px;
	font-size: 1.25rem;
	line-height: normal;
	margin-top: 2em;
	margin-bottom: 1em;
}

.entry-content h4,
.entry-content h5,
.entry-content h6,
.entry-summary h4,
.entry-summary h5,
.entry-summary h6,
.comment-content h4,
.comment-content h5,
.comment-content h6,
.textwidget h4,
.textwidget h5,
.textwidget h6 {
	font-size: 16px;
	font-size: 1rem;
	line-height: normal;
}

.entry-content h4,
.entry-summary h4,
.comment-content h4,
.textwidget h4 {
	letter-spacing: 0.140625em;
	text-transform: uppercase;
}

.entry-content h6,
.entry-summary h6,
.comment-content h6,
.textwidget h6 {
	font-style: italic;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.entry-summary h1,
.entry-summary h2,
.entry-summary h3,
.entry-summary h4,
.entry-summary h5,
.entry-summary h6,
.comment-content h1,
.comment-content h2,
.comment-content h3,
.comment-content h4,
.comment-content h5,
.comment-content h6,
.textwidget h1,
.textwidget h2,
.textwidget h3,
.textwidget h4,
.textwidget h5,
.textwidget h6 {
	font-weight: normal;
	color: #173101;
}

.entry-content h1:first-child,
.entry-content h2:first-child,
.entry-content h3:first-child,
.entry-content h4:first-child,
.entry-content h5:first-child,
.entry-content h6:first-child,
.entry-summary h1:first-child,
.entry-summary h2:first-child,
.entry-summary h3:first-child,
.entry-summary h4:first-child,
.entry-summary h5:first-child,
.entry-summary h6:first-child,
.comment-content h1:first-child,
.comment-content h2:first-child,
.comment-content h3:first-child,
.comment-content h4:first-child,
.comment-content h5:first-child,
.comment-content h6:first-child,
.textwidget h1:first-child,
.textwidget h2:first-child,
.textwidget h3:first-child,
.textwidget h4:first-child,
.textwidget h5:first-child,
.textwidget h6:first-child {
	margin-top: 0;
}

.post-navigation .post-title,
.entry-title,
.comments-title {
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	/* Theme Footer (when set to scrolling) */
	display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

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

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	max-width: 50%;
}

.gallery-columns-3 .gallery-item {
	max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 25%;
}

.gallery-columns-5 .gallery-item {
	max-width: 20%;
}

.gallery-columns-6 .gallery-item {
	max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 11.11%;
}

.gallery-caption {
	display: block;
}

@media screen and (min-width: 60em) {
	.content-area {
		margin: 0 24.25em 0 0;
		min-height: 53.75em;
	}
}

@media screen and (min-width: 60em) {
	.site-content .widget-area {
		position: absolute;
		right: 0;
		top: 4em;
		margin-top: 0;
	}
}

.site-footer {
	clear: both;
	margin: 0 5%;
	border-top: 1px solid #bec6b8;
}

.site-footer .site-info {
	margin-bottom: 2em;
	text-align: center;
	font-family: 'Cinzel', serif;
    font-size: 22px;
    font-size: 1.375rem;
    text-transform: uppercase;
    line-height: normal;
}

.site-footer .site-info a {
	text-decoration: none;
}

.site-footer .site-info a:hover {
	text-decoration: underline;
}