/*background  */
body{
    background-image: url('../img/transcross.png');
	font-weight:normal;
}

/* CSS PARA SUBMENU*/

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

/* FIN CSS SUBMENU */



/*footer at the end
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here 
  height: 40px;
  background: #616161;
  color:#ffffff;
  text-align:center;
  padding-top:10px;
}*/

/* main menu icons*/
.bs-glyphicons a:hover {
cursor:pointer;
  color: #fff;
  /*background-color: #563d7c;
  background-color: #b0e4b3;*/
  background-color: #676967;
}

.bs-glyphicons-min li:hover {
cursor:pointer;
  color: #fff;
  /*background-color: #563d7c;
  background-color: #b0e4b3;*/
  background-color: #676967;

}

.bs-glyphicons{
margin-top:100px;
margin-bottom:10px;
overflow:hidden;
min-width:250px;
}

.bs-glyphicons-min{
margin-top:5px;
margin-bottom:5px;
overflow:hidden;
margin-left:-23px;
}

.bs-glyphicons-min ul{
padding:0px;
margin:0px;
overflow:hidden;
}

.bs-glyphicons-min li{
  list-style:none;
  display:inline-block;
  height:75px;
  width:75px;
  overflow:hidden;
  margin:0px;
  padding-top: 5px;
  font-size: 11px;
  text-align: center;
  background-color: #f9f9f9;
  border-radius: 5px;
  border: 1px solid #428ccb;
  transition: width 1s, height 1s;
}

.bs-glyphicons ul{
padding:0px;
margin:0px;
overflow:hidden;
}

.bs-glyphicons a {
  text-decoration:none;
  color:#000000;
  display:inline-block;
  height:115px;
    width:180px;
  overflow:hidden;
  margin:0px;
  padding-top: 10px;
  font-size: 20px;
  text-align: center;
  background-color: #ffffff;
  border-radius: 5px;
  border: 1px solid #428ccb;
  transition: width 1s, height 1s;
}
/*
.bs-glyphicons li {
  list-style:none;
  display:inline-block;
  height:115px;
    width:180px;
  overflow:hidden;
  margin:0px;
  padding-top: 10px;
  font-size: 20px;
  text-align: center;
  background-color: #ffffff;
  border-radius: 5px;
  border: 1px solid #428ccb;
  transition: width 1s, height 1s;
}*/

/* sera que esto aplica es de el numero que se coloque en adelante??*/
@media (max-width:900px) {
    .bs-glyphicons a {
    height:100px;
    width:140px;
    }
	.main-option-title{
	font-size:13px;
	}
	.bs-glyphicons{
	margin-top:50px;
	}
}

/* sera que esto aplica es de el numero que se coloque en adelante??*/
@media (max-width:750px) {
    .bs-glyphicons a {
    height:100px;
    width:120px;
    }
	.main-option-title{
	font-size:15px;
	}
	.bs-glyphicons{
	margin-top:40px;
	}
}

/* sera que esto aplica es de el numero que se coloque en adelante??*/
@media (max-width:550px) {
    .bs-glyphicons a {
    height:100px;
    width:120px;
    }
	.main-option-title{
	font-size:15px;
	}
	.bs-glyphicons{
	margin-top:20px;
	}
}
/* sera que esto aplica es de el numero que se coloque en adelante??*/
@media (max-width:450px) {
    .bs-glyphicons a {
    height:90px;
    width:80px;
    }
	.main-option-title{
	font-size:10px;
	}
	.bs-glyphicons{
	margin-top:8px;
	}
}

/*end main manu icons*/



/*footer ................*/

html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 40px;
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  background: #616161;
  color:#ffffff;
  text-align:center;
  padding-top:10px;
}

@media (max-width:550px) {
    .footer {
   display:none;
   }
}

/* end footer ...............*/


.main-header{
background:#616161; 
text-align:center; 
height:24px; 
border-radius:5px; 
color: white; 
font-size:20px !important;
}

.sub-header{
background:#616161; 
color:#ffffff; 
font-size:15px; 
text-align:center; 
width:250px; 
height:30px; 
margin-left:-15px; 
margin-top:-15px; 
padding-top:3px; 
border-bottom-right-radius:25px; 
border-bottom-left-radius:25px;
}

