.chat_window {
    background-color: #f8f8f8;
    border-radius: 5px 5px 0px 0px;
    bottom: 0px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    font-family: "Calibri", "Roboto", sans-serif;
    height: 387px;
    max-width: 320px;
    overflow: hidden;
    position: absolute;
    right: 10px;
    width: calc(100% - 10px);
}

.chat_window.small {
    height: 34px;
}

/*
* Estilos header
*/
.top_menu {
    background-color: #fff;
    padding: 7px 0px 7px;
    position: relative;
    width: 100%;
}

.top_menu .buttons {
    margin: 3px 0 0 20px;
    position: absolute;
    right: -0.5px;
}


.chat_window {
    position: fixed;
    background-color: #f8f8f8;
    border-radius: 5px 5px 0px 0px;
    bottom: 0px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
    font-family: "Calibri", "Roboto", sans-serif;
    height: 387px;
    max-width: 320px;
    overflow: hidden;
    right: 20px;
    width: calc(100% - 10px);
}
.chat_window.small {
    height : 34px;
}

/*
* Estilos header
*/
.top_menu {
    background-color : #fff;
    padding          : 7px 0px 7px;
    position         : relative;
    width            : 100%;
}
.top_menu .buttons {
    margin   : 3px 0 0 20px;
    position : absolute;
    right    : -0.5px;
}

.top_menu .buttons .button {
    display      : inline-block !important;
    height       : 16px;
    margin-right : 15px;
    position     : relative;
    width        : 16px;
}


.top_menu .buttons .button.toggleSize {
    background: url('../Images/Bot/min.png') no-repeat;
}
.top_menu .buttons .button.toggleSize.hidden {
    background: url('../Images/Bot/max.png') no-repeat ;
}

.top_menu .buttons .button:hover {
    cursor : pointer;
}

.top_menu .title {
    text-align : center;
    color      : #bcbdc0;
    font-size  : 15px;
}

/*
* Estilo zona de mensajes
*/
.messages {
    height     : 307px;
    list-style : none;
    margin     : 0;
    padding    : 12px 10px 0px 3px;
    position   : relative;
    overflow   : scroll;
    overflow-x: hidden;
}
.logo {
    background: url('../Images/Bot/logo.png') no-repeat 0px 0px; background-size : 90px 35px;
    bottom: 46px;
    height: 35px;
    position: absolute;
    opacity: 0.3;
    right: 11px;
    width: 105px;
}

.messages.hidden {
    height : 0px;
}

.messages .message {
    clear         : both;
    margin-bottom : 12px;
    overflow      : hidden;
    opacity       : 0;
    transition    : all 0.5s linear;

}
.messages .message.left .avatar {
    float : left;
}
.messages .message .avatar.hidden {
    visibility : hidden;
}
.messages .message.left .text_wrapper {
    background-color : #fff;
    margin-left      : 10px;
    max-width        : 242px;
}
.messages .message.left .text_wrapper::after, .messages .message.left .text_wrapper::before {
    border-right-color : #fff;
    right              : 100%;
}
.messages .message.left .text {
    color : #696969;
}
.messages .message.right .avatar {
    background-color : #fdbf68;
    float            : right;
}
.messages .message.right .text_wrapper {
    background-color : #cfd0ce;
    float            : right;
    margin-right     : 10px;
}
.messages .message.right .text_wrapper::after,
.messages .message.right .text_wrapper::before {
    left              : 100%;
    border-left-color : #cfd0ce;
}
.messages .message.right .text {
    color : #696969;
}
.messages .message.appeared {
    opacity : 1;
}
.messages .message .avatar {
    background: url('../Images/Bot/cadena-avatar.png') no-repeat 8px 2px; background-size : 24px;
    height: 40px;
    display: inline-block;
    width: 40px;
}
.messages .message .text_wrapper {
    display       : inline-block;
    padding       : 10px;
    border-radius : 6px;
    min-width     : calc(100% - 85px);
    min-width     : 100px;
    position      : relative;
}
.messages .message .text_wrapper::after,
.messages .message .text_wrapper:before {
    border         : solid transparent;
    content        : " ";
    height         : 0;
    position       : absolute;
    pointer-events : none;
    top            : 18px;
    width          : 0;
}
.messages .message .text_wrapper::after {
    border-width : 10px;
    margin-top   : -10px;
}
.messages .message .text_wrapper::before {
    border-width : 10px;
    margin-top   : -10px;
}
.messages .message .text_wrapper .text {
    font-size   : 12px;
    font-weight : 300;
}


/*
* Estilo de footer
*/
#footer.hidden {
    height : 0px;
}
.bottom_wrapper {
    bottom           : 0;
    background-color : #fff;
    padding          : 5px;
    position         : relative;
    width            : 100%;
}
.bottom_wrapper .message_input_wrapper {
    border-radius : 25px;
    border        : 1px solid #bcbdc0;
    display       : inline-block;
    height        : 33px;
    position      : relative;
    padding       : 0px 20px;
    width         : calc(100% - 44px);
}
.bottom_wrapper .message_input_wrapper.short {
    width : calc(100% - 81px);
}
#queryInput {
    font-family : "Calibri", "Roboto", sans-serif;
    font-size   : 12px;
}
.bottom_wrapper .message_input_wrapper .message_input {
    border        : none;
    box-sizing    : border-box;
    height        : 100%;
    position      : absolute;
    outline-width : 0;
    width         : calc(100% - 40px);
}

.bottom_wrapper .send_message .icon {
    background: url('../Images/Bot/send-button.png') no-repeat 8px 6px; height : 27px;
}
.bottom_wrapper .send_message {
    background-color : #0E4D86;
    border-radius    : 50px;
    border           : 2px solid #0E4D86;
    color            : #fff;
    cursor           : pointer;
    display          : inline-block;
    height           : 31px;
    float            : right;
    margin-right     : 6px;
    transition       : all 0.2s linear;
    text-align       : center;
    width            : 31px;
}
.bottom_wrapper .send_message:hover {
    background-color : #fff;
    color            : #0E4D86;
}
.bottom_wrapper .send_message .icon:hover {
    background: url('../Images/Bot/send-button-blue.png') no-repeat 8px 6px; height : 27px;
}
.bottom_wrapper .send_message.speak .icon {
    background: url('../Images/Bot/microphone.png') no-repeat 5px 5px;
}

.bottom_wrapper .send_message.speak .icon:hover {
    background: url('../Images/Bot/microphone-blue.png') no-repeat 5px 5px;
}
.bottom_wrapper .send_message.speak.recording .icon,
.bottom_wrapper .send_message.speak.recording .icon:hover {
    background: url('../Images/Bot/microphone-recording.png') no-repeat 5px 5px;
}

.bottom_wrapper .send_message.speak.recording {
    background-color : #fff;
}

input:not([type]):focus:not([readonly]){
    border-bottom : 0px;
    box-shadow : none;
}

@media screen and (max-width: 900px) {
    .chat_window {
        visibility: hidden;
        display: none;
    }
}
.text_wrapper {
    word-wrap: break-word;
}

.message.iframe-full .text_wrapper {
    margin-left: -3px !important;
    max-width: 350px !important;

}