/** Stage container **/ .connected-carousels .stage { width: 400px; margin: 0 auto; position: relative; } .connected-carousels .photo-credits { position: absolute; right: 15px; bottom: 0; font-size: 13px; color: #fff; text-shadow: 0 0 1px rgba(0, 0, 0, 0.85); opacity: .66; } .connected-carousels .photo-credits a { color: #fff; } /** Navigation container **/ .connected-carousels .navigation { width: 340px; margin: 20px auto 0px auto; position: relative; } /** Shared carousel styles **/ .connected-carousels .carousel { overflow: hidden; position: relative; } .connected-carousels .carousel ul { width: 20000em; position: relative; list-style: none; margin: 0; padding: 0; } .connected-carousels .carousel li { float: left; width: 400px; } .connected-carousels .carousel li a { display: block; } /** Stage carousel specific styles **/ .connected-carousels .carousel-stage { height: 400px; } .carousel-stage img{max-width: 396px;max-height:396px;} .carousel-stage span{width: 400px;height: 400px;border: solid 1px #dedede;padding:1px;margin: 0 auto; /*闈濱E鐨勪富娴佹祻瑙堝櫒璇嗗埆鐨勫瀭鐩村眳涓殑鏂规硶*/ display: table-cell; vertical-align:middle; /*璁剧疆姘村钩灞呬腑*/ text-align:center; /* 閽堝IE鐨凥ack */ *display: block; *font-size: 175px;/*绾︿负楂樺害鐨?.873锛?00*0.873 绾︿负175*/ *font-family: Arial, serif;/*闃叉闈瀠tf-8寮曡捣鐨刪ack澶辨晥闂锛屽utf-8缂栫爜*/ position: relative; line-height: 0; } /** Navigation carousel specific styles **/ .connected-carousels .carousel-navigation { height: 66px; width: 340px; } .connected-carousels .carousel-navigation li { cursor: pointer; margin-right: 13px; width: 60px; height: 60px; padding: 3px; border: 1px solid #c6c6c6; } .connected-carousels .carousel-navigation li img { display: block; margin: 0 auto; width: 52px; height: 52px; } .connected-carousels .carousel-navigation li.active img { border-color: #017cb8; } /** Stage carousel controls **/ .connected-carousels .prev-stage, .connected-carousels .next-stage { display: block; position: absolute; top: 0; width: 185px; height: 400px; color: #fff; } .connected-carousels .prev-stage { left: 0; } .connected-carousels .next-stage { right: 0; } .connected-carousels .prev-stage.inactive, .connected-carousels .next-stage.inactive { display: none; } .connected-carousels .prev-stage span, .connected-carousels .next-stage span { display: none; position: absolute; top: 50%; width: 30px; height: 30px; text-align: center; background: #017cb8; color: #fff; text-decoration: none; text-shadow: 0 0 1px #000; font: 24px/27px Arial, sans-serif; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; -webkit-box-shadow: 0 0 2px #999; -moz-box-shadow: 0 0 2px #999; box-shadow: 0 0 2px #999; } .connected-carousels .prev-stage span { left: 20px; } .connected-carousels .next-stage span { right: 20px; } .connected-carousels .prev-stage:hover span, .connected-carousels .next-stage:hover span { display: block; } /** Navigation carousel controls **/ .connected-carousels .prev-navigation, .connected-carousels .next-navigation { color: #EFEFEF; display: block; font: 58px Arial,sans-serif; height: 46px; line-height: 43px; position: absolute; text-decoration: none; width: 25px; text-align: center; z-index: 99; top: 10px; } .connected-carousels .prev-navigation {left: -35px;} .connected-carousels .next-navigation {right: -35px;} .connected-carousels .prev-navigation.inactive, .connected-carousels .next-navigation.inactive{opacity: .5;cursor: default;}