/*
 Theme name:   Talentencoaches
 Theme:		   Talentencoaches.nl
 Description:  Talentencoaches theme for Talentencoaches.nl website
 Author:       TricksWeb Design
 Designer URI: https://tricksweb.nl
 Version:      1.3.1
*/

/*
:root {
  --primary-color:          rgb(60,131,7);
  --secondary-color:        rgb(167,49,83);
  --background-color:		rgb(255,255,255);
  --text-color:             rgb(51,51,51);
  --button-text-color:      rgb(255,255,255);
  --card-color:      		#eee;
  --shadow-color:      		#000;
  --form-border-color:      #ccc;
}
*/

:root {
  --primary-color:          rgb(0,174,214); /* Cyan */
  --secondary-color:        #138e5c; /* dark green */
  --secondary-light-color:	rgb(137,198,91); /* Dollar green */
  --background-color:		#f5feff; /* off white blue */
  --text-color:             #3f0606; /* brown */
  --button-text-color:      rgb(255,255,255);
  --card-color:      		#c0f6ff; /* lighter blue */
  --shadow-color:      		#000;
  --form-border-color:      #ccc;
  --primary-light-color:    #40d6ef; /*rgb(43,195,220); /* battery charged blue */
}

::-moz-selection { /* Code for Firefox */
  color: white;
  background: var(--secondary-color);
}
::selection {
  color: white;
  background: var(--secondary-color);
}

* {
	margin: 0;
	padding:0;
	position: relative;
	box-sizing: border-box;
}

html,body {
	min-width: 320px;
	width: 100%;
	height: 100%;
}
html,body {font-size: 14px}
/* @media(min-width: 560px) { html,body {font-size: 14px} }
@media(min-width: 680px) { html,body {font-size: 15px} }
@media(min-width: 800px) { html,body {font-size: 16px} }
@media(min-width: 920px) { html,body {font-size: 17px} }
@media(min-width: 1040px) { html,body {font-size: 18px} }
@media(min-width: 1160px) { html,body {font-size: 19px} }
@media(min-width: 1280px) { html,body {font-size: 20px} } */
@media(min-width: 320px) { html,body {font-size: 14px} }
@media(min-width: 560px) { html,body {font-size: 15px} }
@media(min-width: 800px) { html,body {font-size: 16px} }
@media(min-width: 1040px) { html,body {font-size: 17px} }
@media(min-width: 1280px) { html,body {font-size: 18px} }

body { line-height: 1.618rem; }
h3 { font-size: 1.25rem; line-height: 3.236rem;}
h2 { font-size: 1.618rem; line-height: 3.236rem;}
h1 { font-size: 2.6179rem; line-height: 4.854rem;}

.multi-column {
	column-width: calc( (52rem - 0px) / 2.3); /* between 50-75 characters: minimum 50 chars. */
}
.description {
	font-size: 1rem;
	line-height: 1.2rem;
	margin-top: -0.5rem;
}            
#sitename {
	display: inline;
}
body {
	// line-height: 1.4em;
	// font-family: Arial, sans-serif;
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	background-color: var(--background-color);
	color: var(--text-color);
	text-rendering: optimizelegibility;
}

article {
	padding-top: 1px;
}
h1,h2,h3 {
	/* font-family: 'Bilbo Swash Caps', cursive;
	font-family: 'Calligraffitti', cursive; */
	font-family: Century Gothic, sans-serif;
	color: var(--secondary-color);
}
h2 {
	text-align: left;
}
.intro h2 {
//	text-align: left;
}
h3 {
	display: block;
	width: 100%;
	// background-color: var(--secondary-color);
	margin: 3rem 0 1rem;
	text-align: center;
}
section h3,
.page h3 {
	margin: 0;
	line-height: 1.618rem;
	min-height: 1.618rem;
}
.page h2 {
	line-height: 1.618rem;
	margin-top: 1.618rem;
	margin-bottom: 1.618rem;
}
.card h2 {
	line-height: 1.618rem;
}
@media all and (min-width: 601px) {
	h3 {
//		text-align: left;
	}
}

img:not(.leaflet-tile) {
	width:100%;
	max-width: 320px;
	height: auto;
	display: block;
	margin: 0 auto 1rem;
	border-radius: 5px;
}
@media(min-width: 480px) {
	img:not(.leaflet-tile) {
		width: 25%;
		max-width: 100%;
		margin-bottom: 0;
	}
	.column img:not(.leaflet-tile) {
		width: 100%;
	}
}
@media(min-width: 601px) {
	img:not(.leaflet-tile) {
		width: 25%;
		max-width: 100%;
		margin-bottom: 0;
	}
	.column img:not(.leaflet-tile) {
		width: 50%;
	}
}

@media(min-width: 800px) {
	.column img:not(.leaflet-tile) {
		width: 100%;
	}
}
/*h1, h2, h3, h4, nav ul li a, #title {*/
nav ul li a {
	color: var(--background-color);
}
a {
	color: var(--secondary-color);
	text-decoration: underline;
}
h2 a,
a h2 {
	text-decoration:none;
}
a.button {
	display: inline-block;
	text-align: center;
	padding: 0.5rem 1rem;
	color: var(--button-text-color);
	background-color: var(--primary-color);
	text-decoration: none;
	border-radius: 5px;
}
@media(min-width: 601px) {
	a.button {
		width: calc((100% - 4rem) / 8);
	}
}
img:not(.leaflet-tile) {
	border: none;
}
p {
	margin-bottom: 1.618rem;;
}
ul {
/*	padding-left: 2em;*/
}
header,
footer {
	height: 5.2rem;
	width: 100%;
}

