buttons style : demo 23

CSS

                        .btn{
                            position: relative;
                            border-radius:0;
                            text-transform:uppercase;
                            border:1px solid #fff;
                            box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
                        }
                        .btn:after{
                            content:"";
                            position:absolute;
                            top:0;
                            left:0;
                            width:100%;
                            height:100%;
                            opacity:1;
                            border:1px solid #fff;
                            transform: scale(1.0,1.0);
                            transition: all 0.50s ease-in-out 0s;
                        }
                        .btn:hover:after{
                            opacity:0;
                            transform: scale(1.7,1.7);
                        }
                        .purple,
                        .purple:after{
                            border: 1px solid #580141;
                            color:#580141;
                        }
                        .purple:hover{
                            color:#580141;
                            border:1px solid #580141;
                            box-shadow: inset 0 0 20px rgba(88, 1, 65, .5), 0 0 20px rgba(88, 1, 65, .2);
                        }
                        .green,
                        .green:after{
                            border: 1px solid #396b1c;
                            color:#396b1c;
                        }
                        .green:hover{
                            color:#396b1c;
                            border:1px solid #396b1c;
                            box-shadow: inset 0 0 20px rgba(57, 107, 28, .5), 0 0 20px rgba(57, 107, 28, .2);
                        }
                        .orange,
                        .orange:after{
                            border: 1px solid #e67e22;
                            color:#e67e22;
                        }
                        .orange:hover{
                            color:#e67e22;
                            border:1px solid #e67e22;
                            box-shadow: inset 0 0 20px rgba(230, 126, 34, .5), 0 0 20px rgba(230, 126, 34, .2);
                        }
                        .blue,
                        .blue:after{
                            border: 1px solid #3498db;
                            color:#3498db;
                        }
                        .blue:hover{
                            color:#3498db;
                            border:1px solid #3498db;
                            box-shadow: inset 0 0 20px rgba(52, 152, 249, .5), 0 0 20px rgba(52, 152, 249, .2);
                        }
                        @media only screen and (max-width: 767px) {
                            .btn{
                                margin-bottom:15px;
                            }
                        }
                    
License Terms