body{
font-family: 'Pangram', sans-serif;
padding-right:0px !important;
}
.body-none{
overflow: hidden !important;
}

.st-barra::-webkit-scrollbar {
    width: 9px;
}
.st-barra::-webkit-scrollbar-thumb {
    background-color: #8c8c8c;
    border-radius: 8px;
}
.st-barra::-webkit-scrollbar-track {
    background: #1f1e37;
}



.st-barra2::-webkit-scrollbar {
    width: 9px;
}
.st-barra2::-webkit-scrollbar-thumb {
    background-color: #8c8c8c;
    border-radius: 0px;
}
.st-barra2::-webkit-scrollbar-track {
    background: transparent;
}



.w-100{
width: 100%;
}

.l-space-3{
letter-spacing: 3px;
}

.l-space-4{
letter-spacing: 4px;
}


.l-space-5{
letter-spacing: 5px;
}



.l-space-6{
letter-spacing: 6px;
}


.l-space-7{
letter-spacing: 7px;
}



p::selection {
background: #3f51b5;
color: white;
}

/* Firefox */
p::-moz-selection {
background: #3f51b5;
color: white;
}


.nav{
background:linear-gradient(45deg, #413886, #1e3096);
}
.nav .navbar{ 
padding-top: 1rem;
padding-bottom: 1rem;
}


.nav .navbar-brand{
font-size: 16px;
}

.nav .navbar-toggler{
border-color: transparent;
}  

.nav a, .nav .navbar-dark .navbar-nav .nav-link:hover{
transition: all .5s ease 0s;
background: transparent;
color: white;
letter-spacing: 3px;
text-transform: uppercase;
font-size: 18px;
}  
.img-formar{
transition: all .5s ease 0s;
width: 100%;
}



.dropdown-menu a{
color: black;
}

.v::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0,0,0,0.6);
}
.style-bienvenido{
background: url(https://consultorsalud.com/wp-content/uploads/2019/05/shutterstock_794759668.jpg);
background-size: cover;
}
.style-bienvenido .s2{
position: relative;
color: white;
}

.carta{
    background: white;
    color: black;
    border-radius: 29px;
    padding: 2rem;
    /* box-shadow: 0px 0px 16px 1px #a4a3ff; */
    text-align: center;
    border: 1px solid gray;
    position: relative;
    height: 100%;
}
.titulo-style-1{ 
    background: linear-gradient( 81.84deg, #0099ff 36.6%, #00ffea 51.57%, #d2d2d2);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    display: inline-block;
    letter-spacing: 4px;
    text-decoration: none;
    text-transform: uppercase;
}

.btn-bien{
    background: #38daff3d;
    padding: 14px;
    padding-left: 3rem;
    padding-right: 3rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: white;
    border:2px solid #8c8c8c;
}

.btn-bien:hover,.btn-bien:focus{
color: white;
}

.carta-usuarios {
    background: transparent;
    padding: 2rem;
    border-radius: 31px;
    border: 1px solid;
}


.carta-usuarios h4{
padding-top: 1rem;
margin-bottom: 0px;
font-size: 18px;
}



.carta-usuarios img{
width: 70px;
border-radius: 14rem;
}


footer{
padding-top: 70px;
background:#2d3a69;
background-size: cover;
color: white;
position: relative;
font-size: 14px;
line-height: 28px;
}

footer h4{
font-size: 21px;
}


footer ul{
list-style: none;
padding-left: 0px;
}

footer ul a, footer h5{
transition: all .5s ease 0s;
text-transform: uppercase;
list-style: none;
padding-left: 0px;
color: white;
letter-spacing: 2px;
}


footer ul a:hover, footer h5:hover{
transition: all .5s ease 0s;
color: gray;
text-decoration: none;
}


.style-sociales a .f1{
color: #00ff7e;
font-size: 40px;
}
.style-sociales a .f2{
color: #ffffff;
position: relative;
font-size: 59px;
top: -7px;
}

.style-sociales a .f3{
color: #ff2121;
font-size: 50px !important;
}

.hr-1{
background:#656565;
}
.hr-2{
background: #00ffd0;
}


.abrir-img{
cursor: pointer;
}

.titulo-responsivo{
transition: all .5s ease 0s;
}

 .titulo-sm{
font-size:18px;
}





.linea{
    display: block;
    margin-bottom: 5px;
    margin-left: 3%;
    margin-top: -3px;
    overflow: hidden;
    text-align: center;
    white-space: nowrap;
    width: 94%;
}



.linea>span {
    display: inline-block;
    position: relative;
}

.linea>span:before {
    margin-right: 15px;
    right: 100%;
}
.linea>span:after {
    left: 100%;
    margin-left: 15px;
}

.linea>span:before, .linea>span:after {
    background: #ccd0d5;
    content: "";
    height: 1px;
    position: absolute;
    top: 50%;
    width: 9999px;
}


.l-blanco-linear{
    font-size: 28px;
    color: white;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    padding-bottom: 15px;
    word-break: break-word;
}


.l-blanco-linear::before {
    content: '';
    position: absolute;
    display: block;
    width: 120px;
    height: 2px;
    background:linear-gradient(8deg, #525252, #00ffc4);
    bottom: 1px;
    border-radius: 3rem;
}





.l-negro-linear{
    font-size: 28px;
    color: black;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    padding-bottom: 15px;
    word-break: break-word;
}


.l-negro-linear::before {
    content: '';
    position: absolute;
    display: block;
    width: 120px;
    height: 2px;
    background:linear-gradient(8deg, #525252, #00ffc4);
    bottom: 1px;
    border-radius: 3rem;
}

.b-azul-cielo::before{
    background: #4dfdd4!important;
}


.b-azul-cielo-s::before{
    background:linear-gradient(45deg,transparent,#00f3ff) !important;
}


.b-morado::before{
background:#b641ff !important;
}


.b-morado-s::before{
background:linear-gradient(45deg,transparent,#b214f3);
}


.c-verde{
color: #00ad35;
}

.c-rojo{
color: red;
}
.cargando{
    position: fixed;
    background: white;
    height: 100%;
    width: 100%;
    z-index: 9;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
}

.cargando img{
width: 19rem;
height: 15rem;
display: block;
}

.cargando .e1{
position: relative;
}

.cargando .e2{
    position: absolute;
    text-align: center;
    top: 154px;
    left: 45px;
}
.caja-opcion{
cursor: pointer;
transition: all .5s ease 0s;
color: white;
background:#253558;
/* display: inline-block; */
box-shadow: 0px 0px 13px 3px #a2a2a2;
padding: 2rem;
border-radius: 19px;
position: relative;
height: 100%;
display: flex;
align-items: center;
}




.caja-opciones .caja-opcion:hover{
background: linear-gradient(45deg, #845bff, #00e7ff);
}

.caja-b-eps, .caja-b-pacientes{
overflow: auto;
max-height: 25rem;
}





.caja-b-pacientes2{  
background: darkcyan;
color: white;
padding: 12px;
border-bottom: 5px solid #2f2f2f;
cursor: pointer;
line-height: normal;
}

.caja-b-pacientes2 .f1,  .caja-b-pacientes2 .f2,  .caja-b-pacientes2 .f3{
display: block;
}


.caja-b-pacientes2 .f2,  .caja-b-pacientes2 .f3{
font-size: 13px;

}


.body-lnone{
line-height: normal !important;
}
.header-busqueda{
padding: 11px 19px;
background: #4e4e4e;
color: white;
}

.cerrar-header-b, #cerrar-header-b{
cursor: pointer;
}


.table .thead-blue th {

    color: #fff;
    background-color: #0080ff;
    border-color: #454d55;
    font-weight: 100;
    font-size: 14px;
    padding: 7px;
    border-bottom: 1px solid gainsboro;


}


.table td, .table th {
    font-weight: 100;
    font-size: 14px;
    padding: 7px;
    border-bottom: 1px solid gainsboro;

}


.icon-accion .c1,.icon-accion .c2,.icon-accion .c3{ 
cursor: pointer;
}
 
.icon-accion .c1{ 
color:#cc0404;
}

.icon-accion .c2{ 
color: #317ab9;
}
.icon-accion .c3{ 
color: gray;
}
 .titulo-respon-1{
transition: all .5s ease 0s;
font-size: 23px;
}

.genhash{
position: absolute;
right: 13px;
top: 17px;
cursor: pointer;
color: blueviolet;
}

#style-btn-factura .b1{
background:#3f51b5;
box-shadow: none;
}


#style-btn-factura .b2{
border: 1px solid;
}


#style-btn-factura .b3{
background: black;
color: white;
padding: 10px 13px;
border-radius: 4rem;
cursor: pointer;
}

#style-btn-factura .b4{
background:#009688;
color: white;
padding: 10px 12px;
border-radius: 4rem;
cursor: pointer;
}


.tabla-servicios{
overflow: auto;
max-height: 26rem;
width: 100%;
}



.style-sesion{
background:white;
overflow: auto;
height: 100%;
display: flex;
align-items: center;
box-shadow: 0px 0px 17px 10px #5a5a5a;
color: black;

}
.breadcrumb-item a{
text-decoration: none;
}
.activo-usuario{
 border-bottom: 3px solid #00b948;
}
.nactivo-usuario{
 border-bottom: 3px solid #ff5959;
}

.activo-adm{
background: darkslateblue;
color: white;
}

.activo-estudiante{
background: #036fcc;
color: white;
}


.activo-docente{
background:#009688;
color: white;
}

.activo-usuario2{
background: gainsboro;
color: black;
}


.activo-coordinador{
background:#3d558b;
color: white;
}


.activo-desarrollador{
background: darkslateblue;
color: white;
}








.media .img, .media .img2{
transition: all .5s ease 0s;
width: 3rem;
border-radius: 0rem;
}
 .media .img{ 
border-bottom: 5px solid #5226ff;
}

.media .img2{
border-bottom:5px solid #929292;
}
.media p,.media2 p,.media label, .media2 label{
word-break: break-all;
}



.media2{
padding: 1rem;
cursor: pointer;
transition: all .5s ease 0s;
border-bottom:5px solid #505050;

}
.media2:hover{
background:#383838;
color: white;

}

.media2:hover label{
color:#00bfb6!important;
text-decoration: none;
}

.style-key{
    border:6px dashed #909090;
    position: relative;
    height: auto;
    text-align: center;
    display: flex;
    align-items: center;
}
.style-key .s1{
text-align: center;
width: 100%;
}
.style-key .flogin{
    width: 9rem;
    border-radius: 10rem;
    border: 8px dashed gray;
    border-style: dotted;
}



.cancelar-key{
    background: red;
    color: white;
    padding: 2px 6px;
    border-radius: 1rem;
    font-size: 13px;
    cursor: pointer;
}
p{
word-break: break-all;
}

.style-copiar{
color:#00bcd4;
font-size: 18px;
cursor: pointer;
}

.style-copiar:hover{
transition: all .5s ease 0s;
color: cornflowerblue;
}

.list-group-item{ 
line-height: 23px;
}

.list-group-item.active{
background: darkcyan;
}

.style-caja-manual{
text-decoration: none !important;
color: initial;
}


.cardx strong{
color: #673ab7;
letter-spacing: 3px;
}


.cardx small{
color: gray;
}


.cardx:hover{
transition: all .3s ease 0s;
background:linear-gradient(45deg, #31908f, #1c4ab1);
color: #e6e6e6;
}




.cardx:hover strong{
color: #b2f9c1;
}


.cardx:hover small{
color: #d8d8d8;
}






.caja-eps{
    display: block;
    position: absolute;
    width: 100%;
    z-index: 1;
    top: 57px;
    background: #f5f5f5;
    border-bottom: 5px solid #3f51b5;
}


.ul-eps{
    padding: 13px;
    display: flex;
    flex-direction: column;
    background: #f5f5f5;
    border-radius: 1px 1px 10px 10px;
    padding-bottom: 1rem;
    overflow: auto;
    max-height: 9rem;
}




.ul-eps li{
    padding: 7px;
    border-bottom: 1px solid #d4d4d4;
    word-break: break-all;
    background: #f5f5f5;
    list-style: none;
    font-size: 15px;
}


.ul-eps li:hover{
    cursor: pointer;
    transition: all .5s ease 0s;
    background: #419092;
    color: white;
}




.style-fperfil{
    width: 9rem;
    border: 7px solid gray;
    border-radius: 17rem;
    border-style: dotted;
}


.style-anav{
    position: fixed;
    bottom: -300px;
    z-index: 8;
    border-top: 2px solid #3f51b5;
    background:#333333;
    color: white;
    padding: 30px;
    font-size: 17px;
    line-height: 22px;
    display: block;
    width: 100%;
}

.style-anav .cerrar-vent{
cursor: pointer;
}
.style-anav .cerrar-vent:hover{
transition: all .5s ease 0s;
color: lightseagreen;
}
.icon-desarrolladores a{
text-decoration: none;
}

.icon-desarrolladores .icon1{
color: #00ffe7;
}

.icon-desarrolladores .icon2{
color: white;
}

.icon-desarrolladores .icon3{
color: #da92ff;
}


.icon-desarrolladores .icon4{
color: #ff8585;
}


/*============= PARA TELEFONO PEQUEÑOS COMO ALCATEL PIXI ========== */

@media (min-width: 300px) {



}






/*============= PARA TELEFONO PEQUEÑOS COMO SAMSUNG GALAXY J3 ========== */


@media (min-width: 360px) {


/* PARA SM */

}


@media (min-width: 400px) {

/* PARA MD */
.style-sesion{
border-left: 9px solid #007d80;
}
}



@media (min-width: 576px) {

/* PARA MD */

}


@media (min-width: 768px) {
.ple-md-5{
padding-left: 10rem;
}
.media .img, .media .img2{
width: 5rem;
}


 .titulo-md{
font-size:30px;
}


.dropdown-menu {
    left: -80px!important;
    top: 38px;
}
.titulo-responsive{
font-size:2rem;
}
.ocultar-md{
display: none !important;
}

.mostrar-md{
display: block !important;
}


.img-formar{
width: 55%;
}



.nav a{
font-size: 16px;
} 
.titulo-respon-1{
font-size: 2rem;
}

.carta-usuarios img{
width: 100px;
}




/* PARA LG */
}


@media (min-width: 900px) {
.ocultar-lg{
display: none !important;
}

.mostrar-lg{
display: block !important;
}


}



@media (min-width: 992px) {
.ocultar-xl{
display: none !important;
}

.mostrar-xl{
display: block !important;
}

}

@media (min-width: 1200px) {



}
