/* @import url("font-awesome.min.css"); */
/*@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,600");*/

/*@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');*/



/* Colors 
Header #0277BD
Botones #009688 
Botones Hover #009600
Equipo Seleccionado Hover de la lista #DEE3E9 
Equipo Seleccionado Actual #E1F5FE
Secciones Internas -> #006064 
.TitulodelArbol -> background-color: #0277BD;

14px Para Titulos
12px Para Contenido
10px Para Tablas

*/   

/* Colores 

TH - tablas #C5CCD4
Border Tabla #C5CCD4

TH #FFF176
TH #69F0AE

Secciones Internas -> #006064

.titulos_secciones_Reporte -> Size: 12px ; Back: #006064 ; color texto : blanco;

Bordes : #C5CCD4;

*/  


html,body{
      /*   font-family: "Roboto", sans-serif;
    	font: inherit; */
}

.bgimage {
    /* The image used */
    /*background-image: url("images/fondo1.jpg");*/
    background-color: #F0F8FF;
  
    /* Full height */
    height: 99%; 
  
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

   /* border: 5px solid green;*/
    
  } 

#main-wrapper{     

    margin-top: -10px;
    margin: auto;
    width: 99%;
    border: 0px solid red;
    height: 100%;
    border-radius: 3px;
    overflow-x: auto;

}

.header_azul{

    width: 99%;
    height: auto;
    border: 0px solid red;
    background-color:  #0277BD;
    margin: auto;
}

.HeaderPracticas{
    width: 90%;        
    margin: auto;
    color: white;
    font-weight: bold;
    font-size: 16px; 
    border: 0px solid yellow;
    height: auto;
}

.CajaPrincipal
{
    width: 90%;
   /* border : 1px solid blue; */
    height: 100%;
    margin: auto;

}

.footerbuttons {
  position: fixed;
  left: auto;
  bottom: 15px;
  width: 99%;
  /*background-color: red;*/
  color: white;
  text-align: center;
  height: auto;
  border: 1px solid gray;
  border-radius: 5px;
   margin: auto;
}

.CajaBotonesX{
    margin: 10px;
    width: 98%;
    border-top: 1px solid black;
}


.CajaCuestionarioGeneral{
    width: 100%;
    border: 1px solid gray;
    border-radius:5px;
    height: 80%;
    float: left;
    margin-top: 10px;
    line-height: normal ;
    padding: 3px;
}

.CajaPregunta{
    width: 100%;
    height: auto;
   /* border: 1px solid blue;*/
    height: 250px;
    overflow-x: auto;
    margin: 5px;
    font-weight: bold;
    font-size: 16px; 
}

.CajaPreguntaWinner{
    width: 100%;
    height: 250px;
    background: url('images/fondo_winer.png') no-repeat fixed;
}



.CajaRespuestas{
    color: black;
    margin: 10px;
    border-top: 1px solid black;
    width: 98%;
    height: auto;
    font-size: 16px; 
}

.CajaRespuestasIndividual{
    width: 100%;
    height: auto;
    border: 0px solid green;
    background-color: transparent;
    margin: 5px;
    cursor: pointer;
}

.RespuestaSeleccionada{
    background-color: #DEE3E9 !important ;
    color: black;
    font-weight: bold;
} 
 


.Parrafo{
    width: auto;
    height: auto;
    /*border: 10px solid green;*/
    background-color: transparent;
    text-align: right;
    float: left;
}


.MostrarRespuesta{
    width: 100%;
    height: auto;
    border: 0px solid green;
    background-color: transparent;
    text-align: left;
}


#contador{
    width: auto;
    height: 100%;
    float: left;
    margin: 10px;
}


.CajaEstadisticas{
    width: 100%;
    border: 1px solid gray;
    border-radius:5px;
    height: 80%;
    float: left;
    margin-top: 10px;
    line-height: normal ;
    font-size: 12px;
    padding: 3px;
    display: none;
}


.CuadroTextoPregunta{
    width : 50px; 
    height : 20px ; 
    text-align: center;
    font-size : large; 
    font-weight: bold; 
    /* background-color: red;*/
}



