body{
font-size: 140%;
}

p, a, strong, button, input, select, div
{
    -moz-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

#logo-md{
	padding-top:10px;
	padding-left:7px;
	padding-bottom: 20px;
	width:300px;
}

.margintop{
	margin-top: 10px;
}

.hiddenRow {
    padding: 0 !important;
}

.no-padding-left{
	padding-left: 0;
}

.tooltip.left .tooltip-inner{
    background-color:red;
}
.tooltip.left .tooltip-arrow{
    border-left-color: red;
}
.active-row{
	background: #528D16;
    color: white;
}
.selected-row > tr:hover{
	background: #528D16;
	color: black;
}

.border-rounded{
	border-radius: 5px;
}
.btn-margin{

	margin-top: 25px;
}
.btn-margin-top{
	margin-top: 10px;
}
.btn-margin-bottom{
	margin-bottom: 10px;
}
.text-white{
	color: white;
}
.btn-box{
	width: 95%;
	height: 100%;
}


.select2-container--default .select2-selection--single {
  background-color: #fff;
  border: 1px solid #D2D6DE;
  border-radius: 0;
  height: 34px;
  margin-top: 1px;
}

.bg-brown{
	background-color: #352B1C !important;
	color: white;
}

.bg-gold{
	background-color: #B49207 !important;
	color: white;

}
.bg-dark-green{
	background-color: #033013 !important;
	color: white;

}

.bg-black{
	background-color: black;
	color: white;
}

.bg-fv-yellow{
	background-color: #e6124c;
	color: white;
}

.bg-fv-blue{
	background-color: #000760;
	color: white;
}

.bg-fv-darkblue{
	background-color: #000543;
	color: white;
}

.table-scroll{
   height: 300px;
   overflow: auto;
}

.alert-danger, .alert-success, .alert-warning, .alert-info
{
    background-color: #f0f0f0 !important;
    color: #666 !important;
}

/* .table-scroll > tbody {
	
    height: 250px;
    overflow-y: scroll;
    position: absolute;
 }
*/


/* MODIFICACIONES DEL ADMINLTE */

.skin-green .sidebar-menu>li:hover>a, .skin-green .sidebar-menu>li.active>a {
    color: #fff;
    background: #e98400;
    border-left-color: #fff;
}

.skin-green .sidebar-menu>li>.treeview-menu {
    margin: 0 1px;
    background: #3366cc;
}


.skin-green .main-header .logo {
    background-color: #e98400;
    color: #fff;
    border-bottom: 0 solid transparent;
}

.skin-green .main-header .logo:hover {
    background-color: #e98400;
    color: #fff;
    border-bottom: 0 solid transparent;
}

.main-header .logo{

	font-size: 16px;
}

/* BARRA SUPERIOR */

.skin-green .main-header .navbar {
    background-color: #000760;
}

.skin-green .main-header .navbar .sidebar-toggle:hover {
    background-color:  #3366cc;
}

.skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side {
    background-color: #000543;
    /*background-image: url("../dist/img/sidebar_bg.jpg");
    background-repeat: no-repeat;*/
}
/*.sidebar-menu>li>a {
    padding: 10px 5px 10px 10px;
    display: block;
}*/

.active > .item-table-responsive {
    background-color: #d0d0d0 !important;
}

.skin-green .treeview-menu>li>a {
    color: #fff;
}

.skin-green .treeview-menu>li>a:hover {
    font-size: 1.2em;
}

.skin-green .main-header .navbar .nav>li>a:hover, .skin-green .main-header .navbar .nav>li>a:active, .skin-green .main-header .navbar .nav>li>a:focus, .skin-green .main-header .navbar .nav .open>a, .skin-green .main-header .navbar .nav .open>a:hover, .skin-green .main-header .navbar .nav .open>a:focus, .skin-green .main-header .navbar .nav>.active>a {
    background-color: #3366cc;
    color: #f6f6f6;
}

.skin-green .main-header li.user-header {
    background-color: #000543;
}

.navbar-nav>.user-menu>.dropdown-menu>.user-footer {
    background-color: #fff;
    padding: 10px;
}

.fv-text{
	color: #000543;
}

.fv-text:hover{
	color: #3366cc;
}