header .button {
	min-width: calc((320px - 3rem)/2);
}
header {
	// background-color: var(--background-color);
}
.header {
//	background-color: var(--background-color);
	position: fixed;
	top:0;
	left:0;
	z-index: 2000;
}
@media all and (min-width: 800px) {
	.header {
		position: relative;
	}
}
.main {
	margin: 5.2em 1em 7rem 1em;
}
@media all and (min-width: 321px) {
	.main {
		margin-top: 5.2em;
	}
}

@media all and (min-width: 800px) {
	.main {
		margin-bottom: 5.2em;
	}
}
.frontpage .main {
	margin-bottom: 6em;
}
@media all and (min-width: 601px) {
	.frontpage .main {
		margin-bottom: 3rem;
	}
}
@media all and (min-width: 800px) {
	.main {
		margin-top: 0;
	}
}

/* Helper classes */

.text-alignleft {
	text-align: left;
}
.text-alignright {
	text-align: right;
}
.text-aligncenter {
	text-align: center;
}
img.alignleft,
img.alignright {
	margin-left: auto;
	margin-right: auto;
}
.right {
	float: right;
}
@media all and (min-width: 480px) {
	.left,
	.alignleft {
		float: left;
	}
	img.alignleft {
		margin-right: 1em;
	}
	.right,
	.alignright {
		float: right;
	}
	img.alignright {
		margin-left: 1em;
	}
}
.clear {
	clear: both;
}
.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack */
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */


.text-centered {
	text-align: center;
}
.padded {
	padding: 1rem;
}
.extra-padded {
	padding: 1.5rem;
}
.padded.non-top {
	padding-top:0;
}
.extra-padded.non-top {
	padding-top:0;
}
.ontop {
	z-index:10;
}
.ontop .ontop {
	z-index:20;
}
.ontop .ontop .ontop {
	z-index:30;
}
.ontop .ontop .ontop .ontop {
	z-index:40;
}
.hidden {
	display: none !important;
}
.wrapper {
	max-width: 1280px;
	margin: 0 auto;
}
.wrapper.blog {
	max-width: 960px;
}
.header.wrapper {
	box-shadow: 0 0 5px 0 var(--shadow-color);
	z-index: 2000;
}
@media all and (min-width: 600px) {
	.header.wrapper {
		box-shadow: none;
	}
}
.footer.full-width.wrapper {
	position: absolute;
	bottom:0;
	left:0;
	background-color: var(--primary-color);
	color: var(--background-color);
}
.full-width.wrapper {
	max-width: 100%;
	width: 100%;
	overflow:hidden;
	padding: 0;
}
.header.full-width.wrapper {
	background-color: var(--primary-color);
	overflow:visible;
}
.frontpage.wrapper,
.page.wrapper,
header.wrapper {
	min-height: 100%;
}

.backgroundimg {
	background: url('./images/soulstainability-illustration.png');
	background-size: cover;
	background-position: center bottom;
	height: calc(90vh - 12rem);
}
.full-width.wrapper.backgroundimg {
	max-width: calc(100% + 2em);
	width: calc(100% + 2em);
	margin-left: -1em;
	overflow:hidden;
	padding: 0;
}
/* Tile-structure */



/*--- FORMS ---*/

form,
.eventtext {
	width: 100%;
	height: 100%;
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
}
form ol {
	list-style: none;
	height: 100%;
}
form ol li {
	margin: 0 0 5px 0;
}
form input[type="submit"],
form input[type="submit"]:hover {
	background: var(--secondary-color);
	color: var(--button-text-color);
	text-decoration: none;
	border: none;
	line-height: 2rem;
}
form input[type="submit"]:hover {
	text-decoration: underline;
	cursor:pointer;
}
form input[type="submit"] {
	width: 100%;
}

#acceptance {
font-size: 0.8em;
}
/* #submititem { */
/* background-color: var(--primary-color); */
/* } */
#submititem img {
	width: auto;
}
form input[type="text"],
form input[type="email"],
form input[type="tel"],
form textarea {
	box-shadow: inset 0 0 0 1px var(--form-border-color);
	border: none;
	color: var(--text-color);
	height: 2em;
	width: 100%;
	padding-left: 0.5rem;
	font-size: 1em;
}
@media(min-width: 600px) {
form input[type="text"],
form input[type="email"],
form input[type="tel"],
form textarea {
	box-shadow: inset 0 0 0 2px var(--form-border-color);
}
}
form input[type="text"]:focus,
form input[type="email"]:focus,
form input[type="tel"]:focus,
form textarea:focus,
form ol li:first-child:focus {
	box-shadow: inset 0 0 0 2px var(--primary-color);
	color: var(--text-color);
}
form label {
	display: inline;
    height: 1.5rem;
    margin-left: 0.5rem;
    line-height: 1.5rem;
    color: var(--shadow-color);
}
form tr th,
form ol li:first-child label {
	display: none;
	width: 150px;
}
@media all and (min-width: 601px) {
	form tr th,
	form ol li:first-child label {
		display: inline;
	}
}
form ol li span {
	line-height: 1rem;
	display: inline;
}
form textarea {
	/*background-color: var(--background-color);*/
	color: var(--text-color);
	width: 100%;
	height:100%;
	font-family: arial, sans serif;
}
form select {
	background-color: var(--background-color);
	display: inline-block;
    border: none;
    line-height: 1.5rem;
    font-size: 0.8rem;
}
form table.eme-rsvp-form select {
    width: auto;
	padding: 0 1rem;
	box-shadow: inset 0 0 0 2px var(--form-border-color);
}
form table.eme-rsvp-form th {
    display: table-cell;
    width: 7em;
	vertical-align: top;
	font-weight: 300;
}
form table.eme-rsvp-form .eme-required-field {
	display: none;
}

