#no-city-found {
  display: none;
}
#city-data {
  margin: 0 -10px;
}
#state-row{
  display:flex;
  align-items: center;
}

.no-city-container{
  height: 200px;
  display:flex;
  align-items: center;
  justify-content:center;
}

.state-name {
  font-family: "Quantico", sans-serif;
  font-size: 22.5pt;
  font-weight: 700;
  line-height: 32.175pt;
  text-align: left;
  color: #101e43;
  margin-left: 15pt;
  text-transform: uppercase;
}

.state-logo {
  width: 64.5px;
  height: 43px !important;
  box-shadow: 0px 4px 14px 0px #00000026 !important;
}
/* Base styles for the city container and cities */
.city-container {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.city, .state-box {
  width: 20%;
  box-sizing: border-box;
  padding: 8px !important;
  text-align: left;
}

.city-link {
  font-family: "Lato", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 18.34px;
  text-align: left;
  color: #496073;
  cursor: pointer;
  text-transform: capitalize;
}

.city-link:hover {
  color: #b29e79;
  text-decoration: underline;
}

.city-link:visited {
  color: #496073;
}

#back-to-link a {
  color: #101e43;
}
#back-to-link a:active {
  color: #101e43;
}
#back-to-link a:hover {
  color: #b29e79;
  text-decoration: underline;
}

@media (max-width: 992px) {
  .city, .state-box {
    width: 25%; /* 4 cities per row */
  }
}

@media (max-width: 768px) {
  .city, .state-box {
    width: 33.33%; /* 3 cities per row */
  }
}

@media (max-width: 576px) {
  .city, .state-box {
    width: 50%; /* 2 cities per row */
  }

#state-main-wrapper {
    padding-left: 20px;
    padding-right: 20px;
  }
  .state-box-container{
    padding: 14px;
  }
}