body {
    margin:0;
    border:0;
    padding:0;
    height:100%; 
    max-height:100%; 
    background:#fff; 
    font-family: Calibri,"Helvetica Neue","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif; 
    font-size:56%;
    overflow: hidden; 
    }

/* for internet explorer */
* html body {
    padding:120px 0 50px 0; 
    }

#container 
{
    font-family: Calibri,"Helvetica Neue","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif;
    font-size: 1.3em;
    position:fixed; 
    top:77px;
    left:155px;
    bottom:22px; 
    right:0; 
    overflow:auto; 
    background:#fff;
    padding:10px;
    background: url("../images/bgsutues.png") no-repeat scroll 50% 50% / contain  #F3F2E9;
    /*text-align:center;*/
    }
    
#left {
    font-family: Calibri,"Helvetica Neue","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif;
    font-size: 1.1em;
    position:absolute; 
    top:77px;
    left: 0;
    bottom:22px; 
    width:155px; 
    /*overflow:auto; */
    /*background:#35414F;*/
    padding:0px;
    /*text-align:center;*/
  background-color: #35414F;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#35414F', endColorstr='#eeeeee', GradientType=0 );   
  background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(20%, #35414F), color-stop(50%, #425162), color-stop(60%, #4A5A6F), color-stop(100%, #566A81));
  background-image: -webkit-linear-gradient(top, #35414F 20%, #425162 50%, #4A5A6F 60%, #566A81 100%);
  background-image: -moz-linear-gradient(top, #35414F 20%, #425162 50%, #4A5A6F 60%, #566A81 100%);
  background-image: -o-linear-gradient(top, #35414F 20%, #425162 50%, #4A5A6F 60%, #566A81 100%);
  background-image: linear-gradient(#35414F 20%, #425162 50%, #4A5A6F 60%, #566A81 100%); 
    }


* html #container {
    height:100%; 
    width:100%; 
    }

#header {
    position:absolute; 
    top:0; 
    left:0; 
    width:100%; 
    height:73px; 
    overflow:none; 
    /*background:#7D9F2D;*/
    background:#53829d;
    /*border-bottom:4px solid #A2CB47;*/
    border-bottom:4px solid #D9D9D9;
    background: url("../images/header_bg.jpg") repeat-x scroll 0 0 transparent;
    font-family: Verdana;
    }
* html #header {height:60px;}

.inner {
    /*font-weight: bold; */
    text-shadow: 1px 1px #e3e3e3, -1px -1px rgb(204, 204, 204); 
    color: rgb(189, 62, 33); 
    font-size: 10px;
}
/*
.depth {
    display: block;
    color: #BD3E21;
    position: relative;
    font-size: 14px;
}

.depth:before, .depth:after {
    content: attr(title);
    color: rgba(240,179,166,.1);
    position: absolute;
}

.depth:before { top: 1px; left: 1px }
.depth:after  { top: 2px; left: 2px }
*/
/*
.lightAgain:before {
    color: rgba(240, 179, 166, 0.1);
    content: attr(title);
    left: -1px;
    position: absolute;
    top: -1px;
}
.lightAgain {
    color: #BD3E21;
    position: relative;
}
.emboss {
    display: block;
    font-size: 14px;
    font-weight: bold;
}
*/

#insetBgd {
  width: 550px;
  height: 100px;
  background: -moz-linear-gradient(-90deg,#003471,#448CCB);
  background: -webkit-gradient(linear, left top, left bottom, from(#003471), to(#448CCB));
}

h1.insetType {
  padding-left: 50px; /* The padding is just there to move the h1 element to the center of the div */
  padding-top: 17px;
  font-family: Rockwell, Georgia, "Times New Roman", Times, serif;
  font-size: 50px;
  color: #0D4383;
  text-shadow: rgba(0,0,0,0.5) -1px 0, rgba(0,0,0,0.3) 0 -1px, rgba(255,255,255,0.5) 0 1px, rgba(0,0,0,0.3) -1px -2px;
}

.usuario {
    color: rgb(119, 119, 119); 
    font-family: Calibri,"Helvetica Neue","Lucida Grande","Segoe UI",Arial,Helvetica,Verdana,sans-serif; 
    /*font-weight: bold; */
    text-shadow: 0.1em 0.1em 0.2em rgb(153, 153, 153); 
    font-size: 16px;
}


#footer {
    position:absolute; 
    bottom:0; 
    left:0;
    width:100%; 
    height:20px; 
    overflow:auto; 
    text-align:right; 
    line-height: 10px;
    /*background:#A2CB47;*/
    background:#566A81;
    /*border-top:5px solid #7D9F2D;*/
    border-top:2px solid #35414F;
    }
* html #footer {height:30px;}

/* end of bit that does the work */

h1 {font-size:2em; margin:0; padding:0; color:#BD3E21;}

#footer p {
    color:#fff; 
    margin:0px 10px;
    }


#header img {
    margin:10px 10px 0 10px;
    border:0px;
    }
#container img {/*margin:5px; */border:none;}
#absolute {
    position:absolute; 
    top:400px; 
    right:100px; 
    width:200px; 
    background:#ddd; 
    padding:10px; 
    border:1px solid #000;
    }

#right {
    float:right; 
    background:#ddd; 
    padding:10px; 
    border:1px solid #000; 
    color:#000; 
    }