.progress-bar-green, .progress-bar-success {
    background-color: #ffffff;
}

.progress {
    background-color: rgba(255, 255, 255, 0.35);
}





/*

azul #000760

azul oscuro 000543

azul claro 0088e8

amarillo #e98400

 */








/**************************** Rect BOX Styles ******************************/

.box {
    position: relative;
    background: #ffffff;
    border: 0;
    margin-bottom: 20px;
    width: 100%;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.box.box-solid>.box-header>.box-tools .btn {
    border: 0;
    box-shadow: none;
    color: white;
}

.box-header .box-title {
    display: inline-block;
    font-size: 18px;
    margin: 0;
    line-height: 1;
    color: black;
}
.box.box-info {
    background: #00C0EF;
    color: white;
}

/*.box.box-red {
    background-color: #d33724;
    color: white;
}*/

/*.box.box-green {
    background-color: #005A03;
    color: white;
}*/

.box-red{
	border-top: 3px solid #d33724;
	box-shadow: 0 1px 1px rgba(0,0,0,0.3);
}

.box-orange{
	border-top: 3px solid #E98400;
	box-shadow: 0 1px 1px rgba(0,0,0,0.3);
}

 .box-green{
        border-top: 3px solid #005A03;
        box-shadow: 0 1px 1px rgba(0,0,0,0.3);
}

 .box-yellow{
        border-top: 3px solid #f39c12;
        box-shadow: 0 1px 1px rgba(0,0,0,0.3);
}


.box.box-olive {
    background-color: #415000;
    color: white;
}


.box.box-warning {
    background-color: #f39c12;
    color: white;
}

.box.box-orange {
 background-color: white;
 color: black;
}

.box.box-primary {
    background-color: #3c8dbc;
    color: white;
}

.box.box-navy {
    background: #001f3f;
    color: white;
}

.modal-xs {
 width: 100px;
}


 .btn-warning.active.focus, .btn-warning.active:focus, .btn-warning.focus, .btn-warning.focus:active, .btn-warning:active:focus, .btn-warning:focus {
 /*outline: thin dotted;
 outline-offset: -2px;*/
 background-color: #BF7500;
 }

 .btn-success.active.focus, .btn-success.active:focus, .btn-success.focus, .btn-success.focus:active, .btn-success:active:focus, .btn-success:focus {
 /*outline: thin dotted;
 outline-offset: -2px;*/
 background-color: #005A31;
 }

 .btn-danger.active.focus, .btn-danger.active:focus, .btn-danger.focus, .btn-danger.focus:active, .btn-danger:active:focus, .btn-danger:focus {
 /*outline: thin dotted;
 outline-offset: -2px;*/
 background-color: #A22212;
 }

 .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.focus, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:focus {
 /*outline: thin dotted;
 outline-offset: -2px;*/
 background-color: #164966;
 }


.btn-navy {
    background-color: #102D70;
    border-color: #ccc;
    color: white;
}
.btn-navy:hover {
background-color: #165BAF;
border-color: #ccc;
color: white;
}

.btn-navy.active {
background-color: #165BAF;
border-color: #ccc;
color: white;
}



.fc-ltr .fc-time-grid .fc-event-container {
    margin: 0 2px 0 2px;
}


.margin-bottom-none {
    margin-bottom: 0px;
    text-transform: uppercase;
    padding-bottom: 0px;
    opacity: 0.6;
}

.margin-bottom-none h3{
color: #333;
    font-weight: 600;
}

label{
    margin-top: 10px;
    padding-left: 0px !important;
    display: block;
}

input[type="checkbox"], input[type="radio"] {
    margin-right: 5px !important;
}

.box-header {
    color: #444;
    display: block;
    position: relative;
    padding: 10px;
    border-bottom: 1px solid rgba(12, 24, 165, 0.55);
}

.box-header .box-title {
    display: inline-block;
    font-size: 18px;
    margin: 0px;
    line-height: 1;
    color: #666;
}

#cinc{
    margin-top: 50px;
}

b, strong {
    font-weight: 400;
}

.box-blue, .box-red, .box-teal, .box-yellow, .box-green {
   border-top: 0px;
}

