* {
  font-family: Roboto Slab;
  margin: 0%;
  padding: 0%;
  box-sizing: border-box;
}

.navbar {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  flex-wrap: nowrap;
  width: 100vw !important;
  height: 10vh !important;
  background-color: black;
  position: sticky !important;
  top: 0% !important;
}
.navbar .menuAndIconContainer {
  display: flex;
  flex-direction: row;
  justify-content: start;
  align-items: center;
  flex-wrap: nowrap;
  width: 85% !important;
  height: 100% !important;
}
.navbar .menuAndIconContainer .menuBtn {
  margin: 0% 2% !important;
  height: 100% !important;
  border: 0px !important;
  padding: 0% !important;
}
.navbar .menuAndIconContainer .menuBtn span {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content !important;
  height: 100% !important;
  color: white !important;
  font-size: 2rem !important;
}
.navbar .menuAndIconContainer img {
  width: 10% !important;
  height: 100% !important;
  object-fit: contain;
}
.navbar .menuAndIconContainer .offcanvas {
  background-color: black !important;
  width: 25vw;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-header {
  display: flex;
  flex-direction: row;
  justify-content: end;
  align-items: center;
  flex-wrap: nowrap;
  width: 100% !important;
  height: fit-content !important;
  padding: 2% 1% !important;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-header .btn-close {
  color: white !important;
  font-weight: bold !important;
  padding: 0% !important;
  margin: 0% !important;
  font-size: 1.5rem !important;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-body ul {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
  flex-wrap: nowrap;
  gap: 20px !important;
  width: 100% !important;
  height: fit-content !important;
  padding: 0% !important;
  margin: 0% !important;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-body ul li {
  list-style: none !important;
  width: 100% !important;
  height: fit-content !important;
  text-align: left !important;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-body ul li a {
  color: white;
  font-size: 1rem;
  text-decoration: none;
  font-family: Roboto Slab;
  font-weight: 300 !important;
  width: 100% !important;
  height: 100% !important;
  text-align: right !important;
}
.navbar .menuAndIconContainer .offcanvas .offcanvas-body ul li .linkActive {
  text-decoration: underline !important;
  width: 100% !important;
}
.navbar .socialMedia {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 15% !important;
  height: 100% !important;
}
@media (min-width: 320px) and (max-width: 630px) {
  .navbar .offcanvas {
    width: 100vw !important;
    z-index: 1050 !important;
  }
  .navbar .menuAndIconContainer {
    width: 75% !important;
    height: 100% !important;
  }
  .navbar .menuAndIconContainer img {
    width: fit-content !important;
    height: 100% !important;
  }
  .navbar .socialMedia {
    width: 20% !important;
    height: 100% !important;
  }
}

footer {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  flex-wrap: nowrap;
  width: 100vw !important;
  height: 10vh !important;
  background-color: white !important;
  position: sticky !important;
  bottom: 0% !important;
}
footer .carousel {
  width: 100% !important;
  height: 100% !important;
}
footer .carousel .carousel-inner {
  width: 100% !important;
  height: 100% !important;
}
footer .carousel .carousel-inner .carousel-item {
  width: 100% !important;
  height: 100% !important;
}
footer .carousel .carousel-inner .carousel-item .partnerSliderImg {
  width: 100% !important;
  height: 100% !important;
  padding: 0.5% !important;
}
footer .carousel .carousel-inner .carousel-item .partnerSliderImg img {
  width: 24.5% !important;
  height: 100% !important;
  object-fit: contain !important;
}
footer .carousel .carousel-inner .carousel-item .partnerSliderImg :hover {
  animation: bigger 1s ease-in forwards !important;
}

@keyframes bigger {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1.5);
  }
}
.gridContainer {
  width: 100% !important;
  height: fit-content !important;
  padding: 0% 1% !important;
  margin: 0% !important;
  display: grid !important;
  grid-template-columns: 1fr 2fr !important;
  grid-template-rows: 1fr 1fr !important;
  gap: 15px !important;
}
.gridContainer .leftMenu {
  width: 100% !important;
  height: 100% !important;
  grid-column: 1/2 !important;
  grid-row: 1/2 !important;
}
.gridContainer .leftMenu img {
  width: 100% !important;
  height: 100% !important;
  object-fit: fill !important;
}
.gridContainer .leftMenu1 {
  width: 100% !important;
  height: 100% !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  background-color: white !important;
  color: black !important;
  grid-row: 2/3 !important;
  grid-column: 1/2 !important;
  padding: 1% !important;
}
.gridContainer .leftMenu1 h2 {
  width: fit-content !important;
  height: fit-content !important;
  font-size: 2rem !important;
  text-align: center !important;
  margin: 0% !important;
}
.gridContainer .content1 {
  width: 100% !important;
  height: 100% !important;
  background-color: black !important;
  color: white !important;
  grid-row: 1/3 !important;
  grid-column: 2 !important;
  padding: 2% !important;
}
.gridContainer .content1 h1 {
  font-size: 3rem !important;
  color: red !important;
  text-align: center !important;
  margin: 2% 0% !important;
}
.gridContainer .content1 p {
  font-size: 1.2rem !important;
  text-align: center !important;
  text-wrap: wrap !important;
}
@media (min-width: 320px) and (max-width: 630px) {
  .gridContainer {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 1fr 2fr !important;
    padding: 2% !important;
  }
  .gridContainer .leftMenu {
    grid-column: 1/2 !important;
    grid-row: 1/2 !important;
  }
  .gridContainer .leftMenu1 {
    grid-column: 2/3 !important;
    grid-row: 1/2 !important;
  }
  .gridContainer .content1 {
    grid-column: 1/3 !important;
    grid-row: 2/3 !important;
  }
  .gridContainer .content1 p {
    font-size: 0.9rem !important;
    margin: 0% !important;
  }
}

.mainContainer .textSection {
  width: 80% !important;
  height: fit-content !important;
  margin: 0% !important;
  text-align: center !important;
}
.mainContainer .textSection p {
  font-size: 1.2rem !important;
  color: white !important;
  text-align: center !important;
  text-wrap: wrap !important;
}
.mainContainer .formContainer {
  width: 100% !important;
  height: fit-content !important;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  margin: 5% 0 0 0 !important;
}
.mainContainer .formContainer form {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  flex-wrap: nowrap;
  width: 50% !important;
  height: 50vh !important;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 8px;
  padding: 2% !important;
}
.mainContainer .formContainer form label {
  color: white;
  font-size: 1.2rem !important;
  margin-bottom: 0.5rem !important;
  text-align: left !important;
  width: 100% !important;
}
.mainContainer .formContainer form input, .mainContainer .formContainer form textarea {
  width: 100% !important;
  height: 50px !important;
  margin-bottom: 1rem !important;
  border-radius: 4px;
  border: none !important;
  padding: 0.5rem !important;
}
.mainContainer .formContainer form .btnForm {
  width: 100% !important;
  height: 55px !important;
  background-color: blue !important;
  color: white !important;
}
.mainContainer .formContainer form :hover {
  background-color: red !important;
  color: white !important;
  cursor: pointer !important;
}
.mainContainer .formContainer form :active {
  transform: scale(0.98) !important;
}
@media (min-width: 320px) and (max-width: 630px) {
  .mainContainer .formContainer form {
    width: 90% !important;
    height: fit-content !important;
  }
}

.imagesMainContainer {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  width: 100% !important;
  height: auto !important;
}
.imagesMainContainer .imageTilte {
  width: 100% !important;
  height: fit-content !important;
  border-bottom: 1px solid white;
  padding: 0% 1% !important;
}
.imagesMainContainer .imageTilte H1 {
  color: white !important;
  font-size: 1rem !important;
  width: 100% !important;
  text-align: left !important;
  text-wrap: wrap !important;
}
.imagesMainContainer .imageContainer {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  width: 100% !important;
  height: fit-content !important;
  margin: 1% 0% 0% 0% !important;
  padding: 0% 1% !important;
}
.imagesMainContainer .imageContainer img {
  width: 30% !important;
  height: 20vh !important;
  border: 2px solid white;
  border-radius: 10px;
  margin: 0% 0% 1% 0% !important;
  padding: 0% !important;
  object-fit: cover;
}
@media (min-width: 320px) and (max-width: 630px) {
  .imagesMainContainer .imageContainer {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
  }
  .imagesMainContainer .imageContainer img {
    width: 45% !important;
    height: 30vh !important;
  }
}

.mainContainer {
  width: 100% !important;
  height: fit-content !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}
.mainContainer .infoContainer {
  width: 95% !important;
  height: 90% !important;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: start;
  flex-wrap: nowrap;
  background-color: rgba(0, 0, 0, 0.5) !important;
  border-radius: 8px !important;
  padding: 1%;
}
.mainContainer .infoContainer .infoImg {
  width: 60% !important;
  height: 100% !important;
  border-radius: 8px !important;
  object-fit: fill !important;
}
.mainContainer .infoContainer .infoText {
  width: 35% !important;
  height: 100% !important;
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: flex-start;
  flex-wrap: nowrap;
  padding: 0px !important;
}
.mainContainer .infoContainer .infoText h1 {
  width: 100% !important;
  height: fit-content !important;
  color: white !important;
  font-size: 2rem !important;
  margin-bottom: 20px !important;
  text-align: center !important;
}
.mainContainer .infoContainer .infoText h2 {
  width: 100% !important;
  height: fit-content !important;
  color: white !important;
  font-size: 1rem !important;
  text-align: justify !important;
}
@media (min-width: 320px) and (max-width: 630px) {
  .mainContainer .infoContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    width: 98% !important;
    height: fit-content !important;
  }
  .mainContainer .infoContainer .infoImg {
    width: 100% !important;
    height: 50% !important;
    margin-bottom: 20px !important;
  }
  .mainContainer .infoContainer .infoText {
    width: 100% !important;
    height: fit-content !important;
  }
  .mainContainer .infoContainer .infoText h1 {
    font-size: 1.5rem !important;
  }
  .mainContainer .infoContainer .infoText h2 {
    font-size: 0.9rem !important;
  }
}

.prodInfoContainer {
  width: 100% !important;
  height: 100% !important;
  padding: 0% 1% !important;
  margin: 0% !important;
}
.prodInfoContainer .prodInfo {
  width: 100% !important;
  height: 100% !important;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: start;
  flex-wrap: nowrap;
  background-color: rgba(0, 0, 0, 0.5) !important;
  border-radius: 8px !important;
  padding: 0% !important;
  margin: 0% !important;
}
.prodInfoContainer .prodInfo img {
  width: 55% !important;
  height: 100% !important;
  border-radius: 8px !important;
  object-fit: fill !important;
}
.prodInfoContainer .prodInfo .productInfoText {
  width: 45% !important;
  height: fit-content !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  padding: 0% 0.5% !important;
}
.prodInfoContainer .prodInfo .productInfoText H1 {
  width: 100% !important;
  height: fit-content !important;
  font-size: 2rem !important;
  color: red !important;
  font-weight: bold !important;
  text-align: center !important;
  margin: 0% !important;
}
.prodInfoContainer .prodInfo .productInfoText H2 {
  width: 100% !important;
  height: fit-content !important;
  font-size: 0.9rem !important;
  color: white !important;
  text-align: center !important;
  margin: 0% !important;
}
@media (min-width: 630px) and (max-width: 1100px) {
  .prodInfoContainer .prodInfo {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: start;
    flex-wrap: nowrap;
  }
  .prodInfoContainer .prodInfo img {
    width: 100% !important;
    height: 100% !important;
  }
  .prodInfoContainer .prodInfo .productInfoText {
    width: 100% !important;
    height: fit-content !important;
  }
}

.prodContainer {
  width: 100% !important;
  height: fit-content !important;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 2% !important;
  padding: 0% 1% !important;
}
.prodContainer .prodContent {
  width: 30% !important;
  height: 30vh !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  margin-bottom: 2% !important;
  border-radius: 8px !important;
  background-color: rgba(0, 0, 0, 0.5) !important;
  padding: 1% !important;
  margin: 0% 0% 3% 0% !important;
}
.prodContainer .prodContent img {
  width: 100% !important;
  height: 85% !important;
  border-radius: 8px !important;
  margin-bottom: 2% !important;
  object-fit: cover !important;
}
.prodContainer .prodContent H1 {
  width: 100% !important;
  height: fit-content !important;
  text-align: center !important;
  margin: 0% !important;
  color: white !important;
  font-size: 1rem !important;
}

@media (min-width: 320px) and (max-width: 630px) {
  .prodInfo {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    width: 95% !important;
    height: fit-content !important;
  }
  .prodInfo img {
    width: 100% !important;
    height: auto !important;
    margin-bottom: 2% !important;
  }
  .prodInfo .productInfoText {
    width: 100% !important;
    height: fit-content !important;
  }
  .prodInfo .productInfoText H1 {
    font-size: 1.2rem !important;
  }
  .prodInfo .productInfoText H2 {
    font-size: 0.7rem !important;
  }
  .prodContainer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
  }
  .prodContainer .prodContent {
    width: 100% !important;
    height: 40vh !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
  }
}
.mainContainer {
  width: 100vw !important;
  height: fit-content !important;
  min-height: 80vh !important;
  background-image: url("../assets/background.jpg");
  background-repeat: no-repeat;
  background-size: cover !important;
  padding: 0% !important;
  margin: 0% !important;
}
.mainContainer .greenText {
  color: greenyellow;
}
.mainContainer .underlineText {
  text-decoration: underline;
}
.mainContainer .boldText {
  font-weight: bold;
}
.mainContainer .redSection {
  background-color: red;
}
.mainContainer .redSection p {
  color: white;
  font-size: 30px;
  text-align: center;
}
.mainContainer .fonditoBlancoParaQueSeVea {
  background-color: white;
}

/*# sourceMappingURL=style.css.map */