/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}
@media(min-width:750px) {
    .body-content {
        max-width: 75%;
    }
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default 
input,
select,
textarea {
    max-width: 280px;
}
    */
.contact-mini-photo {
    /*display: inline-block !important;
        float: left;*/
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-size: 32px 32px;
    background-position: center center;
    vertical-align: middle;
    line-height: 32px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);
    margin-right: 2px;
    margin-top: 10px;
}

.contact-photo {
    display: inline-block !important;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-size: 64px 64px;
    background-position: center center;
    vertical-align: middle;
    line-height: 64px;
    box-shadow: inset 0 0 1px #999, inset 0 0 10px rgba(0,0,0,.2);
    margin-left: 5px;
}

.contact-name {
    display: inline-block;
    vertical-align: middle;
    line-height: 16px;
    padding-left: 10px;
}

.navbar {
    min-height: 70px !important;
    margin-bottom: 30px;
}


.chatstatus-0 {
    color: darkorange;
}

.chatstatus-1 {
    color: darkgreen;
}

.chatstatus-2 {
    color: darkred;
}


.bubbleRight {
    position: relative;
    width: 460px;
    min-height: 60px;
    padding: 6px;
    background: #FFFFFF;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    border: #7F7FCE solid 2px;
}

    .bubbleRight:after {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 15px 0 15px 15px;
        border-color: transparent #FFFFFF;
        display: block;
        width: 0;
        z-index: 0;
        right: -15px;
        top: 15px;
    }

    .bubbleRight:before {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 16px 0 16px 16px;
        border-color: transparent #7F7FCE;
        display: block;
        width: 0;
        z-index: 0;
        right: -18px;
        top: 14px;
    }

.bubbleLeft {
    position: relative;
    width: 460px;
    min-height: 60px;
    padding: 6px;
    background: #D7E9E3;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
    border: #7F7FCE solid 2px;
}

    .bubbleLeft:after {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 15px 15px 15px 0;
        border-color: transparent #D7E9E3;
        display: block;
        width: 0;
        z-index: 0;
        left: -15px;
        top: 15px;
    }

    .bubbleLeft:before {
        content: '';
        position: absolute;
        border-style: solid;
        border-width: 16px 16px 16px 0;
        border-color: transparent #7F7FCE;
        display: block;
        width: 0;
        z-index: 0;
        left: -18px;
        top: 14px;
    }

.tr-chat {
    margin-bottom: 5px;
    width: 100%;
}

.send-message {
    margin-top: 10px;
    background-color: lightgrey;
    z-index: 1000 !important;
}

.send-message div {
    z-index: 1000 !important;
}
    .send-message div textarea {
        width: 450px;
        height: 60px;
        max-width: 450px;
        margin: 6px;
        z-index: 1000 !important;
    }

    .send-message div input {
        margin: 10px;
    }



/* body, input, p, span, h1, h2, h3, h4, h5, h6, label, td, textarea { color:#99a49c; }*/
   a { color: #e2001a; }

   a:hover { color: #b2ad7f !important; }

body, a, input, p, h1, h2, h3, h4, h5, h6, label, td, textarea { font-family:  Raleway, Arial, Helvetica, sans-serif !important; }

.navbar-default {
    background-color: #f6f5ee !important;
    border-color: #e7e7e7 !important;
}

li a:hover { background-color: #D7E9E3 !important; color:red !important;}


.mlabel { color: black !important; }



/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative !important;
  min-height: 100% !important;
}
body {
  /* Margin bottom by footer height */
  padding-top: 80px !important;
  margin-bottom: 60px !important;
}
.footer {
  position: absolute !important;
  left:0 !important;
  bottom:0 !important;
  width: 100% !important;
  /* Set the fixed height of the footer here */
  height:60px !important;
  background-color:#f5f5f5;
}

/* adaptamos los estilos de bootstrap al window de kendo (k-window-content)*/
.k-window-content *,
.k-window-content :before,
.k-window-content :after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

/* set a border-box model only to elements that need it */

.k-window-content .form-control, /* if this class is applied to a Kendo UI widget, its layout may change */
.k-window-content .container,
.k-window-content .container-fluid,
.k-window-content .row,
.k-window-content .col-xs-1,
.k-window-content .col-sm-1,
.k-window-content .col-md-1,
.k-window-content .col-lg-1,
.k-window-content .col-xs-2,
.k-window-content .col-sm-2,
.k-window-content .col-md-2,
.k-window-content .col-lg-2,
.k-window-content .col-xs-3,
.k-window-content .col-sm-3,
.k-window-content .col-md-3,
.k-window-content .col-lg-3,
.k-window-content .col-xs-4,
.k-window-content .col-sm-4,
.k-window-content .col-md-4,
.k-window-content .col-lg-4,
.k-window-content .col-xs-5,
.k-window-content .col-sm-5,
.k-window-content .col-md-5,
.k-window-content .col-lg-5,
.k-window-content .col-xs-6,
.k-window-content .col-sm-6,
.k-window-content .col-md-6,
.k-window-content .col-lg-6,
.k-window-content .col-xs-7,
.k-window-content .col-sm-7,
.k-window-content .col-md-7,
.k-window-content .col-lg-7,
.k-window-content .col-xs-8,
.k-window-content .col-sm-8,
.k-window-content .col-md-8,
.k-window-content .col-lg-8,
.k-window-content .col-xs-9,
.k-window-content .col-sm-9,
.k-window-content .col-md-9,
.k-window-content .col-lg-9,
.k-window-content .col-xs-10,
.k-window-content .col-sm-10,
.k-window-content .col-md-10,
.k-window-content .col-lg-10,
.k-window-content .col-xs-11,
.k-window-content .col-sm-11,
.k-window-content .col-md-11,
.k-window-content .col-lg-11,
.k-window-content .col-xs-12,
.k-window-content .col-sm-12,
.k-window-content .col-md-12,
.k-window-content .col-lg-12 
{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* Adaptamos los panels al DualListBox */
.k-listbox .k-item .panel {
    Margin-bottom: 0px;
}
.k-listbox .k-item .panel-heading,
.k-listbox .k-item .panel-body {
    padding-top: 0px;
    padding-bottom: 5px;
}

/*modal bootstrap*/
.modal .modal-content {
    width: 95% !important;
    max-width: 1250px;
    min-height: 90%;
    margin: 15px auto !important;
}

.k-content *,
.k-content :before,
.k-content :after {
    -webkit-box-sizing: border-box !important;
    -moz-box-sizing: border-box !important;
    box-sizing: border-box !important;
}