.attendee-directory{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(150px,1fr));

    gap:2rem;

}

.attendee-card{

    background:none;

    border:0;

    padding:0;

    cursor:pointer;

}

.attendee-card:focus{outline:none !important;}

.attendee-avatar,
.attendee-card img{

    width:150px;

    height:150px;

    object-fit:cover;

    border-radius:50%;

    transition:.25s;

}

.attendee-card:hover img{

    transform:scale(1.05);

}

.attendee-modal {

    position:fixed;

    inset:0;

    display:none;

    justify-content:center;

    align-items:center;

    background: rgba(255, 255, 255, 0.75);

    z-index:9999;

}

.attendee-modal.active{

    display:flex;

}

.attendee-modal-content{

    background:#000;

    border-radius:12px;

    padding:2rem;

    position:relative;

}

.attendee-modal-close{

    position:absolute;

    top:0.5rem;

    right:1rem;

    background:none;

    border:none;

    font-size:2rem;

    cursor:pointer;
	
	color:#FFF;

}

.attendee-business-card {

    background:black;

    text-align:center;

    border-radius:16px;

}


.attendee-photo img {

    width:220px;

    height:220px;

    object-fit:cover;

    border-radius:50%;

}


.attendee-details h4 {
	
	
	margin-top:0;
	text-transform:uppercase;
	
}

.attendee-company{padding-top:0;}


.attendee-socials {

    display:flex;

    justify-content:center;

    gap:1rem;

    margin-top:20px;

}


.attendee-socials a {

    text-decoration:none;

}