/* FROM WPDevDesign Oxygen Essentials */

	/* disabled WPDevDesign Oxygen Essentials for now */
	/* & copied styles here */

	/* Modern CSS reset | https://hankchizljaw.com/wrote/a-modern-css-reset/
	---------------------------------------------------------------------------- */

	/* Set core body defaults */
	body {
	  min-height: 100vh;
	  scroll-behavior: smooth;
	  text-rendering: optimizeSpeed;
	}
	  
	/* Remove default padding, default margin and list styles on ul, ol elements with a class attribute */
	ul[class],
	ol[class] {
	  padding: 0;
	  margin: 0;
	  list-style: none;
	}

	/* A elements that don't have a class get default styles */
	a:not([class]) {
	  text-decoration-skip-link: auto;
	}

	/* Inherit fonts for inputs and buttons */
	input,
	button,
	textarea,
	select {
	  font: inherit;
	}

	/* Remove all animations and transitions for people that prefer not to see them */
	@media (prefers-reduced-motion: reduce) {
	  * {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	  }
	}
	  
	/* Compiled by Sridhar Katakam | https://wpdevdesign.com
	---------------------------------------------------------------------------- */

	/* Make all images responsive */
	img {
	  vertical-align: top;
	  height: auto;
	  max-width: 100%;
	}

	/* WP Image alignment classes */
	img.alignright { float: right; margin: 0 0 2em 2em; }
	img.alignleft { float: left; margin: 0 2em 2em 0; }
	img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
	.alignright { float: right; }
	.alignleft { float: left; }
	.aligncenter { display: block; margin-left: auto; margin-right: auto; }

	@media only screen and (max-width: 480px) {
	  img.alignleft {
		float: none;
		margin-right: 0;
		display: block;
	  }
	  
	  img.alignright {
		float: none;
		margin-left: 0;
		display: block;
	  }
	}

	/* Make the admin bar menu items visible on top to accomodate the fixed header */
	@media (min-width: 993px) {
		#wpadminbar {
			z-index: 2147483640;
		}
	}

	/* Seriously, Oxygen? */
	label {
	  display: block;
	}


	/* Screen Readers (taken from Genesis Sample 3.1.0) */
	.screen-reader-text {
		border: 0;
		clip: rect(0, 0, 0, 0);
		height: 1px;
		overflow: hidden;
		position: absolute !important;
		width: 1px;
		word-wrap: normal !important;
	}

	.screen-reader-text:focus {
		background: #fff;
		box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
		clip: auto !important;
		color: #333;
		display: block;
		font-size: 1em;
		font-weight: bold;
		height: auto;
		padding: 15px 23px 14px;
		text-decoration: none;
		width: auto;
		z-index: 100000; /* Above WP toolbar. */
	}

	/* Search Form */
	.oxy-header .oxy-search-form {
	  width: auto;
	}

	.search-form {
	  display: flex;
	}

/* END FROM WPDevDesign Oxygen Essentials */



/* HEADER */

#menu-toggle {
	padding: 3px;
	background-color: #fff;
	display: none;
	align-items: center;
	color: #504941;
	cursor: pointer;
}

#menu-toggle > svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

nav ul.menu-item-list {
	display: flex;
	flex-direction: row;
}

nav ul.menu-item-list li.menu-item {
	/* nothing here */
}

nav ul.menu-item-list li.menu-item a.menu-item-link {
	font-family: 'Krona One';
	font-size: 11px;
	text-transform: uppercase;
	text-decoration: none;
	color: #b4afaa;
	position: relative;
	padding: 10px 10px 9px 10px;
	
	-webkit-transition: .5s; /* Safari */
	transition: .5s;
	transition-timing-function: ease-in-out;
	transition-property: color, background-color;
}

nav ul.menu-item-list li.menu-item:hover a.menu-item-link.parent-link {
	cursor: pointer;
}

nav ul.menu-item-list li.menu-item a.menu-item-link.current,
nav ul.menu-item-list li.menu-item a.menu-item-link.current-parent {
	color: #c83c14;
}

nav ul.menu-item-list li.menu-item:hover a.menu-item-link:not(.current):not(.current-parent),
nav ul.menu-item-list li.active a.menu-item-link {
	color: #c83c14;
	background-color: #e6e4e2;
}

nav ul.menu-item-list li.menu-item:hover a.menu-item-link.current-parent {
	background-color: #e6e4e2;
}

nav ul.menu-item-list li.menu-item a.menu-item-link-flag {
	padding: 0 0 0 12px;
}

nav ul.menu-item-list li.menu-item a.menu-item-link-flag img {
	padding-top: 2px;
}

