/***************************************
		 Listing Gallery Styles
****************************************/
.re_listingcontainer{
	position:relative;
	display:block;
	float:right;
	padding-top:310px;
	padding-left:0px;
	padding-right:0px;
	padding-bottom:0px;
	width:720px;
	min-height:95px;
	margin-right:20px;
	
	background:none;
}

/**** Listing Template Temp ****/
.re_pagecontent {
 		min-width:780px;
 		height:auto;
 		float:right;
 		padding:0;
 		margin:0;
}

div.wp-caption {display:none;}

/**** Bottom Carousel Container***/
.rel_carsel{
	position:relative;
	bottom:0;margin:20px 0 0 0;
	left:0;
	float:left;
	width:720px;
	height:auto;
	min-height:90px;
	padding:10px 0 0 0;

	overflow-y:visible;
	overflow-x:auto scroll;
	list-style-type:none;
	vertical-align:bottom;
	
	z-index:1;
}

.rel_listthumb{
	position:relative;
	display:inline-block;
	margin:0 5px 0 0;padding:0;border:0;
	width:70px;
	height:70px;
	
	overflow:visible;
	z-index:2;
}

.rel_listthumb a {
	padding:0;margin:0;border:0;
}

.rel_listthumb a img{
	position:absolute;
	padding:0;margin:0;
	z-index:2;
	
	width:70px;
	height:70px;
	border:0;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	background:#fbfbfb;
	
	box-shadow:1px 1px 3px rgba(0,0,0,.4);
	opacity:.6;
}

.rel_listthumb:hover {
	z-index:3;
}

.rel_listthumb a:hover > img{
	width:80px;height:80px;
	z-index:3;
	left:-5px;
	top:-5px;
	opacity:1;
	box-shadow:1px 1px 6px rgba(0,0,0,.7);
	
	animation-name: carselhover;
    animation-duration: .15s;
    animation-iteration-count: 1;
	animation-timing-function: ease-out;
	
	-webkit-animation-name: carselhover;
    -webkit-animation-duration: .25s;
    -webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease-out;
	
	-moz-animation-name: carselhover;
    -moz-animation-duration: .15s;
    -moz-animation-iteration-count: 1;
	-moz-animation-timing-function: ease-out;
}

/********** MAIN DISPLAY PANEL ELEMENTS ***********/
.rel_listdisplay{
	position:absolute;
	display:inline-block;
	width:720px;
	height:320px;
	background:#fbfbfb;
	
	text-align:center;
	top:-320px;
	left:0px;
	background:none;
	z-index:3;
	
	opacity:0;
	display:none;
	
	animation-name: imgOut;
    animation-duration: .30s;
    animation-iteration-count: 1;
	animation-timing-function: ease-out;
	
	-webkit-animation-name: imgOut;
    -webkit-animation-duration: .30s;
    -webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease-out;
	
	-moz-animation-name: imgOut;
    -moz-animation-duration: .30s;
    -moz-animation-iteration-count: 1;
	-moz-animation-timing-function: ease-out;
}

.rel_listdisplay img, .rel_basebg img{
	position:relative;
	top: 50%;
    transform: translateY(-50%);
	max-width:710px;
	max-height:310px;
	
	border-radius:6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	
	box-shadow:2px 2px 5px rgba(0,0,0,.5);
}

.rel_listthumb:hover + .rel_listdisplay {
	display:block;
	opacity:1;
	z-index:6;
	background:#fbfbfb;
	
	animation-name: imgOn;
    animation-duration: .30s;
    animation-iteration-count: 1;
	animation-timing-function: ease-out;
	
	-webkit-animation-name: imgOn;
    -webkit-animation-duration: .30s;
    -webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease-out;
	
	-moz-animation-name: imgOn;
    -moz-animation-duration: .30s;
    -moz-animation-iteration-count: 1;
	-moz-animation-timing-function: ease-out;
}

.rel_firstimg, .rel_basebg {
	position:absolute;
	display:inline-block;
	width:720px;
	height:320px;
	background:#fbfbfb;
	
	text-align:center;
	top:-320px;
	left:0px;
	background:none;
	z-index:1;
	
	display:none;

	opacity:1;
	display:block;
}

/****** ANIMATION ******/
@keyframes imgOut {
	0% 		{opacity:1;}
	100%	{opacity:0;}
}

@-moz-keyframes imgOut {
	0% 		{opacity:1;}
	100%	{opacity:0;}
}

@-webkit-keyframes imgOut {
	0% 		{opacity:1;}
	100%	{opacity:0;}
}

/**** display img fade-in ***/
@keyframes imgOn {
	0% 		{opacity:0;}
	100%	{opacity:1;}
}

@-webkit-keyframes imgOn {
	0% 		{opacity:0;}
	100%	{opacity:1;}
}

@-moz-keyframes imgOn {
	0% 		{opacity:0;}
	100%	{opacity:1;}
}

/**** carousel hover ***/
@keyframes carselhover {
	0% 	{width:70px;height:70px;left:0px;top:0px;opacity:.6;}
	60% 	{width:75px;height:75px;left:-3px;top:-3px;opacity:.7;}
	80%  {width:85px;height:85px;left:-6px;top:-6px;opacity:.8;}
	100% {width:80px;height:80px;left:-5px;top:-5px;opacity:1;}
}

@-webkit-keyframes carselhover {
	0% 	{width:70px;height:70px;left:0px;top:0px;opacity:.6;}
	60% 	{width:75px;height:75px;left:-3px;top:-3px;opacity:.7;}
	80%  {width:85px;height:85px;left:-6px;top:-6px;opacity:.8;}
	100% {width:80px;height:80px;left:-5px;top:-5px;opacity:1;}
}

@-moz-keyframes carselhover {
	0% 	{width:70px;height:70px;left:0px;top:0px;opacity:.6;}
	60% 	{width:75px;height:75px;left:-3px;top:-3px;opacity:.7;}
	80%  {width:85px;height:85px;left:-6px;top:-6px;opacity:.8;}
	100% {width:80px;height:80px;left:-5px;top:-5px;opacity:1;}
}