/* Master layout */

/************************************************************
Embedded fonts */

@font-face {
	font-family:DancingScript;
	src:url('../fonts/dancingscript.eot'); /* IE8- */
	src:url('../fonts/dancingscript.eot?iefix') format('embedded-opentype'), /* IE9 */
		url('../fonts/dancingscript.ttf') format('truetype'); /* The rest of the world */
}


/************************************************************
Global styles */

html {
	background:#375581;
}
body {
	color:#252525;
	border-top:1.2em solid #30517f;
	margin:0;
	padding:0;
	font:10.5pt/1.2 Arial,Helvetica,sans-serif;
	min-width:320px;
}

/* Links */
a:link,
a:visited,
a:hover,
a:active {
	color:#30517f;
	text-decoration:none;
}
a img {
	border:none;
}
a[href^="tel:"] {
	color:inherit;
	cursor:inherit;
}

/* Responsive images */
img {
	max-width:100%;
}
#results-map img,
#map-canvas img,
.map-canvas img { /* Except in Google maps */
	max-width:none;
}

/* Headings */
h1,h2 {
	font:240%/1.1 DancingScript,Arial,Helvetica,sans-serif;
	margin:0.5em 0 0.2em;
}
h3,h4,h5,h6 {
	font:105%/1.2 Arial,Helvetica,sans-serif;
	margin:0.7em 0 0.3em;
}
h3 {
	font-size:140%;
}
h4 {
	font-size:115%;
}
h3+p, h4+p {
	margin-top:0;
}

main h1,
main h2 {
	color:#375682;
}


/* Block-level */
p {
	margin:1em 0;
}
address {
	margin:1em 0;
	font-style:inherit;
}


/************************************************************
Layout: Header */

body>header {
	position:relative;
	padding:1em 1.5em 0;
	background:#3d5c8a;
	background-image:linear-gradient(to bottom, #3d5c8a, #8fb6ed);
}


/*-----------------------------------------------------------
Logo */

#logo {
	position:relative;
	display:block;
	max-width:1000px;
	margin:0 auto;
}
#logo a {
	float:left;
	margin:0 0 0 1.5em;
	padding:5em 0 0.5em;
	color:#fff;
	background:transparent url('../images/site/new_logo_sm.jpg') no-repeat center top;
	line-height:1.7;
	text-align:center;
	text-transform:uppercase;
	text-shadow:1px 1px 1px rgba(24,42,74,0.75);
	
	/* for new logo */
	width: 125px;
	height: 135px;
	background-size: contain;
	font-size: 0;
}

#slogan {
	float:left; 
	margin-left:1em;
	max-width:340px;
	width:34%;
}
#slogan h2 {
	font-size:160%; 
	color:#fff;
}


/*-----------------------------------------------------------
Social links (header) */

body>header .social {
	text-align:right;
	max-width:1000px;
	margin:0 auto;
	padding:0.5em 15em 0 0;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
body>header .social h4,
body>header .social ul {
	display:inline;
	vertical-align:middle;
	margin:0 0.1em;
}


/*-----------------------------------------------------------
Contact / account buttons */

#top {
	text-align:right;
	max-width:1000px;
	margin:-2.7em auto 0;
}
#top p {
	display:inline-block;
	text-align:right;
	margin:0 1.5em 0 0;
	width:13em;
}
#top .button {
	white-space:nowrap;
	margin:0 0 0.5em;
}


/*-----------------------------------------------------------
Main navigation */

#main-nav {
	clear:both;
	position:relative;
	z-index:25;
	max-width:1000px;
	margin:0.5em auto 0;
	padding:0.5em 0;
	background:#375682;
	background-image:linear-gradient(to top, #30517f 50%, #375682 50%);
}
#main-nav ul {
	list-style:none;
	margin:0;
	padding:0;
}
#main-nav a {
	color:#fff;
}


/* Corner triangles */
#main-nav:before,
#main-nav:after {
	content:' ';
	position:absolute;
	border-top:25px solid #1a3054;
	top:100%;
}
#main-nav:before {
	border-left:25px solid transparent;
	left:0;
}
#main-nav:after {
	border-right:25px solid transparent;
	right:0;
}



