@ -4,10 +4,10 @@ html
width 1 0 0 %
width 1 0 0 %
height 1 0 0 %
height 1 0 0 %
overflow hidden
overflow hidden
font 4 0 0 1 . 3em/ 1 . 1 em $bodyTypeSans
font 4 0 0 1 . 2em/ 1 . 4 em $bodyTypeSans
body
body
color white
background $ white
margin 0
margin 0
padding 0
padding 0
perspective 1 p x
perspective 1 p x
@ -30,64 +30,43 @@ svg.icons
f i l l $white
f i l l $white
header
header
box-sizing border-box
background $primary
min-height 1 0 0 v h
height 9 0 %
position relative
width 1 0 0 %
transform - style i n h e r i t
border - top $white 3 p x s o l i d
width 1 0 0 v w
nav
/ / text-align center
width 9 7 %
color $white
margin 1 0 p x a u t o
border - bottom 1 p x $black s o l i d
color $primary
border - top 5 p x $primary s o l i d
. left , . right
span
width 5 0 %
margin 0
display inline-block
position absolute
vertical-align top
top 5 0 %
. left
left 5 0 %
a . logo-link
transform translate ( - 5 0 % , - 5 0 % )
border - bottom none
font - w e i g h t : 6 0 0
margin 0 0 2 0 p x 0
padding 1 5 p x 2 0 p x 1 0 p x 2 0 p x
display block
font - size 3 e m
# l o g o
line-height 1
width 5 0 p x
color $white
border - bottom none
text-drop-shadow ( $black , . 9 , 1 p x , 1 p x , 1 p x )
. right
. menu
text-align right
padding 2 0 p x
width : 2 0 0 p x
text-align : left
color $primary
a . menu-link
a . menu-link
background $secondary
background $secondary
margin - bottom 4 p x
margin - bottom 4 p x
padding 3 p x
padding 3 p x
border - r a d i u s 3 p x
border - r a d i u s 2 p x
display inline-block
display inline-block
font - size 0 . 8em
font - size 0 . 8em
border - bottom none
& : h o v e r
& : h o v e r
background $secondary + 2 0 %
background $secondary + 5 0 %
# l o g o
width 3 0 p x
header , header : b e for e
background 5 0 % 5 0 % / c o v e r
header : : b e for e
content " "
position absolute
top 0
left 0
right 0
bottom 0
display block
background - size cover
transform - o r i g i n center center 0
transform translateZ ( - 1 p x ) scale ( 2 )
z-index - 1
min-height 1 0 0 v h
. container
. container
z-index 2
z-index 2
position absolute
top 1 0 0 v h
background $white
background $white
line-height 3 0 p x
line-height 3 0 p x
font - w e i g h t l i g h t e r
font - w e i g h t l i g h t e r
@ -99,16 +78,62 @@ header::before
width : 8 0 %
width : 8 0 %
height 8 0 %
height 8 0 %
max-width 8 4 0 p x
max-width 8 4 0 p x
min-height 5 0 0 p x
/ / min-height 5 0 0 p x
background $white
background $white
vertical-align top
vertical-align top
color $black
color $black
margin 0 a u t o
margin 0 a u t o
span
/ / . index , . page
custom-header ( 6 0 0 , 2 e m , 1 . 5 , $primary )
/ / margin 3 0 p x
. index , . page
. index , . page
margin 3 0 p x
padding 0 0 1 5 p x 0
. index
img
display block
width 1 0 0 %
h1
color $primary
p
font 3 0 0 1 . 25em / 1 . 6em $bodyTypeSans
/ / meta d a t e a for page
. meta
font 5 0 0 0 . 8em / 1 . 3em $bodyTypeSans
padding 5 p x 0 0 0
border - top 1 p x s o l i d $primary
background $white + 1 0 %
a
font - size : 0 . 8em
font - w e i g h t 4 0 0
/ / a r c h i v e s t y l i n g
. archive-item
padding 1 5 p x 0 2 0 p x 0
span . year
font - size 1 . 5em
font - w e i g h t 5 0 0
padding 5 p x
display block
color $primary
. archive-month
display inline-block
vertical-align top
width 3 0 %
span . month
color $secondary
font - size 1 . 5em
font - w e i g h t 3 0 0
padding 5 p x
display block
section
padding 0 0 2 0 p x 0
background $primary
a
color $white
. index-lists , . page-title
max-width 8 4 0 p x
span
custom-header ( 6 0 0 , 2 e m , 1 . 5 , $white )
width 8 0 %
margin 0 a u t o
padding 2 0 p x 0 0 0
. recent , . featured
. recent , . featured
display inline-block
display inline-block
width 5 0 %
width 5 0 %
@ -118,26 +143,23 @@ header::before
color $white
color $white
font - size 1 . 5em
font - size 1 . 5em
line-height 1 . 3
line-height 1 . 3
. meta
label
font - size : 0 . 8em
a
font - size : 0 . 8em
section
color $white
. archive-item
display inline-block
width 3 0 %
vertical-align top
footer
footer
background $black
background $white - 5 %
padding 1 0 p x
padding 1 0 p x
color $white
color $primary
text-align center
font - size 0 . 8em
font - size 0 . 8em
font - w e i g h t 6 0 0
font - w e i g h t 6 0 0
height 1 0 0 p x
. inner
margin 2 0 p x a u t o
width 8 0 %
max-width 8 4 0 p x
a
color $secondary
/ **
/ **
@ -148,23 +170,34 @@ header::before
@media o n l y s c r e e n and ( max-width : 6 4 0 p x )
@media o n l y s c r e e n and ( max-width : 6 4 0 p x )
header
header
. menu
width 9 8 %
span
span
font - size 2 . 5em
font - size 2 . 5em
@media o n l y s c r e e n and ( max-width : 4 8 0 p x )
@media o n l y s c r e e n and ( max-width : 4 8 0 p x )
header
header
span
. menu
font - size 2 e m
width 9 6 %
width 6 0 %
. container
. index
article
p
. index , . page
font 4 0 0 0 . 8em / 1 . 3em $bodyTypeSans
margin 0
. recent , . featured
p
width 1 0 0 % !important
font 3 0 0 1 e m / 1 . 6em $bodyTypeSans
section
. index-lists
. recent , . featured
width 1 0 0 % !important
@media o n l y s c r e e n and ( max-width : 3 7 5 p x )
@media o n l y s c r e e n and ( max-width : 3 7 5 p x )
header
header
span
. menu
font - size 1 . 5em
width 9 5 %
width 7 5 %
. container
article
. index , . page
margin 0
p
font 3 0 0 0 . 9em / 1 . 7em $bodyTypeSans