/*@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');*/

:root {
    --img-menu-movil: url(../../../Content/img/iconos/menu.png);
}

@font-face {
  font-family: 'Lato-LightItalic';
  src: url('../fuentes/Lato-LightItalic.ttf') format('truetype');
  font-family: 'Lato-HeavyItalic';
  src: url('../fuentes/Lato-HeavyItalic.ttf') format('truetype');
  font-family: 'Lato-BoldItalic';
  src: url('../fuentes/Lato-BoldItalic.ttf') format('truetype');
  font-family: 'Lato-Regular';
  src: url('../fuentes/Lato-Regular.ttf') format('truetype');
}
/*TEMPLATE*/
body, .ui-widget {
  font-family: 'Times New Roman', Times, serif;
  font-size: 14px;
  padding: 0px;
  margin: 0px;
}
/*Container*/
.container {
  width: 100%;
  float: left;
  box-sizing: border-box;
  overflow: hidden;
  /*Se deja fijo el sitio para no perder el color del sitio.*/
  /*CONTENIDO IZQUIERDO
  /*CONTENIDO DERECHO*/
}
.container .columnaIzq {
  box-sizing: border-box;
  float: left;
  width: 15%;
  background-color: #2c4456;
  height: 100vh;
  /*hace que el color llegue hasta el fondo del sitio*/
  /*height: 100%;*/
  z-index: 30;
}
.container .columnaIzq .columnaIzq-logo {
  width: 100%;
  text-align: center;
  margin-top: 15px;
  margin-bottom: 5px;
}
.container .columnaIzq .columnaIzq-logo img {
  width: 80%;
}
.container .columnaIzq .columnaIzq-usuario {
  padding: 0 10px;
  margin: 15px 0 10px 0;
  float: left;
  width: 100%;
  box-sizing: border-box;
}
.container .columnaIzq .columnaIzq-usuario .datosUsuario-img {
  width: 100%;
  float: left;
  text-align: center;
  margin: 0 0 10px 0;
}
.container .columnaIzq .columnaIzq-usuario .datosUsuario-img img {
  width: 35% !important;
  float: none !important;
  /*border: 1px solid #DDD; /*agregado para el imagen de usuario menu izq con border*/
  /*border-radius: 50%; /*agregado para el imagen de usuario menu izq con border*/
}
.container .columnaIzq .columnaIzq-usuario .datosUsuario {
  width: 100% !important;
}
.container .columnaIzq .columnaIzq-usuario .datosUsuario hr {
  border-bottom: 1px solid #A0A0A0;
}
.container .columnaIzq .columnaIzq-usuario .datosUsuario span {
  color: #FFF;
  padding: 0 0 0 5px;
  display: block;
  text-align: center;
}
.container .columnaIzq .columnaIzq-contenido {
  margin: 20px 0 10px 0;
  font-family: Lato-Bold;
  float: left;
  width: 100%;
}
.container .columnaIzq .columnaIzq-contenido .menu ul {
  margin-left: 10px;
  padding: 0;
  font-size: 15px;
}
.container .columnaIzq .columnaIzq-contenido .menu ul li {
  border-bottom: 1px solid #A0A0A0;
  list-style-type: none;
  /*-New--*/
  float: left;
  width: 100%;
}
.container .columnaIzq .columnaIzq-contenido .menu ul li a {
  text-decoration: none;
  padding: 6px 0 6px 5px;
  /*-New--*/
  color: #FFF;
  float: left;
  width: 100%;
}
.container .columnaIzq .columnaIzq-contenido .menu ul li a span {
  color: #FFF;
  /*display: block;*/
  /*padding: 6px 0 6px 30px;*/
  padding: 0 0 0 10px;
}

