/*
* {margin:0; padding:0}
body {font:12px Verdana, Arial, Helvetica, sans-serif; background:#666 url(images/bg.gif)}
#gallery {position:relative; width:386px; margin:40px auto; padding:10px; border:6px solid #fff; background:#AAA}
*/
#images {
	border: 2px solid #9ac1c9;
	height: 240px;
	background: #eef5f6;
	margin-bottom: 20px;
}

#image {
	position:relative;
	width: 470px;
	height: 312px;
	padding: 0px;
	/*background:#FFF url(../../img/user/slide/loading.gif) center center no-repeat;*/ text-align: center;
}

.imageContentWrapper {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 468px;
	text-align: center;
}

.imageContent {
	top:0px;
	left:0px;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	width: 468px;
}

.imageContent img {
	max-width: 468px;
	height: 312px;
}

#thumbwrapper {
	margin-top: 5px;
	margin-left: 2px;
	padding: 5px 0;
	width: 448px;
	height: 55px;
	background: #FFF;
}

#thumbarea {
	position: relative;
	overflow: hidden;
	height: 55px;
	width: 460px;
}

#thumbs {
	position:absolute;
	list-style: none;
	margin-left: 5px;
	height: 55px;
	width: 10000px;
	border-right: 5px solid #FFF;
}

#thumbs div.flick-item {
	float:left;
	margin-right:2px;
	cursor:pointer;
}

#thumbs div.flick-item img {
	width: 55px;
	height: 55px;
}
.imgnav {
	position: absolute;
	z-index: 100;
	width: 35px;
	height: 75px;
	outline: none;
	cursor: pointer;
}

#previmg {
	left: -15px;
	top: 310px;
	background: url(../../img/user/house/previous.png) left center no-repeat;
}
#previmg:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}
#nextimg {
	right:-15px;
	top: 310px;
	background: url(../../img/user/house/next.png) right center no-repeat;
}
#nextimg:hover {
	opacity: 1;
	filter: alpha(opacity=100);
}



/* Slide */
#thumbwrapper div.common-slide-area div.top-inner div.move {
	position: absolute;
	top: 35%;
	top: calc(50% - 50px);
	left: 0;
	z-index: 2;
}
#thumbwrapper div.move a.arrow {
	width: 34px;
	height: 55px;
	padding: 0;
}
#thumbwrapper div.move a.arrow:after {
	display: none;
}
#thumbwrapper div.move.next {
	left: auto;
	right: 0;
}
#thumbwrapper div.move.prev div.move-inner {
	left: -10px;
}
#thumbwrapper div.move.next div.move-inner {
	right: -10px;
}
#thumbwrapper div.move.prev a.arrow {
	background: url(../../img/user/house/previous.png) right center no-repeat;
}
#thumbwrapper div.move.next a.arrow {
	background: url(../../img/user/house/next.png) right center no-repeat;
}
#thumbwrapper.common-slide-area div.flick-area div.flick-inner.slide-prev {
	-webkit-animation: image-slide-show-slide-prev 0.5s ease forwards;
	animation: image-slide-show-slide-prev 0.5s ease forwards;
}
#thumbwrapper.common-slide-area div.flick-area div.flick-inner.slide-next {
	-webkit-animation: image-slide-show-slide-next 0.5s ease forwards;
	animation: image-slide-show-slide-next 0.5s ease forwards;
}
@-webkit-keyframes image-slide-show-slide-prev {
	0% {
	}
	100% {
		-webkit-transform: translate(300px, 0);
		-moz-transform: translate(300px, 0);
		-ms-transform: translate(300px, 0);
		-o-transform: translate(300px, 0);
		transform: translate(300px, 0);
	}
}
@keyframes image-slide-show-slide-prev {
	0% {
	}
	100% {
		-webkit-transform: translate(300px, 0);
		-moz-transform: translate(300px, 0);
		-ms-transform: translate(300px, 0);
		-o-transform: translate(300px, 0);
		transform: translate(300px, 0);
	}
}
@-webkit-keyframes image-slide-show-slide-next {
	0% {
	}
	100% {
		-webkit-transform: translate(-300px, 0);
		-moz-transform: translate(-300px, 0);
		-ms-transform: translate(-300px, 0);
		-o-transform: translate(-300px, 0);
		transform: translate(-300px, 0);
	}
}
@keyframes image-slide-show-slide-next {
	0% {
	}
	100% {
		-webkit-transform: translate(-300px, 0);
		-moz-transform: translate(-300px, 0);
		-ms-transform: translate(-300px, 0);
		-o-transform: translate(-300px, 0);
		transform: translate(-300px, 0);
	}
}





#gallery {
	margin-left: 9px;
	padding: 0px;
/*
	margin-top: -35px;
*/
	width: 468px;
	background-color: white;
	float: left;
}

* html #gallery {
	margin-left: 5px;
}

div.imageContentWrapper.show {
	-webkit-animation: image-show 0.8s ease forwards;
	animation: image-show 0.8s ease forwards;
}

@-webkit-keyframes image-show {
	0% {
		opacity: 0.0;
		visibility: hidden;
	}
	100% {
		opacity: 1.0;
		visibility: visible;
	}
}
@keyframes image-show {
	0% {
		opacity: 0.0;
		visibility: hidden;
	}
	100% {
		opacity: 1.0;
		visibility: visible;
	}
}

div.imageContentWrapper.hide {
	-webkit-animation: image-hide 0.8s ease forwards;
	animation: image-hide 0.8s ease forwards;
}

@-webkit-keyframes image-hide {
	0% {
		opacity: 1.0;
		visibility: visible;
	}
	100% {
		opacity: 0.0;
		visibility: hidden;
	}
}
@keyframes image-hide {
	0% {
		opacity: 1.0;
		visibility: visible;
	}
	100% {
		opacity: 0.0;
		visibility: hidden;
	}
}
