/* CSS talk bubble */


.send_messageCHat{
    padding:1%;
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin: auto;
}

.send_messageCHat .send_chat_div{
    display: inline-block;
    width: 12%;
    vertical-align: middle;
    text-align: center;
}
.send_messageCHat .send_text_for_tremp{
    display: inline-block;
    width: 85%;
    vertical-align: middle;
}

.talk-bubble {
    margin: 5px;
    display: inline-block;
    position: relative;
    width: 90%;
    float: right;
    height: auto;
    background-color: #00BCD4;
}
.border{
    border: 8px solid #666;
}
.round{
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;

}

/* Right triangle placed top left flush. */
.tri-right.border.left-top:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -40px;
    right: auto;
    top: -8px;
    bottom: auto;
    border: 32px solid;
    border-color: #666 transparent transparent transparent;
}
.tri-right.left-top:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -20px;
    right: auto;
    top: 0px;
    bottom: auto;
    border: 22px solid;
    border-color: #00BCD4 transparent transparent transparent;
}

/* Right triangle, left side slightly down */
.tri-right.border.left-in:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -40px;
    right: auto;
    top: 30px;
    bottom: auto;
    border: 20px solid;
    border-color: #666 #666 transparent transparent;
}
.tri-right.left-in:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -20px;
    right: auto;
    top: 38px;
    bottom: auto;
    border: 12px solid;
    border-color: #00BCD4 #00BCD4 transparent transparent;
}

/*Right triangle, placed bottom left side slightly in*/
.tri-right.border.btm-left:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: -8px;
    right: auto;
    top: auto;
    bottom: -40px;
    border: 32px solid;
    border-color: transparent transparent transparent #666;
}
.tri-right.btm-left:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 0px;
    right: auto;
    top: auto;
    bottom: -20px;
    border: 22px solid;
    border-color: transparent transparent transparent #00BCD4;
}

/*Right triangle, placed bottom left side slightly in*/
.tri-right.border.btm-left-in:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 30px;
    right: auto;
    top: auto;
    bottom: -40px;
    border: 20px solid;
    border-color: #666 transparent transparent #666;
}
.tri-right.btm-left-in:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 38px;
    right: auto;
    top: auto;
    bottom: -20px;
    border: 12px solid;
    border-color: #00BCD4 transparent transparent #00BCD4;
}

/*Right triangle, placed bottom right side slightly in*/
.tri-right.border.btm-right-in:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: 30px;
    bottom: -40px;
    border: 20px solid;
    border-color: #666 #666 transparent transparent;
}
.tri-right.btm-right-in:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: 38px;
    bottom: -20px;
    border: 12px solid;
    border-color: #00BCD4 #00BCD4 transparent transparent;
}
/*
	left: -8px;
  right: auto;
  top: auto;
	bottom: -40px;
	border: 32px solid;
	border-color: transparent transparent transparent #666;
	left: 0px;
  right: auto;
  top: auto;
	bottom: -20px;
	border: 22px solid;
	border-color: transparent transparent transparent #00BCD4;

/*Right triangle, placed bottom right side slightly in*/
.tri-right.border.btm-right:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: -8px;
    bottom: -40px;
    border: 20px solid;
    border-color: #666 #666 transparent transparent;
}
.tri-right.btm-right:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: 0px;
    bottom: -20px;
    border: 12px solid;
    border-color: #00BCD4 #00BCD4 transparent transparent;
}

/* Right triangle, right side slightly down*/
.tri-right.border.right-in:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: -40px;
    top: 30px;
    bottom: auto;
    border: 20px solid;
    border-color: #666 transparent transparent #666;
}
.tri-right.right-in:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: -20px;
    top: 38px;
    bottom: auto;
    border: 12px solid;
    border-color: #00BCD4 transparent transparent #00BCD4;
}

/* Right triangle placed top right flush. */
.tri-right.border.right-top:before {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: -40px;
    top: -8px;
    bottom: auto;
    border: 32px solid;
    border-color: #666 transparent transparent transparent;
}
.tri-right.right-top:after{
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: auto;
    right: -20px;
    top: 0px;
    bottom: auto;
    border: 20px solid;
    border-color: #00BCD4 transparent transparent transparent;
}

/* talk bubble contents */
.talktext{
    padding: 1em;
    text-align: right;
    line-height: 1.5em;
    direction: rtl;
    color: #fff;
}
.talktext p{
    /* remove webkit p margins */
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
}

.list_of_my_chat_text{
    margin-bottom: 5rem;
}

.page19 textarea {
    width: 100%;
    direction: rtl;
}

.page19 .chate_button {
    font-size: 2.2rem;
}
.name_of_invite_in_chat{
    font-weight: bold;
}

.page19 .navbar-fixed-bottom {
    background-color: #dba521;
    padding-top: 7px;

}

@media
only screen and (min-device-width : 720px)  {
    .page19 .navbar-fixed-bottom {

        max-width: 35rem;
        margin: auto;
    }
}
.send_text_for_tremp {
    padding-bottom: 0.5rem;
 }
.send_text_for_tremp  textarea{
    margin-top: 0.5rem;
}

.send_chat {

    width: 2rem;
    height: 2.5rem;
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform:rotate(180deg);
    -moz-transform:rotate(180deg);
    -o-transform:rotate(180deg);
    transform: rotate(180deg);
}