/*!
Theme Name: SSS-Builders
Theme URI: http://vstefanova.com/
Author: vstefanova.com
Author URI: http://vstefanova.com/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
	 html {
	 	line-height: 1.15;
	 	-webkit-text-size-adjust: 100%;
	 }

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
	 body {
	 	margin: 0;
	 }

/**
 * Render the `main` element consistently in IE.
 */
	 main {
	 	display: block;
	 }

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
	 h1 {
	 	font-size: 2em;
	 	margin: 0.67em 0;
	 }

/* Grouping content
	 ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
	 hr {
	 	box-sizing: content-box;
	 	height: 0;
	 	overflow: visible;
	 }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
	 pre {
	 	font-family: monospace, monospace;
	 	font-size: 1em;
	 }

/* Text-level semantics
	 ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */
	 a {
	 	background-color: transparent;
	 }

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
	 abbr[title] {
	 	border-bottom: none;
	 	text-decoration: underline;
	 	text-decoration: underline dotted;
	 }

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
	 b,
	 strong {
	 	font-weight: bolder;
	 }

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
	 code,
	 kbd,
	 samp {
	 	font-family: monospace, monospace;
	 	font-size: 1em;
	 }

/**
 * Add the correct font size in all browsers.
 */
	 small {
	 	font-size: 80%;
	 }

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
	 sub,
	 sup {
	 	font-size: 75%;
	 	line-height: 0;
	 	position: relative;
	 	vertical-align: baseline;
	 }

	 sub {
	 	bottom: -0.25em;
	 }

	 sup {
	 	top: -0.5em;
	 }

/* Embedded content
	 ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */
	 img {
	 	border-style: none;
	 }

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
	 button,
	 input,
	 optgroup,
	 select,
	 textarea {
	 	font-family: inherit;
	 	font-size: 100%;
	 	line-height: 1.15;
	 	margin: 0;
	 }

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
	 button,
	 input {
	 	overflow: visible;
	 }

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
	 button,
	 select {
	 	text-transform: none;
	 }

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
	 button,
	 [type="button"],
	 [type="reset"],
	 [type="submit"] {
	 	-webkit-appearance: button;
	 }

/**
 * Remove the inner border and padding in Firefox.
 */
	 button::-moz-focus-inner,
	 [type="button"]::-moz-focus-inner,
	 [type="reset"]::-moz-focus-inner,
	 [type="submit"]::-moz-focus-inner {
	 	border-style: none;
	 	padding: 0;
	 }

/**
 * Restore the focus styles unset by the previous rule.
 */
	 button:-moz-focusring,
	 [type="button"]:-moz-focusring,
	 [type="reset"]:-moz-focusring,
	 [type="submit"]:-moz-focusring {
	 	outline: 1px dotted ButtonText;
	 }

/**
 * Correct the padding in Firefox.
 */
	 fieldset {
	 	padding: 0.35em 0.75em 0.625em;
	 }

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */
	 legend {
	 	box-sizing: border-box;
	 	color: inherit;
	 	display: table;
	 	max-width: 100%;
	 	padding: 0;
	 	white-space: normal;
	 }

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
	 progress {
	 	vertical-align: baseline;
	 }

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
	 textarea {
	 	overflow: auto;
	 }

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
	 [type="checkbox"],
	 [type="radio"] {
	 	box-sizing: border-box;
	 	padding: 0;
	 }

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
	 [type="number"]::-webkit-inner-spin-button,
	 [type="number"]::-webkit-outer-spin-button {
	 	height: auto;
	 }

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
	 [type="search"] {
	 	-webkit-appearance: textfield;
	 	outline-offset: -2px;
	 }

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
	 [type="search"]::-webkit-search-decoration {
	 	-webkit-appearance: none;
	 }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
	 ::-webkit-file-upload-button {
	 	-webkit-appearance: button;
	 	font: inherit;
	 }

/* Interactive
	 ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
	 details {
	 	display: block;
	 }

/*
 * Add the correct display in all browsers.
 */
	 summary {
	 	display: list-item;
	 }

/* Misc
	 ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */
	 template {
	 	display: none;
	 }

/**
 * Add the correct display in IE 10.
 */
	 [hidden] {
	 	display: none;
	 }

/* Box sizing
--------------------------------------------- */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after {
	box-sizing: inherit;
}

html {
	box-sizing: border-box;
}

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