/* First level */
#main-nav>ul {
	display:table;
	width:100%;
	max-width:960px;
	margin:0 auto;
}
#main-nav>ul>li {
	position:relative;
	display:table-cell;
}
#main-nav>ul>li>a {
	display:block;
	text-align:center;
	margin:-0.4em 0; /* So that the selected effect goes outside of the lines in the <li>s */
	padding:1em;
	font-weight:bold;
	font-size:115%;
}
#main-nav>ul>li { /* Dividing borders */
	border-left:1px solid #415f88;
	border-right:1px solid #2e4d79;
}
#main-nav>ul>li:first-child {
	border-left:none;
}
#main-nav>ul>li:last-child {
	border-right:none;
}
#main-nav>ul>li>a:not(:only-child):after { /* Drop-down triangles */
	content:' ';
	margin:0 0 0 0.4em;
	display:inline-block;
	vertical-align:middle;
	border-top:0.4em solid #8d9fb9;
	border-left:0.4em solid transparent;
	border-right:0.4em solid transparent;
}
#main-nav>ul>li.sel>a { /* Selected */
	box-shadow:inset 0 0 2em rgba(13,44,87,0.4);
}


/* Second level */
#main-nav li ul {
	position:absolute;
	min-width:12em;
	margin:0;
	padding:0.3em 0.7em;
	border-top:0.5em solid transparent; /* Move drop-down down a bit without affecting the hit/hover area */
	background:rgba(62,94,139,0.9);
	background-clip:padding-box;
	box-shadow:inset 0 0 1.5em rgba(31,55,90,0.7);
	visibility:hidden;
	opacity:0;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}
#main-nav li:hover>ul {
	visibility:visible;
	opacity:1;
}
#main-nav li ul a {
	display:block;
	font-size:110%;
	padding:0.3em 1.5em 0.3em 0.5em;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}
#main-nav li ul li+li {
	border-top:1px solid #8d9fb9;
}
#main-nav li ul a:hover {
	/*background:rgba(255,255,255,0.1);*/
	background:#516e95;
}



/************************************************************
Layout: Banner */

#banner {
	color:#fff;
	padding:0 1.5em 4em;
	/*background-image:linear-gradient(to bottom, #203d71, #78affd, #3d5c8a);*/
	background:#203d71 url('../images/site/homes-watermark.png') repeat-x center bottom;
	background-image:url('../images/site/homes-watermark.png'), linear-gradient(to bottom, #8fb6ed 20%, #586e95);
}
#banner a {
	color:#fff;
}

/************************************************************
Layout: Upper content area */

#upper {
	position:relative;
	background:#cbd3de;
	padding:1em 1.5em;
	z-index:2;
}

/* Overhanging triangle */
#upper:after {
	content:' ';
	position:absolute;
	border-top:1.7em solid #cbd3de;
	border-left:3em solid transparent;
	border-right:3em solid transparent;
	margin:0 0 0 -3em;
	left:50%;
	top:100%;
}

/* Inner content */
#upper>article {
	max-width:960px;
	margin:0 auto;
}


/************************************************************
Layout: Main content */

main {
	display:block;
	background:#fff;
	padding:2em 1.5em 1em;
}
main>section {
	max-width:960px;
	margin:0 auto 1em;
}


/*-----------------------------------------------------------
Headers */

/* NOTE: The negative top margins in here get around some alignment challenges w/ those double-lines */

main header {
	position:relative;
	margin:2em 0 0;
	border-bottom:4px double #bfc9d7;
}
main header+* {
	clear:both;
}
/*main section:first-child header:first-child {
	margin-top:0;
}*/

main header>h1 {
	margin:-0.5em 0 0;
	padding:0.2em 0;
}
main header>h2 {
	float:left;
	background:#fff;
	margin:-0.6em 0 0;
	padding:0 0.25em 0.5em 0;
}
main header>nav {
	float:right;
	background:#fff;
	margin:-0.6em 0 0;
	padding:0 0 0 0.5em;
}
main header>nav.actions {
	margin-top:-1.5em;
}

/* Spacing between header sections */
main header~header {
	margin-top:4em;
}

/*-----------------------------------------------------------
Columns */

.col.main {
	width:65.5%;
}
.col.side {
	width:29.5%;
}
.col+.col {
	margin-left:4%;
}


/************************************************************
Layout: Bottom / Featured areas */

