@font-face {
font-family: 'Patinio Neue';
src: url("estilos/letra/Patinio Neue.ttf") format('truetype');
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
          box-sizing: border-box;
}
::-webkit-input-placeholder {
color: #000000;
font-size: 16px;
text-align:center;
font-family:'Patinio Neue';
}
::-moz-placeholder {
color: #000000;
font-size: 16px;
text-align:center;
font-family:'Patinio Neue';
}
:-ms-input-placeholder {
color: #000000;
font-size: 16px;
text-align:center;
font-family:'Patinio Neue';
}
/*******html*******/
html {
height: 100%;
}
/*******body*******/
body {
color:#000000;
background:transparent;
left: 0;
right: 0;
top: 0; 
bottom: 0;
margin:0;
padding:0;
width: 100%;
height: 100%;
line-height:1rem;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
padding-top:4rem;
}
/*******header*******/
#header {
width: 100%;
height: 5rem;
background:#ec6933;
left: 0; 
right: 0; 
top: 0; 
bottom: 0; 
position: fixed;
z-index:100;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
}
/*******cuerpo*******/
#cuerpo {
color:#000000;
background:#ffffff;
left: 0;
right: 0;
top: 0; 
bottom: 0;
margin:0;
padding:0;
width: 100%;
height: 100%;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
overflow-x: auto;
overflow-y: auto;
}
/*******cabeceras*******/
#cabecera{
color:#000000;
background:#ffffff;
position: fixed; 
z-index:20;
left: 0; 
right: 0; 
top: 0; 
bottom: 0; 
width: 100%;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
padding-top: 5rem;
overflow-x: auto;
overflow-y: auto;
}
#cabecerareport{
color:#000000;
background:#ffffff;
position: fixed; 
z-index:20;
left: 0; 
right: 0; 
top: 0; 
bottom: 0; 
width: 100%;
padding-top:5.5rem;
border-bottom: 3px solid #ddd;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
overflow-x: auto;
overflow-y: auto;
}
#cabecerarconsulta{
color:#000000;
background:#ffffff;
position: fixed; 
z-index:20;
left: 0; 
right: 0; 
top: 0; 
bottom: 0; 
width: 100%;
padding-top:5rem;
border-bottom: 3px solid #ddd;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
overflow-x: auto;
overflow-y: auto;
}
#cabeceraexpediente{
color:#000000;
background:#ffffff;
position: fixed; 
z-index:20;
left: 0; 
right: 0; 
top: 0; 
bottom: 0; 
width: 100%;
padding-top:4.5rem;
border-bottom: 3px solid #ddd;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
overflow-x: auto;
overflow-y: auto;
}
/*******formulaios*******/
#formulario{
color:#000000;
background:#ffffff;
overflow-x: auto;
overflow-y: auto;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
left: 0;
right: 0;
top: 0; 
bottom: 0; 
width: 100%;
height: auto;
margin-bottom: 4rem;
overflow-x: auto;
overflow-y: auto;
}
/*******copyright*******/
#copyright {
display: block ;
white-space: normal;
position: absolute;
bottom: 0;
left: 0;
right: 0;
background:#ec6933;
color:#ffffff;
text-align: center;
font-family: 'emmasophia';
font-size: 18px;
line-height:1rem;
width: 100%;
height: 3rem;
z-index:200;
}
/*******dividir pagina*******/
#dividir {
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
display: flex;
white-space: nowrap;
}
#dividir > div {
width: 50%;
}
#dividir > divright {
width: 50%;
}
#divreportes {
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
display: flex;
height:auto;
}
#divbonos {
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
display: flex;
height:auto;
}
#divgrupos {
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
display: flex;
height:auto;
}
/*******filas*******/
.row {
line-height:0.7rem;
width: 100%;
float: left;
padding-bottom:2px;
padding-top:2px;
font-family: 'Patinio Neue';
white-space: normal;
}
.rowtitulo {
line-height:0.7rem;
width: 100%;
float: left;
padding-bottom:2px;
padding-top:14px;
font-family: 'Patinio Neue';
white-space: normal;
font-size:18px;
font-weight:bold;
color:#ffffff;
background:#000000;
height:2rem;
}
.planes{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.planesgrafica{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}


.rowgraftitulo {
display: block ;
white-space: normal;
position: relative;
float: left;
width: 530px;
max-width: 530px;
height: 315px;
max-height: 315px;
margin-top:5px;
padding-left:5px;
padding-right:5px;
padding-top:5px;
padding-bottom:5px;
font-family: 'Patinio Neue';
}
.rowcambio {
overflow-x: auto;
overflow-y: auto;
line-height:1rem;
width: 100%;
float: left;
padding-bottom:2px;
padding-top:2px;
font-family: 'Patinio Neue';
white-space: nowrap;
}
.rowgrafica {
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowingresos {
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
overflow-x: auto;
overflow-y: auto;
}
.rowgraficaimg{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowgraficaimguno{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowgraficaimgdos{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowbonotabla{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowgraficabono{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: -5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowbonotablados{
position: relative;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
white-space: nowrap;
}
.rowgraficacuerpo{
width: 100%;
line-height:0.7rem;
float: left;
padding-bottom:2px;
padding-top:2px;
}
/*******columnas*******/
div.justified {
display: flex;
justify-content: center;}
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12{
position: relative;
min-height: 1px;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-top: 5px;
margin-bottom: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 12px;
}
.col-xs-12 {
  width: 100%;
}
.col-xs-11 {
  width: 91.66666667%;
}
.col-xs-10 {
  width: 83.33333333%;
}
.col-xs-9 {
  width: 75%;
}
.col-xs-8 {
  width: 66.66666667%;
}
.col-xs-7 {
  width: 58.33333333%;
}
.col-xs-6 {
  width: 50%;
}
.col-xs-5 {
  width: 41.66666667%;
}
.col-xs-4 {
  width: 33.33333333%;
}
.col-xs-3 {
  width: 25%;
}
.col-xs-2 {
  width: 16.66666667%;
}
.col-xs-1 {
  width: 8.33333333%;
}
/*******botones*******/
.boton {
position: relative;
border: none;
background: transparent;
padding: 0;
cursor: pointer;
outline-offset: 5px;
transition: filter 250ms;
}
.frontbotonmenu {
width: 7rem;
max-width: 7rem;
height: 7rem;
max-height: 7rem;
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #858585;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#ec6933;
}
.boton:hover .frontbotonmenu {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#858585;
border: 2px solid #ec6933;
}
.boton:active .frontbotonmenu {
transform: translateY(-4px);
transition: transform 34ms;
background:#858585;
color: #ffffff;
border: 2px solid #ec6933;
}
.edgebotonmenu {
position: absolute;
top: 0;
left: 0;
width: 7rem;
max-width: 7rem;
height: 7rem;
max-height: 7rem;
border-radius:5px;
background:#ec6933;
border: 2px solid #858585;
}
.boton:hover .edgebotonmenu {
background:#858585;
border: 2px solid #ec6933;
}
.boton:active .edgebotonmenu {
background:#858585;
border: 2px solid #ec6933;
}
.frontbotonmenuadmin {
width: 7rem;
max-width: 7rem;
height: 6rem;
max-height: 6rem;
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #858585;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#ec6933;
}
.boton:hover .frontbotonmenuadmin {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#858585;
border: 2px solid #ec6933;
}
.boton:active .frontbotonmenuadmin {
transform: translateY(-4px);
transition: transform 34ms;
background:#858585;
color: #ffffff;
border: 2px solid #ec6933;
}
.edgebotonmenuadmin {
position: absolute;
top: 0;
left: 0;
width: 7rem;
max-width: 7rem;
height: 6rem;
max-height: 6rem;
border-radius:5px;
background:#ec6933;
border: 2px solid #858585;
}
.boton:hover .edgebotonmenuadmin {
background:#858585;
border: 2px solid #ec6933;
}
.boton:active .edgebotonmenu {
background:#858585;
border: 2px solid #ec6933;
}
.frontbotonact {
width: 100%;
display: block;
position: relative;
border-radius: 5px;
border:2px solid #73DE08;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
color: #ffffff;
background:#73DE08;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
will-change: transform;
transform: translateY(-4px);
transition:
transform
600ms
cubic-bezier(.3, .7, .4, 1);
}
.edgebotonact {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 5px;
background:#2A5202;
border:2px solid #2A5202;
}
.frontboton {
width: 100%;
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #858585;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#ec6933;
}
.boton:hover .frontboton {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#858585;
border: 2px solid #ffffff;
}
.boton:active .frontboton {
transform: translateY(-4px);
transition: transform 34ms;
background:#858585;
color: #ffffff;
border: 2px solid #ffffff;
}
.edgeboton {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 5px;
background:#ec6933;
}
.boton:hover .edgeboton {
background:#ec6933;
}
.boton:active .edgeboton {
background:#ec6933;
}
.frontbotonrojo {
width: 100%;
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #8A0308;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#FF0008;
}
.boton:hover .frontbotonrojo {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#FF0008;
}
.boton:active .frontbotonrojo {
transform: translateY(-4px);
transition: transform 34ms;
color: #ffffff;
background: #FF0008;
}
.edgebotonrojo {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 5px;
background:#8A0308;
border: 2px solid #8A0308;
}
.boton:hover .edgebotonrojo {
background:#8A0308;
}
.boton:active .edgebotonrojo {
background:#8A0308;
}
.frontbotonpq {
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #ffffff;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#000000;
width:25px;
height:25px;
}
.boton:hover .frontbotonpq {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#3C4143;
}
.boton:active .frontbotonpq {
transform: translateY(-4px);
transition: transform 34ms;
background:#3C4143;
color: #ffffff;
}
.edgebotonpq {
position: absolute;
top: 0;
left: 0;
width:25px;
height:25px;
border-radius: 5px;
background:#000000;
transform: translateY(-2px);
}
.boton:hover .edgebotonpq {
background:#000000;
}
.boton:active .edgebotonpq {
background:#000000;
}
.frontbotonpqrojo {
display: block;
position: relative;
border-radius: 5px;
border: 2px solid #8A0308;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#FF0008;
width:25px;
height:25px;
}
.boton:hover .frontbotonpqrojo {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#FF0008;
}
.boton:active .frontbotonpqrojo {
transform: translateY(-4px);
transition: transform 34ms;
background:#3C4143;
color: #ffffff;
}
.edgebotonpqrojo {
position: absolute;
top: 0;
left: 0;
width:25px;
height:25px;
border-radius: 5px;
transform: translateY(-2px);
background:#8A0308;
border: 2px solid #8A0308;
}
.boton:hover .edgebotonpqrojo {
background:#8A0308;
}
.boton:active .edgebotonpqrojo {
background:#8A0308;
}
.frontbotonpqact {
display: block;
position: relative;
border-radius: 5px;
border:2px solid #2A5202;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-6px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#03A208;
width:25px;
height:25px;
}
.boton:hover .frontbotonpqact {
transform: translateY(-4px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#03A208;
}
.boton:active .frontbotonpqact {
transform: translateY(-4px);
transition: transform 34ms;
background:#03A208;
color: #ffffff;
}
.edgebotonpqact {
position: absolute;
top: 0;
left: 0;
width:25px;
height:25px;
border-radius: 5px;
transform: translateY(-2px);
background:#016104;
border:2px solid #2A5202;
}
.boton:hover .edgebotonpqact {
background:#016104;
}
.boton:active .edgebotonpqact {
background:#016104;
}

.frontbotonenc {
width: 100%;
display: block;
position: relative;
border-radius: 50px;
display:flex;
justify-content: center;
align-items: center;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 13px;
transform: translateY(-9px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#3C4143;
}
.boton:hover .frontbotonenc {
transform: translateY(-5px);
transition:
transform
250ms
cubic-bezier(.3, .7, .4, 1.5);
color: #ffffff;
background:#AEAEA8;
}
.boton:active .frontbotonenc {
transform: translateY(-5px);
transition: transform 34ms;
background:#AEAEA8;
color: #ffffff;
}
.edgebotonenc {
position: absolute;
top: 0;
left: 0;
border-radius: 50px;
background:#AEAEA8;
}
.boton:hover .edgebotonenc {
background:#AEAEA8;
}
.boton:active .edgebotonenc {
background:#AEAEA8;
}
/*******label*******/
label {
white-space: nowrap;
height: 1.5rem;
display: inline-block;
font-weight: bold;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-size: 12px;
}
/**** prendido/apagado****/
.switch-button {
display: inline-block;
}
.switch-button .switch-button__checkbox {
display: none;
}
.switch-button .switch-button__label {
background:#FF333F;
width: 2rem;
height: 1.3rem;
border-radius: 3rem;
display: inline-block;
position: relative;
box-shadow: inset 0px 0px 0px 2px #000000;
}
.switch-button .switch-button__label:before {
transition: .2s;
display: block;
position: absolute;
width: 17px;
height: 17px;
background:#fdffff;
content: '';
border-radius: 3rem;
margin-top:1.8px;
margin-left:2px;
box-shadow: inset 0px 0px 0px 2px #ffffff;
}
.switch-button .switch-button__checkbox:checked + .switch-button__label {
background:#73DE08;
}
.switch-button .switch-button__checkbox:checked + .switch-button__label:before {
transform: translateX(10.5px);
}
/*******tabla*******/
table {
top: 0;
border-spacing: 0;
width: 100%;
text-align: center;
}
.thead-light { 
position: sticky;
top: 0;
z-index: 4;
text-align: center;
border-bottom: 3px solid #ddd;
white-space: normal;
vertical-align: middle;
padding: 4px;
font-size: 13px;
}

.table > thead > tr > th {
padding: 4px;
vertical-align: middle;
border: 2px solid #ffffff;
text-align: center;
font-size: 13px;
white-space: normal;
background:#000000;
color:#ffffff;
}
.table > tbody > tr > th {
padding: 4px;
vertical-align: middle;
text-align: center;
font-size: 13px;
white-space: normal;
background:#3C4143;
border: 2px solid #ffffff;
color:#ffffff;
}
.table > tbody > tr > td {
white-space: normal;
font-size: 13px;
padding: 4px;
vertical-align: middle;
border-bottom: 2px solid #ddd;
text-align: center;
background:transparent;
overflow-y: auto;
overflow-x: auto;
}
.table-responsive {
white-space: normal;
overflow-y: auto;
overflow-x: auto;
text-align: center;
height:auto;
width: 100%;
}
.table-encuesta {
white-space: normal;
overflow-y: auto;
overflow-x: auto;
text-align: center;
height:auto;
width: 100%;
}

.rowgrafica thead th{
font-size:13px;
background:#ec6933;
white-space:normal;
color:#ffffff
}
.rowbonotablados thead th{
font-size:13px;
background:#ec6933;
white-space:normal;
color:#ffffff
}

.rowgraficacuerpo .thead-light th{
font-size:13px;
background:#ec6933;
white-space:normal;
color:#ffffff
}

.rowbonotabla thead th{
font-size:13px;
background:#ec6933;
white-space:normal;
color:#ffffff
}
/*******mensaje*******/
[tooltip] {
position: relative;
}
[tooltip]::before,
[tooltip]::after {
text-transform: none;
font-size: 12px;
line-height: 1rem;
user-select: none;
position: absolute;
display: none;
opacity: 0;
}
[tooltip]::before {
content: '';
border: 5px solid transparent;
}
[tooltip]::after {
content: attr(tooltip);
width:auto;
height:1.3rem;;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-align:center;
padding-top:2px;
padding-left:5px;
padding-right:5px;
border-radius: 10px;
box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
background: #ec6933;
color: #ffffff;
position: fixed;
}
[tooltip]:hover::before,
[tooltip]:hover::after {
display: block;
position: fixed;
}
[tooltip][flow^="right"]::before {
top: 50%;
border-left-width: 0;
border-right-color:#ffffff;
right: calc(0em - 5px);
transform: translate(.5em, -50%);
position: fixed;
}
[tooltip][flow^="right"]::after {
top: 50%;
left: calc(100% + 5px);
transform: translate(.5em, -50%);
position: fixed;
}
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
animation: tooltips-horz 300ms ease-out forwards;
position: fixed;
}
[tooltip][flow^="left"]::after {
top: 50%;
right: calc(100% + 10px);
transform: translate(.5em, -50%);
position: fixed;
}
[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after {
animation: tooltips-horz 300ms ease-out forwards;
position: fixed;
}

[tooltip][flow^="bottom"]::after {
top: 50%;
top: calc(100% + 20px);
transform: translate(.5em, -50%);
position: fixed;
}
[tooltip][flow^="bottom"]:hover::before,
[tooltip][flow^="bottom"]:hover::after {
animation: tooltips-horz 300ms ease-out forwards;
position: fixed;
}
@keyframes tooltips-horz {
to {
opacity: .9;
transform: translate(0, -50%);
}
}
/*******modal*******/
.modal-responsive {
position: fixed;
top: 12.5%;
left:10%;
line-height:1.5rem;
width: auto;
min-width: 15rem;
max-width:80%;
height: auto;
min-height: 10rem;
overflow-x: auto;
overflow-y: auto;
color:#ffffff;
background:#3C4143;
border-radius: 10px;
z-index:110;
}
.modal-header {
cursor: move;
user-select: none;
background: #858585;
min-height: 3rem;
height:3rem;
max-height: 3rem;
color:#ffffff;
top: 0;
z-index: 5;
position: sticky;
}
.modal-body {
padding-top:1rem;
line-height:1rem;
color:#ffffff;
background:#3C4143;
z-index: 1;
overflow-x: auto;
overflow-y: auto;
}

.modalalerta {
position: fixed;
top: 30%;
left: 25%;
right: 25%;
line-height:1rem;
z-index:90;
width: auto;
height:auto;
min-height: 10rem;
min-width: 15rem;
overflow-x: auto;
overflow-y: auto;
color:#ffffff;
background:#919293;
border-radius: 10px;
}
.modalalerta-header {
background: #919293;
min-height: 3.2rem;
height:3.2rem;
max-height: 3.2rem;
color:#ffffff;
position: sticky;
top: 0;
z-index: 2;
}
.modalalerta-body {
padding-top:1rem;
line-height:1rem;
color:#ffffff;
background:#919293;
z-index: 1;
}
/*******otros*******/
input[type=range] {
  -webkit-appearance: none;
  margin: 18px 0;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -14px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #367ebd;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2a6495;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]::-ms-thumb {
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  border: 1px solid #000000;
  height: 36px;
  width: 16px;
  border-radius: 3px;
  background: #ffffff;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #3071a9;
}
input[type=range]:focus::-ms-fill-upper {
  background: #367ebd;
}

a{
color:#000000;
cursor: pointer;
text-decoration: none
}
.greficpreg {
height:300px;
width: 600px;
overflow: hidden;
}
.greficpreg div {
margin: -75px 0px 0px 0px;
}
.seccionpreg {
background:transparent;
position: fixed;
top:9rem;
line-height:1rem;
z-index:4;
width: 100%;
height:auto;
overflow-x: auto;
overflow-y: auto;
}
.circulosder{
position: relative;
z-index:10;
width: 20px;
height: 20px;
top:6rem;
left:1rem;
background:#3C4143;
border-radius:50%;
color:#3C4143;
box-shadow: 0 6rem, 0 12rem, 0 18rem
}
.circulosizq{
position: relative;
z-index:10;
width: 20px;
height: 20px;
top:6rem;
left:95%;
background:#3C4143;
border-radius:50%;
color:#3C4143;
box-shadow: 0 6rem, 0 12rem, 0 18rem
}
.lineasizq{
position: relative;
z-index:60;
width: 80px;
height: 9px;
top:.4rem;
left:.8rem;
border-radius:5px;
background:#3C4143;
color:#3C4143;
box-shadow: 0 6rem, 0 12rem, 0 18rem}

.circulosdermov{
transform: rotate(-90deg);
position: relative;
z-index:10;
width: 20px;
height: 20px;
top:1rem;
left:3rem;
background:#3C4143;
border-radius:50%;
color:#3C4143;
box-shadow: 0 5rem, 0 10rem, 0 15rem, 0 20rem, 0 25rem, 0 30rem, 0 35rem, 0 40rem
}
.lineasder{
position: relative;
z-index:60;
width: 80px;
height: 9px;
top:.3rem;
left:.8rem;
border-radius:5px;
background:#3C4143;
color:#3C4143;
box-shadow: 0 5rem, 0 10rem, 0 15rem, 0 20rem, 0 25rem, 0 30rem, 0 35rem, 0 40rem
}
.rueda {
border: 10px solid rgba(255, 189, 89);
border-radius: 50%;
border-left-color: transparent;
width: 55px;
height: 55px;
animation: giro 1s linear infinite;
}
@keyframes giro {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
.lupaimg:after {
content: '\f00e';
position: relative;
color: #ccc;
width: 40px;
height: 40px;
bottom: 40px;
left: 5px; 
font-family: FontAwesome;
font-style: normal;
opacity: 0.9;
font-size: 2em;
cursor: pointer;
}

#canvasalumno {
border: 2px dotted #CCCCCC;
border-radius: 5px;
cursor: crosshair;
}
#canvastutor {
border: 2px dotted #CCCCCC;
border-radius: 5px;
cursor: crosshair;
}
#canvasasesor {
border: 2px dotted #CCCCCC;
border-radius: 5px;
cursor: crosshair;
}

/*******inputs*******/
textarea {
margin: 0;
font: inherit;
color: #000000;
overflow: auto;
width: 98%;
height:100px;
max-width: 100%;
min-height:100px;
max-height:100px;
border: 1px solid #ccc;
border-radius: 5px;
resize: none;
}
textarea[readonly],
fieldset[disabled] textarea {
cursor: not-allowed;
background:#eee;
opacity: 1;
resize: none;
}
div [disabled].table-responsive{
cursor: not-allowed;
background:#eee;
opacity: 1;
resize: none;
}
input[type=checkbox]{
-ms-transform: scale(1.5);
-moz-transform: scale(1.5);
-webkit-transform: scale(1.5);
-o-transform: scale(1.5);
margin-right: .5rem;
}
input[type=radio]{
height: 25px;
width: 25px;
border-radius: 100%;
border: 3px solid #000000;
}
.normal {
margin: 0;
padding-left: 5px;
width: 100%;
height: 1.5rem;
color:#000000;
border: 1px solid #ccc;
border-radius: 5px;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 13px;
vertical-align: middle;
}  
.normal[readonly],
fieldset[disabled].normal {
cursor: not-allowed;
background:#eee;
height: 1.5rem;
width: 100%;
}
.cambio {
margin: 0;
width: 100%;
height: 1.5rem;
background:#ec6933;
color:#ffffff;
text-align:left;
border:none;
padding:2px;
filter:brightness(110%);
cursor: hand;
border-radius: 5px;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 15px;
vertical-align: middle;
}  
.login {
margin: 0;
padding: 0;
width: 100%;
height: 3rem;
color:#ffffff;
border: 2px solid #000000;
border-radius: 20px;
background:#3C4143;
text-align: center;
font-family: 'Patinio Neue';
font-style: normal;
font-weight: 400;
font-size: 16px;
vertical-align: middle;
}
#icon{
position: absolute;
display: block;
bottom: .8rem;
left: .5rem;
color:#ffffff;
}
/*******menu dropdown*******/
#desplazarcheck{
display:none;
}
#desplazarcheck:checked ~ .menu-box{
left: 0rem;
}
derecha{
max-width: 15rem;
width: 15rem;
max-height: 40rem;
height: auto;
background:#858585;
left: -110%;
right: 0;
top: 5rem;
text-align:left;
transition: all .2s;
position:fixed;
overflow-x: auto;
overflow-y: auto;
z-index:80;
}
.drop-left-menu{
padding-top:20px;
padding-bottom:20px;
margin-left:1.5rem;
text-align:left;
font-size:16px;
color:#ec6933;
}
.drop-left-menu label{
margin-left:1.5rem;
text-align:right;
color:#ffffff;
}
.drop-left-menu a{
color:#ffffff;
text-decoration: none
}
.drop-left-menu a:hover{
float:none;
color:#ec6933;
display:block;
cursor:pointer;
border:none;
}
.drop-left-menudos{
margin-left:2.5rem;
padding-top:20px;
padding-bottom:20px;
color:#ec6933;
}
.drop-left-menudos label{
margin-left:2.5rem;
text-align:right;
color:#ec6933;
}
.drop-left-menudos a{
color:#ec6933;
text-decoration: none
}
.drop-left-menudos a:hover{
float:none;
color:#ffffff;
display:block;
cursor:pointer;
border:none;
}

#bajarcheck{
display:none;
}
#bajarcheck:checked ~ .menu-bajar{
top: 5rem;
}
desplegable{
max-width: 10rem;
max-height: 7rem;
width: 10rem;
height: auto;
background:#858585;
top: -110%;
right: 0;
text-align:right;
transition: all .2s;
position:fixed;
overflow-x: auto;
overflow-y: auto;
z-index:80;
}
.drop-down-menu{
padding-top:20px;
padding-bottom:20px;
margin-right:1.5rem;
text-align:right;
font-size:15px;
color:#ec6933;
}
.drop-down-menu label{
margin-right:1.5rem;
text-align:right;
color:#ffffff;
}
.drop-down-menu a{
color:#ffffff;
text-decoration: none;
text-align:right;
}
.drop-down-menu a:hover{
float:none;
color:#ec6933;
display:block;
cursor:pointer;
border:none;
}

/*******logo*******/
.logo {
text-align: left;
padding-top: 1rem;
padding-bottom: 1rem;
margin: 0rem;
}
/*******videoencuesta*******/
#myVideo {
object-fit:cover;
}
video{
margin-left:0;
margin-right:0;
width: 100%;
height:100%;  
object-fit:cover;
opacity: 0.2;
}

/*******responsive*******/
@media only screen and (min-width: 1px) and (max-width: 540px){
#cabecerareport{
height:22rem;
}
#cabecerareport .col-xs-1 {
width: 16.66666667%;
}
#cabecerareport .col-xs-2{
width: 21%;  
}
#cabecerareport .col-xs-6{
width: 37%;  
} 
#cabecerarconsulta{
height:17rem;
}
#cabecerarconsulta .col-xs-1 {
width: 16.66666667%;
}
#cabecerarconsulta .col-xs-2{
width: 18%;  
}
#cabecerarconsulta .col-xs-8{
width: 37%;  
} 
#cabeceraingresos{
height:10rem;
}
#cabeceraingresos .col-xs-1 {
width: 16.66666667%;
}
#cabeceraingresos .col-xs-2{
width: 21%;  
}
#cabeceraingresos .col-xs-6{
width: 37%;  
}
#cabeceraexpediente{
height:12.5rem;
}
#cabeceraexpediente .col-xs-1 {
width: 16%;
}
#divbonos > div {
width: 35%;
}
#divbonos > divright{
width: 65%;
}
#divbonos > divright .col-xs-3 {
width: 50%;
}
#divgrupos > div {
width: 35%;
}
#divgrupos > div .frontboton{
width:7rem;
font-size:12px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > div .frontbotonact{
width:7rem;
font-size:12px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > divright{
width: 65%;
}
#divreportes > div {
width: 45%;
}
#divreportes > divright{
width: 55%;
}
#divreportes > divright .col-xs-3 {
width: 50%;
}
.calendarmovil{
display:true;
}
.calendarlap{
display:none;
}
.cabeceralap{
display:none;
}
.cabeceramovil{
display:true;
}
derecha{
max-height: 31rem;
}
.pagos .row .col-xs-4{
width: 40%;
}
.pagos .row .col-xs-6{
width: 60%;
}
.pagos .row .col-xs-8{
width: 60%;
}
.calenexpe .col-xs-8{
 width: 10%;
}
.table-responsive {
height:auto;    
max-height:25rem;
}
.modal-responsive {
left: 1%;
right: 1%;
max-width:98%;
max-height:30rem
}
.modalalerta {
top: 30%;
left: 4%;
right: 4%;
max-height: 24rem; 
max-width:23rem; 
}
.rowgraficacuerpo{
width: 150%;
}
label {
white-space: normal;
}
.planesbusqueda .col-xs-6{
width: 50%;
margin-bottom:1rem;
}
.planesbusqueda .col-xs-12{
width: 0%;
margin-bottom:1rem;
}
.planes{
z-index: 10;
width: 100%;
margin-top:-2.5rem;
border-top: 3px solid #ddd;
}
.planes p {
font-size:17px;
text-align:left;
margin-left:2.5rem;
}
.planes .col-xs-6{
margin-left:-3rem;
}
.planesgrafica{
z-index: 1;
width: 100%;
}
.planesgrafica .col-xs-12{
margin-top:-8rem;
z-index: 1;
}    
.rowgrafica{
width: 100%;
height:17rem;
}
.rowingresos{
width: 100%;
}
.rowgraficaimg{
width: 130%;
margin-top: -8rem;
margin-bottom: 1rem;
margin-left: -4rem;
margin-right: 0rem;
}
.rowgraficaimguno{
width: 100%;
margin-top: 1rem;
margin-bottom: 1rem;
margin-left: 0rem;
margin-right: 0rem;
}
.rowgraficaimgdos{
width: 100%;
margin-top: 1rem;
margin-bottom: 1rem;
margin-left: -7rem;
margin-right: 0rem;
}
.rowbonotabla .table-responsive{
max-height:25rem;
height:auto;
min-height:5rem;
}
.rowbonotablados .table-responsive{
max-height:17rem;
height:auto;
min-height:5rem;
}
.rowbonotabla{
width: 155%;
}
.rowgraficabono{
width: 114%;
margin-left: -2rem;
margin-top: -7rem;
margin-bottom: 0rem;
}
.rowbonotablados{
width: 100%;
}
.formloginmovil{
display:true;
padding-top:5rem;
width: 100%;
height: 100%;
}
.formloginmovil img {
padding-top:10rem;
position: absolute;
left: 8%;
right: 1%;
top: 0;
width: 84%;
height: 73%;
opacity: 0.2;
}
.formloginmovil .col-xs-1{
width: 30%;
}
.formloginmovil .col-xs-2{
width: 10%;
}
.formloginmovil .col-xs-4{
width: 40%;
}
.formloginmovil .col-xs-3{
width: 10%;
}
.formloginmovil .col-xs-5{
width: 70%;
}
.formloginmovil .col-xs-6{
width: 80%;
}
.formloginmovil .col-xs-8{
width: 40%;
}
.formloginlap{
display:none;
}
.vistacuestions{
padding-top:4rem;       
}
.vistacuestions .col-xs-10{
font-size:20px;
line-height:1.5rem;
text-align:left;
padding-left:10px;
color:#000000;
}
.cuestions{
padding-top:2rem;   
}
.cuestions .col-xs-10{
font-size:20px;
line-height:1.5rem;
text-align:left;
padding-left:10px;
color:#000000;
}
.respestrella{
margin-bottom:2rem;
}
.respestrella .col-xs-2{
padding-top:2rem;
font-size:10px;
line-height:1rem;
width: 16.6666667%;
}
.respesabierta .col-xs-2{
width: 10%;
}
.respesabierta .col-xs-4{
width: 80%;
font-size:20px;
line-height:1.5rem;
text-align:left;
}
.respesabierta textarea{
width:100%;
height:8rem;
font-size:20px;
vertical-align: middle;
line-height:1.5rem
}
.respesacasilla .table-responsive{
padding-left:4rem;
text-align:left;
height:auto;
}
.table-responsive .tdcasilla {
font-size:18px;
text-align:left;
border:none;
width:14rem;
height:3rem;
line-height:3rem;
max-width:14rem;
color:#000000;
}
.table-responsive .tdcasillados {
font-size:18px;
text-align:left;
border:none;
width:auto;
height:3rem;
line-height:3rem;
color:#000000;
}
.respboton .col-xs-2{
padding-top:2rem;
}
.respboton .frontbotonenc{ 
width:50px;
height:50px;
}
.respboton .edgebotonenc{
width:50px;
height:50px;   
}
.respboton img{ 
width: 50px;
height: 50px;
}
#dividir img {
margin-top:50%;
position: absolute;
left: 0;
right: 0;
top: 0;
width: 50%;
height: 45%;
opacity: 0.4;
}
.arealap{
display:none;
}
.areamovil{
display:true;
}
.cotizacionlap{
display:none;
}
.cotizacionmov{
display:true;
}
.expediente .col-xs-5{
font-size:40px;
width: 50%;
}
.expediente .col-xs-6{
font-size:30px;
width: 100%;
}


}
@media only screen and (min-width: 541px) and (max-width: 897px) {
#cabecerareport{
height:22rem;
}
#cabecerareport .col-xs-1 {
width: 16.66666667%;
}
#cabecerareport .col-xs-2{
width: 21%;  
}
#cabecerareport .col-xs-6{
width: 37%;  
} 
#cabecerarconsulta{
height:17rem;
}
#cabecerarconsulta .col-xs-1 {
width: 16.66666667%;
}
#cabecerarconsulta .col-xs-2{
width: 18%;  
}
#cabecerarconsulta .col-xs-8{
width: 37%;  
} 
#cabeceraingresos{
height:10rem;
}
#cabeceraingresos .col-xs-1 {
width: 16.66666667%;
}
#cabeceraingresos .col-xs-2{
width: 21%;  
}
#cabeceraingresos .col-xs-6{
width: 37%;  
} 
#divbonos > div {
width: 30%;
}
#divbonos > divright{
width: 70%;
}