nav ul.menu-item-list li.menu-item div.sub-menu-container {
	z-index: 99999;
	position: absolute;
	top: 100px;
	visibility: hidden;
    opacity: 0;
	-webkit-transition: .333s; /* Safari */
	transition: .333s;
	transition-timing-function: ease-in-out;
	transition-property: visibility,opacity,top;
}
 
nav ul.menu-item-list li.menu-item:hover > div.sub-menu-container {
	/* top: 67px; */
	/* visibility: visible; */
    /* opacity: 1; */
	/* margin-bottom: 6px; */
}

nav ul.menu-item-list li.menu-item.active > div.sub-menu-container {
	top: 67px;
	visibility: visible;
    opacity: 1;
	/* margin-bottom: 6px; */
}

@media (hover: hover) {
	/* research more */
	/* https://css-tricks.com/solving-sticky-hover-states-with-media-hover-hover/ */
}

nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list {
	background-color: #e6e4e2;
	padding: 12px 0;
}

nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list li.sub-menu-item a.menu-item-link {
	display: block;
	font-family: 'Montserrat';
	font-weight: 600;
	font-size: 12px;
	text-transform: none;
	color: #504941;
	position: relative;
	padding: 6px 10px 6px 10px;
}

nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list li.sub-menu-item:hover a.menu-item-link:not(.current) {
	color: #c83c14;
}

nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list li.sub-menu-item a.menu-item-link.current {
	color: #c83c14;
}

/* END HEADER */



/* INNER CONTENT */

	/* height #section-photo-bar = approx. (100vw / 5) */
	/* calc( 100vw - 100% ) is width scrollbar or zero ... */

#header + .ct-inner-content {
	/* set min-height of .ct-inner-content (directly after #header ) based on vh minus height header & footer*/
	/* applies to all pages WITHOUT a sub template, ie home, team & contact */
	min-height: calc( 100vh - 100px - 31px );
	
}

#section-photo-bar + #section-content {
	/* set min-height of #section-content (directly after #header ) based on vh minus height header & footer */
	/* minus height #section-photo-bar = approx. 100vw / 5 () */
	/* applies to all pages WITH a sub template, ie services and misc */
	/* apart from RH that has #section-header-img-RH instead of #section-photo-bar */
	/* but the content is long enough to avoid problems! */
	min-height: calc( 100vh - 100px - 31px - (100vw / 5) );
}

p {
	margin: 0 0 13px 0;
}

p:last-of-type {
	margin-bottom: 0 ;
}

p:first-of-type:last-of-type {
	/* margin: 0 0 13px 0; */
}

ul {
	padding-left: 18px;
	margin: 0;
	list-style: disc;
}

ul ul {
	list-style: circle;
}

p:last-of-type ~ ul {
	margin-top: 13px;
}

/* END INNER CONTENT */



/* AFTER INNER CONTENT */

.fp-hidden {
	display: none;
}

.ct-modal {
	overflow-y: auto;
}

.oxy-close-modal, #ok-close-cookie-notice {
	cursor: pointer;
}

.close-btn {
	fill: currentColor;
}

.oxy-close-modal .close-btn {
    color: #fff;
}

#scroll-top > svg {
    width: 16px;
    height: 16px;
    fill: currentColor;
}

#scroll-top.in {
	cursor: pointer;
	visibility: visible;
	opacity: 1;
}

#code-block-watermark {
	color: #f6f6f6;
	width: calc((100vw / 1280) * 3088);
	height: calc((100vw / 1280) * 366);
	margin-top: calc((100vw / 1280) * 366 * -0.5);
}

#code-block-watermark > svg {
	fill: currentColor;
    /* width: 3088px; */
    /* height: 366px; */
	/* width: 100%; */
	height: 100%;
}

/* END AFTER INNER CONTENT */



/* HOME PAGE */

/* set here for the use of calc */
#section-photo-bar-home div div{
	/* width: calc( 100% / 3); */
}

#section-photo-bar-home img{
	/* see mq's for above 1920px */
	min-width: calc( 100vw / 3);
}

.content-block-home {
	padding: 13px;
	background-color: rgba(255,255,255,0.5);
	box-shadow:	-1px -1px 2px rgba(0,0,0,0.1),
				1px 1px 1px rgba(0,0,0,0.20), 
				2px 2px 2px rgba(0,0,0,0.10), 
				4px 4px 4px rgba(0,0,0,0.05),
				8px 8px 8px rgba(0,0,0,0.025);
}

.content-block-home:hover {
	/* cursor: pointer; */
}

.content-block-home:hover a {
	/* text-decoration: underline; */
}

/* END HOME PAGE */



/* NOT HOME PAGE */

/* css for code-block surrounding the imgs is set in oxy */
#section-photo-bar {
	/* margin cannot be set on a section in oxy */
    max-width: 1920px;
    margin: 0 auto;
}

