html, body{
	width: 100%;
}
h1,h2,h3,h4,h5,h6,
p,a,label,li,span,option,input,textarea{
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizelegibility;
	color: #000;
}
p,a,label,li,span,option,input,textarea, #contact-section .button, .back-to-home, .back-to-home .text, .styling b{
	font-family: 'Montserrat', sans-serif;
}
@font-face{
    font-family: YellowTail;
    src: url(../fonts/Yellowtail-Regular.ttf);
}
h1,h2,h3,h4,h5,h6{
	font-weight: bold;
}
p,a,label,li,span,option,input,textarea{
	font-size: 18px;
	letter-spacing: 0.015em;
}
.screen{
	position: fixed;
	bottom:0;
	left:0;
	display: block;
	z-index: 5;
	border: 1px solid black;
	background-color: #fff;
	padding: 5px;
}
.styling b{
        font-weight: 600; font-size: 18px; display: inline block;
}
a:focus,a:active,a:hover{
	outline: none;
}
a:hover{
	text-decoration: none;
}
a,a:hover{
	color: rgb(0,0,0);
}
.black-title{
	color: #231F20;
}
a, .button, .caption, .overlay.theme-green, .navbar, .work-selection .work-item a .overlay{
	-webkit-transition: all 0.35s ease;
	   -moz-transition: all 0.35s ease;
	    -ms-transition: all 0.35s ease;
	     -o-transition: all 0.35s ease;
	        transition: all 0.35s ease;
}
.modal-open{
    overflow: auto;
}
.modal-open .modal, .modal-open{
    padding-right: 0!important;
}
.gallery .gallery-item .overlay, .gallery .gallery-item .caption{
	-webkit-transition: all 0.4s ease;
	   -moz-transition: all 0.4s ease;
	    -ms-transition: all 0.4s ease;
	     -o-transition: all 0.4s ease;
	        transition: all 0.4s ease;
}
.work-selection .work-item a img{
	-webkit-transition: all 1s ease;
	   -moz-transition: all 1s ease;
	    -ms-transition: all 1s ease;
	     -o-transition: all 1s ease;
	        transition: all 1s ease;
}
.relative, section, main, .item, .gallery .gallery-item, .navbar .navbar-nav, .section-col,.work-parallax, .preload,.home-banner{
	position: relative;
}
.caption, .absolute, .preload .intro, .word, .overlay,.owl-theme .owl-nav,.owl-theme .owl-dots,.caption,.word,.contact-close,.mind-map,.spinning-gear,
.work-selection .work-item a .caption, .error, .success{
	position: absolute;
}
.navbar .navbar-close,.navbar-contact p, .navbar-contact span,.navbar .navbar-nav li a,.caption,.white,.bg-blue .small p, .bg-blue .smaller p, .bg-blue a,
.bg-blue .section-title p,.work-selection .work-item a .caption,.work-selection .work-item a .caption h4, .section-title h2{
	color: rgb(255,255,255);
}
/* Set Up theme green background color */
.theme-green, .overlay.theme-green{
	background-color: rgb(51,184,127);
}
/* Set up theme green color */
.highlight,.theme-title h2, .section-title.title-green h2 .styling,.theme-title h3,.copyright p, .work-quote > *, .back-button > *,.work-header .quote .styling,.back-to-home > *{
	color: rgb(51,184,127);
}
/* Set Up theme blue background color */
.copyright{
	background-color: rgb(69,76,157);
}
/* Set up theme blue color */
.theme-blue, .info-contact h4{
	color: #444D9E;
}
.bg-blue{
	background-color: #444D9E;
}
.cap-title h2, .cap-title h3, .gallery .gallery-item .caption, .button{
	text-transform: uppercase;
}
.navbar .navbar-nav li a:hover, .navbar-open:hover{
	color: rgb(51,184,127);
}
.img-responsive{
	max-width: 100%;
	width: 100%;
	height: auto;
}
.fancybox-enabled{
	overflow: auto;
}
.overlay, .item, .image,.navbar .navbar-nav,.navbar-contact, .gallery{
	display: block;
	width: 100%;
	height: 100%;
}
.overlay{
	background-color: rgba(0,0,0,0.6);
}
.overlay{
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
}
.caption{
	z-index: 3;
}
.full-widhth,.navbar .navbar-nav li,.section-content{
	width: 100%;
}
.overlay.theme{
	background-color: rgba(51,184,127,0.5);
}
@-webkit-keyframes preloading{
	0% 		{opacity:1;}
	80%		{opacity:1;}
	90%		{opacity: 0.5}
	100%	{opacity:0;}
}
@-moz-keyframes preloading{
	0% 		{opacity:1;}
	80%		{opacity:1;}
	90%		{opacity: 0.5}
	100%	{opacity:0;}
}
@-ms-keyframes preloading{
	0% 		{opacity:1;}
	80%		{opacity:1;}
	90%		{opacity: 0.5}
	100%	{opacity:0;}
}
@-o-keyframes preloading{
	0% 		{opacity:1;}
	80%		{opacity:1;}
	90%		{opacity: 0.5}
	100%	{opacity:0;}
}
@keyframes preloading{
	0% 		{opacity:1;}
	80%		{opacity:1;}
	90%		{opacity: 0.5}
	100%	{opacity:0;}
}
@-webkit-keyframes fadein-up{
	0% 		{opacity:0;transform: translate(-50%,100px);}
	100%	{opacity:1;transform:translate(-50%,-50%);}
}
@-moz-keyframes fadein-up{
	0% 		{opacity:0;transform: translate(-50%,100px);}
	100%	{opacity:1;transform:translate(-50%,-50%);}
}
@-ms-keyframes fadein-up{
	0% 		{opacity:0;transform: translate(-50%,100px);}
	100%	{opacity:1;transform:translate(-50%,-50%);}
}
@-o-keyframes fadein-up{
	0% 		{opacity:0;transform: translate(-50%,100px);}
	100%	{opacity:1;transform:translate(-50%,-50%);}
}
@keyframes fadein-up{
	0% 		{opacity:0;transform: translate(-50%,60px);}
	100%	{opacity:1;transform:translate(-50%,-50%);}
}

