.main{
margin-top: -50px;
}
/**/

.whatsapp-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}

.whatsapp-button img {
  width: 73px;
  height: 73px;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.whatsapp-button:hover {
  opacity: 0.8;
}




.logo1 {
  width: 100%; /* make the logo width flexible */
  /*height: auto;  make the logo height flexible */
  max-width: 200px; /* set a maximum width for the logo */
 /* max-height: 50px;  set a maximum height for the logo */
}

/* Small screens (e.g. mobile devices) */
@media only screen and (max-width: 320px) {
  .logo1 {
    max-width: 130px; /* smaller maximum width for small screens */
  /*  max-height: 15px;  smaller maximum height for small screens */
  margin-right: 20px;
  }
}

@media only screen and (max-width: 480px) {
  .logo1 {
    max-width: 140px; /* smaller maximum width for small screens */
   /* max-height: 20px;  smaller maximum height for small screens */
  
      margin-right: 20px;
  }
}

@media only screen and (max-width: 768px) {
  .logo1 {
    max-width: 280px; /* smaller maximum width for small screens */
  /*  max-height: 25px;  smaller maximum height for small screens */
margin-right: 20px;
  }
}

/* Medium screens (e.g. tablets) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .logo1 {
    max-width: 200px; /* medium maximum width for medium screens */
   /* max-height: 37px;  medium maximum height for medium screens */
margin-right: 20px;
  }
}

/* Large screens (e.g. desktops) */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  .logo1 {
    max-width: 290px; /* larger maximum width for large screens */
    /*max-height: 45px;  larger maximum height for large screens */
margin-right: 20px;
  }
}

@media only screen and (min-width: 1201px) {
  .logo1 {
    max-width: 300px; /* default maximum width for large screens */
    /*max-height: 50px;  default maximum height for large screens */
margin-right: 20px;
  }
}




.fw-logo {
  width: 100%; /* make the logo width flexible */
  /*height: auto;  make the logo height flexible */
  max-width: 200px; /* set a maximum width for the logo */
 /* max-height: 50px;  set a maximum height for the logo */
}

/* Small screens (e.g. mobile devices) */
@media only screen and (max-width: 320px) {
  .fw-logo {
    max-width: 130px; /* smaller maximum width for small screens */
  /*  max-height: 15px;  smaller maximum height for small screens */
  margin-right: 20px;
  }
}

@media only screen and (max-width: 480px) {
  .fw-logo {
    max-width: 140px; /* smaller maximum width for small screens */
   /* max-height: 20px;  smaller maximum height for small screens */
  
      margin-right: 20px;
  }
}

@media only screen and (max-width: 768px) {
  .fw-logo {
    max-width: 280px; /* smaller maximum width for small screens */
  /*  max-height: 25px;  smaller maximum height for small screens */
margin-right: 20px;
  }
}

/* Medium screens (e.g. tablets) */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
  .fw-logo {
    max-width: 200px; /* medium maximum width for medium screens */
   /* max-height: 37px;  medium maximum height for medium screens */
margin-right: 20px;
  }
}

/* Large screens (e.g. desktops) */
@media only screen and (min-width: 1025px) and (max-width: 1200px) {
  .fw-logo {
    max-width: 290px; /* larger maximum width for large screens */
    /*max-height: 45px;  larger maximum height for large screens */
margin-right: 20px;
  }
}

@media only screen and (min-width: 1201px) {
  .fw-logo {
    max-width: 300px; /* default maximum width for large screens */
    /*max-height: 50px;  default maximum height for large screens */
margin-right: 20px;
  }
}