/* TABLE OF CONTENT



1 - RESET CSS

2 - TYPOGRAPHY

3 - BACKGROUNDS

4 - WRAPPER

5 - HEADER

6 - NAVIGATION

7 - HEADINGS

8 - SECTIONS



	8.1 - OVERWIEV

	8.2 - CALLOUT

	8.3 - PORTFOLIO

	8.4 - PARALLAX

	8.5 - SERVICES

	8.6 - FEATURES

	8.7 - IMAGES

	8.8 - COUNTERS

	8.9 - BLOG

	8.10 - BLOG ARCHIVES

	8.11 - QUOTES

	8.12 - TEAM

	8.13 - CLIENTS

	8.14 - MAP

	8.15 - CONTACTS

	

9 - POST PAGE 

10 - ELEMETS UI	

11 - WIDGETS

12 - FOOTER



*/



/* 1 - RESET */



* {

    margin: 0;

    padding: 0;

}







img, a, ul, li {

	/*text-align: center;*/

    margin: 0 auto;



    border: none;

    outline: none;

}



ol li, ul li {

    list-style: none;

}



a:link, a:visited, a:active {

    color: inherit;

}



:focus {

	outline: none !important;

}



a {

    text-decoration: none;

}



/* html 5 */



nav, section, article, footer {

    display: block;

}



/* input */





.radio-label {

	position: absolute;

	top: 18px;

	left: 25px;

}



/* 2 - TYPOGRAPHY */



h1 {

    font-size: 35px;

}



h2 {

    font-size: 30px;

}



h3 {

    font-size: 25px;

}



h4 {

    font-size: 20px;

}



h5 {

    font-size: 18px;

}



h6 {

    font-size: 16px;

}



h1, h2, h3, h4, h5, h6 {

    font-weight: 700;

    line-height: 150%;

	

}



p {

	margin-bottom: 20px;

}



strong {

	font-weight: 700;

}



ul li,

ol li {

	list-style-position: inside !important;

}







blockquote {

    font-weight: 300;

    margin-bottom: 25px;

    padding: 20px;

	letter-spacing: 1px;

	font-size: 22px;

	border-left-style: solid;

	border-left-width: 3px;

	display: inline-block;

	background-color: #fafafa;

}



blockquote:first-letter {

	font-size: 28px;

	font-weight: 400;	

}



.high-text {

	display: inline-block;

	padding: 20px;

	color: #fff;

	font-weight: 700;

}



/* 3 - COMMONS */



/* change page */



#curtain {

	position: fixed; 

	width: 0; 

	height: 100%; 

	top: 0; 

	left: 0; 

	background: #fff; 

	z-index: 99999;

}



/* overlay */



.dotted:after {

    background: url("../img/pattern_dot.html") repeat left top rgba(0,0,0,0.5);

	content: "";

	display: block;

	width: 100%;

	height: 100%;

	opacity: 0.3;

	position: absolute;

	top: 0;

	bottom: 0;

}



/* parallax */



.parallax {

	background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

	-moz-background-size: cover;

	-ms-background-size: cover;

	-o-background-size: cover;

	-webkit-background-size: cover;

	background-attachment: scroll;

	height: 100%;

	width: 100%;

}



/* 4 - WRAPPER */



#wrap {

    height: 100%;

    width: 100%;

}



.section {

    clear: both;

    height: auto;

    position: relative;

    width: 100%;

}



/* intro slider */



#intro {

    height: 100%;

}



#intro-slideshow,

#intro-slideshow:after {

    position: absolute;

    width: 100%;

    height: 100%;

    top: 0px;

    left: 0px;

}



#intro-slideshow span.item-image:after {

    background: url("../img/pattern_dot.html") repeat left top rgba(0,0,0,0.5);

	content: "";

	display: block;

	width: 100%;

	height: 100%;

	opacity: 0.3;

}



#intro-slideshow span.item-image {

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0px;

    left: 0px;

    color: transparent;

    background-size: cover;

    background-position: 50% 50%;

    background-repeat: none;

}



#intro-slideshow .owl-wrapper-outer, #intro-slideshow .owl-wrapper, #intro-slideshow .owl-item {

	height: 100% !important;

}



#intro-slideshow .owl-controls, #post-carousel .owl-controls {

	position: absolute;

	right: 40px;

	top: 30px;

	height: auto;

	z-index: 99999;

}



#intro-slideshow .owl-controls .owl-page span, 

#blog-carousel .owl-controls .owl-page span, 

#post-carousel .owl-controls .owl-page span {

	border-radius: 0px !important;

}



.owl-theme .owl-controls .owl-page span {

	background: #3F3043 !important;

}



/* intro elements */

		

.intro-message {

    position: absolute;

	width: 100%;

    bottom: 50px;

	top: 45%;

	text-align: right;

	right: 10%;

}



