/*
Theme Name: troideluz
Author: Resolution Design and Development
Author URI: http://resolutiondesign.net/
Description: Custom theme for Troi DeLuz
Version: 1.0
License: Copyright, not licensed for distribution or reuse
Text Domain: troideluz
*/

/* Webfonts */
/*@import url('https://fonts.googleapis.com/css?family=Amatic+SC:400,700|Fira+Sans:300,300i,500,500i');*/
@import url('https://fonts.googleapis.com/css?family=Alegreya+Sans:300,300i,400,400i,500,500i');

/* Basic CSS Reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
	font-size:100%;
	font:inherit;
	vertical-align:baseline;
}
html, body {
	margin: 0 !important;
}
body{
	position: relative;
	font-family: 'Alegreya Sans', sans-serif;
	font-size: 1.38em;
	line-height:1;
	font-weight: 400;
	padding: 0;
	background-color: rgba(255, 250, 246, 1);
}
a:link {
	color: #06619c;
	color: #06598E;
}
a:visited {
	color: #2F678B;
}
a:hover {
	color: #2F678B;
}
a:active {
	color: #9B0880;
}
strong {
	font-weight: 500;
}
small {
	font-size: .7em;
}
nav ul{
	list-style:none;
	margin: 0;
	padding: 0;
}
/* Basic WP Classes */
.sticky{}
.bypostauthor{}
.wp-caption{}
.wp-caption-text{}
.gallery-caption{}
.aligncenter{}
.screen-reader-text{
	clip:rect(1px, 1px, 1px, 1px);
	position:absolute !important;
}

/* General Interface/Layout Styles */
#header {
	background-color: #fff;
	padding: 10px;
}
.page-template-default #content .header {
	width: 100%;
	margin: 0;
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: cover;
	border-width: 0 0 6px;
	border-style: solid;
	border-color: #777;
}
.page-kambo-quest #content .header {
	border-color: #6d9d31;
}
.page-dynamic-reiki #content .header {
	border-color: #92278f;
}
.page-about-troi #content .header {
	border-color: #f287b7;
}
.page-contact #content .header {
	border-color: #f7d471;
}
.page-template-home-hiatus #branding,
.page-template-home #branding,
#branding a {
	display: inline-block;
	width: 80vw;
	height: 20vw;
	/*! border-radius: 100%; */
	background-image: url('images/troi-deluz-logo-for-light-bkg.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 98% auto;
	text-indent: -999em;
	overflow: hidden;
}

.menu,
.page-template-default .entry-title {
	font-weight: 500;
}
.menu a {
	text-decoration: none;
}
.nav-description {
	display: none;
}
.main-topics-navigation,
#menu-contact-navigation {
	display: flex;
	font-size: 1.2em;
	margin: .1em 0 0;
	text-align: center;
}
.main-topics-navigation > .menu-item > a,
#menu-contact-navigation > .menu-item > a{
	display: inline-block;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 65% .2em;
	padding: 0 .1em .35em;
	margin: 0 auto;
	color: #222;
	box-sizing: border-box;
}
#menu .menu-item > a:hover {
	background-size: 85% .2em;
}
.main-topics-navigation > .menu-item a:focus,
#menu-contact-navigation > .menu-item a:focus{
	border: 2px dotted #777;
}
.main-topics-navigation > .menu-item:nth-of-type(1) > a {
	background-image: url('images/bar-green.svg');
}
.main-topics-navigation > .menu-item:nth-of-type(2) > a {
	background-image: url('images/bar-purple.svg');
}
.main-topics-navigation > .menu-item:nth-of-type(3) > a {
	background-image: url('images/bar-pink.svg');
}
#menu-contact-navigation > .menu-item > a {
	background-image: url('images/bar-gold.svg');
}
.main-topics-navigation .nav-detail {
	display: block;
	font-family: "Fira Sans", sans-serif;
	font-size: 1.2rem;
	line-height: 1.3em;
	margin: 1.2em auto;
}