#section-photo-bar img {
	/* needed for fix orientation change on mobile */
	width: 100%;
}


/* END NOT HOME PAGE */



/* SERVICES PAGE MENU */

#code-block-page-menu {
	/* margin-top: 2px; */
	/* padding: 14px; */
	/* min-width: 244px; */
	min-width: 300px;
	
	box-shadow:	-1px -1px 1px rgba(0,0,0,0.1),
				1px 1px 1px rgba(0,0,0,0.10), 
				2px 2px 2px rgba(0,0,0,0.05), 
				4px 4px 4px rgba(0,0,0,0.025),
				8px 8px 8px rgba(0,0,0,0.0125);
}

ul.page-menu-item-list {
	
}

ul.page-menu-item-list li.page-menu-item {
	/* transform-origin: left center; */
	/* transform: scale(0.95, 1); */
}

ul.page-menu-item-list li.page-menu-item a.page-menu-item-link{
	display: block;
	/* font-family: 'Krona one'; */
	font-family: 'Montserrat';
	/* font-weight: 400; */
	font-weight: 500;
	/* font-size: 12px; */
	font-size: 14px;
	text-transform: none;
	color: #c83c14;
	/* position: relative; */
	padding: 5px 0;
}
 
ul.page-menu-item-list li.page-menu-item:hover a.page-menu-item-link,
ul.page-menu-item-list li.page-menu-item a.page-menu-item-link.current {
	color: #504941;
}

/* END SERVICES PAGE MENU */



/* TEAM PAGE SPECIFIC */

#div-team-members {
	/* see mq's */
	width: 672px;
    display: grid;
    grid-template-columns: repeat(3,1fr);
	/* how to create equal height columns css grid / grid-auto-rows ??? */
	grid-auto-rows: 1fr;
    grid-column-gap: 24px;
    grid-row-gap: 24px;
    column-gap: 24px;
    row-gap: 24px;
	/* align-items: initial to fight oxy css ... */
	align-items: initial;
}

#div-team-members div {
	box-shadow:	-1px -1px 1px rgba(0,0,0,0.1),
				1px 1px 1px rgba(0,0,0,0.10), 
				2px 2px 2px rgba(0,0,0,0.05), 
				4px 4px 4px rgba(0,0,0,0.025),
				8px 8px 8px rgba(0,0,0,0.0125);
}

#div-team-members div:hover {
	cursor: pointer;
}

#div-team-members div:hover a {
	text-decoration: underline;
}

#div-team-members div:hover img {
	/* filter:sepia(100%); */
}

.modal-image-team {
	box-shadow:	-1px -1px 1px rgba(0,0,0,0.1),
				1px 1px 1px rgba(0,0,0,0.2), 
				2px 2px 2px rgba(0,0,0,0.1), 
				4px 4px 4px rgba(0,0,0,0.05),
				8px 8px 8px rgba(0,0,0,0.025);
}


/* END TEAM PAGE SPECIFIC */



/* ROLLING HABITS PAGE SPECIFIC */

.locked {
	overflow: hidden;
	position: fixed;
}

#code-block-header-img-rh img, #slider-RH img {
	/* needed for fix orientation change on mobile */
	width: 100%;
	height:auto;
}

#slider-RH .unslider-arrow {
	/* see mq's */
	background-color: #c83c14;
	opacity: 0.66;
	border-radius: 0;
}

#slider-RH .unslider-arrow:hover {
	background-color: #504941;
	opacity: 1;
}

/* ccontact form 7 specific */

.wpcf7-text {
	/* all input fields in cf7 */
	width: 100%;
	padding: 4px 6px;
	color: #504941;
    border: 1px solid #504941;
	border-radius: 0px;
}

.wpcf7-text:focus, .wpcf7-radio input:focus {
	/* outline: 1px solid rgb(80, 73, 65, 0.25); */
	/* border: 0; */
	outline: none;
}

.wpcf7-submit {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 12px;
    padding-right: 12px;
	color: #fff;
	background-color: #c83c14;
    border: 1px solid #c83c14;
	border-radius: 0px;
}

.wpcf7-submit:hover, .wpcf7-submit:active {
	background-color: #504941;
    border: 1px solid #504941;
	border-radius: 0px;
}

.wpcf7-submit:focus {
	outline: none;
}