.intro-title {

    clear: both;

    font-size: 50px;

    font-weight: 700;

    line-height: 50px;

    text-transform: uppercase;

	letter-spacing: 1px;

	color: #fff;

	display: inline-block;

	margin-bottom: 10px;

}



.intro-subtitle {

	letter-spacing: 1px;

	display: inline-block;

    font-size: 18px;

    line-height: 130%;

	color: #fff;

	padding: 10px 25px;

	text-transform: uppercase;

}



/* 5 - HEADER */









/* tooltip */



.tooltip {

	position: absolute;

	bottom: -30px;

	margin-top: 0;

	margin-left: 0;

	width: auto;

	height: 30px;

	padding: 0 10px;

	line-height: 30px;

	background: #333;

	font-size: 14px;

	color: #fff; 

}



.tooltip-top {

	position: absolute;

	bottom: -30px;

	margin-top: 0;

	margin-left: 0;

	width: auto;

	height: 30px;

	padding: 0 10px;

	line-height: 30px;

	background: #333;

	font-size: 14px;

	color: #fff; 

}



/* 6 - NAVIGATION */



.main-menu {

	float: right;

	margin-right: 50px;

}

	

.main-menu {

	display: none;

}

	



	

/* logo */

		

#icons-menu {

	position: absolute;

	top: 30px;

	width: 100%;

	height: 50px;

	z-index: 9999;

	background-color: transparent;

}



#icons-menu ul {

	width: 100%;

	text-align: center;

}



#icons-menu li {

	width: 40px;

	height: 40px;

	display: inline-block;

	text-align: center;

	cursor: pointer;

	line-height: 44px;

	color: #333;

	border: 2px solid #fff;

}



#icons-menu li:hover {

	border: 2px solid #333;

	border-radius: 100%;

}



#icons-menu li i {

	font-size: 16px;

}



	.sticky-icons {

		position: fixed !important;

		top: 70px;

		background-color: #fff !important;

		border-bottom: 1px solid #dfdfdf;

	}

	

	/* buttons */



	.section .btn-down {

		position: absolute;

		bottom: 50px;

		left: 50%;

		margin-left: -30px;

		color: #fff;

		cursor: pointer;

		font-size: 30px;

		height: 60px;

		line-height: 60px;

		text-align: center;

		width: 60px;

		border-width: 3px;

		border-style: solid;

		z-index: 999;

	}

	

	.page .btn-down {

		margin: 0 auto;

		cursor: pointer;

		font-size: 30px;

		height: 60px;

		line-height: 60px;

		text-align: center;

		width: 60px;

		border-width: 3px;

		border-style: solid;

	 }

		

	.btn-up {

		display: none;

		cursor: pointer;

		bottom: 50px;

		color: #fff;

		font-size: 30px;

		height: 60px;

		line-height: 60px;

		position: fixed;

		right: 50px;

		text-align: center;

		width: 60px;

		border-width: 3px;

		border-style: solid;

		z-index: 999;

	}

		

/* 7 - HEADINGS */







.title-section,

.title-page {

    font-size: 35px;

    font-weight: 700;

	letter-spacing: 2px;    

	margin-bottom: 10px;

    text-align: center;

   

	color: #fff;

}

.section-title {

    margin-top: 5%;

    font-size: 40px!important;

	color:#fff;

    text-align:center;

    font-family: FFTisaSansWebLightItalic, Helvetica, Arial, sans-serif;

}



.quote p {

	    font-family: FFTisaSansWebLightItalic, Helvetica, Arial, sans-serif;

    font-size: 25px;

    line-height: 32px;

    letter-spacing: 0px;

    color: #fff;

}



.subtitle-section {

	letter-spacing: 1px;

}



.subtitle-section,

.subtitle-page,

.meta-page {

    font-size: 20px;

    line-height: 130%;

	font-weight: 300;

    text-align: center;

}



/* 8 - SECTIONS */



/* 8.1 - OVERVIEW */



.overw-content {

    height: auto;

}



.overw-box {

	height: 300px;

}



.overw-icon {

	border: 3px solid #fff;

    font-size: 50px;

    height: 100px;

    line-height: 100px;

    margin: 0 auto;

    text-align: center;

    width: 100px;

	cursor: pointer;

	color: #fff;

}



.overw-icon:hover {

	background-color: #fff;

}



.overw-title {

    color: #fff;

    font-size: 25px;

    line-height: 130%;

	font-weight: 400;

	letter-spacing: 2px;   

    text-align: center;

}



.overw-exc {

    color: #fff;

    text-align: center;

	line-height: 150%;

}



/* 8.2 - CALLOUT */



.callout-layer {

	height: 100%;

}