.container .columnaIzq .columnaIzq-contenido .menu ul li a:hover, 
.container .columnaIzq .columnaIzq-contenido .menu ul li a:hover i{
  /*color: #1ab395;*/
  /*-New--*/
  background-color: #1ab395;
  color: #FFF;
}
.container .columnaIzq .columnaIzq-contenido .menu ul li a i{ color: #1AB395; }

.container .columnaIzq .columnaIzq-footer {
  text-align: center;
  width: 15%;
  /*width: 100%;*/
  float: left;
  /*position: absolute;*/
  /*bottom:3px; DEJA EL FOOTER DE LA COLUMNA IZQUIERDA AL FINAL DEL SITIO, PERO AL CAMBIAR TAMAÑO DE LA VENTANA DEL NAVEGADOR SE PIERDE*/
  /*NUEVOS CAMBIOS */
  position: fixed;
  bottom: 5px;
}
.container .columnaIzq .columnaIzq-footer .ContenidoIzquierdaImagenValtek img {
  width: 70%;
}
.container .columnaIzq .columnaIzq-footer .containerLinkValtek {
  font-size: 15px;
}
.container .columnaIzq .columnaIzq-footer .containerLinkValtek a {
  text-decoration: underline #1ab395;
  color: #FFF;
  font-family: Lato-BoldItalic;
}
.container .columnaIzq .columnaIzq-footer .containerLinkValtek a :hover {
  color: #1ab395;
}
.container .columnaIzq .columnaIzq-footer .containerVersion {
  margin: 5px 0 0 0;
  background-color: #1ab395;
  text-align: center;
  color: #FFF;
  font-family: Lato-BoldItalic;
  font-size: 15px;
  bottom: 0px;
}
.container .columnaDer {
  width: 85%;
  float: left;
  box-sizing: border-box;
  background-color: #F3F3F5;
  height: 100vh;
  /*hace que el color llegue hasta el fondo del sitio*/
  overflow-y: scroll;
  /*Se le agrega el scroll al contenido derecho, ya que se dejo fijo el container*/
}
.container .columnaDer .topDerecha {
  background-color: #F3F3F5;
  box-sizing: border-box;
  float: left;
  padding: 10px;
  width: 100%;
}
.container .columnaDer .topDerecha .topDerechaIzq {
  width: 65%;
  float: left;
  text-align: left;
  box-sizing: border-box;
}
.container .columnaDer .topDerecha .topDerechaDer {
  width: 35%;
  float: left;
  box-sizing: border-box;
  text-align: right;
}
.container .columnaDer .topDerecha .topDerechaDer .BtnEmail {
  background-image: url(../img/iconos/mail.png);
  background-size: 20px;
  background-position: left;
  background-repeat: no-repeat;
  padding: 5px 0 0 30px;
}
.container .columnaDer .topDerecha .topDerechaDer .BtnEmail:hover {
  background-image: url(../img/iconos/mailBlanco.png);
}
.container .columnaDer .topDerecha .topDerechaDer .BtnBell {
  background-image: url(../img/iconos/notification.png);
  background-size: 20px;
  background-position: left;
  background-repeat: no-repeat;
  padding: 5px 0 0 30px;
  padding-left: 20px;
}
.container .columnaDer .topDerecha .topDerechaDer .BtnBell:hover {
  background-image: url(../img/iconos/notificationBlanco.png);
}
.container .columnaDer .topDerecha .topDerechaDer .BtnSalir {
  cursor: pointer;
}
.container .columnaDer .topDerecha .topDerechaDer .BtnSalir .TextoSalir {
  color: #808080;
  font-weight: bold;
  background-image: url(../../img/iconos/salirSesion.png);
  background-size: 25px;
  background-position: left;
  background-repeat: no-repeat;
  padding: 5px 0 0 23px;
  cursor: pointer;
}
.container .columnaDer .topDerecha .topDerechaDer .BtnSalir span:hover {
  color: #1ab395;
  text-decoration: underline #1ab395;
}
.container .columnaDer .Titular {
  float: left;
  width: 100%;
  background-color: white;
  /***/
}
.container .columnaDer .Titular .TituloTitular span {
  font-size: 28px;
  font-family: Lato-BoldItalic;
  color: black;
  font-weight: bold;
  color: #1ab395;
  text-align: left;
  margin-left: 2%;
}
.container .columnaDer .subTitulo {
  float: left;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}
.container .columnaDer .Contenido {
  background-color: #F3F3F5;
  box-sizing: border-box;
  float: left;
  padding: 10px 10px;
  width: 100%;
}

.verWeb{ display: block; }
.verMovil{ display: none; }
.btnOrdenMovil{ display: none; }

/* :: Inicio de estilo para realizar el sitio Responsive :: */
@media screen and (max-width: 900px) {
    /*Responsive para el Login*/
    .page-container { width: 100% !important; }

    .page-container fieldset { margin: 5px 0; }

    .container .columnaDer { margin: 30px 0 0 0; }

    .columnaIzq-usuario .datosUsuario-img {
      width: 100%;
      float: left;
      text-align: center;
    }
    .columnaIzq-usuario .datosUsuario-img img {
      width: 35% !important;
      float: none !important;
    }

    .columnaIzq-usuario .datosUsuario { width: 100% !important; }

    .menu_bar {
        background-image: var(--img-menu-movil);
        background-repeat: no-repeat;
        background-color: #2c4456;
        box-sizing: border-box;
        cursor: pointer;
        /*position: relative;*/
        position: fixed;
        height: 30px;
        /**/
        width: 100%;
        z-index: 80;
    }
    .columnaIzq {
      /*columnaIzq ocultar*/
      left: -40%;
      transition: all 0.3s;
      position: absolute;
    }
    .mostrar {
      /*CLASE AGREGADA EN LA ETIQUETA [.columnaIzq] PARA MOSTRAR MENU EN RESPONSIVE */
      left: 0;
      width: 40% !important;
      transition: all 0.1s;
      margin: 30px 0 0 0;
      position: fixed;
    }
    /*NUEVO CAMBIO PARA EL FOOTER*/
    .columnaIzq-footer { width: 40% !important; }

    .columnaDer { width: 100% !important; }

    /*DISEÑO RESPONSIVE PARA LA VISTA PRESTACIONES*/
    .contenidoIzquierda { width: 100%; }

    .contenidoIzquierda .datosPaciente table {
      width: 100%;
      box-sizing: border-box;
    }

    .contenidoIzquierda .datosPaciente table .ocultarDatosPaciente { display: none; }

    .contenidoIzquierda .datosPaciente table .itemPacienteMovil {
        background-color: #1ab395;
        border: 1px solid #000;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
        color: #FFF;
        padding: 2px 5px;
        width: 30%;
    }
    .contenidoIzquierda .datosPaciente table .datosPacienteMovil {
      border: 1px solid #000;
      border-top-right-radius: 5px;
      border-bottom-right-radius: 5px;
      padding: 0px 3px;
      width: 70%;
    }

    .contenidoIzquierda .moduloMuestras { display: none; }
    .contenidoIzquierda .moduloEntrega { display: none; }
    .contenidoDerecha { width: 100%; }

    .verWeb{ display: none; }
    .verMovil{ display: block; }
    .btnOrdenMovil{ display: block; }

}