.service-box{
            position: relative;
            float: left;
            overflow: hidden;
            perspective:1000px;
            -webkit-perspective:1000px;
        }
        .service-icon{
            padding: 0px;
            text-align: center;
            transition: all .5s ease;
        }

        .service-content{
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            opacity: 0;
            text-align: center;
            transition: all .5s ease;
            background-color: #fff;
            backface-visibility:hidden;
            transform-style: preserve-3d;
            -webkit-transform: translateY(110px) rotateX(-90deg);
            -moz-transform: translateY(110px) rotateX(-90deg);
            -ms-transform: translateY(110px) rotateX(-90deg);
            -o-transform: translateY(110px) rotateX(-90deg);
            transform: translateY(110px) rotateX(-90deg);
        }
 

        .service-box .service-icon .front-content img {
            margin-bottom: 10px;
            background-color: transparent;
            border: 10px solid #fff;
	box-shadow:0 0 5px rgba(0,0,0,0.2);
	-moz-box-shadow:0 0 5px rgba(0,0,0,0.2);
	-webkit-box-shadow:0 0 5px rgba(0,0,0,0.2);
	-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;
        }

        .service-box .service-icon .front-content h3 {
            display: none;
        }
        .service-box .service-content h3 {
            font-size: 18px;
            background: transparent;
            margin-top: 10px;
            text-transform: uppercase;
        }
        .service-box .service-content p {
            font-size: 14px;
            padding: 10px;
            padding-top: 0px;
            margin:0;
        }

        .service-box:hover .service-icon{
            opacity: 0;
            -webkit-transform: translateY(-110px) rotateX(90deg);
            -moz-transform: translateY(-110px) rotateX(90deg);
            -ms-transform: translateY(-110px) rotateX(90deg);
            -o-transform: translateY(-110px) rotateX(90deg);
            transform: translateY(-110px) rotateX(90deg);
        }
        .service-box:hover .service-content {
            opacity: 1;
            -webkit-transform: rotateX(0);
            -moz-transform: rotateX(0);
            -ms-transform: rotateX(0);
            -o-transform: rotateX(0);
            transform: rotateX(0);
        }