:root{
  --bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",
  Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
}
body{
  font-family: var(--bs-font-sans-serif);
  margin: 0;  
  min-height: 100vh;
  padding-bottom: 7em;
  

}


.footer{
  position: absolute;
  bottom: 0;
  width: 100%;
  background-color: #F6F6F6;
}

.body-img{
  background-image: url(./images/Appisolar_BG_2.png);
  background-repeat: no-repeat;
  background-attachment:fixed;
  background-size: cover;
  /* height: auto;
  width:auto;
  min-height: 100%; */
  position: relative;
}

.nav-bar{
  background-color: #F6F6F6;
}
.icon-image{
  width: 40px;
  height: 40px;
  
}


.pill{
  background-color: #0d6e27;  
  padding: 10px;
  border-radius: 15px;

}
.title-pill{
  height: 75px;
}

.main-about{
  position: relative;
  top: -80px;
  min-width: 49%;
  width: 600px; 
  
}

.main-prices{
  position: relative;
  top: -80px;
  min-width: 49%;
  width: 600px; 
}

.main-container{  
  
  width: 600px;
  background-color: #F6F6F6;
  
}

.main-contact{  
  min-width: 49%;
  width: 800px;
  background-color: #F6F6F6;
  margin-top: 250px ;
}

.form-container{
  width: 75%;
}

.btn-whatsapp {
  display: block !important;
  position: fixed;
  z-index: 9999999;
  bottom: 20px;
  right: 20px;
  cursor: pointer;
  border-radius:100px !important;
  }
  .btn-whatsapp:hover{
  border-radius:100px !important;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(7,94,84,1); 
  -moz-box-shadow: 0px 0px 15px 0px rgba(7,94,84,1);
  box-shadow: 0px 0px 15px 0px rgba(7,94,84,1);
  transition-duration: 1s;
  } 


@media (max-width:767px){
  .title-pill{
    height: auto;
  }
}


@media (max-width:640px) {
  .main-container{
      width: 90%;
  }
  .main-about{
    top: 0px;
  }
  .pill h3{
      font-size: 15px;
  }
  .title-pill{
    height: auto;
  }
  .pill p{
    display: none;
  }
  .main-contact{
    width: 100%;
  }
  .form-container{
    width: 100%;
  }
  footer {
    font-size: 12px;
  }
  
}

/* Estilo específico para la primera imagen */
.logotipo1 {
  max-width: 35%;
}

/* Estilo específico para la segunda imagen */
.logotipo2 {
  max-width: 25%;
}


/* Estilo específico para la tercera imagen */
.logotipo3 {
  max-width: 25%;
}