@media(min-width: 601px) {
	form select {
		width: calc(100% - 8em - 0.5rem);
	}
}
form textarea:focus {
	color: var(--text-color);
}
form ol,
form ol .wpcf7,
form ol .wpcf7-form,
form ol .wpcf7 textarea {
	height:100%;
	}
form ol .wpcf7 {
	// position: absolute;
	width: 100%;
}
.wpcf7 {
    min-height: 100%;
    // position: absolute;
    width: 100%;
}

form input,
form textarea {
	font-size: 1rem;
	line-height: 1.2em;
}
form .eme-rsvp-form {
	width:100%;
}
.vcard img {
	width:100%;
}
/*other classes */

.intro {
	padding: 0 1em;
}
.content-wrapper {
	top: -82px;
}
.slides {
    width:100%;
}

.slide {
    position: absolute;
    left:0;
    top:0;
    width:100%;
	margin-left:0;
	margin-bottom:1rem;
}

.overlay {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	text-align: center;
}

.tile label {
    display: block;
	width: 100%;
	text-align: center;
    cursor: pointer;
}
.tile:hover .label-send {
    font-weight: bold;
}

/* ID's */

#portfolio-slides .tile:hover label {
    font-weight: normal;
}
#portfolio-slides .tile label:hover {
    font-weight: bold;
}
#contact-wrapper {
	color: var(--background-color);
	background-color: var(--primary-color);
	height: auto;
	margin-top: 2rem;
}
#agenda .button {
	margin: 0 auto;
}
#tagline {
	top: calc(33% - 3rem);
	padding-left: 1rem;
	padding-right: 1rem;
	color: var(--primary-color);
	font-size: 2.0rem;
	text-shadow: 0 0 8px var(--background-color);
	font-family: "century gothic",arial,sans-serif;
	display: block;
	position: absolute;
	width: 100%;
	left: auto;
	right: auto;
}
@media(min-width: 600px) {
	#tagline {
		font-size: 2.5rem;
	}
}
@media(min-width: 1200px) {
	#tagline {
		max-width: 25em;
		position: relative;
		margin: 0 auto;
		}
	}
#tagline span {
    display: inline-block;
    margin: -8px 0 8px;
    vertical-align: top;
    color: var(--secondary-color);
	text-shadow: 0 0 2px var(--background-color);
}

@media(min-width: 601px) {
	#personal-image {
		height: 100%;
		position: absolute;
	}
}

#hero-image {
	height: 100%;
	
	//padding-bottom: calc(100vh - 5.5rem);
//	background-image: url("soulstainability-illustration.png");
//	background-size: contain;
	margin-bottom:0;
}
#hero-image img {
	height: 100%;
}
@media(min-width: 1200px) {
#hero-image {
//	padding-bottom: calc(90vh - 4.5rem);
}
}

#scroll {
	height: 15%;
}
#scroll span {
	margin: 0 auto;
	display: block;
	text-align: center;
	transform: rotate(90deg);
}

#overmij {
	padding: 0 1rem;
}

.tile .label-send {
	padding-top: calc(50% - 0.75rem);
	padding-bottom: calc(50% - 0.75rem);
	font-size: 1.2rem;	
	font-family: Arial, sans serif;
	color: var(--button-text-color);
    font-weight: normal;
	text-align: center;
}
#contact {
	font-size: 1rem;
	line-height: 1.5em;
}
@media all and (min-width: 600px) {
	#contact {
		padding-top: 2rem;
	//	font-size: 0.75rem;
	}
}
#contact h2 {
	line-height: 1em;
	margin-bottom: 0.5em;  
	margin-top:1rem;
	color: var(--background-color);
	text-align: left;
}
#contact a {
	color: var(--background-color);
}
#contact .tile.submit .tile-content {
	background-color: var(--secondary-color);
	color: var(--button-text-color);
//	cursor: pointer;
}

#contact .tile:first-child {
	width: 100%;
}
@media(min-width: 600px) {
	#contact .tile:first-child {
		width: calc((100% - 3rem) / 4);
	}
}

/* extra */

#contact .mailform {
    width: 100%;
}
@media(min-width: 600px) {
	#contact .mailform {
		
	}
}

#contact .tile:first-child .tile-content {
	padding: 0 1rem;
}

@media(min-width: 600px) {
	#contact .medium-tile .tile-content::before {
		padding-bottom: calc((100% - 1rem) / 2 + 4rem);
	}
}

#hpitem {
    display: none;
}
#messageitem {
	height: 6rem;
}

#logo {
	float: left;
	margin-top: 0.4rem;
	width: 3.83rem;
}

#title a {
	position: relative;
    border-width: 0;
    z-index: 10;
    text-decoration: none;
    color: var(--background-color);
    margin: 0;
}
#title .description {
	color: var(--background-color);
}
#title .description a{
	text-decoration: underline;
}

#title {
	width: calc(100% - 4em);
	max-width: 32em;
	height: 4rem;
	padding-left: 0.5rem;
	float: left;
}
/*@media(min-width: 601px) {*/
	#title {
		//font-size: 2.2em;
		//width: 28em;
		line-height: 4rem;
	}
