@font-face {
  font-family: 'fontello';
  src: url('../pihakarhut/fonts/icons/fontello.eot?53653064');
  src: url('../pihakarhut/fonts/icons/fontello.eot?53653064#iefix') format('embedded-opentype'),
       url('../pihakarhut/fonts/icons/fontello.woff2?53653064') format('woff2'),
       url('../pihakarhut/fonts/icons/fontello.woff?53653064') format('woff'),
       url('../pihakarhut/fonts/icons/fontello.ttf?53653064') format('truetype'),
       url('../pihakarhut/fonts/icons/fontello.svg?53653064#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?51141483#fontello') format('svg');
  }
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: never;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;

  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-up:before { content: '\e800'; } /* '' */
.icon-emo-happy:before { content: '\e801'; } /* '' */
.icon-right-open-1:before { content: '\e802'; } /* '' */
.icon-star:before { content: '\e803'; } /* '' */
.icon-address:before { content: '\e804'; } /* '' */
.icon-mail:before { content: '\e805'; } /* '' */
.icon-phone:before { content: '\e806'; } /* '' */
.icon-edit:before { content: '\e807'; } /* '' */
.icon-search:before { content: '\e808'; } /* '' */
.icon-cancel:before { content: '\e809'; } /* '' */
.icon-sort-alt-down:before { content: '\f161'; } /* '' */


html {
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	font-size: 62.5%; }
}
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
img,
b,
u,
i,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
footer,
header {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
*,
*::before,
*::after {
	box-sizing: border-box;
}
article ul,
article ol {
	margin-bottom: 20px;
	padding-left: 30px;
}
article ul li,
article ol li {
	margin-bottom: 5px;
}
article li>ul, article li>ol {
	margin: 5px 0 0 0;
 }
img,
video,
object,
iframe {
	max-width: 100%;
}
img {
	display: flex;
	object-fit: contain;
	height: auto;
}
video {
	height: auto;
}
blockquote,
q {
	quotes: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
button,
input,
select,
textarea {
	margin: 0;
	font-weight: inherit;
}
:focus {
	outline: 0;
}
body {
	font-family: 'Poppins', sans-serif;
	font-size: 1.6rem;
	line-height: 1.8;
	color: #444;
	width: 100%;
	margin: 0;
}
strong,
b {
	font-weight: bold;
}
p {
	margin: 0 0 15px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Nunito";
	font-weight: 700;
	margin-top: 0.6em;
	margin-bottom: 0.6em;
	color: #222;
	transition: color 0.2s ease;
	line-height: 1.2;
}
h1, h2 {
	font-size: 2.8rem;
}
h3 {
	font-size: 2.8rem;
}
a {
	text-decoration: none;
	color: #165781;
	transition: all 0.2s linear;
}
a:link,
a:visited,
a:active {
	text-decoration: none;
}
em,
i,
cite {
	font-style: italic;
}
small {
	font-size: 100%;
}
figure {
	margin: 30px 0;
}
@media screen and (min-width: 768px) {
	body {
		padding-bottom: 0;
		margin-top: 0;
	}
	h1, h2 {
	    font-size: 3.6rem;
	    line-height: 1.1;
	}
}
/* Accessibility
--------------------------------------------- */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/*
**********************************************************************
* COMMON
**********************************************************************
*/

/*-[ All pages ]-----------------------*/
.main-container {
	transition: all .2s ease;
	left: 0;
	position: relative;
}
.container {
	max-width: 500px;
	position: relative;
	margin: auto;
	padding: 0 15px;
}

/*-[ Move to top ]-----------------------*/
#scroll-top {
	color: #fff;
	cursor: pointer;
	height: 40px;
	position: fixed;
	right: 10px;
	bottom: 10px;
	transition: all .25s linear 0s;
	width: 40px;
	z-index: 14;
	background: #165781;
	border-radius: 50%;
	font-size: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 2px 2px 6px 0 rgb(42 67 113 / 15%);
}
#scroll-top:not(.show) {
	opacity: 0;
	visibility: hidden;
}

