.page-home .container { width:100%; padding:0px; margin:0px; } #ctl00_ctl00_ContentPlaceHolder1_ContentPlaceHolder1_pnlCustomContent { width:100%; margin-top:15%; } #ContentPlaceHolder1_ContentPlaceHolder1_pnlCustomContent{ width:100%; margin-top:15%; } .page-home .inside-page-content { height: 90vh; /* for touch screen */ touch-action: none; } .page-home .inside-page-content { overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; background: #111; -webkit-perspective: 1000px; perspective: 1000px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } #drag-container, #spin-container { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; margin: auto; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-10deg); transform: rotateX(-10deg); } #drag-container img { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: absolute; left: 0; top: 0; width: 100%; height: 100%; line-height: 200px; font-size: 50px; text-align: center; -webkit-box-shadow: 0 0 8px #fff; box-shadow: 0 0 8px #fff; -webkit-box-reflect: below 10px linear-gradient(transparent, transparent, #0005); } #drag-container img:hover{ -webkit-box-shadow: 0 0 15px #fffd; box-shadow: 0 0 15px #fffd; -webkit-box-reflect: below 10px linear-gradient(transparent, transparent, #0007); } #drag-container p { font-family: Serif; position: absolute; top: 100%; left: 50%; -webkit-transform: translate(-50%,-50%) rotateX(90deg); transform: translate(-50%,-50%) rotateX(90deg); color: #fff; } #ground { width: 900px; height: 900px; position: absolute; top: 100%; left: 50%; -webkit-transform: translate(-50%,-50%) rotateX(90deg); transform: translate(-50%,-50%) rotateX(90deg); background: -webkit-radial-gradient(center center, farthest-side , #9993, transparent); } @-webkit-keyframes spin { from{ -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } to{ -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } @keyframes spin { from{ -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } to{ -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } } @-webkit-keyframes spinRevert { from{ -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } to{ -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } } @keyframes spinRevert { from{ -webkit-transform: rotateY(360deg); transform: rotateY(360deg); } to{ -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } }