
/* =============================================================
   GENERAL STYLES
 ============================================================ */

@import url(https://fonts.googleapis.com/css?family=Lato); /* FREE GOOGLE FONT */



/*** cupon de pago **/
body {
  font-family: 'Lato', 'Arial', sans-serif;
	font-weight: 400;
	overflow-x: hidden;
	background-color: #fff;
	height: 100%;
}


h1{
  font-size: 60px;
	line-height: 60px;
	font-weight: 900;
	color: #4eaac8;
}

h1,h2,h3,h4{
  font-weight: 900;
	color: #000;
}
h5,h6{
  font-weight: 900;
	color: #666;
}


.content-wrapper { padding-top:40px;
    min-height: 600px;
    padding-bottom: 60px;
	background-color:#FFF;
}

.page-head-line {
    font-weight: 900;
    border-bottom: 2px solid #3d3272;
    text-transform: uppercase;
    color: #3d3272;
    font-size: 20px;
    margin-bottom: 40px;
}


.progress {
    height: 8px;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}
.login-icon {
    height: 60px;
    width: 60px;
    padding: 13px;
    border-radius: 50%;
    font-size: 30px;
    margin-bottom: 20px;
    color: #fff;
    text-align: center;
    cursor:pointer;
    background-color:#f9b041;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
}
/* =============================================================
   HEADER SECTION STYLES
 ============================================================ */
header {
    background-color:#fbfbfb;
    color:#766e9b;
    text-align: right;
}


/* =============================================================
   LOGO SECTION STYLES
 ============================================================ */
.left-div {
  padding-top:10px;
    padding-left: 30px;
    display: inline-block;

    margin-bottom: 30px;
    color: #000;
    float: right;

}
.left-div h1 {
  font-size: 36px;
  	line-height: 40px;
  	font-weight: 900;
  	color: #FFF;
    text-transform: uppercase;
  text-align:right;
}

.navbar-brand {

display: inline-block;
height: auto;
padding-top: 30px;
padding-bottom: 30px;
}

/* USER SETTINGS DIV */
.user-settings-wrapper .nav > li > a {
    position: relative;
    display: block;
    padding: 15px 18px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    height: 60px;
    width: 60px;
    background-color: #f9b041;
    color: #fff;
}

.user-settings-wrapper {
    margin-top: 10px;
}

    .user-settings-wrapper li {
        display: inline-block;
    }

    .user-settings-wrapper .dropdown-settings {
        width: 200px;
        padding: 10px;
    }

    .user-settings-wrapper .nav > li > a:hover,.user-settings-wrapper .nav > li > a:focus {
        text-decoration: none;
        background-color: #f9b041!important;
    }

    .user-settings-wrapper img {
        height: 64px;
        width: 64px;
        border: 1px solid #000000;
    }

    .user-settings-wrapper .dropdown-menu {
        margin: 0px;
        border-radius: 0px!important;
        -moz-border-radius: 0px!important;
        -webkit-border-radius: 0px!important;
    }


    .user-settings-wrapper .media-heading {
        padding-top: 10px;
    }

/* MENU LINKS SECTION*/

.menu-section {
    background-color: #ffffff;

    border-bottom: 1px solid #c4ced4
}

#menu-top a {

    font-size: 16px;
    	line-height: 18px;
    	color: #42474c;

}

.menu-top-active {
    background-color: #82c2d7;
}

.menu-section .nav > li > a:hover,.menu-section .nav > li > a:focus {
    background-color: #82c2d7!important;
}

.menu-section .dropdown-menu > li > a:hover,.menu-section .dropdown-menu > li > a:focus {
    background-color: #82c2d7!important;
}


.navbar-toggle {
    background-color: #f9b041;
    border: 1px solid #fff;
}

.navbar {
    margin-bottom: 0px;
    border-bottom: 1px solid #c4ced4;
    background-color: #13305A;
}
/* =============================================================
   FOOTER SECTION STYLES
 ============================================================ */
footer {
  background-color: #f0f3f4;
  font-size: 14px;
	line-height: 14px;
	font-weight: 300;
	color: #42474c;
	padding: 23px 0;
	margin: 0;
}

footer a, footer a:hover {
    color: #fff;
    text-decoration: none;
}

/*==============================================
    DASHBOARD  STYLES
 =============================================*/

/* DASHBOARD ICONS */

.avatardos{
  vertical-align: middle;
  width: 100px;
  height: 100px;
  border-radius: 50px;
}