#bottom,
#featured {
	position:relative;
	padding:3em 1.5em 1em;
	background:#cbd3df url('../images/site/homes-watermark-light.png') repeat-x center bottom;
	color:#354a6e;
}
#featured {
	background-image:url('../images/site/homes-watermark-light-lg.png');
}

/* Overhanging triangle */
#bottom:before,
#featured:before {
	content:' ';
	position:absolute;
	border-top:1.7em solid #fff;
	border-left:3em solid transparent;
	border-right:3em solid transparent;
	margin:0 0 0 -3em;
	left:50%;
	top:0;
}


/************************************************************
Layout: Footer */

body>footer {
	padding:0 1.5em 0.7em;
	color:#fff;
}

body>footer a {
	color:#fff !important;
}

body>footer address,
#copyright {
	font-family:'Century Gothic',Arial,Helvetica,sans-serif;
}


/*-----------------------------------------------------------
Navigation */

#foot-nav {
	text-align:center;
	max-width:956px;
	margin:0 auto;
	padding:0.5em 0;
	border-bottom:4px double #778ba9;
}
#foot-nav ul {
	display:table;
	list-style:none;
	margin:0 auto;
	padding:0;
	width:100%;
	max-width:880px;
	font-size:115%;
}
#foot-nav li {
	display:table-cell;
}
#foot-nav li a {
	display:block;
	font-weight:bold;
	padding:1em 0.5em;
}



/*-----------------------------------------------------------
Contact addresses */

#foot-nav+section {
	position:relative;
	display:table;
	padding:0 11em 2em 9em;
	margin:1.5em auto;
	max-width:956px;
	width:100%;
	background:transparent url('../images/site/new_logo_sm.jpg') no-repeat 15px 65%;
	background-size: contain;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

body>footer address {
	display:table-cell;
	font-size:95%;
	line-height:1.5;
	border-right:1px solid #778ba9;
	padding:0.2em 2%;
}
body>footer address strong:first-child {
	display:block;
}
body>footer address span {
	white-space:nowrap;
}
body>footer address span+span:before {
	content:'  |  ';
}



/*-----------------------------------------------------------
Social links (footer) */

body>footer .social {
	position:absolute;
	text-align:center;
	margin:-2.8em 0 0;
	padding:0 1em;
	right:0;
	top:50%;
}


/*-----------------------------------------------------------
Copyright */

#copyright {
	position:relative;
	max-width:none;
	background:#294770;
	padding:0.9em 1.5em;
	margin:0 -1.5em;
	line-height:1.4;
}
#copyright>p {
	max-width:746px;
	padding:0 210px 0 0;
	margin:0 auto;
	font-size:85%;
}
#copyright>p>em {
	white-space:nowrap;
	margin:0 0 0 0.4em;
	font-size:90%;
}
#copyright>p>em a+a:before {
	content:'  |  ';
}
#copyright u { /* RMLS agreement link */
	white-space:nowrap;
}


/*-----------------------------------------------------------
JB Logo */

#jb {
	text-align:right;

	/* Grr to IE... doesn't let us use text-align as a baseline for absolute stuff like the rest of the world */
	position:relative;
}
#jb a {
	position:absolute;
	padding:0.3em 80px 0.3em 0;
	line-height:1.3;
	font-size:85%;
	top:50%;
	width:13em;
	margin:-1.6em 0 0;
	color:rgba(255,255,255,0.75) !important;
	background:transparent url('../images/site/jb-logo.png') no-repeat right center;

	/* Part of the "grr to IE" - no other browser needs this */
	margin-top:-3.3em;
	right:0;
}
#jb em {
	text-decoration:underline;
}


/************************************************************
Social links (shared) */

.social {
	color:#fff;
}
.social ul {
	text-align:center;
	list-style:none;
	margin:0;
	padding:0;
}
.social li {
	display:inline;
}
.social li a {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	text-indent:-9999px;
	text-align:left;
	outline:none;
	width:34px;
	height:34px;
	background:transparent url('../images/icons/icons.png') no-repeat center center;
}
.social li a:after { /* Hover fade effect */
	content:' ';
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	background:transparent url('../images/icons/icons.png') no-repeat center center;
	visibility:hidden;
	opacity:0;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}
.social li a:hover:after {
	visibility:visible;
	opacity:1;
}

.social li.fb a { background-position:-138px -4px; }
.social li.yt a { background-position:-138px -74px; }