/*-[ Helpers ]-----------------------*/
.column-2,
.column-3,
.column-4 {
	margin-bottom: 40px;
}
.section__heading {
	text-align: center;
	max-width: 700px;
	margin: 0 auto 40px;
}
.section__title {
	font-weight: 700;
	font-size: 1.7rem;
	font-family: "Nunito";
}
.section__sub {
	margin: 15px 0;
	color: #69b751;
	font-weight: 800;
}
body .cta.section__more {
	margin: 50px auto 0;
}
.vertical-center {
	align-items: center;
}
.row-reverse {
	flex-direction: row-reverse;
}
.no-padding {
	padding: 0;
}
.no-top-padding {
	padding-top: 0;
}
.bg-grey {
	background-color: #eee;
}
.big-p {
	font-size: 2rem;
	line-height: 1.8;
}
.yellow-text {
    color: #165781;
}
.green-text {
    color: #69b751;
}
.white-banner-text {
	color: #fff;
	text-shadow: 0 0 5px #000;
}
.center-text {
	text-align: center;
}
.left-border {
	border-top: 1px solid #e6e6e6;
}
.mb-40 {
	margin-bottom: 40px;
}
@media screen and (min-width: 768px) {
	.left-border {
		border-left: 1px solid #e6e6e6;
		border-top: none;
	}
}
/*-[ No template page ]-----------------------*/
#page {
	display: flex;
	justify-content: center;
	position: relative;
    margin-top: 40px;
}
#primary,
#primary-full {
   width: 100%;
   margin-bottom: 30px;
   position: relative;
}
article {
	margin-bottom: 30px;
}
.archive article {
	border:  1px solid #e5e5e5;
}

/*-[ Blog list & Search page ]-----------------------*/
.search-title {
	margin-bottom: 25px;
}
.archive .post-content {
	padding: 10px 30px;
}
.page-template-default .post-content {
	padding: 30px 0 10px;
}
.post-thumbnail {
	margin-bottom: 15px;
	display: block;
}
/*-[ Single ]-----------------------*/
.entry-content h2 {
	font-size: 3rem;
}
.entry-content h3 {
    font-size: 2.2rem;
}

/*-[ Sidebar ]-----------------------*/
#sidebar {
	display: none;
}

/* COMMON - DESKTOP */
@media screen and (min-width: 768px) {
	.container {
		max-width: 1140px;
		padding: 0 30px;
	}
	.container.narrow {
		max-width: 1020px;
	}
	.row {
		display: flex;
		justify-content: space-between;
	    flex-wrap: wrap;
	}
	.column-2 {
		width: 48%;
		margin-bottom: 0;
	}
	.column-3 {
		width: 31.5%;
		margin-bottom: 0;
	}
	.column-3__no-gap {
		width: calc(100% / 3);
	}
	.column-4 {
		width: 21%;
		margin-bottom: 0;
	}
	.column-3-2 {
		width: 61%;
	}
	.column-3-1 {
		width: 35%;
	}
	#primary {
		width: calc(100% - 330px);
	}
	#page {
		justify-content: space-between;
	}
	#sidebar {
		display: block;
		width: 300px;
	}
	#sidebar section {
		padding: 0;
	}
	#sidebar h3 {
		font-size: 2rem;
		padding-bottom: 10px;
		margin-bottom: 20px;
		border-bottom: 1px dashed #e5e5e5;
	}
	.wp-block-latest-posts__post-title {
		color: #222;
		font-weight: 700;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		line-height: 21px;
		margin-bottom: 8px;
	}
	#sidebar time {
		font-size: 13px;
	}
	#sidebar ul {
		padding-left: 0;
		list-style: none;
	}
	#sidebar li {
	    margin-bottom: 20px;
	    position: relative;
	    height: 100px;
	    padding-left: 115px;
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	}
	.wp-block-latest-posts__featured-image {
		position: absolute;
		left: 0;
		border-radius: 8px;
		overflow: hidden;
	}
}

/*
**********************************************************************
* HEADER
**********************************************************************
*/
#site-header {
	margin: 0;
	width: 100%;
	max-width: initial;
	box-shadow: 0 0 10px rgb(0 0 0 / 15%);
}
.top-bar {
	display: none;
}
.mobile-menu-active #nav {
	left: 0;
}
#site-header .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.logo {
	margin: 10px auto;
}
.logo img {
    width: 200px;
}
.open-search {
	color: #333;
	font-size: 24px;
	cursor: pointer;
	position: absolute;
    top: 12px;
    right: 15px;
}