.avatarPaciente{
  vertical-align: middle;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.avatartres{
  width: 100px;
  margin: 40px auto;
  padding-left: 25px;
}

.border-terap{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 25px;
}

.margin-terap{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.dashboard-div-icon {
    height: 75px;
    width: 75px;
    border: 2px solid #fff;
    padding: 20px;
    border-radius: 50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    font-size: 30px;
    margin-bottom: 20px;
    color: #fff;
}

.dashboard-div-wrapper {
    border-radius: 5px;
    text-align: center;
    padding: 15px;
    color: #fff;
    margin-bottom: 50px;
}

    .dashboard-div-wrapper .progress {
        height: 2px;
    }

/* NOTICE BOARD */


.notice-board .panel {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
}

.notice-board ul {
    padding-left: 0px;
    list-style: none;
}

.notice-board li {
    padding: 10px;
    border-bottom: 1px solid #E5E5E5;
}

    .notice-board li span {
        margin-right: 10px;
        border: 1px solid #DBDBDB;
        padding: 5px;
    }

    .notice-board li a, li a:hover {
        text-decoration: none;
        color: #000;
    }


/* mios */

.btn-contrasena{
  padding: 1px 6px 2px 6px;
  color: #FFF;
  background-color: #ccc;
  font-size: 9px;
  border-radius: 5px;
  margin-left: 5px;
  text-transform: uppercase;
}

.btn-border{
  border: 1px solid #8ac7db;
  margin-right: 4px;
  color: #4eaac8;

}

.input-error{
  border: 3px dashed red;
}

.destacar{ background-color:#f9b041; color:#FFFFFF}

.ancho-columna-desc{
    width: 30%;
}

.ancho-columna-name{
    width: 25%;
}

.ancho-columna-turno{
  width: 14%;
}

.cartel-no-atencion{
  padding-top: 7px;
  padding-left: 10px;
  padding-bottom: 7px;
  color: white;
  background-color: #4eaac8;
  border-radius: 2px;
}

/* REGISTRO TERAPEUTA */

.border-docum {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  padding: 5px;
}

.no-foto{
  padding-left: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.input-file{
  padding-top: 5px;
  padding-bottom: 5px;
}

.input-file-foto{
  padding-top: 25px;
}

.margin-label{
  margin-top: 15px;
}

.padding-img{
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
}

.padding-file{
  padding: 5px;
}

/* turnos */
.horario-turno-libre{
  border: 1px solid #4eaac8;
  border-radius: 3px;
  padding-top: 7px;
  padding-bottom: 7px;
  color: #4eaac8;
}

.horario-turno-libre:hover{
  background-image: linear-gradient(to bottom,#5bc0de 0,#2aabd2 100%);
  color: white;
}

.horario-turno-ocupado{
  border: 1px solid #d1e0e0;
  border-radius: 3px;
  padding-top: 7px;
  padding-bottom: 7px;
  color: #d1e0e0;
}

.boton{
  background-color: #4eaac8;
  color: white;
}

/*  VIDEOLLAMADA  */
.chat-evolucion{
  border: 1px solid #d1e0e0;
  height: 200px;
  margin-bottom: 15px;
  overflow-y: scroll;
  padding: 10px;
}

.header-chat-title{
  border: 1px solid #d1e0e0;
  padding-top: 3px;
  padding-bottom: 3px;
}

.margin-boton-edit{
  margin-bottom: 25px;
}

.valoracion{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-left: 5px;
  padding-top: 8px;
}

p.nota-chat{
  border: 1px solid #d1e0e0;
  border-radius: 5px;
  padding: 5px;
  text-align: center;
  ;
}

.nota-privada{
  background-color: #cce5ff;
}

.nota-publica{
  background-color: #e2e3e5;
}

.nota-diagnostico{
  background-color: #d4edda;
}

p.nota-chat:hover {
  background-color: #669999;
}

p.nota-chat span.iconoEliminar{
  display: none;
  font-size: 17px;
  margin-left: 10px
}

p.nota-chat:hover span.iconoEliminar{
  display: inline-block;
}

p.nota-chat:hover span.iconoEliminar:hover{
  cursor: pointer;
}

.ocultar{
  display: none;
}

.margin-reclamo{
  margin-top: 15px;
  margin-left: 3px;
}

.starsv {
  cursor: pointer;
  display: flex;
}
.starsv:hover .starv polygon {
  fill: #ffd055 !important;
}
.starsv .starv polygon {
  fill: #d8d8d8;
}
.starsv .starv:hover ~ .starv polygon {
  fill: #d8d8d8 !important;
}
.starsv[data-stars] .starv polygon {
  fill: #ffd055;
}
.starsv[data-stars="1"] .starv:nth-child(1) ~ .starv polygon {
  fill: #d8d8d8;
}
.starsv[data-stars="2"] .starv:nth-child(2) ~ .starv polygon {
  fill: #d8d8d8;
}
.starsv[data-stars="3"] .starv:nth-child(3) ~ .starv polygon {
  fill: #d8d8d8;
}
.starsv[data-stars="4"] .starv:nth-child(4) ~ .starv polygon {
  fill: #d8d8d8;
}
.starsv[data-stars="5"] .starv:nth-child(5) ~ .starv polygon {
  fill: #d8d8d8;
}

/* HOME PSICOLOGO */

.oculto{
  visibility: hidden;
}

.noMostrar{
  display: none;
}

.turno .activo {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
  background-color: #dff0d8;
}

.turno .activo .hora {
  padding-top: 36px;
}

.turno .activo .hora h4 {
  font-size: 24px;
}

.turno .activo .avatar {
  padding-top: 15px;
  padding-bottom: 15px;
}

.turno .activo .nombre {
  text-align: center;
  padding-top: 36px;
}
.turno .activo .nombre h4 {
  font-size: 24px;
}

.turno .activo .timer {
  padding-top: 22px;
}

.turno .activo .entrar {
  margin-top: 42px;
}

.turno .activo .perfil {
  margin-top: 44px;
}

.turno .activo .perfil a {
  border: 1px solid #2bacd4;
  border-radius: 4px;
  background-color: #43b5d8;
  color: white;
}

.turno .pasado {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.turno .pasado .hora {
  padding-top: 0px;
}

.turno .pasado .avatar img {
  display: none;
}

.turno .pasado .nombre {
  text-align: center;
}

.turno .pasado .timer h2 {
  display: none;
}

.turno .pasado .entrar a {
  display: none;
}

.turno .pasado .perfil {
  margin-top: 5px;
}

.turno .pasadoSuperv {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
  background-color: #1482b5;
}

.turno .pasadoSuperv .hora {
  padding-top: 0px;
}

.turno .pasadoSuperv .hora h4 {
  color: white !important;
}

.turno .pasadoSuperv .avatar img {
  display: none;
}

.turno .pasadoSuperv .nombre {
  text-align: center;
}

.turno .pasadoSuperv .nombre h4{
  color: white !important;
}

.turno .pasadoSuperv .timer h2 {
  display: none;
}

.turno .pasadoSuperv .entrar a {
  display: none;
}

.turno .pasadoSuperv .perfil {
  margin-top: 5px;
}

.turno .pasadoSuperv .perfil a {
  color: white !important;
}

.turno .proximoA {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.turno .proximoA .hora {
  padding-top: 28px;
}

.turno .proximoA .avatar {
  padding-top: 10px;
  padding-bottom: 10px;
}

.turno .proximoA .nombre {
  text-align: center;
  padding-top: 28px;
}

.turno .proximoA .timer {
  visibility: hidden;
}

.turno .proximoA .entrar {
  visibility: hidden;
}

.turno .proximoA .perfil {
  margin-top: 29px;
}

.turno .proximoA .perfil a {
  border: 1px solid #2bacd4;
  border-radius: 4px;
  background-color: #43b5d8;
  color: white;
}

.turno .proximoSuperv {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
  background-color: #1482b5;
}

.turno .proximoSuperv .hora {
  padding-top: 28px;
}

.turno .proximoSuperv .hora h4 {
  color: white;
}

.turno .proximoSuperv .nombre {
  text-align: center;
  padding-top: 28px;
}

.turno .proximoSuperv .nombre h4{
  color: white;
}

.turno .proximoSuperv .timer {
  visibility: hidden;
}

.turno .proximoSuperv .entrar {
  visibility: hidden;
}

.turno .proximoSuperv .perfil {
  margin-top: 29px;
}

.turno .proximoSuperv .perfil a {
  border: 1px solid white;
  border-radius: 4px;
  color: white;
}

/* PERFIL PSICOLOGO */
.panel-seleccion{
  padding-top: 18px;
  padding-bottom: 18px;
  padding-right: 2px;
  margin-bottom: 30px;
  background-color: #f5f5f5;
}

.panel-seleccion .seleccion{
  margin-top: 10px;
  font-size: 17px;
}

.panel-seleccion .seleccion label{
  padding-left: 7px;
  color: #3d3272;
}

.bg-datos{
  background-color: #f5f5f5;
}

.cv-div-comp{
  padding: 7px;
  border-radius: 4px;
}

.cv-div{
  padding: 7px;
  border-radius: 4px;
}

.btn-cv{
  margin-left: 15px;
  margin-top: 5px;
}

/* PAGOS PSICOLOGO */
.panel-pagosterap{
  padding-top: 8px;
  padding-bottom: 8px;
  padding-right: 2px;
  margin-bottom: 10px;
}

.panel-pagosterap .desc{
  padding-left: 12px;
}

.panel-pagosterap a{
  background-color: #4eaac8;
  color: white;
}

.panel-pagosterap .editar{
  padding-right: 30px;
  padding-top: 3px;
}

.panel-dineroDisp .dinero{
  color:white;
  font-size: 2.2em;
}

.panel-dineroDisp .descripcion{
  color: #e1eaea;
  margin-bottom: 3px;
}

button.mercadopago-button {
  background-color: #fff;
  color: #265A88;
  border: 1px solid #265A88;
  border-radius: 5px;
}

.panel-cargarSaldo{
  background-color: #4eaac8;
  padding-top: 28px;
  padding-bottom: 12px;
  padding-left: 40px;
  padding-right: 40px;
  border-radius: 4px;
}

.panel-retirarDinero{
  background-color: #4eaac8;
  padding-top: 28px;
  padding-bottom: 12px;
  padding-left: 40px;
  padding-right: 40px;
  border-radius: 4px;
  margin-right: 15px;
}

/* HOME PACIENTE */

.turnos-pasados {
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.turnos-pasados .reclamar{
  margin-top: 5px;
  margin-right: 5px;
}

.linkSala{
  margin-top: 5px;
}

.tiempo{
  padding-top: 0px;
}
/*esto es para la home del paciente. Similar a la home de psicologo*/
.turno .turnoActivo{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
  background-color: #dff0d8;
}

.turno .turnoActivo .hora {
  padding-top: 33px;
  padding-bottom: 33px;
  font-size: 22px;
}

.turno .turnoActivo .fecha {
  padding-top: 33px;
  padding-bottom: 33px;
  padding-left: 25px;
  font-size: 22px;
}

.turno .turnoActivo .nombre{
  padding-top: 33px;
  padding-bottom: 33px;
  font-size: 22px;
}

.turno .turnoActivo .tarifa{
  padding-top: 33px;
  padding-bottom: 33px;
  font-size: 22px;
}

.turno .turnoActivo .tiempo{
  padding-top: 20px;
  padding-right: 45px;
}

.turno .turnoActivo .botones{
  padding-top: 33px;
  padding-bottom: 33px;
}

.turno .turnoProximo{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.turno .turnoProximo .hora {
  padding-top: 15px;
  padding-bottom: 15px;
}

.turno .turnoProximo .fecha {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 25px;
}

.turno .turnoProximo .nombre{
  padding-top: 15px;
  padding-bottom: 15px;
}

.turno .turnoProximo .tarifa{
  padding-top: 15px;
  padding-bottom: 15px;
}

.turno .turnoProximo .botones{
  padding-top: 15px;
  padding-bottom: 15px;
}

.turno .turnoProximo .botones .cancelar{
  margin-top: 5px;
}

.turno .turnoProximo .botones .valorar{
  margin-top: 5px;
}

.turno .turnoFinalizado{
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 10px;
}

.turno .turnoFinalizado .hora {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}

.turno .turnoFinalizado .fecha {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 25px;
  font-size: 14px;
}

.turno .turnoFinalizado .nombre{
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}

.turno .turnoFinalizado .tarifa{
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}

.turno .turnoFinalizado .botones{
  padding-top: 5px;
  padding-bottom: 5px;
}

.turno .turnoFinalizado .botones .cancelar{
  margin-top: 5px;
}

.turno .turnoFinalizado .botones .valorar{
  margin-top: 5px;
}


/* STAR RATING */
.padding-stars-listado{
  padding-left: 70px;
}

.padding-stars-perfil{
  padding-left: 50px;
}

.padding-stars-number{
  padding-left: 65px;
}

.star-numeric-score{
  padding-right: 8px;
  font-size: 19px;
  color: grey;
}

.stars {
  display: flex;
}
.stars .star polygon {
  fill: #d8d8d8;
}
.stars[data-stars] .star polygon {
  fill: #ffd055;
}
.stars[data-stars="1"] .star:nth-child(1) ~ .star polygon {
  fill: #d8d8d8;
}
.stars[data-stars="2"] .star:nth-child(2) ~ .star polygon {
  fill: #d8d8d8;
}
.stars[data-stars="3"] .star:nth-child(3) ~ .star polygon {
  fill: #d8d8d8;
}
.stars[data-stars="4"] .star:nth-child(4) ~ .star polygon {
  fill: #d8d8d8;
}
.stars[data-stars="5"] .star:nth-child(5) ~ .star polygon {
  fill: #d8d8d8;
}

.text-ranking{
  color: #75a3a3;
  font-size: 18px;
}

/* BUSCADOR PSICOLOGOS */
.tipoTerapia{
  border: 1px solid #2bacd4;
  border-radius: 4px;
  background-color: #43b5d8;
  color: white;
  padding: 4px;
  margin-right: 4px;
}

.avatar-perfil-card{
  vertical-align: middle;
  width: 150px;
  height: 150px;
  border-radius: 50%;
}

.width-17{
  width: 17%;
}

.width-16{
  width: 16%;
}

.width-15{
  width: 15%;
}

.width-14{
  width: 14%;
}

.width-12{
  width: 12%;
}

.width-10{
  width: 10%;
}

.width-9{
  width: 9%;
}

.width-8{
  width: 8%;
}

.width-6{
  width: 6%;
}

.nota-desc{
  border-top: 1px solid #94b8b8;
}
p.nota{
  margin-bottom: 10px;
  font-size: 14px;
  padding: 10px;
}
p.nota:hover{
  background-color: #EFEFEF;
}
p.nota span.icono{
  display: none;
  font-size: 10px;
  margin-left: 10px
}
p.nota span.fecha{
  font-size: 12px;
  color: #CCC;
}
p.nota:hover span.icono{
  display: inline-block;
}

p.nota:hover span.icono:hover{
  cursor: pointer;
}

/* PERFIL PACIENTE */
.panel-nota{
  background-color: #fbfbfb;
  border: 1px solid #c4ced4;
  border-radius: 10px;
  margin-bottom: 25px;
  padding-left: 3px;
  padding-top: 7px;
}

.panel-nota .nota-desc{
  font-size: 12px;
  color: #669999;
}

.container-diag{
  background-color: #fbfbfb;
}

/* PERFIL PSICOLOGO */
.avatar-perfil{
  vertical-align: middle;
  width: 200px;
  height: 200px;
  border-radius: 50%;
}

.turnos-disponibles{
  margin-top: 27px;
}

.hora-turnos{
  text-align: center;
  border: 1px solid #4eaac8;
  padding-top: 8px;
  padding-bottom: 7px;
  margin-bottom: 5px;
  color: #4eaac8;
}

.hora-turnos-disponibles{
  padding-top: 8px;
  padding-bottom: 7px;
  padding-left: 15px;
  color: #4eaac8;
}

.boton-agendar{
  border: 1px solid #4eaac8;
  border-radius: 3px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-right: 3px;
  margin-bottom: 3px;
  color: #4eaac8;
}

.especialidades{
  background-color: #82c2d7;
  margin-right: 5px;
  margin-bottom: 5px;
  padding: 15px;
  display: inline-block;
}

.progreso-texto{
  font-family: Proxima Nova,-apple-system,Helvetica Neue,Helvetica,Roboto,Arial,sans-serif !important;
  font-size: 15px;
  color: #a3c2c2;

}

/* LISTADO PSICOLOGOS */
.selectwidthauto{
     width:auto !important;
}

/* VISTA SEMANAL */
.turno-disable{
  background-image: linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);
}

.turno-enable{
  background-color: #ffff99;
}

.turno-enable-superv{
  background-color: #1482b5;
}

.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.42;
  border-radius: 15px;
  border-color: #337ab7;
}

.outline-warning{
  border: 1px solid #f0ad4e;
  border-radius: 3px;
  color: #f0ad4e;
}

/* ADMIN */
.bg-suspendido{
  background-color: #ff6666;
}

.logo-login{
  margin-left: 20%;
}

.action{
  width: 120px;
}
.action a i{
  font-size: 18px;
}

/* MEDIA QUERIES */

@media(max-width:414px){
  .centrado {
    text-align: center;
  }

}
