* {
  box-sizing: border-box;
}
.sub-menu{
    right:auto !important;
    left:-20px;
    padding-top:25px;
}
#cb-row--footer-desktop-bottom .hfg-slot.left,#cb-row--footer-mobile-bottom .hfg-slot.left{
    visibility:hidden;
}
#preloader{
  z-index:98;
  position: fixed;
  top:0;
  background:white;
  opacity:0.7;
  width:100%;
  height:100vh;
}
.loader {
  z-index:99;
  font-size: 30px;
  font-weight:bold;
  margin: 25% 50%;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: fixed;
  /*text-indent: -9999em;*/
  -o-animation: load4 1.3s infinite linear;
    -moz-animation: load4 1.3s infinite linear;
      -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
}
@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0em -3em 0em 0.2em #0404B4, 2em -2em 0 0em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 0em #0404B4;
  }
  12.5% {
    box-shadow: 0em -3em 0em 0em #0404B4, 2em -2em 0 0.2em #0404B4, 3em 0em 0 0em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  25% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 0em #0404B4, 3em 0em 0 0.2em #0404B4, 2em 2em 0 0em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  37.5% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 0em #0404B4, 2em 2em 0 0.2em #0404B4, 0em 3em 0 0em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  50% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 0em #0404B4, 0em 3em 0 0.2em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  62.5% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 0em #0404B4, -2em 2em 0 0.2em #0404B4, -3em 0em 0 0em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  75% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 0.2em #0404B4, -2em -2em 0 0em #0404B4;
  }
  87.5% {
    box-shadow: 0em -3em 0em 0em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 0em #0404B4, -2em -2em 0 0.2em #0404B4;
  }
}
@keyframes load4 {
  0%,
  100% {
    box-shadow: 0em -3em 0em 0.2em #0404B4, 2em -2em 0 0em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 0em #0404B4;
  }
  12.5% {
    box-shadow: 0em -3em 0em 0em #0404B4, 2em -2em 0 0.2em #0404B4, 3em 0em 0 0em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  25% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 0em #0404B4, 3em 0em 0 0.2em #0404B4, 2em 2em 0 0em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  37.5% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 0em #0404B4, 2em 2em 0 0.2em #0404B4, 0em 3em 0 0em #0404B4, -2em 2em 0 -0.5em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  50% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 0em #0404B4, 0em 3em 0 0.2em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 -0.5em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  62.5% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 0em #0404B4, -2em 2em 0 0.2em #0404B4, -3em 0em 0 0em #0404B4, -2em -2em 0 -0.5em #0404B4;
  }
  75% {
    box-shadow: 0em -3em 0em -0.5em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 0.2em #0404B4, -2em -2em 0 0em #0404B4;
  }
  87.5% {
    box-shadow: 0em -3em 0em 0em #0404B4, 2em -2em 0 -0.5em #0404B4, 3em 0em 0 -0.5em #0404B4, 2em 2em 0 -0.5em #0404B4, 0em 3em 0 -0.5em #0404B4, -2em 2em 0 0em #0404B4, -3em 0em 0 0em #0404B4, -2em -2em 0 0.2em #0404B4;
  }
}
.m-signature-pad {
  position: relative;
  font-size: 1.1rem;
  color: white;
  width:auto;
  max-width: calc(70vh - 15px);
  height:70vh;
  margin:auto;
  border: 1px solid #e8e8e8;
  background-color: LightGrey; 
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.08) inset;
  border-radius: 4px;
}
.m-signature-pad:before, .m-signature-pad:after {
  position: absolute;
  z-index: -1;
  content: "";
  width: 40%;
  height: 10px;
  left: 20px;
  bottom: 10px;
  background: transparent;
  transform: skew(-3deg) rotate(-3deg);
  box-shadow: 0 8px 12px rgba(0, 0, 0, 0.4);
}
.m-signature-pad:after {
  left: auto;
  right: 20px;
  transform: skew(3deg) rotate(3deg);
}
.m-signature-pad--body {
  position: absolute;
  left: 20px;
  right: 20px;
  top: 35px;
  bottom: 90px;
  border: 1px solid #f4f4f4;
}
.m-signature-pad--body  canvas {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.02) inset;
}
.m-signature-pad--footer {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 20px;
  height: 30px;
}
.m-signature-pad--footer  .description {
  color: #C3C3C3;
  text-align: center;
  font-size: 1.2em;
  margin-top: 1.8em;
}
.m-signature-pad--footer  .button {
  position: absolute;
  bottom: 0;
}
.m-signature-pad--footer .button.clear {
  left: -10px;
  font-size: 1.0rem;
}
.m-signature-pad--footer  .button.save {
  right: -10px;
  font-size: 0.9rem;
}
.inputfile{
    font-size: 1.10em;
    font-weight: 700;
    color: white;
    background-color: #dcdcdc;
    display: inline-block;
}
.inputfile:focus,
.inputfile:hover {
    background-color: green;
}
.menu{
    position:fixed;
    top:0;
    left:0;
    right:0;
    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 1s;
    z-index:999;
}
@keyframes fadeInOpacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.mirow{
    width:100%;
    text-align:center;
}
.micontainer{
    width:98%;
    max-width:1000px;   
    margin:auto;
    overflow-X:auto;
    text-align:center;
}
.cabent{
    background:black;
    color:white;
    padding:2px;
}
#msgerror{
    width:90%;
    color:red;
    margin:auto;
}
#msgtxt{
    width:90%;
    color:black;
    margin:auto;
}
.error{
    margin:auto;
    color:red;
    font-size:18px;
    text-align:center;
}
.tablaent { 
    overflow-X:auto;
    }