.bg-blue-active, .bg-blue-red, .bg-red-active, .bg-teal-active, .bg-blue-teal, .bg-blue-yellow,  .bg-green-active {
    background-color:transparent!important;
}

.bg-orange-active{
    border: 0px;
}

.bg-green-active, .bg-green-red, .bg-green-teal, .box-orange, .bg-green-yellow, .bg-blue-active {
    background-color:transparent!important;
}

.box-header .box-title {
    text-transform:none;
}

.bg-info {
    
background-color: #E3E3E3;
}

.scroll-top-wrapper {

    border-radius: 50%;
}

.content-wrapper, .right-side {
    background-color: #f0f0f0;
}

.skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side {
    background-color: #333;
}

.skin-green .sidebar a {
    color: #dfdfdf;
}

.btn.btn-box-tool {
    display: none;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #666 !important;
    border: 1px solid #666 !important;
}

.btn-danger.active, .btn-navy:hover, .btn-navy.active, .btn-danger:active, .open > .dropdown-toggle.btn-danger {
    background-color: rgba(0, 0, 0, 0.18);
    border-color: #CCC;
    color: #000;
}
.btn.active, .btn:active {
    background-image: none;
    outline: 0px none;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.125) inset;
    background-color: rgb(233, 132, 0) !important;
    border-color: rgb(233, 132, 0) !important;
    color: white !important;
}

.btn.active.focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn:active:focus, .btn:focus {
    outline: none !important;
}

.btn {
    border-radius: 3px;
    box-shadow: none;
    border: 1px solid transparent;
}

.btn:hover {
    
    box-shadow: 5px 3px 5px rgba(0, 0, 0, 0.11) inset;
}

.btn-box-tool:hover {
    box-shadow: none !important;
/*    background-color: #f0f0f0 !important;*/
}

.scroll-top-wrapper:hover {
    background-color: #E98400;
    opacity: 1 !important;
}

.btn-danger, .btn-navy {
    background-color: #EAEAEA !important;
    border-color: #DEDEDE !important;
    color: #000 !important;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    height: inherit !important;
    padding: 5px;
    text-align: center;
    background-color: #E98400;
}


.btnEllipse {
    border-radius: 3px;
    box-shadow: none;
    border: 1px solid transparent;
    height: 34px !important;
    border-radius: 5px;
    margin-left: 0px;
}

.btnEllipseMini {
    box-shadow: none;
    border: 1px solid transparent;
    height: 26px !important;
    border-radius: 50%;
    padding: 3px;
    width: 26px !important;
}

#header-fixed { 
    position: fixed; 
    top: 0px; display:none;
    background-color:white;
}

.btnEllipse .fa {
    float: left;
    padding: 3px;
}

.btnEllipse p {
    float: right;
}

.orange{
    
    background-color: #E98400 ;
    color: white;
}

.white{
    color: white;
}

.main-sidebar, .left-side {
    padding-top: 0px;
}

.navbar-static-top {
    position: fixed;
    top: 0px;
    right: 0px;
}

.skin-green .main-header .navbar .nav > li > a {
    color: #FFF;
}

.skin-green .main-header .navbar {
    
    background-color: transparent;
    width: 100%;
}

#li_tutorial {
    font-size: 18px;
}

.navbar-custom-menu > .navbar-nav  {
    position: relative;
    background-color: rgba(0, 0, 0, 0.23);
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    margin-top: 5px;
    margin-right: 5px
}

.skin-green .main-header .navbar .nav > li > a:hover, .skin-green .main-header .navbar .nav > li > a:active, .skin-green .main-header .navbar .nav > li > a:focus, .skin-green .main-header .navbar .nav .open > a, .skin-green .main-header .navbar .nav .open > a:hover, .skin-green .main-header .navbar .nav .open > a:focus, .skin-green .main-header .navbar .nav > .active > a {
    background-color: transparent;
    color: #F6F6F6;
}

.enjoyhint_close_btn {

 
}



.btn-danger.active.focus, .btn-danger.active:focus, .btn-danger.active:hover, .btn-danger.focus:active, .btn-danger:active:focus, .btn-danger:active:hover, .open > .dropdown-toggle.btn-danger.focus, .open > .dropdown-toggle.btn-danger:focus, .open > .dropdown-toggle.btn-danger:hover {
    border-color: #CCC;
    background-color: rgba(0, 0, 0, 0.4);
    color: white;
}

