/* Main stuff */
.svg-inverted-mask {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%; }

.mask__shape {
  fill: white; }

.box-with-text {
  position: absolute;
  top: 50%;
  width: 100%;
  padding-top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  /* Hide the line */ }
  .box-with-text:after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 2px solid #fff6cc; }

/* Visible fill of text */
.text-fill {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  overflow: hidden;
  background: url("../img/image4.jpg") 50% 50%/cover; }

/* Fill of inverted mask */
.shape--fill {
  fill: #fff6cc; }

/* Transparent copy of text to keep
				 patterned text selectable */
.text--transparent {
  fill: transparent; }

/* Other stuff */
html,
body {
  height: 100%; }

body {
  background: #fff6cc; }

.svg-defs {
  width: 0;
  height: 0; }

.wrap {
  width: 50%;
  position: relative;
  font: 800 14.5em/1 Open Sans, Impact;
  text-transform: uppercase;
  margin: 0 auto;
  text-align: left;
  overflow: hidden;
  padding: 80px 0; }

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