/*}*/
#title a:hover { /* ??? */
	border-width: 0 !important;
}
#title p {
	font-size: 1.0224rem; //1.6667rem;
}
#title p {
	color: var(--primary-color);
	float: left;
	margin: 0;
	text-shadow: none;
}
#title span {
	font-size: 1em;
	line-height: 1em;
}

@media(max-width: 600px) {
	#title span {
		display: none;
	}	
}

@media(min-width: 600px) {
	#logo {
		width: 6.25rem;
		margin-top:0;
	}

	#title p {
		font-size: 1.6667rem;
	}
}
.arrow {
    display: block;
    height: 100%;
    margin: 0 auto;
    text-indent: -100%;
    width: 100%;
	}
.arrow::after {
    border-color: var(--background-color) var(--background-color) var(--primary-color) var(--primary-color);
    border-radius: 0 100% 0 0;
    border-style: solid;
    bottom: 35%;
    content: "";
    height: 40%;
    left: 25%;
	top: 25%;
    position: absolute;
    transition: all 0.2s ease-in-out 0s;
    width: 40%;
}
.arrow:hover::after {
//    border-color: var(--background-color) var(--background-color) var(--primary-color) var(--primary-color);
	border-width:4px;
}

.arrow.up::after {
    transform: rotate(135deg);	
}
.arrow.down::after {
    transform: rotate(-45deg) translate(0.75em, -0.75em);	
}
.arrow.left::after {
    transform: rotate(45deg);	
}
.arrow.right::after {
    transform: rotate(-135deg);	
}
a.arrow {
	width:3rem;
	height:3rem;
}
a.arrow::after {
	border-color: var(--background-color) var(--background-color) var(--primary-color) var(--primary-color);
}
.continue-link {
    border-radius: 50%;
    border-style: solid;
    border-width: 3px;
    color: var(--button-text-color);
    display: block;
    height: 3em;
    margin: 0 auto;
    text-indent: -100%;
    width: 3em;
}
footer {
	height: 3em;
}
footer .left,
footer .right {
	text-align:center;
	width:100%;
}
footer ul {
	display: block;
	list-style: none;
	width: 100%;
}
footer li {
	display: block;
	float: left;
	text-align: center;
	width:33.33%;
}
footer li a {
	color: var(--background-color);
}
#contact form {
	margin-bottom: 1em;
}

footer li {
	width: 100%;
	line-height: 1.618em;
}
footer ul {
	margin-bottom: 1em;
}
footer .left {
	text-align: center;
	padding-left: 0;
	}
	footer .right {
	text-align: center;
	padding-right: 0;
	}

@media all and (min-width: 800px) {
	footer li,
	footer .left,
	footer .right {
		width: 33.33%;
	}
	footer .left {
		text-align:left;
		padding-left: 1rem;
	}
	footer .right {
		text-align:right;
		padding-right: 1rem;
	}
}

/* Responsive menu */
/* nav { */
	/* width: 100%; */
	/* padding-right: 1rem; */
	/* text-align: right; */
/* } */
/* nav ul { */
	/* float: right; */
    /* line-height: 1.5rem; */
    /* list-style: outside none none; */
	/* margin-top: 0.5rem; */

/* } */
/* nav ul li { */
	/* display: block; */
	/* float: left; */
	/* height: 100%; */
	/* position: relative; */
	/* vertical-align: middle; */
/* } */
/* nav ul li a { */

	/* padding: 0 0.5rem; */
/* } */
/* nav ul li:last-child a { */
	/* padding-right: 0; */
/* } */

.user-Longitude-wrap,
.user-Lattitude-wrap {
	display: none;
}

.frontpage nav,
.frontpage nav ul,
.frontpage nav li {
	color: var(--background-color);
}
nav,
nav ul,
nav li {
	color: var(--background-color);
	width:100%;
}
nav,
nav ul
nav ul li,
nav ul li a {
	z-index: 2000;
}
nav a {
	color: inherit;
	display: block;
	height: 100%;
	text-decoration: none;
	width: 100%;
	//max-width: 10em;
}
nav ul {
	padding-left: 0;
}
nav>ul>li:hover,
nav>ul>li:hover>a,
nav ul li:hover,
nav li li:hover>a {
background-color: var(--primary-color);
color: var(--background-color);
}
/* nav li li:first-child {  */
	/* border-top: 1px solid #aaa; */
/* } */

nav label {
	cursor: pointer;
}
nav li {
	/* box-shadow: inset 0 0 1px 1px #aaa; */
	line-height: 2em;
	text-align: center;
	vertical-align: middle;
}
nav li.current_page_item>a,
nav li.current_page_parent>a {
	font-weight: bold;
}
nav li.page_item_has_children>a {
	cursor: default;
	pointer-events: none;
	text-decoration:none;
}
nav li.page_item_has_children::after {
	bottom:0;
	font-size: 1em;
	margin-left: 5px; content: '\25BC';
	position: absolute;
	right: 0;
	top:0;
	vertical-align: middle;
}
nav li:hover a ~ .children,
nav li:focus a ~ .children {
	max-height: 400px;
	transition: max-height 0.25s ease-in-out;
}
nav li li {
	border-bottom: 1px solid var(--primary-color);
}

