@import "maps.css";

* {
font-size: 100%;
margin: 0;
padding: 0;
}

body {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 30px;
font-size: 62.5%;
text-align: center;
}


p { 
font-size: 1.2em;
line-height: 1.5em;
}
h1, h2, h3, h4 {
color: #000;
}


#wrap {
width: 60em;
text-align: left;
margin: 0 auto;
}


#DetailsHeader {
display: block;
width: 60em;
min-height: 10em;
padding-bottom:0em;
}

#DetailsHeader:after {
content:".";
height:0;
visibility:hidden;
display:block;
clear:left;
}

#DetailsHeader .logo {
float: left;
padding-left:0px;
}

#DetailsHeader .company {
width:260px;
/*margin-top: 1.5em;*/
float: left;
padding-left:5px;
}

#DetailsHeader .company h1, h2 {
font-size: 1.4em;
}

div.company p {
	color: #00f;
}

#DetailsHeader .company h2 {
font-weight:normal;
}

#DetailsHeader .addr {
/*float: right;*/
text-align: right;
}
.addr p {
color: #00f;
}


.DetailsHeader .company strong {
font-weight: bold;
}

.DetailsHeader .company em {
color: #184B95;
font-weight: bold;
font-style: normal;
}

div.company p em {
	color: #00f;
}

div.company p, div.company h2 em {
	font-weight:normal;
}

/* hips charts */
div#hip-info h2 {
	line-height:1.6em;
}

div#hip-info .image-1 {
	float:left;
	margin-right:10px;
}

div#hip-info .image-2 {
	float:left;
}

div#hip-info:after {
	content:".";
	height:0;
	display:block;
	visibility:hidden;
	clear:both;
}

div#hip-info p.ext-epc {
    clear:both;
    padding:5px 0px;
    margin:0px;
}


/* =====================  Errrr...  PROPERTY ADDRESS AND PRICE =============== */


#DetailsBar {
background-color: #00f;
margin: 1em 0 2em 0;
/*display: block;
height: 2.75em;
vertical-align: middle;*/
clear: left;
position:relative;
}

#DetailsBar:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

h2.DetailsPrice {
color: #ffffff;
float: right;
font-size: 1.5em;
font-weight: bold;
/*margin: 0.1em 0.2em 0 0;*/
margin-right:0.2em;
line-height: 1.5em;
text-align:right;
/*position:absolute;*/
width:39%;
/*top:0;
right:0;*/
}

h2.DetailsAddress {
color: #ffffff;
float: left;
font-size: 1.5em;
font-weight: bold;
margin: 0.1em 0 0 0.2em;
line-height: 1.5em;
width:60%;
}

h2.DetailsPrice span.comm_rent {
	display:block;
}



/* =====================  WHOLE CONTAINER FOR THE REST OF DETAILS =============== */

#DetailsContainer {
	clear:left;
}


/* ========================  THE MAIN AND THE THUMBNAIL IMAGES ===================== */

#DetailsImageCol {
width: 304px;
float: left;
margin: 0 1em 1em 0!important;
}

/*div#DetailsImageCol div#dtimg {
max-height:300px;
max-width: 300px;
border: 1px solid #666;
background-color: #ddd;
padding: 0.25em;
margin-bottom: 0.5em; 
}

div#DetailsImageCol div#dtimg img {
max-height:300px;
max-width: 300px;
border: 1px solid #666;
background-color: #ddd;
padding: 0.25em;
margin-bottom: 0.5em; 
}*/

div#DetailsImageCol div#dtimg {
height:204px;
width: 304px;
/*border: 1px solid #666;*/
background-color: #fff;
padding: 0;/*0.25em;*/
margin-bottom: 0.5em; 
}

div#DetailsImageCol div#dtimg img {
max-height:200px;
max-width: 300px;
border:solid 1px #666;
padding:2px;
}


/* =====================  THESE ARE THE THUMBNAIL IMAGES =============== */

ul#ImageList {
list-style-type: none;
float:left;
width:300px;
margin-bottom:5px;
}

ul#ImageList li {
display: block;
float:left;
margin: 0 2px 5px 0;
height:39px;
width:60px;
}

ul#ImageList li img {
height: 35px;
border: 1px solid #666;
background-color: #ddd;
padding: 2px;
}


