*,*::after,*::before{margin:0;padding:0;box-sizing:inherit}html{font-size:62.5%}body{box-sizing:border-box;height:100vh;width:100vw;overflow:hidden;padding:2rem}@media only screen and (max-width: 900px){body{overflow:visible}}.cards{display:flex;justify-content:space-evenly;align-items:stretch;align-content:center;height:calc(100vh - 4rem);width:100%}@media only screen and (max-width: 900px){.cards{flex-direction:column;height:100%}}.card{width:100%;height:100%;box-shadow:0 1rem 3rem rgba(0, 0, 0, 0.2);border-radius:.5rem;overflow:hidden;background-image:linear-gradient(to bottom, #3b3b3b, #303030);position:relative}@media only screen and (max-width: 900px){.card{height:42rem;margin-bottom:2rem;margin-right:2rem}}.card:not(:last-child){margin-right:2rem}@media only screen and (max-width: 900px){.card:not(:last-child){margin-right:2rem}}.card__top-box{height:50%}.card__top-box--1{background-image:linear-gradient(to bottom left, #fa4932, #cc1800)}.card__top-box--2{background-image:linear-gradient(to bottom left, #adfa32, #85cc00)}.card__top-box--3{background-image:linear-gradient(to bottom left, #3299fa, #0081cc)}.card__avatar-image{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:block;border-radius:50%;border:.3rem solid #fff;width:50%}@media only screen and (max-width: 900px){.card__avatar-image{height:30rem;width:30rem}}@media only screen and (max-width: 600px){.card__avatar-image{height:20rem;width:20rem}}@media only screen and (max-width: 245px){.card__avatar-image{height:15rem;width:15rem}}/*# sourceMappingURL=style.css.map */