/* By Martin Flores */
:root {
  --safe-area-bottom: env(safe-area-inset-bottom);
}

/*-------------------------------------------*\
 * _Font_Face
 *
 * Definicion de tipografías
 * - Light     [f1]
 * - Regular   [f2]
 * - Medium    [f3]
 * - SemiBold  [f4]
 * - Bold      [f5]
\*-------------------------------------------*/

@font-face {
    font-family: 'Customfont';
    src: url(fonts/5c92d5d3e39a260d5dd06ced7eca070d.ttf);
}

@font-face {
    font-family: 'f4';
    src: url(fonts/5c92d5d3e39a260d5dd06ced7eca070d.woff2);
}

@font-face {
    font-family: 'f5';
    src: url(fonts/5c92d5d3e39a260d5dd06ced7eca070d.woff2);
}

@font-face {
    font-family: 'f3';
    src: url(fonts/b796339b324ec08006ca04dca90284cf.woff2);
}

@font-face {
    font-family: 'f2';
    src: url(fonts/bcf3bb1b7f7a3436181788e748bae013.woff2);
}

@font-face {
    font-family: 'f1';
    src: url(fonts/bcf3bb1b7f7a3436181788e748bae013.woff2);
}

.f1 {
    font-family: 'f1', sans-serif;
}

.f2 {
    font-family: 'f2', sans-serif;
}

.f3 {
    font-family: 'f3'!important;
}

.f4 {
    font-family: 'f4', sans-serif!important;
}

.f5 {
    font-family: 'f5', sans-serif;
}

