/*
Theme Name: 	Censervices
Theme URI: 		http://odoson.com
Description: 	The totally nude Wordpress theme!
Version: 		1.0
Author: 		Robert Baumgartner
Author URI: 	http://odoson.com
Tags: 			trailblazer, naked, clean, basic
*/



/*** Sensible Defaults ***/

@import "css/reset.css";
@import "js/lightbox/css/lightbox.min.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
body 				{ background:#fff; /* Don't forget to style your body to avoid user overrides */ }
/*::-moz-selection 	{ background:#ff0; color:#333; }
::selection 		{ background:#ff0; color:#333; } */

* {
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
	   -moz-font-smoothing: antialiased;
	        font-smoothing: antialiased;
}

/* Typekit */
/* These classes make sure that no FOUC occurs.
 * All contents remain hidden, until the fonts are loaded (or until loading fails) */

.wf-loading {
	visibility: hidden;
	opacity: 0;
}

.wf-active, .wf-inactive {
	visibility: visible;
	opacity: 1;
	-webkit-transition: all 0.2s ease-in-out;
	   -moz-transition: all 0.2s ease-in-out;
		 -o-transition: all 0.2s ease-in-out;
		    transition: all 0.2s ease-in-out;
}


/* Helper Classes */

.clear { clear: both; }
strong { font-weight: bold; }
em { font-style: italic; }
a, a:link, a:visited, a:hover, a:focus { color: inherit; }

html, body {
	font-family: "futura-pt",sans-serif;
	font-size: 15px;
	line-height: 120%;
	color: #5D6B27;
	background: #EFEBDE;
}

	@media (min-width: 700px) {
		html, body {
			font-size: 17px;
			line-height: 120%;
		}
	}

.wrap {
	margin: 0 auto;
	padding: 0 1rem;
	width: 100%;
	max-width: 1400px;
}

	.wrap.fullheight {
		height: 100%;
	}

header {
	background: #fff;
	padding: 1rem 0;
	width: 100%;
}

	header a.logo {
		width: 13rem;
		height: 1.9rem;
		background: url(css/img/logo.svg) no-repeat left center;
		background-size: contain;
		display: block;
		text-indent: -1000px;
		overflow: hidden;
	}

	header .wrap {
		display: flex;
		flex-flow: row wrap;
	}

	header .social {
		position: absolute;
		right: 1rem;
		top: 50%;
		transform: translateY(-50%);
		display: flex;
		flex-flow: row wrap;
	}

	header .social a {
		display: block;
		width: 1.5rem;
		height: 1.5rem;
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
		margin-left: 0.5rem
	}

		header .social a.instagram { background-image: url(css/img/insta.gif); }
		header .social a.linkedin { background-image: url(css/img/linked.gif); }
		header .social a.facebook { background-image: url(css/img/facebook.gif); }

.hero {
	background: #adaaa0 url(css/img/header.jpg) no-repeat center;
	background-size: cover;
	height: 33vw;
	min-height: 150px;
}

	.hero .nav-toggle {
		width: 40px;
		height: 40px;
		position: absolute;
		right: 1rem;
		top: 1rem;
		cursor: pointer;
		z-index: 99;
		margin-top: -4px;
	}

		.nav-toggle span {
			width: 28px;
			height: 4px;
			display: block;
			background: #fff;
			margin-left: 12px;
			transition: all 0.2s ease-in-out;
			position: absolute;
			top:50%;
			transform: translateY(-50%);
		}
			.hero .nav-toggle span:nth-child(1) { margin-top: -8px; }
			.hero .nav-toggle span:nth-child(3) { margin-top: 8px; }

		.hero.visible .nav-toggle span:nth-child(2) {
			height: 0;
			opacity: 0;
		}

		.hero.visible .nav-toggle span:nth-child(1) {
			margin-top: 0;
			transform: rotate(45deg);
		}

		.hero.visible .nav-toggle span:nth-child(3) {
			margin-top: 0;
			transform: rotate(-45deg);
		}

	.hero nav {
		position: absolute;
		display: block;
		opacity: 0;
		pointer-events: none;
		background: rgba(93, 107, 38, 0.8);
		width: 100%;
		min-height: 100%;
		color: #fff;
		z-index: 9;
		padding: 1rem 0;
		transition: all 0.3s ease-in-out;
	}

		.hero.visible nav {
			opacity: 1;
			pointer-events: all;
		}

		@media (max-width: 699px) {
			.hero.visible nav {
				height: calc(100vh - 55px);
				position: fixed;
				top: 55px;
				background: rgba(93, 107, 38, 0.95);
			}

			header {
				height: 55px;
			}

			.menu-open header {
				position: fixed;
				z-index: 9;
				top: 0;
			}

			body.menu-open {
				padding-top: 55px;
			}

		}

		.hero nav ul {
			font-size: 1.5rem;
			line-height: 120%;
		}

		.hero nav ul a {
			text-decoration: none;
		}

		.hero nav ul ul {
			display: none;
			font-size: 1.25rem;
			margin-left: 1.5rem;
		}

			.hero nav ul li.visible ul {
				display: block;
			}

	.hero .tagline {
		font-size: 1.5rem;
		color: #fff;
		line-height: 120%;
		position: absolute;
		bottom: 1rem;
	}

		@media (min-width: 700px) {
			.hero .tagline {
				font-size: 2.285rem;
				line-height: 120%;
			}
		}

.main {
	padding: 1rem 0;
}

	@media (min-width: 700px) {
		.main {
			padding: 3.5rem 0;
		}
	}

	.content {
		width: 100%;
	}

		@media (min-width: 700px) {
			.content {
				/* margin-left: 30%; */
				width: 100%;
				max-width: 1100px;
				/* padding-right: 2rem; */
			}
		}

	.main p {
		margin-bottom: 1.2rem;
	}

	.main h1,
	.main h2 {
		font-size: 2rem;
		line-height: 120%;
		margin-bottom: 0.3em;
	}
    .main h3 {
		font-size: 1.6rem;
		line-height: 120%;
		margin-bottom: 0.3em;
	}

		@media (min-width: 700px) {
			.main h1,
			.main h2 {
				font-size: 2.5rem;
				line-height: 120%;
			}
			.main h3 {
				font-size: 1.4rem;
				line-height: 120%;
			}
		}

.main h4 {
		font-size: 1.5rem;
		line-height: 120%;
		margin-bottom: 0.3em;
	}

		@media (min-width: 700px) {

			.main h4 {
				font-size: 1.3rem;
				line-height: 120%;
			}
		}

	.main h3 {
		font-weight: bold;
		font-size: 1.05rem;
		line-height: 120%;
	}

	.main ul {
		padding-left: 20px;
		margin: 1.2rem 0;
	}

	.main ul li {
		list-style-type: disc;
	}

	.main img {
		max-width: 100%;
		height: auto;
	}

	.main .highlight {
		background: rgba(125, 164, 194, 0.9);
		padding: 1rem;
		color: #fff;
		margin: 1.2rem 0;
	}

	.main * > .highlight:first-child {
		margin-top: 0 !important
	}

		.main .highlight p:nth-last-child(2) {
			margin-bottom: 0;
		}

		.highlight p:empty {
			display: none;
			margin: 0;
		}

.wpcf7-form {
	width: 100%;
	max-width: 450px;
}

	.wpcf7-form input[type='text'],
	.wpcf7-form input[type='email'],
	.wpcf7-form input[type='submit'],
	.wpcf7-form textarea {
		border: none;
		outline: none;
		appearance: none;
		width: 100%;
		font: inherit;
		margin: 0 0 7px 0;
		padding: 0.3em 0.5em;
		color: #5D6B27;
		background: rgba(93, 107, 39, 0.15);
		transition: all 0.2s ease-in-out;
	}

		.wpcf7-form input[type='text']:focus,
		.wpcf7-form input[type='email']:focus,
		.wpcf7-form textarea:focus {
			background: rgba(93, 107, 39, 0.25);
		}

	.wpcf7-form input[type='submit'] {
		width: auto;
		background: rgba(93, 107, 39, 0.5);
		color: #fff;
		font-weight: bold;
		float: right;
		padding-right: 2em;
	}

	.content .gallery {
		display: flex;
		flex-flow: row wrap;
	}

		.content .gallery .gallery-item {
			float: none;
		}

			.content .gallery .gallery-item .gallery-icon {
				background: #e0ddd3;
				width: 100%;
				position: relative;
				overflow: hidden;
			}

				.content .gallery .gallery-item .gallery-icon::before {
					content: "";
					display: block;
					padding-top: 60%;
				}

			.content .gallery .gallery-item .gallery-icon img {
				border: none !important;
				/* height: 100% !important;
				width: auto !important; */
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translateX(-50%) translateY(-50%);
			}

		@media (max-width: 599px) {
			.content .gallery.gallery-columns-3 .gallery-item {
				width: 50% !important;
				width: calc(50% - 12px) !important;
				margin: 0 12px 12px 0 !important;
			}

			.content .gallery.gallery-columns-3 .gallery-item:nth-child(2n) {
				margin-right: 0 !important;
			}
		}

		@media (min-width: 600px) {
			.content .gallery.gallery-columns-3 .gallery-item {
				width: 33.33% !important;
				width: calc(33.33% - 8px) !important;
				margin: 0 12px 12px 0 !important;
			}

			.content .gallery.gallery-columns-3 .gallery-item:nth-child(3n) {
				margin-right: 0 !important;
			}
		}

footer {
	padding: 1rem 0;
	background: #A8B1AD;
	color: #fff;
	position: absolute;
	bottom: 0;
	width: 100%;
}

	.footer-areas {
		display: flex;
		flex-flow: row wrap;
	}

	.footer-area {
		margin-bottom: 1em;
		font-weight: 400;
		width: 100%;
	}

		@media (min-width: 800px) {
			.footer-area {
				width: 25%;
			}
		}

.pageWrap {
	min-height: 100vh;
}


.wp-block-columns.is-style-accordion {
	display: block !important;
	gap: 0 !important;
	margin-bottom: 0 !important
}

	.wp-block-columns.is-style-accordion > .wp-block-column:nth-child(1) {
		padding: 0;
		text-decoration: underline
	}

	.wp-block-columns.is-style-accordion > .wp-block-column:nth-child(1) > * {
		cursor: pointer;
	}

	.wp-block-columns.is-style-accordion > .wp-block-column:nth-child(1) > *:last-child {
		margin-bottom: 0 !important
	}



	.wp-block-columns.is-style-accordion > .wp-block-column:nth-child(2) {
		background: rgba(125, 164, 194, 0.2);
		padding: 2em;
		display: none;
		margin-top: 0.5em;

	}

		.wp-block-columns.is-style-accordion > .wp-block-column:nth-child(2) > *:first-child {
			margin-top: 0
		}

		.wp-block-columns.is-style-accordion.is-open > .wp-block-column:nth-child(2) {
			display: block;
		}

.wp-block-embed-youtube iframe {
	width: 100% !important;
	aspect-ratio: 16 / 9;
	height: auto !important;
}