/* Typography
--------------------------------------------- */
body,
button,
input,
select,
optgroup,
textarea {
	color: #404040;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 1rem;
	line-height: 1.5;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1.5em;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

blockquote {
	margin: 0 1.5em;
}

address {
	margin: 0 0 1.5em;
}

pre {
	background: #eee;
	font-family: "Courier 10 Pitch", courier, monospace;
	line-height: 1.6;
	margin-bottom: 1.6em;
	max-width: 100%;
	overflow: auto;
	padding: 1.6em;
}

code,
kbd,
tt,
var {
	font-family: monaco, consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	background: #fff9c0;
	text-decoration: none;
}

big {
	font-size: 125%;
}

/* Elements
--------------------------------------------- */
body {
	background: var(--gray);
}

hr {
	background-color: #ccc;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}

ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
	max-width: 100%;
}

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

figure {
	margin: 1em 0;
}

table {
	margin: 0 0 1.5em;
	width: 100%;
}

/* Links
--------------------------------------------- */
a {
	color: #4169e1;
}

a:visited {
	color: #800080;
}

a:hover,
a:focus,
a:active {
	color: #191970;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	outline: 0;
}

/* Forms
--------------------------------------------- */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

select {
	border: 1px solid #ccc;
}

textarea {
	width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Components
--------------------------------------------------------------*/

/* Navigation
--------------------------------------------- */
.main-navigation {
	display: block;
	width: 100%;
}

.main-navigation ul {
	display: none;
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.main-navigation ul ul {
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	float: left;
	position: absolute;
	top: 100%;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
	display: block;
	left: auto;
}

.main-navigation ul ul a {
	width: 200px;
}

.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
	left: auto;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: block;
	text-decoration: none;
}

/* Small menu. */
.menu-toggle,
.main-navigation.toggled ul {
	display: block;
}

@media screen and (min-width: 37.5em) {

	.menu-toggle {
		display: none;
	}

	.main-navigation ul {
		display: flex;
	}
}

.site-main .comment-navigation,
.site-main
.posts-navigation,
.site-main
.post-navigation {
	margin: 0 0 1.5em;
}

.comment-navigation .nav-links,
.posts-navigation .nav-links,
.post-navigation .nav-links {
	display: flex;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
	flex: 1 0 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
	text-align: end;
	flex: 1 0 50%;
}

/* Posts and pages
--------------------------------------------- */
.sticky {
	display: block;
}

.post,
.page {
	margin: 0 0 1.5em;
}

.updated:not(.published) {
	display: none;
}

.page-content,
.entry-content,
.entry-summary {
	margin: 1.5em 0 0;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}

/* Comments
--------------------------------------------- */
.comment-content a {
	word-wrap: break-word;
}

.bypostauthor {
	display: block;
}

/* Widgets
--------------------------------------------- */
.widget {
	margin: 0 0 1.5em;
}

.widget select {
	max-width: 100%;
}

/* Media
--------------------------------------------- */
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* Make sure logo link wraps around logo image. */
.custom-logo-link {
	display: inline-block;
}

/* Captions
--------------------------------------------- */
.wp-caption {
	margin-bottom: 1.5em;
	max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
}

.wp-caption-text {
	text-align: center;
}

/* Galleries
--------------------------------------------- */
.gallery {
	margin-bottom: 1.5em;
	display: grid;
	grid-gap: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	width: 100%;
}

.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

.gallery-caption {
	display: block;
}

/*--------------------------------------------------------------
# Plugins
--------------------------------------------------------------*/

/* Jetpack infinite scroll
--------------------------------------------- */

/* Hide the Posts Navigation and the Footer when Infinite Scroll is in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
	display: none;
}

/* Re-display the Theme Footer when Infinite Scroll has reached its end. */
.infinity-end.neverending .site-footer {
	display: block;
}

/*--------------------------------------------------------------
# Utilities
--------------------------------------------------------------*/

/* 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;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

/* Alignments
--------------------------------------------- */
.alignleft {

	/*rtl:ignore*/
	float: left;

	/*rtl:ignore*/
	margin-right: 1.5em;
	margin-bottom: 1.5em;
}

.alignright {

	/*rtl:ignore*/
	float: right;

	/*rtl:ignore*/
	margin-left: 1.5em;
	margin-bottom: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5em;
}

/*--------------------------------------------------------------
# Main Styles
--------------------------------------------------------------*/

:root {
  --color-primary: #002626;
  --color-secondary: #F0F7EE;
  --duration: 1s;
  --nav-duration: calc(var(--duration) / 4);
  --ease: cubic-bezier(0.215, 0.61, 0.355, 1);
  --space: 1rem;
  --font-size: 1.125rem;
  --line-height: 1.5;
  --dark: #262533;
  --gray: #e1e1e1;
  --green: #359d43;
}

body { font-weight: 400; font-size: 18px; line-height: 1.6; background-color: #262533; color: var(--gray); }
a { text-decoration: none; color: var(--gray); transition: .3s; }
a:visited,
a:hover,
a:active {color: var(--gray); }

h1 { font-size: 32px; margin-bottom: 20px; }
h2 { font-size: 26px; font-weight: 400; margin-bottom: 20px; line-height: 1.2; }
h3 { font-size: 24px; margin-bottom: 20px; }
h4 { font-size: 22px; margin-bottom: 15px; }
h5 { font-size: 20px; margin-bottom: 10px; }
h6 { font-size: 18px; margin-bottom: 0; }

h1,
h2,
h3,
h4,
h5,
h6 { font-family: 'Russo One', sans-serif; color: var(--gray); }

hr { border-color: rgba(255,255,255,.6); }

.page { margin-bottom: 0; }

.text-lg {
	font-size: 20px;
}

.site-logo { font-family: 'Russo One', sans-serif; display: flex; align-items: center; transform: translateZ(0); }
.logo-icon { width: 50px; height: 50px; animation: rotate 3s; transform-origin: 71% 29%; transition: .3s ease; }
#icon { animation: fadein 3s; }
#nut { opacity: 0; animation: fadeout 3s; }

ul { list-style: none; margin-left: 0; padding-left: 0; }
ul li { position: relative; padding-left: 20px; }
ul li:before { position: absolute; top: 3px; left: 0; height: 10px; width: 10px; border-left: 10px solid var(--green); border-top: 10px solid transparent; border-bottom: 10px solid transparent; content: ''; }

.ico { display: inline-block; height: 30px; width: 30px; background-size: contain; background-repeat: no-repeat; background-position: center; }
.ico--fb { background-image: url(assets/images/facebook.png); }
.ico--phone { background-image: url(assets/images/phone-call.png); }
.ico--location { background-image: url(assets/images/location.png); }
.ico--email { background-image: url(assets/images/envelope.png); }

img.alignleft,
img.aligright { margin-bottom: 0; }

@keyframes rotate {
	0% 		{ transform: rotate(135deg); }
	33% 	{ transform: rotate(135deg); }
	66% 	{ transform: rotate(135deg); }
	100% 	{ transform: rotate(0deg); }
}

@keyframes fadein {
	0% 		{ opacity: 0; }
	33% 	{ opacity: 0; }
	66% 	{ opacity: 1; }
	100% 	{ opacity: 1; }
}

@keyframes fadeout {
	0% 		{ opacity: 1; }
	33% 	{ opacity: 1; }
	90% 	{ opacity: 1; }
	100% 	{ opacity: 0; }
}

.site { width: 100%; overflow-x: hidden; }
.logo { position: relative; text-decoration: none; }
#logo { opacity: 0; }
.site-title { position: relative; overflow: hidden; margin-left: -1.5rem; transform: translateZ(0); }
.site-title-text { padding: 0.25rem 0.375rem 0.25rem 1.75rem; color: #3F3C3C; opacity: 0; font-size: 2rem; font-weight: 800; transition: .3s ease; }
.site-title-text span { margin-left: 0.015625rem; color: #359d43; }
.logo--white .site-title-text { color: var(--green); }
.logo--white .site-title-text span { color: #fff; }

.btn { font-size: 16px; letter-spacing: 1px; font-family: 'Russo One', sans-serif; transition: 0.4s; }
.btn,
.btn:visited {color: var(--gray); }
.btn:hover { box-shadow: inset 0 0 0 2em var(--green); } 

.btn--green { background-color: var(--green); color: #fff; }
.btn--cta { display: flex; align-items: center; justify-content: center; border-radius: 20px; text-align: center; }
.btn--cta .ico { margin-right: 7px; }
p .btn { margin-top: 15px; }

.site-main { min-height: calc(100vh - 300px); }

.entry-content p { text-align: justify; }

/*.site.fixed { height: 100vh; overflow-y: hidden; }*/

.site-main { padding-top: 107px; }

/* Popup */
.ays_template_window header.ays_template_head { height: 15%; }
.ays-pb-modals div.ays_pb_description { font-size: 20px !important; font-weight: 700; margin-bottom: 20px; }
.ays_template_window header.ays_template_head h2 { color: #359d43 !important; font-weight: 700; }
div.ays_template_window header.ays_template_head div.ays_template_header .close-template-btn-container { right: 25px !important; }
.ays_pb_description > p { position: relative; }
.ays_pb_description > p:after { position: absolute; bottom: -15px; left: 50%; transform: translateX(-50%); height: 2px; width: 100px; background-color: #359d43; content: ''; }
.ays-pb-modals div.ays_pb_description { font-size: 191px; padding-top: 30px !important; }

@media (max-width: 786px) { 

	body { font-size: 16px; }

	h1 { font-size: 28px; }
	h2 { font-size: 24px; }
	h3 { font-size: 22px; }

	h1,
	h2,
	h3 { text-align: center; }

}

@media (max-width: 480px) { 

	img.alignleft, 
	img.aligright { width: 100%; margin-left: 0;margin-right: 0; margin-bottom: 15px; }

}

/*--------------------------------------------------------------
# Sidebar
--------------------------------------------------------------*/

.widget-area { background-color: rgba(255, 255, 255, 0.3); padding: 20px 15px; min-height: calc(100vh - 300px); }
.widget-area * { color: #fff;}
.list-title { position: relative; display: block; font-size: 26px; font-weight: 700; margin-bottom: 25px; }
.list-title:before { position: absolute; display: block; bottom: -10px; left: 0; height: 3px; width: 60px; background-color: #359d43; content: ''; }
.list-services { font-size: 16px; }
.list-services li + li { margin-top: 15px; }
.list-services li a:hover { color: #fff; }

/*--------------------------------------------------------------
# Site Header
--------------------------------------------------------------*/

.site-header { position: fixed; width: 100%; left: 0; top: 0; z-index: 9999; background-color: var(--dark);; background-size: cover; background-repeat: no-repeat; background-position: center; border-bottom: 2px solid #359d43; padding: 10px 0; transition: .3s ease; }

.header-scrolled {  background-color: rgba(0, 0, 0, 0.6); }

.site-header:before { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-color: rgba(0, 0, 0, 0.1); content: ''; }
.site-header .container { position: relative; z-index: 3; }
.site-header .container, 
.site-header .menu { position: relative; display: flex; align-items: center; justify-content: space-between; }
.site-header .menu { font-size: 20px; letter-spacing: 1px; font-weight: 400; list-style: none; margin: 0; margin-left: 0; }
.site-header .menu li:before { display: none; }
.site-header .menu li + li { margin-left: 20px; }
.site-header .menu li a { position: relative; text-decoration: none; color: var(--gray); 	-webkit-transition: color .2s ease-in-out;
	transition: color .2s ease-in-out; }
.site-header .menu li.current_page_item a { color: #359d43; font-weight: 700; }
.site-header .logo { z-index: 9999; }

.site-header .menu li a:before { content: ""; position: absolute; bottom: -7px; width: 0; border-bottom: solid 3px; left: 0; -webkit-transition: width .2s ease-in-out; transition: width .2s ease-in-out; }

.site-header .menu li a:hover {	color: #359d43; }
.site-header .menu li a:hover:before {width: 100%; }

.site-header .menu .menu-item-has-children { position: relative; }
.site-header .menu .menu-item-has-children > a { display: inline-block; padding-right: 25px; text-align: center; }
.site-header .menu .menu-item-has-children:before { position: absolute; left: 90%; top: 13px; display: block; height: 10px; width: 10px; border-top: 10px solid #359d43; border-left: 10px solid transparent; border-right: 10px solid transparent; content: ''; }

/* Submenu */
.sub-menu { visibility: hidden; position: absolute; opacity: 0; transition: .3s; background-color: #fff; margin-left: 0; padding: 20px; width: 350px; border-bottom: 5px solid #359d43; border-right: 5px solid #359d43; }
.site-header .menu li .sub-menu li { padding-left: 25px; }
.site-header .menu li .sub-menu li + li { margin-left: 0; margin-top: 10px; }
.site-header .menu li .sub-menu li:before { display: block; }
.site-header .menu li .sub-menu a { display: block; font-size: 16px; line-height: 1.3; color: var(--dark); padding: 0; }
.site-header .menu li .sub-menu a:before { display: none; }
.site-header .menu li .sub-menu a:hover { color: #359d43; }
.site-header .menu .menu-item-has-children:hover .sub-menu { visibility: visible; opacity: 1; }

@media (max-width: 786px) { 

	.sub-menu { position: relative; display: none; }
	.site-header .menu .menu-item-has-children:before { display: none; }
	.site-header .menu li { padding-left: 0; }
	.site-header .menu li + li { margin-left: 0; }
	.menu-menu-1-container .menu-item-has-children { flex-direction: column; }
	.sub-menu { visibility: visible; opacity: 1; }

	.header-scrolled { padding: 0; }
	.header-scrolled .site-title-text { font-size: 22px; }
	.header-scrolled .logo-icon { height: 28px; width: 28px; }

}

/*--------------------------------------------------------------
# Mobile Navigation
--------------------------------------------------------------*/

.main-navigation-toggle { display: none; }

@media (max-width: 786px) {

	.main-navigation-toggle { position: fixed; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
	.main-navigation-toggle + label { cursor: pointer; z-index: 100; }

	.icon--menu-toggle { --size: calc(1rem + 4vmin); display: flex; align-items: center; justify-content: center; width: var(--size); height: var(--size); stroke-width: 6; }
	.icon-group { transform: translateX(0); transition: transform var(--nav-duration) var(--ease); }
	.icon--menu { stroke: #fff; }
	.icon--close { stroke: #fff; transform: translateX(-100%); }

	.menu-menu-1-container { position: fixed; background-color: var(--dark); top: 0; left: 0; display: flex; align-items: center; width: 100%; height: 100%; transform: translateX(-100%); transition: transform var(--nav-duration); z-index: 1; z-index: 99; }
	.main-navigation:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--color-primary); transform-origin: 0 50%; z-index: -1; }
	.menu-menu-1-container ul { font-size: 12vmin; font-family: var(--font-heading); width: 100%; }
	.menu-menu-1-container li { --border-size: 1vmin; display: flex; align-items: center; position: relative; overflow: hidden; }
	.menu-menu-1-container li:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: var(--border-size); background-color: var(--color-secondary); transform-origin: 0 50%; transform: translateX(-100%) skew(15deg); }
	.menu-menu-1-container a { display: inline-block; width: 100%; max-width: 800px; margin: 0 auto; color: var(--color-secondary); line-height: 1; text-decoration: none; user-select: none; padding: var(--space) calc(var(--space) * 2) calc(var(--space) + var(--border-size) / 2); transform: translateY(100%); }

	.main-content { margin: 6rem auto; max-width: 70ch; padding: 0 calc(var(--space) * 2); transform: translateX(0); transition: transform calc(var(--nav-duration) * 2) var(--ease); }
	.main-content > * + * { margin-top: calc(var(--space) * var(--line-height)); }

	.main-navigation-toggle:checked ~ label .icon--menu-toggle .icon-group { transform: translateX(100%); }
	.main-navigation-toggle:checked ~ .main-content { transform: translateX(10%); }
	.main-navigation-toggle:checked ~ .menu-menu-1-container { transition-duration: 0s; transform: translateX(0); }
	.main-navigation-toggle:checked ~ .main-navigation:after { animation: nav-bg var(--nav-duration) var(--ease) forwards; }
	.main-navigation-toggle:checked ~ .menu-menu-1-container li:after { animation: nav-line var(--duration) var(--ease) forwards; }
	.main-navigation-toggle:checked ~ .menu-menu-1-container a { animation: link-appear calc(var(--duration) * 1.5) var(--ease) forwards; }
	.main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(1):after, .main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(1) a { animation-delay: calc((var(--duration) / 2) * 1 * 0.125); }
	.main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(2):after, .main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(2) a { animation-delay: calc((var(--duration) / 2) * 2 * 0.125); }
	.main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(3):after, .main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(3) a { animation-delay: calc((var(--duration) / 2) * 3 * 0.125); }
	.main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(4):after, .main-navigation-toggle:checked ~ .menu-menu-1-container li:nth-child(4) a { animation-delay: calc((var(--duration) / 2) * 4 * 0.125); }

	.site-header .menu { flex-direction: column; }
	.site-header .menu li a { color: var(--gray); }
	.site-header .menu li + li { margin-left: 0; }

	@keyframes nav-bg { from { transform: translateX(-100%) skewX(-15deg);  }
	  to { transform: translateX(0);  }
	}
	@keyframes nav-line {
	  0% { transform: scaleX(0); transform-origin: 0 50%;  }
	  35% { transform: scaleX(1.001); transform-origin: 0 50%;  }
	  65% { transform: scaleX(1.001); transform-origin: 100% 50%;  }
	  100% { transform: scaleX(0); transform-origin: 100% 50%;  }
	}
	@keyframes link-appear {
	  0%, 25% { transform: translateY(100%);  }
	  50%, 100% { transform: translateY(0);  }
	}

}

/*--------------------------------------------------------------
# Coming Soon
--------------------------------------------------------------*/

.site-main--comming-soon { position: fixed; display: flex; align-items: center; justify-content: center; background-color: var(--dark); top: 0; left: 0; bottom: 0; right: 0; min-height: 100vh; z-index: 1001; }
.site-main--comming-soon .container { text-align: center; }
.site-main--comming-soon h1 { text-align: center; font-size: 34px; font-weight:100; letter-spacing: 4px; text-shadow:0px 0px 20px #6EC3EC; color: #6EC3EC; display:inline-block; }

.bar { height:.3em; width: 600px; margin: auto; border-radius:10px; background:transparent; box-shadow:inset 0px 0px 8px rgba(68,68,68,1); overflow:hidden; padding:5px; }
.progress { height:inherit border-radius: inherit; width:0; background: #6EC3EC; animation:load 3s linear infinite; animation-delay: 2s; }

@keyframes load {
  0%{
    width:0%;
  }
  50%{
    width:100%;
  }
  100% {
    width:0%; 
    float:right;
  }
}

@media (max-width: 786px) { 

	.bar { width: 90%; }

}

/*--------------------------------------------------------------
# Section About
--------------------------------------------------------------*/

.section-about { position: relative; height: calc(100vh - 107px); min-height: 846px; width: 100%; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; }
.section-about:after { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); content: ''; }
.section__content-box { position: absolute; width: 100%; bottom: 30%; left: 50%; transform: translateX(-50%); max-width: 465px; color: var(--gray); padding: 50px 30px; z-index: 2;     -webkit-animation-name: fadeIn;
    animation-name: fadeIn; -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both; }
.section__content-box:after { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 100%, 0 100%, 0 0); background: #262533; z-index: -1; }
.section__content-box:before { content: ''; display: block; position: absolute; width: 100%; height: 100%; background-color: #359d43; clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); left: -35px; bottom: -38px; transform: rotate(180deg); z-index: 1; }
.section__content-box--right { content: ''; display: block; position: absolute; width: 100%; height: 100%; background-color: var(--gray); clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); left: 10px; top: -10px; z-index: 1; }
.section__content-box h1 { font-size: 2rem; font-weight: 300; margin-bottom: 20px; }
.section__content-box p { text-align: justify; margin-bottom: 35px; margin-bottom: 0; }
.section__content-box .btn { margin-top: 25px; }
.section-about .section__image { display: none; }

.about p,
.portfolio p { text-align: justify; }

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@media (min-width: 1200px) {

	.section__content-box { margin-left: 340px; } 

}

@media (max-width: 768px) {

	.section__content-box { bottom: 60px; padding: 20px 30px 30px; } 
	.section__content-box:before { left: -5px; }

	.section__content-box h1 { font-size: 28px; }

	.section-about { height: auto; min-height: auto; background: transparent; }
	.section-about .section__image { display: block; height: 200px; background-size: cover; background-repeat: no-repeat; background-position: center; }
	.section__content-box { position: relative; left: 0; bottom: 0; transform: none; background-color: var(--dark); }
	.section-intro__title.left-border { padding-left: 0; }
	.section-intro__title.left-border:after { display: none; }

}

@media (max-width: 480px) {

	.section-about:after { background-color: rgba(0, 0, 0, 0.1); }
	.section__content-box p { text-align: center; }

	.about .btn,
	.portfolio .btn { display: block; }
	.about .btn:after,
	.portfolio .btn:after { display: none; }

	.service-box:last-child { margin-bottom: 0 !important; }

}

/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/

.about__img__date h3 { font-weight: 900; margin-bottom: 0; line-height: 1; }
.about__img p { font-weight: 700; }

.section-intro__title { color: #7dc587; letter-spacing: 1px; }
.portfolio__img { position: relative; margin: 0 50px; }
.portfolio__img:before { clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); }
.portfolio__img .clip-right { display: block; position: absolute; width: 100%; height: 100%; background-color: var(--gray); clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); left: 10px; top: -10px; z-index: 1; clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); }
.portfolio__img .clip-left { display: block; position: absolute; width: 100%; height: 100%; background-color: #359d43; clip-path: polygon(58% 0, 65% 6%, 94% 6%, 94% 38%, 100% 43%, 100% 0); left: -35px; bottom: -15px; transform: rotate(180deg); z-index: 1; }

.service-box:nth-child(even) { flex-direction: row-reverse; }

@media (max-width: 768px) {

	.portfolio { margin-bottom: 0; }
	.section-intro__subtitle { font-size: 24px; text-align: center; }
	.section-intro__title { text-align: center; }
	.portfolio__img { margin: 0; }
	.portfolio__img .clip-left { left: -10px; bottom: 0; }

}

/*--------------------------------------------------------------
# Contact Page
--------------------------------------------------------------*/

.list-contacts { margin-left: 0; padding-left: 0; }
.list-contacts li { padding-left: 0; }
.list-contacts li:before { display: none; }
.list-contacts li + li { margin-top: 15px; }
.list-contacts li .ico { margin-right: 10px; }
.list-contacts li a { display: flex; align-items: center; }
.list-contacts li a:hover { opacity: 0.8; }

.direct-contact-container { margin-top: 35px; }

.wpcf7 .wpcf7-submit { border: 2px solid #359d43; color: var(--gray) !important; border-radius: 0; border-radius: 0; text-transform: uppercase; font-size: 0.75rem; font-weight: 500; background-color: transparent !important; padding: 0.5rem 1.6rem; position: relative; background: transparent; font-size: 16px; letter-spacing: 1px; padding: 10px 20px; font-family: 'Russo One', sans-serif; transition: 0.4s; }
.wpcf7 .wpcf7-submit:visited {color: var(--gray); }
.wpcf7 .wpcf7-submit:hover { border: 2px solid #359d43; box-shadow: inset 0 0 0 2em var(--green); } 

.wpcf7 label { width: 90%; }
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="password"],
.wpcf7 input[type="search"],
.wpcf7 input[type="number"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="range"],
.wpcf7 input[type="date"],
.wpcf7 input[type="month"],
.wpcf7 input[type="week"],
.wpcf7 input[type="time"],
.wpcf7 input[type="datetime"],
.wpcf7 input[type="datetime-local"],
.wpcf7 input[type="color"],
.wpcf7 textarea { background-color: transparent !important; width: 100%; transition: .3s ease; color: #fff !important; padding: 5px 15px; }

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="url"]:focus,
.wpcf7 input[type="password"]:focus,
.wpcf7 input[type="search"]:focus,
.wpcf7 input[type="number"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="range"]:focus,
.wpcf7 input[type="date"]:focus,
.wpcf7 input[type="month"]:focus,
.wpcf7 input[type="week"]:focus,
.wpcf7 input[type="time"]:focus,
.wpcf7 input[type="datetime"]:focus,
.wpcf7 input[type="datetime-local"]:focus,
.wpcf7 input[type="color"]:focus,
.wpcf7 textarea:focus { border: 2px solid #359d43; outline: none; }

@media (max-width: 768px) {

	.wpcf7 label { width: 100%; }

}

/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/

.testimonial_section { display: block; overflow: hidden; padding-bottom: 60px; }
.testimonial_section:after { display: block; clear: both; content: ""; }
.testimonial_section .about_content { background-color: #161616; padding-top: 77px; padding-right: 210px; padding-bottom: 62px; position: relative; }
.testimonial_section .about_content .background_layer { background-color: #161616; width: auto; margin-left: -200px; right: 0; position: absolute; height: 100%; width: 100%; top: 0; left: 0; }
.testimonial_section .about_content .layer_content { position: relative; z-index: 9; height: 100%; }
.testimonial_section .about_content .layer_content .section_title { margin-bottom: 24px; position: relative; }
.testimonial_section .about_content .layer_content .section_title:after { display: block; clear: both; content: ""; }
.testimonial_section .about_content .layer_content .section_title h5 { color: #7dc587; font-weight: 400; font-size: 15px; line-height: 28px; margin-top: -5px; margin-bottom: 6px; }
.testimonial_section .about_content .layer_content .section_title h2 { font-weight: 300; font-size: 45px; line-height: 50px; padding-bottom: 51px; margin-bottom: 0px; color: #fff; }
.testimonial_section .about_content .layer_content .section_title h2 strong { font-weight: 600 !important; width: 100%; display: block; }
.testimonial_section .about_content .layer_content .section_title .heading_line { position: relative; }
.testimonial_section .about_content .layer_content .section_title .heading_line span { transition: all 0.5s ease-in-out 0s; position: relative; }
.testimonial_section .about_content .layer_content .section_title .heading_line span:after { content: ""; right: auto; left: 69px; position: absolute; bottom: 28px; width: 17px; margin-left: 0; border-bottom-width: 3px; border-bottom-color: #cacaca; border-bottom-style: solid; }
.testimonial_section .about_content .layer_content .section_title .heading_line:after { content: ""; left: 1%; margin-left: 0; position: absolute; bottom: 28px; width: 59px; border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #359d43; }
.testimonial_section .about_content .layer_content .section_title p { color: #fff; margin: 0 0 15px; }

.testimonial_section .testimonial_box { margin-top: 60px !important; position: relative; }
.testimonial_section .testimonial_box .testimonial_container { background-color: #359d43; margin-left: -170px !important; position: relative; }
.testimonial_section .testimonial_box .testimonial_container .background_layer { background-color: #359d43; width: auto; margin-right: -200px; right: 0; background-image: url(../images/map.png); background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; height: 100%; top: 0; left: 0; }
.testimonial_section .testimonial_box .testimonial_container .layer_content { position: relative; z-index: 9; height: 100%; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel { display: block; position: relative; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials { margin: 10px 0 10px 0; padding: 62px 0px 72px 50px; position: relative; text-align: center; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content { box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.13); margin-left: 150px; margin-top: 69px; padding: 45px 40px 45px 40px; z-index: 1; position: relative; background-color: #fff; transition: all 0.5s ease-in-out 0s; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content .testimonial_caption { margin-bottom: 15px; position: relative; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content .testimonial_caption:after { content: ""; width: 30px; display: block; height: 2px; text-align: center; left: 46%; margin-top: 6px; background-color: #359d43; position: absolute; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content .testimonial_caption h6 { padding-top: 0; margin-bottom: -5px; font-size: 19px; font-weight: 600; line-height: 24px; color: #020d26; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content .testimonial_caption span { font-size: 12px; color: #9f9f9f; margin: 0; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .testimonial_content p { padding: 0; margin: 0; padding-top: 10px; font-size: 16px; line-height: 28px; font-weight: 400; color: #5d6576; font-style: italic; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .images_box .testimonial_img { border: none; position: absolute; top: 0; left: 55px; top: 80px; z-index: 9; }
.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .images_box .testimonial_img img { border: 5px solid #fff; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1); width: 100%; }
.testimonial_section .testimonial_box .testimonial_container .owl-nav .owl-prev { position: absolute; top: 165px; right: 42px; border-radius: 0; background: #359d43; display: block; outline: 0; width: 34px; line-height: 34px; height: 34px; color: #fff; font-size: 23px; margin-top: -20px; transition: all 0.3s ease-in-out; }
.testimonial_section .testimonial_box .testimonial_container .owl-nav .owl-prev:hover { background: #161616; }
.testimonial_section .testimonial_box .testimonial_container .owl-nav .owl-next { position: absolute; top: 165px; right: 5px; border-radius: 0; display: block; background: #359d43; outline: 0; width: 34px; text-align: center; line-height: 34px; height: 34px; color: #fff; font-size: 23px; margin-top: -20px; transition: all 0.3s ease-in-out; }
.testimonial_section .testimonial_box .testimonial_container .owl-nav .owl-next:hover { background: #161616; }

@media all and (max-width: 991px) { 

  .testimonial_section .about_content { padding: 40px 0;  }
  .testimonial_section .about_content .background_layer { width: 200% !important;  }
  .testimonial_section .testimonial_box { margin-top: 0 !important;  }
  .testimonial_section .testimonial_box .background_layer { width: 200% !important; margin-left: -200px;  }
  .testimonial_section .testimonial_box .about_content { padding-left: 15px !important; padding-right: 15px !important; margin-top: 28% !important;  }
  .testimonial_section .testimonial_box .testimonial_container { margin-left: -15px !important;  }
  .testimonial_section .testimonial_box .testimonial_container .testimonials { margin: 0px 0 20px 0;  }
  .testimonial_section .testimonial_box .testimonial_container .testimonials .testimonial_content { margin-left: -36px !important;  }
/*  .testimonial_section .testimonial_box .testimonial_container .testimonials .images_box { display: none;  }*/
	.testimonial_section .about_content .layer_content .section_title h5 { text-align: center; }
	.testimonial_section .about_content .layer_content .section_title .heading_line span:after { display: none; }
	.testimonial_section .about_content .layer_content .section_title .heading_line:after { left: 50%; transform: translateX(-50%); }
	.testimonial_section .about_content .layer_content .section_title p { text-align: center; }
	.testimonial_section .btn { display: block; }
	.testimonial_section .btn:after { display: none; }
	.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials { padding: 70px 0 35px 50px; }
	.testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .images_box .testimonial_img { top: 17px; left: 50%; transform: translateX(-50%); width: 150px; height: 150px; z-index: 9; }
  .testimonial_section .testimonial_box .testimonial_container .layer_content .testimonial_owlCarousel .testimonials .images_box .testimonial_img img { width: 100%; }
  .testimonial_section .about_content .layer_content .section_title h2 { font-size: 24px; padding-bottom: 40px; }

}

/*--------------------------------------------------------------
# Before and After
--------------------------------------------------------------*/

.section-before-after h2 { text-align: center; }
.twentytwenty-container { width: 960px; margin: auto; }

@media (max-width: 980px) {

	.twentytwenty-container { width: 100%; margin: auto; }

}

/*--------------------------------------------------------------
# Section CTA
--------------------------------------------------------------*/

.section-cta .section__body { background-size: cover; background-repeat: no-repeat; background-position: center center; padding: 100px 0; padding: 100px 30px; margin-bottom: 100px; }
.section-cta .section__content { width: 50%; padding: 50px 30px 60px; background-color: rgba(0, 0, 0, 0.6); border-radius: 20px; text-align: center; }
.section-cta .btn-phone,
.section-luxury .btn-phone { display: flex; align-items: center; font-size: 30px; font-weight: 700; background-color: #359d43; border-radius: 10px; max-width: 310px; margin: auto; justify-content: center; }
.section-cta h2 { font-size: 36px; color: #fff; }
.section-cta p { font-size: 20px; color: #fff; text-align: center; }
.section-cta .btn-phone { color: #fff; }
.section-cta .btn-phone .ico { margin-right: 7px; }

@media (max-width: 768px) {

	.section-cta .section__body { padding: 50px 15px; margin-bottom: 40px; }
	.section-cta .section__content { width: 100%; padding: 30px 15px; }
	.section-cta h2 { font-size: 28px; }
	.section-cta p { font-size: 18px; }
	.section-cta .btn-phone { font-size: 24px; padding: 7px 10px; }

}

/*--------------------------------------------------------------
# Gallery
--------------------------------------------------------------*/

.nav-tabs { border: 0; }
.nav-link,
.nav-link:hover { color: #fff; }
.nav-tabs .nav-link { border: 1px solid var(--color-secondary); background-color: var(--color-secondary); color: var(--dark); }
.nav-tabs .nav-link + .nav-link { margin-left: 10px; }
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { background-color: var(--green); color: #fff; border: 1px solid var(--green); }

.nav-link{ color: #fff; background: #333; font-size: 19px; font-weight: 500; text-transform: capitalize; padding: 8px 25px 10px; margin: 0 10px 0 0; border: none; border-radius: 5px; overflow: hidden; position: relative; z-index: 1; transition: all 0.3s ease 0.4s; }
.nav-link:hover{ color: #4cd137; background: #333; }
.nav-link:before{ content: ""; background: repeating-linear-gradient(to right, #4cd137, #4cd137 10px, transparent 10px, transparent 20px); width: 100%; height: 100%; transform-origin: left center; transform: scaleX(0); position: absolute; top: 0; left: 0; z-index: -1; transition: transform 0.3s ease-in,left 0.3s ease-in-out 0.3s; }
.nav-link:hover:before{ transform: scaleX(1); left: 100%; }

.gallery-container { padding: 30px 0; }
.page-description { font-family: 'Russo One', sans-serif; font-size: 24px; }

#gallery{ -webkit-column-count:4; -moz-column-count:4; column-count:4; -webkit-column-gap:20px; -moz-column-gap:20px; column-gap:20px; }
.img-holder { position: relative; }
.img-holder a { position: relative; display: block; overflow: hidden; }
.img-holder a:before { position: absolute; top: 0; left: 0; opacity: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.3); content: ''; transition: .3s ease; }
.img-holder a:hover:before { opacity: 1; }

.img-holder {
  width:100%;
  height:auto;
  margin: 4% auto;
  margin-bottom: 20px;
  box-shadow:-3px 5px 15px #000;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}

@media (max-width:1200px){
  #gallery{
  -webkit-column-count:3;
  -moz-column-count:3;
  column-count:3;
    
  -webkit-column-gap:20px;
  -moz-column-gap:20px;
  column-gap:20px;
}
}
@media (max-width:800px){
  #gallery{
  -webkit-column-count:2;
  -moz-column-count:2;
  column-count:2;
    
  -webkit-column-gap:10px;
  -moz-column-gap:10px;
  column-gap:10px;}
  #gallery > .img-holder { margin-bottom: 10px; }

}

@media (max-width: 480px){

	.nav-tabs .nav-link { width: calc(50% - 10px) !important; margin: 0 5px 5px !important; font-size: 16px; }
	.page-description { text-align: center; }
	.nav-tabs .nav-link + .nav-link { margin-left: 5px !important; }

}	

/*--------------------------------------------------------------
# 404
--------------------------------------------------------------*/

.error-404 { min-heigh: calc(100vh - 342px); }
.error-404 h1 { text-align: center; }
#handboy
{
   animation: swing ease-in-out 1.3s infinite alternate;
    transform-origin: 98% 98%;
    transform-box: fill-box;    
}


#girllight
{
   animation: swing ease-in-out 1.3s infinite alternate;
    transform-origin: 0% 97%;
    transform-box: fill-box;
}

#hairgirl
{
    animation: swinghair ease-in-out 1.3s infinite alternate;
   transform-origin: 60% 0%;
    transform-box: fill-box;  
}

#zero
{
  transform-origin:bottom;
  transform-box:fill-box;
  
}

/*************swing************/
@keyframes swing {
    0% { transform: rotate(10deg); }
    100% { transform: rotate(-10deg); }
}


/*************swing hair************/
@keyframes swinghair {
    0% { transform: rotate(6deg); }
    100% { transform: rotate(-6deg); }
}


/*--------------------------------------------------------------
# Site Footer
--------------------------------------------------------------*/

.site-footer { background-color: #161616; padding: 30px 0; }
.site-footer .footer__body { display: flex; align-items: center; justify-content: space-between; }
.site-footer .footer__body a + a { margin-left: 30px; }

.nav-contacts { margin-bottom: 0; margin-top: 10px; }
.nav-contacts li { padding-left: 0; }
.nav-contacts li + li { margin-top: 5px; }
.nav-contacts li:before { display: none; }
.nav-contacts .ico { height: 20px; width: 20px; margin-right: 10px; margin-bottom: 5px; }
.nav-contacts li a { display: flex; align-items: center; }

.footer__copyright { border-top: 1px solid #359d43; margin-top: 10px; padding-top: 10px; }
.footer__copyright p { font-size: 14px; opacity: 0.8; margin-bottom: 0; text-align: center; }
.footer__copyright p:nth-child(2) { font-size: 15px; font-weight: bold; }

.footer__copyright p a { color: #359d43; }

.site-footer .btn-phone { display: none; }

@media (max-width: 768px) {

	.site-footer { padding-bottom: 60px; }
	.site-footer .footer__body { flex-direction: column; }
	.nav-contacts li a { justify-content: center; }

	.site-footer .btn-phone { display: flex; align-items: center; position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 99; background-color: #359d43; padding: 8px 30px; margin-left: 0 !important; border-radius: 10px 10px 0 0; font-weight: 700; letter-spacing: 1px; border: 3px solid var(--dark); border-bottom: 0; }
	.site-footer .btn-phone .ico { margin-right: 10px; height: 20px; width: 20px; }


}

/* Some fixes */
.portfolio.section-margin,
.section-cta .section__body { margin-bottom: 30px; }
.testimonial_section { margin-top: 60px; }


/*--------------------------------------------------------------
## Section Luxury
--------------------------------------------------------------*/

.section-luxury {
	background-image: url(assets/images/luxury-renovations.jpg);
	padding: 40px 35px;
	margin-bottom: 40px;
}
.section-before-after + .container .section-luxury {
	margin-bottom: 0;
	margin-top: 60px;
}
.section-luxury * {
	color: #fff;
}
.section-luxury .btn-phone:visited,
.section-luxury .btn-phone:active,
.section-luxury .btn-phone:focus { color: #fff !important; }
.section-luxury .btn-phone {
	margin: 0;
}
.section-luxury .container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.section-luxury .btn-phone .ico {
	margin-right: 7px;
}
.section-luxury .section__image {
	width: 45%;
	height: 400px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.section-luxury .section__content {
	width: 50%;
}
.section-luxury .section__content p {
	margin-bottom: 35px;
	text-align: justify;
}
.section-luxury .section-intro__title {
	display: block;
	color: #7dc587;
	font-weight: bold;
	margin-bottom: 10px;
}
.section-luxury.inner {
	margin-top: -27px;
}
.section-luxury.inner .section-intro__subtitle {
	font-size: 34px;
	line-height: 1.3;
    margin-top: 0;
    padding-top: 0;
}
.section-luxury.inner .btn-phone {
	font-size: 24px;
}
.section-luxury.inner .section__image {
	height: 475px;
}

@media screen and (max-width: 992px) { 

	.section-luxury .container {
		flex-direction: column;
	}
	.section-luxury .section__image,
	.section-luxury .section__content {
		width: 100%;
	}
	.section-luxury .section__image {
		margin-bottom: 25px;
	}

}

@media screen and (max-width: 768px) { 

	.section-luxury {
		padding: 15px 5px;
	}
	.section-luxury .section__image {
		height: 320px;
	}
	.section-luxury .btn-phone {
		font-size: 18px;
		margin: auto;
		padding: 10px;
		border-radius: 30px;
	}
	.section-luxury.inner .section-intro__subtitle {
		font-size: 26px;
	}

}