.callout-title {

    font-size: 35px;

    font-weight: 700;

    line-height: 130%;

	letter-spacing: 2px;    

    text-align: center;

    text-transform: uppercase;

}



.callout-exc {

    font-size: 20px;

    line-height: 130%;

    text-align: center;

	letter-spacing: 1px;

}



.callout-icons {

	text-align: center;

}



.callout-icons ul {

    text-align: center;

}



.callout-icons li {

    cursor: pointer;

    display: inline-block;

    font-size: 35px;

    height: 70px;

    line-height: 75px;

    margin: 0 5px;

    text-align: center;

    width: 70px;

	color: #fff;

}



/* 8.3 - PORTFOLIO */



#portfolio {

	position: relative;

}



.port-content {

    height: 100%;

}



.port-filter ul {

    text-align: center;

}



.port-filter li {

	cursor: pointer;

	font-weight: 400;

    display: inline-block;

    height: 50px;

    line-height: 50px;

    margin: 5px;

    padding: 0 20px;

    text-align: center;

    text-transform: uppercase;

}



.port-filter li:hover {

	color: #fff;

}



.port-item {

    height: 450px;

    position: relative;

}



.port-item-inner {

	position: absolute;

	width: 100%;

	height: 100%;

	background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}



	.port-caption {

		background-color: rgba(0,0,0,0.7);

		bottom: 20px;

		height: auto;

		left: 20px;

		right: 20px;

		position: absolute;

		top: 20px;

		width: auto;

		

		transform: scale(0,0);

		-moz-transform: scale(0,0);

		-webkit-transform: scale(0,0);

		-o-transform: scale(0,0);

		-ms-transform: scale(0,0);

		

		transform-origin: center center;

		-moz-transform-origin: center center;

		-webkit-transform-origin: center center;

		-o-transform-origin: center center;

		-ms-transform-origin: center center;

	}

	

	.port-title {

		color: #000;

		font-size: 25px;

		line-height: 120%;

		letter-spacing: 2px;		

		font-weight: 700;

		text-align: center;

		text-transform: uppercase;

	}

	

	.port-icon {

		margin: 0 auto;

		font-size: 20px;

		height: 50px;

		line-height: 50px;

		text-align: center;

		width: 50px;

		color: #fff;

	}



.port-item:hover .port-caption {

    transform: scale(1,1);

	-moz-transform: scale(1,1);

	-webkit-transform: scale(1,1);

	-o-transform: scale(1,1);

	-ms-transform: scale(1,1);

}



.port-item img {

    height: 100%;

    width: auto;

}



/* 8.4 - PARALLAX */



.parallax-title {

    font-size: 35px;

    font-weight: 700;

    line-height: 130%;

	letter-spacing: 2px;    

    text-align: center;

    text-transform: uppercase;

}



.parallax-exc {

    font-size: 20px;

    line-height: 130%;

    text-align: center;

	letter-spacing: 1px;

}



.parallax-btn {

	text-align: center;

}



/* 8.5 - SERVICES */



.serv-layer {

	height: 100%;

	width: auto;

}



.serv-box {

    border-width: 3px;

    border-style: solid;

}



.serv-icon {

	    padding-top: 30px;

    font-size: 35px;

    height: 100%;

    line-height: 50px;

    margin: 0 auto;

    text-align: center;

}



.serv-title {

	    padding-top: 10px;

    font-size: 25px;

	letter-spacing: 2px;    

	font-weight: 400;

	line-height: 130%;

    text-align: center;

}



.serv-exc {

    text-align: center;

	line-height: 150%;

	margin-bottom: 25px

}



.serv-price {

	text-align: center;

}



.serv-price span {

	text-align: center;

	font-size: 35px;

	font-weight: 700;

	margin-right:  10px;

}



/* 8.6 - FEATURES */



.feat-content {

    height: auto;

}



.feat-list {

    height: auto;

    margin: 0 auto;

}



.feat-icon {

	border-radius: 100%;

    font-size: 35px;

    height: 70px;

    line-height: 70px;

    margin: 0 auto 10px auto;

    text-align: center;

    width: 70px;

	cursor: pointer;

	border-style: solid;

	border-width: 3px;

}



.feat-icon:hover {

	color: #fff;

}



.feat-title {

    font-size: 20px;

	font-weight: 400;

	letter-spacing: 2px;    

	text-align: center;

    text-transform: uppercase;

}



.feat-exc {

    text-align: center;

	line-height: 150%;

}



/* 8.7 - IMAGES */



.image-box {

	position: relative;

	height: 600px;

}



.image {

	position: absolute;

	left: 0;

	top: 0;

	height: auto; 

}



.image img {

	width: 100%;

	height: auto;

}



/* 8.8 - COUNTERS */



