
body{
  font-family: "MontserratRegular";
  /*overflow: hidden;*/
}

@media(min-width: 1400px){
  body{
   overflow: hidden;
  }
}


@font-face {
  font-family: "CabritoSansRegular";
  src: url("../fonts/CabritoSans/CabritoSansRegular.eot"); /* IE9*/
  src: url("../fonts/CabritoSans/CabritoSansRegular.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/CabritoSans/CabritoSansRegular.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/CabritoSans/CabritoSansRegular.woff") format("woff"), /* chrome、firefox */
  url("../fonts/CabritoSans/CabritoSansRegular.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/CabritoSans/CabritoSansRegular.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}


@font-face {
  font-family: "CabritoSansNormalMedio";
  src: url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.eot"); /* IE9*/
  src: url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.woff") format("woff"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/CabritoSansNormalMedio/CabritoSansNormalMedio.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}


@font-face {
  font-family: "CabritoSansNormalExtrabold";
  src: url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.eot"); /* IE9*/
  src: url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.woff") format("woff"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/CabritoSansNormalExtrabold/CabritoSansNormalExtrabold.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}


@font-face {
  font-family: "CabritoSansNormalBold";
  src: url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.eot"); /* IE9*/
  src: url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.woff") format("woff"), /* chrome、firefox */
  url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/CabritoSansNormalBold/CabritoSansNormalBold.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}

@font-face {
  font-family: "MontserratBlack";
  src: url("../fonts/MontserratBlack.eot"); /* IE9*/
  src: url("../fonts/MontserratBlack.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/MontserratBlack.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/MontserratBlack.woff") format("woff"), /* chrome、firefox */
  url("../fonts/MontserratBlack.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/MontserratBlack.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}

@font-face {
  font-family: "MontserratExtraBold";
  src: url("../fonts/MontserratExtraBold.eot"); /* IE9*/
  src: url("../fonts/MontserratExtraBold.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/MontserratExtraBold.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/MontserratExtraBold.woff") format("woff"), /* chrome、firefox */
  url("../fonts/MontserratExtraBold.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/MontserratExtraBold.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}

@font-face {
  font-family: "MontserratRegular";
  src: url("../fonts/MontserratRegular.eot"); /* IE9*/
  src: url("../fonts/MontserratRegular.eot?#iefix") format("rembedded-opentype"), /* IE6-IE8 */
  url("../fonts/MontserratRegular.woff2") format("woff2"), /* chrome、firefox */
  url("../fonts/MontserratRegular.woff") format("woff"), /* chrome、firefox */
  url("../fonts/MontserratRegular.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
  url("../fonts/MontserratRegular.svg#Norma Cabrito Sans W01 Regular") format("svg"); /* iOS 4.1- */
}



h1,h2,.h1{
  color: #1D70B7;
  font-family: "MontserratExtraBold";
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: #fff;
   font-family: "MontserratExtraBold";
}
/* Media Querys */
@media(min-width: 576px){
    html{
        font-size: 15px;
    }
}
@media(min-width: 768px){
    html{
        font-size: 16px;
    }
}

/***************************HEADER***********************************/
header {
    position: fixed;
    top: 0;
    z-index: 9;
}

.circulo_logo {
  background: #fff;
  height: 179px;
  width: 167px;
  position: absolute;
  z-index: 1;
  left: -30px;
  top: -112px;
}

.cabecera{
  position: absolute;
  z-index: 4;
  width: 100%;
}

.cabecera__link{
  z-index: 2;
  position: absolute;
  width: 84px;
  top: 7px;
}


@media(min-width: 576px){
  .cabecera__link {
    z-index: 2;
    position: absolute;
    width: 111px;
    top: 12px;
  }

  .circulo_logo {
    height: 200px;
    width: 200px;
    position: absolute;
    z-index: 1;
    left: -30px;
    top: -112px;
  }
}



@media (min-width: 992px){

.circulo_logo {
  height: 270px;
  width: 270px;
  position: absolute;
  z-index: 1;
  left: -30px;
  top: -150px;
}

.cabecera__link {
  z-index: 2;
  position: absolute;
  width: 157px;
  top: 15px;
}

}
.cabecera__volver{
  margin-top: -4rem;
}

.cabecera__volver a{
    color:#fff !important;
}
/***************************VIDEO***********************************/
 
.video__container {
  background-color: #000;
  position: relative;
  /*overflow: hidden;*/
  /*height: 100vh;*/
  height:   100%;
  background-image: url('../img/fondo.jpg');
  background-position: center center;
  object-fit: cover;
  background-repeat: no-repeat;
  background-size: cover;
}


@media(min-width:  992px){
  .formulario__container {
    height:   100vh;
    margin-top: 0 !important ;
    margin-bottom: 0 !important ;
  }
}  

#myVideo {
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: black;
  background-position: center center;
  background-size: contain;
  object-fit: cover;
  position: fixed;
}

.formulario__container{
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  /*height:100%;*/
  top: 0;
  width: 100%;
  z-index: 3;
  /*height: inherit;*/
  margin-top: 25%;
  margin-bottom: 25%;
  /*padding-top: 25%;
  padding-bottom: 25%;*/
}

@media(min-width:  576px){
  .formulario__container{
    margin-top: 18%;
  }
}

@media(min-width:  768px){
  .formulario__container{
    margin-top: 10%;
  }
}

.formulario__cabecera{
  text-align: center;
  padding:1rem 1rem;
  background: rgba(53, 165, 223, 1.0);
  background: -webkit-linear-gradient(left, rgba(53, 165, 223, 1.0) 35%, rgba(135, 181, 53, 1.0));
  background: -moz-linear-gradient(left, rgba(53, 165, 223, 1.0) 35%, rgba(135, 181, 53, 1.0));
  background: linear-gradient(to right, rgba(53, 165, 223, 1.0) 35%, rgba(135, 181, 53, 1.0));
  color: #fff;
  border-radius: 50px 50px  0 0;
  width: 100%;
}

.contenido{
    position: relative;
    width: 100%;
    /*min-height: 300px;*/
    /*margin: 0 25px;*/
    border-radius: 50px;
    background-color: #ffff;
    color: #403d3d !important;
    margin-bottom: 15%;
}



.formulario__contenido{
  background-color: #ffff;
  padding: 3rem;
  width: 100%;
  border-radius: 50px;
}

@media(min-width:  992px){
  .formulario__container form{
    min-height: 500px;
    margin-bottom: 0;
  }
}
/*
@media(min-height:  560px){
  .formulario__container form{
    width: 600px;
  }
}
*/

.contenido{
  padding:2rem 4rem;
  padding: 2rem 4rem;
  /*background-color: #1272b0;*/
  /*color: #fff;*/
  border-radius:50px;
  /*height: 320px;*/
  width:100%;
  font-size: 1.1rem;
  text-align: center;
  height: 100%;
}

.contenido {
   padding: 3rem 3rem;
}


@media(max-width: 768px){
  .contenido {
    padding: 3rem 2rem;
  }
}


@media(max-width: 360px){
  .formulario__cabecera{
     padding:1rem 1rem;
  }
}



.form-control--custom{
  border-radius: .8rem;
  height: 3rem !important;
  font-size: 1rem;
  font-style: italic;
  border-color: #03a9f4;
}

.form-group {
    margin-bottom: 1.5rem;
}

.label--custom{
  margin-bottom: 0.5rem;
}

/***************************FORMULARIO***********************************/
/*
.h5{
  font-family: "CabritoSansNormalMedio";
  font-size: 1.4rem;
}

.h3{
  font-family: "CabritoSansNormalExtrabold";
  font-size: 2rem;
}*/

@media(max-width: 360px){
  .h3{
    font-size: 1.7rem;
  }
}

.custom-radio--energia{
  background: rgba(244, 173, 30, 1.0);
  background: -webkit-linear-gradient(left, rgba(244, 173, 30, 1.0), rgba(225, 117, 45, 1.0));
  background: -moz-linear-gradient(left, rgba(244, 173, 30, 1.0), rgba(225, 117, 45, 1.0));
  background: linear-gradient(to right, rgba(244, 173, 30, 1.0), rgba(225, 117, 45, 1.0));
}

.custom-radio--agua{
  background: rgba(77, 203, 247, 1.0);
  background: -webkit-linear-gradient(left, rgba(77, 203, 247, 1.0), rgba(9, 159, 227, 1.0));
  background: -moz-linear-gradient(left, rgba(77, 203, 247, 1.0), rgba(9, 159, 227, 1.0));
  background: linear-gradient(to right, rgba(77, 203, 247, 1.0), rgba(9, 159, 227, 1.0));
}

.boton__ir{
  background: rgba(130, 178, 61, 1.0);
  background: -webkit-linear-gradient(left, rgba(130, 178, 61, 1.0), rgba(18, 129, 186, 1.0));  
  background: -moz-linear-gradient(left, rgba(130, 178, 61, 1.0), rgba(18, 129, 186, 1.0));
  background: linear-gradient(to right, rgba(130, 178, 61, 1.0), rgba(18, 129, 186, 1.0));

  padding: 0.8rem;
  font-size: 1.2rem;
  width:250px;
  /*position: absolute;*/
  position: relative;
  border-color: transparent;
  bottom: -24px;
  font-size: 1.5rem;
  border-radius: 1.3rem;
  padding-right: 3rem;
 border-right: 1px solid #1d7fb0;
}


.custom-radio--detalle{
  padding: 0.8rem;
  padding-left: 2.6rem;
  border-radius: 1rem;
}  

.custom-radio--detalle .custom-control-label::before {
    position: absolute;
    top: 0.3rem;
    left: -1.5rem;
}    

.custom-radio--detalle .custom-control-label::after {
    position: absolute;
    top: 0.3rem;
    left: -1.5rem;
}



.boton__irIcono{
    background-image: url(../img/flecha.png);
    background-repeat: no-repeat;
    background-position: 180px center;
    background-size: 19px;
    display: flex;
    align-items: center;
    width: 253px;
    height: 100%;
    border: 1px solid rgba(9, 113, 163, 1);
    border-radius: 3px;
    position: relative;
    top: 0;
}

button img{
  right: 3rem;
  position: absolute;
  top: 1.5rem;
}
.boton__irIconoinput {
  width: 100%;
  font-size: 0.9rem;
  border: none;
}
.boton__irIconoinput:focus {
  outline: none;
}

.error{
  color: #f90101;
  font-size:0.9rem;
  font-family: 'MontserratExtraBold';
}  

.container__botonIr{
  position: absolute;
  height: 74px;
  bottom: -0.5rem;
  left: 0;
  right: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.velo{
  background-color: #233241;
  position: absolute;
  height: 100vh;
  width: 100%;
  z-index: 2;
  top: 0;
  opacity: 0.4;
}

@media(max-width: 480px){

  .formulario__cabecera {
    padding: 1.2rem;
  }  


  .formulario__contenido {
    padding: 1.2rem;
    /*height: 280px;*/
    font-size: 1rem;
  }

  .h3 {
    font-size: 1.3rem;
  }

  .h5{
    font-size: 1rem;
  }

  .form-control--custom {
    height: 2.5rem !important;
   }

   .form-group {
    margin-bottom: 1.5rem;
   }

   .label--custom {
    margin-bottom: 1rem;
  }

  .custom-radio--detalle {
    padding-left: 2rem;
    padding-top: 0.8rem;
    padding-bottom: 0.4rem;
    border-radius: 1rem;
  }

  .custom-control-label {
    font-size: 0.84rem;
  }

  .custom-radio--detalle .custom-control-label::before {
    top: 0.1rem;
  }    

  .custom-radio--detalle .custom-control-label::after {
    top: 0.1rem;
  }

  .cabecera__volver a {
    font-size: 0.8rem;
  }

  button img {
    top: 1.2rem;
   }

}


.fb_iframe_widget {
  top: -1.5rem !important;
  z-index: 999;
}  


.formulario__inputContainer{
  position: relative;
}
#btnProcesar{
    position: absolute;
    top: 0;
    border-radius: 5px;
    right: 2px;
    z-index: 2;
    border: none;
    top: 7px;
    height: 31px;
    cursor: pointer;
    color: white;
    background-color: transparent;
    background-image: url(../img/icon-flecha-celeste.png);
    /* background-size: contain; */
    width: 31px;
    cursor: pointer;
}

.textoPequeño{
  line-height: 1rem;
}

.estado__container{
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}
.estado__Circulo{
  height: 20px;
  width:20px;
  background-color: #afa9a9;
  border-radius: 10px;
}
.estado__Circulo--activo{
  background-color: #03a9f4;
}

.text-gris{
  color:#857f7f;
}
.text-verde{
  color:#67c71f;
}
.text-celeste{
  color:#03a9f4;
  font-size: 4rem;
}
.textoPresentacion{
  font-size: 0.8rem;
}
.mensajeStylo{
  color:red;
  font-size: 0.9rem;
  font-weight: bolder;
}

.textoSimulador{
  color:#fff;
}

  .textoSimulador__medio{
    font-size:1.5rem;
  }
  .textoSimulador__grande{
    font-size: 1.8rem;
    line-height: 2rem;
  }
  .textoSimulador__normal{
    font-size: 0.9rem;
    line-height: 1.1rem;
  }
  
@media(min-width:  576px){
.textoSimulador__medio{
  font-size:2rem;
}
.textoSimulador__grande{
  font-size:3.5rem;
  line-height: 3rem;
}
.textoSimulador__normal{
  font-size: 1.4rem;
}
.textoPresentacion{
  font-size: 1.1rem;
}
.textoSimulador__grande{
    font-size: 2.2rem;
  }
}

@media(min-width:  768px){
.textoSimulador__medio{
  font-size:2rem;
}
.textoSimulador__grande{
  font-size:4.2rem;
  line-height: 4rem;
}
.textoSimulador__normal{
  font-size: 1.2rem;
  line-height: 1.4rem;
}
}


.boton{
  background-color: grey;
  color: #fff;
  font-size: 1.2rem;
  padding: 1rem 2rem;
  border-radius: 1rem;
  font-family: 'MontserratExtraBold';
  display: block;
}
.boton:hover{
  background-color: #fff;
  border: 2px solid grey;
}

@media(min-width:  560px){
.boton{
   font-size: 1.7rem;
 }
}  

.boton--celeste{
   background-color: #03a9f4;
}
.boton--celeste:hover{
  background-color: #fff;
  border: 2px solid #03a9f4;
  color:#03a9f4;
}

.boton--verde{
   background-color: #6ec90a;
}
.boton--verde:hover{
  background-color: #fff;
  border: 2px solid #6ec90a;
}
.boton--plomo{
  background-color: #CCCCCC;
  border: 2px solid #CCCCCC;
}
.boton--transparente{
  background-color: transparent;
  border: 2px solid #fff;
}
.boton--transparente:hover{
  background-color: grey;
  border: 2px solid #fff;
  color:#fff;
  text-decoration: none;
}
.boton--input{
  border:0;
}

.boton--letrachica{
  font-size:1.3rem;
  
}

.verde{
  color: #6ec90a;
  font-weight: bolder;
}

.textoConceptos{
  font-size:0.8rem;
  text-align: center;
}
.calculo{
  font-size:1.6rem;
  color:#8CC63F;
  text-align: center;
  font-family: 'MontserratExtraBold';
}
.calculoPrincipal{
  font-size: 3.5rem;
  color: #8CC63F;
  font-weight: bolder;
  font-family: 'MontserratBlack';
}

@media(min-width:  580px){
   .textoConceptos,.conceptos, .calculo{
     text-align: left;
   }

} 


.iconoConcepto{
  width:80px;
}
.paso{
  position: relative;
  height: 100%;
}
.ocultar{
  display: none;
}

.fases{
  height: fit-content !important;
}

.subtitulo{
  font-size:1.4rem;
  font-family: 'MontserratRegular';
  color:#666666;
}

.contenidoPasos{
  background-color: #fff;
  border-radius: 50px;
  width: 100%;
  padding: 1.2rem;
}

@media(min-width:  992px){
.fases{
  height: 80% !important;
}
.contenidoPasos{
  padding: 3rem;
}
}

.iconoFlecha{
  width:30px;
}
.paso1__texto{
  font-size:1.2rem;
}

@media(min-width:  560px){
 .paso1__texto{
  font-size:1.5rem;
}

.contenidoPasos{
  padding: 2rem;
}
} 


@media (min-width: 1400px){
  .container {
      max-width: 1300px;
  }
}
/* JAVIER YAMASHITA */
html, body { height:100%; }
.fases { display:none !important; }

#paso1 .form-group { position:relative; }
#paso1 label { position:absolute; left:0; top:0; text-align:left; font-size:1.3rem; font-family:"CabritoSansNormalBold"; line-height:1.2; color:#00c5ff; }

.mapa { width:85%; margin:0 auto; }

.mapa svg { max-width:100% !important; height:auto; display:block; }
.mapa path { fill:#cccccc; stroke:rgba(255,255,255,1); stroke-width:2; stroke-linecap:square; -moz-transition:0.3s; -o-transition:0.3s; -webkit-transition:0.3s; transition:0.3s; }
.mapa path:hover, .mapa .region-selected { fill:#8cc63f; }

.modal { text-align:center; z-index:9999; }
.modal-dialog { width:auto !important; max-width:100%; text-align:left; }
.mapa-dialog .region { fill:#e6e6e6; }
.mapa-dialog .region:hover { fill:#ED9B33; }
.modal-backdrop.show { opacity:0; z-index:9998; }

#departamento .btn-close { position:absolute; right:-16px; top:-16px; width:32px; height:32px; display:flex; align-items:center; justify-content:center; font-family:"CabritoSansNormalMedio"; color:#FFF; background:#222; border-radius:50%; border:0px none; z-index:1; }
#departamento .modal-content { border-radius:.75rem; border-color:#8cc63f; }
#departamento .modal-dialog { max-width:240px; }
#departamento .modal-dialog h6 { text-transform:uppercase; color:#8cc63f; font-size:1.5rem; font-family:"CabritoSansNormalExtrabold"; }
#departamento .modal-dialog .elegir { display:flex; align-items:center; justify-content:space-between; font-size:.9rem; text-transform:uppercase; cursor:pointer; }
#departamento .modal-dialog .elegir i { width:0; height:0; border-style:solid; border-width: 8px 0 8px 16px; border-color:transparent transparent transparent #8bc63f; -moz-transition:0.3s; -o-transition:0.3s; -webkit-transition:0.3s; transition:0.3s; }
#departamento .modal-dialog .elegir:hover i { border-color:transparent transparent transparent #00c5ff; }

@media(max-width:575.98px){
  #paso1 label { font-size:1.1rem; }
  #departamento .modal-body { padding:.75rem; }
  #departamento .modal-dialog h6 { font-size:1.1rem; }
  #departamento .modal-dialog { max-width:160px; }
  #departamento .modal-content { transform:translateX(100%) !important; }
}
@media(min-width:  560px){
  .mapa{
    width: 70%;
    padding: 1rem 0;
  }
}