/* Estilos de los contactos*/
.tabla_contacto{
    display: block;
    height: 500px;
    overflow-y: auto;
}

.input_contactos{
    border: none;
    border-radius: 5px;
}


/* Estilos del chat*/
.row_chat{
    width: 90%;
}
.col_chat_me{
    margin-top: 1; margin-bottom: 1;
    padding-top: 0; padding-bottom: 0;
    width: 100%;
    text-align: right;
}

.col_chat_you{
    margin-top: 1; margin-bottom: 1;
    padding-top: 0; padding-bottom: 0;
    width: 100%;
}

.col_chat_txt{
    padding-top: 0;
}

.chat_me{
    margin-top: 1; margin-bottom: 1;
    color:#000000; background-color: #cde9ce; border-radius: 10px 10px 0px 10px; padding: 4px 4px 7px 10px;
}

.chat_you{
    margin-top: 1; margin-bottom: 1;
    color:#000000; background-color: #FFFFFF; border-radius: 10px 10px 10px 0; padding: 4px 10px 7px 4px;
}

.chat_time{
    font-size: small;
}

.chat_txt{
    width: 100%; height: 35px;
    background-color: #FFFFFF; border: none; border-radius: 10px 10px 10px 10px; padding: 5px 3px 5px 3px;
}

.chat_img{
    width: 150px; height: 150px;
}

.chat_img:hover{
    cursor: pointer;
}

.chat_ico{
    width: 50px; height: 50px;
}
.chat_btn{
    width: 10%; border-radius: 50%;
}

.chat_error_format{
    color: #FF0000;
}


/* Scroll de las tablas*/
.tabla_contacto::-webkit-scrollbar {
    width: 8px;     /* Tamaño del scroll en vertical */
    height: 8px;    /* Tamaño del scroll en horizontal */
    /*display: none;   Ocultar scroll */
}

/* Ponemos un color de fondo y redondeamos las esquinas del thumb */
.tabla_contacto::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}

/* Cambiamos el fondo y agregamos una sombra cuando esté en hover */
.tabla_contacto::-webkit-scrollbar-thumb:hover {
    background: #b3b3b3;
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
}

/* Cambiamos el fondo cuando esté en active */
.tabla_contacto::-webkit-scrollbar-thumb:active {
    background-color: #999999;
}

/* Ponemos un color de fondo y redondeamos las esquinas del track */
.tabla_contacto::-webkit-scrollbar-track {
    background: #e1e1e1;
    border-radius: 4px;
}

/* Cambiamos el fondo cuando esté en active o hover */
.tabla_contacto::-webkit-scrollbar-track:hover,
.tabla_contacto::-webkit-scrollbar-track:active {
  background: #d4d4d4;
}

.flag {
    padding-left: 3px;
    margin: auto;
}