/* styles for tabs functionallity*/

.ref-tab-content{
display:none;
}

.ref-tab-content-active{
display:block;
}

.tb-active{
background-color: #676967 !important;
color:#fff;
}

/* end tabs.........*/


/*....custom form... esto es para los formularios*/

.custom-form{
display:block;
padding:15px; 
border:1px solid #B5B5B5 !important;
box-shadow: 8px 8px 20px #888888;
background-image: url('../img/backthree.png');
}

.custom-form-main{
height:300px;
width:300px;
margin:auto;
background-image: url('../img/backtwo.png');
}

.custom-form-nbg{
background:#ffffff;
/*background:#F0F8F6;*/
}

.form-nopadding{
padding:0px;	
}

.custom-form .btn{
float:none;
border:1px solid #428bca;
}

.form-info-panel{
margin-bottom:5px;
height:0px;
overflow:hidden;
-webkit-transition: height0.4s;
-moz-transition: height 0.4s;
transition: height 0.4s;
}


/*.form-info-panel .input-holder{
display:none;
}*/

/*.form-info-panel-text:hover +.form-info-panel {
max-height:999px;
}*/



.form-info-panel-text{
max-width:200px;
height:30px;
text-align:center;
padding:5px;
border-radius:15px;
background: #6BC4F7;
cursor:pointer;
}

/*...end custom form..*/

.input-holder{
margin:1px;
width:300px;
border-top-left-radius:5px;
border-top-right-radius:5px;
border:1px solid #000000;
display:inline-table;
transition: width 1s, height 1s;
}

.input-holder input{
height:28px;
/*border-color: #5B5B5B;*/
}

.input-holder-group input, .input-holder-group select{
float:right;
width:80%;
border-left:none !important;
}


.input-holder-group button{
width:20%;
/*border-color:#cccccc;*/
}

.input-holder-group span{
color:#428ccb;
}


.input-holder .btn{
border-color:#c9c9c9;
}

.input-holder .btn ,.input-holder .form-control {
border-radius:0px;
height:28px;
}

/*.required{
color: #FF5858 !important;
/*border: solid 1px #FF5858 !important; 
}*/


/* .required::after { 
    content: " * ";
} */
.required{
color: #FFFFFF !important;
background-color: #F3734C !important;
}

/* *:after{
color:#000000 !important;
font-size:25px;
vertical-align: -25%;
} */

.uppercase{
text-transform:uppercase;
}

.input-holder-label{
width:100%;
height:20px;
background:#428ccb;
margin-bottom:0px;
border-radius:5px 5px 0px 0px;
text-align:center;
color:#ffffff;
overflow:hidden;
}

.label-buttoned {
border-radius:10px;
height:40px;
vertical-align: -60%;
}

/*.input-holder-container{
max-width:620px;
}*/

@media (max-width:1200px) {
    .input-holder {
   width:260px !important;
   }
}


@media (max-width:700px) {
    .input-holder {
   width:240px !important;
   }
}

@media (max-width:550px) {
    .input-holder {
   width:200px !important;
   }
   .input-holder input, .input-holder select{
font-size:10px;
}
}

.size-6-3{
width:600px;
}

.size-5-3{
width:500px;
}

.size-4-3{
width:400px;
}

.size-3-3{
max-width:100px;
}

.size-3-3 input{
font-size:11.5px;
}

.size-2-3{
max-width:200px;
}

.size-1-3{
max-width:100px;
}

.size-18-3{
max-width:180px;
}

.size-17-3{
max-width:170px;
}

.size-16-3{
max-width:160px;
}

.size-15-3{
max-width:150px;
}

.size-14-3{
max-width:140px;
}

.size-08-3{
max-width:80px;
}

.size-07-3{
max-width:70px;
}

.size-06-3{
max-width:60px;
}

.size-05-3{
max-width:50px;
}

.check-box {
border:1px solid #cccccc;
border-top:none;
border-top-left-radius:5px;
border-top-right-radius:5px;
}

.check-box .check-container{
background:#ffffff;
}
.check-box .form-control{
margin-top:0px;
}