.fc-event {

    border-radius: 0px !important;

}

.bg-navy {
    background-color: #E98400 !important;
}

/*.callout.callout-danger, .alert-danger, .alert-error, .label-danger, .modal-danger .modal-body {
    background-color: #e98400 !important;
}*/

.orange {
    background-color: #666 !important;
    color: #FFF;
    padding: 12px 5px 12px 18px;
    height: 50px;
}

.orange:hover{
     background-color: #000760;
}

.active {
    color: white !important;
    background-color: #e98400 !important;
    border-color: #e98400 !important;
}

.required:after
{
    content: " *";
}
    
.required
{
    color: #a94442;
}

.borderRed
{
	border: red 1px solid;
}

.main-sidebar{
    position: fixed;
}

.bar {
    fill: #E98400;
}

.table-scroll {
    height: 210px;
    overflow: auto;
    border-radius: 3px;
}

.sidebar-menu li.active>a>.fa-angle-down {
    -webkit-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    transform: rotate(-180deg)
}


.circle-orange {
    fill: orange;
}

.skin-green .sidebar-menu > li > .treeview-menu {
    margin: 0px 1px;
    background: #555 none repeat scroll 0% 0%;
}

.box-title strong {
    text-transform: uppercase !important;
}

.modl {
    
background: rgb(227, 227, 227) none repeat scroll 0% 0%;
border-radius: 5px;
padding: 25px;
text-align: center;
color: white;
    
}

.hgl{
    
color: white;
font-weight: 100;
font-size: 40px;
text-align: center;
}



      .text-white{
        color: white;
      }


	.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #005A03;
    border: 1px solid #18831B;
    
	}
	.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #FFF;
    margin-right: 8px;
	}

	.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin: 0px;
    position: relative;
    vertical-align: middle;
    color: black;
    }
	
.d3-tip {
  line-height: 1;
  font-weight: bold;
  padding: 6px;
  background: #357CA5;
  color: white;
  border-radius: 2px;
}

/* Creates a small triangle extender for the tooltip */
.d3-tip:after {
  box-sizing: border-box;
  display: inline;
  font-size: 10px;
  width: 100%;
  line-height: 1;
  color: #357CA5;
  content: "\25BC";
  position: absolute;
  text-align: center;
}
.d3-tip.n:after {
  margin: -1px 0 0 0;
  top: 100%;
  left: 0;
}

.axis {
 fill: #00468C;
}

.axis path,
.axis line {
	 fill: none;
	 stroke: lightsteelblue;
	 opacity: 0.5;
	 shape-rendering: crispEdges;
}

.axis text {
 font-size: 11px;
 font-family: helvetica;
 font-weight: bold;
}

.tick{
    font-family: helvetica;
    font-size: 13px;
    font-weight: bold;
    fill: #00468C;
}

button.close {
    color: black;
}

.circle-blue{
    fill: #1F77B4;
}


.arrow::after {
   font-family: FontAwesome;
   content: "\f0dc";
   display: inline-block;
   padding-left: 5px;
   vertical-align: middle;
}

.navbar-nav > .user-menu > .dropdown-menu > .user-footer {
    background-color: #dfdfdf;
    padding: 10px;
}

.fc-content{
   text-align:right;
}
.fc-content>.fc-time{
    display: none;
}

.tbl thead, .tbl .tbody
{
    display: block;
    width: 100%;
}

.tbl thead
{
    display: inherit !important;
}

.tbodysc
{
    overflow-x: hidden;
    width: 100% !important;
    overflow-y: auto;
    display: block;
    max-height: 230px;
}

a {
    color: #E98400;
}

a:hover, a:active, a:focus {
    outline: medium none;
    text-decoration: none;
    color: rgba(233, 132, 0, 0.58);
}

ul.social-buttons li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 40px;
    outline: 0px none;
    background-color: #E98400;
    transition: all 0.3s ease 0s;
    text-align: center;
    color: #FFF !important;
    margin-bottom: 0px;
}

.list-inline > li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
    margin-bottom: 0px;
}