a, a:visited {
    font-size:1.1em;
    text-decoration:none;
    color:#ddd;
    }

a:hover {
    color:#fff; 
    text-decoration:underline;
    }

.grey {color:#888;}

.ltgrey {color:#ddd;}

img#mascot {float:right;}

#header ul {
    clear:both; 
    text-align:center; 
    padding-top:28px;
    border-top:1px solid #73a2bd;
    }

#header ul {
    margin:0; 
    /*padding:0; */
    list-style-type:none; 
    background:transparent; 
    /*height:3em;*/
    }

#header ul li {
    display:inline; 
    /*color:#A2CB47;*/
    color:#73a2bd;
    font-size:12px;
    }

.strike {text-decoration:line-through;}
.lft 
{
    float:left; 
    font-weight:bold;
    padding-top: 4px;
}
.rgt{float:right;}

* html {border:0;}
/*hr {clear:both; border:0; height:1px; color:#888; background-color:#888;}*/
hr {
    border: 0;
    height: 1px;
    background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, #CCCCCC 15%, #999999 50%, #CCCCCC 85%, rgba(0,0,0,0) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(15%,#CCCCCC), color-stop(50%,#999999), color-stop(85%,#CCCCCC), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,#CCCCCC 15%,#999999 50%,#CCCCCC 85%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(left, rgba(0,0,0,0) 0%,#CCCCCC 15%,#999999 50%,#CCCCCC 85%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,#CCCCCC 15%,#999999 50%,#CCCCCC 85%,rgba(0,0,0,0) 100%); /* IE10+ */
    background: linear-gradient(left, rgba(0,0,0,0) 0%,#CCCCCC 15%,#999999 50%,#CCCCCC 85%,rgba(0,0,0,0) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */


    -moz-linear-gradient(left center , rgba(0, 0, 0, 0) 0%, #CCCCCC 15%, #999999 50%, #CCCCCC 85%, rgba(0, 0, 0, 0) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0)
}


.titulo {position:absolute; color: #203142; /*ont-weight:bold; */padding:10px 0px 0px 80px;}
.logout {position:absolute; font-weight:bold; top:28px; right:10px;}
.cr {font-size:7.5px;}
	#dialog label, #dialog input { display:block; }
	#dialog label { margin-top: 0.5em; }
	#dialog input, #dialog textarea { width: 95%; }
.autocompletar
{
    font-size:12px;
    line-height:13px;
    padding:5px;
}
.foco
{
  -webkit-box-shadow: 0 0 5px rgba(0,0,0,.3);
  -moz-box-shadow   : 0 0 5px rgba(0,0,0,.3);
  box-shadow        : 0 0 5px rgba(0,0,0,.3);
  border: 1px solid #5897fb;
}

/* Tabla  
----------------------------------------------------------*/
th 
{
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    font-size: 12px;
    font-weight:bold; 
    
    color:White; 
    background-color:#AEB627;
    border-right: 1px solid #83881E;
    border-left: 1px solid #CED641;
}

#tbContenido table th {line-height:30px; }

.recibo
{
    font-family: Calibri, "Helvetica Neue" , "Lucida Grande" , "Segoe UI" , Arial, Helvetica, Verdana, sans-serif;
    font-size: 12px;
    font-weight: bold;
    line-height: 30px;
    color: White;
    background-color: #E48D0C;
    border-right: 1px solid #965C07;
    border-left: 1px solid #F7B95B;
    text-align:center;
}

.total
{
    font-family: Calibri, "Helvetica Neue" , "Lucida Grande" , "Segoe UI" , Arial, Helvetica, Verdana, sans-serif;
    font-size: 14px;
    font-weight: bold;
    line-height: 30px;
    /*color: White;
    background-color: #334251;
    border-right: 1px solid #965C07;
    border-left: 1px solid #F7B95B;*/
    text-align: right;
}

td     
{
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    font-size: 12px;
    /*background:#fff;*/
}

.alterno
{
    background:#eee;
}

.over {background:#DDD0C8;}

.cabecera 
{
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    font-size: 10px;
    font-weight:bold; 
    line-height:30px; 
    color:White; 
    background-color:#9a9a9a;
}

.cabecera_re
{
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    font-size: 12px;
    font-weight:bold; 
    line-height:30px; 
    color:White; 
    background-color:#333333;
}

.arriba_dentro
{
    -webkit-box-shadow: 0 8px 6px -6px black;-moz-box-shadow: 0 8px 6px -6px black;box-shadow: 0 8px 6px -6px black;
}

/* input, lista, textarea  
----------------------------------------------------------*/
input:not([type]), input[type="text"] {height:16px;}
.textodinero
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:0px 4px 4px 0px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 10% repeat-x;
    resize:none;
    text-align:right;
}
.textoinhabil
{
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    background: #eeeeee !important;
}
.etiquetainhabil { color:#AAAAAA;}
.simbolopesos
{
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    border-radius: 4px 0 0 4px;
    /*display: inline-block;*/
    height: 16px;
    margin-right: -1px;
    padding: 3px;
    width: 8px;
    text-align:center;    
}
.textoporcentaje
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px 0px 0px 4px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 10% repeat-x;
    resize:none;
    text-align:right;
}
.simboloporcentaje
{
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    border-radius: 0px 4px 4px 0px;
    display: inline-block;
    height: 16px;
    margin-left: -1px;
    padding: 3px;
    width: 8px;    
}
.texto
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 10% repeat-x;
    resize:none;
}
.textonumero
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 10% repeat-x;
    resize:none;
    text-align:right;
}

.textoeditado
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffcc url(../images/content_repeat2.jpg) 50% 10% repeat-x;
}

