/* Example wrapper */

.wrap {

	position: relative;

}



/* Frame */

.frame {

	width:2000px;

	height: 420px;

	overflow: hidden;

	font-size:12px;

	position:relative;

	margin:0 -530px;

}

.frame ul {

	list-style: none;

	margin: 0;

	padding: 0;

	height: 100%;

}

.frame ul li {

	float: left;

	width: 2000px;

	height: 100%;

	margin: 0 1px 0 0;

	padding: 0;

	background: #333;

	color: #ddd;

	text-align: center;

	cursor: pointer;

}

.frame ul li a {

	display:block;

	width:940px;

	height:420px;

	text-indent:-99999px;

	margin:0 auto;

}

.frame ul li.active {

	/*color: #fff;*/

	background: #a03232;

}



/* Pages */

.pages {

	list-style: none;

	margin: 20px 0;

	padding: 0;

	text-align: center;

}

.pages li {

	display: inline-block;

	width: 10px;

	height: 10px;

	margin: 0 6px;

	text-indent: -999px;

	border-radius: 10px;

	cursor: pointer;

	overflow: hidden;

	background: #d2d2d2;

	box-shadow: inset 0 0 0 1px rgba(0,0,0,.2);

}

.pages li:hover {

	background: #aaa;

}

.pages li.active {

	background: #3560a9;

}



/* Controls */

.controls { margin: 25px 0; text-align: center; }



/* One Item Per Frame example*/

.oneperframe { height: 300px; line-height: 300px; }

.oneperframe ul li { width: 1140px; }

.oneperframe ul li.active { /*background: #333;*/ }



/* Crazy example */

.crazy ul li:nth-child(2n) { width: 100px; margin: 0 4px 0 20px; }

.crazy ul li:nth-child(3n) { width: 300px; margin: 0 10px 0 5px; }

.crazy ul li:nth-child(4n) { width: 400px; margin: 0 30px 0 2px; }



/* Effects */

.effects {

	height: 200px;

	line-height: 200px;

	-webkit-perspective: 800px;

	-ms-perspective: 800px;

	perspective: 800px;

	-webkit-perspective-origin: 50% 50%;

	-ms-perspective-origin: 50% 50%;

	perspective-origin: 50% 50%;

	overflow-y: show;

}

.effects ul {

	-webkit-transform-style: preserve-3d;

	-ms-transform-style: preserve-3d;

	transform-style: preserve-3d;

}

.effects ul li {

	position: relative;

	margin: 0 -20px;

	-webkit-transform: rotateY(60deg) scale(0.9);

	-ms-transform: rotateY(60deg) scale(0.9);

	transform: rotateY(60deg) scale(0.9);

	-webkit-transition: -webkit-transform 300ms ease-out;

	transition: transform 300ms ease-out;

}

.effects ul li.active {

	z-index: 10;

	-webkit-transform: scale(1);

	-ms-transform: scale(1);

	transform: scale(1);

}

.effects ul li.active ~ li {

	-webkit-transform: rotateY(-60deg) scale(0.9);

	-ms-transform: rotateY(-60deg) scale(0.9);

	transform: rotateY(-60deg) scale(0.9);

}





#cyclepages ul li#main1 {

	background:url(../images/top/main1_wide.jpg) no-repeat;

}

#cyclepages ul li#main2 {

	background:url(../images/top/main2_wide.jpg) no-repeat;

}

#cyclepages ul li#main3 {

	background:url(../images/top/main3_wide.jpg) no-repeat;

}

#cyclepages ul li#main4 {

	background:url(../images/top/main4_wide.jpg) no-repeat;

}



#btn_prev {

	width:66px;

	height:66px;

	position:absolute;

	top:177px;

	left:0px;

	margin-left:-100px;

}



#btn_next {

	width:66px;

	height:66px;

	position:absolute;

	top:177px;

	left:974px;

}



#btn_prev img:hover,

#btn_next img:hover {

	cursor:pointer;

}