/* custom styles for the form inputs */


/*styles for the tables  table-container{*/
/*
.table-container table tbody tr{
font-size:12px;
}*/

.table{
margin-bottom:0px;
width:99% !important;
max-width:99% !important;
}

.table-container table > thead  > tr > th, .pop-up-table  table th{
background:#337ab7;
height:25px;
color: #ffffff !important;
font-size:12px;
text-align:center;
padding-top:5px;
padding-bottom:5px;
white-space:nowrap;
padding-right:5px;
padding-left:5px;
border:1px solid white;
border-top:none;
border-bottom:none;
}

.table-container table > thead  > tr > th:first-child{
border-top-left-radius: 10px !important;
border:none;
}

.table-container table > thead  > tr > th:last-child{
border-top-right-radius: 10px !important;
border:none;
}

.table-container table > tbody{
border: 1px solid #337ab7;
}

.table-container table > tbody >tr:last-child{
border:none !important;
}
.table-container table > tbody >tr{
background:#ffffff;
border-bottom:1px solid #dddddd;
}

.table-container table > tbody >tr{
white-space:nowrap;
height:25px;
text-align:left;
vertical-align: top;
}

.table-container table > tbody >tr >td{
padding-left:6px;
padding-right:6px;
}
.table-container table > tbody >tr >td{
border-right: 1px solid #337ab7;
}

.selected{
color:#FF0000;
}

/*
.table-container table thead tr th{
background:red;
padding:0px;
}*/

.table-container table tbody tr:hover, .pop-up-table  table tbody tr:hover{
background:#6BC4F7;
}

/* this is for the pop up table{*/

.pop-up-table{
/*border: 1px solid #c9c9c9;*/
margin-bottom:5px;
}

.pop-up-table  table td, .pop-up-table  table th{
padding-left:5px;
border:1px solid #c9c9c9;
font-size:12px;
white-space:nowrap;
}

.pop-up-table  table tbody tr td{
white-space:nowrap;
padding-left:5px;
}

.odd{
background:#E3E4E6;
}

/* en pop up table}*/


/*** datatable options and search stuff */

.selected_options {
  transition: width 0.7s;
}

.datatables_options>input, .selected_options {
  border-radius: 25px 25px 25px 25px;
  border: solid 1px rgb(66,139,202);
  background: white;
}

.row_option {
  display: inline-block;
  width: 28px;
  height: 28px;
  padding-top: 3px;
  margin-left: 5px;
}
.hand_over {
  cursor: pointer;
}

.dataTables_wrapper .dataTables_length {
  width: 60px;
}
.datatables_options {
  width: 20%;
  height: 30px;
  overflow: hidden;
  display: inline-block;
  font-size: 16px;
  margin-right: 2px;
}

.opt_showing {
  width: 120px;
}

.opt_hidden {
  background: transparent;
  width: 0px;
  border: none;
}

.dataTables_length {
  width: 60px;
}

.datatables_options>select {
  border-radius: 0px 25px 25px 0px;
  border: solid 1px rgb(66,139,202);
  background: white;
  height:30px;
  /* background: rgb(220,236,213); */
}

.dataTables_wrapper .dataTables_paginate {
  min-width: 300px;
}
.dataTables_paginate {
  border-radius: 0px 25px 25px 0px;
  border: solid 1px rgb(66,139,202);
  background: white;
  min-width: 300px;
  /* background: rgb(220,236,213); */
  text-align: center;
}
.datatables_options {
  /* width: 20%; */
  height: 30px;
  overflow: hidden;
  display: inline-block;
  font-size: 16px;
  margin-right: 2px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: rgb(66,139,202);
  color: white;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
  /* box-sizing: border-box; */
  display: inline-block;
  /* min-width: 1.5em; */
  text-align: center;
  text-decoration: none !important;
  cursor: pointer;
  min-height: 29px;
  min-width: 30px;
  /* border-radius: 50%; */
  padding-top: 3px;
}

.dataTables_wrapper .dataTables_info {
  padding-top: 3px;
}
.dataTables_info {
  /* border-radius: 0px 25px 25px 0px; */
  border: solid 1px rgb(66,139,202);
  background: white;
  /* background: rgb(220,236,213); */
  min-width: 300px;
  text-align: center;
}

