body {
  background: rgb(2, 2, 2);
  font-family: "ubuntu", sans-serif;
  color: #222;
}

.a {
  color: currentColor;
  text-decoration: none;
}

.a a {
  color: currentColor;
  text-decoration: none;
}

.p {
  font-size: 13px;
}

.a:hover .card-outmore {
  background: #2c3e50;
  color: #fff;
}

.a:hover .thecard {
  box-shadow: 0 10px 50px rgba(250, 250, 249, 0.486);
}

.img {
  align-items: center;
  width: 150px;
  height: 218px;
  object-fit: scale-down;
  display: block;
  margin-left: auto;
  margin-right: 10px;
  float: left;
}
.thecard {
  width: 300px;
  height: 350px;
  margin: 4px;
  box-shadow: 0 1px 30px rgba(58, 57, 57, 0.637);
  display: block;
  background-color: #fff;
  border-radius: 10px;
  transition: 400ms ease;
  justify-content: space-around;
}

.card-img {
  height: 225px;
  background-color: white;
}

.card-img img {
  width: 100%;
  border-radius: 4px 4px 0px 0px;
}

.card-caption {
  position: relative;
  background: #ffffff;
  padding: 15px 25px 5px 25px;
  border-radius: 0px 0px 4px 4px;
}

.card-outmore {
  padding: 10px 25px 10px 25px;
  border-radius: 0px 0px 4px 4px;
  border-top: 1px solid #e0e0e0;
  background: #efefef;
  color: #222;
  display: inline-table;
  width: 100%;
  box-sizing: border-box;
  transition: 400ms ease;
}

.card-outmore .h5 {
  float: left;
}

.card-outmore a i {
  float: right;
  font-size: 15px;
  color: white;
}

span.date {
  font-size: 10px;
}

.h1 {
  font-size: 22px;
}

.h5 {
  margin: 0;
  text-decoration: none;
  color: black;
}

#like-btn {
  font-size: 18px;
  background: #446cb3;
  color: #fff;
  padding: 13px 15px;
  border-radius: 50em;
  position: absolute;
  right: 20px;
  top: -22px;
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.2);
  transition: 400ms ease;
}

#like-btn:hover {
  font-size: 18px;
  background: #3b5998;
  color: #fff;
  padding: 13px 15px;
  border-radius: 50em;
  position: absolute;
  right: 20px;
  top: -22px;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.3);
}

#outmore-icon {
  border: 1px solid;
  padding: 1px 6px;
  border-radius: 50em;
  color: black;
}

.box {
  position: auto;
  display: flex;
  justify-content: space-around;
  flex-flow: row wrap;
}

.h7 {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 30px;
  color: white;
  font-size: 50px;
  font-family: "ubuntu";
}

.h6 {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 50px;
  color: white;
  font-size: 20px;
  font-family: "ubuntu";
}

.sombra {
  font-size: 30px;
  color: white;
  text-shadow: 1px 1px 1px #000, -1px 0px 0px #000, 0px 1px 0px #000,
    0px -1px 0px #000;
}

.sombra2 {
  font-size: 15px;
  color: white;
  text-shadow: 1px 1px 1px #000, -1px 0px 0px #000, 0px 1px 0px #000,
    0px -1px 0px #000;
}