@import url('/themes/westworks/css/nav.css');
@import url('https://fonts.googleapis.com/css?family=Lato|Montserrat');
/* Globals
----------------------------------------------- */
body {
	font-family: 'Open Sans', sans-serif;
	font-size: 16px;
	font-weight: 300;
	color: #333;
	line-height: 140%;
	background: #fff;
	}

.section {
    max-width: 960px;
	}
		
.bodyContainer {
	width: 100%;
	/*
	padding-top: 65px;
	background: #fff;
	*/
	}


		
a,
a:visited {
	color: #CC1D20;
	text-decoration: none;
	}
	
a:hover {
	color: #333;
	}

.overlay {
	height: 100%;
	}
		
.section {
    position: relative;
	}
	
h1, h2, h3 {
	line-height: 1.1;
    margin-bottom: 10px;
    margin-top: 20px;
	}

h1, h2, h3, h4 {
	font-family: 'Montserrat', sans-serif;
	}
	
h1 {
	font-size: 43px;
	text-transform: uppercase;
	border-bottom: 1px solid #fff;
    padding-bottom: 20px;
	}

h4 {	
	font-family: 'Lato', sans;
	font-size: 18px;
	font-weight: 300;
	font-style: italic;
    line-height: 20px;
    margin-top: 40px;
    }

.shadow {
	text-shadow: 0 1px 5px #444;
	}
	
.titleBlock {
	color: #333;
	font-size: 29px;
	font-weight: 300;
	text-transform: uppercase;
	clear: both;
	}
	
.gemBlock {
	color: #fff;
	padding: 10px 0;
	background-image: url("/themes/westworks/structure/bg_gradient.jpg");
    background-repeat: no-repeat;
    background-size: 100% auto;
	}

.gemBlue,
.gemRed {
	padding: 10px 0;
	position: relative;
	}
		
.gemBlue {
	background: blue;
	}
	
.gemRed {
	background: red;
	}
	
.gemBlue .overlay,
.gemRed .overlay {
	background: url('/themes/westworks/structure/bg_gradient_g.jpg');
	opacity: 0.5;
	}
	

	
.titleRight {
	text-align: right;
	}
	
.titleLeft {
	text-align: left;
	}
	
.titleCenter {
	text-align: center;
	}
	
.titleLight,
.titleFocus {   
	line-height: 110%;
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
   }
   
.titleLight {
	font-size: 27px;
	font-weight: 300;
	}
	 
.titleFocus {
	font-size: 29px;
	font-weight: 600;
	}

.textLight {
	font-size: 23px;
	font-weight: 300;
	}
		
.bgfff {
	background: #fff;
	}
	
.bgeee {
	background: #eee;
	}
	
.bgfff90 {
	background: rgba(255,255,255,0.9);
	}
	
.bgf7 {
	background: #f7f7f7;
	}
	
.content {
	margin: 5% 0;
	position: relative;
	z-index: 1;
	}
	
.titleBlock .content {
	margin: 1% 0;
	}
	
.fixBG {
	position: fixed;
	top: 0;
	z-index: -1;
	}

input.button,	
a.button {
	background-color: #CC1D20;
    border-radius: 5px;
    color: #ffffff;
    font-size: 14px;
    font-weight: bold;
	}
	
input.button:hover,
a.button:hover {
	background-color: #303030;
	}

.nullSpace {
	width: 0px;
	margin: 0 -2px;
	display: inline-block;
	vertical-align: middle;
	overflow: hidden;
	}

.pagenate {
	font-size: 15px;
	margin: 20px 0;
	}
		
.pagenate select {
	color: #fff;
	padding: 5px 10px;
	border-radius: 4px;
	background: #1A2732;
	border: none;
	}

.pageOf,
.prevNext {
	display: inline-block;
	vertical-align: middle;
	}

.pageOf {
	font-weight: 400;
	}
	
.prevNext {
	margin-left: 4px;
	float: right;
	}
	
