:root{
  --color1-visa:#94C11F;  
  --color2-visa: #11385B;
  --color3-visa:#28c1df;
  --color-wt:#ffffff;
  --color-bk:#000000;
  --colorbk-rgba:rgba(0,0,0,0.6);
  --colorwt-rgba:rgba(255,255,255,0.8);
}

.header-vs{
background-color: var(--color2-visa)!important;
color:var(--color-wt);
position: center;
}



.header-visa{
  background-color: var(--color2-visa)!important;
  color: var(--color-wt)!important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  /* overflow: hidden; */
  z-index: 999999;
}
.btn-success{
background-color: var(--color1-visa)!important;
color: var(--color-wt)!important;
border: solid 1px var(--color1-visa)!important;
}
.btn-outline-success{
color: var(--color1-visa)!important;
border-color: var(--color1-visa)!important;
}

.btn-outline-success:hover{
color: var(--color-wt)!important;
background-color: var(--color1-visa)!important;
}

iframe {
margin-left: 2.5%;
max-width: 95%;
height: auto;
}

.visor {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.visor iframe {
position: absolute;
top:0;
left: 0;
width: 95%;
height: 100%;
}
/* 
.header-visa .icon {
  display: none;
  color: var(--color-wt);
}

@media screen and (max-width: 600px) {
  .header-visa a:not(:first-child) {display: none;}
  .header-visa a.icon {
    float: left;
    display: block;
  }
}
 */



.menu-visa{
  background-color: var(--color2-visa)!important;
  color: var(--color-wt);
}

.nav-visa{
  color: var(--color-wt);
}

.footer-visa{
  background-color: var(--color2-visa)!important;
  bottom:0;
  left: 0, !important;
  right:0;
  position:static!important;
  z-index:999;
  width:auto;
  /* max-height: 10%; */
}

.botonOk{
  background-color: var(--color2-visa)!important;
  border: 1px solid var(--color2-visa)!important;
  color: var(--color-wt)!important;
}

.closebuton{
  background-color: var(--color-wt);
}

.close:hover{
  color: var(--color-wt);
}

.info-nmb{
  width: 50%!important;
  word-wrap: break-word!important;
  font-size: 1em!important;
}

.text-page{
text-align: justify;
width: 100%;
}

/*Home page clases*/
.container-home{
margin-top : 100px;
}

.form-info-tramite{
background-color: var(--colorbk-rgba);
color: var(--color-wt);
align-items: center;
padding: 5%;
border-radius: 15px;
width: 100%;
}

.title-form-info{
text-align: right;
}

.form-info{
align-items: center;
}


#dv-info-tramites{
background-image: url(https://img.freepik.com/vector-gratis/conjunto-pegatinas-distintivos-viaje_53876-100734.jpg?w=1380&t=st=1696451664~exp=1696452264~hmac=532332fce254c9593fe8145f8b2301b0ebf1b6525bfd29ad8de857584398046f);
background-repeat: no-repeat;
background-size: cover;
border-radius: 15px;
}

.section-home{
margin-top: 1.5rem;
}

.forgot-body{
position: relative;
overflow: auto;
}

.forgot-body::before{
background-color: var(--color2-visa);
background-size: contain; 
background-repeat: no-repeat;
background-position: top;
padding-top: 10%;
overflow-y: scroll;
width: 100%;
height: 100%;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
display: block;
content: "";
position: fixed;
left: 0;
right: 0;
z-index: -1;
}


.signup-body{
position: relative;
overflow: auto;
height: 900px;
} 

.signup-body::before{
/* background-image: url('../../img/plantilla/tc.png'); */
background-color:  var(--color2-visa);
background-size: cover; 
background-repeat: no-repeat;
background-position: top;
padding-top: 10%;
overflow-y: scroll;
width: 100%;
height: 100%;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
display: block;
content: "";
position: fixed;
left: 0;
right: 0;
z-index: -1;
}

.login-body{
position: relative;
overflow: auto;
}


.login-body::before{
/* background-image: url('../../img/plantilla/tc.png'); */
background-color: var(--color2-visa);
background-size: cover; 
background-repeat: no-repeat;
background-position: center;
padding-top: 10%;
overflow-y: scroll;
width: 100%;
height: 100%;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
display: block;
content: "";
position: fixed;
left: 0;
right: 0;
z-index: -1;
}

.form-body{
margin-top: 20%;
}

/*XS*/
@media all and (min-width:280px) and (max-width:360px){
.form-body{
  margin-top: 5%;
}
.content{
  margin-bottom: 25%!important;
}
}
/*S*/
@media all and (min-width: 361px) and (max-width:575px){
.form-body{
  margin-top: 25%;
}
.content{
  margin-bottom: 25%!important;
}

}

/*Md*/
@media all and (min-width: 576px) and (max-width:919px){
.form-body{
  margin-top: 15%;
}
.content{
  margin-bottom: 10%!important;
}

}

/*Lg*/
@media all and (min-width:920px){
.form-body{
  margin-top: 15%;
}
}

.card-forms{
border-radius: 20px !important;
}

.trInactivo{
background-color: rgba(218, 20, 9, 0.45)!important;
color: #6b0404;
}



.content{
margin-bottom: 15%;
}

.swal-text-c{
min-width: 400px!important;
min-height: 70px!important;
}

/**Clases css para el drag and sort**/

.li-sort {
margin: 5px 0;
padding: 0 20px;
height: 40px;
line-height: 40px;
border-radius: 3px;
background-color: var(--color1-visa);
color: #fff;
list-style: none;
-webkit-user-select: none; /* Safari */
-ms-user-select: none; /* IE 10 and IE 11 */
user-select: none;
}

.li-sort.drag-sort-active {
background: transparent;
color: transparent;
border: 1px solid #4ca1af;
}

span.drag-sort-active {
background: transparent;
color: transparent;
}

.li-sort:hover{
background-color: var(--color2-visa);
cursor: move;
}

.etapasTramite{
justify-content: center;
padding: 2%;
background-color: #E8E9EC;
}


.ui-autocomplete {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
display: none;
float: left;
min-width: 160px;
padding: 5px 0;
margin: 2px 0 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: #ffffff;
border: 1px solid #cccccc;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
background-clip: padding-box;
}

.ui-autocomplete > li > div {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.42857143;
color: #333333;
white-space: nowrap;
}

mark{
  color : #6b0404 !important;
  font-weight: 800;
}


@media all and (max-height: 568px) and (max-width:450px){
  #modalVerPoliticas .modal-content {
    background: transparent;
    border: none;
    }
    
    #modalVerDocumentacion .modal-content {
    background: transparent;
    border: none;
    }
}


.txtForm{
  resize: none;
  overflow-y : scroll;
}

.lblRespuestas{
  font-size: 18px;
  color: var(--color2-visa)!important;
}
.lblEncabezado{
  font-size: 22px;
}

pre{
  font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
}