/* HEADER - DESKTOP */
@media screen and (min-width: 768px) {
	.top-bar {
		background-color: #1e1d23;
	}
	.top {
		display: flex;
		color: #fff;
		height: 42px;
		align-items: center;
	}
	.top__info-wrap {
		display: flex;
	}
	.top__info {
		margin: 0 20px;
		display: flex;
	}
	.logo {
		margin: 0;
	}
	.logo img {
	    width: 240px;
	}
	.header-right {
		display: flex;
		align-items: center;
	}
	/* .slogan-wrap {
		display: block;
	    margin: 20px 0 0 25px;
	}
	.slogan-wrap p {
	    color: #666;
	    font-size: 12px;
	    line-height: 1.2em;
	    margin: 0;
	} */
	#mobile-toggle-button {
		display: none;
	}
	.open-search {
	    margin: 3px 0 0 20px;
	    position: static;
	}
}

/*-[ Navigation ]-----------------------*/
.mobile-menu-active {
    position: fixed;
}
.mobile-menu-active .main-container{
    left: 300px;
}
#nav {
	position: fixed;
	width: 300px;
	left: -300px;
	top: 0;
	transition: left .2s ease;
	height: 100%;
	overflow: auto;
	z-index: 15;
	background:  #000;
	padding: 40px 10px 10px 30px;
}
#nav ul {
	list-style: none;
}
.nav__menu-list {
	padding: 0;
}
.nav__menu-list a {
	color: #fff;
}
.nav__parent-item {
	position: relative;
}
.nav__parent-item a {
	padding: 17px 0;
	display: block;
	border-bottom: 1px solid #0c0c0c;
	line-height: 24px;
	font-weight: 500;
}
.nav__toggle-caret {
	position: absolute;
	right: 0;
	top: 0;
	width: 59px;
	display: flex;
	justify-content: center;
	align-items: center;
}
.nav__toggle-caret--parent {
	color: #fff;
	height: 58px;
}
.nav__parent-item.active > .nav__toggle-caret {
	transform: rotate(180deg);
	background-color: #165781;
	height: 28px;
	margin: 15px 10px;
	border-radius: 5px;
	width: 39px;
}
.nav__toggle-caret .icon-right-open-1 {
	transform: rotate(90deg);
}
.sub-menu {
	max-height: 0;
	transition: max-height 0.15s ease-out;
	overflow: hidden;
	padding-left: 20px;
}
.menu-item.active > .sub-menu {
	max-height: 2000px;
	transition: max-height 0.2s ease-in;
}
.nav__child-item {
	position: relative;
	white-space: nowrap;
}
.nav__child-item a {
	padding: 10px 0;
}
.mobile-menu-active .mobile-menu-overlay {
	display: block;
}
.mobile-menu-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,.5);
	opacity: 0;
	transition: opacity .2s ease;
	z-index: 10;
}
.mobile-menu-overlay.is-active {
	opacity: 1;
}

/* Navigation - DESKTOP */
@media screen and (min-width: 768px) {
	#nav {
		position: static;
		width: auto;
		max-width: 1192px;
		overflow: visible;
		padding: 0;
		background: transparent;
		height: 100px;
		display: flex;
	}
	.nav__menu-list {
		display: flex;
		border: none;
		position: relative;
		padding: 0;
	}
	.nav__parent-item > a {
		padding: 16px !important;
		color: #222;
		font-size: 1.6rem;
		line-height: 1.8;
	}
	.nav__menu-list a:hover {
		color: #165781;
	}
	.nav__parent-item {
		display: flex;
	}
	.nav__parent-item a {
		text-indent: 0;
		border: none;
		display: flex;
		align-items: center;
	}
	.nav__parent-item:first-child a {
		padding: 0 15px 0 0;
	}
	.nav__parent-item.menu-item-has-children > a:after {
		content: "";
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		border-top: 5px solid #222;
		margin-left: 10px;
	    transition: all 0.2s linear;
	}
	.nav__parent-item.menu-item-has-children > a:hover::after {
	    border-top: 5px solid #165781;
	}
	.nav__parent-item:hover > .sub-menu {
		display: block;
	}
	.nav__toggle-caret {
		display: none;
	}
	.sub-menu {
		display: none;
		background-color: #fff;
		position: absolute;
		top: 100%;
		z-index: 14;
		left: 0;
		max-height: initial;
		overflow: initial;
		box-shadow: 0 0 30px rgb(0 0 0 / 8%);
		padding: 15px 0;
		border-radius: 4px;
	}
	.nav__child-item a {
		font-size: 14px;
		padding: 15px 30px;
		color: #222;
		line-height: 1;
		font-weight: normal;
	}
	.nav__child-item a:hover {
		background-color: rgba(0,0,0,.03);
		transition: all .2s linear;
	}
}

