@font-face {
    font-family: 'SF Compact Display';
    src: url('../fonts/sf-compact-display-medium-5864711817c30.otf');
  } 



  body {
    
    background-color: white;
  }
  .backgroundBody {
    background: white;
    overflow-y: scroll;
  }


 .tituloFindPolar{
     display: flex;
     width: 100%;
     justify-content: flex-start;
  text-align: flex-start;
font-family: var(--fontFamily) ;
font-style: normal;
font-weight: bold;
font-size: 130px;
line-height: 145px;
color: black;
letter-spacing: 1px;
height: 8rem;
margin-bottom: 1rem;
} 
.subtituloFindPolar{
    display: flex;
     width: 100%;
     justify-content: flex-start;
  text-align: flex-start;
font-family: var(--fontFamily) ;
font-style: normal;
font-weight: 900;
font-size: 2.5rem;
line-height: 3rem;
color: black;
letter-spacing: 1px;
margin-bottom: 0;

}

.subtitulo2FindPolar{
    display: flex;
    width: 100%;
    justify-content: flex-start;
 text-align: flex-start;
font-family: var(--fontFamily) ;
font-style: normal;
font-weight: 900;
font-size: 2.5rem;
line-height: 3rem;
color: #007BC6;
letter-spacing: 1px;
margin-top: 0;
}
 

  .Pro{
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: flex-start;
 text-align: center;
font-family: var(--fontFamily) !important;
font-style: normal;
font-weight: bold;
font-size: 64px;
line-height: 239px;
color: black;


  }

.contenedor {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  
  .contenedor img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .contenedor50 {
    width: 100%;
    height: 50%;
    overflow: hidden;
  }
  
  .contenedor50 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem;
  }


.containerCards{
    margin: auto;
    padding: 2rem;
    justify-content: center;
    align-items: center; 
}
  .textoPotenciado{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1.8rem;
    text-align: center;
    width: 55%;
    color: #86868B;
    margin: auto;
    margin-top:3rem
  }
  .textoMaintenanceModule{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    width: 55%;
    color: #86868B;
    margin: auto;
    margin-top:3rem
  }
  .textoh3Tecno{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 80px;
    line-height: 82px;
    text-align: left;
    width: 95%;
    color: black;
    
  }
  .textoTecno{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    text-align: left;
    width: 55%;
    color: #86868B;
    
  }
  .textoMarketingPlan{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 1rem;
    line-height: 1.2rem;
    text-align: start;
    width: 97%;
    color: #86868B;
  }
  .textoFuncionalidades{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 22px;
    text-align: start;
    width: 97%;
    color: #86868B;
  }
  .tituloFuncionalidades{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 22px;
    text-align: start;
    width: 97%;
    color: black;
  }

  .textoPensando{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    text-align: start;
    width: 97%;
    color: #86868B;
  }
  .tituloPensando{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    text-align: start;
    width: 97%;
    color: black;
  }
  .innovacionResultados{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    text-align: center;
    background-color: #F5F5F7;
    width: 100%;
    height: 100%;
    border-radius: 1rem;
    margin: auto;
    
  }
  .innovacionResultadosSpan{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    line-height: 22px;
    width: 100%;
    color: #86868B;
    margin: auto;
  }
  .tituloCotizacion{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 2.2rem;
    line-height: 2.4rem;
    text-align: center;
    width: 80%;
    color: black;
    margin: auto;
    margin-top: 1rem;
  }
  .parrafoCotizacion{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 457;
    font-size: 1.1rem;
    line-height: 1.3rem;
    text-align: center;
    letter-spacing: -0.01em;
    width: 70%;
    margin: auto;
    color: #1D1D1F;
    margin-top: 1rem;
    
  }
.sizeImgTecno{
    width: 8rem;
    
}

.textoBateriaIzquierdo{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 20px;
    text-align: start;
    width: 60%;
    color: #86868B;
    display: flex;
    justify-content: start;
    padding-left: 1rem;
}

