body {
  background-color: rgba(173, 216, 230, 0.83);
}

.outer {
  border-radius: 133px 5px 133px 5px;
  width: 100%;
  height: 265px;
  overflow: hidden;
  position: relative;
  background: rgba(255, 255, 255, 0.8);
  margin-bottom: 20px;
}

a.project-item:hover {
  text-decoration: none;
}

.outer:hover .img-circle {
  transform: scale(1.1);
}

.left {
  height: 100%;
  width: 245px;
  margin: 20px;
  position: absolute;
}

.right {
  height: 100%;
  margin-left: 265px;
  padding: 20px;
}

/* Small screens */

@media (max-width: 500px) {
  .outer {
    height: 100%;
    border-radius: 133px 5px 5px 5px;
  }

  .left,
  .right {
    height: 100%;
    width: 100%;
    margin: 10px;
    padding: 0 20px 0 20px;
    position: static;
  }

  .left {
    margin-top: 20px;
    margin-left: 20px;
    padding-left: 0;
  }

}