/*
 * Index card hover effects/styling 
 *
 * @author Lewis Wright
 * @version 2023.01.03
 */
 
.card-int:after,.card-int:before{content:"";position:absolute;top:0;left:0;pointer-events:none}.padding1{padding:1rem}:root{--d:700ms;--e:cubic-bezier(0.19, 1, 0.22, 1)}.all-int{box-sizing:border-box;height:100%;display:grid;place-items:center}.page-content-int{display:grid;grid-gap:1rem;padding:1rem;max-width:1024px;margin:0 auto;font-family:var(--font-family-sans-serif)}.card-int,.content-int{position:relative;display:flex;width:100%;padding:1rem}@media (min-width:800px){.page-content-int{grid-template-columns:repeat(3,1fr)}}.card-int{align-items:flex-end;overflow:hidden;text-align:center;color:#f5f5f5;background-color:#f5f5f5;box-shadow:0 1px 1px rgba(0,0,0,.1),0 2px 2px rgba(0,0,0,.1),0 4px 4px rgba(0,0,0,.1),0 8px 8px rgba(0,0,0,.1),0 16px 16px rgba(0,0,0,.1)}@media (min-width:600px){.page-content-int{grid-template-columns:repeat(3,1fr)}.card-int{height:350px}}.card-int:before{width:100%;height:110%;background-size:cover;background-position:0 0;transition:transform calc(var(--d) * 1.5) var(--e)}.card-int:after{display:block;width:100%;height:200%;background-image:linear-gradient(to bottom,rgba(0,0,0,0) 0,rgba(0,0,0,.009) 11.7%,rgba(0,0,0,.034) 22.1%,rgba(0,0,0,.072) 31.2%,rgba(0,0,0,.123) 39.4%,rgba(0,0,0,.182) 46.6%,rgba(0,0,0,.249) 53.1%,rgba(0,0,0,.32) 58.9%,rgba(0,0,0,.394) 64.3%,rgba(0,0,0,.468) 69.3%,rgba(0,0,0,.54) 74.1%,rgba(0,0,0,.607) 78.8%,rgba(0,0,0,.668) 83.6%,rgba(0,0,0,.721) 88.7%,rgba(0,0,0,.762) 94.1%,rgba(0,0,0,.79) 100%);transform:translateY(-50%);transition:transform calc(var(--d) * 2) var(--e)}.card-int:first-child:before{background-image:url(/img/index-splash-rome.png)}.card-int:nth-child(2):before{background-image:url(/img/index-splash-pokemon.jpg)}.card-int:nth-child(3):before{background-image:url(/img/index-splash-sims.png)}.card-int:nth-child(4):before{background-image:url(/img/Pokemon/Download/000MS.png)}.content-int{flex-direction:column;align-items:center;transition:transform var(--d) var(--e);z-index:1}.content-int>*+*{margin-top:1rem}.content-int>a.btn{box-shadow:5px 5px 10px rgba(0,0,0),-5px -5px 10px rgba(0,0,0,.4);border-radius:50rem}.title-int{font-size:1.3rem;font-weight:700;line-height:1.2;text-shadow:1px 1px 2px #000}.copy-int{font-size:1.125rem;font-style:italic;line-height:1.35}@media (hover:hover) and (min-width:600px){.card-int:after{transform:translateY(0)}.content-int{transform:translateY(calc(100% - 4.5rem))}.content-int>:not(.title-int){opacity:0;transform:translateY(1rem);transition:transform var(--d) var(--e),opacity var(--d) var(--e)}.card-int:focus-within,.card-int:hover{align-items:center}.card-int:focus-within:before,.card-int:hover:before{transform:translateY(-4%)}.card-int:focus-within:after,.card-int:hover:after{transform:translateY(-50%)}.card-int:focus-within .content-int,.card-int:hover .content-int{transform:translateY(0)}.card-int:focus-within .content-int>:not(.title-int),.card-int:hover .content-int>:not(.title-int){opacity:1;transform:translateY(0);transition-delay:calc(var(--d) / 8)}.card-int:focus-within .content-int,.card-int:focus-within .content-int>:not(.title-int),.card-int:focus-within:after,.card-int:focus-within:before{transition-duration:0s}}