.container { width: 80%; height: 80%; left: 10%; top:10%; position:absolute; background-color: #eee; background: -webkit-gradient(linear, left bottom, left top, from(#bbd), to(#fff)); background: -moz-linear-gradient(bottom, #bbd, #fff); background: linear-gradient(bottom, #bbd, #fff); -webkit-border-radius: 15px; -khtml-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); -moz-box-shadow: 8px 7px 15px #000000; -webkit-box-shadow: 8px 7px 15px #000000; box-shadow: 8px 7px 15px #000000; -webkit-transition: -webkit-transform 1s ease-in-out; -moz-transition: -moz-transform 1s ease-in-out; -o-transition: -o-transform 1s ease-in-out; transition: transform 1s ease-in-out; } #maincontainer { width: 100%; height: 100%; left: 0; top: 0; position: absolute; overflow: hidden; /*overflow: visible;*/ -webkit-transition: -webkit-transform 1s ease-in-out; -moz-transition: -moz-transform 1s ease-in-out; -o-transition: -o-transform 1s ease-in-out; transition: transform 1s ease-in-out; } .zoomed { -moz-transform: translate(-20%,-20%) scale(0.5); -webkit-transform: translate(-20%,-20%) scale(0.5); -o-transform: translate(-20%,-20%) scale(0.5); transform: translate(-20%,-20%) scale(0.5); } .second { margin-left:85%; } .third { -moz-transform: translate(0%, 105%); -o-transition: translate(0%, 105%); -webkit-transform: translate(0%, 105%); transform: translate(0%, 105%); background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#bbd)); background: -moz-linear-gradient(bottom, #fff, #bbd); background: linear-gradient(bottom, #fff, #bbd); } .forth { margin-left:85%; -moz-transform: translate(0%, 105%); -o-transition: translate(0%, 105%); -webkit-transform: translate(0%, 105%); transition: translate(0%, 105%); background: -webkit-gradient(linear, left bottom, left top, from(#fff), to(#bbd)); background: -moz-linear-gradient(bottom, #fff, #bbd); background: linear-gradient(bottom, #fff, #bbd); } .navImgclick { cursor: pointer; }