/* mobile-toggle - MOBILE ONLY */
@media screen and (max-width: 888px) {
	.mobile-toggle {
		padding: 20px 5px;
		transition-property: opacity, filter, -webkit-filter;
		transition-duration: 0.15s;
		transition-timing-function: linear;
		background-color: transparent;
		border: 0;
		display: flex;
		position: absolute;
	}
	.mobile-toggle-box {
		width: 36px;
		height: 19px;
		display: inline-block;
		position: relative;
	}
	.mobile-toggle-inner {
		display: block;
		margin-top: -2px;
		top: 2px;
	}
	.mobile-toggle-inner,
	.mobile-toggle-inner::before,
	.mobile-toggle-inner::after {
		width: 24px;
		height: 3px;
		background-color: #222;
		border-radius: 3px;
		position: absolute;
		transition-property: transform, -webkit-transform;
		transition-duration: 0.2s;
		transition-timing-function: ease;
	}
	.mobile-toggle-inner::before,
	.mobile-toggle-inner::after {
		content: "";
		display: block;
	}
	/*..................
	https://jonsuh.com/mobile-toggles
	https://github.com/jonsuh/mobile-toggles
	....................*/
	.mobile-toggle-inner::before {
		top: 8px;
		transition-property: transform, opacity, -webkit-transform;
		transition-timing-function: ease;
		transition-duration: 0.15s;
	}
	.mobile-toggle-inner::after {
		top: 16px;
	}
	.mobile-menu-active .mobile-toggle {
		margin-left: -60px;
		z-index: 100;
	}
	.mobile-menu-active .mobile-toggle-inner {
		-webkit-transform: translate3d(0, 8px, 0) rotate(45deg);
		transform: translate3d(0, 8px, 0) rotate(45deg);
		background-color: #fff;
	}
	.mobile-menu-active .mobile-toggle-inner::before {
		-webkit-transform: rotate(-45deg) translate3d(-300px, -6px, 0);
		transform: rotate(-45deg) translate3d(-300px, -6px, 0);
	}
	.mobile-menu-active .mobile-toggle-inner::after {
		-webkit-transform: translate3d(0, -16px, 0) rotate(-90deg);
		transform: translate3d(0, -16px, 0) rotate(-90deg);
		background-color: #fff;
	}
}

/*-[ Sections)  ]-----------------*/
section {
	padding: 70px 0;
}

/*Section Banners*/
.banner__wrap {
	position: relative;
}
.banner__fixed {
	padding: 80px 0 80px;
	background-color: #333;
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
/* .banner__static {
	padding: 80px 0 120px;
	background-color: #333;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
} */
.banner__overlay {
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	position: absolute;
	background-color: #13270e;
	opacity: 0.3;
}
.banner__button {
	box-shadow: 0 1px 5px 0 rgb(0 0 0 / 50%);
}
/*Front Page Banner*/
.front-banner {
	background-image: url("../pihakarhut/img/pihakarhut-banneri.jpg");
	background-color: #333;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 50px 0;
	text-align: center;
}
.front-banner__top {
	color: #fff;
	font-size: 1.5rem;
	line-height: 1.5;
	font-weight: 600;
	text-shadow: 1px 0 6px #000;
}
.front-banner h1 {
	color: #fff;
	font-size: 3.4rem;
	line-height: 1.1;
	margin: 0 0 20px;
	text-shadow: 1px 0 6px #000;
	text-transform: uppercase;
	font-family: 'Poppins', sans-serif;
}
.front-banner__bottom {
	color: #fff;
	text-shadow: 1px 0 6px #000;
	font-weight: 500;
	line-height: 1.5;
}
/* Page Banner - DESKTOP */
@media screen and (min-width: 768px) {
	.front-banner {
		min-height: 600px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.front-banner h1 {
		color: #fff;
		line-height: 1;
		font-size: 10rem;
	}
	.front-banner__top {
		font-size: 2.4rem;
		line-height: 1.1;
	}
	.front-banner__bottom {
		font-size: 1.8rem;
		line-height: 1.4;
		max-width: 580px;
		margin: 0 auto 20px;
	}
}

/*Services Banner*/
.page-banner {
	background-image: url("../pihakarhut/img/palvelut-tausta.png");
	background-color: #333;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 40px 0;
	text-align: center;
}
.page-banner h1 {
	color: #fff;
	font-size: 3.6rem;
}
/* Page Banner - DESKTOP */
@media screen and (min-width: 768px) {
	.page-banner {
		text-align: left;
	}
	.page-banner h1 {
		font-size: 5.6rem;
	}
}

/*Section Info Boxes*/
.info-boxes {
	text-align: center;
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .08);
	background-color: #fff;
}
.info-boxes h3 {
	font-size: 2.2rem;
}
.info-box {
	padding: 40px;
}

/*Section Company Boxes*/
.company-banner {
	background-image: url("../pihakarhut/img/tietoja-tausta.jpeg");
}
.company__p {
	max-width: 600px;
	margin: auto;
}
.company-boxes {
	max-width: 1000px;
	margin: 65px auto 0;
}
.company-box {
	text-align: center;
	font-family: "Nunito";
}
.company-box__img img {
	margin: 0 auto 30px;
}
.company-box p {
	color: #fff;
	margin-bottom: 0;
}
.company-box__number {
	font-size: 4.8rem;
	font-weight: 600;
	line-height: 1;
}
.company-box__text {
	font-size: 2.2rem;
	font-weight: 700;
}

/*Section Service Boxes*/
.service-box {
	text-align: center;
	box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, .1);
}
.service-box-text {
    padding: 15px;
}
.service-box h3 {
	font-size: 2.4rem;
}

/*Section Testimonials*/
.testimonials__box {
	padding: 30px;
	text-align: center;
	position: relative;
	border-radius: 5px;
	background-color: #fff;
}
.testimonials__photo {
	margin-bottom: 20px;
    display: flex;
    justify-content: center;
}
.testimonials__name {
	font-family: "Nunito";
	font-size: 2.2rem;
	font-weight: 700;
	margin-bottom: 10px;
}
.testimonials__firm {
	font-size: 1.4rem;
	color: #767676;
}
.testimonials__stars {
	display: flex;
	justify-content: center;
}
#section-testimonials .icon-star:before {
	color: #69b751;
	margin: 0;
}
#section-testimonials p {
	margin-top: 5px;
	color: #767676;
}
.testimonials__quote {
    position: absolute;
    top: 55px;
    left: 50%;
    height: 50px;
    -webkit-transform: scaleX(-1) translateX(120px);
    transform: scaleX(-1) translateX(120px);
}
/* Testimonials - DESKTOP */
@media screen and (min-width: 850px) {
	.testimonials__quote {
		top: 40px;
		width: 70px;
		height: 70px;
		-webkit-transform: scaleX(-1) translateX(160px);
    	transform: scaleX(-1) translateX(160px);
	}
}

/*Section Steps*/
.steps__step {
	margin-bottom: 100px;
}
.steps__step:last-of-type {
	margin-bottom: 0;
}
.steps__image {
	display: flex;
	justify-content: center;
}
#section-steps h3 {
	margin-top: 0;
}
#section-steps p {
	line-height: 2;
}
/* Steps - DESKTOP */
@media screen and (min-width: 768px) {
	.steps__step {
		align-items: center;
	}
	.steps__image {
		max-width: 420px;
	}
	#section-steps h3 {
		margin-top: 10px;
		font-size: 3.6rem;
	}
	#section-steps p.steps__calligraphy {
		font-size: 2.5rem;
	}
}

/*Section Contact*/
.contact-boxes {
	text-align: center;
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, .08);
	background-color: #fff;
}
.contact-boxes h3 {
	font-size: 2.2rem;
}
.contact-box {
	padding: 30px 10px;
}
.contact-box__icon {
	color: #69b751;
    font-size: 70px;
}
@media screen and (min-width: 768px) {
	.contact-box {
		padding: 40px
	}
}

