service box style : demo 72

Web Design

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam cumque, cupiditate debitis dolorem et fugit hic iusto maxime numquam officia.

Brand Building

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam cumque, cupiditate debitis dolorem et fugit hic iusto maxime numquam officia.

Responsive Design

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam cumque, cupiditate debitis dolorem et fugit hic iusto maxime numquam officia.

HTML

                        

Web Design

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam cumque, cupiditate debitis dolorem et fugit hic iusto maxime numquam officia.

Brand Building

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam cumque, cupiditate debitis dolorem et fugit hic iusto maxime numquam officia.

CSS

                        .serviceBox{
                            z-index: 1;
                            position: relative;
                        }
                        .serviceBox .service-content{
                            padding: 20px;
                            background: #fff;
                            border: 2px solid #000;
                            text-align: center;
                            position: relative;
                        }
                        .serviceBox .service-content:after{
                            content: "";
                            width: 100%;
                            height: 100%;
                            background: #4f00d6;
                            position: absolute;
                            top: 10px;
                            left: 10px;
                            z-index: -1;
                            transition: all 0.5s ease 0s;
                        }
                        .serviceBox:hover .service-content:after{
                            top: 0;
                            left: 0;
                        }
                        .serviceBox .service-icon{
                            display: inline-block;
                            font-size: 50px;
                            color: #4f00d6;
                            margin-bottom: 20px;
                            transition: all 0.5s ease 0s;
                        }
                        .serviceBox:hover .service-icon{ transform: rotateY(180deg); }
                        .serviceBox .title{
                            font-size: 20px;
                            font-weight: 600;
                            color: #474747;
                            text-transform: uppercase;
                            margin: 0 0 10px 0;
                        }
                        .serviceBox .description{
                            font-size: 15px;
                            color: #777;
                            line-height: 25px;
                            margin-bottom: 0;
                        }
                        @media only screen and (max-width:990px){
                            .serviceBox{ margin-bottom: 30px; }
                        }
                    
License Terms