/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								fonts (zelf gehost, alleen de latin-tekens en alleen de gebruikte varianten)
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@font-face {
	font-family: "Mulish"; font-style: normal; font-weight: 200 1000; font-display: swap;
	src: url("fonts/Mulish-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Mulish"; font-style: italic; font-weight: 200 1000; font-display: swap;
	src: url("fonts/Mulish-italic-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Cormorant Infant"; font-style: normal; font-weight: 300 700; font-display: swap;
	src: url("fonts/CormorantInfant-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Cormorant Upright"; font-style: normal; font-weight: 300; font-display: swap;
	src: url("fonts/CormorantUpright-300-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								general for whole site
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
*										{margin: 0; padding: 0; border: 0; outline: none; box-sizing: border-box; -webkit-box-sizing: border-box;}

html									{font-size: 16px; width: 100vw; height: 100%; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -o-text-size-adjust: 100%;}
body									{overflow-X: hidden; overflow-Y: auto; text-align: center; width: 100vw; height: 100%; line-height: 1.5; font-family: Mulish, Arial, sans-serif; cursor: default; color: #000000;
										 background: #F3EAD8; opacity: 0; -webkit-transition: opacity 1s; transition: opacity 1s;}
	body.loaded							{opacity: 1;}
	body.busy *							{cursor: progress !important;}

a										{line-height: 2.5rem; text-decoration: none; cursor: pointer; color: inherit; white-space: nowrap; -webkit-transition: 0.25s; transition: 0.25s;}
	a i									{vertical-align: middle; margin-right: 0.05rem; font-size: 1.25em;}

.icon								{display: inline-block; line-height: 1;}
	.icon svg						{width: 1em; height: 1em; fill: currentColor; vertical-align: -0.125em;}

input, select, textarea					{font-family: inherit; font-size: inherit; font-weight: normal; color: inherit; resize: none;}

h1, h2, h3, h4, h5, h6, h7				{margin: none; font-size: 1rem; font-weight: normal; font-family: "Cormorant Infant";}
h1										{position: relative; margin-bottom: 4rem; font-size: 3rem;}
	h1:after							{content: ""; position: absolute; left: -0.5rem; bottom: -0.5rem; width: calc(100% + 1rem); height: 5px; background: -webkit-gradient(linear, left top, right top, from(#70823E), to(transparent));
										 background: linear-gradient(to right, #70823E, transparent); border-radius: 2px;}
h2, h3, .title							{position: relative; font-size: 2.5rem;}
	h2:after, h3:after, .title:after	{content: ""; position: absolute; left: -0.5rem; bottom: -0.5rem; width: calc(100% + 1rem); height: 5px; background: -webkit-gradient(linear, left top, right top, from(#70823E), to(transparent));
										 background: linear-gradient(to right, #70823E, transparent); border-radius: 2px;}
.title									{margin-bottom: 1em; font-family: "Cormorant Infant";}

img										{-webkit-user-drag: none;}

.button									{padding: 0 1rem; background: #E0B44A; color: #FFFFFF; border-radius: 0.5rem; -webkit-transition: background 0.25s; transition: background 0.25s; cursor: pointer;}
	.button:hover						{background: #D8853F;}

.block									{position: relative; left: 0; top: 0; width: 100%; padding: 7rem 0;}
	.block .wrapper						{position: relative; display: inline-block; width: 1280px; max-width: calc(100% - 2rem); font-size: 0;}
		.block .wrapper > a:not(.blog):not(.event)	{border-bottom: 3px solid #70823E;}
	.block ul							{padding-left: 1em; line-height: 2em;}
		.block ul.checkmarks			{list-style: none; padding-left: 1.75em;}
		.block ul.checkmarks li			{position: relative;}
		.block ul.checkmarks li:before	{content: ""; position: absolute; left: -1.75em; top: 0.5em; width: 1em; height: 1em; background: no-repeat center / contain;
										 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%2370823E'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z'/%3E%3C/svg%3E");
										 -webkit-transition: -webkit-transform 0.25s; transition: -webkit-transform 0.25s; transition: transform 0.25s; transition: transform 0.25s, -webkit-transform 0.25s;}
		.block ul.checkmarks li:hover:before	{-webkit-transform: scale(1.25); -ms-transform: scale(1.25); transform: scale(1.25);}

			span						{display: block; margin-bottom: 1rem; font-size: 1.25em;}
			@-webkit-keyframes blob-morph {
				0%						{border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;}
				25%						{border-radius: 45% 55% 65% 35% / 60% 40% 50% 50%;}
				50%						{border-radius: 50% 50% 40% 60% / 45% 55% 35% 65%;}
				75%						{border-radius: 65% 35% 55% 45% / 40% 60% 55% 45%;}
				100%					{border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;}
			}
			@keyframes blob-morph {
				0%						{border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;}
				25%						{border-radius: 45% 55% 65% 35% / 60% 40% 50% 50%;}
				50%						{border-radius: 50% 50% 40% 60% / 45% 55% 35% 65%;}
				75%						{border-radius: 65% 35% 55% 45% / 40% 60% 55% 45%;}
				100%					{border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;}
			}
			@-webkit-keyframes blob-float {
				0%, 100%				{-webkit-transform: translateY(0) scale(1); transform: translateY(0) scale(1);}
				50%						{-webkit-transform: translateY(-12px) scale(1.01); transform: translateY(-12px) scale(1.01);}
			}
			@keyframes blob-float {
				0%, 100%				{-webkit-transform: translateY(0) scale(1); transform: translateY(0) scale(1);}
				50%						{-webkit-transform: translateY(-12px) scale(1.01); transform: translateY(-12px) scale(1.01);}
			}

.blob									{display: inline-block; vertical-align: middle; width: 20rem; max-width: 100%; aspect-ratio: 1 / 1; margin-right: 2rem;
										 background: no-repeat center / cover; border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%; -webkit-filter: drop-shadow(0 0 1rem rgba(134, 108, 90, 0.75));
										 filter: drop-shadow(0 0 1rem rgba(134, 108, 90, 0.75)); -webkit-animation: blob-morph 30s ease-in-out infinite; animation: blob-morph 30s ease-in-out infinite;}
			.text						{display: inline-block; vertical-align: middle; max-width: calc(100% - 22rem); text-align: left; font-size: 1rem;}

	.POI								{position: relative; padding: 0 0 1rem 1.5rem;}
		.POI:before						{content: ""; position: absolute; left: 0; top: 9px; width: 8px; height: 8px; background: #D8853F; border-radius: 50%; -webkit-transition: -webkit-transform 0.25s;
										 transition: -webkit-transform 0.25s; transition: transform 0.25s; transition: transform 0.25s, -webkit-transform 0.25s;}
		.POI:after						{content: ""; position: absolute; left: 4px; top: 0; width: 1px; height: 100%; background: #E0B44A;}
		.POI:first-child:after			{top: 8px;}
		.POI.multiline					{padding-bottom: 0;}
		.POI:not(.multiline):last-child:after	{height: 1rem;}
		.POI:hover:before				{-webkit-transform: scale(1.5); -ms-transform: scale(1.5); transform: scale(1.5);}

.review									{display: block; margin-bottom: 2rem; font-size: 1rem; text-align: left;}
	.review .name						{font-style: italic; color: #D8853F;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								top
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.logo									{position: fixed; left: 3rem; top: 3rem; font: 300 calc(1rem + 2vw) "Cormorant Upright"; color: #70823E; z-index: 1; text-shadow: 0 0 0.1em #F3EAD8, 0 0 0.05em #F3EAD8;}
	.logo img							{display: block; width: calc(2rem + 2vw); margin: auto; -webkit-filter: drop-shadow(0 0 0.2rem #F3EAD8); filter: drop-shadow(0 0 0.2rem #F3EAD8);}

.mobileMenu								{position: fixed; right: 4rem; top: 4rem; width: 2rem; height: 1.5rem; border-top: 2px solid #70823E; border-bottom: 2px solid #70823E; z-index: 2; cursor: pointer; -webkit-transition: 1s;
										 transition: 1s; -webkit-filter: drop-shadow(0 0 0.1rem #F3EAD8); filter: drop-shadow(0 0 0.1rem #F3EAD8);}
	.mobileMenu:after					{content: ""; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 100%; height: 2px;
										 background: #70823E;}
	.mobileMenu.show					{right: 1rem; top: 1.5rem;}

.menu									{position: fixed; right: -10rem; top: -10rem; padding: 10rem 0 2rem; width: 35rem; max-height: calc(90vh + 10rem); -webkit-transform: scale(0.1); -ms-transform: scale(0.1); transform: scale(0.1);
										 -webkit-transform-origin: top right; -ms-transform-origin: top right; transform-origin: top right; -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s;
										 transition: transform 1s, -webkit-transform 1s; background: #FFFFFF; border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%; -webkit-box-shadow: inset 0 0 1rem rgba(0, 0, 0, 0.75);
										 box-shadow: inset 0 0 1rem rgba(0, 0, 0, 0.75); -webkit-animation: blob-morph 30s ease-in-out infinite; animation: blob-morph 30s ease-in-out infinite; text-align: left;
										 -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; z-index: 1;}
	.menu.show							{-webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1);}
	.menu > li							{position: relative; display: block; vertical-align: top;}
		.menu > li:hover				{background: #E0B44A; color: #FFFFFF;}
	.menu > li a						{display: block; margin: 1rem 0; padding-left: 10rem;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								home
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.BGblob									{position: relative; left: 0; top: 0; width: 99vw; height: 100vh; border-radius: 60% 40% 55% 45% / 55% 45% 60% 40%;
										 -webkit-box-shadow: 0 0 1rem 1rem #F3EAD8 inset, 0 0 0 9999px #F3EAD8; box-shadow: 0 0 1rem 1rem #F3EAD8 inset, 0 0 0 9999px #F3EAD8;
										 -webkit-animation: blob-morph 30s ease-in-out infinite, blob-float 18s ease-in-out infinite; animation: blob-morph 25s ease-in-out infinite, blob-float 14s ease-in-out infinite;}

.block.about .blob						{margin: 2rem 2rem 2rem 0;}
.block.about .button					{display: inline-block;}
.block.about .button:first-of-type		{margin: 0 2rem 1rem 0;}
.block.about .button:last-child			{background: #D8853F;}
.block.about .button:last-child:hover	{background: #70823E;}

.block.services							{background: rgba(255, 255, 255, 0.25); -webkit-box-shadow: 0 0 1rem rgba(255, 255, 255, 1); box-shadow: 0 0 1rem rgba(255, 255, 255, 1);}
	.block.services h2					{margin-bottom: 2rem; font-family: unset; font-size: 1.75em;}
	.block.services h2:after			{display: none;}
	.block.services .button				{padding: 0.5rem 1rem;}
.service								{display: inline-block; vertical-align: top; width: calc(100% / 2 - 2rem); margin: 0 1rem 2rem; padding: 2rem; background: rgba(255, 255, 255, 0.75); font-size: 1rem; border-radius: 1rem;
										 -webkit-box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15); box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15); -webkit-transition: 0.5s ease-out; transition: 0.5s ease-out;}
	.service:hover						{-webkit-transform: scale(1.025); -ms-transform: scale(1.025); transform: scale(1.025); -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
										 box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);}
	.service .content					{margin: 0.5rem 0 1.5rem; text-align: left;}
	.service .button					{background: #D8853F;}
	.service .button:hover				{background: #70823E;}

.block.reviews h3						{margin-bottom: 2rem;}
	.block.reviews h3:after				{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}

.block.quotes							{padding: 7rem 1rem; background: rgba(255, 255, 255, 0.25); -webkit-box-shadow: 0 0 1rem rgba(255, 255, 255, 1); box-shadow: 0 0 1rem rgba(255, 255, 255, 1);}

/*	Op de homepage wisselen de blokken elkaar af: over mij (donker), diensten (licht),
	binnenkort (donker), reviews (licht) en de quote (donker). Staat er niets in de agenda,
	dan valt dat blok weg en schuift het patroon vanzelf een plek op.								*/
.block.agenda.upcoming + .block.reviews	{background: rgba(255, 255, 255, 0.25); -webkit-box-shadow: 0 0 1rem rgba(255, 255, 255, 1); box-shadow: 0 0 1rem rgba(255, 255, 255, 1);}
.block.agenda.upcoming + .block.reviews + .block.quotes	{background: none; -webkit-box-shadow: none; box-shadow: none;}
	.quote								{position: relative; display: inline-block; max-width: 100%; padding: 0 1em; font-size: 2.5rem; font-family: "Cormorant Upright"; font-family: "Cormorant Infant"; color: #70823E;
										 word-break: break-word;}
		.quote:before					{content: '“'; font-size: 2em; color: #E0B44A; position: absolute; left: 0; top: -0.3em;}
		.quote:after					{content: '”'; font-size: 2em; color: #E0B44A; position: absolute; right: 0; bottom: -0.75em;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								over mij
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.aboutMe .wrapper					{font-size: 1rem; text-align: left;}
.block.aboutMe .title					{font-size: 1.25rem; font-weight: bold; margin-bottom: 0.5rem;}
	.block.aboutMe .title:after			{display: none;}
.block.aboutMe .blob.one				{float: left; margin: 0 2rem 2rem 0;}
.block.aboutMe .blob.two				{float: right; width: 40rem; margin: 0 0 2rem 2rem;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								coaching
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.coaching							{}
	.block.coaching .wrapper			{font-size: 1rem; text-align: left;}
	.block.coaching .blob				{float: right; margin: 0 0 2rem 2rem;}

	.block.coaching h2:after			{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								ademwerk
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.breathwork						{}
	.block.breathwork .wrapper			{font-size: 1rem; text-align: left;}
	.block.breathwork .blob				{float: right; margin: 0 0 2rem 2rem;}
	.block.breathwork .blob.two			{margin: 0;}
	.block.breathwork .blob.three		{width: 18rem;}
	.block.breathwork .blob.four		{width: 15rem;}
	.block.breathwork .blob.five		{width: 12rem; margin: 4rem 2rem 4rem 0;}

	.block.breathwork h2				{clear: both; margin-top: 2rem;}
	.block.breathwork h2:after			{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								meditatie
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.meditation						{}
	.block.meditation .wrapper			{font-size: 1rem; text-align: left;}
	.block.meditation .blob				{float: right; margin: 0 0 2rem 2rem;}
	.block.meditation .blob.two			{width: 30rem;}
	.xblock.meditation .blob.three		{width: 22rem;}
	.xblock.meditation .blob.four		{width: 15rem;}
	.block.meditation .audio			{margin-bottom: 2rem;}
		.block.meditation audio			{display: inline-block; vertical-align: middle; margin-right: 1rem;}
		.block.meditation .button		{display: inline-block; vertical-align: middle;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								training
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.training							{}
	.block.training .wrapper			{font-size: 1rem; text-align: left;}
	.block.training .title				{font-size: 1.25rem; font-weight: bold; margin-bottom: 0.5rem;}
		.block.training .title:after	{display: none;}
	.block.training .blob				{float: right; margin: 0 0 2rem 2rem;}

	.block.training h2:after			{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent); z-index: -1;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								blogs
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.blogs.more						{padding-top: 0; background: rgba(255, 255, 255, 0.25); -webkit-box-shadow: 0 0 1rem rgba(255, 255, 255, 1); box-shadow: 0 0 1rem rgba(255, 255, 255, 1);}
	.block.blogs.more h3				{margin: 5rem 0 3rem; text-align: left;}
	.block.blogs.more h3:after			{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}
	.block.blogs.more .blog				{width: calc(100% / 4 - 2rem); font-size: 0.875rem;}
	.block.blogs.more .blog .content	{padding: 1rem;}
	.block.blogs.more .blog h2			{margin-bottom: 1rem; font-size: 1.375em;}
	.block.blogs.more .blog .intro		{margin-bottom: 1rem;}
	.block.blogs.more .blog .button		{padding: 0.25rem 0.75rem;}
.block.blogs .noBlogs					{font-size: 1rem; text-align: left;}

.blog,
.event									{display: inline-block; vertical-align: top; width: calc(100% / 2 - 2rem); margin: 0 1rem 2rem; background: rgba(255, 255, 255, 0.75); font-size: 1rem; line-height: 1.5;
										 text-align: left; white-space: normal; border-radius: 1rem; overflow: hidden; -webkit-box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15);
										 box-shadow: 0 0.5rem 2rem rgba(0, 0, 0, 0.15); -webkit-transition: 0.5s ease-out; transition: 0.5s ease-out;}
	.blog:hover,
	.event:hover						{-webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.05);}
	.blog .image,
	.event .image						{position: relative; width: 100%; aspect-ratio: 16 / 9; background: no-repeat center / cover; overflow: hidden;}
	.blog .image:before,
	.event .image:before				{content: ""; position: absolute; inset: 0; background-image: inherit; background-repeat: no-repeat; background-position: center; background-size: cover;
										 -webkit-transition: -webkit-transform 0.5s ease-out; transition: -webkit-transform 0.5s ease-out; transition: transform 0.5s ease-out;
										 transition: transform 0.5s ease-out, -webkit-transform 0.5s ease-out;}
	.blog:hover .image:before,
	.event:hover .image:before			{-webkit-transform: scale(1.1) rotate(2deg); -ms-transform: scale(1.1) rotate(2deg); transform: scale(1.1) rotate(2deg);}
	.blog .content,
	.event .content						{padding: 2rem;}
	.blog h2,
	.event h2							{margin: 0 0 1.5rem; font-family: unset; font-size: 1.75em;}
	.blog h2:after,
	.event h2:after						{display: none;}
	.blog .intro,
	.event .intro						{margin-bottom: 1.5rem;}
	.blog .button,
	.event .button						{display: inline-block; padding: 0.5rem 1rem; background: #D8853F;}
	.blog:hover .button,
	.event:hover .button				{background: #70823E;}

.block.blogPost .wrapper				{font-size: 1rem; text-align: left;}
	.block.blogPost h1					{margin-bottom: 3rem;}
	.block.blogPost .blob				{float: right; margin: 0 0 2rem 2rem;}
	.block.blogPost .title				{font-size: 1.25rem; font-weight: bold; margin-bottom: 0.5rem;}
		.block.blogPost .title:after	{display: none;}
	.block.blogPost h2					{clear: both; margin: 3rem 0 1rem;}
	.block.blogPost h2:after			{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}
	.block.blogPost .backToBlogs		{clear: both; padding-top: 3rem;}
	.block.blogPost .backToBlogs .button	{display: inline-block; padding: 0.5rem 1rem;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								agenda
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.agenda .wrapper					{text-align: left;}
.block.agenda .introduction				{margin-bottom: 3rem; font-size: 1rem;}
.block.agenda .noEvents					{font-size: 1rem; font-style: italic; color: rgb(102, 102, 102);}
.block.agenda .stayInformed				{margin-top: 3rem; font-size: 1rem;}
	.block.agenda .stayInformed a		{border-bottom: 3px solid #70823E;}
.block.agenda.upcoming h3				{margin-bottom: 3rem; text-align: left;}
	.block.agenda.upcoming h3:after		{background: -webkit-gradient(linear, left top, right top, from(#E0B44A), to(transparent)); background: linear-gradient(to right, #E0B44A, transparent);}

	.event .image:before				{-webkit-transition: -webkit-transform 2s ease-out; transition: -webkit-transform 2s ease-out; transition: transform 2s ease-out;
										 transition: transform 2s ease-out, -webkit-transform 2s ease-out;}
	.event h2							{margin-bottom: 0.5rem;}
	.event .date						{font-style: italic; color: #D8853F;}
	.event .location					{color: #866C5A;}
	.event .price						{margin-top: 0.5rem; font-weight: bold; color: #70823E;}
	.event .intro						{margin-top: 1rem;}
	.event .button.soldOut				{background: #866C5A; cursor: default;}
	.event:hover .button.soldOut		{background: #866C5A;}

.toAgenda								{margin-top: 1rem; font-size: 1rem; text-align: left;}
	.toAgenda .button					{display: inline-block; padding: 0.5rem 1rem;}

.block.breathwork .events				{margin: 0 -1rem; font-size: 0;}
.block.breathwork .toAgenda				{margin-bottom: 4rem;}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								footer
-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
.block.footer							{background: #866C5A; color: #FFFFFF; padding-bottom: 0;}
.block.footer .wrapper					{text-align: left;}
.block.footer h2						{margin-bottom: 0.5em;}
	.block.footer h2:after				{background: -webkit-gradient(linear, left top, right top, from(#F3EAD8), to(transparent)); background: linear-gradient(to right, #F3EAD8, transparent);}
.block.footer .left						{display: inline-block; vertical-align: top; width: 50%; font-size: 1rem;}
	.block.footer .contactItem			{display: inline-block; vertical-align: top; width: calc(98% / 3);}
	.block.footer a						{color: #FFFFFF;}
	.block.footer a i					{margin-right: 0.5rem; color: #E0B44A; font-size: 1.5em; -webkit-transition: color 0.25s; transition: color 0.25s;}
	.block.footer a:hover i				{color: #D8853F;}
	.block.footer form					{display: block; margin-top: 2rem;}
	.block.footer form input			{height: 3rem; line-height: 3rem; margin-bottom: 1rem; padding: 0 1rem; font-size: 1em; border-radius: 0.5rem; color: #000000;}
	.block.footer form input:nth-of-type(3)		{width: calc(100% / 2 - 1rem); margin-right: 1rem;}
	.block.footer form input:nth-of-type(4)		{width: calc(100% / 2);}
	.block.footer form input:nth-of-type(5)		{width: 100%;}
	.block.footer form textarea			{width: 100%; height: 6rem; margin-bottom: 1rem; padding: 1rem; font-size: 1em; border-radius: 0.5rem; color: #000000;}
	.block.footer .button				{display: inline-block; padding: 0.5rem 1rem;}
	.block.footer .thankYou				{display: none; margin-top: 1rem;}
.block.footer .right					{display: inline-block; vertical-align: top; width: 50%; padding-left: 3rem; text-align: right;}
	.block.footer .right h2:after		{background: -webkit-gradient(linear, right top, left top, from(#F3EAD8), to(transparent)); background: linear-gradient(to left, #F3EAD8, transparent);}
	.block.footer .right div:not(.companyInfo, .socials)	{display: inline-block; vertical-align: middle; margin: 0 0 2rem 2rem; padding: 1rem; background: #FFFFFF; border-radius: 1rem;}
	.block.footer .right img			{display: block; width: 6rem;}
	.block.footer .right .companyInfo	{display: inline-block; margin-bottom: 2rem; font-size: 1rem; text-align: left;}
	.block.footer .right .socials		{margin-top: 3rem; font-size: 1rem;}
	.block.footer .right .socials a		{margin-left: 2rem;}

.block.footer .ED						{display: block; margin-top: 5rem; font-size: 1rem; text-align: center; background: rgba(0, 0, 0, 0.1);}
	.block.footer .ED a					{color: #F3EAD8;}


/*---------------------------------------------------------------------------------------------------------------------------------------------------------------------------
								media queries
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1280px){
	.logo								{left: 1rem; top: 1rem;}
	.mobileMenu							{top: 1.5rem; right: 1rem;}
}

@media screen and (max-width: 1000px){
	.block.training h2					{clear: both;}

	.block.footer .left, .block.footer .right	{display: block; width: 100%; padding: 0; text-align: left;}
	.block.footer .right				{margin-top: 4rem;}
	.block.footer .left .contactItem	{width: auto; margin-right: 2rem;}
	.block.footer .right div:not(.companyInfo, .socials)	{margin: 0 2rem 2rem 0;}
	.block.footer .right .socials br:not(:first-of-type)	{display: none;}
	.block.footer .right .socials a		{margin-left: auto; margin-right: 2rem;}
}

@media screen and (max-width: 800px){
	.text								{max-width: calc(100% - 2rem);}
	.block.about .blob					{margin: 0 0 1rem;}
}

@media screen and (max-width: 700px){
	.block.services .service			{display: block; width: 100%; margin: 0 0 2rem;}
	.blog,
	.event								{display: block; width: 100%; margin: 0 0 2rem;}
	.block.blogs.more .blog				{display: inline-block; width: calc(100% / 2 - 1rem); margin: 0 0.5rem 2rem;}
	.block.breathwork .events			{margin: 0;}
}

@media screen and (max-width: 500px){
	.block.blogs.more .blog				{display: block; width: 100%; margin: 0 0 2rem;}
}

@media screen and (max-width: 600px){
	.block.blogPost .blob				{display: block; float: none; margin: 0 auto 2rem auto;}
	.block.aboutMe .blob.one			{display: block; float: none; margin: 0 auto 2rem auto;}
	.block.coaching .blob				{display: block; float: none; margin: 0 auto 2rem auto;}
	.block.breathwork .blob				{display: block; float: none; margin: 0 auto 2rem auto;}
	.block.meditation .blob				{display: block; float: none; margin: 0 auto 2rem auto;}
	.block.training .blob				{display: block; float: none; margin: 0 auto 2rem auto;}
}

@media screen and (max-width: 500px){
	.inspiration						{height: 85vh;}
	.block.footer .left form input		{width: 100%;}
}

@media screen and (max-width: 500px){
	.slideshow							{height: 85vh !important;}
	.BGblob								{height: 85vh;}
}