*{font-family: 'f2', sans-serif;letter-spacing: -0.5px;}
/*.f1{font-family: 'Poppins'!important;letter-spacing: -0.7px!important;font-weight:300;}*/
/*.f2{font-family: 'Poppins'!important;font-weight: 500; letter-spacing: -0.7px!important;}*/
/*.f3{font-family: 'Poppins'!important;font-weight: 800;letter-spacing: -0.7px!important;}*/
.ttc{text-transform: capitalize;}
.pl0{padding-left: 0px!important;}
.pr0{padding-right: 0px!important;}
html body .pt0{padding-top: 0px!important;}
.bgray{border: 1px solid #d0d0d0;}
.mb5{margin-bottom: 5px}
html body .mt20 {
    margin-top: 20px!important;
}
.c30{color: #303030!important;}
/*F7*/
/*html div.dialog-backdrop.backdrop-in{background: rgba(0, 0, 0, .8);}*/
.list ul::before{opacity:0!important}
.list ul::after{opacity:0!important}
.br,.br1{width: 100%;height: calc(15px * 1);float: left;}
.br2{width: 100%;height: calc(15px * 2);float: left;}
.br3{width: 100%;height: calc(15px * 3);float: left;}
.br4{width: 100%;height: calc(15px * 4);float: left;}
.br5{width: 100%;height: calc(15px * 5);float: left;}
.pt90{padding-top: 90px!important;}
.info{margin-top:0px!important;}
.info> span{
  z-index: 2!important;
  position: relative!important;
  padding: 0px 3px 0px 3px!important;
  left: 0px!important;
  top: -9px;
  font-family: 'f4'!important;
  font-size: 14px!important;
  text-transform: uppercase;
}
.btnScreenFooter{
    width: 232px;
    display: block;
    margin: auto;
}
.btnScreenFooter img{
    width: 36px;
    opacity: .9;
    margin: auto;
    height: 36px;
    filter: invert(1);
}
.btnScreenFooter span{}
.btnScreenFooter >a {
    width: 53px;
    height: 53px;
    float: left;
    background: white;
    margin: 0 10px;
    display: flex;
    cursor: pointer;
    border-radius: 10000pt;
    background: #006dd8;
    border: 2px solid white;
}
.info> div{
  text-align: left!important;
  position: relative!important;
  top: -10px!important;
  padding-top: 3px!important;
  padding-left: 10px!important;
}
.btnSimple{
  border: 0px solid gray;
  border-radius: 1pt;
  background: black;
  color: white;
  padding: 10px 15px;
  cursor: pointer;
}
/*SHORT*/
.b1sw{border:1px solid white!important;}
.p20{padding: 20px!important}
.ttu{text-transform: uppercase;}
.cp{cursor: pointer;}
html, body{margin: 0;padding:0px;background: #f1f1f1;}
.noselect{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.txt-black{color: black!important;}
.bgi{background: url(assets/img/bg.png);}
.br10{border-radius: 10pt!important;}
.shadow{box-shadow: 0 8px 16px 0 rgb(0 0 0 / 15%)!important;}
.ma{margin: auto!important;}
.m0{margin: 0!important;}
.ml0{margin-left: 0!important;}
.mra{margin-right: auto!important;}
.df{display: flex!important;}
.fdr{flex-direction: row!important;}
.fl{float: left!important;}
.tdu{text-decoration: underline;}
.tdn{text-decoration: none;}
.fdc{flex-direction: column!important;}
.db{display: block!important;}
.toe{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;}
.w100{width: 100%!important;}
.fj{filter: grayscale(1);}
.bgw{background: white!important;}
.bgb{background: black!important;}
.oh{overflow: hidden;}
.op9{opacity: .9;}
.p0{padding: 0px!important;}
html body .pb0{padding-bottom:0px!important;}
.pt5{padding-top:5px!important;}
.prt1{position: relative;top: -1.5px;}
.pl10{padding-left: 10px!important;}
.pr10{padding-right: 10px!important;}
.pt10{padding-top: 10px!important;}
.pb10{padding-bottom: 10px!important;}
.pl20{padding-left: 20px!important;}
.pl40{padding-left: 40px!important;}
.pl45{padding-left: 45px!important;}
.pl55{padding-left: 55px!important;}
.pr20{padding-right: 20px!important;}
.pt20{padding-top: 20px!important;}
.pb20{padding-bottom: 20px!important;}
.dfc{display: flex; flex-wrap: wrap; justify-content: center;}
.box{max-width:1080px!important;margin: auto!important;}
.pixImg{image-rendering: auto;image-rendering: crisp-edges;image-rendering: pixelated;}

body .c21{color:#212121;}
body .c31{color:#313131;}
body .c41{color:#414141;}
body .c51{color:#515151;}
body .c61{color:#616161;}
body .c71{color:#717171;}
body .c81{color:#818181;}
body .c91{color:#919191;}

body .bb1c21{border-bottom:1px solid #212121;}
body .bb1c31{border-bottom:1px solid #313131;}
body .bb1c41{border-bottom:1px solid #414141;}
body .bb1c51{border-bottom:1px solid #515151;}
body .bb1c61{border-bottom:1px solid #616161;}
body .bb1c71{border-bottom:1px solid #717171;}
body .bb1c81{border-bottom:1px solid #818181;}
body .bb1c91{border-bottom:1px solid #e6e6e6;}
/*FONTS*/
.f8{font-size: 8pt!important;}
.f10{font-size: 10pt!important;}
.f12{font-size: 12pt!important;}
.f14{font-size: 14pt!important;}
.f16{font-size: 16pt!important;}
.f18{font-size: 18pt!important;}
.f20{font-size: 20pt!important;}
.f22{font-size: 22pt!important;}
.f24{font-size: 24pt!important;}
.f26{font-size: 26pt!important;}
.f28{font-size: 28pt!important;}
.f30{font-size: 30pt!important;}
.f32{font-size: 32pt!important;}
.f34{font-size: 34pt!important;}
.f36{font-size: 36pt!important;}
.f38{font-size: 38pt!important;}
.f40{font-size: 40pt!important;}
/* line height */
.lh8{line-height: 8px!important;}
.lh10{line-height: 10px!important;}
.lh12{line-height: 12px!important;}
.lh14{line-height: 14px!important;}
.lh16{line-height: 16px!important;}
.lh18{line-height: 18px!important;}
.lh20{line-height: 20px!important;}
.lh22{line-height: 22px!important;}
.lh24{line-height: 24px!important;}
.lh26{line-height: 26px!important;}
.lh28{line-height: 28px!important;}
.lh30{line-height: 30px!important;}
.lh32{line-height: 32px!important;}
.lh34{line-height: 34px!important;}
.lh36{line-height: 36px!important;}
.lh38{line-height: 38px!important;}
.lh40{line-height: 40px!important;}
.lh45{line-height: 45px!important;}
.lh50{line-height: 50px!important;}
/* text colors */
.txt-red{color: red;}
.txt-blue{color: blue;}
.txt-white{color: white;}
.txt-black{color: black;}
.txt-orange{color: #ff5000;}
/* overflow */
.ov{overflow: visible!important;}
.oh{overflow: hidden!important;}
.os{overflow: scroll!important;}
.osx{overflow-x: scroll!important;}
.osy{overflow-y: scroll!important;}
/* floats */
.fl{float: left!important;}
.fr{float: right!important;}
.fn{float: unset!important;}
/* Positions */
.pf{position: fixed!important;}
.pa{position: absolute!important;}
.pr{position: relative!important;}
.ps{position: static!important;}

/* columns */
.d1,.d2,.d3,.d4,.d5,.d6,.d7,.d8,.d9,.d10,.d11,.d12,
.d1-md,.d2-md,.d3-md,.d4-md,.d5-md,.d6-md,.d7-md,.d8-md,.d9-md,.d10-md,.d11-md,.d12-md,
.d1-sm,.d2-sm,.d3-sm,.d4-sm,.d5-sm,.d6-sm,.d7-sm,.d8-sm,.d9-sm,.d10-sm,.d11-sm,.d12-sm,
.d1-xs,.d2-xs,.d3-xs,.d4-xs,.d5-xs,.d6-xs,.d7-xs,.d8-xs,.d9-xs,.d10-xs,.d11-xs,.d12-xs{
  float: left;
  padding: 10px;
  transition: width 0.3s ease;
  -o-transition: width 0.3s ease;
  -ms-transition: width 0.3s ease;
  -moz-transition: width 0.3s ease;
  -webkit-transition: width 0.3s ease;
  text-align: center;
  box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
/*.d1 img,.d2 img,.d3 img,.d4 img,.d5 img,.d6 img,.d7 img,.d8 img,.d9 img,.d10 img,.d11 img,.d12 img{width: 100%;}*/
.d1{width: 8.33333333%}
.d2{width: 16.66666667%}
.d3{width: 25%}
.d4{width: 33.33333333%}
.d5{width: 41.66666667%}
.d6{width: 50%}
.d7{width: 58.33333333%}
.d8{width: 66.66666667%}
.d9{width: 75%}
.d10{width: 83.33333333%}
.d11{width: 91.66666667%}
.d12{width: 100%}
.hide{display: none!important;}
.hide-i{display: none!important;}
.show{display: block;}
.txt-left{text-align: left;}

.menuGeneric{
  position: absolute;
  top: 0;
  left: 0;
  width: 60px;
  height: 68px;
  display: flex;
  cursor: pointer;
}
.menuGeneric i{
  margin: auto;
  font-size: 22px;
}
.txt-right{text-align: right!important;}
/* Laptop */
@media (max-width: 1000px) {
  .txt-center-md{text-align: center!important;}
  .txt-left-md{text-align: center!important;}
  .txt-right-md{text-align: center!important;}
  .hidden-md{visibility: hidden;}
  .hide-md{display: none;}
  .show-md{display: block;}
}
/* Tablet */
@media (max-width: 700px) {
  .txt-center-sm{text-align: center!important;}
  .txt-left-sm{text-align: center!important;}
  .txt-right-sm{text-align: center!important;}
  .hidden-sm{visibility: hidden;}
  .hide-sm{display: none!important;}
  .show-sm{display: block!important;}
  .show-smf{display: flex!important;}
  .height-sm-100{height: 10vh!important;}
  .d1-sm{width: 8.33333333%}
  .d2-sm{width: 16.66666667%}
  .d3-sm{width: 25%}
  .d4-sm{width: 33.33333333%}
  .d5-sm{width: 41.66666667%}
  .d6-sm{width: 50%}
  .d7-sm{width: 58.33333333%}
  .d8-sm{width: 66.66666667%}
  .d9-sm{width: 75%}
  .d10-sm{width: 83.33333333%}
  .d11-sm{width: 91.66666667%}
  .d12-sm{width: 100%}
  html body #content{
    width: 100vw!important;
  }
  html body .headerContent{
    width: 100vw!important;
    padding-left: 50px!important;
  }
  html body aside{
    z-index: 4!important;
    width: 100vw!important;
    transition: transform .5s ease!important;
    transform: translateX(-100vw)!important;
  }
}
/* Phone */
@media (max-width: 460px) {
  .txt-center-xs{text-align: center!important;}
  .txt-left-xs{text-align: center!important;}
  .txt-right-xs{text-align: center!important;}
  .hidden-xs{visibility: hidden;}
  .hide-xs{display: none;}
  .show-xs{display: block;}
  .d1-xs{width: 8.33333333%}
  .d2-xs{width: 16.66666667%}
  .d3-xs{width: 25%}
  .d4-xs{width: 33.33333333%}
  .d5-xs{width: 41.66666667%}
  .d6-xs{width: 50%}
  .d7-xs{width: 58.33333333%}
  .d8-xs{width: 66.66666667%}
  .d9-xs{width: 75%}
  .d10-xs{width: 83.33333333%}
  .d11-xs{width: 91.66666667%}
  .d12-xs{width: 100%}
}

#splash {
    position: fixed;
    top: 0;
    z-index: 10000000000000000000!important;
    width: 100%;
    height: 100%;
    background: white;
}

.imgTR {
    width: 180px;
    position: absolute;
    top: 0;
    right: 0;
}

.imgBL {
    width: 180px;
    position: absolute;
    bottom: 0;
    left: 0;
}

#splash ._logo {
    width: 100px;
    margin: auto;
    display: block;
    margin-top: 10px;
}

#splash .whitePoly {}

#splash .imgAyuntamiento {
    width: 150px;
    left: 0;
    right: 0;
    bottom: 60px;
    position: absolute;
    margin: auto;
    transition: opacity, transform, .3s ease;
    transform: translateY(30px);
    opacity: 0;
}

#splash>div>div {}

#splash .centerGrid {
    max-width: 330px;
    height: 250px;
    position: absolute;
    top: 58%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    padding: 40px 5px;
    margin: auto;
    transition: opacity .3s ease;
    opacity: 0;
    width: 100%;
}

#splash .gray {
    position: absolute;
    width: 70%;
    height: 3px;
    background: #dedede;
    top: 165px;
    overflow: hidden;
    border: 2px solid #dedede;
    left: 0;
    right: 0;
    margin: auto;
}

#splash .green {
    width: 0%;
    transition: width 4s ease;
    height: 4px;
    background: #da0000;
    position: absolute;
    left: 0;
    top: 0px;
}

#splash .whitePoly {
    position: fixed;
    width: 500vw;
    height: 500vh;
    z-index: 100000000000;
    top: 0;
    left: 0;
    transition: opacity .3s ease;
    opacity: 1;
    background: white;
}





#dialog{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000000000000;
    display: none;
    overflow: hidden;
    padding: 0px;
}
#dialog .dialog{
    width: 100%;
    margin: auto;
    height: auto;
    transform: translateY(110vh);
    transition: opacity, transform, .5s ease;
    border-radius: 0;
    overflow: hidden;
    background: #f1f1f1;
    max-width: 500px;
    z-index: 2;
    position: absolute;
    top: 0px;
    opacity: 0;
    display: none;
    left: 0;
    transform-origin: center;
    right: 0px;
    margin-top: 9px;
}
#dialog .dialog .header{
    width: 100%;
    height: 75px;
    background: white;
    border-bottom: 4px solid #d9d9d9;
}
.btnHeadrGradient{
    background: linear-gradient( 134deg ,#35b6e6,#156b9d)!important; color: white; padding: 15px;
}
.btnHeadrBlack{
    background:black!important; color: white; padding: 15px;
}
#dialog .cap{
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    top:0;
    left: 0;
    background: rgb(0 0 0 / 50%);
    transition: opacity,background, .3s ease;
    opacity: 0;
}


.form-dialog{}
.form-dialog input:not(*[type="checkbox"]), .form-dialog select{
    all: unset;
    width: 100%;
    text-indent: 10px;
    text-align: left;
    font-size: 16px;
    padding: 8px 0px;
    font-family: 'f3';
    text-transform: uppercase;
    color: black;
    position: relative;
    top: 15px;
    padding-bottom: 0px;
    z-index: 2;
}

.formInputs{
  max-height: calc(100vh - 170px);
  overflow-y: auto;
}
.formInputs > .d12:first-child{margin:0;}
.formInputs > .d12{
    margin-top: 20px!important;
}

.formInputs > .d12>.d12 i.icon-chevron-down,
.formInputs > .d12>.d12 i.icon-loader{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    font-size: 16pt;
}
.formInputs > .d12>.d12 i.icon-loader{
    display: none;
    color: #717171;
    animation: loader .5s infinite;
}
@keyframes loader{
0%{opacity: 1;}
50%{opacity: 0;}
100%{opacity: 1;}
}
.formInputs > .d12>.d12 {
    background: white;
    overflow: hidden;
    position: relative;
    border: 1px solid #d0d0d0;
    border-radius: 5pt;
    box-shadow: 0px 5px 15px -5px rgb(0 0 0 / 20%);
}
.btnSm{
  font-size: 16px!important;
  width: 180px!important;
  height: 50px!important;
  float: right!important;
}
.btnSmCancel{
  width: 100px!important;
  padding: 10px!important;
  float: left!important;
  margin-right: 10px!important;
  height: 27px!important;
  padding-top: 18px!important;
}


table{
    background: white;
    width: 100%;
    border-spacing: 0px;
    overflow: auto;
}
table tbody{}
table thead{}
table tr{
}
th {
  background-color: black;
  color: white;
  font-size: 12px;
}
tr:hover {background-color: #f5f5f5;}
tr:nth-child(even) {background-color: #f2f2f2;}
table td{text-align: left;padding: 15px 8px;min-width: 90px;}
table th{
    text-align: left;
    padding: 5px 8px;
}

.loader{
    width: 100%;
    height: 4px;
    background: black;
    overflow: hidden;
}
.loader div{
    width: 20px;
    background: white;
    height: 5px;
    display: block;
    margin:auto;
    /*transition: transform 1s ease;*/
    animation-duration: 1.5s;
    animation-name: loading;
    animation-iteration-count: infinite;
}

@keyframes loading {
  0% {
    transform: translateX(-610%);
  }

  50% {
    transform: translateX(610%);
  }

  100% {
    transform: translateX(-610%);
  }
}

.section{width: 100%;display: flex;background: #f7f7f7;flex-direction: column;overflow: hidden;border: 1px solid #d0d0d0;border-radius: 5pt;height: 55px;box-shadow: 0px 6px 6px -5px rgb(0 0 0 / 50%);} .section .main{border-bottom: 1px solid #d0d0d0;padding: 10px;font-family: 'f4';color: #616161;position: relative;cursor: pointer;text-transform: uppercase;background: linear-gradient(0deg, #d0d0d0, #fff);font-size: 18pt;text-align: left;} .subSection{} .subSection .main{padding: 5px;text-transform: uppercase;background: #e5e5e5;font-size: 14px;color: #414141;font-family: 'f3';border: 2px dashed #a1a1a1;}
.section .main>i{
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 20pt;
}


.inputF{
    display: flex;
    flex-direction: column;
    position: relative;
}
.iconsito{
    position: absolute;
    bottom: 11px;
    right: 12px;
    font-size: 19px;
    color: #515151;
}
                            .inputF>span{
    text-align: left;
    padding-left: 5px;
    padding-top: 10px;
    font-size: 14px;
    font-family: 'f3';
    color: #616161;
    text-transform: uppercase;
    position: absolute;
    font-size: 12px;
    top: -7px;
    left: 5px;
    line-height: 12px;
}
                            .inputF>div{
    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;
    box-shadow: 0px 5px 15px -5px rgb(0 0 0 / 20%);
    background: white;
    height: 50px;
}
                            .inputF>div>input{}