@import url("https://use.typekit.net/wjs4bgw.css");
* {
	margin:0px;
	padding:0px;
	box-sizing:border-box;
	position: relative;
} 
body {
	font-family: brandon-grotesque, sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size:24px;
	color:#7a7a7a;
}
img {
	max-width:100%;
	height:auto;
}
.container {
	max-width: 1350px;
	margin:0px auto;
	padding:0px 10px;
}
ul, ol {
	list-style-position: outside;
	margin-left: 25px;
}
ul.columns {
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
}
/* HEADER */
header {
	position:fixed;
	top:0px;
	z-index:4;
	width:100%;
	background-color:#fff;
	border-bottom:1px solid #ccc;
}
#header:after {
	content:'';
	display:block;
	clear:both;
}
#header {
	padding:0px;
}
#header #logo {
	float:left;
	padding-left:10px;
}
#header #links {
    text-align: right;
	font-size:18px;
	padding:20px 10px;
}

/* ^ HEADER */
/* NAVIGATION */
header nav {
	background-color:#fff;
	text-align:center;
	float:right;
}
header #nav > ul {
	list-style:none;
	width:100%;
	display:block;
	margin:0px auto;
    font-size: 0px; /*elimiates spacing between li*/
}
header #nav ul li {
	margin-bottom:0px;
}
header #nav > ul > li {
	display:inline-block;
}
header #nav ul li a {
	text-decoration:none;
	color:#9f2843;
	text-transform:uppercase;
	display:block;
	padding:12px 20px;
	font-size:20px;
	font-weight: 400;
}
header #nav ul li:hover a {
	background-color:#9f2843;
	color:#fff;
}
header #nav > ul > li ul  {
	display:none;
	position:absolute;
    text-align:left;
	margin-left:0px;
	background-color:#dbdbdb;
}
header #nav > ul > li ul li {
	display:block;
}
header #nav > ul > li ul li a {
	padding:5px 20px;
	white-space: nowrap;
}
header #nav > ul > li > ul > li a:hover {
	background-color:#fff;
	color:#878b8c;
}
/* ^ NAVIGATION */
/* BANNERS */
#banners {
	max-height:650px;
	position:relative;
	z-index:1;
	overflow:hidden;
}
#banner-img {
	overflow:hidden;
}
#banner-img .slide > img {
	display:block;
	width:100%;
	height:auto;
}
#banner-img .slide {
	max-height:650px;
	position:absolute;
	top:0px;
	max-width:100%;
	width:100%;
	opacity:0;
	z-index:0;
}
#banner-img .slide.active {
	position:relative;
	opacity:1;
	z-index:1;
}
#banner-img .slide.active .content{
	opacity:1;
}
#banner-img .slide.getActive {
	z-index:2;
}
#banner-img .slide .content {
	position:absolute;
	top:0%;
	left:0%;
	bottom:0%;
	width:45%;
	z-index:2;
	opacity:0;
	color:#fff;
    padding:15% 8% 0 5%;
	background-color:rgba(0,0,0,.6);
	font-size:30px;
	font-weight: bold;
	text-transform: uppercase;
	clip-path: polygon(0 0,83% 0, 100% 100%, 0 100% );
}
#banner-img .slide .content .button {
	font-size:20px;
	font-weight:normal;
	margin-top:30px;
}
/* ^ BANNERS */
/* CONTENT */
#banner-header {
	max-height:670px;
	overflow:hidden;
}
#banner-header img {
	width:100%;
	display: block;
}
#banner-header .content {
	position:absolute;
	top:0%;
	right:0%;
	bottom:0%;
	width:66.5%;
	z-index:2;
	color:#fff;
    padding:15% 5% 0 10%;
	background-color:rgba(0,0,0,.6);
	font-size:23px;
	font-weight: bold;
	text-shadow: 5px 5px 5px #000;
	text-transform: uppercase;
	clip-path: polygon(0 0,100% 0, 100% 100%, 21.5% 100% );
	text-align:right;
}
#banner-header .content .line2 {
	font-size:37px;
}
#main {
	position: relative;
	z-index:2;
	padding-top:30px;
	padding-bottom:30px;
}
#main:after {
	content:'';
	display: block;
	clear:both;
}
#angle {	
	font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin-bottom:20px;
	overflow: hidden;
}
.angle-left {
	text-align:center;
	font-weight:bold;
	text-transform: uppercase;
	font-size:32px;
	float:left;
	width:40%;
	padding:30px 70px;
}
.angle-right {
	font-weight:bold;
	font-style: italic;
	font-size:20px;
	color:#fff;
	float:left;
	width:60%;
	clip-path: polygon(0 0,100% 0, 100% 100%, 3% 100% );
	background-color:#9f2843;
	padding:30px 70px;
}
#interior .angle-left {
	padding:10px;
	width:30%;
}
#interior .angle-right {
	padding:10px;
	clip-path: polygon(0 0,100% 0, 100% 100%, 1% 100% );
	width:70%;
}
.projects,
#categories {
	display:flex;
	flex-wrap:wrap;
}
#categoriess > div  {
	flex:1 1 27.7%;
	flex-shrink:1;
	text-align:center;
	margin:.3%;
	overflow:hidden;
}
#categories > div,
.projects > div  {
	width: 31%;
	text-align:center;
	margin:1%;
	overflow:hidden;
	max-height: 265px;
}

