resilien/assets/styles/main.sass

70 lines
1.8 KiB
Sass

$size-small: 400px
body
color: #2d3824
background: #fff8eb
font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
margin: 0 auto
padding: 0 1rem
max-width: 800px
font-size: 1.125rem
// background-image: repeating-conic-gradient(#fff 0 9deg, rgba(0, 0, 0, .1) 9deg 18deg)
// background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCI+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIyIiBoZWlnaHQ9IjEiIGZpbGw9IiNjY2MiPjwvcmVjdD4KPHJlY3QgeD0iNSIgeT0iNSIgd2lkdGg9IjIiIGhlaWdodD0iMSIgZmlsbD0iI2NjYyI+PC9yZWN0Pgo8L3N2Zz4=")
@media screen and (max-width: $size-small)
font-size: 1rem
hr
background: repeating-linear-gradient(90deg, transparent, transparent 9px, black 10px)
height: 12px
margin: 2em auto
position: relative
border: 0
ul.no-style
margin: 0
padding: 0
list-style-type: none
a, h1, h2, h3
color: #c14508
h1
text-align: center
.footer
font-size: 0.8rem
.services
margin: 0
padding: 0
list-style-type: none
$tile: 1rem
width: calc(100% + 2*$tile)
margin-left: -$tile
display: flex
flex-wrap: wrap
li
text-align: center
padding: $tile
flex: 0 0 calc(100% * 6 / 12)
box-sizing: border-box
img
max-width: 100%
width: 40%
.contacts
width: 100%
// Grid
.grid { display: flex; flex-wrap: wrap; }
.grid.\-middle { align-items: center; }
.cell { flex: 1; box-sizing: border-box; }
.cell.\-left { text-align: left ;}
.cell.\-right { text-align: right; }
.cell.\-center { text-align: center ;}
.cell.\-6of12 { flex: 0 0 calc(100% * 6 / 12); }
@import "../../themes/hugo-theme-lowtech/assets/styles/obfuscates"