/**Snippet-Super-Global*/
html {
    box-sizing: border-box;
    /*1era parte del snippet*/
    /*font-family: 'Barlow Condensed', sans-serif; */
    font-family: 'arial';
    font-size: .7rem;
    /* Reset para REMs - 62.5% de 16px = 10px*/
}

*,
*:before,
*:after {
    box-sizing: inherit;
    /*2da parte del snippet que hace que no importa cuánto padding tenga un elemento, no se sumará al ancho, sino que será parte de este*/
}


/*Globales*/
body {
    background-color: #adc4e0;
    background-image: url("../img/SoloLogoSinFondoBordeBlanco.png");
    background-position: 72vw 72vh;
    background-size: 3%;
    background-blend-mode: darken;
    padding: 0px;
    /*font-family: 'Barlow Condensed', sans-serif; */
    font-family: 'arial';
    font-weight: 500;
    /*color: white;*/
    /*display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;*/
    width: 100%;
    height: 100vh;
}

#copy {
    background-color: rgba(255, 255, 255, .5);
    color: rgba(0, 0, 0, .5);
    position: fixed;
    transform: rotate(-90deg);
    /* right: -100px;
    bottom: 100px; */
    right: -85px;
    bottom: 70px;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 10px;
    z-index: 100;
    text-decoration: none;
    border: 0;
}

#copy :link {
    color: black;
    text-decoration: none;
}

#copy :hover {
    color: black;
    text-decoration: none;
}


.mspan {
    font-weight: 900;
    display: inline-block;
    text-decoration: none;
}

.linkherra1 {
    display: inline-block;
    color: black;
    text-decoration: none;
}


/*Navbar*/
.top-navbar {
    height: 7vh;
    padding: 0;
    position: fixed;
    top: 0;
    /*background-color: #0b71b4;*/
    font-size: 2.1vh;
    width: 100%;
    margin: 0;
}


/* @media (min-width: 480px)
{
   .top-navbar
   {
       display: none;
   }
} */

.title-container {
    height: 4.5vh;
    margin: 0 auto;
    margin-top: .25vh;
    margin-bottom: .25vh;
    padding: 0;
    width: 95%;
    background-color: white;
    border: solid 3px #0A69A8;
    border-radius: 1rem;
    text-align: center;
    align-items: center;
    /*display: flex;
    justify-content: center;*/
}

main.container2 {
    height: 87.5vh;
    margin-top: .25vh;
    margin-bottom: .25vh;
    margin: 0 auto;
    width: 95%;
    background-color: white;
    border: solid 3px #0A69A8;
    border-radius: 1rem;
    text-align: center;
}

main.container2 div {
    /*border: black 1px solid;*/
}


footer.container2 {
    height: 6.5vh;
    margin: 0 auto;
    margin-top: .25vh;
    margin-bottom: .25vh;
    width: 95%;
    background-color: white;
    border: solid 3px #0A69A8;
    border-radius: 1rem;
    text-align: center;
}

footer.container2 img {
    height: 100%;
}


h1 {
    font-size: 2.4rem;
}

.form-control,
textarea {
    width: 100%;
    border-radius: 0.5rem;
}

.divisor {
    border: solid 1px white;
}


/*Utilities*/

.no-display {
    display: none !important;
}

.respon-text {
    text-align: left;
}


.fs-1-5rem {
    font-size: 1.5rem;
}

.fs-2rem {
    font-size: 2rem;
}


/*Login*/

.login-container {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
    text-align: center;
}

.logo {
    width: 47%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}


.logo img {
    width: 70%;
}