.colorItemLista{
    color: #007BC6;
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 13px;
line-height: 16px;
margin-bottom: 0.5rem;
}
.colorItemListaMiMunicipio{
    color: #ffffff ;
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 13px;
line-height: 16px;
margin-bottom: 0.5rem;
}
.colorPrecioMes{
    color: #007BC6;
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 1.3rem;
line-height: 1.5rem;
margin-bottom: 0.5rem;
text-align: center;
}
  .divTextoPotenciado{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
  }
 .boxFeatures{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;    
 } 
 
  
  .divTextoPotenciado2{
    display: flex;
   justify-content: center;
   align-items: center;
 }
 .cardMarketing{
    padding: 2rem 1rem 1.5rem;
    margin: 1rem;
      border-radius: 1rem;
       
       width: 25rem;
       height: 27rem;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       background-color: #F5F5F7;
       overflow: hidden;
  }

  .cardChatSecure{
    padding: 58px 30px 0px 24px;
    margin: 1rem;
      border-radius: 1rem;
       max-width: 90%;
       height: 20rem;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       background-color: #F5F5F7;
       overflow: hidden;
  }
 .cardPolar{
    padding: 58px 30px 0px 24px;
    margin: 1rem;
      border-radius: 1rem;
       width: auto;
       height: 35rem;
       display: flex;
       flex-direction: column;
       justify-content: center;
       align-items: center;
       background-color: #F5F5F7;
       overflow: hidden;
  }
  .cardPolarH3{
    background: #2F2F34;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
      display:flex;
      justify-content: center;
        align-items: center;
        text-align: center;
        font-size: 28px;
  line-height: 1.1428571429;
  font-weight: 600;
  letter-spacing: .007em;
  font-family: var(--fontFamily);
  }
 
  
  .cardPolarP{
    color: #2F2F34;
      /* color: #007BC6; */
      letter-spacing: inherit;
      display:flex;
      justify-content: start;
      align-items: center;
      flex-direction: column;
      width: 100%;
      font-size: 17px;
      text-align: center;
      line-height: 1.235;
      font-weight: 400;
      font-family: var(--fontFamily);
      margin: auto;
  }
  .iconMaintenance{
    width: 3rem;
    margin-bottom: 1rem;
    background: var(--principalGradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }


.elMejorDelMercado{
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 0.8rem;
line-height: 1rem;
text-align: center;
color: black;
border: 1px solid black;
padding: 10px 30px;
border-radius: 25px;
}

.funcionalidadesDiv{
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 10px;
line-height: 12px;
text-align: center;
color: black;
border: 2px solid black;
padding: 10px 30px;
border-radius: 25px;
}
.cotizacion{
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 10px;
line-height: 12px;
text-align: center;
color: black;
border: 2px solid black;
padding: 10px 30px;
border-radius: 25px;
width: 30%;
justify-content: center;
align-items: center;
margin: auto;
}

.productoDistinto{
    font-family: var(--fontFamily);
font-style: normal;
font-weight: 600;
font-size: 20px;
line-height: 48px;
color: black;
}

.tanFind{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 4rem;
    line-height: 4.1rem;
    background: linear-gradient(270deg, #3D71FF 50%, #60CAFC 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
    display: flex;
}

.tanFind2{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 5rem;
    line-height: 5.1rem;
    background: #007BC6;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
    display: flex;
    justify-content: center;
}
.modernoSimplePolar{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 5rem;
    line-height: 5.1rem;
    background: #007BC6;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
    display: flex;
    justify-content: center;
}

.maintenanceModule{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 5rem;
    line-height: 5.1rem;
    background: #007BC6;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
    display: flex;
}
.tanPro{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 5rem;
    line-height: 5.1rem;
    color: black;
    display: flex;
    justify-content: center;
    
}
.modernoSimple{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 900;
    font-size: 5rem;
    line-height: 5.1rem;
    background: black;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-fill-color: transparent;
    display: flex;
    justify-content: center;
}


.imgNotebookConTitulos{
    margin: auto;
    width: 100%;
}

.imgMapa{
    object-fit: cover;
    width:100%;
    height:100%;
}

.imgNotebookFuncionalidades{
    object-fit: cover;
   width: 40rem;
    
}


.container1{
    position: relative;
	text-align: center;
}

.bottom-left{
    position: absolute;
			bottom: 0;
			width: 100%;
           padding: 5rem;
            color: black;
            text-align: left;
            font-family: var(--fontFamily);
            font-style: normal;
            font-weight: bold;
            font-size: 19px;
            line-height: 22px;
           
}



.ubicacionImgSection5FindMaintenance{
    left: 2rem;
    bottom:2rem;
}
.ubicacionImgSection6FindMaintenance{
    top: 3rem;
}
.ubicacionImgSection7FindMaintenance{
    left: 7rem;
    bottom:2rem;
}
.ubicacionImgThinking{
    left: 9rem;
    bottom:3rem;
}
.sizeImgSection5FindMaintenance{
    width: 30rem;
}
.sizeImgSection6FindMaintenance{
    width: 35rem;
}
.sizeImgSection7FindMaintenance{
    width: 30rem;
}
.sizeImgThinking{
    width: 30rem;
}


.ubicacionImgFuncionalidad3{
    left: 4.2rem;
    bottom:9rem;
}
.sizeImgFuncionalidad3{
    width: 40rem;
}
.ubicacionImgCotizacion{
   right: 10rem;
}
.sizeImgCotizacion{
    width: 49rem;
}


.ubicacionImgPortada{
    right: 14rem;
    bottom:14rem;
}
.ubicacionImgPortadaFindMaintenance{
    right: 14rem;
    bottom:2rem;
    
}

.sizeImgPortada{
    width: 53rem;
}

.sizeImgPortadaFindMaintenance{
    width: 53rem;
}
.ubicacionImgPensando{
    right: 9rem;
    bottom:5rem;
}
.sizeImgPensando{
    width: 50rem;
}
.containerCustomer{
    margin-top: 7rem;
}
.imgTecnos{
    background-color: white;
     display: flex;
    justify-content:space-between; 
    align-items: center;
    margin-top: 3rem;
}
.fontCustomer{

font-family: var(--fontFamily);
font-style: normal;
font-weight: medium;
font-size: 32px;
line-height: 37px;
margin:0px;
text-align: center;
color: #007BC6;
}
.containerCostoMantenimiento{
    margin-top: 7rem;
     background-color: #F5F5F7;
      border-radius: 1rem;
      height: 35rem;
}
.subconteinerCostoMantenimiento{
    padding-right: 3rem;
     margin-top: 5rem
}
.CustomerRelationshipMobile{
height: 70vh; 
display:flex
}

.mobileColumn{
    height: auto!important;
}
.sectionMaintenance{
    height: 50vh;
    justify-content: center;
    margin-top: 6rem;
    
}
.thinkingAbout{
    height: 75vh;
    justify-content: center;
}
.visibilityClient{
    height: 50vh;
    justify-content: center;
}
.sectionSpareParts{
    height: 75vh;
    display:flex; 
    justify-content: center; 
    margin-top: 10rem;
}
.technologiesWeUse{
    font-family: 'SF Compact Display';
    font-style: normal;
	font-weight: medium;
	font-size: 32px;
	line-height: 37px;
	margin:0px;
	text-align: left;
	color: #007BC6;
}
.heightImgGroupMaintenance{
    height: 80vh; 
    /* margin: auto; */
    display: flex;
    width: 99%;
}
.widthGeneral{
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    }

    .findMaintenance{
        margin-top: 14rem;
        padding-left: 12rem;
    }

    .modernoSimpleFindMaintenance{
        display: flex;
        width: 100%;
        justify-content: center;
     text-align: center;
    font-family: var(--fontFamily) !important;
    font-style: var(--fontStyle);
    font-weight: var(--fontWeight);
    font-size: 64px;
    color: black;
    margin-top: 8rem;
    margin-bottom: 0rem;
      }
    
    @media (min-width:1500px) {
        .widthGeneral{
            width: 70%;
            margin-left: auto;
            margin-right: auto;
            }
            
    }
    @media (max-width:1300px) {
        .tituloFindPolar{
            font-size: 4rem;
        }
    }



@media (max-width: 500px) {
    .modernoSimpleFindMaintenance{
        font-size: 3rem;
        line-height: 3.1rem;
    }
    .findMaintenance{
        padding-left: 5rem!important;
        margin-top: 14rem !important;
    }
    .heightImgGroupMaintenance{
        height: auto; 
    }
    .CustomerRelationshipMobile{
        height: 100vh !important; 
    }
   
    .tituloFindPolar{
        font-size: 4rem;
    }
    .sectionSpareParts{
        flex-direction: column;
        height: auto!important;
        margin-top: 0;
    }
    .sectionMaintenance{
        flex-direction: column;
        height: 75vh!important;
    }
    .visibilityClient{
        height: 75vh;
        justify-content: center;
    }
    .elMejorDelMercado{
        font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 600;
    font-size: 0.7rem;
    line-height: 0.8rem;
    text-align: center;
    color: black;
    border: 1px solid black;
    padding: 10px 30px;
    border-radius: 25px;
    }
    .subtituloFindPolar{
        display: flex;
         width: 100%;
         justify-content: flex-start;
      text-align: flex-start;
    font-family: var(--fontFamily) ;
    font-style: normal;
    font-weight: 900;
    font-size: 1.125rem;
    line-height: 1.5rem;
    color: black;
    letter-spacing: 1px;
    margin-bottom: 0;
    }
    .subtitulo2FindPolar{
        display: flex;
        width: 100%;
        justify-content: flex-start;
     text-align: flex-start;
    font-family: var(--fontFamily) ;
    font-style: normal;
    font-weight: 900;
    font-size: 1.125rem;
    line-height: 1.5rem;
    color: #007BC6;
    letter-spacing: 1px;
    margin-top: 0;
    }
    .findPolarMobile{
        padding-left: 2rem!important;
        margin-top: 6rem !important;
    }
    .ubicacionImgPortada{
        right: 10rem;
        bottom:28rem;
    }
    .ubicacionImgPortadaFindMaintenance{
        right: 1rem;
        bottom: 5rem;
    }
    
    .sizeImgPortada{
        width: 43rem;
    }
    .sizeImgPortadaSecureChat{
        width: 40rem;
    }
    .sizeImgPortadaFindMaintenance{
        width: 30rem;
    }
    .tanPro{
        font-size: 3rem;
        line-height: 3.1rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .tanFind2{
        font-size: 3rem;
        line-height: 3.1rem;
        justify-content: flex-start;
    }
    .modernoSimplePolar{
        font-size: 3rem;
        line-height: 3.1rem;
        justify-content: center;
        margin-left: 1rem;
    }
    .textoPotenciado{
        width: 90%;
    }
    .containerCards{
        display: block;
    margin: 0!important;        
    padding: 0!important;  
    }
    .pensandoEnElCliente{
        font-family: var(--fontFamily);
    font-style: normal;
    font-weight: 600;
    font-size: 10px;
    line-height: 12px;
    text-align: center;
    color: black;
    border: 2px solid black;
    padding: 10px 30px;
    border-radius: 25px;
    }
    
    .cardMarketing{
        width: auto;
        margin: 2rem;
    }
    .containerCustomer{
        width: auto;
        
    }
    .maintenanceModule{
        font-size: 2.3rem;
        margin: auto;
    }
    .fontCustomer{
        font-size: 1.2rem;
    }
    .textoMaintenanceModule{
        width: 85%;
    }
   .tituloFuncionalidades{
       justify-content: left;
       font-size: 1rem;
       
   }
   .textoMarketingPlan{
       font-size: 1rem;
   }
   .textoFuncionalidades{
       font-size: 1rem;
   }
   
   .funcionalidadesMobile{
    margin-left: 1rem!important;    
    margin-top: 3rem!important;   
    flex-direction: column;
    
}   

.sectionPensandoMobile{
    height: 80vh!important;
}

.visibilidadClienteMobile{
    padding-left: 7rem!important; 
    
}   
.pensandoMobileDiv{
    margin-left: 0!important;
}

.ubicacionImgSection5FindMaintenance{
    left: 2rem;
    top: 1rem;  
}
.ubicacionImgSection6FindMaintenance{
    left: 2rem;
    top: 1rem;  
}
.ubicacionImgSection7FindMaintenance{
    left: 1rem;
    top: 1rem;
    
}
.ubicacionImgThinking{
    left: 8rem;
    bottom:12rem;
}
.sizeImgSection5FindMaintenance{
    width: 18rem;
    margin: 0 auto !important;
}
.sizeImgSection6FindMaintenance{
    width: 18rem;
}
.sizeImgSection7FindMaintenance{
    width: 18rem;
}
.sizeImgThinking{
    width: 18rem;
}


.ubicacionImgFuncionalidad3{
    right: 1rem;
    top:1rem;
}
.sizeImgFuncionalidad3{
    width: 23rem;
}
.ubicacionImgPensando{
    left: 2rem;
    bottom:12.5rem;
}
.sizeImgPensando{
    width: 25rem;
}
.sectionHidden{
    display: none;
}
.textoh3Tecno{
    padding-top: 1rem;
    font-weight: 900;
    font-size: 35px;
    line-height: 38px;
    text-align: left;
    width: 100%;
    color: black;
}
.textoTecno{
    font-family: var(--fontFamily);
    font-style: normal;
    font-weight: bold;
    font-size: 18px;
    line-height: 24px;
    text-align: left;
    width: 100%;
    color: #86868B;
}
.imgTecnos{
background-color: white;
display: flex;

flex-wrap: wrap;
margin-top: 3rem;
}
.sizeImgTecno{
    margin-bottom: 1rem;
    width: 6rem;
}
.subconteinerCostoMantenimiento{
    padding: 0rem;
     margin-top: 5rem
    
}
.containerCostoMantenimiento{
    margin: 1rem;
    margin-top: 7rem;
    background-color: #F5F5F7;
     border-radius: 1rem;
     height: 45rem;
    
}
.cotizacion{
    padding: 0.5rem;
}
.ubicacionImgCotizacion{
    right: 3rem;
 }
 .sizeImgCotizacion{
     width: 25rem;
 }

 .divTextoPotenciadoMobile{
    display: flex;
    justify-content: center;
    align-items: center;
 }
 .modernoSimple{
    font-size: 3rem;
        line-height: 3.1rem;
        justify-content: center;
        margin-left: 1rem;
}
.spareMobile{
    width: 100%!important;
}

.columnReverseFindMaintenance{
    flex-direction: column-reverse;
}

}

/* <!-- TABLET --> */
@media (min-width: 500px) and (max-width: 900px) {
    .ubicacionImgPortadaFindMaintenance{
        top: 25rem;
        right: 1rem;
    }
    .sizeImgPortadaFindMaintenance{
        width: 25rem;
    }
}