#phonebookHotSearch{
    position: relative;
    width: 16rem;
    margin: auto;
    margin-bottom: 1rem;
}
#phonebookHotSearch input{
    background-color: var(--bg1);
}
#phonebookHotSearch img{
    position: absolute;
    right: .5rem;
    top: 50%;
    width: 1rem;
    height: 1rem;
    transform: translateY(-50%);
}
.phonebookSector{
    display: grid;
    border-radius: .5rem;
    padding: .5rem;
    background-color: var(--bg1);
    grid-template-columns: 1fr 28rem;
    margin-bottom: .25rem;
}
.sectorContacts{
}
.contactCard{
    display: grid;
    grid-template-columns: 1fr 1fr 3rem;
    border: 1px var(--bg3) solid;
    border-bottom: none;
    padding-left: .25rem; 
}
.contactCard:last-child{
    border-radius: 0 0 .25rem .25rem;
    border-bottom: 1px var(--bg3) solid;
}
.contactCard:first-child{
    border-radius: .25rem .25rem 0 0;
}
.greyText{
    color: var(--ttcl);
}
#phonebookContainer{
    max-width: 40rem;
    margin: auto;
}
@media (prefers-color-scheme:dark){
    #phonebookHotSearch img{
        filter: contrast(0.5) brightness(10);
    }
}
@media (max-width:620px){
    .phonebookSector{
        grid-template-columns: 1fr;
        gap: .5rem;
    }
    .phonebookSector>:first-child *{
        text-align: center;
    }
    .contactCard{
        grid-template-columns: auto 1fr 3rem;
        gap: .25rem;
    }
}