.select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {
 border: 1px solid #D2D6DE;
 border-radius: 0px;
 padding: 4px 0px;
 height: 34px;
}


#modal-correo .modal-header {
	padding: 9px 15px;
	background-color: #ff7701;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.modal-content{
	border-radius: 5px;

}

.btn.active:hover {
    background-color: #d97b00;
    border-color: #d97b00;
    color: #FFF;
}

.enjoyhint_next_btn, .enjoyhint_skip_btn {
    font: 17px/40px "Advent Pro",Helvetica,sans-serif;
    border-radius: 3px !important;
}

#logo-md {
    padding: 0px;
    width: 250px;
}

.logo-tit {
    font-weight: 500;
    padding-bottom: 8px;
    padding-top: 10px;
    border-bottom: 2px solid #E98400;
    margin: 0px;
    opacity: 0.6;
    margin-top: 8px;
}

.login
{
    background: none;
    background-color: rgb(223, 223, 223);
}

.div-login {
    display: block;
    background: rgba(255, 255, 255, 0.4) none repeat scroll 0% 0%;
    border-radius: 10px;
    padding: 30px!important;
    margin-top: 3% !important;
    margin-bottom: 3% !important;
}

.close {
    color: #FFF;
    opacity: 0.6;
}

.active-row {
    color: #FFF;
    background: rgba(34, 34, 34, 0.85) none repeat scroll 0% 0%;
}

.select2-container .select2-search--inline {
    float: left;
    width: 100%!important;
}

.btnLink {
    background-color: transparent;
    border: 0px;
    color: #333 !important;
    margin-bottom: 5px;
        
}

.btnLink:hover {
    color: #666 !important;
}

.filtrosh
{
    border-left: 2px solid #E98400;
    padding-left: 10px;
}

.rowfill

{
    background-color: white;
    padding: 20px;
}

.table {
    margin-bottom: 0px;
    width: 100%;
}

.content-header {
    position: relative;
    padding: 0px !important ;
}



.tbf table {
        width: 100%;
    }

.tbf  thead, .tbf tbody,.tbf  tr,.tbf  td,.tbf  th { display: block; }

.tbf tr:after {
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

.tbf thead th {
    height: 30px;

    /*text-align: left;*/
}

.tbf tbody {
    height: 210px;
    overflow-y: auto;
}

.tbf thead {
    /* fallback */
}


.tbf tbody td, .tbf thead th {
    width: 19.2%;
    float: left;
}


.table-responsive > .table > tbody > tr > td, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > td, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > thead > tr > th {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.table-responsive > .table > tbody > tr > td
{
    line-height: 35px;
}



@media only screen and (max-width: 768px) {
    
.btnEllipse {
    border-radius: 50%;
    height: 38px !important;
    width: 38px !important;

}
    
#cinc{
    margin-top: 0px;
}
    
.filtrosh{
    border-left: 0px ;
    padding-left: 0px;
}

.btnEllipse .fa {
    float: none;
    padding: 0px;
}

.btnEllipse p {
    float: none;
    display: none;

}
    
.orange {
    background-color: #E98400 !important;
    color: #FFF;
    padding: 12px 5px 12px 18px;
    height: 50px;
}

}

/* Juan Donis 28/04/2016 -  Estilos para corregir BUGS en Intl-Tel-Input */

.intl-tel-input {display: table-cell;}

.intl-tel-input .country-list .country.highlight {background-color: #ccc;}

.intl-tel-input .iti-flag .arrow {border: none;}  

.intl-tel-input .country-list {z-index: 10;}

.intl-tel-input {width: 800px!important;}

.error{
    border: 1px solid red;
}

.VerMas
{
    text-align: center;
    background-color: rgba(255, 255, 255, 0.33);
    margin-top: 20px;
    border-radius: 10px;
    padding: 4px;
    color: white;
    cursor: pointer;
}

.widget-user-2 .widget-user-header {
    padding-bottom: 8px;
}

.select2-container--default .select2-selection--single {
		  background-color: #fff;
		  border: 1px solid #D2D6DE;
		  border-radius: 0;
		  height: 34px;
		  margin-top: 1px;
		}

.select2-search__field {
 width: 100% !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #56565B;
  line-height: 32px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {

 margin-top: 3px;

}

#logo-md{
  padding: 0;
  width: 250px;

}

#logo-md2{
  padding: 0;
  width: 120px;

}

/*.table-scroll > tbody {
    height: 250px;
    overflow-y: scroll;
    position: absolute;
} */

#li_tutorial{
 font-size: 20px;
 padding: 0 auto;
 }
  