/* Content Styles */
#content {
}
#content .entry-title {
	font-size: 2em;
	margin: 0;
	padding: 1em 20px .2em;
	color: #fff;
	text-shadow: 0px 0px 4px #000;
}
.entry-content-container {
	padding: 2em 20px 0;
}
.entry-content {
	padding: 0 0 60px
}
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
	font-weight: 400;
}
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
	margin: 1.5em 0 .3em;
}
#content h2:first-of-type {
	margin-top: 0;
}
#content h2 {
	font-size: 1.5em;
}
#content h3 {
	font-size: 1.4em;
}
#content h4 {
	font-size: 1.3em;
}
#content h5 {
	font-size: 1.2em;
}
#content h6 {
	font-size: 1.15em;
	font-style: italic;
}

#content p,
#content ul,
#content ol {
	margin: 0 0 1.2em;
	line-height: 1.11em;
}
#content ul li {
	margin: 0 0 .5em;
}
#content img {
	width: 100%;
	height: auto;
	border-radius: 6px;
	border-width: 4px;
	border-style: solid;
	box-sizing: border-box;
	border-color: #fff;
	box-shadow: 0px 2px 6px rgba(0,0,0,0.3);
	background-color: #ccc;
	margin: 0 0 10px;
}
#content blockquote {
	margin: 3em;
	padding: 30px 0;
	background-image: url('images/bar-gold.svg'),  url('images/bar-gold.svg');
	background-position: center top, center bottom;
	background-repeat: no-repeat;
	background-size: 100% .5em;
	color: #444;
	font-style: oblique;
}
.page-kambo-quest #content blockquote {
	background-image: url('images/bar-green.svg'),  url('images/bar-green.svg');
}
.page-dynamic-reiki #content blockquote {
	background-image: url('images/bar-purple.svg'),  url('images/bar-purple.svg');
}
.page-about-troi #content blockquote {
	background-image: url('images/bar-pink.svg'),  url('images/bar-pink.svg');
}
#content blockquote p:last-of-type {
	margin: 0;
}

/* Footer Styles */
#footer {
	margin: 0 auto;
	padding: 2em 0 80px;
	font-size: .6em;
	color: rgba(0,0,0,0.7);
}
#header,
#footer,
.page-template-home-hiatus,
.page-template-home {
	text-align: center;
}

/* Home Page Styles */
.page-template-home-hiatus,
.page-template-home {
	padding: 0;
	background-color: rgb(4, 29, 34);
	background-position: center -24vh;
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
}
.page-template-home-hiatus #branding,
.page-template-home #branding {
	width: 50vh;
	height: 23vh;
}
.page-template-home header {
  display: flex;
  flex: 1 0 auto;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  flex-flow: column;
 }
#features .main-topics-navigation {
	font-size: 2em;
	display: block;
	margin: 0;
	font-weight: 300;
}
#features {
	display: block;
	width: auto;
	background-color: rgba(255,249,232,1);
	padding: 1em;
}
#features .main-topics-navigation > .menu-item {
	display: block;
	width: auto;
	margin: 0;
}
#features .main-topics-navigation > .menu-item a {
}
#features .main-topics-navigation .nav-detail {
	margin: 0 40px 0;
}
.page-template-home-hiatus #content,
.page-template-home #content {
	position: relative;
	display: block;
	margin: 2em auto;
	padding: 0 30px;
	color: #fff;
	text-shadow: 0px 1px 1px rgba(0,0,0,0.9);
}
.page-template-home #content h2 {
	font-size: 1.8em;
	margin: 0 auto .5em;
	max-width: 8em;
	line-height: .98em;
}
.page-template-home #content p {
	font-size: .9em;
	max-width: 24em;
	margin: 0 auto 1.5em;
}
.page-template-home #content a {
	color: #FBC92F;
	font-weight: 500;
}
.page-template-home #content a:hover {
	color: #FFF526;
}

.page-template-home-hiatus #features,
.page-template-home #features,
.page-template-home #footer {
	background-color: rgba(255,249,232,.85);
}


/* Sidebar Widgets */
#content .widget-area ul.xoxo {
	list-style-type: none;
	/*! margin: 0 0 30px; */
	padding: 0;
	font-size: .8em;
	text-align: center;
}
.page-template-home .widget-area ul.xoxo {
	font-size: 1.3em;
	list-style-type: none;
	margin:0;
	padding:0 20px;
}
.widget-title {
	font-size: 2em;
	margin: 0 auto .2em;
	font-weight: 500;
}