.count-layer {

	height: 100%;

	width: 100%;

}



.count-icon {

	font-size: 35px;

    height: 50px;

    line-height: 50px;

    margin: 0 auto;

    text-align: center;

}	



.count-title {

    text-align: center;

	letter-spacing: 2px;    

	font-weight: 400;

	text-transform: uppercase;

}



.count-value {

    font-size: 50px;

    text-align: center;

	font-weight: 700;

	margin-bottom: 10px;

}



/* 8.9 - BLOG */



.blog-list .blog-box {

	margin: 0;

}



.blog-list .blog-detail {

	overflow: hidden;

	height: auto;

}



.blog-list .blog-exc {

	overflow: hidden;

	max-height: 90px;

}



.blog-list .blog-box {

	padding: 0;

}



.blog-layer {

	height: 100%;

	width: 100%;

}



.blog-date {

    color: #fff;

    font-size: 25px;

    font-weight: 700;

	text-align: center;

    text-transform: uppercase;

}



.blog-thumb .blog-date {

	font-size: 14px;

	position: absolute;

	top: 30%;

	width: 100%;

	color: #333;

}



.blog-thumb {

    height: 300px;

    position: relative;

	

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}



#blog-carousel .blog-thumb {

	border: 10px solid #fff;

}



.blog-caption {

	background-color: #fff;

	bottom: 20px;

	height: auto;

	left: 20px;

	position: absolute;

	right: 20px;

	top: 20px;

	width: auto;

	

	transform: scale(0,0);

	-moz-transform: scale(0,0);

	-webkit-transform: scale(0,0);

	-o-transform: scale(0,0);

	-ms-transform: scale(0,0);

	

	transform-origin: center center;

	-moz-transform-origin: center center;

	-webkit-transform-origin: center center;

	-o-transform-origin: center center;

	-ms-transform-origin: center center;

}



.blog-thumb:hover .blog-caption {

    transform: scale(1,1);

	-moz-transform: scale(1,1);

	-webkit-transform: scale(1,1);

	-o-transform: scale(1,1);

	-ms-transform: scale(1,1);

}

	

.blog-icon {

	font-size: 20px;

	height: 50px;

	line-height: 50px;

	text-align: center;

	width: 50px;

	position: absolute;

	right: 50%;

	margin-right: -25px;

	top: 50px;

}



		

.blog-exc {

	line-height: 150%;

    text-align: center;

}



.blog-more {

	cursor: pointer;

	font-size: 16px;

	font-weight: 700;

	text-transform: uppercase;

	text-align: center;

	width: 100%;

	position: absolute;

	height: 50px;

	line-height: 50px;

	margin-top: -25px;

	top: 50%;

}



.blog-title {



    font-size: 25px;

    font-weight: 700;

	letter-spacing: 2px;    

	text-align: center;

    text-transform: uppercase;

}



.blog-meta {

    padding: 5px 0;

    text-align: center;

	font-weight: 400;

}



.blog-cat,

.blog-author {

    margin: 0 10px;

    text-align: center;

}



#blog-image {

	background-attachment: fixed;

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

	-moz-background-size: cover;

	-ms-background-size: cover;

	-o-background-size: cover;

	-webkit-background-size: cover;

	height: 600px;

	width: 100%;

	clear: both;

}



/* 8.10 - BLOG ARCHIVE */



.page .blog-exc {

	font-size: 14px;

}



.page .blog-icon {

	top: 150px;

}



.blog-frame {

	border-width: 3px;

	border-style: solid;

	padding: 10px 10px 0 10px;

}



/* blog nav */





.blog-nav ul,

.port-nav ul {

	width: 100%;

	text-align: center;

}



.blog-nav li,

.port-nav li {

	display: inline-block;

	border-width: 3px;

	border-style: solid;

	width: 60px;

	height: 60px;

	line-height: 60px;

	text-align: center;

	font-size: 30px;

}



.blog-next,

.port-next {

	margin-left: 25px;

}



.blog-prev,

.port-prev {

	margin-right: 25px;

}



/* 8.11 - QUOTES */



.quote-content {

    height: auto;

}



.quote-layer {

	height: 100%;

	width: 100%;

}



.quote-thumb {

	background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

	-moz-background-size: cover;

	-ms-background-size: cover;

	-o-background-size: cover;

	-webkit-background-size: cover;	

	

	border-radius: 100%;

	margin: 0 auto;

	height: 110px;

	width: 110px;

	border: 3px solid #fff;

	margin-bottom: 20px;

	overflow: hidden;

}



.quote-exc {

    color: #fff;

    font-size: 25px;

    text-align: center;

}



.quote-author {

    color: #fff;

    font-size: 40px;

	font-weight: 400;

    text-align: center;

}



/* 8.12 - TEAM */