.preload .loading{
	animation-name: preloading;
	animation-duration: 6.8s;
	animation-timing-function: ease-out;
	animation-fill-mode: both;
}
.preload{
	overflow: hidden;
}
.preload, .preload .loading{
	display: block;
	width: 100%;
	height: 100%;
	background-color: #fff;
}
.preload .intro{
	display: block;
	opacity: 0;
	text-align: center;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-transition: all 4s ease;
	-moz-transition: all 4s ease;
	-ms-transition: all 4s ease;
	-o-transition: all 4s ease;
	transition: all 4s ease;
	animation-name: fadein-up;
	animation-delay: 7s;
	animation-duration: 2s;
	animation-timing-function: ease-out;
	animation-fill-mode: both;
}
.preload .intro.show{
	opacity: 1;
	transform: translate(-50%, -50%);
}
.preload .intro img{
	display: block;
	margin: 0 auto 60px;
	width: 420px;
	height: auto;
}
.preload .intro h3,
.preload .intro p{
	margin: 0;
	padding: 0;
	line-height: 1.6;
}
.preload .intro h3{
	text-transform: uppercase;
	font-weight: bold;
	font-size: 16px;
}
.preload .intro p{
	font-weight: lighter;
	font-size: 14px;
}
.preload .intro .scrollTo{
	
}
.preload .intro .scrollTo img{
	width: 25px;
	height: auto;
}
.home-banner{
	width: 100%;
	min-height: 50vh;
	height: 100%;
	padding: 70px 0 200px;
}
.home-banner .spinning-gear{
	width: 50%;
	bottom: 0;
	left: 50%;
	transform: translate(-50%,0);
}
.section-title h2,.work-header .quote{
    text-transform: lowercase;
    font-size: 40px;
}
.section-title h2 .styling{
	font-size: 200px;
}
.work-header .styling{
    font-size: 120px;
}
.section-title h2 .styling, .work-header .styling{
	display: block;
	line-height: 1;
    font-family: YellowTail;
    font-weight: normal;
}
.section-title,.section-col{
	padding: 150px 0;
}
.section-col .section-content{
	padding: 50px 0 100px;
}
.section-title h2 .styling{
}
.section-title p{
	font-size: 14px;
	width: 60%;
	margin: 0 auto;
	padding: 50px 0;
}
.section-title ul{
	width: 100%;
	list-style: none;
	padding-inline-start: 0;
	margin: 30px 0 0;
}
.section-title ul li{
	margin-bottom: 50px;
}
.section-title ul li h3{
	margin-bottom: 12px;
	font-size: 20px;
}
.section-title ul li h3,
.section-title ul li p{
	letter-spacing: 0.005em;
}
.section-title ul li p{
	padding: 0;
	margin: 0;
	width: 100%;
	font-size: 14px;
	font-weight: 500;
}
.section-services .section-title h2{
    color: #000;
}
.section-services .section-title{
    padding: 150px 0 50px;
    text-align: center;
}
.section-services .section-title.content{
    padding: 70px 0 0;
    text-align: justify;
}
.section-services .section-title.content ul{
    margin: 0;
    padding-bottom: 80px;
}
.mind-map{
    bottom: 0;
    left: 50%;
    transform: translate(-50%,0);
    width: 100%;
}
.page-title h1{
    position: absolute!important;
    width: 1px;
    height: 1px;
    font-size: 0;
    overflow: hidden;
    border: 0!important;
    padding: 0!important;
    margin: 0!important;
    clip: rect(1px,1px,1px,1px);
}
main{
	display: block;
	width: 100%;
	height: 100%;
	padding-top: 50px;
}
.navbar.stick{
	position: absolute;
	top: 0;
	display: block;
	width: 100%;
}
.navbar.fixed-top{
	padding-top: 20px;
	box-shadow: 0 1px 15px 2px rgba(0,0,0,0.5);
}
.navbar{
	padding-top: 30px;
	background-color: rgb(255,255,255);
	z-index: 9;
}
.navbar .sidebar-nav{
	margin-bottom: 0;
	display: flex;
	justify-content: space-evenly;
	height: 100%;
	list-style: none;
	padding-inline-start: 0px;
}
.navbar .sidebar-nav li{
	margin-left: 15px;
}
.navbar .sidebar-nav li a, .directory li a{
	display: block;
	width: 25px;
	height: 25px;
}
.navbar .navbar-brand{
	width: 125px;
	margin: 0;
}
.navbar .navbar-collapse.toggler{
	transform: translate(0,0);
}
.navbar .navbar-collapse{
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 350px;
	height: 100vh;
	padding-left: 50px;
	padding-top: 50px;
	background-color: rgb(69,76,157);
	z-index: 9998;
	flex-direction: column;
	transform: translate(100%,0);
	transition: all 0.5s ease;
}
.navbar .navbar-close{
	font-size: 30px;
	position: absolute;
	top: 0;
	left: 0;
}
.navbar .navbar-nav{
	flex-direction: column;
	padding-top: 150px;
	height: auto;
}
.navbar .navbar-nav li{
	display: block;
}
.navbar .navbar-nav li a{
	display: inline-block;
	width: auto;
	font-size: 26px;
	font-weight: lighter;
	text-transform: uppercase;
	padding-top: 6px;
	padding-bottom: 6px;
	letter-spacing: 0.115em;
}
.navbar-contact{
	padding: 50px 0;
}
.navbar-contact p,
.navbar-contact span{
	font-size: 16px;
}
.navbar-contact p{
	margin-bottom: 12px;
}
.navbar-contact span{
	display: block;
	margin: 40px 0;
	font-weight: bold;
}
.collapse:not(.show), .toggler.collapse:not(.show){
    display: block!important;
}
.ts-times,
.ts-times::before,
.ts-times::after{
	display: inline-block;
}
.ts-times{
	position: relative;
	width: 30px;
	height: 30px;
}
.ts-times::before,
.ts-times::after{
	content: "";
	display: block;
	width: 100%;
	height: 2px;
	position: absolute;
	top: 50%;
	left: 50%;
	background-color: rgb(255,255,255);
	transition: all 0.4s ease;
}
.ts-times::before{
	transform: translate(-50%,-50%) rotate(-50deg);
}
.ts-times::after{
	transform: translate(-50%,-50%) rotate(50deg);
}
.navbar-close:hover .ts-times::before{
	transform: translate(-50%,-50%) rotate(125deg);
}
.navbar-close:hover .ts-times::after{
	transform: translate(-50%,-50%) rotate(225deg);
}
.work-selection{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	padding-inline-start: 0;
}
.work-selection .work-item{
	width: calc( 25% - 6px );
	overflow: hidden;
}
.work-selection .work-item a{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
.work-selection .work-item a:hover img{
	transform: scale(1.2);
}
.work-selection .work-item a .caption{
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 3;
}
.work-selection .work-item a .caption,
.work-selection .work-item a .overlay{
	opacity: 0;
}
.work-selection .work-item a:hover .overlay{
	opacity: 0.85;
}
.work-selection .work-item a:hover .caption{
	opacity: 1;
}
.work-selection .work-item a .caption h4{
	text-transform: uppercase;
}
.image{
	display: block;
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
.nopadding{
	padding-left: 0!important;
	padding-right: 0!important;
}
.spacer{
	display: block;
	width: 100%;
	height: 30px;
	margin: 0;
	padding: 0;
}
.center,.section-content.center p{
	text-align: center;
}
.left, .title-left h2, .title-left h3{
	text-align: left;
}
.right{
	text-align: right;
}
.view-more{
	font-weight: bold;
	text-transform: uppercase;
}
.button-col .view-more{
	display: flex;
	align-items: center;
}
.button-col.right .view-more{
	justify-content: flex-end;
	width: auto;
	margin: 15px 0;
}
.button-col.right .view-more i{
	font-size: 30px;
	margin-left: 10px;
}
.section-col{
	display: block;
	width: 100%;
	height: 100%;
}
.section-content.pad-left,.pad-left{
	padding-left: 15px;
}
.section-content.white, .section-content.white p{
	color: rgba(255,255,255,1);
}
.section-content h2{
	font-size: 90px;
	font-weight: bolder;
	padding-left: 20px;
}
.section-content p{
	font-size: 24px;
	line-height: 1.7;
}
.work-page{
	margin-top: 50px;
	padding: 120px 0;
}
.work-header{
	display: block;
	margin: 0 auto;
	width: 70%;
}
.work-header .quote{
	font-weight: bold;
	line-height: 1.2;
	margin-top: 30px;
	margin-bottom: 30px;
	text-align: center;
}
.work-header p{
	font-size: 16px;
	font-weight: 500;
	text-align: left;
	margin-top: 60px;
	margin-bottom: 60px;
	word-spacing: 5px;
}
.work-header img{
	display: block;
	width: 50%;
	margin: 0 auto;
}
.work-gallery{
	margin: 80px 0;
}
.work-gallery img{
	margin-bottom: 10px;
}
.work-info{
	display: block;
	width: 100%;
	margin-bottom: 30px;
}
.work-info h3{
	font-weight: bold;

}
.work-info h3,
.work-info p{
	font-size: 16px;
	line-height: 1.5;
}
.work-info h3,
.back-to-home{
	text-transform: uppercase;
}
.work-info p,
.back-to-home{
	font-weight: 500;
}
.back-to-home{
	display: inline-block;
}
.back-to-home .fas{
	margin-top: 1px;
}
.footer h2{
	font-size: 54px;
	font-weight: normal;
}
.footer .section-content h2, #contact-section .contact-form .button{
    padding-left: 0;
    margin-bottom: 10px;
}
.directory{
    list-style: none;
    display: flex;
    flex-direction: row;
    padding-inline-start: 0;
}
.directory li{
    margin-right: 15px;
}
.view-more i{
    font-size: 20px;
    margin-left: 10px;
}
.copyright{
	display: block;
	width: 100%;
	padding: 10px 0;
}
.copyright p{
	font-size: 12px;
}
.contact-form .form-group{
    margin-bottom: 0;
}
.contact-form .form-group, .contact-form .form-group label, .contact-form .form-group input, .contact-form .form-group textarea{
    width: 100%;
    z-index: 1;
}
.contact-form .form-group label, .contact-form .form-group input, .contact-form .form-group textarea{
    background: #fff;
}
.contact-form .form-group input, .contact-form .form-group textarea{
    resize: none;
}
#contact-section{
    display: block;
    width: 100%;
    height: 100%;
    background-color: #fff;
    margin: 0; 
}
#contact-section h3{
    text-align: left;
    text-transform: uppercase;
}
#contact-section label, #contact-section input, #contact-section textarea{
    padding: 6px 15px;
}
#contact-section label{
    font-size: 18px;
}
#contact-section input, #contact-section textarea{
    font-size: 16px;
    border: 1px solid #888889;
}
#contact-section input, #contact-section textarea,
#contact-section .button{
    transition: all 0.4s ease;
}
#contact-section .button{
    padding: 8px 15px;
    background: transparent;
    border: 1px solid transparent;
    color: rgb(51,184,127);
    font-size: 16px;
    font-weight: bolder;
    outline: none;
}
.view-more i, #contact-section .contact-form .button i{
    margin-left: 8px;
    font-size: 20px;
}
#contact-section input, #contact-section textarea,
#contact-section input:focus, #contact-section textarea:focus,
#contact-section input:active, #contact-section textarea:active, button{
    outline: none;
}
#contact-section input:focus, #contact-section textarea:focus,
#contact-section input:active, #contact-section textarea:active{
    border: 1px solid rgb(51,184,127);
}
.contact-close{
    position: absolute;
    top: 50px;
    right: 0;
    width: 45px;
    height: 45px;
    overflow: hidden;
    cursor: pointer;
    opacity: 0.6;
    -webkit-transition: all 0.35s ease;
    -moz-transition: all 0.35s ease;
    -ms-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s ease;
    z-index: 5;
}
.contact-close:hover{
    opacity: 1;
}
.contact-close i{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-size: 30px;
}
.divider{
	position: relative;
}