.wpcf7 form .wpcf7-response-output {
	margin: 13px 0 0 0;
	padding: 4px 6px;
	color: #504941;
	font-weight: bold;
    border: 2px solid;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {
    border-color: #c83c14;
}

div.wpcf7-mail-sent-ok {
	/* border: 1px solid #c83c14; */
	border: 1px solid #3cc814;
}

div.wpcf7-mail-sent-ng {
	border: 1px solid #c83c14;
}

div.wpcf7-spam-blocked {
	border: 1px solid #c83c14;
}

div.wpcf7-validation-errors {
	border: 1px solid #c83c14;
}

.wpcf7-form-control-wrap {
	position: relative;
}

span.wpcf7-not-valid-tip {
	color: #c83c14;
	font-size: 13px;
	/* display: initial; */
	padding: 6px 8px 0 8px;
}

/* END ROLLING HABITS PAGE SPECIFIC */



/* CONTACT PAGE SPECIFIC */
	
	#link-header-img-03:hover .ct-fancy-icon {
		color: #c83c14;
	}
	
/* END CONTACT PAGE SPECIFIC */



/* FOOTER */



/* END FOOTER */



/* MQ's */

@media (min-width: 1920px) {
	
	#header.ct-div-block {
		/* use #header.ct-div-block to overwrite oxy css */
		/* 1920 / 2 = 960px plus initial 50px = */
		padding: 0 calc(50% - 960px + 50px);
	}
	
	#section-photo-bar-home img{
		/* min-width: 20%; */
	}
	
	#section-photo-bar-home img{
		min-width: initial;
		max-width: 640px;
	}
	
}

@media (max-width: 768px) {
	/* this is just for the slider on ipad portrait */
	#slider-RH .unslider-arrow {
		width: 48px;
		height: 48px;
		margin-top: -24px;
	}
}

@media (max-width: 767px) {
	
	.ct-section-inner-wrap {
		/* padding-top: 25px; */
	}
	
	#headline-content-title {
		/* margin-bottom: 12px; */
	}
	
	#menu-toggle {
		display: flex;
	}
	
	nav#header-menu {
		position: absolute;
		display: none;
		top: 80px;
		right: 0;
		padding: 6px 0;
		/* background-color: #e6e4e2; */
		background-color: rgba(230, 228, 226, 0.95);
	}
	
	nav#header-menu.active {
		display: block;
		z-index: 99998;
	}
	
	nav ul.menu-item-list {
		flex-direction: column;
	}
	
	nav ul.menu-item-list li.menu-item {
		/* use flex to have padding working on links in absolute positioned container */
		display: flex;
		flex-direction: column;
		padding: 0;
		margin: 0;
	}
	
	nav ul.menu-item-list li.menu-item a.menu-item-link {
		color: #504941;
		padding: 6px 12px;
		margin: 0;
	}
	
	nav ul.menu-item-list li.menu-item a.menu-item-link-flag {
		padding: 6px 12px;
		margin: 0;
	}
	
	nav ul.menu-item-list li.menu-item a.menu-item-link-flag img {
		padding: 0;
	}
	
	nav ul.menu-item-list li.menu-item:hover a.menu-item-link {
		background-color: initial;
	}
	
	/* added #header-menu for specificity to give this rule precedence */
	/* preventing the parent items in the menu to react to hover */
	nav#header-menu ul.menu-item-list li.menu-item a.menu-item-link.parent-link {
		pointer-events: none;
		color: #504941;
	}
	
	nav ul.menu-item-list li.menu-item div.sub-menu-container {
		position: initial;
		visibility: visible;
		opacity: 1;
		margin: 0;
		padding: 0 0 6px 0;
	}
	
	nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list {
		background-color: initial;
		padding: 0 12px 0 24px;
		margin: 0;
	}
	
	nav ul.menu-item-list li.menu-item div.sub-menu-container ul.sub-menu-item-list li.sub-menu-item a.menu-item-link {
		padding: 3px 0px;
		margin: 0;
	}
	
	#header + .ct-inner-content {
		/* set min-height of .ct-inner-content (directly after #header ) based on vh minus height header & footer*/
		/* applies to all pages WITHOUT a sub template, ie home, team & contact */
		min-height: calc( 100vh - 80px - 31px );
		
	}

	#section-photo-bar + #section-content {
		/* set min-height of #section-content (directly after #header ) based on vh minus height header & footer */
		/* minus height #section-photo-bar = approx. 100vw / 5 () */
		/* applies to all pages WITH a sub template, ie services and misc */
		/* apart from RH that has #section-header-img-RH instead of #section-photo-bar */
		/* but the content is long enough to avoid problems! */
		min-height: calc( 100vh - 80px - 31px - (100vw / 5) );
	}
	
	#div-team-members {
		width: 440px;
		grid-template-columns: repeat(2,1fr);
	}
	
}

@media (max-width: 480px) {
	
	#div-team-members {
		width: 208px;
		grid-template-columns: repeat(1,1fr);
	}
	
}

@media (max-width: 320px) {
	/* nothing yet */
}


/* END MQ's */