#slider {
	margin: 0px auto; width: 100%; height: 550px; box-shadow: 0px 5px 15px rgba(0,0,0,0.7);
}
#slidehtml1 h1 {
	font: 500 30px/normal "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif; margin: 7% 0px 1% 4.5%; width: 500px; color: rgb(255, 221, 85); letter-spacing: 1px; font-size-adjust: none; font-stretch: normal; text-shadow: 1px 2px 1px rgba(0,0,0,0.5); background-color: rgba(0, 0, 0, 0.6);
}
#slidehtml2 h3 {
	font: 500 30px/normal "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif; margin: 7% 0px 1% 4.5%; width: 500px; color: rgb(255, 221, 85); letter-spacing: 1px; font-size-adjust: none; font-stretch: normal; text-shadow: 1px 2px 1px rgba(0,0,0,0.5); background-color: rgba(0, 0, 0, 0.6);
}
#slidehtml1 p {
	font: 20px/normal "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif; margin: 0px 0px 1.5% 4.5%; width: 280px; color: rgb(255, 255, 255); font-size-adjust: none; font-stretch: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}
#slidehtml2 p {
	font: 20px/normal "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif; margin: 0px 0px 1.5% 4.5%; width: 280px; color: rgb(255, 255, 255); font-size-adjust: none; font-stretch: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}
#slidehtml1 strong {
	color: rgb(255, 214, 51); font-weight: bold; margin-left: 10px; position: relative;
}
#slidehtml1 a {
	font: 16px/30px Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; margin: 2% 0px 0px 4.5%; border-radius: 20px; border: 1px solid rgb(170, 170, 170); border-image: none; width: 120px; height: 30px; text-align: center; color: rgb(255, 255, 255); display: block; cursor: pointer; font-size-adjust: none; font-stretch: normal; box-shadow: 0px 1px 2px rgba(0,0,0,0.5); text-shadow: 0px -1px 1px rgba(0,0,0,0.7); background-image: -ms-linear-gradient(rgb(100, 100, 100), rgb(20, 20, 20)); background-color: rgb(68, 68, 68); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -webkit-border-radius: 20px; -moz-border-radius: 20px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
#slidehtml2 a {
	font: 16px/30px Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; margin: 2% 0px 0px 4.5%; border-radius: 20px; border: 1px solid rgb(170, 170, 170); border-image: none; width: 120px; height: 30px; text-align: center; color: rgb(255, 255, 255); display: block; cursor: pointer; font-size-adjust: none; font-stretch: normal; box-shadow: 0px 1px 2px rgba(0,0,0,0.5); text-shadow: 0px -1px 1px rgba(0,0,0,0.7); background-image: -ms-linear-gradient(rgb(100, 100, 100), rgb(20, 20, 20)); background-color: rgb(68, 68, 68); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); -webkit-border-radius: 20px; -moz-border-radius: 20px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
#demo-description {
	font: 20px/normal "PT Sans", Georgia, Times, serif; margin: 60px auto; width: 90%; color: rgb(255, 255, 255); max-width: 900px; font-size-adjust: none; font-stretch: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}
#subtitle {
	font: italic 18px/normal Georgia, serif; text-align: center; color: rgb(204, 204, 204); font-size-adjust: none; font-stretch: normal; text-shadow: 1px 1px 2px rgba(0,0,0,0.7);
}
#demo-nav {
	text-align: center; margin-top: 40px;
}
#demo-nav li {
	font: bold 12px/25px Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; border-radius: 15px; width: 80px; height: 25px; text-align: center; color: rgb(68, 68, 68); margin-right: 5px; display: inline-block; cursor: pointer; font-size-adjust: none; font-stretch: normal; box-shadow: 0px 1px 2px rgba(0,0,0,0.9), inset 0px 1px 1px rgba(255,255,255,0.7); text-shadow: 0px 1px 0px rgba(255,255,255,0.5); background-image: -ms-linear-gradient(rgb(237, 237, 237), rgb(136, 136, 136)); background-color: rgb(201, 201, 201); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), inset 0 1px 1px rgba(255, 255, 255, 0.7); -webkit-border-radius: 15px; -moz-border-radius: 15px; -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), inset 0 1px 1px rgba(255, 255, 255, 0.7); -pie-background: linear-gradient(top, #ededed, #888); behavior: url(PIE.htc);
}
#demo-nav li:active {
	background-image: -ms-linear-gradient(rgb(136, 136, 136), rgb(237, 237, 237)); -pie-background: linear-gradient(top, #888, #ededed);
}
#demo-nav li.active {
	background-image: -ms-linear-gradient(rgb(136, 136, 136), rgb(237, 237, 237)); -pie-background: linear-gradient(top, #888, #ededed);
}
#demo-nav a {
	color: rgb(68, 68, 68); text-decoration: none;
}
.tooltip {
	background: url("../images/white_arrow.png") no-repeat; font: 12px/normal Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; padding: 20px; width: 169px; height: 82px; color: rgb(68, 68, 68); font-size-adjust: none; font-stretch: normal;
}
#slider {
	background: url("../images/loading.gif") no-repeat center rgb(255, 255, 255); position: relative; z-index: 10;
}
.slider3d {
	margin: 60px auto 40px; width: 700px; height: 400px;
}
.slider2d {
	width: 600px; height: 300px;
}
#slider2d-frame {
	background: url("../images/2dslider-frame.png") no-repeat; margin: 60px auto 40px; padding: 16px 76px 26px; top: -20px; width: 600px; height: 300px; position: relative; z-index: 10;
}
.fallback#slider {
	margin: 60px auto 82px; top: -20px;
}
#slider img {
	visibility: hidden;
}
a.slider-nav {
	top: 50%; width: 35px; height: 34px; margin-top: -17px;
}
.slider-nav.prev {
	background: url("../images/left-arrow.png") no-repeat; left: -17px;
}
.slider-nav.next {
	background: url("../images/right-arrow.png") no-repeat; right: -17px;
}
.slider-timer {
	width: 20px; height: 30px;
}
.slider-timer.play {
	background: url("../images/slider-play.png") no-repeat center;
}
.slider-timer.pause {
	background: url("../images/slider-pause.png") no-repeat center;
}
.slider3d .control-links {
	margin-top: -20px;
}
.slider2d .control-links {
	bottom: -50px;
}
.fallback#slider .control-links {
	bottom: -50px;
}
.control-links li {
	background: url("../images/link-bg.png") no-repeat; width: 15px; height: 15px; text-indent: -99999px; margin-left: 5px; cursor: pointer;
}
.control-links li.active {
	background: url("../images/link-active.png") no-repeat;
}
.slider-caption {
	background: rgba(255, 255, 255, 0.7); color: rgb(0, 0, 0);
}
.slider-caption a {
	color: rgb(45, 98, 148);
}
#main {
	background: url("../images/description-bg.jpg") repeat-y rgb(206, 211, 218); margin: 0px auto 40px; padding: 40px 30px 20px; width: 840px; position: relative; box-shadow: inset 0px 0px 6px rgba(255,255,255,0.8); -webkit-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.8); -moz-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.8);
}
#main::before {
	background: url("../images/perspective.png") no-repeat; left: -50px; top: -180px; width: 1000px; height: 218px; position: absolute; content: "";
}
#description {
	width: 400px;
}
#description h3 {
	font: 42px/normal "Oswald", Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; text-align: center; color: rgb(58, 97, 168); margin-bottom: 40px; font-size-adjust: none; font-stretch: normal; text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
}
#description p {
	margin: 20px 0px 40px; color: rgb(51, 51, 51); text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
