.dg-container{ width: 100%; /*height: 450px;*/ position: relative; } .dg-wrapper{ width: 481px; height: 316px; margin: 0 auto; position: relative; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-perspective: 1000px; -moz-perspective: 1000px; -o-perspective: 1000px; -ms-perspective: 1000px; perspective: 1000px; } .dg-wrapper a{ /*width: 482px;*/ min-height: 316px; display: block; position: absolute; left: 0; top: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #f6f7f8; padding: 30px 40px; color: black; } .dg-wrapper a.dg-transition{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .dg-wrapper a img{ /*display: block;*/ /*padding: 41px 0px 0px 1px;*/ } .dg-wrapper a div{ font-style: italic; text-align: center; line-height: 50px; text-shadow: 1px 1px 1px rgba(255,255,255,0.5); color: #333; font-size: 16px; width: 100%; bottom: -55px; display: none; position: absolute; } .dg-wrapper a.dg-center div{ display: block; } .dg-container nav{ width: 58px; position: absolute; z-index: 1000; bottom: 40px; left: 50%; margin-left: -29px; } /*.dg-container nav span{*/ /* text-indent: -9000px;*/ /* float: left;*/ /* cursor:pointer;*/ /* width: 24px;*/ /* height: 25px;*/ /* opacity: 0.8;*/ /*background: transparent url(../images/arrows.png) no-repeat top left;*/ /*}*/ /*.dg-container nav span:hover{*/ /* opacity: 1;*/ /*}*/ /*.dg-container nav span.dg-next{*/ /* background-position: top right;*/ /* margin-left: 10px;*/ /*}*/