html {
	min-height: 100%; background-color: #333333;
}
body {
	font: bold 16px/normal "PT Sans", Helvetica, Arial, sans-serif; margin: 0px auto; width: 1000px; color: rgb(3, 70, 153); font-size-adjust: none; font-stretch: normal;
}
header {
	display: block;
}
hgroup {
	display: block;
}
article {
	display: block;
}
section {
	display: block;
}
aside {
	display: block;
}
#title {
	font: 60px/normal Helvetica, Arial, sans-serif; margin: 40px 0px 20px; text-align: center; color: rgb(238, 238, 238); font-size-adjust: none; font-stretch: normal; text-shadow: 1px 1px 5px rgba(0, 0, 0, 0.7);
}
#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 "Helvetica Neue", Helvetica, Arial, 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; behavior: url(PIE.htc); 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); background-color: rgb(201, 201, 201); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), inset 0 1px 1px rgba(255, 255, 255, 0.7); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), inset 0 1px 1px rgba(255, 255, 255, 0.7); -moz-border-radius: 15px; -webkit-border-radius: 15px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); -pie-background: linear-gradient(top, #ededed, #888888);
}
#demo-nav li:active {
	-pie-background: linear-gradient(top, #888888, #ededed);
}
#demo-nav li.active {
	-pie-background: linear-gradient(top, #888888, #ededed);
}
#demo-nav a {
	color: rgb(68, 68, 68); text-decoration: none;
}
.tooltip {
	background: url("../images/white_arrow.png") no-repeat; font: 12px/normal "Helvetica Neue", Helvetica, Arial, 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;
}
.prev.slider-nav {
	background: url("../images/left-arrow.png") no-repeat; left: -17px;
}
.next.slider-nav {
	background: url("../images/right-arrow.png") no-repeat; right: -17px;
}
.slider-timer {
	width: 20px; height: 30px;
}
.play.slider-timer {
	background: url("../images/slider-play.png") no-repeat center;
}
.pause.slider-timer {
	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); -moz-box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.8); -webkit-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", "Helvetica Neue", Helvetica, Arial, sans-serif; text-align: center; color: rgb(58, 97, 168); margin-bottom: 40px; font-size-adjust: none; font-stretch: normal; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
}
#description p {
	margin: 20px 0px 40px; color: rgb(51, 51, 51); text-shadow: 0 1px 0 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: 0 1px 0 rgba(255, 255, 255, 0.5);
}
#browsers li {
	margin: 0px 0px 10px 20px; color: rgb(51, 51, 51); text-shadow: 0 1px 0 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", Helvetica, Arial, sans-serif; color: rgb(51, 51, 51); margin-bottom: 10px; font-size-adjust: none; font-stretch: normal; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.effectType {
	background: url("../images/button.png") no-repeat; font: bold 14px/30px "Helvetica Neue", Helvetica, Arial, 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: 0 -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: 0 1px 0 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 "Lucida Sans Unicode", "Lucida Grande", sans-serif; margin: 20px auto 0px; border-radius: 5px; width: 150px; height: 34px; color: rgb(102, 102, 102); position: relative; cursor: pointer; behavior: url(PIE.htc); font-size-adjust: none; font-stretch: normal; box-shadow: 1px 1px 2px rgba(0,0,0,0.7); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 1px 1px 0 #eee;
}
.selected::after {
	border-width: 5px; border-style: solid; border-color: rgb(102, 102, 102) transparent transparent; top: 50%; right: 5px; margin-top: -3px; position: absolute; content: "";
}
.active.selected::after {
	border-width: 5px; border-style: solid; border-color: transparent transparent rgb(102, 102, 102); margin-top: -8px; content: "";
}
.dropDown {
	background: rgb(34, 34, 34); font: 14px/normal "Helvetica Neue", Helvetica, Arial, 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);
}