#description ul {
	margin: 20px 0px 40px;
}
#features li {
	margin: 0px 0px 10px 20px; color: rgb(51, 51, 51); text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
#browsers li {
	margin: 0px 0px 10px 20px; color: rgb(51, 51, 51); text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
#effects {
	top: 40px; width: 400px; text-align: center; right: 30px; position: absolute;
}
#effects h3 {
	font: 20px/normal "PT Sans", "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif; color: rgb(51, 51, 51); margin-bottom: 10px; font-size-adjust: none; font-stretch: normal; text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
.effectType {
	background: url("../images/button.png") no-repeat; font: bold 14px/30px Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; margin: 30px 20px 20px; width: 102px; height: 33px; text-align: center; color: rgb(255, 255, 255); text-decoration: none; display: inline-block; position: relative; cursor: pointer; font-size-adjust: none; font-stretch: normal; text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
}
.effectType:active {
	top: 1px;
}
#effect3d {
	left: 50%; top: 82px; position: absolute;
}
#effect2d {
	left: 50%; top: 82px; position: absolute;
}
#effect3d {
	width: 330px; margin-left: -165px;
}
#effect2d {
	width: 150px; margin-left: -75px; display: none;
}
#no-3d {
	color: rgb(51, 51, 51); display: none; text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}
.effectList {
	width: 150px; height: 34px; margin-bottom: 20px; float: left;
}
#sliceList {
	width: 150px; height: 34px; margin-bottom: 20px; float: left;
}
#sliceList {
	margin-left: 30px;
}
.selected {
	background: url("../images/selected.jpg") repeat-x rgb(204, 204, 204); font: 13px/34px Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; margin: 20px auto 0px; border-radius: 5px; width: 150px; height: 34px; color: rgb(102, 102, 102); position: relative; cursor: pointer; font-size-adjust: none; font-stretch: normal; box-shadow: 1px 1px 2px rgba(0,0,0,0.7); text-shadow: 1px 1px 0px #eee; -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); -webkit-border-radius: 5px; -moz-border-radius: 5px; -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); behavior: url(PIE.htc);
}
.selected::after {
	border-width: 5px; border-style: solid; border-color: rgb(102, 102, 102) transparent transparent; border-image: none; top: 50%; right: 5px; margin-top: -3px; position: absolute; content: "";
}
.selected.active::after {
	border-width: 5px; border-style: solid; border-color: transparent transparent rgb(102, 102, 102); border-image: none; margin-top: -8px; content: "";
}
.dropDown {
	background: rgb(34, 34, 34); font: 14px/normal Tahoma, Helvetica, Arial, "Microsoft YaHei", "Hiragino Sans GB", 宋体, "宋体", sans-serif; color: rgb(255, 255, 255); display: none; position: relative; z-index: 10; font-size-adjust: none; font-stretch: normal;
}
.dropDown li {
	height: 30px; line-height: 30px; cursor: pointer;
}
.dropDown li:hover {
	background: rgb(39, 71, 114);
}
@media all and (max-width:991px)
{
#slidehtml1 h1 {
	font-size: 25px;
}
#slidehtml2 h3 {
	font-size: 25px;
}
}
@media all and (max-width:600px)
{
#slidehtml1 h1 {
	width: 280px; font-size: 18px;
}
#slidehtml2 h3 {
	width: 280px; font-size: 18px;
}
}