/*Section Map*/
#section-map iframe {
	width: 100%;
	height: 500px;
    display: flex;
}

/*Section Project*/
.project-sidebar {
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, .05);
    margin-bottom: 60px;
}
.project-sidebar__title {
    padding: 14px 30px;
    color: #fff;
    background: #69b751;
    font-weight: 600;
    font-size: 24px;
    line-height: 32px;
	margin: 0;
}
.project-sidebar__inner {
    padding: 15px 30px 15px;
}
.project-sidebar__item {
    padding: 15px 0px;
    border-bottom: 1px solid #e6e6e6;
}
.project-sidebar__item:last-of-type {
	border-bottom: none;
}
.project-sidebar__item-title {
	margin: 0;
    font-size: 22px;
    font-weight: 700;
}
.project-sidebar__item-text {
	margin: 0;
	color: #808080;
}

/*-[ Searchform (Header & Search page)  ]-----------------*/
.main-search {
    background: #165781;
    height: 0;
    transition: all 0.2s ease;
    overflow: hidden;
}
.search-active .main-search {
	height: 40px;
}
.main-search .search-form {
    display: flex;
    align-items: center;
    height: 100%
}

.main-search button {
    background: 0 0;
    border: none;
    cursor: pointer;
    padding: 0;
    outline: 0;
    margin-right: 15px;
    color: #fff
}

.main-search label {
    width: 100%;
    padding-right: 5px
}

.main-search input[type=search] {
    background: 0 0;
    padding: 0;
    border: none;
    height: 100%;
    width: 100%;
    padding-right: 10px;
    font-size: 16px;
    color: #fff;
}

.main-search input[type=search]:focus {
    outline: none
}

.main-search input[type=search]::placeholder {
    color: #fff;
}
.close-search {
    margin-right: 10px;
    cursor: pointer;
    color: #fff;
    font-size: 24px;
}
.main-search .icon-search:before {
    font-size: 22px;
}
#searchform {
	width: 100%;
	max-width: 600px;
}
.searchform__search-field {
    display: flex;
    border-radius: 8px;
    position: relative;
    border: none;
    padding: 10px 20px;
    background: #eee;
}
.searchform__search-field label {
	position: absolute;
	height: 1px;
	width: 1px;
	clip: rect(1px,1px,1px,1px);
	overflow: hidden;
}
.searchform__search-button {
    border: none;
    background: transparent;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	font-size: 24px;
}
.searchform__search-input {
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 1.6rem;
    flex: 1;
}

/*
**********************************************************************
* Portfolio
**********************************************************************
*/

/*-[ Portfolio archive ]-----------------*/
/* .portfolio .post-content {
	padding: 20px 10px 10px;
}
.post-type-archive-portfolio .entry-title {
	font-size: 2.2rem;
	margin-bottom: 6px;
}
@media screen and (min-width: 768px) {
	#primary-portfolio {
	   margin-bottom: 30px;
	   display: flex;
	   flex-wrap: wrap;
	}
	article.portfolio-box {
		margin: 15px;
		padding: 10px;
		border-radius: 30px;
		width: calc(33.3% - 30px);
	}
	article.portfolio-box img {
		border-radius: 25px;
	}
} */
/*-[ Portfolio single ]-----------------*/
/* .single-portfolio article {
	border: none;
	border-radius: 0;
}
.single-portfolio .post-content {
	max-width: 970px;
	margin: auto;
}
.portfolio-h2 {
	background-color: #69b751;
	padding: 15px 35px;
	border-radius: 8px;
    margin: 20px auto 50px;
    width: fit-content;
    font-size: 2.4rem;
    color: #fff;
} */

/*
**********************************************************************
* FOOTER
**********************************************************************
*/
#site-footer {
	background-color: #181818;
}
#site-footer .container {
	display: flex;
	justify-content: space-between;
	padding: 20px 20px 10px;
	flex-wrap: wrap;
}
.f-top {
    display: flex;
    justify-content: center;
    padding: 50px 0;
}
.f-column {
	flex: 0 0 250px;
	margin: 0 auto 25px;
}
.f-widget {
	margin-bottom: 18px;
}
.f-widget p,
.f-widget a {
	color: #ddd;
}
.footer-icon {
	width: 40px;
	height: 40px;
	display: inline-block;
	background-size: contain;
}
.copy {
	background-color: #111;
	text-align: center;
    color: #fff;
    margin: 30px auto 0;
	padding: 30px 15px;
	text-shadow: 0 0 3px rgb(0 0 0 / 60%);
}
.copy a {
	color: #fff;
	font-weight: 700;
}