nav ul {
	list-style: none;
}
nav .children {
	background-color: var(--background-color);
}
nav .children {
	height: auto;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.25s ease-in-out 0.25s;
}
nav .menu-close,
nav .menu-switch,
nav .menu-switch ~ ul {
	display: none;
}
nav .menu-switch:checked ~ ul {
	display: block;
}
@media all and (min-width: 910px) {
	nav,
	nav ul,
	nav li {
		width:auto;
	}
	nav {
		float: right;
	}
	nav li {
		line-height: auto;
	}
	nav li.page_item_has_children::after {
		line-height: 3em;
	}
	nav>ul>li {
		box-shadow: none;
		float: left;
		border-style: solid;
		border-width: 0 0 1px 0;
		border-color: var(--background-color);
		margin-left: 0.5rem;
	}
	nav>ul>li a {
		padding: 0.5em 1em 0.5em 0.5em;
	}				
	nav .menu-open {
		display: none;
	}
	nav .menu-switch ~ ul {
		display: block;
	}
}

@media all and (max-width: 910px) {
	nav li.current_page_item>a {
		// background-color: var(--primary-color);
		color: var(--background-color);
		text-align: center;
	}
	nav>ul>li>a {
		font-weight: bold;
	}
	.responsive-menu-button, .responsive-close-button {
		margin-right: 1rem;
		margin-top: 0.25rem;
		display: block;
		line-height: 1.5em;
		float: right;
	}
	.responsive-menu-button a, .responsive-close-button a {
		width: 100%;
		text-decoration: none;
	}
	.responsive-close-button {
		margin-right: 0rem;
	}
	.responsive-menu-button {
		display: inline-block;
	}
	.responsive-menu-button:before {
		content: "\2630";
		margin: 1rem 0.2rem 0.4rem 0;
		font-size: 2em;
		display: block;
		text-align: center;
		}
	.responsive-close-button {
		display:none;
	}
	.responsive-close-button:before {
		content: "\2630";
		font-size: 1.2rem;
		margin-top: -0.5rem;
	}
	#nav-menu ~ ul {
		display: block;
		width: 100%;
		height: 0;
		list-style: outside none none;
		overflow: hidden;
		transition: opacity 0s linear;
		background-color: var(--background-color);
		opacity: 0;
		position: fixed;
		left: 0;
		right: 0;
		top: 5.2rem;
		vertical-align: middle;
		text-align: center;
	}
	#nav-menu:checked ~ ul {
		opacity: 0.9;
		z-index: 100;
		transition: opacity 0.25s linear;
		height: calc( 100vh - 5.2rem );
		font-size: 1.6em;
	}
	#nav-menu:checked ~ ul li {
		height: 25%;
	}

	#nav-menu ~ ul li {
		width: 100%;
		// height: 3em;
		line-height: calc((100vh - 5.2rem)/4);
		border-style: solid;
		border-width: 2px 0 0;
		border-color: var(--background-color);
		transition: font-size 0.2s ease-in-out 0s;
	}
	#nav-menu ~ ul li:last-child {
		border-width: 2px 0;
	}
	#nav-menu ~ ul li:hover {
		font-size: 1.2em;
	}
}

@media all and (min-width: 911px) {
	.responsive-menu-button, .responsive-close-button {
		display: none;
	}
}


@media all and (min-width: 910px) {
	nav {
		float: right;
		height: 3rem;
		margin-top: 1.2rem;
	}
}

.page nav li {
	color: var(--background-color);
}
.page nav li li:hover>a {
background-color: var(--background-color);
color: var(--primary-color);
}
.page nav .children {
	background-color: var(--primary-color);
}
@media all and (min-width: 910px) {
	.page nav>ul>li {
		border-color: var(--background-color);
	}
}
@media all and (max-width: 910px) {

	.page #nav-menu ~ ul {
		background-color: var(--primary-color);
	}
}
.page .header.full-width.wrapper {
    background-color: var(--primary-color);
}
.page #title a,
.page #title .description {
    color: var(--background-color);
}
.page nav ul li a {
	color: var(--background-color);
}

/* Cards */

.card {
	display: block;
	z-index: 1;
}
/* aanpassen: */
.card>a {
	margin: 1rem 1rem 1rem 0 !important;
}
@media all and (min-width: 768px) {
	.card>a {
		margin: 1rem !important;
	}
}
.next.card>a {
	margin: 0  0 1rem 0!important;
}
/* ... */
.card>a,
.card>.container {
	float: left;
	max-height: 13em;
	width: 100%;
	min-height: 100%;
	background-color: var(--card-color);
	margin: 0;
	border: 0;
	font-size: 1rem;
	border-radius: 5px;
	overflow: hidden;
}
.card>a:hover,
.minicard:hover {
	box-shadow: inset 0 0 0 2px var(--primary-color);
}
@media all and (min-width: 768px) {
	.card>a {
		width: calc( 50% - 2rem );
	}
	.next.card>a {
		width: 100%;
	}
}

.card h1 {
	font-size: 20px;
	float: left;
	color: var(--secondary-color);
	//margin: 1rem 0 0.5rem;
	margin: 0 0 0.5em;
	line-height: 1.618em;
	height: 3em;
}
.card h2 {
	font-size: 14px;
	position: absolute;
	top:0;
	right:0;
	padding-right: 0.5rem;
	color: var(--text-color);
	margin: 0;
}
.card span {
	color: var(--shadow-color);
}
.card-link {
	width: 100%;
	text-align: right;
	padding: 0 1rem;
}

.user.card {
	width: 100%; /*calc(50% - 2rem);*/
    float: left;
}
.user.card a {
	text-decoration: none;
}
.user.card a:hover {
	text-decoration: underline;
}
/* .card-image:after { */
	/* position: absolute; */
	/* top:0; */
	/* left:0; */
	/* bottom:0; */
	/* right:0; */
	/* content:" "; */
	/* background-color: rgba(255,0,0,0.5) */
