/****************************************************************************************************************
LAYOUT OF DESIGN
the Following styles construct the layout of the Property Website 
****************************************************************************************************************/
* {margin:0;padding:0;border:0;} 
ul {list-style:none;}
div.MainContainer     {	background-image: url(../../images/bgd3.gif); margin-left:auto; margin-right:auto;  text-align:center; background-repeat:repeat-x;}
div.MainWidth {background-color:none; width:963px; margin-left:auto; margin-right:auto; padding-top:10px; }
div.PageHeader {  width:100%; text-align:left; border-bottom:2px solid #4a4331;  background-image:url(../../images/PageHeader-BGD.png); background-repeat:repeat-x; height:107px; font-family: "Century Gothic", "Arial Narrow";}

div.AddressTop {float:left; width:620px;}
div.AddressTop ul{   height:97px; padding-top:10px; padding-left:10px;}	
div.AddressTop li.Address{  font-size: 35px; font-weight: bold; color: #FFFFFF;  font-family:"Times New Roman", Times, serif;}	
div.AddressTop li.City{ font-size:18px; color: #999999; font-weight:bold;}	
div.AddressTop li.Price{ font-size:20px; color:white; line-height:20px; font-style:italic; padding-top:5px; font-family:"Times New Roman", Times, serif; }	

div.ContactTop {float:right; width:300px; text-align:right; padding-right:25px; padding-top:10px; color:white;}
div.ContactTop li.Presented{  font-size: 12px; font-weight: normal; font-style:italic; color: #FFFFFF; font-weight:bold; }


#PageHeaderButtons { width:100%; margin-left:auto; margin-right:auto;   }
#PageHeaderButtons ul {list-style:none; width:100%; background-color:#6a1010; height:35px; border-top:1px solid #a21d18; border-bottom:1px solid #4a4331;  } 
#PageHeaderButtons ul li{float:left;  width:159px; margin-left:auto; margin-right:auto; font-family:Arial, Helvetica, sans-serif; font-size:16px; padding-top:8px; padding-bottom:8px; color:white; }
#PageHeaderButtons ul li a { color:white; text-decoration:none; font-weight:bold; cursor:pointer; }
#PageHeaderButtons ul li a:hover { color:#eaddba; text-decoration:none;  }

 div.BodySection {clear:left; background-color:white; background-image:url(../../images/BodySection-BGD.jpg); background-repeat:repeat-x; padding: 0 50px; padding-top:10px; text-align:left;  }
 div.OuterBodyShell { background-image:url(../../images/OuterBodyShell.jpg); background-repeat:repeat-x; border-top:1px solid #646156; width:863px; overflow:hidden; text-align:center;}
 div.InnerBodyShell { background-color:white; width:851px;  overflow:hidden; border-collapse:separate; margin-right:auto; margin-left:auto; margin-top:5px;} 


 div.leftColumn { background-image:url(../../images/leftColumn-BGD.jpg); text-align:right; padding-top:25px; width:210px; float:left; overflow:hidden;}

 div.leftColumn ul{  text-align:right; padding-top:15px; padding-right:20px;  font-family:'century gothic'; font-size:12px; }
 div.leftColumn ul li{ line-height:20px;}
 div.leftColumn ul.AgentInfo { text-align:center; height:200px; margin-left:30px; }
 div.leftColumn ul li.PresentedBy { font-weight:bold; font-size:15px;}
 div.leftColumn ul li.EmailFriend { font-weight:bold; font-size:13px; line-height:25px;}
 div.leftColumn ul li.EmailFriend img{ margin-right:5px;}
 div.leftColumn ul li.EmailFriend span{ height:25px;}
 div.leftColumn ul li a { color:gray; text-decoration:none; font-weight:bold; }
 div.leftColumn ul li a:hover { color:gray; text-decoration:underline; width:100%; color:black; }
.TitleSideMenu {font-size:14px; border-bottom:1px solid #6a1010; margin-left:40px; padding-bottom:2px; padding-top:10px; text-align:right; margin-bottom:10px; }
.TitleSideMenuTop {font-size:14px; border-bottom:1px solid #6a1010; margin-left:40px; padding-bottom:2px; text-align:right; margin-bottom:10px; }

 div.rightColumn { text-align:left;  float:left;  width:641px; overflow:hidden; font-family: "Century Gothic", "Arial Narrow"; }
 div.rightColumn ul{ list-style:none;}
 div.rightColumn ul li { float:left; width:100%;}
 div.rightColumn ul li span.left { float:left; margin-left:120; margin-top:10px;}
 div.rightColumn ul li span.right {float:right; margin-right:120; margin-top:10px; color:#6a1010; font-weight:bold;}
 div.rightColumn ul li div.ImageDisplay { text-align:center; width:100%;}



 div.FooterInfo{ border-top:1px solid #d1d1d1; text-align:right; font-family:Arial, Helvetica, sans-serif; font-size:10px; width:auto; margin-right:auto; margin-left:auto; margin-top:30px;}

/****************************************************************************************************************
PHOTOS PAGE
This styles are used for the Photos page
FILE: photos.cfm
****************************************************************************************************************/
.AddressTitlePhoto { font-family:'Times New Roman', Times, serif; font-size:18PX; font-weight:bold; color:#6a1010;}
.MLSNumberTitlePhoto {font-family:arial; font-size:16px; font-weight:bold;}
.PhotoDisplayTop {border:1px solid #eaddba; background-color:#fff9eb; height:505px; padding:10px; margin-top:10px; font-family:'Times New Roman', Times, serif; }
.PhotoDisplayTop ul.right {width:140px; float:right;}
.PhotoDisplayTop ul.right li { height:22px;}
.PhotoDisplayTop ul.left {width:460px; float:left;}

/****************************************************************************************************************
PROPERTY DISPLAY
These styles are used for the proeprty Display page on the homepage 
FILE: inv/property_display.cfm
****************************************************************************************************************/
.PropertyDisplayTop {border:1px solid #eaddba; background-color:#fff9eb; height:245px; padding:10px; margin-top:10px; font-family:'Times New Roman', Times, serif; }
.PropertyDisplayPicture {width:320px; float:left; border:1px solid #eaddba;}
.PropertyDisplayInfo {float:right; width:270px; height:240px; text-align:center; }
.PropertyDisplayInfo ul { padding:0; margin:0; color:#91876e;}
.PD-Address {font-size:22px; letter-spacing:-1px;}
.PD-City {font-size:16px;}
.PD-Price {font-size:45px; color:#6a1010; font-weight:bold; padding-top:20px; padding-bottom:10px;}
.PD-BedBath {font-size:22px; }
.PD-MLSnumber {font-size:15px; font-weight:bold; padding-top:10px; padding-bottom:20px;}
.PD-TitleBar { height:20px; background-image: url(../../images/gradient-TB-BACK.png);  text-align:left; padding:5px; margin-top:5px;  font-family:'Times New Roman'; border:1px solid #eaddba; font-weight:bold; font-size:18px; clear:both;}
.PD-Remarks {float:left; font-size:13px; color:#555555; text-align:left; padding:3px ; font-family:verdana; overflow:scroll; overflow-x:hidden; height:95px; width:620px;}
.PD-ListingAgent {float:left; font-size:16px; color:#555555; text-align:left; padding:3px ; }

.PD-RoomsEquipment { text-align:left; font-size:13px; color:#555555; padding:3px 3px 3px 3px;  display:block;  font-family:verdana ;}
.PD-RoomsEquipment li {float:left; width:auto; word-spacing: normal; height:20px; padding-right:10px; }


/****************************************************************************************************************
CONTACT FORM & REQUEST MORE INFORMATION FORM
These styles are used for the Contact Form & Request More Information
FILE: contact/compose.cfm & showing/compose.cfm
****************************************************************************************************************/
.FormTitle {font-size:25px; border-bottom:1px solid black; padding-top:10px; color:#6a1010; font-family:arial;}
.FormsRequest { display:block; font-family:arial; padding-left:20px; padding-top:10px; float:left; width: 290px;} 
.FormsRequest span{ display:block; padding:5px 0; border-collapse:collapse;  width:250px; font-weight:bold; color:#333333;}
.FormsRequest input {border:1px solid gray; height:30px; padding:6px 5px 4px 5px; color:#990033; font-weight:bold; background-color:#fff9eb;}
.FormsRequest textarea {border:1px solid gray; font-family:arial;  color:#990033; padding:6px 5px 4px 5px;  font-size:13px; font-weight:bold; height:50px; width:350px; background-color:#fff9eb;}
.FormsRequestLong { display:block; font-family:arial; padding-left:20px; padding-top:10px; float:left; width: 600px;}
.FormsRequestLong span{ display:block; padding:5px 0; border-collapse:collapse;  width:200px; font-weight:bold; }
.FormsRequestLong input {border:1px solid gray; height:30px; padding:6px 5px 4px 5px; color:#990033; font-weight:bold; background-color:#fff9eb; cursor:pointer;}
.FormsRequestLong textarea {border:1px solid gray; font-family:arial;  color:#990033; padding:6px 5px 4px 5px;  font-size:13px; font-weight:bold; height:50px; width:350px; background-color:#fff9eb;}
.FormInstructions {border:1px solid #eaddba; margin-right:71px; padding:5px; background-color:#fff9eb; font-family:Arial, Helvetica, sans-serif; font-size:13px;}
.PleaseNote {color:firebrick; font-size:11px; padding-top:5px;}
select.PropertyType { border:1px solid gray; Font-size:16PX; font-family:ARIAL; background-color:#fff9eb;}
h2 {border-bottom:1px solid gray;  font-size:20px; margin-right:10px; padding:10px 0 ; margin-bottom:15px;  font-family:ARIAL; clear:left;} 
h3 {font-size:16px; margin-right:40px; padding:10px 0 ;  font-family:ARIAL;} 
h4 {font-size:16px; margin:0; padding:0 ;  font-family:ARIAL;} 
.FormContainer {padding:10px;}
.FormSubHeader {border:1px solid #eaddba; margin-right:50px; padding:5px; background-color:#fff9eb; font-family:Arial, Helvetica, sans-serif; font-size:13px;}
.FormSubHeader span {font-weight:bold; font-size:16px;}

/****************************************************************************************************************
Loan Calcualtor
These styles are used for all cal tools
FILE: calculators/loan_calc.cfm
****************************************************************************************************************/

.MoneyTools { padding:10px; margin-top:10px; margin-left:10px; width:590px; border:1px solid gray; background-color:#f4f3f0; } 
.MoneyTools img {float:right; width:67px; }
.MoneyTools textarea {visibility:hidden; background-color:#f4f3f0; width:580px; padding:5px; font-size:12px; } 
.MoneyTools ul  {padding-top:10px;}
.MoneyTools li  {clear:left; line-height:40px; font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold;}
.MoneyTools li span {width:265px;  display:block;  float:left; }
.MoneyTools li input {border:1px solid gray; height:30px; padding:6px 5px 4px 5px; color:#990033; font-weight:bold; background-color:#fff9eb; }
.ButtonStyle {border:1px solid gray; height:30px; padding:0; margin:10px 0 0 0; color:#990033; font-weight:bold; background-color:#fff9eb; cursor:pointer;}
.MoneyToolsLarge li span {width:350px; }
.MoneyToolsLarge li span.right {width:200px;  }
.MoneyTools Table {width:600px; padding:5px;  font-size:10px; font-family:Arial, Helvetica, sans-serif;}
.MoneyTools Table input {border:1px solid gray; height:30px; padding:6px 5px 4px 5px; color:#990033; font-weight:bold; background-color:#fff9eb; }
.MoneyToolInterest {width:600px;}
.MoneyToolInterest span {width:120px; border:1px solid gold;}