/* the overlayed element */

.overlay{
	z-index: 99999;
}

.modal {
	background-color:#fff;
	display:none;
	width:350px;
	padding:15px;
	text-align:left;
	border:2px solid #333;
	opacity:1;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	-moz-box-shadow: 0 0 50px #ccc;
	-webkit-box-shadow: 0 0 50px #ccc;
}

.modal h2 {
	background:url(/img/global/info.png) 0 50% no-repeat;
	margin:0px;
	padding:10px 0 10px 45px;
	border-bottom:1px solid #333;
	font-size:20px;
}

#modal-wrapper {
	/* standard decorations */
	width:500px;	
	padding:10px;
	background-color: #acacac;
	/*border:10px solid #666; */

	/* for modern browsers use semi-transparent color on the border. nice! */
	/* fix dark corner issue in webkit */
	/* border-color:rgba(82, 82, 82, 0.698) rgba(82, 82, 82, 0.694); */
	background:rgba(82,82,82,0.65);

	/* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius: 8px;
}

/* fix close button falling over content on dash welcome message */
#welcomeOverlayContent #modal-wrapper {
	width: 520px;
}

#modal-wrapper .modal-section {
	background-color:#fff;
	border:0px solid #cbcbcb;
	margin: 0;
	padding:10px;	
}

#modal-wrapper .modal-section .box {
	margin: 0;
	padding: 10px;
	background-color: #fff;
}

#modal-wrapper .modal-section h2 {
	margin:-11px;
	margin-bottom:10px;
	color:#fff;
	background-color:#3CAB35;
	padding:10px;
	border-bottom: 2px solid #34952E;
	font-size:20px;
}


#facebox {

	/* overlay is hidden before loading */
	display:none;

	/* standard decorations */
	width:400px;	
	border:10px solid #666;

	/* for modern browsers use semi-transparent color on the border. nice! */
	border:10px solid;
	/* fix dark corner issue in webkit */
	border-color:rgba(82, 82, 82, 0.698) rgba(82, 82, 82, 0.694);

	/* hot CSS3 features for mozilla and webkit-based browsers (rounded borders) */
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
}

#facebox div {
	padding:10px;
	border:1px solid #3B5998;
	background-color:#fff;
	font-family:"lucida grande",tahoma,verdana,arial,sans-serif
}

#facebox h2 {
	margin:-11px;
	margin-bottom:0px;
	color:#fff;
	background-color:#3CAB35;
	padding:5px 10px;
	border:1px solid #3B5998;
	font-size:20px;
}


/* tool tip */
/* trigger button */
#demo-tool-tip {
	color:black;
	margin-bottom:5px;
	overflow:hidden;
	cursor:pointer;
}

/* Sliding right image */
.overlay div.close { 
	background: transparent url(/media/realdirect/images/sprites.gif) no-repeat 0 0; 
	height:28px;
	text-indent: -9000px;
	width:27px;
	position: absolute;
	top: 17px;
	right: 17px;
	z-index: 100;
}


