.page{position:relative;background:linear-gradient(-150deg,transparent 1.5em,#fff 0);color:#fff;border-radius:.15em;transform:rotate(5deg)}.remove-corner{border-radius:0 9% 0 0}.page:before{z-index:100000;content:"";position:absolute;top:0;right:0;width:1.73em;height:3em;background:linear-gradient(to left bottom,transparent 50%,rgba(0,0,0,.2) 0,rgba(0,0,0,.4)) 100% 0 no-repeat;transform:translateY(-1.3em) rotate(-30deg);transform-origin:bottom right;border-bottom-left-radius:.5em;box-shadow:-5px 5px 10px rgba(0,0,0,.2)}@media(width <= 700px){.remove-corner{border-radius:0 20% 0 0}}.flip-card-scene{width:100%;height:70vh;perspective:1500px}.flip-card-row{display:flex;height:100%;justify-content:space-between}.flip-card-col{--card-margin:50px;width:100%;border-radius:5px;margin:0 var(--card-margin)}.flip-card-col,.flip-card-text{text-align:center;align-items:center}.flip-card-text{padding:5%;display:flex;height:100%}.card{position:relative;width:100%;height:100%;cursor:pointer;transform-style:preserve-3d;transform-origin:center right;transition:transform 1s}.card.is-flipped{transform:rotateY(180deg)}.card__face{position:absolute;width:100%;height:100%;color:#fff;text-align:center;font-weight:700;font-size:40px;backface-visibility:hidden;transition:.2s;background-size:cover;background-repeat:no-repeat;border-radius:5px;-o-border-image:linear-gradient(to right bottom,#ffe694,#af8600 50%,#fc2) 1;border-image:linear-gradient(to right bottom,#ffe694,#af8600 50%,#fc2) 1;border:8px solid #ffd900;box-shadow:0 8px 15px rgba(0,0,0,.2),inset 0 2px 4px hsla(0,0%,100%,.6),inset 0 -2px 8px rgba(0,0,0,.4)}.card__face:hover{box-shadow:0 3px 8px rgba(0,0,0,.8)}.card__face--front{background-image:url(/hirsh-picture.jpeg)}.card__face--back{background-image:url(/hirsh-dogs.jpeg);transform:rotateY(180deg) translateX(calc(2 * var(--card-margin)))}.card__face--front:hover{transform:scale(1.02)}.card__face--back:hover{transform:rotateY(180deg) scale(1.02) translateX(calc(2 * var(--card-margin)))}@media (max-width:768px){.flip-card-row{flex-direction:column}.flip-card-col{margin:20px 0}.flip-card-scene{height:40vh}.card{transform-origin:center bottom}.card.is-flipped,.card__face--back{transform:rotateX(-180deg)}.card__face--back:hover{transform:rotateX(-180deg) scale(1.02)}}.scene{--face-width:250px;--z-translation:215px;width:var(--face-width);height:200px;margin:80px auto;perspective:800px}.cube{width:100%;height:100%;position:relative;transform-style:preserve-3d;transition:transform .5s;cursor:grab;display:flex;align-items:center}.cube:active{cursor:grabbing}.cube__face{-webkit-user-select:none;-moz-user-select:none;user-select:none;position:absolute;width:var(--face-width);height:200px;font-weight:700;color:#fff;text-align:center;backface-visibility:hidden;-o-border-image:linear-gradient(to right bottom,#ffe694,#af8600 50%,#fc2) 1;border-image:linear-gradient(to right bottom,#ffe694,#af8600 50%,#fc2) 1;border-style:solid;border-width:3px;background-position:50%;background-size:cover;background-repeat:no-repeat;font-size:35px}.face-1{transform:rotateY(0deg) translateZ(var(--z-translation))}.face-2{transform:rotateY(60deg) translateZ(var(--z-translation))}.face-3{transform:rotateY(120deg) translateZ(var(--z-translation))}.face-4{transform:rotateY(180deg) translateZ(var(--z-translation))}.face-5{transform:rotateY(240deg) translateZ(var(--z-translation))}.face-6{transform:rotateY(300deg) translateZ(var(--z-translation))}@media (width <= 700px){.scene{--face-width:200px;height:200px}.cube{--z-translation:170px}.cube__face{height:200px}}