#map .team-box {

	width: 250px;

	margin: 20px 0 20px 20px;

}



.team-thumb {

	clear: both;

	height: 300px;

	position: relative;

	background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}



.team-caption {

	background-color: rgba(255,255,255,0.9);

	position: absolute;

	width: 100%;

	height: 100%;

	top: 0;

	left: 0;

	z-index: 996;	

	opacity: 0;

	cursor: pointer;

}



.team-thumb:hover .team-caption {

	opacity: 1;

}



.team-name {

	text-align: center;

	text-transform: uppercase;

	font-size: 35px;

	font-weight: 700;

	line-height: 120%;

	letter-spacing: 2px;

}



.team-skills {

	font-weight: 400;

}



.team-skills ul {

	width: 100%;

	text-align: center;

}



.team-skills li {

	margin-bottom: 10px;

}

      

.team-skills li .bar-bg {

	background: #dfdfdf; 

	width: auto; 

	height: 30px; 

	line-height: 30px; 

	margin: 0 20px; 

	text-align: left;

}



 .team-skills li .bar-val {

	text-indent: 20px; 

	color: #fff; 

	height: 30px; 

	line-height: 30px;

}



.team-detail {

	clear: both;

	margin-top: 10px;

	height: 50px;

	line-height: 50px;

	text-align: center;

	font-weight: 700;

	text-transform: uppercase;

	border-style: solid;

	border-width: 3px;

}



.team-role {

	float: left;

}



.team-contact {

	font-size: 20px;

	float: right;

}



.team-contact i {

	cursor: pointer;

	padding-left: 10px;

}



/* 8.13 - CLIENTS */



.client-list {

	text-align: center;

}



.client-thumb {

	display: inline-block;

}



/* 8.14 - MAP */



.map-content {

	height: auto;

}



.map {

	border: 0;

	height: 500px;

	width: 100%;

}



.gmap {

	height: 500px; 

	position: relative; 

	overflow: hidden;

}



.map-icon {

    color: #fff;

    cursor: pointer;

    font-size: 35px;

    height: 70px;

    line-height: 70px;

    margin: 150px auto 10px auto;

    text-align: center;

    width: 70px;

}



.map-title {

	font-size: 35px;

    font-weight: 700;

	letter-spacing: 2px; 

	margin-bottom: 10px;

    text-align: center;

    text-transform: uppercase;

}



.map-subtitle {

	font-size: 25px;

	line-height: 130%;

    text-align: center;

}



#gmap_markers {

	display: none;

}



/* 8.15 - CONTACTS */



.contact-content {

	height: auto;

}



.contact-message {

	height: auto;

}



.contact-icons {

	margin-bottom: 20px;

}



.contact-icons li {

    cursor: pointer;

    display: inline-block;

    font-size: 35px;

    height: 70px;

    line-height: 70px;

    margin: 0 5px;

    text-align: center;

    width: 70px;

	color: #fff;

}



.contact-exc {

	font-size: 16px;

	line-height: 30px;

}



.contact-detail li {

	list-style: none;

	line-height: 150%;

	font-size: 20px;

	font-weight: 400;

}



.contact-detail li i {

	margin-right: 10px;

}



	.contact-btn:hover {

		background-color: #fff;

		border-width: 3px;

		border-style: solid;

	}

	

/* form elements */



/* 9 - POST PAGE */



/* 	page header */







#post-image {

	background-attachment: fixed;

    background-position: top center;

    background-repeat: no-repeat;

    background-size: cover;

	-moz-background-size: cover;

	-ms-background-size: cover;

	-o-background-size: cover;

	-webkit-background-size: cover;

	height: 600px;

	width: 100%;

	clear: both;

	position: relative;

}



.post-meta {

	position: absolute;

	bottom: 0;

	width: 100%;

	height: 70px;

	line-height: 70px;

	text-align: center;

	background-color: rgba(0,0,0,0.3);

}



.post-meta span {

	font-size: 20px;

	letter-spacing: 2px;

	padding: 0 10px;

	font-weight: 400;

}



.post-wrap {

	height: 100%;

}



.post-content {

	line-height: 30px;

	font-size: 16px;

}



/* post video */



iframe.post-video {

	width: 100%;

	border: none;

}



iframe.post-audio {

	width: 100%;

	border: none;

	overflow: hidden;

}



/* post gallery */



.gallery-box {

	height: 300px;

}



.gallery-thumb {

    height: 300px;

    position: relative;

	

    background-position: center center;

    background-repeat: no-repeat;

    background-size: cover;

}



