Files
folio/app/assets/css/main.css
T

82 lines
1.3 KiB
CSS

@font-face {
font-family: 'SohneBuch';
src:
url('/Sohne-font-main/Sohne-Buch.woff') format('woff'),
url('/Sohne-font-main/Sohne-Buch.ttf') format('truetype');
}
:root {
/* --font: 'Baskervville', serif; */
--font: 'EB Garamond', serif;
/* --font: "SohneBuch", sans-serif; */
--text: #333;
--muted: #666;
--bg: #fbfbf7;
}
.flex {
display: flex;
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.flex-ff {
flex: 1;
}
.row {
flex-direction: row;
}
.col {
flex-direction: column;
}
* {
box-sizing: border-box;
}
html,
body {
margin: 0;
padding: 0;
background: var(--bg);
overscroll-behavior: none;
}
body {
font-family: var(--font);
color: var(--text);
font-size: 16px;
line-height: 1.6;
}
.punch-link {
display: inline-block;
vertical-align: bottom;
position: relative;
color: var(--bg);
text-decoration: none;
transition: all 200ms ease;
padding: 0 4px;
margin: 0 -4px;
background-image: linear-gradient(var(--bg), var(--bg));
background-size: 100% 1px;
background-position: bottom;
background-repeat: no-repeat;
mix-blend-mode: screen;
}
.punch-link:hover {
background-size: 100% 100%;
background-image: linear-gradient(#fff, #fff);
color: #000;
}