/* FONTS */


html, body {
  width: 100%;
  max-width: 100%;
  /*background-color: #F5F9FF;*/
}

.topRow {
  display: flex;
  height: inherit;
  justify-content: center;
  width: 100%;
}

.topRow img {
  width: auto;
  height: 10vh;
  object-fit: cover;
}

.navigation {
  width: 100%;
  padding: 1rem 0;
  background-color: #1F5A9D;
}

.menuItem h5 a {
  color: white !important;
  font-size: 2.3rem;
  font-family: "Oswald",sans-serif;
}

.menuItem a:hover {
  text-decoration: none;
}
.menuItem {
  text-align: center;
  padding: 0;
  width: 70%;
  margin: 0 auto;
}

.dropdown ul, li {
  list-style: none !important;
  padding: 0;
  width: 70%;
}
.dropdown {
  display: block;
  opacity: 0;
  transform: translateY(-2rem);
  -webkit-transform: translateY(-2rem);
  z-index: 2;
  width: 70%;
  position: absolute;
  transition: opacity 0.2s, transform 0.2s;
  -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
  transition-timing-function: ease-in;
}

.navigation .col-lg-4 {
  padding: 0;
}

.dropdown ul {
  position: relative;
  border-radius: 3px;
  padding: 0.5rem 0;
  margin: 0 auto;
  background-color: #49586B;
  opacity: 0.9;
  -moz-box-shadow: 3px 3px 10px rgba(255,255,255,.5);
  -webkit-box-shadow: 3px 3px 10px rgba(255,255,255,.5);
  box-shadow: 3px 3px 10px rgba(255,255,255,.5);
}

.dropdown li {
  margin: 1rem auto;
}

.dropdown ul a {
  margin: 0 auto;
  color: white;
  font-family: "Assistant", sans-serif;
  font-size: 1.5rem;
}

.dropdown a:hover {
  color: #CCCCCC;
}
.menuItem:hover .dropdown {
  opacity: 1;
  transform: translateY(0rem);
  -webkit-transform: translateY(0rem);
  display: flex;
  height: inherit;
  justify-content: center;
  flex-direction: column;
}

.menuItem #shells:hover {}

.headerImage {
  width: 100%;
  height: 60vh;
  margin: 0 auto;
}

.headerImage img {
  object-fit:cover;
  height: 60vh;
  width: 100%;
}

.aboutSection {
  padding: 0 10vw;
  padding-top: 5vh;
}

.quotes, .quotes h6 {
  display: flex;
  height: inherit;
  justify-content: center;
  align-items: center;
}

.quotes h6 {
  font-size: 22pt;
  font-style: italic;
  color: gray;
  background-color: white;
}

.alert-warning p {
  text-align: justify;
}

h1 {
  text-align: center;
  font-size: 30pt;
  font-family: "Assistant",sans-serif;
  color: #1E4679;
}

h2 {
  text-align: center;
  font-size: 25pt;
  font-family: "Assistant",sans-serif;
  color: #1E4679;
}

h3 {
  font-family: "Assistant",sans-serif;
  font-size: 1.8rem;
  text-align: center;
}

h5 {
  margin-bottom: 0;
}
p {
  font-size: 1.3rem;
  font-family: "Nunito", sans-serif;
  text-align: center;
  color: #49586B;
}

.text {
  padding: 0 10%;
}
.cards {
  padding-top: 5vh;
  margin: 0 10vw;
}

.card {
  margin: 0 1vw;
}

.card-body {
  display: flex;
  height: inherit;
  justify-content: center;
  flex-direction: column;
}
.card-body img{
  width: 100%;
  height: 30vh;
  object-fit: cover;
}

.card-body .button, .contactForm button {
  background-color: #91C2FF;
  width: 15rem;
  text-align: center;
  border: none;
  font-family: "Assistant", sans-serif;
  font-size: 1.5rem;
  border-radius: 2px;
  margin: 0 auto !important;
}

@keyframes buttonFade {
  from {background-color: #91C2FF;} to {background-color: #3A5C87;}
}
.card-body .button:hover, .contactForm button:hover {
  background-color: #3A5C87;
  animation-name: buttonFade;
  animation-duration: 0.5s;
  cursor: pointer;
}

.galleryOuter {
  padding: 0 10vw;
  padding-top: 5vh;
  background-color: #1F5A9D;
}

.galleryOuter h2 {
  color: white !important;
}
.gallery {
  display: flex;
  height: inherit;
  justify-content: center;
}

.gallery h2 {
  color: white !important;
}

.gallery img {
  width: 25vw;
  height: 25vw;
  padding: 0.5vw 0.5vw;
  object-fit: cover;
}
.modal-body img {
  width: 100%;
  height: 100%;
}

.gallery img:hover {
  cursor: pointer;
}

.contact {
  background-color: #1F5A9D;
  color: white !important;
  padding: 0 10vw;
  padding-top: 5vh;
  flex-direction: column;
  display: flex;
  height: inherit;
  justify-content: center;
  width: 100%;
}

.contactForm {
  width: 100%;
  display: flex;
  flex-direction: column;
  height: inherit;
  justify-content: center;
}
.contactForm input {
  width: 80%;
  border: 1px solid gray;
  margin: 0 auto;
  border-radius: 3px;
  font-family: "Nunito",sans-serif;
}

.contactForm input:focus {
  outline: none !important;
}

.contactForm textarea {
  width: 80%;
  border: 1px solid gray;
  border-radius: 3px;
  font-family: "Nunito",sans-serif;
  margin: 0 auto;
}

.contactForm textarea:focus {
  outline: none !important;
}

footer {
  background-color: #031E40;
  color: #3A5C87;
  text-align: center;
  padding: 1rem;
}

footer a {
  color: #3A5C87 !important;
}

.centeredText {
  display: flex;
  align-items: center;
}