.projects > div a,
#categories > div a {
	display:block;
}
.projects > div img,
#categories > div img {
	display:block;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
	text-decoration: none;
	width:100%;
	filter: brightness(.6);
}
.projects > div:hover img,
#categories > div:hover img {
	filter: brightness(.8);
}
.projects  > div .category,
#categories > div .category {
	position:absolute;
	top:45%;
	width:100%;
	text-align: center;
	color:#fff;
	text-transform: uppercase;
	font-weight: bold;
}
.projects  > div .category {
	top:35%;
}
.left {
	float:left;
	width:70%;
	padding-right:50px;
}
.right {
	float:left;
	width:30%;
}
.equal .left {
	width: 48%;
	margin-right: 2%;
}
.equal .right {
	width: 48%;
	margin-right: 2%;
}
.grid {
	padding: 30px 0px;
}
.grid-item { 
	width:25%;
	padding:5px;
}
.grid-item img { 
	width: 100%;
	display:block;
	cursor: pointer;
}

#Property .left {
	width: 40%;
	margin: 0px;
	padding: 0px;
}
#Property .right {
	width: 60%;
}
#Property .catTitle {
	background: #878b8c;
	color: #fff;
	text-transform: uppercase;
	padding: 5px 20px;
	margin-bottom: 20px;
	font-size: 22px;
}
#Property .address {
	font-weight: bold;
}
#Property .catDesc {
	padding-right: 30px;
}

