.banner1 { position: relative; /* height: 680px; */ /* padding: 50px; */ margin: 0 auto; text-align: center; padding:0 0 5%; } .dg-container { position: relative; /*width: 1200px;*/ height: 460px; margin:0 auto; /* background-color:red; */ } .dg-wrapper { width: 492px; height: 460px; margin: 0 auto; position: relative; transform-style: preserve-3d; perspective: 800px; } .dg-wrapper a { width: 550px; height: 460px; background-color:#fff; border:1px solid #dcdcdc; display: block; position: absolute; left: 0; top: 0; } .dg-wrapper a:first-child { z-index: 2; } .dg-wrapper a img { display: block; box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.20); border-radius: 4px; width: 433px; height: 297px; margin:40px auto 30px; background: #fff; } .dg-wrapper a.dg-transition { transition: all 0.5s ease-in-out; } .dg-wrapper a.dg-transition-fast { transition: all 0.2s ease-in-out; } /* .dg-container nav { display: none; } */ .dg-container nav span:hover { opacity: 1; } .dg-container nav span.dg-next { background-position: top right; } .dg-container #lightButton2 { bottom: 20px; } .dg-container .button { position: relative; z-index: 5; } .dg-container .button li { cursor: pointer; display: inline-block; width: 14px; height: 14px; border-radius: 50%; background: rgba(255, 255, 255, 0.30); border: 1px solid #ec6926; } .dg-container .button .light { background: #ec6926; }