/***********************************
	     MEMBER DIRECTORY
************************************/
#directory {
    width:350px; 
    margin-top:0px; 
    border-right:1px solid #999; 
    border-left:1px solid #999; 
    background:#ddd; 
    box-shadow:1px 1px 1px #ddd;
        }
#directory:first-child, #directory:last-child {
    border:1px solid #999; 
        }
#directory .member {
    position:relative; 
    display:inline-block; 
    width:340px; 
    padding:5px 5px 0 5px; 
    margin-top:5px;
        }    
#directory .banner {
    position:relative; 
    top:0; 
    left:-20px; 
    width:342px;  
    background:#8a8961; 
    padding:10px 0 9px 25px; 
    text-align:left; 
    font-family:'Fjalla One', sans-serif; 
    font-size:28px; 
    font-style:italic; 
    color:#fff;
        }
#directory .banner:before, #directory .banners:before {
    position:absolute; 
    content: '';
    height:0; 
    width:0; 
    top:32px; 
    left:0; 
    border-top:6px solid #666; 
    border-left:14px solid transparent;
        }
#directory .banner:after {
    position:absolute; 
    content: '';
    width: 0;
	height: 0;
    left:365px;
    top:0;
	border-top: 17px solid transparent;
	border-left: 20px solid #8a8961;
	border-bottom: 17px solid transparent;

        }
#directory .banners {
    position:relative; 
    top:0; 
    left:-20px; 
    width:342px; 
    background:#497e81; 
    padding:10px 0 9px 25px; 
    text-align:left; 
    font-family:'Fjalla One', sans-serif; 
    font-size:28px; 
    font-style:italic; 
    color:#fff;
        }
#directory .banners:after {
    position:absolute; 
    content: '';
    width: 0;
	height: 0;
    left:365px;
    top:0;
	border-top: 17px solid transparent;
	border-left: 20px solid #497e81;
	border-bottom: 17px solid transparent;

        }
#directory .banner i, .banners i {
    position:relative; 
    float:right; 
    top:-4px; 
    right:10px; 
    font-size:22px;
        }
#directory .characters {
    border-right:1px solid #999; 
    border-left:1px solid #999; 
    padding:10px 27px; 
    background:#eee; 
    text-align: center;
        }
#directory .characters div {
    position:relative; 
    display:inline-block; 
    width:50px; 
    height:50px; 
    margin:1px 0;
        }
#directory .characters img {
    width:50px; 
    height:50px; 
        }
#directory .characters img:hover {
    opacity:0.6;
        }
#directory .contacts {
    padding:3px; 
    background:#bbb; 
    font:11px calibri; 
    color:#000; 
    font-weight:bold; 
    letter-spacing:0px; 
    text-align: center;
    margin-bottom:7px; 
    border-right:1px solid #999; 
    border-left:1px solid #999; 
    border-bottom:1px solid #999;
        }  

#directory .characters .mortal {
    position:relative; 
    display:inline-block; 
    height:50px; 
    width:50px; 
    border:2px solid #995252;
    top:0px; 
    left:0; 
    background:#995252;
        }
#directory .characters .sempi {
    position:relative; 
    display:inline-block; 
    height:50px; 
    width:50px; 
    top:0px; 
    left:0; 
    background:#6c8c57;
    border:2px solid #6c8c57;
        }
#directory .characters .immortal {
    position:relative; 
    display:inline-block; 
    height:50px; 
    width:50px; 
    top:0px; 
    left:0; 
    background:#6083a3;
    border:2px solid #6083a3;
        }
#directory .characters .eternal {
    position:relative; 
    display:inline-block; 
    height:50px; 
    width:50px; 
    top:0px; 
    left:0; 
    background:#80698d;
    border:2px solid #80698d;
        }