@charset "utf-8";
.button{
width: 55px;
height:30px;
line-height: 15px;
text-align: center;
font-weight: bold;
color: #fff;
font-size:12px;
border-radius: 3px;
position: relative;
overflow: hidden;
top:-4px;
}

.button.red{
border:1px solid #0349B0;
background: -webkit-linear-gradient(top,#0351BF,#0349B0);
background: -moz-linear-gradient(top,#0351BF,#0349B0);
background: linear-gradient(top,#0351BF,#0349B0);
}

.button.rarrow,
.button.larrow{
overflow:visible;
}
.rarrow:after,	
.rarrow:before,
.larrow:after,	
.larrow:before{
position:absolute;
content: "";
display: block;
width: 21px;
height: 21px;
-webkit-transform:rotate(45deg);
-moz-transform:rotate(45deg);
transform:rotate(45deg);
}

.larrow:after{
top: 3px;
left: -10px;
}
.red.larrow:after{
border-left:1px solid #0349B0;
border-bottom:1px solid #0349B0;
border-top:none;
border-right:none;
border-radius: 5px;
background:-webkit-linear-gradient(top left,#0351BF,#0349B0);
background:-moz-linear-gradient(top left,#0351BF,#0349B0);
background:linear-gradient(top left,#0351BF,#0349B0);
}
.red:hover{
background: -webkit-linear-gradient(top,#0349B0,#0351BF);
background: -moz-linear-gradient(top,#0349B0,#0351BF);
background: linear-gradient(top,#0349B0,#0351BF);
}

.red.rarrow:hover:after,
.red.larrow:hover:after{
background:-webkit-linear-gradient(top left,#0349B0,#0351BF);
background:-moz-linear-gradient(top left,#0349B0,#0351BF);
background:linear-gradient(top left,#0349B0,#0351BF);
}