.card { font-size: 14px; display: flex; flex-direction: column-reverse; background-color: #fff; border-radius: var(--Corner-radius-Large); border: 1px solid var(--Base-Border-Subtle); position: relative; } .cardBody { display: flex; flex-direction: column; } .specification { display: flex; flex-direction: row; align-items: center; gap: var(--Spacing-x1); padding: 0 var(--Spacing-x1) 0 var(--Spacing-x-one-and-half); height: 40px; } .specification .guests { border-right: 1px solid var(--Base-Border-Subtle); padding-right: var(--Spacing-x1); } .specification .button { margin-left: auto; padding: 0 0 0 var(--Spacing-x-half); text-decoration: none; } .container { padding: var(--Spacing-x1) var(--Spacing-x2) var(--Spacing-x2); display: flex; flex-direction: column; gap: var(--Spacing-x2); } .roomDetails { display: flex; flex-direction: column; gap: var(--Spacing-x1); margin-bottom: var(--Spacing-x2); } .name { display: inline-block; } .card img { max-width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--Corner-radius-Medium) var(--Corner-radius-Medium) 0 0; } .flexibilityOptions { display: flex; flex-direction: column; gap: var(--Spacing-x2); } .roomsLeft { position: absolute; top: 12px; left: 12px; background-color: var(--Main-Grey-White); padding: var(--Spacing-x-half) var(--Spacing-x1); border-radius: var(--Corner-radius-Small); } .imageContainer { min-height: 185px; position: relative; }