/* Container */
.elasto-container:after {
  content: '';
  display: table;
  clear: both;
}

/* Square */
.elasto-container .elasto-square {
  position: relative;
  float: left;
  overflow: hidden;
}

/* Square background */
.elasto-container .elasto-square-bg {
  z-index: 0;
  position: absolute;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  margin: 0px;
  background-image: linear-gradient(135deg, #d87933, #dd2c55);
  opacity: 0.7;
}

/* Square text overlay */
.elasto-container .elasto-square-wrap {
  position: absolute;
  bottom: 0;
  width: calc(100% - 40px);
  padding: 20px;
  background-color: rgba(255, 255, 255, 0.7);
}

/* Square background on hover and active */
.elasto-container .elasto-square:hover .elasto-square-bg,
.elasto-container .elasto-square.active .elasto-square-bg,
.elasto-container .elasto-square.active:hover .elasto-square-bg {
  opacity: 1;
}

/* Square background when active */
.elasto-container .elasto-square.active .elasto-square-bg,
.elasto-container .elasto-square.active:hover .elasto-square-bg {
  -webkit-box-shadow: inset 0px 0px 0px 5px #fff;
  -moz-box-shadow: inset 0px 0px 0px 5px #fff;
  box-shadow: inset 0px 0px 0px 5px #fff;
}

/* Square text overlay on hover and active */
.elasto-container .elasto-square:hover .elasto-square-wrap,
.elasto-container .elasto-square.active .elasto-square-wrap,
.elasto-container .elasto-square.active:hover .elasto-square-wrap {
  background-color: rgba(255, 255, 255, 0.9);
}

/*# sourceMappingURL=elasto.css.map */