.pager, 
.pager:visited {
    background: #1a2732;
    border-radius: 4px;
    color: #fff;
    display: inline-block;
    padding: 4px 12px;
    text-decoration: none;
    vertical-align: middle;
	}
	
.pager:hover {
	color: #fff;
	background: #CC1D20;
	}
	
.crebDisc {
	color: #1a2732;
	font-size: 13px;
	text-align: center;
	margin: 30px 0;
	padding-top: 8px;
	border-top: 1px solid #ddd;
	}
	
.sideIcon,
.iconLabel {
	display: inline-block;
	vertical-align: middle;
	}
	
.sideIcon {
	margin-right: 5px;
	}
	
.heavy {
	font-weight: 600;
	}

.rowWrap,	
.row {
	float: left;
	}
		
.rowWrap {
	width: 100%;
	}
	
.row {	
	width: 100%;
	clear: both;
	}
	
.hide {
	display: none;
	}
	
.iconLink {
	margin-right: 8px;
	display: inline-block;
	vertical-align: middle;
	}
	
.center {
	text-align: center;
	}
	
.headSpacer {
	}
	
.highlight {
	color: #CC1D20;
	font-weight: 600;
	}

.contactDeets {
	margin: 25px 0;
	}
		
.contactDeets .hc_title {	
	color: #CC1D20;
	font-weight: 600;
	text-transform: uppercase;
	}
	
.contactDeets .ireal_title {
	font-weight: 400;
	text-decoration: underline;
	}
	
.cDeet {	
	font-weight: 400;
	}

.bgSquare {
	top: 50%;
	margin-top: -144px;
	}
	
.squareLeft {
	left: 0;
	margin-left: -115px;
	}
	
.squareRight {
	right: 0;
	margin-right: -115px;
	}
	
.fullBG {
	width: 100%;
	height: 100%;
	position: absolute;
	}

/* CATSONE Widget Classes
----------------------------------------------- */		
#catsone-job-listings {
	margin: 20px 0;
	}
	
.catsone-job-listings-job {
	margin-bottom: 10px;
	}

a.catsone-job-listings-title,
a.catsone-job-listings-title:visited {
	color: #2B4BE4 !important;
	display: block;
	position: relative;
	padding-left: 1em;
	}
	
a.catsone-job-listings-title:hover {
	color: #CC1D20 !important;
	}
	
a.catsone-job-listings-title:hover::after {
	background: #CC1D20;
	}
		
a.catsone-job-listings-title::after {
      content: '';
      height: .4em;
      width: .4em;
      background: #2B4BE4;
      display: block;
      position: absolute;
      transform: rotate(45deg);
      top: 50%;
      left: 0;
      margin-top: -0.2em;
      }
      
.catsone-job-listings-location {
	display: block;
	padding-left: 1em;
	}

/* iframe Classes
----------------------------------------------- */	
.intrRatio video, 
.intrRatioNorm video {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
	}	
	
.intrinsic {
	position: relative;
	height: 0;
	overflow: hidden;
	}

/* 16x9 Aspect Ratio */
.intrinsic-16x9 {
	padding-bottom: 56.25%;
	}
 
/* 4x3 Aspect Ratio */
.intrinsic-4x3 {
	padding-bottom: 75%;
	}	
	
/* Custom Aspect Ratio */
.intrinsic-custom {
	padding-bottom: 80%;
	}	

.intrinsic iframe {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	}
	
iframe body {
	background: red;
	}
	
/* Home Classes
----------------------------------------------- */	
a.button.sectionButton {
	display: block;
	margin: 20px auto 0 auto;
	}

.gradSection .content {
    color: #333;
    padding: 2%;
    margin: 5% 0;
	}	

.gradSection .content h1 {
    border-bottom: 1px solid #333;
    font-size: 23px;
    font-weight: 300;
    padding-bottom: 5px;
	}
	