#modal-reporte .modal-header {
padding: 9px 15px;
background-color: #ff7701;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.modal-content{
border-radius: 5px;

}

.popover{
left: -60px !important;
color: green;
font-size: 16px;

}

.arrow{
left: 80% !important;
}

hr {
 border-top: 1px solid gray !important;
 margin-bottom:5px !important; 
 margin-top:1px !important;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
height: 80px;
padding: 5px;
text-align: center;
}

.scroll-top-wrapper {
position: fixed;
opacity: 0.5;
visibility: hidden;
overflow: hidden;
text-align: center;
z-index: 99999999;
background-color: #888888;
color: #eeeeee;
width: 50px;
height: 48px;
line-height: 48px;
right: -100px;
bottom: 30px;
padding-top: 2px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {
background-color: #E98400;
}
.scroll-top-wrapper.show {
visibility:visible;
cursor:pointer;
opacity: 0.5;
right: 30px;
}
.scroll-top-wrapper i.fa {
line-height: inherit;
}



/******************************* CODIGOS TABLA CON HEADER FIJO *******************************************/

/*
Force table width to 100%
*/
 table.table-fixed {
    width: 100%;   
}
/*
Set table elements to block mode.  (Normally they are inline).
This allows a responsive table, such as one where columns can be stacked
if the display is narrow.
*/
 table.table-fixed, table.table-fixed>thead, table.table-fixed>tbody, table.table-fixed>thead>tr, table.table-fixed>tbody>tr, table.table-fixed>thead>tr>th, table.table-fixed>tbody>td {
    display: block;
}
table.table-fixed>thead>tr:after, table.table-fixed>tbody>tr:after {
    content:' ';
    display: block;
    visibility: hidden;
    clear: both;
}
/*
When scrolling the table, actually it is only the tbody portion of the
table that scrolls (not the entire table: we want the thead to remain
fixed).  We must specify an explicit height for the tbody.  We include
100px as a default, but it can be overridden elsewhere.

Also, we force the scrollbar to always be displayed so that the usable
width for the table contents doesn't change (such as becoming narrower
when a scrollbar is visible and wider when it is not).
*/


/*
We really don't want to scroll the thead contents, but we want to force
a scrollbar to be displayed anyway so that the usable width of the thead
will exactly match the tbody.
*/
 table.table-fixed>thead {
    overflow-y: hide;
    padding-right: 15px;
}
/*
For browsers that support it (webkit), we set the background color of
the unneeded scrollbar in the thead to make it invisible.  (Setting
visiblity: hidden defeats the purpose, as this alters the usable width
of the thead.)
*/
 table.table-fixed>thead::-webkit-scrollbar {
    background-color: inherit;
}


table.table-fixed>thead>tr>th:after, table.table-fixed>tbody>tr>td:after {
    content:' ';
    display: table-cell;
    visibility: hidden;
    clear: both;
}

/*
We want to set <th> and <td> elements to float left.
We also must explicitly set the width for each column (both for the <th>
and the <td>).  We set to 20% here a default placeholder, but it can be
overridden elsewhere.
*/

table.table-fixed>tbody tr td {
    float: left;    
    word-wrap:break-word;     
}

 table.table-fixed>thead tr th{
    float: left;
 }

/*table.table-fixed td{
    margin-left: 5px;
    margin-right: 5px;
}*/

table.table-fixed>tbody td {
   /* overflow-x: auto;*/
   /* display: block; */   
    
}

/*@media (max-width: 768px)
.table {
    width: 100%;
    margin-bottom: 15px;
    overflow-x: scroll;
    overflow-y: hidden;
    border: none;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    -webkit-overflow-scrolling: touch;
}*/

@media screen and (max-width: 400px) {
    .table-responsive{
        overflow-x: auto;
        display: block;
    }
}
 
/******************************* FIN DE CODIGOS TABLA CON HEADER FIJO *******************************************/