#divgrupos > div {
width: 35%;
}
#divgrupos > div .frontboton{
width:11rem;
font-size:14px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > div .frontbotonact{
width:11rem;
font-size:14px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > divright{
width: 65%;
}
#divreportes > div {
width: 30%;
}
#divreportes > divright{
width: 70%;
}
.calendarmovil{
display:true;
}
.calendarlap{
display:none;
}
#calendario{
width:98%;
}
.cabeceralap{
display:none;
}
.cabeceramovil{
display:true;
}
.pagos .row .col-xs-4{
width: 40%;
}
.pagos .row .col-xs-6{
width: 60%;
}
.pagos .row .col-xs-8{
width: 60%;
}
.calenexpe .row .col-xs-8{
width: 60%;
}
.calenexpe .row .col-xs-1{
width: 8.33333333%;
}
.modal-responsive {
left: 10%;
right: 10%;
max-height: 35rem; 
width:80%;
}
.modalalerta {
top: 30%;
left: 10%;
right: 10%;
max-height: 24rem; 
width:80%; 
}
.table-responsive {
height:auto;    
max-height:55rem;
}
.planesbusqueda .col-xs-6{
width: 50%;
margin-bottom:1rem;
}
.planesbusqueda .col-xs-12{
width: 0%;
margin-bottom:1rem;
}
.planes{
z-index: 10;
width: 100%;
}
.planes p {
font-size:17px;
text-align:left;
margin-left:2.5rem;
}
.planes .col-xs-6{
margin-left:-3rem;
}
.planesgrafica{
width: 100%;
z-index: 1;
}
.planesgrafica .col-xs-12{
margin-top:-1rem;
z-index: 1;
}
.rowbonotabla .table-responsive{
max-height:25rem;
height:auto;
min-height:5rem;
}
.rowbonotablados .table-responsive{
max-height:18rem;
height:auto;
min-height:5rem;
}
.rowgrafica{
width: 100%;
}
.rowgraficaimg{
width: 110%;
margin-top: 0rem;
margin-bottom: 0rem;
margin-left: -3rem;
margin-right: 0rem;
}
.rowgraficaimguno{
width: 100%;
margin-top: 1rem;
margin-bottom: 0rem;
margin-left: -3rem;
margin-right: 0rem;
}
.rowgraficaimgdos{
width: 100%;
margin-top: 1rem;
margin-bottom: 1rem;
margin-left: 5rem;
margin-right: 0rem;
}
.rowbonotabla{
width: 100%;
}
.rowgraficabono{
width: 54%;
height: 100%;
margin-top: -6rem;
margin-bottom: -50rem;
margin-left: 11rem;
margin-right: 0rem;
}
.rowbonotablados{
width: 100%;
}
.formloginmovil{
display:true;
padding-top:8rem;
width: 100%;
height: 100%;
}
.formloginmovil img {
padding-top:9rem;
position: absolute;
left:8%;
right:8%;
top: 0;
width: 84%;
height: 95%;
opacity: 0.2;
}
.formloginmovil .col-xs-1{
width: 35%;
}
.formloginmovil .col-xs-2{
width: 20%;
}
.formloginmovil .col-xs-4{
width: 30%;
}
.formloginmovil .col-xs-3{
width: 10%;
}
.formloginmovil .col-xs-5{
width: 70%;
}
.formloginmovil .col-xs-6{
width: 80%;
}
.formloginmovil .col-xs-8{
width: 30%;
}
.formloginlap{
display:none;
}
.vistacuestions{
 padding-top:15rem;   
}
.vistacuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:1rem;
color:#000000;
}
.cuestions{
 padding-top:15rem;   
}
.cuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:1rem;
color:#000000;
}
.respestrella{
margin-bottom:2rem;
}
.respestrella .col-xs-2{
padding-top:5rem;
font-size:20px;
line-height:1rem;
width: 16.6666667%;
}
.respesabierta .col-xs-2{
width: 20%;
}
.respesabierta .col-xs-4{
width: 60%;
font-size:20px;
line-height:1.5rem;
text-align:left;
}
.respesabierta textarea{
width:100%;
height:10rem;
font-size:20px;
vertical-align: middle;
line-height:1.5rem
}
.respesacasilla .table-responsive{
padding-left:10rem;
text-align:left;
height:auto;
}
.table-responsive .tdcasilla {
font-size:25px;
text-align:left;
border:none;
width:20rem;
max-width:20rem;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.table-responsive .tdcasillados {
font-size:25px;
text-align:left;
border:none;
width:auto;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.respboton .col-xs-2{
padding-top:5rem;
}
.respboton .frontbotonenc{ 
width:80px;
height:80px;
}
.respboton .edgebotonenc{
width:80px;
height:80px;   
}
.respboton img{ 
width: 80px;
height: 80px;
}
.menu .col-xs-7{
width: 50%;
}
.menu .col-xs-5{
width: 50%;
}
#dividir img {
margin-top:15%;
position: absolute;
left: 0;
right: 0;
top: 0;
width: 50%;
height: 50%;
opacity: 0.4;
}
.arealap{
display:none;
}
.areamovil{
display:true;
}
.cotizacionlap{
display:none;
}
.cotizacionmov{
display:true;
}
.regarea .col-xs-1{
width: 25%;;
}
.regarea .col-xs-10{
 width: 50%;
}
}
@media only screen and (min-width: 871px) and (max-width: 1350px) {
#cabecerareport{
height:20rem;
}
#cabecerarconsulta{
height:15rem;
}
#cabeceraingresos{
height:8rem;
}
#cabeceraexpediente{
height:10rem;
}
#divbonos > div {
width:15%;
}
#divbonos > divright {
width: 85%;
}
#divgrupos > div {
width: 30%;
}
#divgrupos > div .frontboton{
width:15rem;
font-size:15px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > div .frontbotonact{
width:15rem;
font-size:15px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > divright{
width: 70%;
}
#divreportes > div {
width:25%;
}
#divreportes > divright {
width: 75%;
}
.calendarmovil{
display:none;
}
.calendarlap{
display:true;
}
.cabeceralap{
display:none;
}
.cabeceramovil{
display:true;
}
derecha{
max-height: 34rem;
}
.modal-responsive {
left: 20%;
right: 20%;
max-height: 40rem; 
width:60%;
}
.modalalerta {
top: 30%; 
}
.table-responsive {
height:auto;    
max-height:25rem;
}
.planesbusqueda .col-xs-6{
width: 25%;
}
.planesbusqueda .col-xs-12{
width: 50%;
}
.planes{
z-index: 10;
width: 50%;
}
.planes p {
font-size:17px;
text-align:left;
}
.planesgrafica{
z-index: 1;
width: 50%;
}
.pagos .row .col-xs-4{
width: 30%;
}
.pagos .row .col-xs-8{
width: 70%;
}
.pagos .row .col-xs-6{
  width: 70%;
}
.rowbonotabla .table-responsive{
max-height:22rem;
height:auto;
min-height:5rem;
}
.rowbonotablados .table-responsive{
max-height:13rem;
height:auto;
min-height:5rem;
}
.rowgrafica{
width: 50%;

}
.rowingresos{
width: 100%;
min-height:22rem;
}
.rowgraficaimg{
width: 50%;
margin-top: -2rem;
}
.rowgraficaimguno{
width: 50%;
margin-top: -2rem;
}
.rowgraficaimgdos{
width: 50%;
margin-top: -1rem;
}
.rowbonotabla{
width: 57%;
}
.rowgraficabono{
width: 30%;
margin-top: -5rem;
padding-bottom:2.5rem;
}
.rowbonotablados{
width: 57%;
min-height:20rem;
}
.formloginmovil{
display:none;
}
.formloginlap{
display:true;
padding-top:.5rem;
width: 100%;
height:90%;
}
.cabeceralap .col-xs-3 {
width: 15%;
}
.cabeceralap .col-xs-4 {
width: 20%;
}
.cabeceralap .col-xs-5 {
width: 65%;
text-align: left;
padding-top:10px;
padding-bottom:5px;
font-size: 20px;
font-family:'Patinio Neue';
}
.vistacuestions{
padding-top:3rem;   
}
.vistacuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:10rem;
color:#000000;
}
.cuestions{
padding-top:1rem;   
}
.cuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:10rem;
color:#000000;
}
.respestrella{
margin-bottom:2rem;
}
.respestrella .col-xs-2{
padding-top:5rem;
font-size:20px;
line-height:1rem;
width: 16.6666667%;
}
.respesabierta .col-xs-2{
width: 33.33333333%;
}
.respesabierta .col-xs-4{
width: 33.33333333%;
font-size:20px;
line-height:1.5rem;
text-align:left;
}
.respesabierta textarea{
width:100%;
height:10rem;
font-size:20px;
vertical-align: middle;
line-height:1.5rem
}
.respesacasilla .table-responsive{
padding-left:30rem;
text-align:left;
height:auto;
}
.table-responsive .tdcasilla {
font-size:25px;
text-align:left;
border:none;
width:20rem;
max-width:20rem;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.table-responsive .tdcasillados {
font-size:25px;
text-align:left;
border:none;
width:auto;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.respboton .col-xs-2{
padding-top:5rem;
}
.respboton .frontbotonenc{ 
width:80px;
height:80px;
}
.respboton .edgebotonenc{
width:80px;
height:80px;   
}
.respboton img{ 
width: 80px;
height: 80px;
}
.menu .col-xs-7{
width: 50%;
}
.menu .col-xs-5{
width: 50%;
}
#dividir img {
margin-top:5%;
position: absolute;
left: 5%;
right: 5%;
top: 0;
width: 40%;
height: 90%;
opacity: 0.4;
}
.arealap{
display:true;
}
.areamovil{
display:none;
}
.cotizacionlap{
display:true;
}
.cotizacionmov{
display:none;
}
.regarea .col-xs-1{
width: 25%;;
}
.regarea .col-xs-10{
 width: 50%;
}
}
@media only screen and (min-width: 1351px) and (max-width: 3000px) {
#cabecerareport{
height:20rem;
}
#cabecerarconsulta{
height:15rem;
}
#cabeceraingresos{
height:8rem;
}
#cabeceraexpediente{
height:11rem;
margin-top:1rem;
}
#divbonos > div {
width:15%;
}
#divbonos > divright {
width: 60%;
}
#divgrupos > div {
width: 30%;
}
#divgrupos > div .frontboton{
width:18rem;
font-size:15px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > div .frontbotonact{
width:18rem;
font-size:15px;
justify-content: left;
align-items: left;
text-align: left;
}
#divgrupos > divright{
width: 70%;
}
#divreportes > div {
width:25%;
}
#divreportes > divright {
width: 75%;
}