.login-form {
    width: 47%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.form-group {
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.login-form .form-group,
.login-form .form-group label {
    width: 100%;
    text-align: center;
}

.bottom-navbar {
    height: 5rem;
    position: fixed;
    bottom: 0;
    background-color: #0b71b4;
    font-size: 3rem;
    width: 100%;
}

.top-navbar ul,
.bottom-navbar ul {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    list-style-type: none;
    margin: 0;
    padding: 0;
    height: 100%;
}

.top-navbar ul a,
.bottom-navbar ul a {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-decoration: none;
    width: 25%;
    height: 100%;
    background-color: #4e4c4b;
    border: solid 3px #0A69A8;
}

@media (max-height: 600px) {
    .top-navbar ul a li span,
    .bottom-navbar ul a li span {
        display: flex;
        align-items: center;
    }
    .top-navbar ul a li span i,
    .bottom-navbar ul a li span i {
        margin-left: 1rem;
    }
}

.top-navbar ul a li span p,
.bottom-navbar ul a li span p {
    line-height: 2rem;
    margin: 0.1rem;
    padding: 0;
}

@media (max-width: 399px) {
    .modi,
    .modificacion {
        display: none;
    }
}

@media (min-width: 400px) and (max-width: 499px) {
    .mod,
    .modificacion {
        display: none;
    }
}

@media (min-width: 500px) {
    .mod,
    .modi {
        display: none;
    }
}

@media (max-width: 499px) {
    .descripcion {
        display: none;
    }
}

@media (min-width: 500px) {
    .descrip {
        display: none;
    }
}

.top-navbar ul a.active,
.bottom-navbar ul a.active {
    background-color: #0b71b4;
}

.active:hover {
    color: chartreuse;
}

.bottom-navbar ul a:hover:not(.active),
.top-navbar ul a:hover:not(.active) {
    background-color: white;
}


/*Pacientes*/


.lista-scroll-container-detcliente {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: center;
    overflow: hidden;
    overflow: -moz-scroll-vertical;
    overflow-y: scroll;
    width: 100%;
    height: 50vh;
    padding-bottom: 1px;
}

.linea{
    color:black;
    font-weight: 500;
    font-size: 1.2rem;
}

.item{
    background-color: white;
}

.linea .item:nth-child(even) {
    background-color: #a9e6f5;
}

.unitem{
    border-top: black 1px solid;
    border-right: black 1px solid;
}




.scroll {
    width: 100%;
    overflow: visible;
}

.lista-container {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
}

table.pacientes.datatable {
    margin: 0 auto;
    width: 100%;
}

.titulo {
    background-color: #2caccc;
    color: white;
    border-left: white 1px solid;
    border-top: white 1px solid;
    font-weight: 600;
    font-size: 1.25rem;
}

.valortitulo{
    font-weight: 600;
    font-size: 1.3rem;
}

.busca {
    width: 100%;
    display: block;
}

#myInput {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    font-size: 2rem;
}

/*Paciente e Intervenciones*/
.profile-datatable-container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
}

#botonera{
    /*border: solid 1px black;*/
    text-align: center;
    height: 5vh;

}

.data-container {
    text-align: left;
    width: 95%;
    /*    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;*/
    margin-bottom: 1%;
    font-size: 1.5rem;
}

.datos-perfil {
    margin-bottom: 1vh;
    display: inline-block;
}

.list-scroll-container {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 100%;
}

/** touched by Javier */

#panel{
    height: 4.5vh;
}

#panel-grande {
    height:28vh;
}

#panel-medio {
    height:14vh;
}

.datatable {
    width: 90%;
    height:2.2vh;
}

.presudatatable {
    width: 90%;
    height:5.2vh;
}

.presudatatablehead {
    width: 90%;
    height:2.2vh;
}

.lista-scroll-container {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 100%;
    height: 74.8vh;
}

.lista-scroll-container-presu {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    overflow-x: hidden;
    overflow-y: scroll;
    width: 100%;
    height: 50vh;
}

.lista-scroll-container-items-mobile {
    height: 60.5vh;
}


@media (max-width: 669px) {
    .datatable {
        height:4.8vh;
        /* display: flex;*/
        /* justify-content: space-evenly; */
    }

    .lista-scroll-container {
        height: 71vh;
    }

    .lista-scroll-container-presu {
        height: 29.5vh;
    }

    .lista-scroll-container-presu-mobile {
        height: 34.5vh;
    }

    .presudatatablehead {
        width: 90%;
        height:4.8vh;
    }

    #panel-grande {
        height: 45.5vh;
    }
}

/*** ***/
.bs-table {
    border: solid 1px black;
    flex-wrap: wrap;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    position: relative;
    overflow: hidden;
}

.t-data-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    align-items: center;
}

.t-data {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    align-items: center;
    font-size: 2rem;
    margin-bottom: 1%;
}

.t-header {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    align-items: center;
    font-size: 2rem;
}

.t-header .col.id,
.t-data .col.id {
    width: 5%;
}

.t-header .col.des,
.t-data .col.des {
    width: 85%;
}

.t-header .col.det,
.t-data .col.det {
    width: 10%;
}

/*Beta*/
.beta-container {
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.datos-beta {
    overflow: hidden;
    width: 100%;
}

.tabla-header-container {
    overflow-y: scroll;
    scrollbar-width: thin;
}

.tabla-header-beta {
    width: 100%;
    text-align: left;
}

.tabla-datos-beta {
    width: 100%;
    height: 85%;
    overflow-y: scroll;
    scrollbar-width: thin;
    text-align: left;
}

.tabla-body-beta {
    text-align: left;
}

.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.table-row {
    background-color: white;
    color: #0b71b4;
}

.table-row:nth-child(2n) {
    background-color: #a9e6f5;
}

.table-row a {
    color: #0b71b4;
}

.table-row a:hover {
    color: #ed6663;
    text-decoration: none;
}

.tabla-datos-beta .row {
    border-bottom: solid 1px #0b71b4;
}

.tabla-body-beta .table-col {
    border-right: solid 1px #0b71b4;
}

.tabla-body-beta .table-col:last-child {
    border-right: none;
}

.btn {
    font-size:1.3rem;
}

.pagination {
   justify-content: center;
   font-size: 12pt;
   padding: 5px;
}