#Property #Images {
	position: relative;
}
#Property .grid,
#Property .primaryImage {
	position: relative;
	min-height: 100px;
}
#Property .primaryImage img {
    position: absolute;
    width: 100%;
}
#Property .primaryImage img.vertical {
    position: absolute;
    width: 50%;
	margin: 0 25%;
}
#Property .primaryImage .arrow-left img, 
#Property .primaryImage .arrow-right img {
	width: 40px;
}
#Property .primaryImage .arrow-left {
	position: absolute;
	left: 0;
	top: 0;
	z-index:999;
	cursor: pointer;
	width: 40px;
}
#Property .primaryImage .arrow-right {
	width: 40px;
	position: absolute;
	right: 0;
	top: 0;
	z-index:999;
	cursor: pointer;
}
.primaryImage img.hidden {
	display: none;
}
.testimonial {
	border-left:1px solid #eee;
	padding:40px 0px 40px 40px;
}
.testimonial .icon {
	text-align:center;
	margin-bottom:20px;
}
.testimonial .quote {
	color:#9f2843;
	font-weight:bold;
	font-size:26px;
	margin-bottom:20px;
}
.testimonial .author {
	font-size:19px;
}
h1 {
	font-size:35px;
	color:#9f2843;
	margin-bottom:15px;
	text-transform: uppercase;
}
h2 {
	font-size:30px;
	color: #9f2843;
	margin-bottom:15px;
	text-transform: uppercase;
}
h3 {
	font-size:30px;
	color: #9f2843;
	margin-bottom:15px;
	border-bottom:1px solid #666;
	text-transform: uppercase;
	display:inline-block;
}
p {
  margin-bottom:15px;
}
strong {
	font-weight: bold;
}
ul {
    list-style-position: outside;
	margin-left: 25px;
}
a {
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
	color:#ab2722;
}
a:hover {
	color:#000;
}
a.button {
	background-color:#9f2843;
	display:inline-block;
	padding:5px 15px;
	color:#fff;
	text-decoration: none;
	text-transform:uppercase;
	border:1px solid #fff;
}
a.button:hover {
	background-color:#000;
}
.img-right {
	float:right;
	max-width:35%;
	margin-left:15px;
	margin-bottom:15px;
}
.img-left {
	float:left;
	max-width:35%;
	margin-right:15px;
	margin-bottom:15px;
}
.news-title {
	font-weight: bold;
	color:#3e3b3b;
}
.clear:after,
.row:after {
	content:'';
	display:block;
	clear:both;
	margin-bottom:20px;
}
#contact-left {
	float:left;
	width:25%;
	font-size:20px;
	padding:30px 0;
}
#contact-right {
	float:left;
	width:75%;
	clip-path: polygon(0 0,100% 0, 100% 100%, 8% 100% );
	background-color:#e5e5e5;
	padding:30px 8%;
}
.form-left {
	float:left;
	width:40%;
}
.form-right {
	float:left;
	width:60%;
	padding-left:20px;
}
input, textarea, select {
	-webkit-appearance: none;
	border-radius: 0;
    font-family:inherit;
    font-weight:inherit;
	background-color:#fff;
	padding:5px;
	width:100%;
	margin-bottom:10px;
	border:1px solid #ccc;
	font-size:18px;
	color: #333;
}
input[type="submit"], button {
	background-color:#9f2843;
	color:#fff;
    font-family:inherit;
	font-size:18px;
    font-weight:inherit;
	text-align:center;
	text-transform: uppercase;
	width:auto;
	padding:3px 15px;
}
::placeholder {
	text-transform: uppercase;
}
/* ^ CONTENT */
/* GALLERY SLIDER */
#project-gallery {
	background-color:#e5e5e5;
	padding-top:30px;
}
#project-gallery h2 {
	display:inline-block;
	color:#3b3b3b;
}
#view-gallery {
	font-size:18px;
	text-align: center;
	background-color:#fff;
	text-transform:uppercase;
	float:right;
	z-index:3;
}
#view-gallery #project-select {
	white-space: nowrap;
}
#view-gallery #project-select span {
	padding:5px 15px;
	display:block;
	border:1px solid #3b3b3b;
}
#view-gallery:hover #project-select span {	
	border-bottom:0px;
}
#view-gallery img {
	margin-left:10px;
}
#view-gallery ul {
	list-style:none;
	background-color: #fff;
	width:100%;
	border-top:0px;
	left:0px;
	display:none;
	position: absolute;
	border:1px solid #3b3b3b;
	border-top:0px;
}
#view-gallery ul li {
	text-align:center;
}
#view-gallery ul li:hover {
	background-color:#ebebeb;
}
#view-gallery ul li a {
	display:block;
	text-decoration: none;
	color:#3b3b3b;
	padding:3px 15px;
}
#project-scroller {
	margin:0px auto;
}
.project-scroller-dir, #project-scroller-frame {
	float:left;
}
.project-scroller-dir {
	width:22px;
	text-align:center;
	cursor:pointer;
	margin-top:10%;
}
.project-scroller-dir:hover {
	opacity:1;
}
#project-scroller-frame {
	overflow:hidden;
	position:relative;
	width:100%;	
}
#project-scroller-slider {
	position:absolute;
	width:100%;
}
#project-scroller-slider .project {
	position:absolute;
	padding-left:20px;
	padding-right:20px;
	max-width:420px;
	font-size:20px;
	line-height:20px;
	color:#3e3b3b;
}
#project-gallery .project img {
	width:100%;
	display:block;
}
#project-gallery .title {
	font-weight:bold;
	text-transform: uppercase;
	margin-bottom:10px;	
}
/* ^ GALLERY SLIDER */
/* FOOTER */
#scroll-up {
	position:fixed;
	opacity:.5;
	z-index:99999999999;
	right:20px;
	bottom:30px;
	width:30px;
	height:30px;
	border-radius:50%;
	text-align:center;
	cursor:pointer;
	color:#fff;
	background-color:#000;
	display:none;
	font-size:30px;
	font-family:verdana, sans-serrif;
}
#scroll-up:hover {
	opacity:1;
}
footer {
	background-color:#535353;
}
#footer {
	color:#fff;
	padding-top:20px;
	padding-bottom:40px;
	font-size:20px;
	text-align: center;
}
#footer ul {
	float:left;
	list-style:none;
	padding-right:50px;
	white-space: nowrap;
	padding-top:20px;
}
#footer ul li:first-of-type {
	padding-bottom:15px;
	font-weight: bold;
}
#footer a {
	color:inherit;
	text-decoration:none;
}
#footer a:hover {
	color:#fff;
}
#siteby a {
    width: 84px;
    height: 39px;
    text-indent: -5000px;
    background: url("../../Assets/Images/firehorse-creative.png") top left no-repeat;
    margin:0px auto;
    display:block;
	margin-top:30px;
}
/* ^ FOOTER */
/* MOBILE */
#mobile-nav {
	display:none;
	text-transform:uppercase;
	color:#fff;
	text-align:center;
	padding:7px 10px;
	height:37px;
	width:100px;
	font-family:Arial;
	margin:0px auto;
}
#mobile-nav > div {
	width:25px;
	float:right;
}
#mobile-nav div.bar {
	height:3px;
	background-color:#fff;
	margin:3px 0px;
}
#mobile-nav span{
	float:right;
	display:block;
	padding:0px 5px;
	font-size:14px;
	line-height:22px;
}
.map-responsive{
	overflow:hidden;
	padding-bottom:56.25%;
	position:relative;
	height:0;
}
.map-responsive iframe{
	left:0;
	top:0;
	height:100%;
	width:100%;
	position:absolute;
}
@media (max-width:1200px) {
	header #nav ul li a {
		font-size: 18px;
		padding: 10px 12px;
	}