.calendarmovil{
display:none;
}
.calendarlap{
display:true;
}
.cabeceralap{
display:none;
}
.cabeceramovil{
display:true;
}
.grafingresos .rowgrafica{
z-index:8;
padding-top:-8rem
}
.rowingresos{
width: 50%;
min-height:30rem;
}
.modal-responsive {
left: 10%;
right: 10%;
max-height: 40rem; 
width:80%;
}
.modalalerta {
top: 25%; 
}
.table-responsive {
height:auto;    
max-height:35rem;
}
.planesbusqueda .col-xs-6{
width: 25%;
}
.planesbusqueda .col-xs-12{
width: 50%;
}
.planes{
z-index: 10;
width: 50%;
}
.planes p {
font-size:17px;
text-align:left;
}
.planesgrafica{
z-index: 1;
width: 50%;
margin-top: -2rem;
}
.pagos .row .col-xs-4{
width: 30%;
}
.pagos .row .col-xs-8{
width: 70%;
}
.pagos .row .col-xs-6{
  width: 70%;
}
.rowgrafica{
width: 50%;
}
.rowingresos{
width: 50%;
min-height:30rem;
}
.rowgraficaimg{
width: 50%;
margin-top: -2rem;
}
.rowgraficaimguno{
width: 50%;
margin-top: -2rem;
}
.rowgraficaimgdos{
width: 50%;
margin-top: -2rem;
}
.rowbonotabla .table-responsive{
max-height:22rem;
height:auto;
min-height:5rem;
}
.rowbonotablados .table-responsive{
max-height:26rem;
height:auto;
min-height:5rem;
}
.rowbonotabla{
width: 60%;
}
.rowgraficabono{
width: 30%;
margin-top: -5rem;
padding-bottom:2.5rem;
}
.rowbonotablados{
width: 60%;
}
.formloginmovil{
display:none;
}
.formloginlap{
display:true;
padding-top:6rem;
width: 100%;
height:90%;
}
.cabeceralap .col-xs-3 {
width: 15%;
}
.cabeceralap .col-xs-4 {
width: 20%;
}
.cabeceralap .col-xs-5 {
width: 65%;
text-align: left;
padding-top:10px;
padding-bottom:5px;
font-size: 20px;
font-family:'Patinio Neue';
}
.vistacuestions{
padding-top:8rem;   
}
.vistacuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:10rem;
color:#000000;
}
.cuestions{
padding-top:5rem;   
}
.cuestions .col-xs-10{
font-size:30px;
line-height:1.5rem;
text-align:left;
padding-left:10rem;
color:#000000;
}
.respestrella{
margin-bottom:2rem;
}
.respestrella .col-xs-2{
padding-top:5rem;
font-size:20px;
line-height:1rem;
width: 16.6666667%;
}
.respesabierta .col-xs-2{
  width: 33.33333333%;
}
.respesabierta .col-xs-4{
  width: 33.33333333%;
font-size:20px;
line-height:1.5rem;
text-align:left;
}
.respesabierta textarea{
width:100%;
height:10rem;
font-size:20px;
vertical-align: middle;
line-height:1.5rem
}
.respesacasilla .table-responsive{
padding-left:30rem;
text-align:left;
height:auto;
}
.table-responsive .tdcasilla {
font-size:25px;
text-align:left;
border:none;
width:20rem;
max-width:20rem;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.table-responsive .tdcasillados {
font-size:25px;
text-align:left;
border:none;
width:auto;
line-height:1.5rem;
padding-top:2rem;
color:#000000;
}
.respboton .col-xs-2{
padding-top:5rem;
}
.respboton .frontbotonenc{ 
width:80px;
height:80px;
}
.respboton .edgebotonenc{
width:80px;
height:80px;   
}
.respboton img{ 
width: 80px;
height: 80px;
}
.menu .col-xs-7{
width: 50%;
}
.menu .col-xs-5{
width: 50%;
}
#dividir img {
margin-top:10%;
position: absolute;
left: 5%;
right: 5%;
top: 0;
width: 40%;
height: 70%;
opacity: 0.4;
}
.arealap{
display:true;
}
.areamovil{
display:none;
}
.cotizacionlap{
display:true;
}
.cotizacionmov{
display:none;
}
.regarea .col-xs-1{
width: 25%;;
}
.regarea .col-xs-10{
 width: 50%;
}
.expediente .col-xs-5{
font-size:50px;
width: 50%;
}
.expediente .col-xs-6{
font-size:50px;
}
}