/*scrollable horizontal.css */

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable { /* required settings */
	position: relative;
	overflow: hidden;
	width: 680px;
	height: 120px;
	/* custom decorations */
	border: 1px solid #ccc;
	background: url(../images/h300.png) repeat-x;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items { /* this cannot be too large */
	width: 20000em;
	position: absolute;
	clear: both;
}

.scrollable .items div{
	float: left;
}

/* single scrollable item */
.scrollable img {
	float: left;
	margin: 20px 5px 20px 21px;
	background-color: #fff;
	padding: 2px;
	border: 1px solid #ccc;
	cursor: pointer;
	width: 100px;
	height: 75px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

/* active item */
.scrollable .active {
	border: 2px solid #000;
	z-index: 9999;
	position: relative;
}/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
	/*width: 680px;*/
	width: 550px;
	height:95px;
	/* custom decorations */
	border:1px solid #ccc;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
.scrollable img {
	float:left;
	margin:7px 0px 10px 5px;
	background-color:#fff;
	padding:2px;
	border:1px solid #ccc;
	cursor:pointer;
	width:98px;
	height:75px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
}

/* active item */
.scrollable .active {
	border:2px solid #000;
	z-index:9999;
	position:relative;
}


/* scrollable buttons.css */
/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	background: url(../images/scrollable/arrow/hori_large.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	float:left;
	margin:36px 5px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 				{ background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover 		{ background-position:-30px -30px; }
a.right:active 	{ background-position:-60px -30px; } 


/* left */
a.left				{ margin-left: 0px; } 
a.left:hover  		{ background-position:-30px 0; }
a.left:active  	{ background-position:-60px 0; }

/* up and down */
a.up, a.down		{ 
	background: url(../images/scrollable/arrow/vert_large.png) no-repeat; 
	float: none;
	margin: 10px 50px;
}

/* up */
a.up:hover  		{ background-position:-30px 0; }
a.up:active  		{ background-position:-60px 0; }

/* down */
a.down 				{ background-position: 0 -30px; }
a.down:hover  		{ background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; } 


/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	


/* tabs.css */
/* root element for tabs  */
ul.css-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #ddd;	 	
}

/* single tab */
ul.css-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.css-tabs a { 
	float:left;
	font-size:11px;
	display:block;
	padding:4px 2px 3px 0;	
	text-decoration:none;
	border:0px solid #3CAB35;	
	border-bottom:0px;
	height:22px;
	background-color:#efefef;
	color:#777;
	margin-right:3px;
	position:relative;
	top:0;	
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;
	-webkit-border-top-left-radius: 6px;
	-webkit-border-top-right-radius: 6px;
	border-radius: 6px 6px 0 0; /* CF MODIFIED ON TRUNK 3/29 */
}



ul.css-tabs a:hover {
	background-color:#F7F7F7;
	color:#39A432;
}
	
/* selected tab */
ul.css-tabs a.current {
	background-color:#ddd;
	border-bottom:1px solid #ddd;	
	border-top:0 px solid #f3f3f3;	
	color:#39A432;	
	cursor:default;
}
div.css-panes {
	background-color:#fff;	
	border:0px solid #f3f3f3;

}
	
/* tab pane */
div.css-panes div.inside-panel {
	display:none;
	border:1px solid #ddd;
	border-top:0px;
	min-height:150px;
	padding:0px;
	background-color:#fff;	
}
div.css-panes div.listing-detail-panel {
	/*display:none;*/
	border:0px solid #bbb;
	min-height:80px;
	padding:0px;
	margin:0px;
	background-color:#fff;	
}

div.listing-detail-panel{
	display:none; /* added to fix IE7 map bkg issue on listings */
}

	.gallery-main-image {
		overflow:hidden;
		text-align: center 
	}
		.gallery-main-image img {
			margin: 0px auto;
		}

/* alternate colors: skin2 */ 
ul.skin2 a { 
    background-color:#fafafa;   
    border:1px solid #ddd;
    color:#39A432; 
    font-weight: bold;
    text-align: center;
    width:104px;
} 

ul.skin2 a.listing-details { 
    width:134px;
} 
ul.skin2 a.photos, ul.skin2 a.video, ul.skin2 a.map { 
    width:72px;
} 

ul.skin2 a.calendar { 
    width:147px;
    margin-right:0;
} 

/* alternate colors: skin2 */ 
ul.skin4 a { 
    background-color:#fafafa;  
    border:1px solid #ddd;
    color:#39A432; 
    font-weight: bold;
    padding-left:0px;
    padding-right:0px;
    text-align: center;
} 

ul.skin4 a.propert-info { 
    width:148px;
} 
ul.skin4 a.description { 
    width:158px;
} 
ul.skin4 a.photos { 
    width:63px;
} 
ul.skin4 a.floor-plan { 
    width:84px;
} 

ul.skin4 a.video { 
    width:56px;
} 

ul.skin4 a.comps { 
	margin-right: 0;
    width:103px;
} 

/* mouseover state */ 
ul.skin4 a:hover { 
    background-color:#f3f3f3; 
} 
 
/* active tab */ 
ul.skin4 a.current {
	color:#333; 
    background-color:#fff; 
    border-bottom:1px solid #fff; 
    font-weight: bold;    
} 

.listing-content  {
	border:0px;
}
 
/* mouseover state */ 
ul.skin2 a:hover { 
    background-color:#f3f3f3; 
} 
 
/* active tab */ 
ul.skin2 a.current {
	color:#333; 
    background-color:#fff; 
    border-bottom:1px solid #fff; 
    font-weight: bold;    
} 

/* root element for tabs  */
ul.gallery-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-top:1px solid #74C530;	 	
}

/* single tab */
ul.gallery-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.gallery-tabs a { 
	float:left;
	font-size:13px;
	display:block;
	padding:5px 25px;	
	text-decoration:none;
	border:1px solid #3CAB35;	
	border-top:0px;
	height:18px;
	background-color:#efefef;
	color:#777;
	margin-right:2px;
	-moz-border-radius-bottomleft: 4px;
	-moz-border-radius-bottomright:4px;
	-webkit-border-bottom-left-radius: 4px ;
	-webkit-border-bottom-right-radius: 4px ;
	position:relative;
	top:-1px;	
}

ul.gallery-tabs a:hover {
	background-color:#F7F7F7;
	color:#3CAB35;
	border-top: 1px solid #3CAB35;
}
	
/* selected tab */
ul.gallery-tabs a.current {
	background-color:#ddd;
	border-bottom:1px solid #3CAB35;	
	color:#5AB32F;
	padding-top: 6px;
	cursor:default;
}

	
/* tab pane */
div.gallery-panes div.gallery-scroller {
	display:none;
	border:1px solid #3CAB35;
	border-width:1px 1px 0px 1px;
	min-height:50px;
	padding:15px 6px;
	background-color:#fff;	
}


/* alternate colors: skin2 */ 
ul.skin3 a { 
    background-color:#3CAB35;         
    color:#fff; 
} 
 
/* mouseover state */ 
ul.skin3 a:hover { 
    background-color:#fff; 
} 
 
/* active tab */ 
ul.skin3 a.current {
	color:#3CAB35; 
    background-color:#fff; 
    border-top:0px solid #fff;     
} 

/* disabled tab */
ul.skin2 li.disabled-tab a{
	color:#ccc;
} 

ul.skin2 li.disabled-tab a:hover{
	background-color: #FAFAFA;
	cursor: default;
}