/* Jim Hay Stylesheet */
/* Print CSS */

/* 1. general document setup */

/* 1.1 - accessibility links, hidden from visual browsers */
.hidden, .textReplace { position: absolute; top: -10000px; left: 0;}
ul.hidden li {list-style-type:none;}

/* 1.2 - body formatting, including baseline type settings */
body {
  margin: 0;
  padding: 0;
  background: #fff url(../img/gradHeader.jpg) top left repeat-x;
  font: normal 0.7em/1.5em arial, helvetica, verdana, sans-serif;
  color: #666;
  text-align: center;
  }

/* 1.3 - form + baseline form element formatting */
form { margin: 0; padding: 0;} 
label.formLabel { margin: 0.75em 0 0 0; padding: 0; display: block; float: left; clear: both;}
input, textarea, select, input#search {
  border: 1px solid #bf311a;
  padding: 2px 2px;
  font: normal 1em/1em arial, helvetica, verdana, sans-serif;
  float: left;
  clear: both;
  }
input, textarea, select { background: #fff; color: #000;}
input, textarea { margin: 0; vertical-align: middle;}
select { margin: 0.25em 0 0 0;}
input#search, input#submit { margin: 1em 0 0 0; background: #bf311a; color: #fff; text-transform: uppercase;}
input#search:hover, input#submit:hover { color: #000; cursor: pointer;}

/* 1.4 - column system setup */
div.leftCol, div.rightCol { margin: 0; padding: 0; display: inline;}
div.leftCol { float: left;}
div.rightCol { float: right; text-align: left;}
div.spanningCol { clear: both;}

/* 1.5 - scalable bevel edged panel system initial setup */
div.panelTop, div.panelBtm, div.panelTop span, div.panelBtm span { margin: 0; padding: 0; height: 10px;}
div.panelTop span, div.panelBtm span { width: 10px; display: block;}
span.leftBev { float: left;}
span.rightBev { float: right;}
div.outlinePanel { margin: 0; padding: 0;}

/* 1.6 - fixes for 'container with floated content' depth bug */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.breaker { margin: 0; padding: 0; width: 100%; height: 1px; clear: both;}


/* 2. link styles */
a {color: #c2a204;}
a:link, a:visited, a:active {text-decoration: none;}
a:hover {text-decoration: underline;}
a img { border: 0;}


/* 3. typography */
h1 { font: normal 2em/1em arial, helvetica, verdana, sans-serif; color: #c2a204; margin: 0;}
h2 {
  padding-bottom: 0.3em;
  border-bottom: 1px solid #000;
  font: normal 1.05em/1.4em arial, helvetica, verdana, sans-serif;
  color: #000;
  margin-bottom: 0;
  }
h3 { font: normal 1.05em/1.4em arial, helvetica, verdana, sans-serif; color: #bf311a; margin-bottom: 0.2em;}
h4 { font: normal 1em/1.3em arial, helvetica, verdana, sans-serif; color: #bf311a; margin-bottom: 0.2em;}
h4 a { color: #bf311a;}
h5, div#breadcrumbs p { font: normal 0.9em/1.5em arial, helvetica, verdana, sans-serif; color: #808080; margin: 0;}
p { font: normal 1em/2.3em arial, helvetica, verdana, sans-serif; color: #666; margin-bottom: 1.2em;}
div#footer p { font: normal 0.8em/1.4em arial, helvetica, verdana, sans-serif; color: #666; margin: 0;}
div#footer p a {color: #666;}
div#footer p { margin-bottom: 0;}
.variantLink { color: #666;}


/* 4. wireframe structure */
#header, #breadcrumbs, #mainContent { margin: 0 auto; padding: 0; width: 743px;}
#navigation, #footer { margin: 0; padding: 0; width: 100%;}


/* 5. section-by-section specifics */
#header { height: 145px; text-align: left;}
#header a#logo, #header img#tagline, #header a#callNow { padding: 0; display: inline;}
#header a#logo { margin: 19px 0 0 0; width: 206px; float: left;}
#header img#tagline { margin: 59px 0 0 23px; width: 330px; float: left;}
#header a#callNow { margin: 58px 0 0 0; width: 164px; float: right;}
#navigation { background: #000;}
#navigation div { margin: 0 auto; padding: 0; background: url(../img/bulletNav.gif) 20px bottom no-repeat; width: 743px;}
#navigation div ul { margin: 0; padding: 0 0 0 20px; list-style-type: none;}
#navigation div ul li { margin: 0; padding: 8px 6px 7px 7px; background: url(../img/bulletNav.gif) bottom right no-repeat; float: left;}
#navigation div ul li a { font: normal 1.1em/1.4em arial, helvetica, verdana, sans-serif; color: #fff;}
#navigation div ul li a:hover { color: #c2a204; cursor: pointer;}
#breadcrumbs { margin: 28px auto 8px auto; padding: 0; background: url(../img/bulletBcrumbs.gif) 18px center no-repeat; text-align: left;}
#breadcrumbs p { padding: 0 0 0 30px;}
#breadcrumbs p a { color: #666;}
#mainContent {text-align: left;}
div.calloutPanel { margin: 0; padding: 0; background: #e9e4e0; width: 120px;}
div.calloutPanel div.panelTop { background: url(../img/bevelTopRight.gif) top right no-repeat;}
div.calloutPanel div.panelTop span { background: url(../img/bevelTopLeft.gif) top left no-repeat;}
div.calloutPanel div.panelBtm { background: url(../img/bevelBtmRight.gif) top right no-repeat;}
div.calloutPanel div.panelBtm span { background: url(../img/bevelBtmLeft.gif) top left no-repeat;}
div.calloutPanel h3, div.calloutPanel p { margin: 0 10px 1em 10px; line-height: 1.5em;}
div.calloutPanel h3 { color: #000;}
div.thumbnailListing { margin: 0; padding: 0;}
div.thumbnailListing ul { margin: 0; padding: 0; list-style-type: none;}
div.thumbnailListing ul li { margin: 0 0 15px 0; border-bottom: 1px dotted #ccc; padding: 0 0 10px 0;}
div.thumbnailListing ul li img { margin: 0 10px 0 0; border: 1px solid #ccc; padding: 4px 4px; float: left;}
div.thumbnailListing ul li a { margin: 0; padding: 0;}
div.thumbnailListing ul li p { margin: 0 !important; padding: 0 !important; line-height: 1.5em;}
#footer { margin-top: 60px; background: url(../img/gradFooter.jpg) top left repeat-x; min-height: 100px;}
#footer div.wrapper { margin: 0px auto; padding: 17px 0 35px 35px; background: url(../img/jhShield.gif) 0 1.2em no-repeat; width: 708px;}
#footer div.wrapper div.leftCol {text-align: left;}
#footer div.wrapper div.rightCol { text-align: right;}


/* 6. page-to-page specifics */
body#homepage div#mainContent div.leftCol { margin: 0; padding: 0; width: 235px;}
body#homepage div#mainContent div.leftCol h1#trWelcome {
  margin: 14px 0 0 14px;
  padding: 0 0 10px 0;
  background: url(../img/trWelcome.gif) left top no-repeat;
  width: 171px;
  height: 43px;
  display: block;
  }
body#homepage div#mainContent div.leftCol img#mugshot { margin: 13px 10px 0 0; float: left;}
body#homepage div#mainContent div.leftCol p { margin-left: 13px;}
body#homepage div#mainContent div.leftCol h3, body#homepage div#mainContent div.leftCol h4 { margin: 0 0 0 13px;}
body#homepage div#mainContent div.leftCol h3 { font: bold 1.4em/1.4em arial, helvetica, verdana, sans-serif; color: #666; margin-bottom: 0;}
body#homepage div#mainContent div.leftCol h4 { font: normal 1em/1em arial, helvetica, verdana, sans-serif; color: #000; margin-bottom: 0;} 
body#homepage div#mainContent div.rightCol { margin: 0; padding: 0; width: 467px;}
body#homepage div#mainContent div.rightCol p#trHawickAndScottishBorders {
  margin: 0 0 8px 0;
  padding: 0;
  background: url(../img/trHawickAndScottishBorders.gif) left top no-repeat;
  width: 467px;
  height: 29px;
  display: block;
  }
body#homepage div#mainContent div.rightCol div.leftCol { margin: 21px 0 0 0; padding: 0; width: 185px;}
body#homepage div#mainContent div.rightCol div.leftCol div#searchForm { margin: 0.5em 0; border-bottom: 1px dotted #ccc; padding: 0 0 30px 0;}
body#homepage div#mainContent div.rightCol div.leftCol div#searchForm select { width: 136px;}
body#homepage div#mainContent div.rightCol div.leftCol a {display: block; text-align: right;}
body#homepage div#mainContent div.rightCol div.rightCol { margin: 21px 0 0 0; padding: 0; width: 240px;}
body#homepage div#mainContent div.rightCol div.rightCol a img {
  margin: 10px 0 5px 0;
  border: 1px solid #ccc;
  padding: 13px 13px;
  width: 212px;
  }
body#homepage div#mainContent div.rightCol div.rightCol p { margin: 0.75em 0; padding: 0; font: normal 1em/1.5em arial, helvetica, verdana, sans-serif;}
body#homepage div#mainContent div.rightCol div.rightCol p a#anotherProp {
  margin: 20px 0 0 0;
  border-top: 1px dotted #ccc;
  padding: 0.5em 0 0 0;
  display: block;
  text-align: right;
  }
body#homepage div#mainContent div.rightCol div.spanningCol { margin: 0; padding: 20px 0 0 0;}
body#homepage div#mainContent div.rightCol div.spanningCol img { margin: 2em 0 0 20px; float: right;}
body#searchProperties div#mainContent div.leftCol { margin: 0 0 0 15px; padding: 0; width: 252px;}
body#searchProperties div#mainContent div.leftCol h1#trSearch {
  margin: 20px 0 0 0;
  padding: 0;
  background: url(../img/trSearch.gif) left top no-repeat;
  width: 252px;
  height: 57px;
  display: block;
  }
body#searchProperties div#mainContent div.leftCol p { margin: 0 25px 0 0;}
body#searchProperties div#mainContent div.leftCol label { color: #000;}
body#searchProperties div#mainContent div.leftCol label input#list, body#searchProperties div#mainContent div.leftCol label input#map { border: none; float: none; clear: none;}
body#searchProperties div#mainContent div.leftCol select { width: 185px;}
body#searchProperties div#mainContent div.rightCol { margin: 77px 20px 0 0; padding: 0; width: 430px;}
body#searchProperties div#mainContent div.rightCol div.leftCol { margin: 0; padding: 0; width: 260px;}
body#searchProperties div#mainContent div.rightCol div.leftCol ul { margin: 0; padding: 0; list-style-type: none;}
body#searchProperties div#mainContent div.rightCol div.leftCol ul li { margin: 1.5em 0; padding: 0;}
body#searchProperties div#mainContent div.rightCol div.rightCol { margin: 0; padding: 0; width: 120px;}
body#searchResults div#mainContent div.leftCol { margin: 0 0 0 15px; padding: 0; width: 500px;}
body#searchResults div#mainContent div.leftCol h1#trResults { margin: 20px 0 0 0; padding: 0; background: url(../img/trResults.gif) left top no-repeat; width: 226px; height: 36px; display: block;}
body#searchResults div#mainContent div.rightCol { margin: 77px 20px 0 0; padding: 0; width: 120px;}
body#propertyDetails div#mainContent div.leftCol { margin: 0; padding: 0; width: 360px;}
body#propertyDetails div#mainContent div.leftCol h1#trDetails {
  margin: 20px 0 0 14px;
  padding: 0 0 10px 0;
  background: url(../img/trDetails.gif) left top no-repeat;
  width: 249px;
  height: 57px;
  display: block;
  }
body#propertyDetails div#mainContent div.leftCol h2, body#propertyDetails div#mainContent div.leftCol h3  { margin: 0 0 0.5em 14px; padding: 0;}
body#propertyDetails div#mainContent div.leftCol h2 { border: none;}
body#propertyDetails div#mainContent div.leftCol h4 { margin: 0 0 0 14px; padding: 2em 0 0.75em 0;}
body#propertyDetails div#mainContent div.leftCol h5 { margin: 0 0 0 14px; padding: 0;}
body#propertyDetails div#mainContent div.leftCol p { margin: 0 0 0.75em 14px; padding: 0;}
body#propertyDetails div#mainContent div.leftCol div.pdfLink { margin: 20px 0 0 0; padding: 0 0 0 60px; background: url(../img/pdfIcon.gif) left bottom no-repeat;}
body#propertyDetails div#mainContent div.rightCol { margin: 30px 0 0 0; padding: 0; width: 345px;}
body#propertyDetails div#mainContent div.rightCol a#returnSearch { display: block; text-align: right;}
body#propertyDetails div#mainContent div.rightCol div#propImages { text-align: right;}
body#propertyDetails div#mainContent div.rightCol div#propImages a img.mainPic { margin: 1.7em 0 4px 0; border: 1px solid #ccc; padding: 10px 10px;}
body#propertyDetails div#mainContent div.rightCol div#propImages ul { margin: 0; padding: 0; list-style-type: none;}
body#propertyDetails div#mainContent div.rightCol div#propImages ul li { margin: 6px 0 0 6px; border: 1px solid #ccc; padding: 4px 4px 2px 4px; float: right; display: inline;}
body#propertyDetails div#mainContent div.rightCol div#propImages ul li a { margin: 0; padding: 0;}
body#propertyDetails div#mainContent div.rightCol div#propImages h5 { padding-top: 10px; clear: both;}
body#propertyDetails div#mainContent div.rightCol div#propLocation, body#propertyDetails div#mainContent div.rightCol div#mortgageCalc { margin: 40px 0 0 17px; padding: 0; width: 328px; text-align: left;}
body#propertyDetails div#mainContent div.rightCol div#propLocation h4, body#propertyDetails div#mainContent div.rightCol div#mortgageCalc h4 { padding-bottom: 0.5em;}
body#sellProperty div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 265px;}
body#sellProperty div#mainContent div.leftCol h1#trSell {
  margin: 0;
  background: url(../img/trSell.gif) left top no-repeat;
  padding: 0;
  width: 246px;
  height: 56px;
  }
body#sellProperty div#mainContent div.rightCol { margin: 38px 0 0 0; padding: 0; width: 420px;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry { margin: 38px 0 0 0; padding: 0; width: 280px; float: left;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry p { margin-bottom: 0;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry form p { padding: 8px 4px 0 0; line-height: 1.1em; clear: both;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry form input, body#sellProperty div#mainContent div.rightCol div#salesEnquiry form textarea { width: 185px;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry form label input.radioButton { border: none; width: auto; float: none; clear: none;}
body#sellProperty div#mainContent div.rightCol div#salesEnquiry form input#submit { width: auto;}
body#sellProperty div#mainContent div.rightCol img { float: right;}
body#services div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 360px;}
body#services div#mainContent div.leftCol h1#trServices {
  margin: 0;
  background: url(../img/trServices.gif) left top no-repeat;
  padding: 0;
  width: 180px;
  height: 34px;
  }
body#services div#mainContent div.rightCol { margin: 38px 0 0 0; padding: 0; width: 330px;}
body#services div#mainContent div.rightCol h5 { margin-top: 1em;}
body#services div#mainContent div.rightCol h2 { margin-top: 14px;}
body#services div#mainContent div.rightCol div.thumbnailListing ul li img { padding: 0;}
body#contact div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 290px;}
body#contact div#mainContent div.leftCol h1#trContact {
  margin: 0;
  background: url(../img/trContact.gif) left top no-repeat;
  padding: 0;
  width: 172px;
  height: 31px;
  }
body#contact div#mainContent div.leftCol table, body#contact div#mainContent div.leftCol table tr { margin: 0; border: 0; padding: 0;}
body#contact div#mainContent div.leftCol table caption { display: none;}
body#contact div#mainContent div.leftCol table tr td { margin: 0; padding: 0 8px 6px 0; text-align: left; vertical-align: top;}
body#contact div#mainContent div.leftCol table tr td.colOne { color: #c2a204;}
body#contact div#mainContent div.rightCol { margin: 38px 0 0 0; padding: 0; width: 375px;}
body#contact div#mainContent div.rightCol div#generalEnquiry { margin: 20px 0 0 0; padding: 0; width: 185px; float: left;}
body#contact div#mainContent div.rightCol div#generalEnquiry p { margin-bottom: 0;}
body#contact div#mainContent div.rightCol div#generalEnquiry form p { padding: 8px 4px 0 0; line-height: 1.1em; clear: both;}
body#contact div#mainContent div.rightCol div#generalEnquiry form input, body#contact div#mainContent div.rightCol div#generalEnquiry form textarea { width: 185px;}
body#contact div#mainContent div.rightCol div#generalEnquiry form label input.radioButton { border: none; width: auto; float: none; clear: none;}
body#contact div#mainContent div.rightCol div#generalEnquiry form input#submit { width: auto;}
body#contact div#mainContent div.rightCol img { float: right;}
body#about div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 370px;}
body#about div#mainContent div.leftCol h1#trAbout {
  margin: 0;
  background: url(../img/trAbout.gif) left top no-repeat;
  padding: 0;
  width: 146px;
  height: 37px;
  }
body#about div#mainContent div.rightCol { margin: 38px 0 0 0; padding: 0; width: 310px;}
body#links div#mainContent h1#trLinks {
  margin: 20px 0 0 14px;
  background: url(../img/trLinks.gif) left top no-repeat;
  padding: 0;
  width: 198px;
  height: 45px;
  }
body#links div#mainContent p, body#links div#mainContent div.thumbnailListing { margin-left: 14px;}
body#lettings div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 484px;}
body#lettings div#mainContent div.leftCol h1#trRenting {
  margin: 0;
  background: url(../img/trLettings.gif) left top no-repeat;
  padding: 0;
  width: 435px;
  height: 52px;
  }
