html,body {
	background: #c2edf4;
}

.container {
	width: 1000px;
	margin: 0 auto;
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAJUlEQVQIW2NkQAP/gYARWQwkAOLDBeECjEAAkkEWAKtEFwAJAgAZEBP+oM1IkwAAAABJRU5ErkJggg==) repeat-y 165px 0;
}

/* 默认样式 */
.timeline li {
	height: 160px;
	position: relative;
}

.timeline li div {
	position: absolute;
}

.timeline .check .spring {
	position: absolute;
	display: block;
	width: 51px;
	height: 6px;
	left: 105px;
	top: 47px;
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAAPElEQVQYV2NkQAP/gYARCNDFUQRgirAphitEl0TngxXisg5ZnBGXIpgbYfIYjkb3BNxGbBLYxIgyEaQRAA8KKAWYsZtjAAAAAElFTkSuQmCC);
}

.timeline .check s {
	position: absolute;
	display: block;
	left: 157px;
	top: 40px;
	width: 16px;
	height: 16px;
	border: 3px solid #41838E;
	background: #fff url(../images/sprite.png) 1px -100px;
	cursor: pointer;
}

.timeline .check .line {
	position: absolute;
	width: 38px;
	height: 1px;
	background: #fff;
	left: 180px;
	top: 50px;
	font-size: 1px;
}

.timeline .thumb {
	width: 82px;
	top: 13px;
	left: 32px;
}

.timeline .thumb img {
	width: 72px;
	height: 72px;
	border: 5px solid #41838E;
}

.timeline .thumb span {
	display: block;
	height: 30px;
	line-height: 30px;
	color: #41838E;
	text-align: center;
	font-size: 12px;
	font-family: Arial black;
}

.timeline .content {
	left: 234px;
	top: 10px;
	width: 730px;
	border-left: 5px solid #41838E;
	background: #fff;
}

.timeline .content h3{
	margin: 23px 15px;
	font-size: 30px;
	font-family: microsoft yahei;
}

.timeline .content p {
	display: none;
}

.timeline .content b {
	position: absolute;
	display: block;
	width: 17px;
	height: 34px;
	background: url(../images/sprite.png);
	left: -21px;
	top: 25px;
}

/* 高亮样式 */
.timeline li.active {
	height: 230px;
}

.timeline li.active div {
	position: absolute;
}

.timeline .active .check .spring {
	left: 106px;
	top: 47px;
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAAPUlEQVQYV2NkQAOfUjX+882+wYgujiIAU4RNMVwhuiQ6H6wQl3XI4oy4FMHcCJPHcDS6J2A2EqUQpJhohQBbNyaHFmzEqgAAAABJRU5ErkJggg==);
}

.timeline .active .check s {
	left: 152px;
	top: 36px;
	width: 20px;
	height: 20px;
	border: 5px solid #fff;
	background: #F26328 url(../images/sprite.png) 2px -200px;
	cursor: pointer;
}

.timeline .active .check .line {
	background: #F26328;
	width: 43px;
	left: 176px;
	top: 50px;
}

.timeline .active .thumb {
	width: 110px;
	top: 10px;
	left: -10px;
}

.timeline .active .thumb img {
	width: 100px;
	height: 100px;
	border: 8px solid #F26328;
}

.timeline .active .thumb span {
	color: #F26328;

}

.timeline .active .content {
	border-left: 5px solid #F26328;
}

.timeline .active .content p {
	display: block;
	margin: 23px 15px;
	line-height: 1.5;
	font-size: 14px;
}

.timeline .active .content b {
	background: url(../images/sprite.png) 0 -43px;
	left: -20px;
}