.dataTables_filter>input {
  width: 100%;
  height: 100%;
}

/*fin table options */

/* fin styles for the tables  table-container}*/



/*para el dialogo*/

.centrar{
    margin-left:auto;
    margin-right:auto;
    width:30%;
}

.centrarenpantalla{
 margin-left:auto;
    margin-right:auto;
	margin-top:8%;
}

.fondo_modal{
width: 100%;
height: 100%;
background: rgba(80,80,80,0.5);
display: none;
position:absolute;
top:0px;
left:0px;
z-index:9999;
}

/* fin para el dialogo */

/** this is for the sub menu headers */
.main-header{
margin-top:-15px;
font-size:22px;
padding-bottom:5px;
}

/** end sub menu headers **/



/* info labels style in the abonofactura stuff */

.default-form{
border:1px solid #A1A1A1;
margin-top:2px;
}

.default-input{
background:none;
background:#F3F3F9;
color:#000000;
font-size:12px;
height:24px;
width:100%;
margin:0px;
border:none;
/*border: 1px dotted #000000;*/
border-radius: 5px;
word-wrap: break-word;
padding-left:3px;
}



.default-input-g{
display:inline-block;
background:#E3E4E6;
margin:1px;
margin-right: -4px;
border: 1px solid #5A5A5A;
/* border-top-left-radius:5px;
border-top-right-radius:5px; */
}

.default-label{
text-align:center;
background:#5DB0F7;
display: block;
max-height:16px;
}
/* end info labels style in the abonofactura stuff */


/* new styles for sizes*/
.xmin{
width:8.25%;
min-width:50px;
}


.min{
width:16.5%;
min-width:100px;
/*width:100px;*/
}

.med{
width:33%;
min-width:150px;
/*width:200px;*/
}

.big{
width:49.5%;
min-width:200px;
/*width:301px;*/
}

.large{
width:73%;
min-width:250px;
/*width:402px;*/
}

.large1{
width:82.5%;
min-width:300px;
/*width:604px;*/
}

.xlarge{
width:99%;
min-width:300px;
/*width:604px;*/
}



/* end new styles for sizes*/

/* style for table tr,td with content based classes */

.ready{
background:#B4EFD7!important;
}
.null{
background:#E2E3E5!important;
}
.emitted{
background:#FDFDA7!important;
}
.processing{
background:#EABEF5!important;
}
.deadlined{
background:#f1b4b6!important;
}
.deadline{
background:#F9D77B!important;
}
.deadline.processing{
background:#CBB0DC!important;
}

.deadlined.processing{
background:#F97B7F!important;
font-weight:bold;
}

/*this takes the first td of a deadlined task we´ll think of a way to use this in the future */
/* .deadlined.processing td:first-child {
	
background:#74C1FC!important; 

} */

/* .textcontent{
max-width:250px!important ;
overflow: hidden;
} */
/* .cod{
width:200px!important;	 
} */


.tooltip-inner {
  color:#000;
  background-color: #E6F1FF;
  border: 2px solid #9F9F9E;
   max-width:250px; 
  overflow: hidden;
  }
  
  .tooltip.in {
  filter: alpha(opacity=100);
  opacity: 1;
}

.tiptitle{
color:red;
}
.convencion{
border:1px solid black;
border-radius:10px;
max-height:60px;
max-width:600px;
position:absolute;
right:0px;
}
.convencion span{
display:inline-block;
text-align:center;

}
/* end style for table tr,td with content based classes */

.gdataitem{
	background-color: #9EDBBD !important;
}

.toolong{
	font-size:12px;
	width:750px !important;
	white-space: normal !important;
	border-radius: 10px;
	padding:1px;
}
.toolong2{
	font-size:12px;
	max-width:50px !important;
	white-space: normal !important;
	border-radius: 10px;
	padding:1px;
}

.nopadding{
	padding:0px;
	}
	
#tbl_tblselectproducto tr td{
	white-space:normal;
}	
		
#tbl_tblselectproducto tr td:nth-child(3) {
    width:360px;
}