@charset "UTF-8";
/* CSS Document */
*{margin:0px; padding:0px;}
html{font-family:'Montserrat', sans-serif; height:100%;}
body{margin:0; overflow-x:hidden; background:url(../img/treeBg.jpg) no-repeat top right #ebece7; height:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}
audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}
audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}
a{background:transparent; text-decoration:none;}a:active,a:hover{outline:0;}
/* Arrow Animation starts */
#dwnArw{background:url(../img/arrow.png) no-repeat center center; width:58px; height:20px; position:relative; margin:0 auto;padding-top:20px;}
/* Arrow Animation ends */
header{padding: 2.5% 2.5% 0 2.5%; clear:both;}
header #menu{position:absolute; border-bottom: 1px solid red; padding-right:140px; top:110px; right:0px; z-index: 100;}
header #menu p {color: #515151;font-size: 14px;font-weight: 400;letter-spacing: 1px;margin: 0 5px 0 0;text-transform: uppercase;top: 4px;cursor: pointer;}
.pgRow{width:100%; margin:0 auto; clear:both;}
.mainContainer{width:90%; padding:0 2.5%; margin:0 auto;}
#mainNavigtion{width:100%; font-family:'Montserrat', sans-serif; color:#ffffff; text-align:center; font-weight:400;}
#mainNavigtion ul li a{display:block; width:100%; color:#ffffff; font-size:38px;padding: 7px 0;}
#mainNavigtion ul li a:hover{display:block; width:100%; color:#ffffff; font-size:38px; background-color:#e24f28; clear:both;}
#navLinks{padding:60px 0px; margin:0px;}
#mask h1 {font-size: 4.7rem;line-height: 80px;color: #959494;font-weight: 700;margin: 0 0 20px;text-transform: uppercase;}
.otherDetails h3{color:#000000; font-size:12px; text-transform:uppercase;}
.otherDetails p{font-size:16px;}
.projLinkPos {bottom: 0;min-height: 170px;position: absolute;width: 100%;}
#closeBtn {cursor: pointer;position: absolute;right: 20px;top: 20px;}
.left{float:left;}
.right{float:right;}
.floatClearer{clear:both;}
.vertical_center{display: block;height: 100%;vertical-align: middle;}
body .centered {display: inline-block;vertical-align: middle;width: 90%;}
#home {height: 100%;opacity: 0;position: relative;text-align: center; padding-top: 60px;}
#home.up {height: 62%;}
#home .centered {width: 100%;}
#home p {color: #949494;font-size: 1.429rem;font-weight: 400;letter-spacing: 2px;text-transform: uppercase;}
#home #mask {background-repeat: no-repeat;
background-size: cover;height: 100%;width: 100%;color: #61504d;
-webkit-text-fill-color: transparent;background:-webkit-linear-gradient(transparent, transparent), url(../img/textMask.jpg) repeat;background: -o-linear-gradient(transparent, transparent);-webkit-background-clip: text;}
.row {margin: 0 auto;width: 100%;}
#projHomeBg{background:url(../img/projBg.jpg) no-repeat center center;}
.progImgGradient{background-image: linear-gradient(#ebece7 0%, rgba(235, 236, 231, 0) 64%);width:100%;height: 170px;}
.pgTitle{font-size:2.25rem; color:#949494; text-transform:uppercase; letter-spacing:4px;}
.pageTabs{text-align:center; font-size:1rem; height:20px; text-transform: uppercase; color:#949494; letter-spacing:2px; margin:30px 0px;}
.pageTabs a:link, .pageTabs a:visited{padding:8px 20px; text-decoration:none; color:#949494; border:1px solid #9c3f14; margin-left:-1px;}
.pageTabs a:hover{text-decoration:none; color:#e96e24; cursor:pointer;}
.pageTabsActive{text-decoration:none; color:#e96e24;}
#tabs ul {display: inline-block;}
#tabs li {float: left;list-style:none;}
#tabs li a {display:block; text-decoration:none; outline:none; color:#e96e24;}
#tabs li a.inactive{outline:none; text-decoration:none; color:#949494;}
#tabs li a:hover, #tabs li a.inactive:hover {outline:none; text-decoration:none; color:#e96e24;}
#proj1, #proj2, #proj3{cursor: pointer;}
.tabSeperator{padding:0px 35px;}
.container{font-size:0.75rem; text-transform:none; color: #949494;letter-spacing: 1px; line-height: 32px;}
.container h3{color:#e96e24; text-transform:uppercase; font-weight:400;}
.container h5{margin:-5px 0px; text-transform:uppercase; font-weight:400;}
.container h4{font-weight:400; font-size:0.875rem; margin:-15px 0px 5px 0px;}
.subtitle{font-size:1.25rem; color:#949494; font-weight:400;}
.navGroup{position:absolute; right:2%; top:4%; z-index: 1003}
.projOlayImg{width:50%; background-color:#e96e24; float:left; text-align: right; height: 100%;}
.projOlayDtlsBox{width:50%; background-color:#ebece7; height:100%; float:right;}
.projOlayDtls{position:relative;left:10%; top:25%;}
.projOlayImg img{position:relative; right:10%; top:25%;}
.projTn{float:left;}
.areaTag{background:url(../img/sqftTag.jpg) no-repeat;color: #e96e24; font-size: 1.875rem; padding: 15px 0 15px 90px; margin-bottom:10%;}
.areaDesc{width:425px; font-size:0.875rem; color:#6d6d6d; line-height:26px;}
.areaDesc p{font-size:1.125rem;}
.projClose, #prev1, #nxt1, #prev2, #nxt2{cursor:pointer;}
.ovrClr{color:#e96e24;}
.fsize20{font-size:1.5rem; font-weight:400;}
.projList{display: inline-flex;}
.imgRightPad{margin-right:20px;}
.capLetters{text-transform:uppercase;}
a:link, a:visited{color: #6d6d6d;text-decoration: none;}
a:hover{color: #e96e24;text-decoration: none;}
.otherDetails a:link, .otherDetails a:visited{color: #ffffff; text-decoration: none;}
.otherDetails a:hover{color: #ffffff; text-decoration: underline;}
@media only screen and (max-width: 1024px) {
	.pgRow{width:100%;}
	.projOlayImg img{height: auto;width: 75%;}
}
@media only screen and (max-width: 960px) {
	header{margin-bottom: 4%;}
	.areaDesc{width: 395px;font-size: 0.75rem;}
	.areaDesc p {font-size: 1rem;}
	.fsize20{font-size: 1.25rem;}
	#mask h1{font-size: 4.3rem;line-height: 80px;margin: 0 0 10px;}
	#home{padding-top: 60px;}
}
@media only screen and (max-width: 854px) {
	body{background-size: 42%;}
	header{margin-bottom: 5%;}
	#proj1 img, #proj2 img, #proj3 img{width: 91%; height: auto;}
	.container h4 {font-size: 0.75rem;}
	.container h3{font-size: 0.75rem;}
	.imgRightPad{margin-right: 0;}
	#logoImg{width: 85%; height: auto;}
	.pgTitle{font-size: 2rem;}
	.subtitle{font-size: 1.125rem;}
	.areaDesc{width: 350px;}
	#mask h1{font-size: 3.8rem; line-height: 75px;}
	#home{padding-top: 65px;}
	#home p{font-size: 1.25rem;}
	.tabSeperator {padding: 0 30px;}
	.projLinkPos{position: relative;}
}
@media only screen and (max-width: 768px) {
	body{background-size: 45%;}
	header{margin-bottom: 7%;}
	#logoImg{width: 75%;}
	.projOlayDtlsBox{float: none;height: 50%;width: 100%;}
	 .projOlayImg{float: none;width: 100%; text-align: center;}
	.projOlayImg img{position: relative; width: 36%; height: auto; right: -1%; top: 1%; padding-top: 3%;}
	.areaDesc {width: 100%;}
	.projOlayDtlsBox{height: 100%}
	.projOlayDtls{left: 1%;top: 1%;padding: 4%;}
	.areaTag{margin-bottom: 1%;background-position: center;text-align: center;padding: 15px 0 15px 30px;}
	.navGroup{right: 2%; top: 2%;}
	#home{padding-top: 60px;}
	#mask h1{font-size: 3.5rem; line-height: 70px;}
	.pageTabs{font-size: 0.875rem;}
	.pgTitle{font-size: 1.875rem;}
	.progImgGradient{height: 190px;}
	.projLinkPos{position: absolute;}
	.projOlayImg{height: auto;padding-bottom: 15px;}
}
@media only screen and (max-width: 640px) {
	body{background-size: 50%;}
	header{margin-bottom: 8%;}
	#logoImg{width: 65%;}
	header #menu{top:100px;}
	.pgTitle {font-size: 1.5rem;}
	.subtitle {font-size: 0.9375rem;}
	.container h4 {font-size: 0.75rem;line-height: 12px;margin-bottom: 25px;}
	.container h3 {padding-bottom: 7px;}
	#proj1 img{margin-top: -12px;}
	.navGroup{left: 3%; width: 94%;}
	.projClose{float: left;}
	.projSlideNav {float: right; width: 68px;}
	#prev1, #prev2, #prev3 {float: left; margin-right: 5px;}
	#nxt1, #nxt2, #nxt3 {float: left;}
	.projOlayImg img{padding-top: 10%;}
	#mask h1{font-size: 2.8rem;line-height: 60px;}
	#home{padding-top: 70px;}
	#home p{font-size: 1rem;}
	.pageTabs{font-size: 0.75rem;letter-spacing: 1px;}
	.pgTitle{font-size: 1.625rem;}
	.tabSeperator {padding: 0 25px;}
	.container{font-size: 0.6875rem;line-height: 28px;}
}
@media only screen and (max-width: 480px) {
	body {background-size:60%;}
	header #menu {padding-right: 105px;top: 85px;}
	header #menu p{font-size: 0.8125rem;}
	.container h3 {font-size: 0.6875rem;}
	.container h4 {font-size: 0.625rem;margin-bottom: 25px;}
	.projOlayImg img{padding-top: 11%; width: 42%}
	#mask h1{font-size: 2.2rem;line-height: 50px;}
	#home p {font-size: 0.875rem;}
	.tabSeperator {padding: 0 12px;}
	.hideSep{display: none;}
	#tabs li.lastList{float: none;margin: 30px 0;}
}
@media only screen and (max-width: 320px) {
	#logoImg{width: 55%;}
	header #menu {padding-right: 60px;top: 65px;}
	.projList {display: block;}
	#proj1, #proj2, #proj3 {width: 50%;}
	#proj3 h4{margin-bottom: 15px;}
	.projOlayImg img{padding-top: 20%; width: 60%;}
	#mask h1{font-size: 1.4rem;line-height: 35px;}
	#home p {font-size: 0.73rem;}
	.hideSep{display: block;margin: 10px 0;}
	.thirdSep{display: none;}
	#tabs li.thirdList{float: left;margin: 10px 0;padding-left: 26px;}
	#tabs li.lastList{float: left;margin: 10px 0;}
	.projLinkPos{position: relative;}
}

