#buscar{
    display:block;
    text-align: center;
    justify-content: center;
    align-items: center;

    @media(min-width:1200px){
        display: flex;
    }

    form{
        display: flex;
        flex-direction: column;
        @media(min-width:992px){
            display: block;
        }

        #nameFilter{
            padding: 0.8rem 1rem;
            border-radius: 32px;
            border: 1px solid #716F76;
            margin: 0.5rem 3rem;
            width: auto;
            box-sizing: border-box;

            @media(min-width:992px){
                margin: 1rem 0.5rem;
                width: 190px;
            }

            &::placeholder{
                color: #716F76;
            }
        }

        .btn{
            background-color: #FDF1E3;
            padding: 1rem 1rem;
            border-radius: 32px;
            border: none;
            color: #8C8170;
            margin: 0.5rem 3rem;
            @media(min-width:992px){
                margin: 1rem 0.5rem;
            }
            &:hover{
                border: none;
            }
            &#specialtyFilter{
                width: auto;
                @media(min-width:992px){
                    width: 180px;
                }
            }
            &#stateFilter{
                width: auto;
                @media(min-width:992px){
                    width: 170px;
                }
            }
        }
        .btn-todos{
            background-color: #5D1FC7;
            color: #fff;
            padding: 1rem 1rem;
            border-radius: 32px;
            margin: 0.5rem 2rem;
            text-align: center;
            width: auto;
            @media(min-width:992px){
                width: 150px;
                margin: 1rem 0.5rem;
            }
        }
    }
}

.txt-correo {
    overflow: hidden;
}
.txt-correo p{
white-space: nowrap;    /* Evita que el texto salte de línea */
  overflow: hidden;       /* Esconde lo que sobra */
  text-overflow: ellipsis;
}



#pagination{
    margin: 1.5rem 0;
    text-align: center;
    nav{
        background-color: transparent !important;

        ul{
            display: inline-table;
            margin: auto 5px;            
        }

        .page-item{
            button{
                border-radius: 50% !important;
                width: 40px;
                margin: 0 2px !important;                     
            }

            &.active{
                button{
                    background-color: #5D1FC7; 
                }
            }
        }        
    }
 }

#directorio{
    p{
        margin: 0.2rem 0;
        float: left;
    }

    .fondo{
        background-color: #F8F7FA;
        padding: 2rem 1rem;
        @media(min-width: 992px){
            padding: 2rem 3rem;
        }
        border-radius: 2rem;
        .bold{
            font-weight: 600;
        }
        .col-left{
            .txt-nombre{
                color: #5D1FC7;
            }   

        }

        .col-left .row > div {
            padding: 0;
        }
        .col-right .row > div {
            padding: 0;
        }

    }
}