/* Form Classes
----------------------------------------------- */
	.middle_name {
		height: 1px;
		width: 1px;
		opacity: 0;
		}
		
	table.ui-datepicker-calendar {
		width: 100% !important;
		}
		
	.formFlyout ol.form {
		padding: 0;
		margin: 20px;
		}

		
	.formAlert {
		font-size: 11px;
		font-weight: bold;
		color: red;
		padding: 10px 4px;
		}
	
	#scrollTo,
	#thanks {
	width: 322px;
	height: 100%;
	color: #fff;
	text-align: right;
	padding: 0;
	position: fixed;
	top: 0;
	right: -322px;
	z-index: 99;
	overflow: auto;
	background: rgba(50,50,57,0.95);
	overflow: auto;	
		}
		
	.formFlyout .form,
	.thnx {
		margin: 64px 20px 20px 20px !important;
		border-top: 1px solid #444;
		}
		
	.thnx,
	.thnx h2 {
		color: #fff;
		text-align: left;
		}
	
	.formFlyout .form ul,
	.formFlyout .form ol {
		list-style: none;
		}
		
	.formFlyout .form li {
		margin: 7px 0;
		list-style: none;
		}
	
	.formFlyout	ul.error {
		padding: 0;
		margin: 0;
		list-style: none;
		}
			
	.formFlyout	ul.error li {
		font-size: 13px;
		color: red;
		text-align: left;
		margin: 0;
		list-style: none;
		}
		
	.formFlyout label {
		font-size: 13px;
		text-align: left;
		line-height: 120%;
		color: #fff;
		display: block;
		padding: 7px 0;
		}
		
	.formFlyout .PhoneInput .optionGroup,
	.formFlyout .PhoneInput input {
		width: 77px;
		color: #fff;
		}
		
	.formFlyout ol.form li.PasswordInput input, 
	.formFlyout ol.form li.TextInput input, 
	.formFlyout ol.form li.TextareaInput textarea {
		width: 280px;
		}

	.formFlyout ol.form li.PasswordInput input, 
	.formFlyout ol.form li.TextInput input, 
	.formFlyout ol.form li.TextareaInput textarea		
	.formFlyout .PhoneInput input {
		border: none;
		padding: 5px;
		}
		
	.formFlyout .submit input,
	.formFlyout .submit a {
		display: block;
		margin: 0 auto;
		}
		
.formFlyout .closeTrig {
    border: 1px solid #fff;
    border-radius: 100%;
    color: #fff;
    display: inline-block;
    font-size: 18px;
    font-weight: 300;
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 15px;
    width: 30px;
    z-index: 100;
    }
    
.formFlyout .closeTrig:hover {
	transform: scale(1.1);
	}
	
.formFlyout .closeTrig:hover {
	cursor: pointer;
	}
	
.formFlyout .destination_contact_email input {
	color: #aaa;
	background: #dedede;
	}
	
.formFlyout textarea {
	resize: none;
	}
	
.formFlyout ol.form input.button {
	display: block;
	}
	
.middle_name {
	height: 0px;
	width: 0px;
	position: relative;
	z-index: -9;
	}		

/* Selling Form Classes
----------------------------------------------- */
#homeForm {
	}
	
#homeForm ul,
#homeForm ol,
#homeForm li {
	list-style: none;
	margin: 0;
	}
	
#homeForm li {
	width: 48%;
	display: inline-block;
	vertical-align: top;
	}
		
#homeForm li input {
	width: 84%;
	}
	
#homeForm label,
#homeForm input {
	padding: 5px;
	display: block;
	}
	
#homeForm input {
	font-size: 13px;
	padding: 5px;
	border: 1px solid #000;
	}

#homeForm .RadioInput label {
	display: inline-block;
	margin: 10px 10px 10px 0;
	}
	
#homeForm .optionGroup label,	
#homeForm .optionGroup input {
	display: inline-block;
	}

#homeForm .optionGroup input {
	width: auto;
	}
	
#homeForm .TextareaInput {
	width: 98%;
	display: block;
	}

#homeForm .RadioInput,
#homeForm .TextareaInput textarea {
	width: 98%;
	padding: 5px;
	}
	
#homeForm .submit input {
	border: 0;
	padding: 0;
	margin-top: 20px;
	float: right;
	}
	

			