@media (max-width:1050px) {
	#header #logo {
		width: 100%;
		text-align: center;
		
	}
	header nav {
		background-color: #000;
		float:none;
		clear:both;
	}
	#mobile-nav {
		display:block;
	}
	header #nav > ul {
		display:none;
		position:absolute;
		background-color:#fff;
		padding-left:0px;
	}
	header #nav ul  li {
		display:block;
		width:100%;
		border-top:1px solid #ccc;
		text-align:left;
	}
	header #nav > ul > li ul {
		position:relative;
	}
	#banner-img .slide .content {
		font-size:24px;
		padding-top:17%;
	}
	#banner-header .content {
		padding-top:10%;
	}
	#contact-left, #contact-right {
		float:none;
		width:auto;
	}
	#Property .primaryImage {
		min-height: 400px;
	}
}
@media (max-width:750px) {
	ul.columns {
	  columns: 1;
	  -webkit-columns: 1;
	  -moz-columns: 1;
	}
	body {
		padding-top:0px !important;
	}
	header {
		position: relative;
	}
	#banners {
		display:none;
	}
	#categories > div,
	.projects > div  {
		width: 100%;
		text-align:center;
		margin:1%;
		overflow:hidden;
	}
	#Property .left,
	#Property .right,
	.equal .left,
	.equal .right,
	.left, .right {
		float:none;
		width:100%;
		padding:0px;
	}
	.right {
		margin-top:30px;
	}
	#home .angle-left, #home .angle-right {
		float:none;
		width:auto;
		padding:20px;	
		clip-path: none;
	}
	#categories {
		display:auto;
	}
	#categories > div  {
		flex:none;
		width:100%;
		margin-bottom:20px;
	}
	#banner-header .content {
		position:relative;	
		width:auto;
		padding:20px;
		background-color:rgba(0,0,0,.8);
		clip-path: none;
		text-align:center;
	}
	.testimonial {
		border-left:0;
		text-align:center;
		padding:20px;
		background-color:#eee;
	}
	#contact-right {
		clip-path: none;
	}
	.form-left, .form-right {
		float:none;
		width:auto;
		padding:0px;
	}
	#Property .primaryImage {
		min-height: 300px;
	}
}
@media (max-width:600px) {
	body {
		color: #333;
	}
	h1 {
		font-size: 28px;
	}
	h2 {
		font-size: 26px;
	}
	#Property .grid {
		min-height: 200px;
	}
	#Property .primaryImage {
		min-height: 150px;
	}
	.angle-left {
		font-size: 24px;
	}
#header #logo, #header #links {
	float:none;
	width:100%;
	text-align:center;
	padding:10px;
}
#header #links {
	display: none;
}
#view-gallery {
	float:none;
	margin-bottom:20px;
}
}