/* Subscription Form */
.yikes-easy-mc-form {
	display: flex !important;
	flex-flow: row nowrap;
	align-items: flex-start;
	justify-content: flex-start;
  width: 100%;
  margin: 20px auto;
	box-sizing: border-box;
}
.yikes-easy-mc-form .field-no-label, .yikes-easy-mc-form label {
	display: block !important;
	flex: 0 0 70%;
	border-radius: 6px 0 0 6px;
	background-color: #f1f1f1;
}
.yikes-easy-mc-form input[type="email"], .yikes-easy-mc-form input[type="number"], .yikes-easy-mc-form input[type="text"], .yikes-easy-mc-form input[type="url"], .yikes-easy-mc-form select {
	font-family: inherit !important;
	font-size: 1em;
	padding: 10px !important;;
	background-color: #f1f1f1;
	border: none !important;;
	display: block;
	box-sizing: border-box;
	margin-bottom: 0px !important;;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.yikes-easy-mc-form .yikes-easy-mc-submit-button {
	font-family: inherit !important;
	font-size: 1em;
	font-weight: 500;
	flex: 0 0 30%;
	box-sizing: border-box;
	width: 100%;
	margin: 0 !important;;
	min-height: 10px !important;;
	padding: 10px !important;;
	cursor: pointer;
	border: none;
	background-color: #ebb91f;
	border-radius: 0 6px 6px 0;
	box-sizing: border-box;
}

/* Mobile-only */
@media screen and (max-width: 720px) {
	#wpadminbar {
		display: none;
	}	
	#header #branding a {
		width: 150px;
		height: 70px;
  }
	#menu {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 999;
		background-color: #fff;
		box-shadow: 0px -1px 3px rgba(0,0,0,0.3);
		text-align: center;
		display: flex;
		align-items: center;
		font-size: .7em;
		font-weight: 700;
		padding: 4px 0;
	}
	.menu-main-navigation-container,
	.menu-contact-navigation-container {
		display: flex;
		justify-content: space-around;
	}
	#menu .menu-main-navigation-container {
		width: 60%;
	}
	#menu .menu-contact-navigation-container {
		width: 40%;
	}
	#menu-contact-navigation .menu-item {
		display: inline-flex;
		width: 50%;
	}
	#menu-contact-navigation .menu-item a {
		max-width: 3.25em;
	}
	#menu-contact-navigation .menu-item:last-of-type {
		display: none;
	}
	
}