body#lettings div#mainContent div.leftCol ul { margin: 0 0 2em 1.8em; padding: 0;}
body#lettings div#mainContent div.leftCol ul li { margin: 0 0 1em; padding: 0;}
body#lettings div#mainContent div.rightCol { margin: 28px 0 0 0; padding: 0; width: 206px;}
body#lettings div#mainContent div.rightCol h5 { margin-top: 1em;}
body#lettings div#mainContent div.rightCol img#susanHay { margin: 30px 0 0 0;}
body#auctions div#mainContent h3 { margin: 2em 0 1em 0; padding: 0 0 5px 0; border-bottom: 1px solid #000; text-transform: uppercase;}
body#auctions div#mainContent h2 { margin: 2em 0 1em 0;}
body#auctions div#mainContent ul { margin: 0 0 2em 1.8em; padding: 0; line-height: 1.3em;}
body#auctions div#mainContent ul li { margin: 0 0 1em 0; padding: 0;}
body#auctions div#mainContent div.leftCol { margin: 20px 0 0 14px; padding: 0; width: 353px;}
body#auctions div#mainContent div.leftCol h1 {
  margin: 0;
  padding: 0;
  background: url(../img/trPropertyAuctions.gif) top left no-repeat;
  width: 274px;
  height: 53px;
  display: block;
  }
