.home {
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.3), rgba(0, 204, 255, 0.2)),
      url('../img/twincities/home.png') no-repeat;
  height: 100vh;
  padding: 0;
  background-size: cover;
}
.home .gemelos_home {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.home .title {
  margin: 0;
}
.information {
  background: url('../img/background/digitaltwins_bg.png') center center / cover no-repeat fixed;
  padding-top: 50px;
  background-color: rgba(255, 255, 255, 1);
}
.text-1x {
  font-family: var(--default-bold-font);
  font-size: 40px;
  line-height: 150%;
  color: #AC5CFF;
}
.text-7x {
  font-family: var(--default-bold-font);
  font-size: 25px;
  line-height: 150%;
  color: #AC5CFF;
}
.text-5x {
  margin-top: 20px;
  font-weight: 700;
  font-size: 25px;
  line-height: 150%;
  color: #000D4F;
  font-family: var(--default-bold-font);
}
.text-2x {
  margin-top: 20px;
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  color: #000D4F;
}
.building_image {
  border-radius: 30px;
}
.pos_relative { position: relative; z-index: 3;}
.pos_relative .container { height: 146vh; }
.bg_ciudades_gemelas img {
  position: absolute;
  inset: 0;
  display: block;
  width: 110%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}
.text_custom {
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  color: #fff;
}
.section p.bolder {
  font-weight: 700;
  font-size: 25px;
  line-height: 150%;
  font-family: var(--default-bold-font);
}
.timeline-step {
  display: flex;
  align-items: center;
}
.step-circle {
  margin-top: 20px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  z-index: 2;
  position: relative;
  font-weight: 900;
  font-size: 40px;
  line-height: 150%;
  text-align: center;
}
.step-1 .step-circle { background-color: #2cd9d9; }
.step-2 .step-circle { background-color: #ad5bfd; }
.step-3 .step-circle { background-color: #2cf991; }
.dashed-line {
  margin-top: 20px;
  height: 2px;
  width: 70%;
  border-top: 2px dashed #666;
  z-index: 1;
}
.vertical-line {
  top: 60px;
  width: 2px;
  height: 80px;
  border-left: 2px dashed #666;
  z-index: 1;
}
.construir_section {
  font-weight: 500;
  font-size: 25px;
  line-height: 150%;
  color: #000D4F;
}
.construir_section .dashed {
    border-left: 2px dashed #000;
}
.box-footer {
  background-color: #fff;
  padding: 50px;
  border-radius: 45px;
}
.box_metodology {
  align-items: center;
}
.box_metodology .number {
  font-weight: 900;
  font-size: 96px;
  line-height: 100%;
  text-align: right;
}
.n1 { color: #4D60FF; }
.n2 { color: #00F88F; }
.n3 { color: #AC5CFF; }
.n4 { color: #00DBDA; }
.n5 { color: #000D4F; }
.box_metodology .bottom {
  padding-top: 150px;
}
.box_metodology .box_content_n1 {
  padding-right: 5px;
  border-right: 5px solid #4D60FF;
  height: 268px;
}
.box_metodology .box_content_n2 {
  padding-right: 5px;
  border-right: 5px solid #00F88F;
  height: 268px;
}
.box_metodology .box_content_n3 {
  padding-right: 5px;
  border-right: 5px solid #AC5CFF;
  height: 268px;
}
.box_metodology .box_content_n4 {
  padding-right: 5px;
  border-right: 5px solid #00DBDA;
  height: 268px;
}
.box_metodology .box_content_n5 {
  padding-right: 5px;
  border-right: 5px solid #000D4F;
  height: 268px;
}
.box_metodology .title {
  font-weight: 700;
  font-size: 20px;
  line-height: 150%;
  text-align: right;
  color: var(--button);
  margin: 0;
}
.box_metodology .text_content {
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  text-align: right;
  color: var(--button);
}
.bg_ciudadania {
  background: url('../img/twincities/background_bg.png') center center / cover no-repeat;
  padding-top: 50px;
  padding-bottom: 50px;
}
.building_bg img.building_image {
  width: 525px;
  border-radius: 30px;
  position: absolute;
  margin: 0 36%;
}
.text {
  font-weight: 700;
  font-size: 25px;
  line-height: 150%;
  text-align: center;
  color: #000D4F;
}
.footimg {
  width: 306.55px;
  margin: 0 auto;;
}
.footer_right_bg {
  position: absolute;
  width: 100%;
  margin: -190px;
}
.footer_right_bg img{
  width: 60vh;
  transform: scaleX(-1);
}
.dash-l {
  border-left: 2px dashed #000;
}
.dash-r {
  border-right: 2px dashed #000;
}
.timeline-step_sec {
  display: flex;
  align-items: center;
}

.timeline-step_sec .step-circle {
  margin-top: 30px;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  color: white;
  z-index: 2;
  position: relative;
  font-weight: 900;
  font-size: 40px;
  line-height: 150%;
  text-align: center;
}
.timeline-step-sec-text .text {
  margin-top: 20px;
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  text-align: center;
  vertical-align: middle;
}
.timeline-step_sec .dashed-line {
  margin-top: 30px;
  height: 2px;
  width: 100%;
  border-top: 2px dashed #000;
  z-index: 1;
}
.timeline-step_sec.step-1 .step-circle { background-color: #2581fd; }
.timeline-step_sec.step-3 .step-circle { background-color: #2acdcd }
.timeline-step_sec.step-4 .step-circle { background-color: #2acdcd }
.timeline-step_sec.step-5 .step-circle { background-color: #2cf991 }
.optimizacion { background: linear-gradient(0deg, #AC5CFF, #AC5CFF) !important; }
.residuos { background: linear-gradient(0deg, #00F88F, #00F88F) !important; }
.ambiental { background: linear-gradient(0deg, #4D60FF, #4D60FF) !important; }
.privada { background: linear-gradient(0deg, #00D0FF, #00D0FF) !important; }
.monitoreo { background: linear-gradient(0deg, #AC5CFF, #AC5CFF) !important; }
.inteligencia { background: linear-gradient(0deg, #00F88F, #00F88F) !important; }
.movilidad { background: linear-gradient(0deg, #4D60FF, #4D60FF) !important; }
.dashed_final {
	content: '';
    border-left: 2px dashed #000;
    position: relative;
    height: 45px;
    left: 0;
    top: 0;
}
.whatisfor_section {
  width: 100%;
  min-height: 120vh;
  position: relative;
  padding: 180px 0 40px 0;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.whatisfor img{
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.whatisfor_section .container_section {
  position: relative;
  z-index: 3;
}

.whatisfor_section .container_section .text{ 
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  color: #fff;
  position: absolute;
}

.whatisfor_section .container_section .text.txt-1 { 
  top: 275px;
  left: 330px;
  width: 173px;
  text-align: left;
}
.whatisfor_section .container_section .text.txt-2 { 
  top: -95px;
  left: 236px;
  width: 230px;
  text-align: left;
}
.whatisfor_section .container_section .text.txt-3 { 
  top: -225px;
  left: 646px;
  width: 270px;
  text-align: left;
}
.whatisfor_section .container_section .text.txt-4 { 
  top: 0px;
  left: 1220px;
  width: 245px;
  text-align: left;
}
.whatisfor_section .container_section .text.txt-5 { 
  top: 318px;
  left: 1310px;
  width: 173px;
  text-align: left;
}
.beneficios_opciones {
  width: 100%;
  min-height: 59vh;
  padding: 0;
  display: flex;
  align-items: center;
  overflow: hidden;
  margin-top: 10px;
}
.img-absolute {
  position: relative;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.txt_beneficios {
  font-weight: 500;
  font-size: 20px;
  line-height: 150%;
  position: absolute;
}
.beneficios_container_section {
  position: absolute  ;
  z-index: 3;
}
.txt-b-1 {
  top: -157px;
  left: -100px;
  width: 100%;
  text-align: center;
}
.txt-b-2 {
  top: 15px;
  left: -125px;
  width: 125px;
  text-align: center;
}
.txt-b-3 {
  top: -40px;
  left: 195px;
  width: 160px;
  text-align: center;
}
.txt-b-4 {
  top: 130px;
  left: 250px;
  width: 160px;
  text-align: center;
}
.txt-b-5 {
  top: -270px;
  left: 410px;
  width: 160px;
  text-align: center;
}
.txt-b-6 {
  top: 0px;
  left: 910px;
  width: 200px;
  text-align: center;
}
.txt-b-7 {
  top: 145px;
  left: 865px;
  width: 217px;
  text-align: center;
}
.txt-b-8 {
  top: -255px;
  left: 1020px;
  width: 180px;
  text-align: center;
}
.txt-b-9 {
  top: 0px;
  left: 1205px;
  width: 140px;
  text-align: center;
}
.txt-b-10 {
  top: -130px;
  left: 777px;
  width: 180px;
  text-align: center;
}