$footer_height: 1.5em $white: white

@mixin display-flex

display: -webkit-box
display: flex

@mixin flex-1

-webkit-box-flex: 1
flex: 1

*

-webkit-box-sizing: padding

body

font: 25px/1.5em  "Gill Sans", "Gill Sans MT", Calibri, sans-serif
color: #2c3e50
background: $white
margin: 0
min-height: 100vh

flex-direction: column
-webkit-box-orient: vertical
-webkit-box-direction: normal

@include display-flex

header

padding: 0 50px
background: #2c3e50
color: $white
h1
  font-size: 1.5em

main

padding: 1em
margin-bottom: $footer_height
position: relative

@include flex-1
@include display-flex

-webkit-box-align: center
align-items: center
-webkit-box-pack: center
justify-content: center

footer

text-align: center
position: fixed
bottom: 0
left: 0
right: 0
background: #2c3e50
color: #95a5a6
line-height: $footer_height

@include display-flex

flex-direction: row
-webkit-box-orient: horizontal
-webkit-box-direction: normal

a

color: inherit
text-decoration: none

.cell-button

flex: 0 0 3em
height: $footer_height
background: #34495e
a
  display: block
  height: 100%

.cell-center

@include flex-1
height: $footer_height
margin: 0
p
  margin: 0

.large

font-size: 3em

.line-numbers

margin-right: 10px
opacity: 0.4

.nolinenos

.line-numbers
  display: none

.full

top: 0
left: 0
bottom: 0
right: 0
position: absolute

.center

display: flex
align-items: center
justify-content: center

display: -webkit-box
-webkit-box-align: center
-webkit-box-pack: center

.hidden

opacity: 0
-webkit-transition-duration: 0.5s
-moz-transition-duration:    0.5s
transition-duration:         0.5s

.visible

opacity: 1

pre

max-width: 100vw
word-wrap: break-word