/* * * Perpetua * */ .perpetua:before, .perpetua:after { content: ''; display: block; height: 100%; width: 100%; top: 0; left: 0; position: absolute; pointer-events: none; } .perpetua { position: relative; } .perpetua img { width: 100%; z-index: 1; } .perpetua:before { z-index: 2; } .perpetua:after { z-index: 3; } .perpetua:after { background: -webkit-linear-gradient(top, #005b9a, #e6c13d); background: linear-gradient(to bottom, #005b9a, #e6c13d); mix-blend-mode: soft-light; opacity: .5; }