/* } */
.user.card p {
	margin-bottom: 0;
}
.user.card h1 {

    font-size: 20px;
    float: none;
    color: var(--secondary-color);
    margin: 0;
    line-height: 1.618em;
    height: auto;

}
.reiki.card .card-icon{
	color: var(--secondary-color);
	border-color: var(--secondary-color);
}
.reiki.card .card-icon::before,
.reiki.card .card-icon::after {
	border-color: var(--secondary-color);
}
.reiki.card .card-icon::after {
	box-shadow: 1.575em 0 0px 0px var(--secondary-color);
}

.reiki.card>a:hover {
	box-shadow: 0 0 0 1px var(--secondary-color);
}

.card .card-icon {
	font-size: 1.5em;
	margin: 1rem 0.5rem 0.5rem;
	padding: 0.5rem;
	width: 2.5em;
	font-family: Arial;
	color: var(--primary-color);
	border: 3px solid var(--primary-color);
	text-align: center;
	float: left;
	border-radius: 5px;
}
.card .card-icon::before {
	content: " ";
	position: absolute;
	left: 0.35em;
	top: -0.35em;
	height: 1rem;
	border-width: 0 3px 0 3px;
	border-color: var(--primary-color);
	border-style: solid;
	display: block;
	width: calc(100% - 0.825em);
}
.card .card-icon::after {
	content: " ";
	position: absolute;
	left: calc(0.35em - 2px);
	top: calc(0.35em - 6px);
	height: 3px;
	border-width: 2px;
	border-color: var(--primary-color);
	border-style: solid;
	border-radius: 50%;
	display: block;
	width: 3px;
	box-shadow: 1.575em 0 0px 0px var(--primary-color);
}
.card .card-icon i {
	font-weight: normal;
	font-style: normal;
	font-size: 0.75em;
}
.card .card-content {
	width: calc( 100% - 6.5em );
	float: left;
	height: auto;
	margin: 0.5rem 0 0 0.5rem;
}
.next.card .card-content {
	width: 100%;
}

.card .card-content p {
	height: 3.236rem;
	margin: 0;
}
#authorlist {
	width: 100%;
}
@media all and (min-width: 870px) {
	#authorlist {
		width: calc(100% - 1em);
	}
}

#authorlist .card .card-content p {
	height: auto;
	margin-bottom: 1rem;
}
.user.card .card-content {
	width: calc( 100% - 100px - 2em );
}
.card .card-content.left {
	float: left;
}
.card .card-content.right {
	float: right;
}
.card .card-image {
	display: none;
	position: absolute;
	top:0;
	right:0;
	bottom:0;
	left: calc(100% - 7em);
	background-size: cover;
	background-position: center center;
}

.card .card-footer a {
	color: var(--secondary-color);
}
.card .card-image.left {
	right: calc(100% - 7em);
	left:0;
}
.user.card .card-image.left {
	right: calc(100% - 100px);
	left:0;
}
.card .card-image.right {
	left: calc(100% - 7em);
	right:0;
}
@media all and (min-width: 480px) and (max-width: 768px) {
	.card .card-image {
		display: block;
		left: 75%;
	}
	.card .card-content {
		width: calc(75% - 6.5em);
	}
}
@media all and (min-width: 1024px) {
	.card .card-image {
		display: block;
		left: 75%;
	}
	.card .card-content {
		width: calc(75% - 6.5em);
	}
}

/* columns */

.column {
    margin: 0 1rem 2rem 1rem;
    width: auto;
}
@media all and (min-width: 600px) {
	.column {
		min-height: 150px;
	}
}
@media all and (min-width: 800px) {
	.column {
		margin-top: 0;
		float: left;
	}
}
.column h2 {
	margin-top: 1rem;
}
@media all and (min-width: 800px) {
	.column h2 {
		margin-top: 2rem;
	}
}

.column h2 p {
	display: inline;
	margin:0;
	padding:0;
}
/* .intro.columns { */
    /* margin-top: calc( -8.333% - 16px); */
/* } */
@media all and (min-width: 800px) {
.columns1,
.columns2,
.columns3,
.columns4,
.columns5 { width: 100%;}
.column { width: 100%; }
.columns2>.column { width: calc(50% - 2rem); }
.columns3>.column { width: calc(33.33% - 2rem); }
.columns4>.column { width: calc(25% - 2rem); }
.columns5>.column { width: calc(20% - 2rem); }
.columns2>.double-column { width: calc(100% - 2rem); }
.columns3>.double-column { width: calc(66.66% - 2rem); }
.columns4>.double-column { width: calc(50% - 2rem); }
.columns5>.double-column { width: calc(40% - 2rem); }
}

/*Icons */


.icon-wrapper {
	margin: 0 auto;
	position: absolute;
	top:0;
	bottom:0;
	left: 0;
	right: 0;
}
.icon-wrapper img {
	margin: 3px auto;
	display: block;
	max-width: calc(100% - 6px);
	max-height: calc(100% - 6px);
	width: auto;
	height: auto;
}
.icon-positioning {
	width: 33%;
	height: 0;
	padding-bottom: 33%;
	margin: 0 auto 0;
	border-radius: 50%;
	border: 3px solid var(--primary-color);
	background: var(--background-color);
	box-shadow: 0 0 0 5px var(--background-color);
}
@media all and (min-width: 480px) {
.icon-positioning {
	width: 150px;
	padding-bottom: 150px;
	}	
}
@media all and (min-width: 600px) {
.icon-positioning {
	float: left;
	margin-top: 1rem;	
	margin-right: 1rem;	
	}	
}
@media all and (min-width: 800px) {
.icon-positioning {
	float: none;
	width: 50%;
	padding-bottom: 50%;	
	margin-top: 0;	
	margin-right: auto;	
	}	
}
.intro {
	margin: 0;
}

