/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet
|--------------------------------------------------------------------------
|
| @package		RENO
| @subpackage	Frontend > Carousel
| @company		Gabriels Technology Solutions
| @phone		212/741/0700 x112
| @author		Joey Avino
| @email		javino@gabriels.net
| @link			http://www.gabriels.net
| @copyright	2010 Gabriels Technology Solutions
|
*/

/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet > Setup
|--------------------------------------------------------------------------
|
| Use this area for images
|
*/

	a.prev, a.prev-dead, a.next, a.next-dead { background: #e0e0e0 url('/reno/dynamic/Reno/Custom/Wrappers/Gabriels/images/icons/icons.png') no-repeat top left;  }
		a.next, a.next-dead { background-position: -239px -336px; }
		a.prev, a.prev-dead { background-position: -239px -397px; }
		a.prev-dead, a.next-dead { -moz-opacity: .4; opacity: .4; filter: alpha(opacity=40); cursor:inherit!important }
			a.next:hover { background-position: -359px -336px; }
			a.prev:hover { background-position: -359px -397px; }
		.details_carousel a.next { background-position: -239px -323px; background-color: #d6d6d6 !important; }
		.details_carousel a.prev { background-position: -238px -384px;  background-color: #d6d6d6 !important; }
			.details_carousel a.next:hover { background-position: -359px -323px; }
			.details_carousel a.prev:hover{ background-position: -358px -384px; }
		#GTSCarousel-wrap a.next { background-position: -239px -323px; background-color: #d6d6d6 !important; }
		#GTSCarousel-wrap a.prev { background-position: -238px -384px;  background-color: #d6d6d6 !important; }
			#GTSCarousel-wrap a.next:hover { background-position: -359px -323px; }
			#GTSCarousel-wrap a.prev:hover{ background-position: -358px -384px; }

		/* ----- CSS3 --------------  */
		a.next, a.next-dead  {
			-moz-border-radius-topright: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-bottomright: 5px;
			-webkit-border-bottom-right-radius: 5px; }
		a.prev, a.prev-dead {
			-moz-border-radius-topleft: 5px;
			-moz-border-radius-bottomleft: 5px; 
			-webkit-border-top-left-radius: 5px;  
			-webkit-border-bottom-left-radius: 5px; }



/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet > Mini Result Carousel
|--------------------------------------------------------------------------
|
*/

	/* ----- 1: Specify the max width you would like your carousel to be. -------------- */
	.details_top .carousel_container { width: 870px; padding: 0px 18px; margin-left: 45px; }
		.details_top .wrap { width: 870px; padding-left: 7px; }

	/* ----- 2: Set the absolute positioning for your next and previous buttons. -------------- */
	/* ----- 	For this example, they are on the top left and top right side. -------------- */
	.details_top a.prev, .details_top a.prev-dead { position: absolute; width: 20px; height: 62px; display: block; left: 0px; top: 1px; cursor: pointer; border-right: 1px solid #c8c6bc; text-indent: -9999px; }
	.details_top a.next, .details_top a.next-dead { position: absolute; width: 20px; height: 62px; display: block; right: 0px; top: 1px; cursor: pointer; border-left: 1px solid #c8c6bc; text-indent: -9999px; }

	/* ----- 3: Style the links and the link rollovers. -------------- */
	.details_top a.prev { text-indent: -9999px; }
		.details_top a.prev:hover { }
	.details_top a.next{ text-indent: -9999px; }
		.details_top a.next:hover { }

	/* ----- 3: Specify the styling you would like on your conent pages. -------------- */
	.details_top .object { width: 865px; }

		/* ----- You may also add custom selectors. -------------- */
		.details_top .object span.photo { display: block; border: 1px solid #d7d7d7; }
		.details_top .object .price { display: block; color: #929292; line-height: 10px; padding: 4px 0 2px; font-weight: bold; }
		.details_top .object .locality { display: block; color: #929292; line-height: 12px; padding-top: 0px; font-size: 9px;
		                                 border-radius: 0 0 3px 3px;
		                                 -webkit-border-radius: 0 0 3px 3px;
		                                 -moz-border-radius: 0 0 3px 3px; }
		.details_top .object a { display: block; font-weight: normal; }
			.details_top .object a:hover { text-decoration: none; }
		
	/* ----- Each Image. -------------- */		
	.carousel_item { width: 80px; margin: 0px 3px; float: left; }
		.carousel_item .photo { position:relative; width:78px; height:61px; }
			.carousel_item .photo img { position:absolute; opacity: .5; filter: alpha(opacity=50); }
		
		/* ----- Selected Image Parameters. -------------- */	
		.carousel_item .this .photo { border: 1px solid #b00 !important; }
			.carousel_item .this .photo img { opacity:1; filter:none; }
		.carousel_item .this .price { color: #000000; }

		.carousel_item .that .photo { }
		.carousel_item .that .price { color: #929292; }

	
	#mr-clone { position:absolute; z-index:10; background-color:#fff; border:2px solid #ccc; padding:5px;
	             box-shadow: 2px 2px 5px #666; -webkit-box-shadow: 2px 2px 5px #666; -moz-box-shadow: 2px 2px 5px #666;}
		#mr-clone a,
		#mr-clone img { text-decoration:none; }
		#mr-clone .photo { border:none; }
		#mr-clone .price,
		#mr-clone .locality { display:block; text-align: center; }







/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet > Details Image Carousel
|--------------------------------------------------------------------------
|
| NOTE: Do not change the names of these classes.
|
*/

	/* ----- 1: Specify the max width you would like your carousel to be. -------------- */
	.details_carousel { width: 584px; padding: 0px 23px 0px 23px ; margin-left: 0px; background: #f4f4f4; margin: 20px 0px;
							 }
		.details_carousel .wrap { padding-left: 0px; width: 602px; margin-left: -5px;  border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; }
		.details_carousel .jcs-carousel { margin-left: 5px; padding: 14px 0px 14px; }
			.details_carousel .detail_photo_fade { margin: 0px 1px; }


	/* ----- 2: Set the absolute positioning for your next and previous buttons. -------------- */
	/* ----- 	For this example, they are on the top left and top right side. -------------- */
	.details_carousel a.prev { z-index: 5; position: absolute; width: 20px; height: 86px; display: block; left: 0px; top: 1px; cursor: pointer; border-right: 1px solid #c8c6bc; text-indent: -9999px; }
	.details_carousel a.next { z-index: 5; position: absolute; width: 20px; height: 86px; display: block; right: 0px; top: 1px; cursor: pointer; border-left: 1px solid #c8c6bc; text-indent: -9999px; }

	/* ----- You may also add custom selectors. -------------- 
		.details_carousel .this .photo { margin: 0px; border: 2px solid red !important; filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;  }
		.details_carousel .that .photo { margin: 1px; margin-right: 3px; display: block; height: 50px; width: 67px;
									filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; }*/
									.details_carousel .photo { display: block; height: 50px; width: 67px; margin: 1px; position: relative;
																filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;}
								.details_carousel .selected .photo { border: 2px solid red !important; margin: 0px;
								                                     filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;}

	/* ----- Each Image. -------------- */		
	.details_carousel .carousel_item { width: 77px; margin-left: 0px 5px; float: left; }

	/* ----- This is to hide the photo carousel on details page. -------------- */	
	/* ----- Once page loads, this will be displayed via JS. -------------- */	
	#photo_carousel { display: none; }
	
	
	
	
/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet > Photo Modal Carousel
|--------------------------------------------------------------------------
|
| NOTE: Do not change the names of these classes.
|
*/


.photo_gallery_modal .carousel_container { width: 422px; margin: 10px auto; position:relative; }
.photo_gallery_modal .carousel_container .left { float: left; display: none; }
.photo_gallery_modal .carousel_container .car-wrap { overflow: hidden; margin: 0 auto; }
.photo_gallery_modal .carousel_container ul { list-style: none; position: relative; }
.photo_gallery_modal .carousel_container ul li { display: inline; float: left; }
.photo_gallery_modal .carousel_container ul li img { width: 69px; height: 52px; }
.photo_gallery_modal .carousel_container .right{ float: right; display: none; }
	.photo_gallery_modal .carousel-list { height: 57px; overflow: hidden; }


.photo_gallery_modal .wrap {

border-bottom:1px solid #d7d7d7;
border-top:1px solid #d7d7d7;
margin: 0px 5px;
padding-left:0;
height: 82px;
background: #f4f4f4;


 }

/* ----- 2: Set the absolute positioning for your next and previous buttons. -------------- */
	/* ----- 	For this example, they are on the top left and top right side. -------------- */
	.photo_gallery_modal a.prev { z-index: 5; position: absolute; width: 20px; height: 86px; display: block; left: 0px; top: 1px; cursor: pointer; border-right: 1px solid #c8c6bc; text-indent: -9999px; top: -2px; }
	.photo_gallery_modal a.next { z-index: 5; position: absolute; width: 20px; height: 86px; display: block; right: 0px; top: 1px; cursor: pointer; border-left: 1px solid #c8c6bc; text-indent: -9999px;  top: -2px; }



			.photo_gallery_modal .photo { display: block; height: 52px; width: 69px; margin: 1px; position: relative; cursor: pointer;
																filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;}
				.photo_gallery_modal .selected .photo { border: 2px solid red !important; margin: 0px;
								                                     filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1;}

	.photo_gallery_modal .modal_photo_fade { padding: 0px 1px; }
	.photo_gallery_modal .more_photos_carousel { padding: 14px 0px 14px; margin-left: 18px; }









/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------ */

/*
|--------------------------------------------------------------------------
| GTS Res Platform > Carousel Style Sheet > Necessary Attributes
|--------------------------------------------------------------------------
|
| Do not edit below this line. Experienced CSS developers only.
|
*/

		.carousel_container { }
			.carousel_container .clear { clear: both; }
				a.prev { display: block; outline: none; }
				a.next { display: block; outline: none; }
				.wrap { position: relative; }
					/*.carousel { left: 0px; position: relative; width: 10000px;  }*/ 									
					.object  { float: left; display: inline; position: relative; }	


#loadingDialog
{
    display:none;
    border:2px solid #000;
    background-color: #fff;
    color: #000;
    font: bold 16px arial, sans-serif;
    padding:18px;   
}