.card { display: flex; box-sizing: border-box; max-width: calc(540rem / 16); padding: calc(24rem / 16); border-radius: calc(4rem / 16); background-color: white; } .poster { width: calc(150rem / 16); height: calc(150rem / 16); margin-right: calc(20rem / 16); } .details { position: relative; width: 100%; } .name { color: var(--purple-2); font-weight: bolder; font-size: calc(18rem / 16); line-height: calc(27rem / 16); margin: 0; } .desc { color: var(--purple-2); margin-top: calc(12rem / 16); } .spacer { height: calc(35rem / 16); } .button { position: absolute; bottom: 0; left: 0; } .logo { width: calc(30rem / 16); position: absolute; bottom: 0; right: 0; } .setting { margin: 0; color: var(--blue-1); font-weight: bolder; font-size: calc(14rem / 16); } @media only screen and (max-width: calc(768rem / 16)) { .card { padding: 0; background-color: #e1eefa; } }