@charset "utf-8";

/* Agenda*/


.opta-agenda {
  display: table;
  width: 100%;
  background-color: white;
 /* border: 1px solid #666666;*/
 /* border-spacing: 5px;*/ /*cellspacing:poor IE support for  this*/
  box-sizing: border-box;
  /* border-collapse:separate;*/
}

.divRowHeaderAgenda {
  display: table-row;
  width: 100%;
  font-weight: bold  ;
  background-color: red;
  /*height: 25px;
  line-height:25px;
  */
  /*background-color:white;*/
  line-height: 20px;
  vertical-align: middle;
  border: 1px dotted #CCC;
  /* background: #F8F8F7; */

}


.divCellDiaActual {
  
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 44%;
  text-align: center;
  border: 1px dotted #CCC;
  border-left: none;
  border-right: none;
  box-sizing: border-box;
}

.divCellnbDeporte{
 
  float: right; /*fix for  buggy browsers*/
  display: table-column;
  width: 40%;
  text-align:right;
  border: 1px dotted #CCC;
  border-left: none;
  border-right: none;
  box-sizing: border-box;
  color:white;
}

.divRowAgenda {
  display: table-row;
  width: 100%;
  /*background-color: #ffffffff;*/
  background-color:white;
line-height: 20px;
vertical-align: middle;
border: 1px dotted #CCC;
/* background: #F8F8F7; */
}
.divCellAgeHora {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 10%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
    /*background-color: #ccc;*/
}
.opta-icon-modalidad {
  height: 20px;
  width: auto;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}



.tooltip-modalidad .tooltiptext {
  visibility:visible;
  width: 120px;
  background-color: #fff;
  color: #000;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;

  /* Position the tooltip text */
  position: absolute ;
  z-index: 1;
  top:125%;
 /* bottom: 125%;*/
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip-modalidad .tooltiptext::after {
  background-color: #fff;
  border-color: #555 transparent transparent transparent;
  border-radius: 6px;
  border-style: solid;
  border-width: 5px;
  bottom:100%;
  color: #000;
  content: "";
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  padding: 5px 0;
  position: absolute ;
  text-align: center;
  top:125%;
  transition: opacity 0.3s;
  visibility: hidden;
  width: 120px;
  z-index: 1;
}
 
/* Show the tooltip text when you mouse over the tooltip container */
.tooltip-modalidad:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}


.divCellModalidad {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 5%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
  /*background-color: #ccc;*/
}




.inputfecha {
  width: 92%;
}

.divCellSelFecha {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 45%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
    /*background-color: #ccc;*/
}


.inputdeporte {
  width: 94%;
  color:cadetblue;
  background-color: chartreuse;
  
  
}
.input {
  width: 100%;
  color:cadetblue;
  background-color: chartreuse;
  
  
}

.divCellSelDeporte {
  float: right; /*fix for  buggy browsers*/
  display: table-column;
  width: 45%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
}
/*
.custom-combobox {
  position: relative;
  display: inline-block;
}
.custom-combobox-toggle {
  position: absolute;
  top: 0;
  bottom: 0;
  margin-left: -1px;
  padding: 0;
}
.custom-combobox-input {
  margin: 0;
  padding: 5px 10px;
}
.ui-menu-item .ui-menu-item-wrapper:hover
{
  background-color: #CCC;
  border: none;    
}
*/
.divCellFlag {

   float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 5%;
    max-width: 20px;
    height: 20px;
    /*
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    */
/*    border: 1px dotted #CCC;
    box-sizing: border-box;
    text-align: left;
  display: table-column;
  height: 20px;
  width: 5%;
width: 33%;
  height: auto;
  vertical-align: middle;
   margin-bottom: auto;
    */

}


.divCellDirecto {

  float: left; /*fix for  buggy browsers*/
   display: table-column;
   width: 5%;
   max-width: 10px;
   border: 1px dotted #CCC;
   box-sizing: border-box;
   text-align: left;
   height: 20px;
   vertical-align: middle;
   margin-bottom: auto;
 /*
   text-align: left;
   white-space: nowrap;
   overflow: hidden;
   */

}
.divCellVacio {
  float: left; 
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}
.divCellResultado-0{
  float: left; 
/*  background-color: green;*/
  color: darkgreen;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}
.divCellResultado-1{
  float: left; 
/*  background-color: green;*/
  color: orange;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}
.divCellResultado-7{
  float: left; 
/*  background-color: green;*/
  color:red;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}

.divCellResultado-100{
  float: left; 
/*  background-color: green;*/
  color: black;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}
.divCellResultado-8{
  float: left; 
/*  background-color: green;*/
  color:darkslategray;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}
.divCellResultado-9{
  float: left; 
/*  background-color: green;*/
  color:navy;
  font-weight: bold;
  display: table-column;
  height: 20px;
  width: 5%;
  max-width: 20px;
  /*width: 33%;
  height: auto;*/
  vertical-align: middle;
   margin-bottom: auto;
}


.divCellFase {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 10%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
    /*background-color: #ccc;*/
}
.divCellSerie {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  width: 10%;
  text-align: center;
  border: 1px dotted #CCC;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
    /*background-color: #ccc;*/
}
.divCellAgePru {
  float: left; /*fix for  buggy browsers*/
  display: table-column;
  /*width: 55%;*/
  width: calc(75% - 80px);
  text-align: left;
  border: 1px dotted #CCC;
  box-sizing: border-box;
  /*background-color: #ccc;*/
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;

  }

  .opta-ico-directo {
    height: 20px;
    width: auto;
    max-width: 10px;
    /*width: 33%;
    height: auto;*/
    vertical-align: middle;
     margin-bottom: auto;
  }
  .divCellPto {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 5%;
    max-width: 10px;
    text-align: center;
    border: 1px dotted #CCC;
    box-sizing: border-box;
    /*background-color: #ccc;*/
  }
  
  .opta-icon-pto {
    height: auto;
    width: auto;
    max-width: 10px;
    /*width: 33%;
    height: auto;*/
    vertical-align: middle;
     margin-bottom: auto;
  }