.social li.fb a:after { background-position:-138px -39px; }
.social li.yt a:after { background-position:-138px -109px; }



/************************************************************
Buttons / links */

/*-----------------------------------------------------------
Standard buttons (orange) */

.button {
	position:relative;
	display:inline-block;
	color:#30517f;
	margin:0 0 0.2em;
	padding:0.4em 1em;
	font:bold 115%/1.3 Arial,Helvetica,sans-serif;
	border:none;
	background:#fec028;
	background-image:linear-gradient(to top, #f2b112 50%, #fec028 50%);
	cursor:pointer;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}
.button:hover {
	box-shadow:inset 0 0 1em 0.5em rgba(255,255,255,0.3);
}


/*-----------------------------------------------------------
Alternate buttons (blue) */

.button.alt {
	color:#fff !important;
	background:#375682;
	background-image:linear-gradient(to top, #30517f 50%, #375682 50%);
}


/*-----------------------------------------------------------
Account button (silver) */

.button.acct {
	background:#f0f2f5;
	background-image:linear-gradient(to top, #e2e6ec 50%, #f0f2f5 50%);
	padding-right:0.6em;
}


/*-----------------------------------------------------------
Button icons */

/* My Account *
.button.acct:before {
	content:' ';
	display:inline-block;
	margin:-5px 0.4em -5px 0;
	height:20px;
	width:20px;
	left:3%;
	top:50%;
	background:transparent url('../images/icons/icons.png') no-repeat -174px -130px;
}*/

/* Saved Properties button (version 2) */
.button.acct:before {
	content:' ';
	position:absolute;
	background:transparent url('../images/icons/icons.png') no-repeat 0 -34px;
	height:30px;
	width:30px;
	left:-12px;
	top:-8px;
}
.button.acct sup {
	vertical-align:baseline;
	font-size:85%;
}
.button.acct sup:before {
	content:'(';
}
.button.acct sup:after {
	content:')';
}


/* Saved Properties star *
.button.acct sup {
	position:absolute;
	right:-0.5em;
	top:-0.3em;
	z-index:2;
	width:0;
	height:0;
	font-size:75%;
	line-height:0;
	text-indent:-1px;
	border-bottom:18px solid transparent;
	border-top:18px solid transparent;
	border-right:12px solid #fec028;
	border-radius:10%; /* Makes it slightly less sharp *
}
.button.acct sup:before {
	content:' ';
	position:absolute;
	border-bottom:18px solid transparent;
	border-top:18px solid transparent;
	border-right:12px solid #fec028;
	border-radius:10%; /* Makes it slightly less sharp *
	z-index:-1;
	top:-18px;
	left:0;

	-webkit-transform:rotate(-144deg);
	-ms-transform:rotate(-144deg);
	transform:rotate(-144deg);
}
.button.acct sup:after {
	content:' ';
	position:absolute;
	border-bottom:18px solid transparent;
	border-top:18px solid transparent;
	border-right:12px solid #fec028;
	border-radius:10%; /* Makes it slightly less sharp *
	z-index:-1;
	top:-19px;
	left:1px;

	-webkit-transform:rotate(-72deg);
	-ms-transform:rotate(-72deg);
	transform:rotate(-72deg);
}
*/




/* Contact */
.button.contact {
	font-size:130%;
	padding:0.6em 1.2em;
	background-image:linear-gradient(to left top, #f2b112 50%, #fec028 50%); /* Tilt the gradient BG */
}
.button.contact:before {
	content:' ';
	display:inline-block;
	margin:-9px 0.4em -9px 0;
	height:32px;
	width:28px;
	left:3%;
	top:50%;
	background:transparent url('../images/icons/icons.png') no-repeat -173px -96px;
}


/*-----------------------------------------------------------
Arrow links */

.arrow {
	font-weight:bold;
	font-size:105%;
	color:#36507a;
}
.arrow:after {
	content:'\A0'; /* Non-breaking space : This + inline will allow us to wrap the arrow with the preceding word */
	display:inline;
	vertical-align:middle;
	position:relative;
	font-size:0;
	left:0;
	margin:-0.15em 0 0 5px;
	border-left:6px solid #f2b112;
	border-top:6px solid transparent;
	border-bottom:6px solid transparent;

	-webkit-transition:all 0.4s ease 0s;
	transition:all 0.4s ease 0s;
}

/* Animation */
.callout:hover .arrow:after,
.arrow:hover:after {
	left:4px;
}


/*-----------------------------------------------------------
Icon links */

a.adv-search:before,
a.map-search:before {
	content:' ';
	display:inline-block;
	vertical-align:text-top;
	margin:0 0.2em 0 0;
	height:16px;
	width:15px;
	background:transparent url('../images/icons/icons.png') no-repeat center center;
}
a.adv-search:before { background-position:-193px -65px; }
a.map-search:before { background-position:-193px -80px; }


a.icon {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	color:inherit;
	padding:0 0 0 20px;
	width:3em;
}
a.icon:before {
	content:' ';
	position:absolute;
	margin:-15px 0 0;
	height:28px;
	width:20px;
	top:50%;
	left:0;
	background:transparent url('../images/icons/icons.png') no-repeat center center;
}

a.icon.map:before { background-position:-175px -62px; }

/* Tour, Save icons */
a.icon.tour,
a.icon.save {
	padding-left:34px;
}
a.icon.tour:before,
a.icon.save:before {
	width:30px;
	background-position:-101px -65px;
}
a.icon.save:before { background-position:1px 2px; }

/* Delete icon */
a.icon.delete {
	padding-left:1.8em;
}
a.icon.delete:before {
	content:'X';
	background:none;
	font-size:200%;
	color:#375682;
}


/************************************************************
Form fields */

input[type="text"],
input[type="password"],
input[type="search"],
input[type="email"],
input[type="tel"],
textarea,
select {
	display:inline-block;
	vertical-align:middle;
	padding:0.3em 0.6em;
	color:#252525;
	background:#fff;
	background-clip:padding-box;
	border:0.3em solid #f3f5f7;
	font:100%/1.3 Arial,Helvetica,sans-serif;

	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
select[multiple] {
	height:7em;
}
textarea {
	display:block;
	width:100%;
}

/* Field borders and shading w/in main property search area */
#prop-search input[type="text"],
#prop-search input[type="password"],
#prop-search input[type="search"],
#prop-search input[type="email"],
#prop-search input[type="tel"],
#prop-search textarea,
#prop-search select {
	border-color:rgba(68,99,143,0.8);
	box-shadow:inset 0 0 0.5em rgba(0,0,0,0.4);
}


/************************************************************
Modal */

#simplemodal-container {
	max-width:800px;
	/*min-width:300px;*/
}
#modal {
	display:none;
	max-width:90%;
	margin:0 auto;
	position:relative;
	background:#fffffd;
	border-radius:0.4em;
}
#modal h2 {
	background:#BFC9D7;
	margin:0 -15px;
	padding:0.4em 30px 0.2em 15px;
	border-radius:0.2em 0.2em 0 0;
}
#modal h2:before {
	display:none;
}
#modal-content {
	padding:0 15px 0.5em;
	min-width:300px;
}
#modal .simplemodal-close {
	font:bold 100%/1.3 'Lucida Grande','Lucida Sans Unicode',sans-serif;
	cursor:pointer;
	position:absolute;
	right:0.4em;
	top:0.2em;
	font-size:12pt;
	padding:0.2em;
	z-index:10;
}

/* Modal forms */
#modal form p {
	font-size:95%;
}
#modal label {
	vertical-align:middle;
	display:inline-block;
	font-weight:bold;
	width:9em;
}
#modal input[type="text"] {
	width:15em;
}
#modal textarea {
	display:inline-block;
	vertical-align:top;
	width:75%;
}
#modal input.error {
	background-color:#fdd;
	cursor:help;
}



/************************************************************
Miscellaneous */

/* Text alignment */
.left { text-align:left !important; }
.center { text-align:center !important; }
.right { text-align:right !important; }

/* Font sizes */
small { font-size:90%; }
big { font-size:115%; }


/* Columns */
.col {
	display:inline-block;
	vertical-align:top;
}

/* Dividers */
hr {
	display:block;
	border:none;
	height:1px;
	border-bottom:4px double #bfc9d7;
	margin:1.5em 0;
}


/* Mobile-only nav links */
#nav-jump, #nav-close {
	display:none;
}


/* Fix extra button padding in Firefox */
input[type="submit"]::-moz-focus-inner {
	border:none;
	padding:0;
	line-height:1;
}