/* FOOTER - DESKTOP */
@media screen and (min-width: 768px) {
	.f-top {
	    border-bottom: 1px solid #303030;
	    padding: 100px 0 0;
	    margin-bottom: 80px;
	}
	.f-top a {
		display: block;
	    margin-bottom: -20px;
	    background: #181818;
	    padding: 0 5px;
	}
}
@media screen and (min-width: 767px) {
	.f-column {
		flex: 1 0 250px;
		margin: 0 20px 0 0;
	}
}

/*-[ Envira Gallery ]-----------------*/
@media only screen and (max-width: 767px) {
    body .envira-gallery-wrap .envira-gallery-public.envira-gallery-1-columns .envira-gallery-item, body .envira-gallery-wrap .envira-gallery-public.envira-gallery-2-columns .envira-gallery-item, body .envira-gallery-wrap .envira-gallery-public.envira-gallery-3-columns .envira-gallery-item, body .envira-gallery-wrap .envira-gallery-public.envira-gallery-4-columns .envira-gallery-item, body .envira-gallery-wrap .envira-gallery-public.envira-gallery-5-columns .envira-gallery-item, body .envira-gallery-wrap .envira-gallery-public.envira-gallery-6-columns .envira-gallery-item {
        width: 100% !important;
    }
}

/*
**********************************************************************
* ELEMENTS
**********************************************************************
*/
/*-[ Buttons ]-----------------*/
body .cta {
	padding: 20px 45px;
	border-radius: 27px;
	font-size: 1.4rem;
	line-height: 1.4rem;
	display: inline-block;
	text-align: center;
	color: #222;
	margin: 20px 0;
	font-weight: 600;
	text-transform: uppercase;
	background-color: #fff;
}
body a.cta:hover {
	opacity: 0.8;
}
body button.cta {
	cursor: pointer;
	border: none;
}
body .cta.primary {
	background-color: #69b751;
	color: #fff;
	text-shadow: 0 0 5px rgb(0 0 0 / 50%);
}
body .cta.secondary {
	background-color: #165781;
	color: #fff;
	text-shadow: 0 0 5px rgb(0 0 0 / 50%);
}

/*-[ Cookie notification ]--------------------*/
#cookie-notice a.cta.primary.cn-more-info {
	background-color: transparent;
	border-color: transparent;
	color: white;
	margin: 0;
	padding: 0 0 0 5px;
	text-decoration: underline;
}
#cookie-notice a.cta.primary {
	padding: 5px 20px;
	border-radius: 8px;
	margin: 0 10px 0 0;
}
#cn-notice-text {
	display: block;
	margin-bottom: 5px;
}
.cookie-notice-container {
	box-sizing: border-box;
}
/*
**********************************************************************
* Contact Form
**********************************************************************
*/
#contact-form {
	margin: auto;
}
#contact-form label{
    position: absolute;
    top: -99999px;
    left: -99999px;
}
#contact-form input[type="text"],
#contact-form textarea {
	width: 100%;
	color: #7e7e7e;
    border: 1px solid #e6e6e6;
    padding: 14px 20px;
    outline: none;
    font-family: 'Poppins', sans-serif;
    margin: 10px 0;
    font-size: 16px;
}
.service-section {
	background-color: #fff;
	padding: 9.5px 16px;
	border: 1px solid #e6e6e6;
	margin: 10px 0;
}
#contact-form select {
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    border: 0;
	color: #7e7e7e;
    outline: none;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    background-color: #fff;
}
#contact-form input[type="submit"] {
    border: none;
    cursor: pointer;
}
#contact-form textarea {
	height: 120px;
}

/* Style the validation errors */
.validation-message {
    color: #cc0000;
    font-size: 16px;
}

/* Style the success message */
.success-message {
    color: #090;
    font-size: 20px;
	font-weight: bold;
}
/* Contact Form - DESKTOP */
@media screen and (min-width: 768px) {
	#section-order .form-section-full {
		width: 100%;
	}
	#section-order .form-section {
		width: 49%;
	}
}