/* Parallax Classes
----------------------------------------------- */
.stripContainer {
	margin: 30px 0;
	}
	
.parallaxWindow {
   	min-height: 300px;
   	background: transparent;
	overflow: hidden;
	position: relative;
	}
		
.parallaxImg {
	width: 110%;
	margin-left: -5%;
	position: absolute;
	}
	
.parallaxText {
	width: 100%;
	max-width: 1120px;
	color: #fff;
	margin: 0 auto;
	position: relative;
	top: 22%;
	z-index: 1;
	}
	
.parallaxText .content {
	color: #333;
	padding: 2%;
	}
	
.parallaxText .content h1 {
	font-size: 23px;
	font-weight: 300;
	padding-bottom: 5px;
	border-bottom: 1px solid #333;
	}
		
.pViewport {
	width: 100%;
	height: 500px;
	margin-top: -75px;
	overflow: hidden;
	position: relative;
	}
		
.fw img {
	width: 100%;
	display: block;
	}
	
/* Header
----------------------------------------------- */
.header {
    width: 100%;
    height: 135px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20;
	border-bottom: 1px solid #e9e9e9;
	background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.15) 100%);
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0.15) 100%);
	background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,0.15) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#26ffffff',GradientType=1 );
	}
		
.contactBar,
.contactBar a,
.contactBar a:visited {
    background: #e8e8e8;
    color: #999;
    text-decoration: none;
	}
	
.contactBar a:hover {
	color: #CC1D20;
	}
	
.contactItem {
    display: inline-block;
    line-height: 100%;
    margin-left: 50px;
    vertical-align: top;
	}
	
.contactInfo {
    text-align: right;
	}

.logo {
	width: 96px;
	}

	
