body,
html {
  height: 100%;
  margin: 0;
}
.content {
  background-color: #c9cddf;
  min-height: 100%;
  /* min-height: 100;  */
}
.upper-container {
  height: 150px;

  margin: 0;
  /* background-image:linear-gradient(to bottom, #09203F ,#537895); */
  background-color: #09203f;
}
.navbar {
  width: 80%;
  margin: 0 auto;
  padding-top: 35px;
}
.navbar-brand {
  display: inline-block;
  /* width: 30%; */
  width: 64px;
}

.navbar-seasons {
  /* width: 20%; */
  width: 260px;
  float: right;

  /* height:40px; */
}
.navbar-seasons ul {
  margin: 0;
  padding: 0;

  list-style: none;
  display: inline-block;
}
.navbar-seasons li {
  display: inline-block;
}
.navbar-seasons li:nth-child(even) {
  padding-left: 10px;
  padding-right: 10px;
}
.season {
  height: 50px;
  display: block;
}

.navbar-seasons li p {
  height: 20%;
  margin: 0;
  color: #a0aad4;
  font-family: "Alata", sans-serif;
  font-size: 0.9em;
}

.navbar-seasons li p:hover {
  color: #1e5e98;
  text-shadow: 2px 2px 8px #4229d1;
}
.navbar-seasons .active p {
  color: #1e5e98;
  text-shadow: 2px 2px 8px #4229d1;
}
.main-content {
  display: table;
  margin: 0 auto;
}
.loaded {
  margin-top: -25px;
  margin-bottom: 25px;
}
.animeList {
  margin: 0 auto;
  list-style: none;
  padding: 0;
  margin-top: -25px;
  margin-bottom: 25px;
  /* min-width: 500px; */
  width: 1570px;
}
.selectedOnHover {
  background-color: rgba(57, 57, 59, 0.425);
  /* opacity: 0.5; */
}
.animeItem {
  float: left;

  box-sizing: border-box;
  /* width: 25%;
  height: 400px; */
  width: 460px;
  height: 265px;
  margin-bottom: 2%;
}
.middle {
  margin-right: 2%;
  margin-left: 2%;
  /* margin-left: 3.75%; */
}
.first {
  margin-right: 2%;
  margin-left: 2%;
  /* margin-left: 20px; */
}
.third {
  margin-right: 2%;
  margin-left: 2%;
  /* margin-right: 4%; */

  /* margin-right: 20px; */
}
.card {
  width: 100%;
  height: 100%;
  /* max-width: 185px;
  height: 265px; */
  background: #d9d9f0;
  border-radius: 0 10px 15px 0;
}
.background {
  width: 185px;
  height: 265px;
  float: left;
  position: relative;
}
.animeImage {
  /* width: 100%;
  height: 100%; */
  width: 185px;
  height: 265px;
}
.overlay {
  position: absolute;
  bottom: 0;
  background-color: rgba(41, 43, 59, 0.85);
  width: 100%;
}
.overlay p {
  margin: 0;
}
.overlay .title {
  font-family: "Playball", cursive;
  font-size: 1.2em;
  letter-spacing: 1px;
  color: rgb(191, 219, 210);
  max-height: 85px;
  overflow: hidden;
  margin-left: 5px;
  margin-right: 5px;
}
.overlay .title::first-letter {
  margin-left: 5px;
  font-size: 1.5em;
  color: #75978d;
}
.overlay .studio {
  font-family: "PT Sans", sans-serif;
  color: #5fb5ee;
  padding-bottom: 5px;
  text-align: center;
  text-shadow: 2px 2px 10px #9d68c9;
}
.overlay .studio::first-letter {
  margin-left: 10px;
}
.description {
  width: 275px;
  display: block;
  height: 100%;
  float: right;
  margin: 0;
}
/* .description p {
  margin: 0;
  overflow: hidden;
  /* height: 132px; */
/* height: 50%;
} */
.description .mainText {
  height: 50%;
  margin: 0;
  overflow: hidden;
  font-family: "Lora", serif;
  font-size: 0.96em;
  padding-left: 15px;
  padding-right: 5px;
  color: rgba(17, 10, 121, 0.8);
}
.header p::first-letter {
  margin-left: 15px;
}

.mainText p::first-letter {
  margin-left: 15px;
}
.header {
  max-height: 25%;
  overflow: hidden;
}
.header p {
  margin: 0;
  overflow: hidden;
}
.headerText {
  width: 80%;
  display: inline-block;
  padding-top: 10px;
  padding-bottom: 10px;
  font-family: "Lora", serif;
}
.stats {
  width: 20%;
  float: right;
  height: 100%;
  vertical-align: top;
  padding-top: 10px;
  padding-bottom: 10px;
}
.stats p {
  display: inline;
}
.stats img {
  padding-right: 5px;
}
.status1 {
  font-size: 0.75em;
  color: #6f50f8;
  text-shadow: 2px 2px 8px rgba(209, 41, 139, 0.3);
}
.status2 {
  text-shadow: 2px 2px 8px rgba(161, 41, 209, 0.3);
  color: #b670f0;
}
.details {
  font-size: 0.8em;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #0a2d79;
}
.row1 {
  padding-bottom: 5px;
}
.likes {
  color: #5b50f8;
  text-shadow: 1px 1px 5px rgba(133, 41, 209, 0.4);
}
.loved {
  color: rgb(203, 41, 209);
}
.footer {
  height: 25%;
  background-color: #312e4b;
  border-radius: 0 0 15px 0;
}
.footer p {
  float: left;
  vertical-align: middle;
  margin-bottom: 0;
  margin-top: 20px;
  background-color: #7235e4;
  margin-left: 5px;
  padding-right: 5px;
  padding-left: 5px;
  border-radius: 5px;
  color: #0d0761;
}

.footer img {
  width: 33px;
  padding-top: 16px;
  float: right;
}

/* Media Query */

@media only screen and (max-width: 1020px) {
  .animeList {
    width: 480px;
  }
}
@media only screen and (min-width: 1020px) and (max-width: 1585px) {
  .animeList {
    width: 1000px;
  }
}