@import ‘base’ @import ‘book_content’

body, div, html, p

margin 0
padding 0

body

font-family system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-weight normal
font-size 20px

p

margin 0
text-indent 0

a

text-decoration inherit
text-decoration-color inherit
color inherit

&:hover
  text-decoration underline

normal_color = rgba(255, 255, 255, 0.82) selected_color = #6D3102 left_align = 40px header_underline_height = 6px

header_height = 60px

header

height header_height
width 100%
position fixed
top 0px
z-index 10000

background-color #C5946C
box-shadow 1px 1px 10px rgba(0, 0, 0, 0.4)

header_content

height 100%
max-width 1200px
margin 0 auto
position relative

ul
  padding 0
  margin 0 0 0 left_align
  position absolute
  bottom header_underline_height

  li
    display inline
    list-style none
    padding 0
    margin 0 10px
    font-size (header_height / 1.8px)
    color normal_color
    border-bottom solid header_underline_height transparent

    a
      text-decoration inherit
      color inherit

    &:first-child
      margin-left 0

    &:hover
      text-decoration underline
      color selected_color
      border-bottom-color selected_color

    &.selected
      color selected_color
      border-bottom-color selected_color

main

display -webkit-flex // Safari
display flex
flex-flow row wrap

max-width 1200px

margin 0 auto
margin-top header_height + 20px

content

flex 5

.toc_content

margin-left 40px

div.cover_image

flex 1
margin-right 40px
margin-left left_align

max-width 250px

div
  box-shadow 1px 1px 10px rgba(0, 0, 0, 0.4)

  img
    width 100%

h1.meta_section

font-weight normal
font-size 36px
color text_color
margin-bottom 0

&:first-child
  margin-top 0

td.book_meta_key

text-align right
font-size 14px
color text_color
vertical-align baseline
padding-right 8px

td.book_meta_value

font-size 20px
vertical-align baseline

p.target_selected

font-weight bold

ul.spine

padding-left 0
margin-top 0

& &
  padding-left 30px

li
  list-style none
  line-height 1.4em

  span.title
    color text_color
    text-decoration-color text_color

  span.option
    opacity .5
    padding .1em .3em
    font-size 12px
    background-color #D8D8D8
    border solid 1px #979797
    border-radius 5px

  a.toc_href
    color rgba(0, 0, 0, 0.5)

footer

margin-top 50px
border-top solid 1px text_color
padding 10px 0
width 100%

p
  text-align center
  color gray
  font-size 10px

p.file

font-size 16px

span.arrow
  font-family monospace
  color text_color