/* ===============  THIS IS THE LIST OF HOUSE FEATURES =============== */

ul#DetailsBullets  {
/*clear:left;*/
float: right;
width: 47%;
margin-bottom: 1em;
}

ul#DetailsBullets li {
background-color: #eee;
padding-left: 0.5em;
/*line-height: 2em;*/
list-style-type: none;
margin: 0 0 0.5em 0;
font-size: 1.1em;
}


#DetailsContainer em {
font-size: 0.9em;
color: #999;
display: block;
}

.DetailsDescription p img {
margin: 0 1em 1em 0;
float: left;
width: auto!important;
height: 225px!important;
}

.mapCopyright {
font-size: 0.9em;
color: #999;
margin-top: 0.5em;
}

#DetailsTextCol h1 {
margin: 0em 0 0.5em 0;
padding: 0;
font-size: 1.5em;
}


.DetailsDescription h2 {
font-size: 1.25em;
clear: left;
margin: 1em 0 0.5em 0;
padding: 0em;
}

.DetailsDescription p {
clear: left;
padding: 0em;
margin-bottom: 2em;
line-height: 1.5em;
}

p.paragraph {
	margin-bottom:2em!important;
	height:1%;
	/*float:left;*/
}

p.paragraph img {
	margin-bottom:0!important;
}

p.paragraph:after {
display:block;
content:".";
height:0;
visibility:hidden;
clear:both;
}

#hip-info {
	width:600px;
}

#hip-info img {
	max-width:100%;
}

.smallimage {
clear:right;
}

.largeimage {
width: auto;
max-width: 60em;
border: 0px;
}

body#details div.l-image-container {
float:left;
width:92em;
margin-left:-16em;
text-align:center;	
}

body#details img.largeimage {
width:auto;
max-width:92em;
}

.mapimage {
width: auto;
max-width: 60em;
border: 0px;
}


/* ============= DISCLAIMERS AND FOOTER BITS ======================== */
.dt-disclaimer {
	text-align:center;
	margin-top:1.75em;
	font-size:85%;
	color:#aaa;
}

.det_disclaimer {
margin: 6em 0 1em 0;
text-align: center;
font-style: italic;
font-size: 0.9em;
clear: both;
}

/*.details_bottom img {
border: none;
}

p.image1 img, p.image2 img {
border: 0;
}

p.image1 {
float: left;
margin: 0;
}

p.image2 {
float: right;
margin: 0;
}*/

p.footnote {
text-align: center;
font-size: 1em;
}






/* ===============  THIS IS THE LIST OF BUTTONS/LINKS  =============== */


ul#ButtonsList {
	margin: 10px 0px; clear:both;
}

ul#ButtonsList li {
list-style-type: none;
margin: 0px 0px 5px 0px;
height: 1.7em;
}

#DetailsImageCol ul#ButtonsList li a {
padding: 2px 4px 6px 18px;
color: #000000;
}

#DetailsImageCol ul#ButtonsList li a:Hover {
text-decoration: none;
color: #00f;
}

li.DetailsMapLink a {
background-image: url(/images/buttons/map.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.DetailsPlanLink a {
background-image: url(/images/buttons/plan.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.Details360Link a {
background-image: url(/images/buttons/360.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.DetailsPdfLink a {
background-image: url(/images/buttons/pdf.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.DetailsIpixLink a {
background-image: url(/images/buttons/360.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.DetailsEhouseLink a {
background-image: url(/images/buttons/360.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}

li.DetailsCustomLink a {
background-image: url(/images/buttons/custom.gif);
background-repeat: no-repeat;
background-position: 0px 2px;
overflow: visible;
font-size : 120%;
}


/* ===============  THIS IS THE LIST OF BUTTONS/LINKS  =============== */

.DetailsDimensions {
line-height: 1.5em;
margin: 0;
padding: 0;
}

.DetailsDimensions li {
color: #000;
list-style-type: none;
display: block;
background-color: #eee;
margin: 0.5em 0 0.5em 0;
padding: 0 0 0 0.2em;
width: 100px;
}

/* === MAP === */
div#resultsmap, div#detailsmap {
    margin:0 0 5px 0;
    position: relative;
    height:450px;
    border:1px solid #ccc;
    clear:both;
    /*width:100%;*/
}