.tablaent td{
    padding:5px 2px;
    font-size:14px;
}
.tablaent td,.tablaent th{
    padding:3px 1px;
    font-size:14px;
    text-align:center;
}
.letra{
border:2px solid black;
padding:3px!important;
background-color:#9571ea; 
color:black;  
min-width:25px;
font-size:18px!important;
}
.letra:hover{
background:white;
color:#9571ea; 
}
.pulsar{
cursor:pointer;
}
.pulsar:active{
top:5px;
-webkit-box-shadow: 0 8px 8px 0 #03398f;
-moz-box-shadow: 0 8px 8px 0 #03398f;
box-shadow: 0 8px 8px 0 #03398f;
}
form.forment p input[type='text'],
form.forment p input[type='email'],
form.forment p input[type='tel'],
form.forment p input[type='number'],
form.forment p textarea {
    display: block;
    width: 95%;
    margin-left:4%;
    min-height:1.5rem;
    border: none;
    line-height:1rem;
    color:#722179;  
    background-color:#779edf; 
}
input:disabled{
    background-color:transparent!important;
}
form input, form select, .entregar p{
  display: block;
  width: 95%;
  margin-left:4%;
  min-height:1.5rem;
  border: none;
  line-height:1rem;
  color:#722179;  
  background-color:#779edf;
  text-align:center;
}
.entregar p{
  display: block;
  min-height:2rem;
  color:#722179;  
  background-color:#779edf;
  padding:5px;
}
.finalizadas{
    text-align:left;
}
.finalizadas span{
  display: block;
  min-height:2rem;
  color:#722179;  
  background-color:#779edf;
  width:100%;
  padding:5px;
}
.botonera{
    display:flex;
    justify-content: center;
    align-items:center;
    margin:0 50px;
    flex-wrap: wrap;
}
.clientes{
    display:flex;
    justify-content: center;
    align-items:center;
    margin:0 50px;
    flex-wrap: wrap;
    border:5px solid blue;
    margin-bottom:30px;
}
.clientes div{
    width:100%;
    text-align:center;
}
.botonera div{
    margin:20px;
    width:160px;
}
.botonera div form input{
    padding-left:5px;
    padding-right:5px;
}
.botonera p{
    max-width:20%;
}
.tipofotos{
    font-size:11px;
    display: flex;
    display: -webkit-flex;
    justify-content: space-around;
    width:96%;
    margin-left: 3%;
    flex-wrap: wrap;
    align-items: flex-start;
}
.flex{
    display:flex;
    justify-content: center; 
    flex-wrap: wrap;
    align-content: center;
}
.flex p, .flex span{
   width: 45%; 
   min-width:350px;
   border: black 1px solid;
   margin: 2px;   
}
.flex h6{
   width: 95%; 
   min-width:350px;
   border: black 1px solid;
   margin: auto;   
}
.flex span p{
width:45%;
float:left;
margin-left:2%;
min-width:1px;
}
.bg-azul {
    background-color:#03398f;
}
.azul {
    color: #03398f;
}
.blanco {
    color: white;
}
.bg-blanco {
    background-color: white;
}
.azulm{
    color:#779edf;
}
.bg-azulm{
    background-color:#779edf;
}
.azulc{
    color:#d1dbe7;
}
.bg-azulc{
    background-color:#d1dbe7;
}
.viol{
     color:#722179;  
}
.bg-viol{
       background-color:#722179; 
}
@media (max-width: 959px){
.hide-on-tablet{
    display:block;
    font-size:12px;
}
.left{width:70%;}
.right{margin-left:-50%;}
.hide-on-desktop{display:none;}
}
@media (max-width: 800px){
.tablaent td{
    padding:5px 0px;
    font-size:12px;
}
.tablaent td,.tablaent th{
    font-size:13px;
} 
.flex p, .flex span{
   width: 80%; 
}
.botonera{
    margin:0 5px 0 5px;
}
.botonera div{
    margin:20px 5px;
}
.botonera p{
   font-size:12px;
}
}
@media (max-width: 500px){
.hide-on-tablet{display:none;}
.hide-on-desktop{display:block;}
.tablaent td{
    padding:5px 0px;
    font-size:11px;
}
.tablaent td,.tablaent th{
    font-size:9px;
}   
.botonera p{
    max-width:33%;
}
}