.autocomplete
{
    border:1px solid #A2ACD1!important;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 8% repeat-x;
    box-shadow: 0 0 5px #A2ACD1;
}

.autocompleteeditado
{
    border:1px solid #A2ACD1!important;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif; 
    /*text-transform:uppercase;*/
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffcc url(../images/content_repeat2.jpg) 50% 8% repeat-x;
    box-shadow: 0 0 5px #A2ACD1;
}

.lista
{
    border:1px solid #b0b0b0;
    font-family: Calibri, "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    /*font-size: 12px;*/
    border-radius:4px;
    padding:3px;
    background: #ffffff url(../images/content_repeat.jpg) 50% 10% repeat-x;
}

fieldset {border-radius:4px;border:1px solid #bbbbbb;}
fieldset legend{ font-weight: bold;}
fieldset.dot table tr td {border-bottom:1px dotted #cccccc;}
.sinbordes table tr td {border:0px;}

.additionalInfo {
    cursor: pointer;
    text-decoration: none;
    position: relative;
    font-size:10px;
}

.additionalInfo span {
    margin-left: -999em;
    position: absolute;
    font-size: 0.9em;
}

.additionalInfo:hover span {
    /*opacity:0.9;*/
    /*filter:alpha(opacity=90);*/
    border-radius: 5px 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 2px 2px rgba(0, 0, 0, 0.2);
    font-family: Calibri, Tahoma, Geneva, sans-serif;
    color: #000;
    position: absolute;
    left: 20px;
    top: 5px;
    z-index: 99;
    margin-left: 0;
    width: 120px;
    font-size:12px;
}

.additionalInfoColor {
    padding: 10px;
    background: #fcf8e3;
    border: 1px solid #fbeed5;
    text-align:left;
}

.remarcado {
    background: none repeat scroll 0 0 #EDEDED;
    border: 1px solid #B0B0B0;
    border-radius: 4px;
    color: #595959;
    display: inline-block;
    font-size: 13px;
    font-weight: bold;
    height: 22px;
    padding: 3px;
    vertical-align: middle;
}

.ui-dialog {
  z-index : 9920 !important;
}

.chat {
    width: 400px;
    font-size: 14px;
}

.bubble{
    background-color: #F2F2F2;
    border-radius: 5px;
    box-shadow: 0 0 6px #B2B2B2;
    display: inline-block;
    padding: 10px 18px;
    position: relative;
    vertical-align: top;
    min-width: 100px;
}

.bubble::before {
    background-color: #F2F2F2;
    content: "\00a0";
    display: block;
    height: 16px;
    position: absolute;
    top: 11px;
    transform:             rotate( 29deg ) skew( -35deg );
        -moz-transform:    rotate( 29deg ) skew( -35deg );
        -ms-transform:     rotate( 29deg ) skew( -35deg );
        -o-transform:      rotate( 29deg ) skew( -35deg );
        -webkit-transform: rotate( 29deg ) skew( -35deg );
    width:  20px;
}

.me {
    float: left;   
    margin: 5px 45px 5px 20px;         
}

.me::before {
    box-shadow: -2px 2px 2px 0 rgba( 178, 178, 178, .4 );
    left: -9px;           
}

.you {
    float: right;    
    margin: 5px 20px 5px 45px;         
}

.you::before {
    box-shadow: 2px -2px 2px 0 rgba( 178, 178, 178, .4 );
    right: -9px;    
}

.nombreme
{
    font-size:10px; display:block; height: 0px; margin-top:-9px; margin-bottom:10px;
}

.nombreyou
{
    font-size:10px; display:block; height: 0px; margin-top:-9px; margin-bottom:10px; text-align: right;
}

.can_be_selected{ border-bottom: 1px dotted #ccc;}