.divider.space-tb{
	padding: 70px 0 100px;
}
.divider::before{
	content: "";
	position: relative;
	display: block;
	width: 100%;
	height: 1px;
	background-color: #000;
}
.divider.short::before{
	width: 100px;
}
.info-contact img{
	width: 200px;
	height: auto;
}
.info-contact h4{
	font-size: 20px;
	text-transform: uppercase;
}
.info-contact h4 span{
	color: inherit;
}
.info-contact h4 span{}
.info-contact p{
	font-size: 16px;
	line-height: 1.3;
}
.info-contact .tel::before{
	content: "M";
}
.info-contact .phone::before{
	content: "T";
}
.info-contact .tel::before,
.info-contact .phone::before{
	display: inline-block;
	position: relative;
	width: 20px;
}
.form-group{
    position: relative;
}
.error{
    color: red;
    padding-left: 15px;
}
.success{
    color: green;
}
.error, .success{
    font-size: 90%;
    display: none;
}
.error1, .error2{
    bottom: 5px;
}
.error-message, .success-message{
    top: 100%;
    padding-left: 0;
}

@media screen and (max-width: 375px){
    .navbar .navbar-nav li a{
        font-size: 18px;
    }
    .navbar-contact span{
        margin: 25px 0;
    }
    .navbar .navbar-nav{
        padding-top: 120px;
    }
	.navbar .sidebar-nav li a{
		width: 20px;
		height: 20px;
	}
	.navbar .navbar-brand{
		width: 100px;
	}
	.preload .intro{
		width: 100%;
	}
	.preload .intro img{
		width: 200px;
		margin: 0 auto 30px;
	}
	.preload .intro .scrollTo img{
		width: 20px;
	}
	.home-banner{
		padding: 60px 0 60px;
	}
	.section-title, .section-col{
		padding: 60px 15px;
	}
	.section-title h2 .styling,.work-header .styling{
	    font-size: 50px;
	}
	.footer h2,#contact-section h3{
	    font-size: 22px;
	}
	.home-banner .section-title p{
	    text-align: center;
	}
	.section-title h2{
		font-size: 20px;
	}
	.section-title p{
		padding: 30px 0;
		font-size: 12px;
	}
	.section-services .section-title{
	    padding: 80px 0 50px;
	}
	.section-services .section-title.content ul{
	    width: 100%!important;
	}
	.section-title ul li h3{
	    font-size: 18px;
	}
	.work-selection .work-item a .caption h4,.button-col.right .view-more{
	    font-size: 16px;
	}
	.work-selection .work-item{
		margin-bottom: 12px;
	}
	.section-col .section-content{
		padding: 50px 0;
	}
	.section-col .section-content p,.work-header p,.back-to-home span, #contact-section label,#contact-section input, #contact-section textarea,#contact-section .button,.info-contact h4 span,.preload .intro h3,.info-contact h4,.work-info h3{
		font-size: 14px;
	}
	.spacer{
		height: 15px;
	}
	.contact-form{
		margin-bottom: 30px;
	}
	.work-page .work-info{
	    margin: 0 auto 15px;
	}
	.work-header,.work-info{
	    padding: 0 20px!important;
	}
	.work-header .quote{
		font-size: 20px;
	}
	.work-header img{
		width: 100%;
	}
	.work-info p{
	    font-size: 14px;
	}
	.info-contact p{
	    font-size: 12px;
	}
	.work-header p{
	    margin-top: 30px;
	}
	.work-selection .work-item a .caption{
	    text-align: center;
	}
	.info-contact img{
	    width: 150px;
	}
	.button i{
	    margin-left: 10px;
	    transform: translateY(3px);
	    font-size: 24px;
	}
	.contact-section{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	.contact-section .row > [class*='col-']{
	    padding-top: 20px;
	}
}
@media screen and (min-width: 376px) and (max-width: 480px){
    .home-banner,.section-services .section-title{
        padding-top: 100px;
    }
	.preload .intro img{
		width: 250px;
		margin: 0 auto 30px;
	}
	.preload .intro{
		width: 100%;
	}
	.home-banner{
		padding: 120px 0;
	}
	.section-title, .section-col{
		padding: 25px 0;
	}
	.section-title h2 .styling{
	    font-size: 60px;
	}
	.section-title h2{
		font-size: 22px;
	}
	.work-header .styling{
	    font-size: 65px;
	}
	.home-banner .section-title p{
		text-align: center;
	}
	.home-banner .section-title,.section-services .section-title{
		width: 85%;
		margin: 0 auto;
	}
	.section-title p{
		font-size: 14px;
	}
	.section-content p{
		font-size: 16px;
	}
	.footer h2{
		font-size: 30px;
	}
	.work-header .quote{
		font-size: 26px;
	}
	.work-gallery{
		margin: 60px 0 30px;
	}
	.work-page .work-info{
		margin: 15px auto;
	}
	.contact-section{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	.contact-section .row > [class*='col-']{
	    padding-top: 20px;
	}
}
@media screen and (max-width: 480px){
	.work-header .pinetree-logo{
	    width: 250px;
	}
}
@media screen and (min-width: 481px) and (max-width: 767px){
    .preload .intro img{
        width: 350px;
    }
    .section-title, .section-col{
        padding: 100px 0;
    }
    .section-title{
        width: 75%;
        margin: 0 auto;
    }
    .section-title h2,.work-header .quote{
        font-size: 24px;
    }
    .section-title h2 .styling,.work-header .styling{
        font-size: 65px;
    }
    .footer h2{
        font-size: 35px;
    }
    .section-content p{
        font-size: 16px;
    }
    .work-header{
        width: 100%;
    }
    .work-header .quote{
        font-size: 32px;
    }
    .work-header p{
        font-size: 14px;
    }
    .work-page .work-info{
        margin-bottom: 20px;
    }
    .work-info h3{
        margin-bottom: 5px;
    }
	.contact-section{
	    padding-top: 50px;
	    padding-bottom: 50px;
	}
	.contact-section .row > [class*='col-']{
	    padding-top: 20px;
	}
}
@media screen and (max-width: 767px){
	.navbar,.footer .section-content{
		padding-left: 15px;
		padding-right: 15px;
	}
	.contact-close{
	    top: 25px;
	    opacity: 1;
	}
	.contact-close i{
	    font-size: 25px;
	}
	.navbar .navbar-collapse{
	    width: calc( 100% - 15px );
	}
	.sidebar-open{
	    overflow: hidden;
	}
	.section-title p{
		width: 100%;
	}
	.home-banner .spinning-gear, .mind-map{
		width: 80%;
		margin: 0 auto;
	}
	.work-header, .work-info{
	    width: 100%;
	    padding: 0 30px;
	}
	.work-selection .work-item{
		width: calc( 50% - 3px );
		max-width: 50%;
		margin-bottom: 5px;
	}
	.work-page .space-between .col-md-6{
		padding: 0;
	}
	.work-selection{
		width: calc( 100% - 30px );
		margin: 0 auto;
	}
	.footer h2{
		padding: 0;
	}
	.work-gallery{
		padding: 0 15px;
	}
	.work-header .pinetree-logo{
	    width: 300px;
	}
	.work-header img{
		width: 60%;
	}
	.divider.space-tb{
		padding: 40px 0 50px;
	}
	.divider::before{
		width: calc( 100% - 30px );
		margin: 0 auto;
	}
	.divider.short::before{
	    margin: 0;
	}
	.work-info p{
	    font-weight: normal;
	}
	.section-title h2 .styling,.work-header .styling{
	    transform: translate(0,-4px);
	}
	.error-message, .success-message,.error1,.error2{
	    top: auto;
	}
	.error, .success{
	    font-size: 85%;
	    padding-left: 0;
	}
	.contact-form .form-group{
	    padding-bottom: 5px;
	}
	.error1,.error2{
	    bottom: 0;
	}
}
@media screen and (min-width: 768px){
	.row.space-between .col-md-6:nth-child(odd){
		padding-left: 0;
		padding-right: 15px;
	}
	.row.space-between .col-md-6:nth-child(even){
		padding-left: 15px;
		padding-right: 0;
	}
	#contact-section .contact-form .button{
	    margin-bottom: 0;
	}
}
@media screen and (min-width: 768px) and (max-width: 991px){
    .info-contact{
        padding-left: 50px;
    }
    .info-contact p{
        font-size: 14px;
    }
	.contact-section{
	    padding-top: 70px;
	    padding-bottom: 70px;
	}
}
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){
	.preload .intro img{
		width: 350px;
	}
	.home-banner{
		padding: 70px 0 150px;
	}
	.home-banner .spinning-gear,
	.home-banner .section-title p{
		width: 70%;
	}
	.home-banner .section-title p{
		font-size: 18px;
	}
	.section-title, .section-col{
		padding: 100px 0;
	}
	.section-services{
		padding: 100px 0;
	}
	.section-services .section-title{
		padding: 30px 0;
	}
	.section-title h2 .styling{
	    font-size: 100px;
	}
	.section-title h2{
	    font-size: 32px;
	}
	.mind-map{
		width: 100%;
		margin-left: 0;
	}
	.info-contact{
		padding-left: 50px;
	}
	.work-page{
		padding: 90px 0;
	}
	.work-header{
		padding: 0 15px;
		width: 100%;
	}
	.work-header .quote{
		margin: 30px auto;
		font-size: 38px;
	}
	.work-header p{
		font-size: 18px;
	}
	.back-to-home i{
		font-size: 24px;
	}
	.back-to-home{
		
	}
}
@media screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape){
	.home-banner{
		padding: 70px 0 150px;
	}
	.section-title,.section-col{
		padding: 70px 0;
	}
	.section-title h2 .styling{
	    font-size: 110px;
	}
	.section-title h2{
		font-size: 38px;
	}
	.section-title p{
		font-size: 16px;
	}
	.mind-map{
		width: 500px;
	}
	.section-col .section-content{
		padding: 50px 0 70px;
	}
	.footer h2{
		font-size: 28px;
	}
}
@media screen and (min-width: 768px) and (max-width: 991px){
	.work-selection{
		width: 90%;
		margin: 0 auto;
		flex-wrap: wrap;
	}
	.work-selection .work-item{
		width: calc( 50% - 6px );
		max-width: calc( 50% - 6px );
		flex: 0 0 50%;
		margin-bottom: 10px;
	}
	.section-col .section-content{
		padding: 50px 0 70px;
	}
	.footer h2{
		font-size: 30px;
	}
	.work-header .styling{
	    font-size: 100px;
	}
}
@media screen and (max-width: 991px){
	.desktop{display: none;}
	.mobile{display: block;}
	.preload .loading .mobile{
		display: block;
		max-height: 100%;
		width: auto;
		margin: 0 auto;
	}
	.mind-map{
		position: relative;
		bottom: auto;
		left: auto;
		transform: translate(0,0);
		margin: 0 auto;
	}
	.bg-blue .section-title h2{
	    color: #fff;
	}
	.section-title h2{
	    color: #444d9e;
	}
	.section-services{
	    padding-bottom: 0;
	}
	.section-services .section-title.content{
	    text-align: center;
	    width: 80%;
	    margin: 0 auto;
	}
	.section-services .section-title.content ul{
	    width: 80%;
	    margin: 0 auto;
	    padding-bottom: 0;
	}
}
@media screen and (min-width: 992px){
	.desktop{display: block;}
	.mobile{display: none;}
}
@media screen and (min-width: 992px) and (max-width: 1024px){
	.contact-section{
	    padding-top: 70px;
	    padding-bottom: 70px;
	}
}
@media screen and (min-width: 1200px){
	.container, .modal-dialog{
	    max-width: 1000px;
	}
}
@media screen and (min-width: 1025px) and (max-width: 1319px){
	.preload .intro img{
		width: 320px;
	}
	.section-title, .section-col{
		padding: 100px 0;
	}
	.section-title h2 .styling{
	    font-size: 135px;
	}
	.section-title h2{
		font-size: 38px;
	}
	.footer h2{
		font-size: 35px;
	}
	.contact-section{
	    padding-top: 100px;
	    padding-bottom: 100px;
	}
}
@media screen and (min-width: 1320px) and (max-width: 1399px){
	.preload .intro img{
		width: 320px;
		margin: 0 auto 40px;
	}
	.section-title,.section-col{
		padding: 120px 0;
	}
	.section-title h2{
		font-size: 35px;
	}
	.section-title h2 .styling{
	    font-size: 160px;
	}
	.home-banner .spinning-gear{
	    width: 60%;
	}
	.footer h2{
		font-size: 38px;
	}
	.contact-section{
	    padding-top: 100px;
	    padding-bottom: 100px;
	}
}
@media screen and (min-width: 1400px) and (max-width: 1899px){
	.preload .intro img{
		width: 350px;
		margin: 0 auto 50px;
	}
	.section-title{
		padding: 120px 0;
	}
	.section-title h2,.work-header .quote{
		font-size: 32px;
	}
	.section-title h2 .styling{
	    font-size: 150px;
	}
	.work-header .quote .styling{
	    font-size: 120px;
	}
	.section-title p{
	    font-size: 14px;
	}
	.footer h2{
		font-size: 40px;
	}
	.contact-section{
	    padding-top: 100px;
	    padding-bottom: 100px;
	}
	.section-title h2 .styling{
	    transform: translatey(-20px);
	}
}
@media screen and (min-width: 1400px){
	.container{
		max-width: 1200px;
	}
}
@media screen and (min-width: 1900px){
	
	.info-contact{
		padding-left: 30px;
	}
	.contact-section{
	    padding-top: 100px;
	    padding-bottom: 100px;
	}
}
body.modal-open{
    overflow: hidden;
}
.modal > .modal-dialog{
    max-width: 600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    height: 100vh;
}
.modal .modal-body{
    padding: 0;
}
img{
    pointer-events: none;
    -webkit-user-drag: none;
    user-select: none;
    -webkit-user-select: none;
}
#modal-close{
    position: absolute;
    width: 34px;
    height: 34px;
    right: -15px;
    top: -15px;
    border-radius: 50px;
    border: 3px solid #33B87F;
    overflow: hidden;
    background-color: #fff;
    z-index: 1;
    color: transparent;
    opacity: 0.7;
}
#modal-close:hover{
    opacity: 1;
}
#modal-close::before, #modal-close::after{
    content: '';
    display: block;
    position: absolute;
    width: 20px;
    height: 3px;
    background-color: #33B87F;
    top: 50%;
    left: 50%;
}
#modal-close::before{
    transform: translate(-50%,-50%) rotate(45deg);
}
#modal-close::after{
    transform: translate(-50%,-50%) rotate(-45deg);
}
@media screen and (max-width: 767px){
    .modal > .modal-dialog{
        width: calc( 100% - 50px );
    }
}