/* reset.css */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ul {list-style:none }
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;}
/* fonts.css - Percents could work for IE, but for backCompat purposes, we are using keywords. x-small is for IE6/7 quirks mode. */
table {font-size:inherit;font:100%;}
/* 99% for safari; 100% is too large */
select, input, textarea { font: 99% verdana, arial, helvetica, clean, sans-serif;}
/*  Bump up !IE to get to 13px equivalent */
pre, code { font:115% monospace; *font-size:100%;}
/* Default line-height based on font-size rather than "computed-value"
body * { line-height: 1.22em } */
sup, sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative; }
sup { bottom: 1ex; font-size: 80% }
sub { top: .5ex; }

/* ELEMENTS ------------------------ */
body { background-color: #ffffff; color: #4f4f4f; font-size: 12px; font-family: Arial, Helvetica, sans-serif; margin: 0; line-height: 13px }
h1 { font-family: 'EB Garamond', serif; text-transform: uppercase; font-size: 24px; color: #000000; letter-spacing: 1px; line-height: 24px; padding-bottom: 20px }
h2 { font-family: 'EB Garamond', serif; text-transform: uppercase; font-size: 24px; color: #000000; letter-spacing: 1px; line-height: 24px; padding-bottom: 20px }
h4 { text-transform: uppercase; color: #000000; font-weight: bold }
img { width:100% !important; height:auto; display:block }
p { padding-bottom: 20px }

/* container */
#header-wrapper { width: 100%; background-color: #ffffff; position: relative }
#header { margin: auto; max-width: 1051px; padding-left: 10px; padding-right: 10px }
#logo { float: left; max-width: 300px; padding-top: 10px; padding-bottom: 12px }
#logo:hover { opacity: 0.7 }
.home #logo { max-width: 300px; padding-top: 0px; padding-bottom: 30px; margin: 0 auto; float: none }
.home #navigation { clear: both }
#top-nav { float: right; text-transform: uppercase; }
#top-nav a { background-color: #bab0ae; color: white; padding: 6px 20px; display: block; float: left }
#top-nav a:hover, #top-nav a.active { background-color: #363636 }
#top-nav a.pad { margin-right: 3px }
#buildium { position: absolute; left: 0; top: 62px; margin-left: 10px }

#content-wrapper { margin: auto; max-width: 1051px; padding-left: 10px; padding-right: 10px }
#content { margin: auto; max-width: 1031px; line-height: 15px; overflow: hidden; min-height: 100px; position: relative; clear: both }
#preloadedImages { position: absolute; overflow: hidden; left: -9999px; top: -9999px; height: 1px }

.home #content, .realestate #content, .property #content, .landscape #content { border-top: 2px dotted #ab9990; border-bottom: 2px dotted #ab9990; padding: 30px 0 }
.realestate #content.index { border-top: none; padding-top: 0; padding-bottom: 0px }
.home #content .home-btn { display: block; width: 40%; float: left; position: relative }
.home #content #btn1 { margin-right: 5%; margin-left: 5% }
.home #content #btn2 { margin-right: 5%; margin-left: 5% }
.home #content .home-btn img { transition: all .5s .1s }
.home #content .home-btn img.onhover { opacity: 0; position: absolute; top: 0; left: 0 }
.home #content .home-btn:hover img.onhover { opacity: 1 }

/* bx slider */
.bx-controls-auto { display: none }
.bx-wrapper { margin-bottom: 20px }

/* search */
.search-container { background-color: #bcb1ad }
.search .left { width: 29%; float: left; padding-bottom: 20px }
.search .left h1 { text-align: center; margin-top: 40px }
.search .left h3 { margin-bottom: 10px; font-weight: bold; font-size: 15px }
.search .right { width: 71%; float: left }
.property form { margin-bottom: 10px; margin-left: 20px; margin-right: 20px; margin-top: 20px; font-size: 13px }
.property select { padding: 2px; margin-bottom: 6px }
.property .mls_select { width: 95% }
.property .mls_select2 { width: 45% }
.property .input { padding: 2px; margin-bottom: 6px; width: 95%; border: 1px solid grey }
.property .show_only { float: left; margin-bottom: 6px; width: 45% }
.property .show_only2 { float: left; margin-bottom: 6px; width: 50% }
.property .button { clear: both; margin-top: 20px; background-color: #51cff8; color: #ffffff; padding: 2px 4px; border: 1px solid grey; cursor: pointer }
.iframe-container { height: 0; overflow-x: hidden; overflow-y: hidden; padding-bottom: 50%; margin-top: 10px; position: relative }
.iframe-container iframe { position: absolute; top:0; left: 0; width: 99%; height: 99% }

/* agents */
.agent { width: 96%; margin: 0 auto }
.agent h2 { margin-bottom: 6px }
.agent h3 { text-transform: uppercase; padding-bottom: 20px }
.agent ul { list-style-type: disc; margin-left: 5% }
.agent .image { width: 30%; margin-right: 5%; float: left }

/* contact */
.realestate .contact .left { width: 29%; float: left }
.realestate .contact .right { width: 71%; float: left }
.agents a { color: #ffffff }
.agents a:hover { color: #000000 }

/* about */
.realestate .about .left { width: 30%; float: left; background-color: #bab0ae; padding: 20px }
.landscape .about .left, .property .about .left { width: 34%; float: left; background-color: #bab0ae }
.about .left h2 { color: #ffffff; padding-bottom: 20px }
.about .left p { color: #000000; line-height: 16px; padding-bottom: 15px }
.about .right { width: 64%; float: left }
.landscape .about .right h2, .realestate .about .right h2, .property .about .right h2 { margin-left: 3%; padding-bottom: 20px; color: #000000 }
.realestate .about .right h2 { margin-left: 0; padding-bottom: 20px; color: #000000 }
.about .right .column { width: 46%; margin-left: 3%; float: left }
.about .right p { line-height: 16px; padding-bottom: 15px }
.about .right .agents h4 { font-size: 15px; padding-bottom: 10px }
.about .right .agents p { font-size: 13px; line-height: 20px }

/* links */
.links .left { width: 48%; float: left; margin-right: 5%; padding-bottom: 20px }
.links .right { width: 45%; float: left }
.links h2 { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 14px; padding-bottom: 2px }
.links ul { list-style-type: disc; margin-left: 40px; padding-bottom: 10px }

/* property */
.property .index .left { width: 27%; margin-right: 3%; float: left }
.property .index .right { width: 70%; float: left }
.property .index p { padding-bottom: 15px }

/* property contact */
.property .contact { font-size: 14px }
.property #content.contact { line-height: 18px }
.property .contact .left { width: 72%; margin-right: 3%; float: left }
.property .contact .right { width: 25%; float: left }
.property .contact p { padding-bottom: 15px }

/* landscape services */
.landscape .services .left { width: 47%; float: left; margin-right: 3% }
.landscape .services .right { width: 44%; float: left; background-color: #bab0ae; padding: 20px }
.landscape h1 { padding-bottom: 20px }
.landscape .right h2, .landscape .right h3, .landscape .services .right h4, .landscape .right a:hover { color: #ffffff }
.landscape .right h3 { text-transform: uppercase; font-size: 16px; margin: 15px 0 }
.landscape .right .service { margin-left: 30px }

.landscape .services li, .landscape .services .left h4 { margin-bottom: 10px }

/* landscape contact */
.landscape .contact { font-size: 14px }
.landscape #content.contact { line-height: 18px }
.landscape .contact .left { width: 76%; margin-right: 3%; float: left }
.landscape .contact .right { width: 21%; float: left }
.landscape .contact p { padding-bottom: 15px }

/* site-wide */
.agent a, .links a, .property .contact a, .landscape .contact .right a { color: #ab9990 }
.agent a:hover, .links a:hover, .property .contact a:hover, .landscape .contact .right a:hover { color: #000000 }

.rounded-corners { border-radius: 10px }
.quote { font-size: 14px; font-weight: bold; color: #cfbd56 }
.author { margin-left: 60px; font-weight: bold; color: #000000 }
.italic { font-style: italic }
.strong, strong { font-weight: bold }

/* box slider */
#boxslider { position: relative }
ul.bxslider li { font-size: 16px; line-height: 24px }
.bx-wrapper { margin-bottom: 40px; position: static }
.bx-wrapper .bx-pager, .bx-wrapper .bx-pager .bx-pager-item { display: none }
.bx-wrapper .bx-viewport { border-top: none; border-bottom: none; background-color: #ffffff; box-shadow: none }
/* #content.index #slider-prev { position: absolute; top: 50%; left: 5px }
#content.index #slider-next { position: absolute; top: 50%; right: 5px } */

/* misc links */
.notice  { color: #ff0000 }
.color { color: #a2ac6c; }
.indent   { text-indent: 20px }
.small { font-size: 9px }
.clear { clear: both }
.notice { color: red }
.dotted { border-top: 2px dotted #ab9990; padding-top: 20px }

/* footer */
#footer_wrapper { width: 100% }
#footer  { margin: auto; max-width: 1051px; font-size: 11px; min-height: 50px; padding-left: 10px; padding-right: 10px  }
#footer p { padding-bottom: 20px }
#footer a { color: #000000 }
#footer a:hover { color: #ab9990 }
#footer .copy { float: right }
#footer img { max-width: 40px; display: inline; vertical-align: middle }

#facebook     { margin: 0 0 0; float: left }
#facebook a  { text-indent: -1000px; display: block; margin: 2px; padding: 0; width: 26px; height: 25px; overflow: hidden; opacity: .8 }
#facebook a.fb  { background: url("images/facebookBtn.jpg") no-repeat }
#facebook a:hover {opacity:1;}

a { text-decoration: none }
a:focus { outline: none }
a { color: #000000 }
a:hover { color: #ab9990 }