.intro-icons {
	margin-top: 1em;
	z-index: 1;
}
@media all and (min-width: 800px) {
	.intro-icons {
		//	height: 16.67%;
		margin-top: calc( -8.333% + 16px);
	}
}
.intro-links {
	text-align: right;
}
.intro-summaries h2 {
	margin: 0;
	text-align: center;
}

a.intro-link {
	display: block;
	margin-top: 1rem;
	float: right;
}



/* Quotes collection */
blockquote.quotescollection q {
	font-style: italic;
	font-weight: inherit;
}
blockquote.quotescollection cite {
    display: block;
	font-style: normal;
	font-weight: bold;
}
blockquote.quotescollection .author {
	display: block;
	margin-top: 1em;
}

.eme-location-balloon{
	font-size: 100% !important;
}

.eme-location-balloon form input[type="submit"]{
	margin-top: 0.5em;
}

.eventdetails {
	margin-bottom: 1rem;
}
.eme_submit_button {
	box-shadow: inset 0 0 0 2px var(--button-text-color);
	width: calc( 100% - 4px );
}

#div_eme-rsvp-form {
	margin-bottom: 1rem;
}
@media all and (min-width: 1280px) {
	.event {
		float: left;
	}
	.eme-rsvp-form textarea {
		height: 5em;
	}
	.eme-location-map {
		width: calc( 100% - 480px ) !important;
		height: 360px;
		margin: 0 auto;
	}
	#map-up {
	display: none;
	}
}


.leaflet-control-container {
	height: 100%;
}
/*******************************
* new
********************************/

.photo-frame {
	padding-bottom: 70%;
	width: 100%;
	padding-bottom: 100%;
	margin-bottom: 1em;
	overflow: hidden;
	border-radius: 0.5rem;
}
.photo-frame:after{
	clear: both;
}
.photo-frame img:not(.leaflet-tile) {
	position: absolute;
	min-width: 70%;
	left: 50%;
	top: 50%;
	-webkit-transform: translateY(-50%) translateX(-50%);
	-moz-transform: translateY(-50%) translateX(-50%);
	transform: translateY(-50%) translateX(-50%);
}
@media(min-width: 321px) {
	.photo-frame img:not(.leaflet-tile) {
		min-width: 100%;
		min-height: 100%;
		width: auto;
		height: auto;
		object-fit: cover;
	}
}

.profile {
	padding-top: 1.618em;
}

.profile aside {
	width: 100%;
	max-width: 320px;
	margin: 0;
	height: auto;
	margin: 0 auto;
}
@media(min-width: 480px) {
	.profile aside {
		width:33.33%;
		margin: 0 1em 1em 0;
	}
}
@media(min-width: 800px) {
	.profile aside {
		width:25%;
		float: none;
		margin: 0;
		float: left;
	}
}

.role {
	display: block;
	text-align: center;
	padding: 0 1em;
	color: #000000;
	border-radius: 5px;
	border: 2px solid var(--primary-color);
	background-color: var(--primary-light-color);
}
.card .role {
	font-size: 0.8em;
	padding: 0 0.5em;
	width: 5em;
	margin-right: 1em;
}
.profile aside .role {
	display: block;
	margin-bottom: 1em;
}
@media(min-width: 800px) {
	.profile aside .role {
		.profile aside .role {
			width: 70%;
		}
	}
}
.role.teacher {
	border: 2px solid #df8d00;
	background-color: #fea50d;
}
/*.role.coach {
	border: 2px solid var(--secondary-color);
	background-color: var(--secondary-light-color);
}
.role.partner {
	border: 2px solid var(--primary-color);
	background-color: var(--primary-light-color);
}*/
.profile .main {
	margin: 1em 0 0 0;
}
@media(min-width: 800px) {
	.profile .main {
		margin: 0 0 0 0;
		width:75%;
		float: right;
	}
}

.profile .bio {
/*	padding: 0 1em 1em 1em;*/
}
@media(min-width: 800px) {
	.profile .bio {
		padding: 0 0 1em 2em;
	}
}
.profile .bio ul {
	list-style: none;
	padding-left: 2em;
}
.profile ul.links {
	list-style: none;
	padding-left: 0;
}

.profile h2 {
	text-align: left;
}

.profile ul {
	list-style: none;
	padding:0;
	display: block;
}
.profile li {
	text-align: center;
	padding: 0 1em;
	border-left: 1px solid var(--secondary-color);
}

.profile li:first-child {
	padding-left: 0;
	border-left: none;
}

.profile ul,
.profile li {
	display: inline-block;
}

#agenda h2 {
	margin-top: 2em;
}

.coacheslist li {
clear: left;
float: left;
margin: 0 0 5px 0;
}

.coacheslist img.photo {
width: 40px;
height: 40px;
float: left;
}

.coacheslist div.authname {
margin: 20px 0 0 10px;
float: left;
}

.coacheslist {
	width: 100%;
}
.coacheslist aside {
	display: none;
}