body#auctions div#mainContent div.leftCol div#jumpNav { margin: 0; padding: 0; width: 353px;}
body#auctions div#mainContent div.leftCol div#jumpNav h3 { margin-top: 31px;}
body#auctions div#mainContent div.leftCol div#jumpNav ul {
  margin: 0 5px 0 0;
  padding: 0;
  width: 170px;
  float: left;
  display: inline;
  list-style: none;
  }
body#auctions div#mainContent div.leftCol div#jumpNav ul li {
  margin: 0 0 0.5em 0;
  padding: 0;
  width: 170px;
  float: left;
  clear: both;
  display: inline;
  }
body#auctions div#mainContent div.leftCol div#jumpNav ul li a { margin: 0; padding: 0;}
body#auctions div#mainContent div.rightCol { margin: 16px 0 0 0; padding: 0; width: 333px;}
body#auctions div#mainContent div.rightCol div.calloutPanel { margin: 20px 0; width: 333px;}
body#auctions div#mainContent div.rightCol div.calloutPanel h3 {
  margin: 5px 10px 8px 10px;
  padding: 0;
  border: none;
  line-height: 1em;
  color: #000;
  text-transform: none;
  } 
body#auctions div#mainContent div.rightCol div.calloutPanel p a { margin: 0; padding: 0; line-height: 1em; color: #000;}
body#auctions div#mainContent div#fullspanCol { margin: 0 14px; padding: 0.25em 0 0 0; clear: both;}

/* end */