.TOPSPOT
{
    width: 100%;
    margin: 0 auto;
    padding: 0;
    list-style: none;
    height: 345px;   
    z-index: 1000;
}

.TOPSPOT ul {
	margin: 0;
	padding: 0;
	list-style: none;
	height: 320px;
	overflow: hidden;
}

.TOPSPOT .photo {
	width: 100%;
	height: 320px;
	background: url(photo-loader.gif) no-repeat 50% 50%;
}

.TOPSPOT .photo img {
	width:100%;
	height:320px;

}

.TOPSPOT .item {
	position: relative;
}

.TOPSPOT .titledesc {
	position: absolute;
	bottom: 0;
	right: 0;
	width:100%;
	background: url(overlay.png);
	padding:1% 2% 1% 2%;
	color: #fff;
	 font:18px/130% BNasim;
	direction: rtl;
	text-align:justify;
}

.TOPSPOT .title ,.TOPSPOT .title h1{
	margin-bottom: 5px;
    margin:0px;
    padding:0px;
    font:18px/130% BNasim;
    color:#fff !important;
}

.TOPSPOT .more {
	position: absolute;
	top: 0;
	left: 0;
	width:100%;
	height: 320px;
	background: url(blank.gif);
}

.TOPSPOT .more a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 330px;
	background: transparent;
}

.TOPSPOT .number {
	margin-top: 5px;
	text-align: center;
	direction: ltr;
	z-index:1000;
}

.TOPSPOT .number span {
	display: inline-block;
	width: 15px;
	height: 15px;
	background: url(dots.png) 0 0;
	margin-right: 1px;
	cursor: pointer;
		z-index:1000;
}

.TOPSPOT .number span:hover {
	background-position: 0 -15px;
}

.TOPSPOT .number span.selected {
	background-position: 0 -30px;
}

.TOPSPOT .dnone {
	display: none;
}