/* Navbar */

nav .myContainer {
  display: flex;
  padding-left: 15%;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 30%;
}
nav .myContainer .myHome {
  color: brown !important;
}
nav .myContainer .myHome:hover {
  color: white !important;
}
nav .myContainer .part2 a:hover {
  background-color: brown;
  transform: scale(0.75);
  transition: 0.5s;
  border-radius: 4.5em / 0.5em;
}
nav .myContainer .part2 .myDropdown-menu a:hover {
  background-color: brown;
  transform: scale(1);
  border-radius: 0em / 0em;
}
nav .myContainer .part2 .myDropdown-menu .last {
  border-bottom: solid 0.15em brown;
}
/* Sign In AND Up */
.page2 {
  padding: 150px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.page2 .signIn {
  font-size: 1.25em;
  background-color: rgb(239, 239, 239);
  border-radius: 1em;
  box-shadow: 0.25em 0.25em 0.25em grey;
  padding: 2em;
  gap: 0.75em;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
.page2 .signIn .signInButtons {
  display: flex;
  gap: 0.4em;
}
.page2 .signIn .signInButtons .facebook {
  background-color: blue;
  color: white;
  border: solid 0.1em rgb(0, 0, 176);
}
.page2 .signIn .signInButtons .google {
  background-color: rgb(219, 0, 0);
  color: white;
  border: solid 0.1em rgb(186, 0, 0);
}
.page2 .signIn .inputs {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}
.page2 .signIn .inputs .textPlace {
  border-top: solid 0.1em grey;
  color: brown;
}
.page2 .signIn label {
  text-align: start;
}
.page2 .signIn .signButton {
  border-radius: 0.75em;
  background-color: green;
  color: white;
  border: solid 0.1em grey;
}
.page2 .signIn .signUp {
  border-radius: 0.75em;
  background-color: rgb(0, 0, 255);
  color: white;
  border: solid 0.1em rgb(0, 0, 176);
  margin-top: 0.4em;
}
.page2 .signIn a {
  text-align: start;
  text-decoration: none;
  opacity: 0.7;
  padding-bottom: 0.7em;
  border-bottom: solid 0.07em grey;
}
.page2 .signIn p {
  font-size: 1.5em;
  font-weight: bold;
}
/* Footer */
a {
  text-decoration: none;
}
footer {
  background-color: #343a40 !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 2em;
  gap: 1em;
}
footer .all {
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  text-align: center;
  color: white;
  padding-bottom: 2em;
  border-bottom: solid 0.1em white;
  gap: 4em;
  flex-wrap: wrap;
}
footer .all a {
  color: white;
  font-weight: 100;
  display: flex;
  justify-content: center;
}
footer .all a:hover {
  color: brown;
}
footer .all .firstPart,
footer .all .secondPart {
  display: flex;
  justify-content: center;
  gap: 4em;
}
footer .all .secondPart {
  margin-top: -2.5em;
}
footer .firstPart .logoicon {
  display: flex;
}
footer .firstPart .shopping,
footer .secondPart .links,
footer .secondPart .help {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1em;
}
footer .firstPart .logoicon a {
  font-weight: 500;
  font-size: 3em;
}
footer .firstPart a:hover {
  color: brown !important;
}
footer .firstPart .ic {
  font-size: 4.5em !important;
  margin-top: 0.35em;
}
footer .thirdPart {
  color: white;
  align-self: center;
  text-align: center;
}
footer .thirdPart .myface:hover {
  color: rgb(0, 0, 126);
}
footer .thirdPart .mytwitter:hover {
  color: deepskyblue;
}
footer .thirdPart .mywhats:hover {
  color: green;
}
footer .thirdPart .myyou:hover {
  color: red;
}
@media (max-width: 768px) {
  footer .all .firstPart,
  footer .all .secondPart {
    flex-direction: column;
  }
  nav .myContainer {
    padding-left: 1em;
  }
  .page2 .signIn .signInButtons {
    font-size: 0.5em;
  }
}
@media (max-width: 1200px) {
  nav .myContainer {
    padding-left: 1em;
    padding-right: 1em;
  }
}
/* 
@media (max-width: 990px) {
  nav .myContainer {
    padding-left: 1em;
  }
}
footer .firstPart,
footer .secondPart,
footer .thirdPart {
  display: flex;
  justify-content: center;
}
footer .firstPart .shopping,
footer .secondPart .links,
footer .secondPart .help {
  display: flex;
  flex-direction: column;
  justify-content: center;
} */