/* Footer
----------------------------------------------- */
.footer {
	min-height: 300px;
	color: #fff;
	padding-top: 30px;

	background: #009dd9;
	background: -moz-linear-gradient(left, #009dd9 0%, #6e5498 50%, #db0003 100%);
	background: -webkit-linear-gradient(left, #009dd9 0%,#6e5498 50%,#db0003 100%);
	background: linear-gradient(to right, #009dd9 0%,#6e5498 50%,#db0003 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009dd9', endColorstr='#db0003',GradientType=1 );
	overflow: hidden;
	border-top: 13px solid #fff;
	}

.footer .logo {
	width: auto;
	}
	
.footItemWrap {
	}
		
.footItem {
	display: block;
	text-align: right;
	margin-bottom: 10px;
	}
	
.footerIcon,
.footItem a {
	display: inline-block;
	vertical-align: middle;
	}

.footerIcon {
	margin-right: 10px;
	}
		
.footItem a {
	color: #fff;
	text-decoration: none;
	}
		
.copyR {
	font-size: 11px;
	text-align: right;
	margin: 10px 0;
	}

.footBadge {
    width: 125px;
    filter: invert(100%);
    }
    
.footer .logo a,
.footer .footBadge {
    display: inline-block;
    vertical-align: middle;
    }

.footer .logo a {    
    margin-right: 20px;
    }

/* Featherlight Overrides Classes
----------------------------------------------- */
.featherlight-content {
	}
	
.featherlight .featherlight-content {
	background: #002953;
	border: none;
	padding: 0;
	}

.featherlight-next, 
.featherlight-previous	{
	top: 0;
	}
	
.featherlight-previous {
	left: 0;
	right: 84%;
	}
	
.featherlight-next {
	right: 0;
	left: 84%;
	}
	
.featherlight-next:hover,
.featherlight-previous:hover {
	background: rgba(0,41,83,0.25);
	}

.featherlight .featherlight-close-icon {
	background: #7AC041; /* Set the background in case it overlaps the content */
	}
	
/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */
@media handheld, only screen and (max-width: 800px) {
/* Header Classes
----------------------------------------------- */
.header {
	height: auto !important; 
	}
	
.menuTrigger {
	right: 20px;
	}

/* Home Classes
----------------------------------------------- */
.pViewport {
	width: auto;
	padding: 0 20px;
	}

.topContentWrap {
	width: 96%;
	padding: 0 4%;
	}

/* Listings Classes
----------------------------------------------- */
#list3 {
	margin-top: 20%;
	}
		
.propItem,
.propItemsp {
	width: 47%;
	}
	
/* Footer Classes
----------------------------------------------- */
.footer .twocol {
	width: 15.32%;
	}
	
.footer .tencol {
	width: 83%;
	}

}

@media handheld, only screen and (max-width: 767px) {
/* Globals
----------------------------------------------- */
.content {
	padding: 0;
	}
	
.titleBlock {
	font-size: 21px;
	line-height: 110%;
	}
	
.titleBlock a.button {
	width: 100%;
    border-radius: 0;
    float: none;
    margin: 0;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 12;
	}
	
/* Header Classes
----------------------------------------------- */
.logo {
	width: 13%;
	}

/* Home Classes
----------------------------------------------- */	
.top .content {
	padding: 0 !important;
	}
	
.searchBox .filterInput input,
#criteria {
	font-size: 13px;
	}
	
/* Footer Classes
----------------------------------------------- */
.footer {
	text-align: center;
	}
	
.footer .twocol {
	width: 100%;
	}
	
.footer .tencol {
	width: 100%;
	}

.footer .logo img {
	margin: 0 auto;
	}	
	
.footItem,
.copyR {
	text-align: center;
	}
}

@media handheld, only screen and (max-width: 639px) {
/* Global Classes
----------------------------------------------- */	
h1 {
	font-size: 33px;
	}
	
h4 {
	font-size: 16px;
	margin-top: 10px;
	}
	
.titleLight {
	font-size: 21px;
	}
	
.titleFocus {
	font-size: 25px;
	}

.pagenate {
	text-align: center;
	}
		
.pageOf, 
.prevNext {
	display: block;
	float: none;
	}
	
.prevNext {
	margin-top: 10px;
	}

/* Home Classes
----------------------------------------------- */	
.top .content {
	padding: 0 !important;
	}
	
.top {
	
	}
	
.realtorFrame, 
.realtorBio {
	display: block;
	}

.realtorFrame {
	width: 67%;
	margin: 0 auto;
	}
	
.realtorBio {
	width: auto;
	}	
	
.resultCount,
.searchTitle {
	text-align: center;
	}
	
.resultCount {
	line-height: 110%;
	}
	
.criteriaItem {
	width: 100%;
	margin-bottom: 10px;
	}
	
.optionTitle {
	width: 40%;
	text-align: left;
	}
	
#criteria select {
	width: 50%;
	}
	
.go {
	text-align: center;
	}
	
.quadSearch {
	width: 100%;
	}
	
.doSearchQuad {
	font-size: 16px;
	}
	
.redCol {
	font-size: 13px;
	}

/* Listings Classes
----------------------------------------------- */	
.propItem, 
.propItemsp {
	width: 98%;
	}

.rSliderVals {
	font-size: 16px;
	}
		
#valueLow,
#valueHi {
	width: 45%;
	font-size: 16px;
	display: inline-block;
	vertical-align: middle;

	}
	
.searchBox .filterInput input {
	width: 90%;
	}
	
.criteriaItem {
	width: 48%;
	}
	
#criteria .optionTitle,
#criteria select {
	width: 100%;
	}
	
.go .button.doSearch {
    margin-right: 0;
	}
	
.propDeets {
	font-size: 13px;
	}
	
/* Form Classes
----------------------------------------------- */	
#homeForm li {
	width: 100%;
	}
	
.newsletter .optionGroup {
	display: block;
	}
	
.rc-anchor-normal {
	width: 250px !important;
	}
}

@media handheld, only screen and (max-width: 479px) {
.top {
    
	}
	
.bigPic .titleBlock {
	position: relative;
	margin-top: 5%;
	}
	
.bigPic .titleBlock .titleLight,
.bigPic .titleBlock .titleFocus {
	font-size: 16px
	}
	
}