.coacheslist .card {
	margin-bottom: 1em;
}
.coacheslist .container {
	min-height: 100px;
}
@media(min-width: 600px) {

	.coacheslist .container {
		height: 8.5em;
	}
	.coacheslist .card {
		width: calc(50% - 0.5em);
	}
	.coacheslist .card:nth-child(2n) {
		margin-left: 0.5em;
	}
	.coacheslist .card:nth-child(2n-1) {
		margin-right: 0.5em;
	}
}
@media(min-width: 870px) {
	#authorlist {
		width: 100%;
		overflow-y: auto;
	}
	.coacheslist {
		width: 33%;
		float: left;
	}
	.coacheslist .container {
		height: auto;
	}

 	.coacheslist .card {
		height: auto;
		min-height: 100px;
	}
	.coacheslist .card:nth-child(n) {
		margin-bottom: 1em;
		width: calc(100% - 1em);
		margin-left: 0;
		margin-right: 0;
	}
	.coacheslist~aside {
		display: block;
		width: 67%;
		height: 50%;
		float: right;
	}
}

#coaches_map {
	height: calc(100vh - 7rem - 1em - 4.854rem - 4.854rem + 2.5rem) !important;
}
@media(min-width: 870px) {
	#authorlist {
		height: calc(100vh - 7rem - 1em - 4.854rem - 4.854rem) !important;
	}
}

#header-logo {
	display: inline;
	float: left;
	height: 4rem;
	width: 4rem;
}
#sitename {
	font-size: 1.5em;
}
@media(min-width: 910px) {
	#header-logo {
		display: inline;
		float: left;
		height: 5.2rem;
		width: 5.2rem;
	}
	#sitename {
		font-size: 2.2em;
	}
	#title {
		height: 5.2rem;
		line-height: 3.5rem;
	}
}

.leaflet-popup-content {
    overflow: hidden;
}
.leaflet-popup-content h2 {
    color: var(--secondary-color) !important;
}
.leaflet-popup-content a {
    color: var(--secondary-color) !important;
}
.leaflet-popup-content .route-link {
    color: var(--primary-color) !important;
}

.filter {
	width: calc(100% - 1rem);
	background-color: var(--card-color);
	margin-bottom: 1rem;
	border: 2px solid var(--primary-color);
	border-radius: 5px;
}
.filter:after {
	content:" ";
	width:0;
	height:0;
	border-style: solid;
	border-width: 8.7px 5px 0 5px;
	border-color: var(--primary-color) transparent transparent transparent;
	position: absolute;
	display: inline-block;
	right: 10px;
	top: 10px;
	z-index: 10;
}
.filter span,
.filter select {
	display: inline-block;
	height: 1.5rem;
	font-size: 0.8rem;
	border: 0px solid;
}
.filter span {
	display: inline-block;
	font-size: 0.8rem;
	font-weight: bold;
	height: 1.5rem;
	margin-top: -0.2rem;
	padding-left: 1rem;
	vertical-align: middle;
	width: 100px;
}
.filter select {
	-webkit-appearance: none;
    -moz-appearance: none;
	background-color: transparent;
	position: absolute;
	height: 1.3rem;
	width: calc( 100% - 104px );
	margin-top: 4px;
	z-index: 10;
	border-bottom: 1px solid transparent;
}
.filter select:hover {
	border-bottom: 1px solid #000;;
}
select option {
    background: var(--card-color);
}

/* USER GRID */
.user.grid-item:nth-child(3n+1){
	margin-left: 0;
}
.user.grid-item {
	width: calc(33% - 1rem);
	float: left;
	margin-left: 1rem;
}
.user.grid-item:after {
  content: "";
  display: block;
  padding-bottom: calc( 100% + 1rem );
}
.user.grid-item .container,
.user.grid-item .container a {
	display: block;
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}

.user.grid-item span {
	font-size: 1rem;
	line-height: 1.5rem;

}
.user .grid-item-footer {
	position: absolute;
	bottom: -1rem;
	left: 0;
	right: 0;
	height: auto;
	text-align: center;
		color: var(--primary-color);
	background-color: var(--card-color);
}
.square {
	width:100%;
	height:0;
	display: block;
	padding-bottom: 100%;
}
.square-container,
.square-container a {
	display: block;
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
}

#authorlist {
	width: calc(100% - 1rem);
	display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-rows: min-content;
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
	margin-bottom: 1rem;
}
@media(min-width: 600px) {
	#authorlist {
		grid-template-columns: 1fr 1fr 1fr 1fr;
	}
}@media(min-width: 870px) {
	#authorlist {
		grid-template-columns: 1fr 1fr;
	}
}

@media(min-width: 1024px) {
	#authorlist {
		grid-template-columns: 1fr 1fr 1fr;
	}
}
	
.minicard {
	display: block;
	border-radius: 5px;
	overflow: hidden;
}
.minicard-image>div {
	background-size: cover;
	background-position: center bottom;
}
.minicard-footer {
	text-align: center;
	font-size: 0.8rem;
	font-weight: bold;
	height: 2.4rem;
	line-height: 1.2rem;
	color: var(--primary-color);
	background-color: var(--card-color);
}

.social {
	color:  var(--secondary-color);
}
.social a {
	text-decoration: none;
}
.social a .icon {
	margin-left: 0.5rem;
	font-size: 1.2em;
}
.social a span:not(.icon) {
	display: inline-block;
	overflow: hidden;
	text-indent: -999px;
}

@font-face {
  font-family: 'icomoon';
  src: url("./fonts/icomoon.eot?-f6t52o");
  src: url("./fonts/icomoon.eot?#iefix-f6t52o") format("embedded-opentype"), url("./fonts/icomoon.woff?-f6t52o") format("woff"), url("./fonts/icomoon.ttf?-f6t52o") format("truetype"), url("./fonts/icomoon.svg?-f6t52o#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