.gallery-caption {

	background-color: rgba(0,0,0,0.7);

	height: 100%;

	left: 0;

	position: absolute;

	top: 0;

	width: 100%;

	

	transform: scale(0,0);

	-moz-transform: scale(0,0);

	-webkit-transform: scale(0,0);

	-o-transform: scale(0,0);

	-ms-transform: scale(0,0);

	

	transform-origin: center center;

	-moz-transform-origin: center center;

	-webkit-transform-origin: center center;

	-o-transform-origin: center center;

	-ms-transform-origin: center center;

}



.gallery-thumb:hover .gallery-caption {

    transform: scale(1,1);

	-moz-transform: scale(1,1);

	-webkit-transform: scale(1,1);

	-o-transform: scale(1,1);

	-ms-transform: scale(1,1);

}

	

.gallery-icon {

	font-size: 25px;

	text-align: center;

	width: 50px;

	line-height: 300px;

	position: absolute;

	right: 50%;

	margin-right: -25px;

	color: #fff;

	cursor: pointer;

}



/* 	post slider */



.slide-image {

	background-attachment: fixed;

    background-position: center center;

    background-size: cover;

	-moz-background-size: cover;

	-ms-background-size: cover;

	-o-background-size: cover;

	-webkit-background-size: cover;

	height: 600px;

	width: 100%;

	clear: both;

	position: relative;

}



/* post comments */



.post-comment {

	list-style: none;

}



	.user-thumb {

		float: left;

		width: 40px;

		height: 40px;

		overflow: hidden;

		border-width: 3px;

		border-style: solid;

		border-radius: 100%;

		padding: 10px;

	}

	

	.user-thumb img {



		width: 100%;

		height: auto;

	}

	

	.user-wrap {

		padding-top: 10px;

		float: left;

	}

		

	.user-comment {

		display: inline-block;

		border-left-width: 3px;

		border-left-style: solid;

		font-size: 16px;

		line-height: 30px;

		margin-left: 31px;

	}

	

	.reply-comment {

		display: inline-block;

		padding: 5px;

		font-size: 16px;

		margin-left: 56px;

		font-weight: 400;

		cursor: pointer;

		color: #fff;

	}



/* 10 - ELEMENTS UI */



.ui-accordion .ui-accordion-header {

	padding: 10px 0;

	margin-bottom: -2px;

	border-bottom-style: solid;

	border-bottom-width: 2px;

}



.ui-accordion .ui-accordion-content,

.ui-tabs .ui-tabs-panel {

	padding: 10px;

	border-style: solid;

	border-width: 2px;

}



.ui-tabs .ui-tabs-nav li {

	margin: 5px 5px 5px 0;

	border-style: solid;

	border-width: 2px;

}



.ui-tabs .ui-tabs-nav li a {

	display: block;

	padding: 10px;

}



.ui-toggle .ui-toggle-header {

	border-style: solid;

	border-width: 2px;

	padding: 10px;

	margin: 5px 0;

	cursor: pointer;

}



.ui-toggle .ui-toggle-content {

	display: none;

}



.ui-btn {

	display: inline-block;

	border-style: solid;

	border-width: 2px;

	font-weight: 400;

}



.ui-btn a {

	display: block;

}



.ui-btn:hover a {

	color: #fff;

}



.ui-btn-small a {

	padding: 5px;

}



.ui-btn-medium a {

	padding: 10px;

}



.ui-btn-large a {

	padding: 15px;

}

	

/* 11 - WIDGETS */



aside {

	margin-top: -25px !important;

}



.widget-title {

	font-size: 25px;

    font-weight: 700;

	letter-spacing: 2px;    

	text-transform: uppercase;

	color: #fff;	

}

.quote p {

    font-family: FFTisaSansWebLight, Helvetica, Arial, sans-serif;

    font-size: 20px;

    line-height: 32px;

    letter-spacing: 0px;

    color: #fff;

}



.subtitle-section {

	letter-spacing: 1px;

}



.subtitle-section,

.subtitle-page,

.meta-page {

    font-size: 20px;

    line-height: 130%;

	font-weight: 300;

    text-align: center;

}







/* chrome fix */



@media screen and (-webkit-min-device-pixel-ratio:0) { 

    

	#blog .parallax, #quotes .parallax {

		background-attachment: scroll;

	}



}



#hero {

    width: 100%;

    height: 100vh;

    background-size: cover

}



 #hero a.chat-btn {

        display: none

    }

		

		.scroll-section {

    display: inline-block;

    width: 100%;

    position: relative;

    z-index: 1

}



#about {

    background-image: url('../images/wood.png');

    background-size: cover;

    -webkit-box-shadow: 0px 12px 0px 0px rgba(0, 0, 0, 1);

    -moz-box-shadow: 0px 12px 0px 0px rgba(0, 0, 0, 1);

    box-shadow: 0px 12px 20px 0px rgba(0, 0, 0, 0.25);

    z-index: 2

}

