Links table #3 Step 1

/*CODES BY PAINTHEMES*/

#links{
padding:10px;
width:145px;
border:1px solid #000; /*border of your first box*/
background:#fff; /*background of your first box*/
height:240px;
overflow:auto;
line-height:15px;
}

#tags{
padding:10px;
width:145px;
border:1px solid #000; /*border of your second box*/
background:#fff; /*background of your second  box*/
line-height:15px;
height:240px;
overflow:auto;
margin-left:180px;
margin-top:-262px;
}

#social{
padding:10px;
width:145px;
border:1px solid #000; /*border of your box 3*/
background:#fff; /*background of your box 3*/
line-height:15px;
height:240px;
overflow:auto;
margin-left:360px;
margin-top:-262px;
}

#links a, #tags a, #social a{
display:block;
padding:5px;
width:auto;
text-transform:uppercase;
font-size:8px; /*size of letters*/
font-family:calibri; /*font family of your links, calibri only works with windows*/
text-align:left;
color:#000; /*color links*/
letter-spacing:2px; /*spacing between letters*/
margin-top:-1px;
-webkit-transition:all 0.3s ease-out;
}

#links a:hover, #tags a:hover, #social a:hover{
background:#000; /*background hover*/
color:#fff; /*color hover*/
}

#links a:before, #tags a:before, #social a:before{
content:'';
height:1px;
width:10px;
display:inline-block;
background:#000; /*color of the ―*/
position:relative;
top:-2px;
margin-right:5px;
-webkit-transition:all 0.3s ease-out;
}

#links a:hover:before, #tags a:hover:before, #social a:hover:before{
width:31px;
background:#fff; /*color hover of the ― */
-webkit-transition:all 0.3s ease-out;
}

/*CODES BY PAINTHEMES*/