* { margin: 0; padding: 0; }
body { height: 6000px; }
.lift-nav { position: fixed; top: 15px; left: 30px; display: none; }
.lift-nav li { width: 10px; height: 10px; text-align: center; line-height: 10px; color: #fff; padding: 10px 10px; margin-bottom: 8px; background: aqua; cursor: pointer; }

.lift-nav li.current { background: pink; }

.t1, .t2, .t3, .t4, .t5, .t6,
.t7, .t8, .t9, .t10, .t11, .t12,
.t13, .t14, .t15, .t16, .t17, .t18,
.t19, .t20, .t21, .t22, .t23, .t24 { width: 800px; height: 400px; text-align: center; line-height: 400px; background: skyblue; margin: 100px auto; font-size: 30px; color: #fff; }
span { display: inline-block; margin-right: 200px; font-size: 50px; font-weight: 700; }
.t1 { margin-top: 100px; }
.t2 { background: pink; }
.t3 { background: tomato; }
.t4 { background: grey; }
.t5 { background: yellow; }
.t6 { background: seagreen; }
.t7 { background: Bisque; }
.t8 { background: BlueViolet; }
.t9 { background: Aqua; }
.t10 { background: Brown; }
.t11 { background: Chartreuse; }
.t12 { background: Crimson; }
.t13 { background: IndianRed; }
.t14 { background: GoldenRod; }
.t15 { background: Fuchsia; }
.t16 { background: DeepPink; }
.t17 { background: YellowGreen; }
.t18 { background: Turquoise; }
.t19 { background: SlateGray; }
.t20 { background: Salmon; }
.t21 { background: RoyalBlue; }
.t22 { background: PaleVioletRed; }
.t23 { background: Gold; }
.t24 { background: Chocolate; margin-bottom: 500px; }