#about .blue-copy-box {

    background-color: #5c964c;

    width: 76%;

    max-width: 1064px;

    margin: -100px auto 200px auto;

    display: block;

    text-align: center;

    position: relative;

    -webkit-box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.75);

    -moz-box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.75);

    box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.25)

}

#about .blue-copy-box h3 {

    

    margin-top: 25px

}

#about .blue-copy-box h3:after {

    content: '';

    width: 60px;

    background-color: #114CD4;

    height: 2px;

    display: block;

    margin: 29px auto

}

#our-work h3:after {

    content: '';

    width: 60px;

    background-color: #fff;

    height: 2px;

    display: block;

    margin: 29px auto

}



#parallax h3:after {

    content: '';

    width: 60px;

    background-color: #fff;

    height: 2px;

    display: block;

    margin: 29px auto

}



#parallax-1 h3:after {

    content: '';

    width: 60px;

    background-color: #1a1b1f;

    height: 2px;

    display: block;

    margin: 29px auto

}

#about h3:after {

    content: '';

    width: 60px;

    background-color: #fff;

    height: 2px;

    display: block;

    margin: 29px auto;

}

#about .blue-copy-box p {

	font-family: FFTisaSansWebLight, Helvetica, Arial, sans-serif;

    width: 77%;

    margin: auto auto 100px auto;

    font-size: 20px;

   letter-spacing: 0px;

    color: #fff;

    line-height: 32px;

    text-align: center;

}

 

#about .blue-copy-box p a {

    text-decoration: none;

    color: #FFF;

    font-weight: 600

}

.about-above {

    width: 100%;

    height: 50px;

    position: relative;

    top: 0;

    background-color: #5c964c;

    display: inline-block

}

.about-above:before {

    content: '';

    width: 50%;

    position: absolute;

    left: 0;

    bottom: 0;

    height: 80px;

    z-index: 1;

    background-color: #5c964c;

    -webkit-box-shadow: 0px -12px 20px -10px rgba(0, 0, 0, 0.75);

    -moz-box-shadow: 0px -12px 20px -10px rgba(0, 0, 0, 0.75);

    box-shadow: 0px -15px 20px -5px rgba(0, 0, 0, 0.25)

}

.about-above:after {

    content: '';

    width: 50px;

    position: absolute;

    left: 50%;

    bottom: -1px;

    height: 50px;

    z-index: 1;

       background: linear-gradient(135deg, rgb(83, 115, 74) 0%, rgb(92, 150, 76) 37%, rgb(92, 150, 76) 100%);

    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#2284ec', endColorstr='#3ba7ff', GradientType=1)

}

.about-below {

    width: 100%;

    height: 52px;

    position: relative;

    bottom: 0;

    background-color: #5c964c;

    display: inline-block

}

.about-below:before {

    content: '';

    width: 50px;

    position: absolute;

    right: 50%;

    bottom: -2px;

    height: 50px;

    z-index: 1;

       background: linear-gradient(135deg, rgb(92, 150, 76) 0%, rgb(92, 150, 76) 63%, rgb(89, 134, 76) 100%);

    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#3ba7ff', endColorstr='#2284ec', GradientType=1)

}

.about-below:after {

    content: '';

    width: 50%;

    position: absolute;

    right: 0;

    top: 0;

    height: 80px;

    z-index: 1;

    background-color: #5c964c;

    -webkit-box-shadow: 0px -12px 20px -10px rgba(0, 0, 0, 0.75);

    -moz-box-shadow: 0px -12px 20px -10px rgba(0, 0, 0, 0.75);

    box-shadow: 0px 20px 20px -10px rgba(0, 0, 0, 0.25)

}



.dot-title {

    display: none

}



.text-1 {

    text-align: center;

    margin: 33vh 0 30px 0;

    display: inline-block;

    width: 100%;

    font-size: 12px;

    letter-spacing: 1px;

    font-weight: 200;

    text-transform: uppercase

}



.text-2 {

    font-family: FFTisaSansWebBold, Helvetica, Arial, sans-serif;

    text-align: center;

    font-size: 100px;

    letter-spacing: -2px;

    width:90%;

    margin: auto;

}



.head-newfont{

    font-family:'Merienda', cursive;

}

.innerhead-newfont{

     font-family:'Merienda', cursive;

}



.text-3 {

    text-transform: uppercase;

    letter-spacing: 2px;

    font-weight: 500;

    text-align: center;

    font-size: 18px;

    line-height: 22px;

    letter-spacing: 2px;

    margin: 75px 0 50px 0;

    color: #EFEFEF

}

.text-3:after {

    content: '';

    width: 60px;

    background-color: #3BA6FF;

    height: 2px;

    display: block;

    margin: 29px auto

}



		

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

   

    .single #hero {

        height:auto;

    }}

		

		

		.square-container {

  width: 100%;

  padding-left:5px;

  text-align:center;

}



