.tags{
    margin:0;
    padding:0;
    /* position:absolute; */
    right:24px;
    bottom:-12px;
    list-style:none;
}

.tags li, .tags a{

    float:left;
    /* height:24px; */
    line-height:24px;
    position:relative;
    /* font-size:15px; */
}

.tags a{
    margin-top: 10px;
    margin-left:20px;
    padding:0 10px 0 12px;
    background:#009385;
    color:#fff;
    text-decoration:none;
    -moz-border-radius-bottomright:4px;
    -webkit-border-bottom-right-radius:4px;	
    border-bottom-right-radius:4px;
    -moz-border-radius-topright:4px;
    -webkit-border-top-right-radius:4px;	
    border-top-right-radius:4px;	
} 

.tags a:before{
    content:"";
    float:left;
    position:absolute;
    top:0;
    left:-12px;
    width:0;
    height:0;
    border-color:transparent #009385 transparent transparent;
    border-style:solid;
    border-width:12px 12px 12px 0;		
}

.tags a:after{
    content:"";
    position:absolute;
    top:10px;
    left:0;
    float:left;
    width:4px;
    height:4px;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    background:#fff;
    -moz-box-shadow:-1px -1px 2px #004977;
    -webkit-box-shadow:-1px -1px 2px #004977;
    box-shadow:-1px -1px 2px #004977;
}

.tags a:hover{color:#fff;}	

.tags a:hover{background:#555;}	

.tags a:hover:before{border-color:transparent #555 transparent transparent;}

@media (max-width: 500px) {
    .tags a {
        margin-top: 0;
        font-size: 14px;
        margin-left: 5px;
        padding: 0px 10px 0 12px;
    }
    .tags li, .tags a {
        float: left;
        /* height: 24px; */
        line-height: 24px;
        position: relative;
        font-size: 14px;
    }
}