.icons{
    padding-left: 5px;
    width: 99%;
    float: left;
    border: 1px solid #C5CCD4;
    text-align: left;    
    border-radius: 3px; 
}


.button_DIV {
    background-color: #0277BD;
    border: none;
    color: white;
    padding: 5px; 
    text-align: center;
    text-decoration: none;  
    display: inline-block;
    font-size: 16px !important;
    margin: 2px;
    cursor: default;
    border-radius: 5px;
    width: 120px;
    font-weight: normal;
}



.button_DIV:hover{
    background-color: #0277BD;
    /*padding: 6px;*/
     font-weight: bold;
}



.ContenedorSinArbolTablas{
    width: 99%; 
    margin: 0 auto 0 auto;
    font-size: 12px;
    border: 1px solid #C5CCD4;
    height: 99.9%;
    float: left; 
    border-radius: 0px; 
    padding: 10px;
    overflow-x: auto;
} 

.ClaseReloj{
    /* height: 20px; */
    margin-top: 0px;
    border: 1px solid #0277BD;
    border-radius: 2px;
    width: 100%;
    float: right;
    font-size: 16px;
    font-weight: bold;
    padding: 2px;    
}

.ClaseContadorReloj{
    margin-right: 5px;
    float: right;
}





.ClaseHora{
    color: green;
    float: left;
}

.ClaseMinutos{
    color: green;
    float: left;
}

.ClaseSegundos{
    color: green;
    float: left;
}

.ClaseTiempoMaximo{
    color: red;
    float: left;
}

.MostrarRespuesta{
    width: 100%;
    height: auto;
    border: 0px solid green;
    background-color: transparent;
    text-align: left;
    font-size: small;
}

#contador{
    width: auto;
    height: 100%;
    float: left;
    margin: 10px;
}


.FondoRojo{
    background-color: orange;
    
}

.FondoVerde{
    background-color: greenyellow;
}

/* Cajas de Traduccion */


.CajaMostrarRespuesta{
    float: left;
  
}

.CajaMostrarTraductor{
    float: left;
    color : #0277BD;
}

.CajaMostrarArchivo{
    float: left;
    color : #0277BD;
}

a:visited,a:link{
    text-decoration: none;
}

.clasetraduccion{
    
    color : #0277BD;
    font-weight: bold;
    margin-left: 10px;
    width: 90%;
   /* font-size: 12px;*/
    
}

/* Seccion Divs */
.seccion-circulos{
    width: 100%;
    
}

.circulo{
   float: left;
   font-size: 10px;
   border : 1px solid gray;
   border-radius: 50%;
}



table
{
    border: 1px solid gray;
}

tr{
    border: 1px solid #DEE3E9;
}

tr:nth-child(even) {background-color: #f2f2f2}

.class_th{
    border: 1px solid #DEE3E9 !important;
}

.class_td{
    text-align: center;    
}


.icon_save{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/icono_guardar.png');
    background-repeat: no-repeat;
    background-position: 5px center ;    
}

.icon_calcular{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/icono_calcular.png');
    background-repeat: no-repeat;
    background-position: 5px center ;    
}

.icon_eliminar{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/icono_eliminar.png');
    background-repeat: no-repeat;
    background-position: 5px center ;    
}

.icon_back{
    background-size: 18px 18px; 
    background-image: url('../ToolsCalculos/Icons/icon_anterior_24dp.png');    
    background-repeat: no-repeat;
    background-position: 2px center ;    
} 

.icon_siguiente{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/icon_siguiente_24dp.png');
    background-repeat: no-repeat;
    background-position: 2px center ;    
}

.icon_estadisticas{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/icono_grafica.png');
    background-repeat: no-repeat;
    background-position: 2px center ;    
}

.icon_ayuda{
    background-size: 18px 18px;
    background-image: url('../ToolsCalculos/Icons/Icono_Ayuda.png');
    background-repeat: no-repeat;
    background-position: 2px center ;    
}