.trigger {

    display: inline-block;

    width: 90%;

}



.blur{

  -webkit-filter: blur(5px);

  -moz-filter: blur(5px);

  -o-filter: blur(5px);

  -ms-filter: blur(5px);

  filter: blur(5px);

}

.modal-wrapper{

  width:100%;

  height:100%;

  position:fixed;

  top:0; left:0;

  background:rgba(255,257,153,0.75);

  visibility:hidden;

  opacity:0;

  -webkit-transition: all 0.25s ease-in-out;

  -moz-transition: all 0.25s ease-in-out;

  -o-transition: all 0.25s ease-in-out;

  transition: all 0.25s ease-in-out;

}



.modal-wrapper.open{

  opacity:1;

  visibility:visible;

}



.modal{

  width:600px;

  height:400px;

  display:block;

  margin:50% 0 0 -300px;

  position:relative;

  top:50%; left:50%;

  background:#fff;

  opacity:0;

  -webkit-transition: all 0.5s ease-in-out;

  -moz-transition: all 0.5s ease-in-out;

  -o-transition: all 0.5s ease-in-out;

  transition: all 0.5s ease-in-out;

}



.modal-wrapper.open .modal{

  margin-top:-200px;

  opacity:1;

}



.fliphead{

  width:90%;

  height:32px;

  padding:1.5em 5%;

  overflow:hidden;

  background:#01bce5;

}



.btn-close{

  width:32px;

  height:32px;

  display:block;

  float:right;

}



.btn-close::before, .btn-close::after{

  content:'';

  width:32px;

  height:6px;

  display:block;

  background:#fff;

}



.btn-close::before{

  margin-top:12px;

  -webkit-transform:rotate(45deg);

  -moz-transform:rotate(45deg);

  -o-transform:rotate(45deg);

  transform:rotate(45deg);

}



.btn-close::after{

  margin-top:-6px;

  -webkit-transform:rotate(-45deg);

  -moz-transform:rotate(-45deg);

  -o-transform:rotate(-45deg);

  transform:rotate(-45deg);

}





.panel {

	margin: 0 auto;

  min-width:100%;

  height:130px;

  -webkit-perspective: 600px;

	-moz-perspective: 600px;

}



.panel .front,

.panel .back {

	text-align: center;

  min-width: 100%;



}

	

.panel .front {

	height: inherit;

	position: absolute;

	top: 0;

	z-index: 900;

	text-align: center;

	-webkit-transform: rotateX(0deg) rotateY(0deg);

	   -moz-transform: rotateX(0deg) rotateY(0deg);

	-webkit-transform-style: preserve-3d;

	   -moz-transform-style: preserve-3d;

	-webkit-backface-visibility: hidden;

	   -moz-backface-visibility: hidden;

	-webkit-transition: all .4s ease-in-out;

	   -moz-transition: all .4s ease-in-out;

		-ms-transition: all .4s ease-in-out;

		 -o-transition: all .4s ease-in-out;

			transition: all .4s ease-in-out;

}



.panel .back {

	height: inherit;

	position: absolute;

	top: 0;

	z-index: 1000;

	-webkit-transform: rotateY(-180deg);

	   -moz-transform: rotateY(-180deg);

	-webkit-transform-style: preserve-3d;

	   -moz-transform-style: preserve-3d;

	-webkit-backface-visibility: hidden;

	   -moz-backface-visibility: hidden;

	-webkit-transition: all .4s ease-in-out;

	   -moz-transition: all .4s ease-in-out;

		-ms-transition: all .4s ease-in-out;

		 -o-transition: all .4s ease-in-out;

			transition: all .4s ease-in-out;

}

.panel.flip .front {

	z-index: 900;

	-webkit-transform: rotateY(180deg);

	-moz-transform: rotateY(180deg);

}

.panel.flip .back {

	z-index: 1000;

	-webkit-transform: rotateX(0deg) rotateY(0deg);

	-moz-transform: rotateX(0deg) rotateY(0deg);

}

.box1{

  background-color: #5c964c;

	max-width: 100%;

  width: 100%;

  min-width: 100%;



	margin: 0 auto;

  overflow: hidden;

}



.box2{

	background-color: #5c964c;

	max-width: 100%;

  width: 100%;

  min-width: 100%;

	

	margin: 0 auto;

  overflow: hidden;

}



@media (max-width: 997px) {

  .square-container .trigger,

  .square-container .gap{

    width: 49%;

  }

}



@media (min-width: 998px) and (max-width: 1339px) {

  .square-container .trigger {

    width: 32%;

  }

}



@media (min-width: 1340px) {

  

}



.modal .content {

  padding: 1.5em 5%;

}