User:Fij30jigh110/view.css

.view:hover .s2{ -webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg); -moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg); -o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg); -ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg); transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg); } .view:hover .s3, .view:hover .s5{ -webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg); -moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg); -o-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg); -ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg); transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg); } .view:hover .s4{ -webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg); -moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg); -o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg); -ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg); transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg); }

.view .s1 > .overlay { background: -moz-linear-gradient(right, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%); }

.view .s2 > .overlay { background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%); background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%); background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%); background: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%); }

.view .s3 > .overlay { background: -moz-linear-gradient(right, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%); background: -webkit-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%); background: -o-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%); background: -ms-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%); background: linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%); }

.view .s4 > .overlay { background: -moz-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%); }

.view .s5 > .overlay { background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -o-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: -ms-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%); }