@import url('https://fonts.googleapis.com/css?family=Quicksand:300,400|Source+Serif+Pro:400,600');

* {}
*:focus {
    outline: none; box-shadow:0px;
}
body {
	font-family:'Quicksand',sans-serif;
	color: #333;
	background: #fff;
	width:100%;
	height: 100%; /* older browsers */
	/* height: 100vh; */
	min-height: 0px;
	margin: 0;
	padding: 0;
	display: block;
	box-sizing: border-box;
	opacity:0;
	overflow-x: hidden;
	-webkit-animation: fadeIn .3s linear .4s forwards;
	-moz-animation: fadeIn .3s linear .4s forwards;
	-ms-animation: fadeIn .3s linear .4s forwards;
	animation: fadeIn .3s linear .4s forwards;
	}

h1, .h1,h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
 margin-top: 0;
 font-family: 'Source Serif Pro', sans-serif;
 font-weight: 400;
 color: #000;
 line-height: 1.2em;
 }

.blog-feed-title {margin: 20px 0px;}
.sidebar ul {
    list-style-type: none;
    padding: 0px 0px 0px 15px;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-bottom:30px;
}
.sidebar ul li {}
.sidebar ul li a {color: #000;}
.sidebar ul li a:hover {text-decoration: none;}
.sidebar ul li a:focus { color: #000; text-decoration: none; }
.sidebar ul li a:active {color: #000;border-bottom: 1px solid #222;}


.title, .title2 {text-transform:uppercase;font;font-family:'Quicksand',sans-serif;font-weight:100;letter-spacing:3px;font-size:28px;margin-bottom: 20px;}
.title:after {content:'\25B7 \25B7 \25B7'; top: -3px;position: relative; font-size:20px; letter-spacing:0px; padding-left: 5px;}
.title:hover:after { -webkit-animation: triangleAni 1s linear 0s infinite;
-moz-animation: triangleAni 1s linear 0s infinite;
-ms-animation: triangleAni 1s linear 0s infinite;
animation: triangleAni 1s linear 0s infinite;}

.title a {}
.title a:link, .title a:visited, .title a:hover, .title a:active  {text-decoration:none; border:0px;}

h1 {margin: 5px 0 20px;font-size: 41px;line-height: 1.0em;font-weight: 700;}
h2 {margin: 5px 0 30px;font-size: 35px;font-weight: 500;text-align: left;}
h3 {margin: 5px 0 20px; font-size: 30px; font-weight: 300; }
h4 {margin: 5px 0 20px; font-size: 20px; font-weight: 500; }
h5 {margin: 5px 0 15px; font-size: 16px; font-weight: 700; }
h5 {margin: 5px 0 15px; font-size: 18px;font-weight: 500;}

p {margin: 10px 0 25px;color: #333;font-size: 15px;line-height: 1.3em;letter-spacing: 0.02em;}
p a:link, p a:visited, p a:hover, p a:active {text-decoration:none;color: #000;border-bottom: 1px solid #555;}
#note, #note a { color:#aaa !important; font-style:italic; font-size:14px;}
a:link, a:visited, a:hover, a:active {text-decoration:none;color: #000;border: 0px;}

a:focus, a:hover {
    color: #222 !important;
    border-bottom: 1px solid #222;
}

blockquote {
    margin: 47px 0 0px;
    padding: 0px;
    font-size: 30.5px;
    font-style: italic;
    line-height: 1.2em;
    font-family: 'Source Serif Pro', sans-serif;
    font-weight: 100;
    border: 0px;
    left: 0px;
    position: relative;
    width: calc(100% + 40px);
}

blockquote:before {content:'" ';}
blockquote:after {content:'"';}

/* Old Faithful */
.absolute {position: absolute;}
.padding-none { padding:0px;}
.padding-sml { padding:20px 0px;}
.padding-med { padding:40px 0px;}
.padding-large { padding:40px 0px;}
.clear {clear:both;}
.signature { font-family: 'Homemade Apple', cursive; color: #C6A149;}

.container-full { width: 100%; max-width: none; position:relative; margin:0 auto; display:block; }
.table { display: table;}
.table-cell { display:table-cell; vertical-align:middle;}

section {}

/* Contents */

.wrapper {
	position: absolute;
	width: calc(100% - 120px);
	height: calc(100vh - 120px);
	top: 60px;
	right: 60px;
	/* overflow: hidden; */
	z-index: 2;
}

.row {}
.row:before, .row:after {content:none;display:none;}


.container {
	position:relative;
	width:100%;
	max-width: 1270px;
	padding: 20px 40px;
	top:50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	max-height: calc(100% - 120px);
	min-height: 300px;
	overflow-y: scroll;
}

.container:before {display:none; content:none;}
.container:after {display:none; content:none;}


.container::-webkit-scrollbar-track {	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0); background-color: #fff;}
.container::-webkit-scrollbar { width: 2px; background-color: #f5f5f5; border-left: 1px solid 403px;}








.container::-webkit-scrollbar-thumb {	background-color: #ccc; border: 2px solid #333;}


nav {
    margin: 0px;
    width: 100%;
    height: 60px;
    top: 0;
    position: fixed;
    display: block;
    background: #fff;
}


.left_bar {position:fixed;top:0;left:0;width:60px;height:100%;/* background:#f5f5f5; */}
.right_bar {position:fixed;top:0;right:0;width:60px;height:100%;/* background:#f5f5f5; */}

.menuicon {display:block;width:60px;height: 60px;background: #000;top: 50%;position: absolute;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);cursor: pointer;}

/* btn */
.menucon {
	position: relative;
	display:  inline-block;
	width: 30px;
	height: 30px;
	margin: 15px 13px;
}
.menucon span {
	margin: 0 auto;
	position: relative;
	top: 12px;
}
.menucon span:before, .menucon span:after {
	position: absolute;
	content: '';
}
.menucon span, .menucon span:before, .menucon span:after {
	width: 30px;
	height: 6px;
	background-color: #fff;
	display: block;
}
.menucon span:before {
	margin-top: -12px;
}
.menucon span:after {
	margin-top: 12px;
}

.popcross span {
	-webkit-transition-duration: 0s; transition-duration: 0s;
	-webkit-transition-delay: 0.2s; transition-delay: 0.2s;
}

.popcross span:before {
	-webkit-transition-property: margin, -webkit-transform; transition-property: margin, transform;
	-webkit-transition-duration: 0.2s; transition-duration: 0.2s;
	-webkit-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s;
}

.popcross span:after {
	-webkit-transition-property: margin, -webkit-transform; transition-property: margin, transform;
	-webkit-transition-duration: 0.2s; transition-duration: 0.2s;
	-webkit-transition-delay: 0.2s, 0s; transition-delay: 0.2s, 0s;
}

.popcross:hover span {
	background-color: rgba(0,0,0,0.0);
	-webkit-transition-delay: 0.2s; transition-delay: 0.2s;
}

.popcross:hover span:before {
	margin-top: 0;
	-webkit-transform: rotate(45deg); transform: rotate(45deg);
	-webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}

.popcross:hover span:after {
	margin-top: 0;
	-webkit-transform: rotate(-45deg); transform: rotate(-45deg);
	-webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}

.popcrossed span {
	background-color: rgba(0,0,0,0.0);
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

.popcrossed span:before {
	margin-top: 0;
	-webkit-transform: rotate(45deg); transform: rotate(45deg);
	-webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}

.popcrossed span:after {
	margin-top: 0;
	-webkit-transform: rotate(-45deg); transform: rotate(-45deg);
	-webkit-transition-delay: 0s, 0.2s; transition-delay: 0s, 0.2s;
}

.logo {
    position: absolute;
    top: calc(50%);
    left: 50%;
    width: 70%;
    max-width: 500px;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.logo a {
	opacity:1;
	margin-top:0px;
	 -webkit-transition: all .7s;
    -moz-transition: all .7s;
    -o-transition: all .7s;
    transition: all .7s;
}

.logo a:link, .logo a:visited, .logo a:hover, .logo a:active {text-decoration:none;color: #000;border: 0px;}


#logo {
    width: 100%;
    max-width: 500px;
    min-width: 196px;
}

.logo .title {text-align:center;margin:30px 0px;opacity: 1;-webkit-transition: all .7s;-moz-transition: all .7s;-ms-transition: all .7s;transition: all .7s;}
		

.post_col {margin: 30px 0px;}
.side_col {
    margin: 30px 0px;
}
.featured_img img {width:90%;height:auto;padding: 0px;top: -10px;position:relative;max-width: 300px;margin: 0px 0px 30px;}

.partner-img {width:100%;float:left;height: 150px;position: relative;}
.partner-img img {max-width: 50px;position: absolute;right: 0;bottom: 0;}


.menu-main-menu-container {
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  min-width: 494px;
  }

.menu {
  display: block;
  margin: 0 auto;
  width: auto;
  position: relative;
  }

nav ul {
  position: relative;
  display: block;
  padding: 0px;
  margin: 0 auto;
  width: auto;
}


nav ul li {
    position: relative;
    display: block;
    float: left;
    margin: 17px 10px;
    font-weight: 300;
    font-size: 18px;
    left:0px;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;

}
nav ul li:first-of-type { margin-left:0px;}
nav ul li:last-of-type {margin-right: 0px;}


nav ul li a {color: #000;}

nav ul li a:hover {text-decoration: none;}
nav ul li a:focus { color: #000; text-decoration: none; }
nav ul li a:active {color: #000;border-bottom: 1px solid #222;}
nav ul li ul { position: relative; padding: 7px 0px; }
.current_page_item {
    text-decoration: none !important;
}
.current_page_item a {border-bottom: 1px solid #000;}

 
/* Footer/Social */
  
footer {
    width: 100%;
    height: 60px;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index:2;
}

.footer_mob {
    width: 100%;
    height: 60px;
    position: relative;
    margin-top: 0px;
    padding-top:10px;
    border-top:1px solid #ccc;
    bottom: 0;
    display:none;
}


footer p, .footer_mob p {text-align:center;margin: 10px 0px;}

.social_icons {margin: 0 auto;display: block;position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
.social_icons a {} .social_icons a:hover {text-decoration:none; border-bottom:0px;}
.social_mob {display:none;}

.social {
    position: absolute;
    right: 40px;  
    top: 35px;
}

.social img {
    padding: 0px 11px;
	cursor:pointer;
	-webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
}

#fb_nav { opacity:0; }
#tw_nav { opacity:0; }
#inst_nav { opacity:0; }
#yt_nav { opacity:0; }
#pin_nav  { opacity:0; }

.social_icons #fb_nav, .social_icons #email_nav, .social_icons #inst_nav, .social_icons #yt_nav, .social_icons #pin_nav {opacity:1;padding: 7px 0px;width: 20px;height: auto;} 
.social_icons #fb_nav:hover, .social_icons #email_nav:hover, .social_icons #inst_nav:hover, .social_icons #yt_nav:hover, .social_icons #pin_nav:hover {border:0px; text-decoration:none;} 


.copyright {}
.address {}

/* Video */

.video_container {
	position: relative;
	padding-bottom: 51.25%;
	padding-top: 25px;
	height: 0;
	width: 100%;
	margin: 5px 0px 30px;
	border-radius: 15px;
	overflow: hidden;
}

.video_container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.services_aside {padding-left: 40px;}

/* Contact Form */


.contact_form {position:relative;}

.contact_form h1 { width:auto; }
.contact_form h1, .contact_form h2, .contact_form h3, .contact_form h4, .contact_form h5, .contact_form h6, .contact_form p { color:#98C11D; text-align:center; color:#98C11D; }


::-webkit-input-placeholder { color:#fff; }
::-moz-placeholder { color:#fff; }
:-ms-input-placeholder { color:#fff; }
:-moz-placeholder { color:#fff; }


input::-webkit-input-placeholder,input[type=password]::-webkit-input-placeholder,input[type=search]::-webkit-input-placeholder,input[type=text]::-webkit-input-placeholder,input[type=url]::-webkit-input-placeholder,textarea::-webkit-input-placeholder {
 color:#ffffff;
}
input:-ms-input-placeholder,input[type=password]:-ms-input-placeholder,input[type=search]:-ms-input-placeholder,input[type=text]:-ms-input-placeholder,input[type=url]:-ms-input-placeholder,textarea:-ms-input-placeholder {
 color:#ffffff;
}
input::-moz-placeholder,input[type=password]::-moz-placeholder,input[type=search]::-moz-placeholder,input[type=text]::-moz-placeholder,input[type=url]::-moz-placeholder,textarea::-moz-placeholder {
 color:#ffffff;
}
input::placeholder,input[type=password]::placeholder,input[type=search]::placeholder,input[type=text]::placeholder,input[type=url]::placeholder,textarea::placeholder {
 color:#ffffff;
}

input {-webkit-appearance: none; box-shadow: none !important; }
:-webkit-autofill { color: #fff !important; }

textarea:focus, input:focus{
    outline: none; border-top: 0px !important; border-left: 0px !important; border-right: 0px !important; color: #fff !important; box-shadow: none !important; border-bottom: 2px solid #fff !important;
}

form input, form textarea {
    width: 100%;
    height: auto;
    font-size: 16px;
    line-height:20px;
    padding: 10px 15px;
    color: #ffffff;
    letter-spacing: 1px;
    background-color: transparent;
    border: 0px solid;
    border: 1px solid #FFF !important;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}


form textarea {
  height: 175px;
  }

  form input:focus,
form textarea:focus {
  border:1px solid #fff !important;
  color:#fff; outline:0px;}

form .submit {
    width: 90px;
    height: 90px;
    margin: 0 auto;
    position: relative;
    display: block;
    font-size: 16px;
    letter-spacing: 1px;
    background: none;
    border-radius: 45px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #FFF;
    /* border: 2px solid #fff; */
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;}

form .submit:hover { cursor:pointer; }

form .required {
  color:#999;}

.wpcf7-form {margin-left: 0px;}
input[type="submit"] {
    width: auto;
    height: auto;
    line-height1.1em;
    font-weight:500;
    padding:3px 20px;
    color: #fff;
    letter-spacing: 1px;
    background: transparent;
    border: 1px solid #fff;
    margin: 0px;
    padding: 10px 15px;
    text-align: left;
    min-width: 100px;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

.submit-send {padding:0px;display:block;margin: -30px 0px 15px;}

.submit-send:hover:after {
	content: '\25B7 \25B7 \25B7';
	top: 0px;
	left: -50px;
	position: relative;
	font-size: 20px;
	letter-spacing: 0px;
	padding-left: 5px;
	color: #fff !important;
	pointer-events: none;
	-webkit-animation: triangleAni 1s linear 0s infinite;
	-moz-animation: triangleAni 1s linear 0s infinite;
	-ms-animation: triangleAni 1s linear 0s infinite;
	animation: triangleAni 1s linear 0s infinite;
}

.submit-send:after {
	content: '\25B7 \25B7 \25B7';
	top: 0px;
	left: -50px;
	position: relative;
	font-size: 20px;
	letter-spacing: 0px;
	padding-left: 5px;
	color: #fff !important;
	pointer-events: none;
}


input[type="submit"]:visited {
    background: transparent;
    color:#fff;
    border:1px solid #fff;
}

input[type="submit"]:hover {
    background: transparent;
    color:#fff;
    border:1px solid #fff;
}

/* selected link */
input[type="submit"]:active {
    background: transparent;
    color:#fff;
    border:1px solid #fff;
    outline:0px;
}

div.wpcf7-mail-sent-ok {
    border: 0px solid #398f14;
}

@-webkit-keyframes autofill {
    to {
        color: #fff;
        background: transparent;
    }
}

input:-webkit-autofill {
    -webkit-animation-name: autofill;
    -webkit-animation-fill-mode: both;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

span.wpcf7-not-valid-tip, div.wpcf7-validation-errors {
    color: #ccc !important;
    display: block;
    padding: 0px 15px 5px !important;
    margin: 0px 0px 5px !important;
    border:0px !important;
}

div.wpcf7-mail-sent-ok {
    border: 0px solid #398f14 !important;
}
/* Button */


.button {color: #fff; border: 1.5px solid #C6A149; background-color: #C6A149;padding: 15px 15px;margin: 10px auto;font-weight: bold;font-size: 16px;cursor: pointer;text-transform: uppercase;position: relative;display: inline-block;}

.button:hover {
   border: 1.5px solid #C6A149;
   color: #C6A149;
   background-color: #fff;
   text-decoration: none;
}


.button:active{
   text-decoration: none;
}


.blog-post-meta {display:none;}


/* Services */



.director {
    width: 100%;
    display: block;
    position: relative;
    margin-top: 0px;
}
.director_img {
    width: 100%;
    position: relative;
}
.director_img img {
    max-width: 130px;
    margin-bottom: 10px;
}
.director p {position: absolute;left: 65px;bottom: 0px;z-index: 2;background: rgba(0,0,0,0.8);padding: 3px;color: #fff;}

.director_txt {}

.services_list {}
.services_list .title {margin-top: 50px;margin-bottom: 40px;}

.services_list h2 {text-align: left;}
.services_list ul {list-style-type:none;padding:0px;text-transform:uppercase;font-size:14px;text-align: left;color:#000;}
.services_list ul li a:hover {border:0px; text-decoration:none;}
.services_list ul li {
    margin-bottom: 5px;
    line-height: 1.4em;
}
.services_list ul li:hover:before {content:'\25B7'; position:absolute; font-size:15px;margin-left:-18px;}


.menu-services-1-container {width:45%;float:left;margin-left: 5%;}
.menu-services-2-container { width:45%; float:left; margin-left:5%;}

.menu-services-1-container ul li, .menu-services-2-container ul li { padding:3px 0px;}


.left-align, .left-align h2, .left-align ul  {text-align:left !important;}
.left-align ul li {}
.left-align ul li:hover:after {content:none !important;}
.left-align ul li:hover:before {content:'\25B7'; position:absolute; font-size:15px;}

.key-list, .key-list h2, .key-list ul{text-align:left !important; list-style-type:disc;}
.key-list ul li{margin-bottom:10px; padding-left:5px;}
.key-list ul li {
    padding-left: 0px !important;
    margin-left: 15px;
}
.key-list ul li:hover:after {content:none !important;}
.key-list ul li:hover:before {content:none !important; position:absolute; font-size:15px;left:-18px;}


.about {
    width: 100%;
    display: block;
    position: relative;
    margin-top: -0px;
    margin-bottom:30px;
}
.about_img img {
    width: 100%;
    max-width:300px;
    position: relative;
}


.service_cont {border-left:1px dotted #333;padding: 0px 30px;left: 0px;}
.service_caption {padding-left:25px;max-width: 300px;}
.service_caption:before {content:'\25B2'; position:absolute; font-size:15px;margin-left:-25px;}
.service_img {
    width: 100%;
    position: relative;
}
.service_img img {
    width: 100%;
    max-width:300px;
    position: relative;
    margin-top: -55px;
}

.services-left .service_img {
    width: 100%;
    position: relative;
    display:none;
}
.services-left p { display:none;}

/* Projects*/

.projects_list {
    top: calc(50% - 60px);
    position: absolute;
    left: 50%;
    width: 100%;
    padding: 0px 15px;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    /* transform: translate(-50%,-50%); */
}
.projects_list h2 {text-align:center;margin: 0px;position: relative;width: auto;}
.projects_list h2:first-of-type {font-style:italic; color:#ccc;}
.projects_list h2 a {color:#555;}
.projects_list h2 a:after {border-bottom:1px solid #555;position: absolute;width: 100%;height: 10px;display: block;}
.project_container {z-index:2;max-width:none;position:relative;left: 3%;border: 0px;pointer-events: none;}
.project_cont {background: rgba(255,255,255,0.9);padding: 50px 30px;pointer-events:all;min-width: 360px;/* width: 200px; */}
.caption-box { background:rgba(0,0,0,0.8); padding:30px; pointer-events:all; bottom: 0px; position:absolute; color:#fff;width:100%;}
.projects_list h4 {text-align:center;margin: 10px auto;position: relative;width: auto;max-width:400px;text-transform: none;}



/* Contact Box */

#contact-box {}
.contact-box {    display: none;
    z-index: 9999;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-color: #000;}
.contact-box p, .contact-box h1, .contact-box h2, .contact-box h3, .contact-box h4, .contact-box h5, .contact-box ul li, .contact-box a, .contact-box div  { color:#fff !important;}

.contact-box .container {
    overflow: hidden !important;
    position: relative;
    width: 100%;
    max-width: 1100px;
    /* padding: 20px 0px; */
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);

    /* background: #000; */
}
.contact-box h2 {font-size: 50px;font-style: inherit;color:#ccc;margin-bottom: 55px;}



.contact_menu {margin-bottom: 15px;display: inline-block;min-height: 150px;height: auto;}

#logo-contact {
    width: auto;
    max-width: 290px;
    margin-bottom: 20px;
}

.contact_text {
    margin: 30px 0px 40px;
}

.contact_text p { font-size: 18px;}

.half {
    width: 50%;
    float: left;
}

.half a:link{}
.half a:visited { text-decoration:underline;}
.half a:hover { text-decoration:underline;}
.half a:active { text-decoration:underline;}


.half h5 {font-family:'Quicksand', serif; font-size:18px; letter-spacing:1px;}
.half ul {list-style-type:none;padding: 10px 20px;}

.fadein {display: block;
-webkit-animation: fadeIn .2s linear 0s 1 forwards;
-moz-animation: fadeIn .2s linear 0s 1 forwards;
-ms-animation: fadeIn .2s linear 0s 1 forwards;
animation: fadeIn .2s linear 0s 1 forwards;
}

.navigation {
}
.navigation span {}
.navigation span a {}
.navigation .prev {}
.navigation .next {}

.navigation .next:after {content:'\25B7 \25B7 \25B7'; top: 0px;position: relative; font-size:20px; letter-spacing:0px; padding-left: 5px;}
.navigation .next:hover:after { -webkit-animation: triangleAni 1s linear 0s infinite;
-moz-animation: triangleAni 1s linear 0s infinite;
-ms-animation: triangleAni 1s linear 0s infinite;
animation: triangleAni 1s linear 0s infinite;}

.navigation .prev:before {content:'\25C1'; top: 0px;position: relative; font-size:20px; letter-spacing:0px; padding-left: 5px;}
.navigation .prev:hover:before {content:'\25C0';}
.navigation a:link, .navigation a:visited, .navigation a:hover, .navigation a:active  {border:0px;}





.readmore:after {content:'\25B7 \25B7 \25B7'; top: -3px;position: relative; font-size:20px; letter-spacing:0px; padding-left: 5px;}
.readmore:hover:after { -webkit-animation: triangleAni 1s linear 0s infinite;
-moz-animation: triangleAni 1s linear 0s infinite;
-ms-animation: triangleAni 1s linear 0s infinite;
animation: triangleAni 1s linear 0s infinite;}

	
	
	
		
	
	
	
/* Responsive */

@media only screen and (min-width: 1500px)  {

.director_col {width: 34%;}
.commercial_col { width:32%}
.services_col { width:33%}

.project_first {background: #fcfcfc;pointer-events:all;width: calc(30% - 40px);top: 50%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);position: absolute;height: calc(100% - 120px);}
.project_second {
    pointer-events: all;
    width: 40px;
    height: calc(100vh - 120px);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    left: calc(30% - 40px);
}
.project_second .top {
    top: 0;
    width: 0;
    height: 0;
    border-bottom: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_second .middle {
    width: 100%;
    height: calc(100% - 120px);
    background: #e9e9e9;
}
.project_second .bottom {
    bottom: 0;
    top: 0;
    width: 0;
    height: 0;
    border-top: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_three {width: 70%!important;background: #fcfcfc;}
.project-summary {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    padding: 50px;
}

}


@media (max-width:1499px) and (min-width:1200px) {

.project_first {background: #fcfcfc;padding: 50px 20px 50px 40px;pointer-events:all;width: calc(40% - 40px);top: 50%;-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);position: absolute;height: calc(100% - 120px);}
.project_second {
    pointer-events: all;
    width: 40px;
    height: calc(100vh - 120px);
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    left: calc(40% - 40px);

}
.project_second .top {
    top: 0;
    width: 0;
    height: 0;
    border-bottom: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_second .middle {
    width: 100%;
    height: calc(100% - 120px);
    background: #e9e9e9;
}
.project_second .bottom {
    bottom: 0;
    top: 0;
    width: 0;
    height: 0;
    border-top: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_three {width: 60%!important;background: #fcfcfc;}
.project-summary {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    padding: 15px;
}

}



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


	.project_first {background: rgba(255,255,255,0.8);padding: 20px;pointer-events:all;width: auto;top: initial;transform: none;position: absolute;z-index: 9999;height: auto;margin: 50px;}
.project_second {display: none;}
.project_second .top {
    top: 0;
    width: 0;
    height: 0;
    border-bottom: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_second .middle {
    width: 100%;
    height: calc(100% - 120px);
    background: #e9e9e9;
}
.project_second .bottom {
    bottom: 0;
    top: 0;
    width: 0;
    height: 0;
    border-top: 60px solid #e9e9e9;
    border-left: 40px solid transparent;
}
.project_three {}
.project-summary {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    /* padding: 15px; */
}

.project-summary {width:auto;position: relative;-webkit-transform: none;-moz-transform: none;-ms-transform: none;transform: none;}


nav {  position: relative;}


.left_bar {width: 60px;background: #f5f5f5;}
.right_bar {display:none}
	
	.wrapper {
    position: absolute;
    width: calc(100% - 60px);
    height: calc(100vh - 60px);
    top: 60px;
    right: 0px;
    z-index: 2;
}
.menuicon {top:20%;}
.container {
    position: relative;
    width: 100%;
    max-width: 1100px;
    padding: 70px 40px 70px;
    top: 0%;
    -webkit-transform: none;
    -moz-transform:  none;
    -ms-transform:  none;
    transform:  none;
    height: auto;
    max-height: none;
    min-height: 300px;
    /* overflow-y: inherit; */
}

.project_container { left: 0%;}
.project_cont {background:rgba(255,255,255,0.6);padding:20px;pointer-events:all;min-width: 0px;}
.project-summary h2 {margin-bottom:6px}
.project-summary p {display:none;}


.contact-box  {position:fixed;z-index:9999;top: 0px;height: 100vh !important;}

.contact-box .container {
    overflow: hidden;
    overflow-y: scroll !important;
    position: fixed;
    width: auto;
    height:100vh;
    max-width: 1100px;
    padding: 90px;
    top: 0%;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    transform: none;
    /* background: #000; */
}


.contact-box h2 {
    margin-top: 55px;
    margin-bottom: 10px;
}
.social_mob {position: absolute;bottom: 10%;top:initial;left: 50%;transform: translate(-50%,-30px);display:block;}

.menu-services-2-container {margin-bottom:60px;}
.director {/* width:300px; */float:left;margin-bottom: 30px;}
.director p {  left: 85px;}

.title, .title2 {
    margin: 70px 0px 20px;
}

.about_img {}

.services_list h2 {margin:40px 0px;}
.services_list h2 {text-align:left;}
.services_list ul {text-align: left;}
.services_list ul li a:hover {border:0px; text-decoration:none;}
.services_list ul li {padding-left:15px;}
.services_list ul li:hover:after {content:none;}
.services_list ul li:hover:before {content:'\25B7'; position:absolute; font-size:15px;margin-left:-15px;}

.service_cont {border-left: 0px dotted #333;
    padding-left: 90px;
    left: -30px;}
    
.services-left .service_img { display:block;}
.services-left .service_img img {
    margin-top: 0px;
}
.services-left p { display:block;}

.service_img { display:none;}
.service_caption { display:none;}


.left-align ul li {padding-left:3px}
.left-align ul li:hover:before {left:0px;}



.key-list {margin:50px 0px 70px}

.caption-box {
    background: rgba(0,0,0,0.4);
    padding: 20px;
    bottom: 60px;
    width: 100%;
}

footer {display: none;}
.footer_mob {display: inline-block;}

}


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

.menu-services-1-container {width:100%;float:left;margin-left: 0px;}
.menu-services-2-container { width:100%; float:left; margin-left:0px;}


nav {width: calc(100% - 40px);left: 40px;}
.left_bar {
    width: 40px;
}	
		.wrapper {
    width: calc(100% - 40px);
    height: calc(100vh - 80px);
}
	
.contact-box .container { padding: 50px;}

.menu-main-menu-container {min-width: 420px;}
nav ul li {margin: 17px 7px;font-size: 16px;}


.menuicon {width:40px;height: 40px; top:20%;}

.menucon {
	width: 20px;
	height: 20px;
	margin: 6.4px 9px;
}
.menucon span {top: 12px;}
.menucon span, .menucon span:before, .menucon span:after {
	width: 20px;
	height: 4px;
}
.menucon span:before {margin-top: -8px;}
.menucon span:after {margin-top: 8px;}
.popcrossed span:before {  margin-top: 0px;}
.popcrossed span:after {  margin-top: 0px;}


h2 {font-size:30px;}

.service_cont {
    border-left: 0px dotted #333;
    padding-left: 10px;
    left: 0px;
}

.project_first { margin: 20px;}

}


@media only screen and (max-width: 514px)  {
	h1 {font-size:24px;}
h2 {font-size:22px;}	
.contact_text p { font-size: 15px;}
#logo-contact {  max-width: 200px;}
.half h5 { font-size: 17px; margin-bottom:0px;}
#note, #note a { font-size: 15px; }


.navigation {
    font-size: 14px !important;
}
.menu-main-menu-container {min-width: 366px;}
nav ul li {margin: 17px 6px;font-size: 14px;}
.half { width: 100%; float: left; margin-bottom:20px;}	
.half:last-of-type { margin-bottom:40px;}	
.contact-box h2 {font-size:36px;}
h2 {font-size:24px;}
.contact-box .container { padding: 40px;}
.footer_mob p {font-size:11px; margin-bottom:20px;}

	
.navigation .prev:before, .submit-send:hover:after, .submit-send:after, .title:after, .readmore:after, .navigation .next:after { font-size: 13px;}
	
	
}

@media only screen and (max-width: 414px)  {
	nav {}
.menu-main-menu-container {min-width: 260px;}
nav ul li {margin: 17px 6px;font-size: 15px;}	
nav ul li:first-of-type {display:none;}
nav ul li:last-of-type {display:none;}

}




@media only screen and (max-height: 460px)  {.social_mob {display:none;}

.projects_list {
    display: inline-block;
    position: relative;
    top: initial;
    left: initial;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    transform: none;
}

.logo {
    position: relative;
    top: initial;
    left: initial;
    margin:0 auto;
    display:block;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    transform: none;
}

.wrapper {
    width: calc(100% - 40px);
    height: auto;
    margin: 30px 0px;
}

.footer_mob {
    width: 100%;
    height: 60px;
    position: relative !important;
    padding-top: 10px;
    border-top: 1px solid #ccc;
    bottom: 0;
    margin-top: 50px;
}

#contact-box { margin:0px}

}





/* Animation */

@-ms-keyframes fadeOut { 0% {opacity:1; display:block;} 99% {opacity:0; display:block;} 100% {opacity:0; display:none;} }
@-moz-keyframes fadeOut { 0% {opacity:1; display:block;} 99% {opacity:0; display:block;} 100% {opacity:0; display:none;} }
@-webkit-keyframes fadeOut { 0% {opacity:1; display:block;} 99% {opacity:0; display:block;} 100% {opacity:0; display:none;} }
@keyframes fadeOut { 0% {opacity:1; display:block;} 99% {opacity:0; display:block;} 100% {opacity:0; display:none;} }

@-ms-keyframes fadeIn { 0% {opacity:0; display:none;} 1% {opacity:0; display:block;} 100% {opacity:1; display:block;} }
@-moz-keyframes fadeIn { 0% {opacity:0; display:none;} 1% {opacity:0; display:block;} 100% {opacity:1; display:block;} }
@-webkit-keyframes fadeIn { 0% {opacity:0; display:none;} 1% {opacity:0; display:block;} 100% {opacity:1; display:block;} }
@keyframes fadeIn { 0% {opacity:0; display:none;} 1% {opacity:0; display:block;} 100% {opacity:1; display:block;} }

@-ms-keyframes triangleAni { 0% {content:'\25B7 \25B7 \25B7';} 25% {content:'\25B6 \25B7 \25B7';} 50% {content:'\25B6 \25B6 \25B7';} 75% {content:'\25B6 \25B6 \25B6';} 100% {content:'\25B7 \25B7 \25B7';} }
@-moz-keyframes triangleAni { 0% {content:'\25B7 \25B7 \25B7';} 25% {content:'\25B6 \25B7 \25B7';} 50% {content:'\25B6 \25B6 \25B7';} 75% {content:'\25B6 \25B6 \25B6';} 100% {content:'\25B7 \25B7 \25B7';} }
@-webkit-keyframes triangleAni { 0% {content:'\25B7 \25B7 \25B7';} 25% {content:'\25B6 \25B7 \25B7';} 50% {content:'\25B6 \25B6 \25B7';} 75% {content:'\25B6 \25B6 \25B6';} 100% {content:'\25B7 \25B7 \25B7';} }
@keyframes triangleAni { 0% {content:'\25B7 \25B7 \25B7';} 25% {content:'\25B6 \25B7 \25B7';} 50% {content:'\25B6 \25B6 \25B7';} 75% {content:'\25B6 \25B6 \25B6';} 100% {content:'\25B7 \25B7 \25B7';} }


/*  End */