@import url('https://fonts.googleapis.com/css2?family=Playfair+Display+SC:wght@400;700&family=Roboto:wght@100;300;400;500;700&display=swap');

body { background: linear-gradient(164deg, rgba(255,251,226,1) 0%, rgba(238,223,192,1) 100%); font-family: 'Roboto', sans-serif; font-size: 12px; line-height: 1.2; letter-spacing: 0.5px; min-height: 100vh;  }
a { color: #7c7a6b!important; }
a:hover { color: #b3bca1!important; }


header { border-bottom: solid 1px #b3bca1; }
header .header-top { background: linear-gradient(90deg, rgba(255,242,213,1) 0%, rgba(255,241,208,1) 50%, rgba(255,242,213,1) 100%); padding: .5rem; margin-bottom: .5rem;  }
header .navbar-nav.social { font-size: 1.2rem; flex-direction: row!important;}

header .navbar-nav.site-menu { text-transform: uppercase; font-size: 1rem; font-weight: 300; }
header .navbar-nav.site-menu .nav-link.active { font-weight: 400; color: #000; }

.msry-categories .card { border: none; padding: 0; margin-right: 5px; background: transparent; position: relative; }
.msry-categories .card:before { content: ''; position: absolute; top: 50%; left: 50%; width: 0; height: 0%; background: rgba(0,0,0, 0.2); transition: all 100ms linear; transform: translate(-50%, -50%); }
.msry-categories .card:hover:before { width: 100%; height: 100%; }
.msry-categories .card img { height: 300px; min-width: 240px; width: auto; object-fit:cover; }
.msry-categories .card .card-title { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 95%;  font-size: 0.8rem; font-weight: 400; text-transform: uppercase; white-space: nowrap;  padding: 4px 10px; border: solid 1px #b3bca1; border-radius: 5px; }