/* Tablet/Small+ Desktop */
@media screen and (min-width: 720px) {
	.alignright{
		float: right;
		margin: 0 0 .5em 2em;
	}
	.alignleft{
		float: left;
		margin: 0 2em .5em 0;
	}

	.page-template-default #branding a {
		width: 220px;
		height: 105px;
		margin: 10px 0 10px 30px;
	}
	#menu {
		font-size: .7em;
		flex: 0 0 auto;
		align-self: center;
		display: flex;
		flex-flow: row;
		justify-content: flex-end;
		padding: 0 30px 0 0;
	}
	#menu > div,
	#menu .menu,
	#menu .menu-item {
		display: inline;
		margin: 0;
	}
	.page-template-home #menu {
		order: 0;
		width: auto;
		margin: 10px auto;
		padding: 0;
	}
	#menu .menu-item {
		margin: 0 0 0 .8em;
	}
	#menu .menu-item a {
		transition: all .3s ease-in-out;
	}
	#menu-contact-navigation .menu-item {
		display: none;
	}
	#menu-contact-navigation .menu-item:last-of-type {
		display: inline-block;
	}
	.nav-description {
		display: inline;
	}
	#menu .menu-contact-navigation-container .menu {
	}	

	
	body.page-template-home-hiatus,
	body.page-template-home {
		padding: 0;
		background-color: rgb(21, 55, 41);
		background-position: center -15vh;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.page-template-home-hiatus #branding,
	.page-template-home #branding {
		margin-top: 40px;
		width: 480px;
		height: 230px;
		order: 1;
	}
	
	#features .main-topics-navigation {
		font-size: 2em;
		display: block;
		margin: 0;
	}
	#features .main-topics-navigation > .menu-item {
		display: inline-block;
		vertical-align: top;
		width: 48%;
		margin-bottom: 1em
	}
	#features .main-topics-navigation > .menu-item:nth-of-type(2) {
		margin: 0;
	}
	#features .main-topics-navigation > .menu-item a {
	}
	#features .main-topics-navigation .nav-detail {
		margin: 0 40px 0;
	}
	.page-template-home-hiatus #content,
	.page-template-home #content {
		margin: 2em auto;
		max-width: 39em;
		line-height: 1.8em;
	}
	.page-template-home #content h2 {
		font-size: 3.4em;
		max-width: 8em;
	}

	.page-template-home #content p {
		font-size: 1.1em;
	}


	/* Default Page Layout */
	.page-template-default #branding {
	}
	.page-template-default .menu-contact-navigation-container {
		margin-right: calc( (100% - 1024px) / 2 );
	}
	.page-template-default #content .entry-content-container {
		display: flex;
		flex-flow: column wrap;
		justify-content: space-between;
		padding: 3em 30px 0;
	}
	.page-template-default .main-topics-navigation > .menu-item > a,
	.page-template-default #menu-contact-navigation > .menu-item > a {
		color: #000;
		font-weight: 300;
	}
	.page-template-default #header {
		position: sticky;
		display: flex;
		flex: 0 0 100%;
		top: 0;
		left: 0;
		right: 0;
		flex-flow: row nowrap;
		padding: 0 calc( (100% - 1024px) / 2 );
		background-color: #fff;
		justify-content: space-between;
		z-index: 999;
		box-shadow: 0px 1px 6px rgba(58, 31, 0, 0.2);
	}

	.page-template-default #content .header h1 {
		color: #fff;
		margin: 0 auto;
		font-size: 3em;
		padding: 1.25em 30px .3em;
	}
	.page-template-default #content .header h1,
	.page-template-default #content .entry-content-container {
		max-width: 1024px;
		margin: 0 auto;
	}
	.page-template-default .entry-content {
		flex: 0 0 60%;
		align-self: flex-start;
		vertical-align: top;
	}
	.page-template-default #sidebar {
		border-width: 1px 0 0;
		border-style: solid;
		border-color: rgba(0,0,0,0.15);
		margin: 60px 0 0;
	}
	#content img {
		min-width: 100px;
		max-width: 250px;
	}
	#content img.alignright {
		margin: 0 0 1em 1.5em;
	}

	/* Edit Page Link */
	body {
		padding: 0;
	}
	.header .post-edit-link {
		position: fixed;
		left: 0;
		background-color: gold;
		padding: .5em;
		text-decoration: none;
		border-radius: 0 6px 6px 0;
		box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
		color: #000;
	}

	/* Home newsletter form */
	.home .yikes-mailchimp-form-description-1 {
		font-size: 1.2em;
		margin: 0 auto .5em;
		max-width: 22em;
	}
	#newsletter-signup-1 {
		display: flex;
		max-width: 24em;
	}
	#sidebar .widget-area {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-content: flex-start;
	}
	#sidebar .xoxo {
		flex: 0 0 48%;
		margin: 0 auto 20px;
	}
	

	#footer {
		padding: 60px 0 30px;
	}
}

/* Tablet Landscape/Small+ Desktop */
@media screen and (min-width: 1024px) {
	body.page-template-home-hiatus,
	body.page-template-home {
		background-position: center top;
		background-size: cover;
		background-repeat: no-repeat;
	}
	.page-template-home-hiatus #branding,
	.page-template-home #branding {
		margin: 30px auto;
		width: 600px;
		height: 275px;
	}
	#menu {
		font-size: .8em;
	}
	#content .widget-area ul.xoxo {
		padding: 0;
		margin: 0;
		text-align: left;
		flex: 0 0 100%;
	}
	#content .widget-title {
		margin: 0 0 .3em;
	}	
	.page-template-default #content .entry-content-container {
		flex-flow: row nowrap;
		justify-content: space-between;
		padding: 3em 30px 0;
		align-items: stretch;
	}
	.page-template-default #sidebar {
		flex: 0 0 28%;
		padding: 0 0 0 6%;
		vertical-align: top;
		border-width: 0 0 0 1px;
		margin: 0;
	}
}

@media screen and (min-width: 1025px) {
	.page-template-default #branding a {
		margin: 10px 0;
	}	

	#menu {
		padding: 0;
	}
}