

a {
  text-decoration: none;
}

body {
  padding-bottom: 15%;
}

button#deleteCitiesButton {
  width: 53%;
  height: 25%;
  margin-left: 23.7%;
  margin-bottom: 1%;
  background-color: rgb(240, 92, 92);
}

div.citiesCard {
  flex-basis: 30%;
  padding: 1%;
  margin: 0%;
  text-align: center;
}

div.divCitiesAll {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  max-width: 100%;
}

div#enter {
    position: absolute;
    top: 57%;
    left: 0%;
    right: 0%;
    -webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;
}

div#enter span a h1 {
    color: white;
    font-size: 375%;
}

div#enter, nav {
    text-align: center;
}

.fadeOut {
  animation-name: fadeOut;
  animation-duration: 15s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.fadeIn {
  animation-name: fadeIn;
  animation-duration: 15s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 0.3;
  }

  40% {
    opacity: 0.7;
  }

  50% {
    opacity: 1;
  }

  60% {
    opacity: 0.7;
  }
  80% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }
  20% {
    opacity: 0.7;
  }
  40% {
    opacity: 0.3
  }

  50% {
    opacity: 0;
  }

  60% {
    opacity: 0.3
  }
  80% {
    opacity: 0.7;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes glow {
    from {
      text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
    }
    to {
      text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
    }
  }

.imgDivCitiesCard {
  height: 53%;
  width: 53%;
  position: relative;
  z-index: 1;
}

#indexCover, img {
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    height: 100%;
    max-height: 100%;
    width: 100%;
    z-index: -1;
}

input#submitButton {
  width: 53%;
  height: 25%;
  padding: 0.5%;
  background-color: rgb(125, 199, 157);
}

nav>h1 {
    font-family: 'Bebas Neue', cursive;
    font-size: 500%;
    margin-top: 35px;
    color: white;
    letter-spacing: 3px;
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
}

#navCitiesBottom {
  display: flex;
  flex-wrap: wrap;
} /* For cities.html. */

#navCitiesHome {
  background-color: black;
  flex-basis: 43%;
}

#navCitiesHome a {
  color: salmon;
}

.navCitiesOthers {
  background-color: black;
  flex-basis: 25%;
  color: whitesmoke;
}

#navCitiesTitlePage {
  background-color: black;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  height: auto;
  border-bottom: 3px solid black;
}

#navCitiesTop {
  background-color: black;
  width: 100%;
  max-width: 100%;
  color: red;
}

#navCitiesTop h1 {
  font-family: 'Bebas Neue', cursive;
    font-size: 300%;
    color: white;
    letter-spacing: 3px;
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
}

