/*
 *The MIT License
 *
 *Copyright 2015 mmk2410.
 *
 *Permission is hereby granted, free of charge, to any person obtaining a copy
 *of this software and associated documentation files (the "Software"), to deal
 *in the Software without restriction, including without limitation the rights
 *to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 *copies of the Software, and to permit persons to whom the Software is
 *furnished to do so, subject to the following conditions:
 *
 *The above copyright notice and this permission notice shall be included in
 *all copies or substantial portions of the Software.
 *
 *THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 *IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 *FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 *AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 *LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 *OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 *THE SOFTWARE.
/*
 *  Created on : Jun 18, 2015, 6:39:37 PM
 *  Author     : mmk2410

$font: "Fira Sans", sans-serif

$background: #f0f0f0
$text-color: #383838
$primary-color: #4CAF50
$header-shadow: rgba(62, 62, 62, 0.45)
$white: #FFFFFF
$fadeout-color: rgba(30, 87, 153, 0)
$border: #e0e0e0
$active-color: #e2e2e2
$fab-shadow: rgba(62, 62, 62, 0.3)
$footer-background: #2D2D2D

body
  font-family: $font
  background: $background
  color: $text-color
  margin: 130px 0 0

::selection, ::-moz-selection
  color: $background
  background-color: $primary-color

.header
  height: 55px
  background-color: $primary-color
  position: fixed
  box-shadow: 2px 0 2px 2px $header-shadow

.title
  line-height: 55px
  color: $white
  position: absolute
  left: 0
  margin-left: calc(20% + 24px)
  > a
    color: $white
    text-decoration: none

.fadeout
  height: 55px
  background: -moz-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
  background: -webkit-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
  background: -o-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
  background: -ms-linear-gradient(left, $fadeout-color 0%, $primary-color 100%)
  background: linear-gradient(to right, $fadeout-color 0%, $primary-color 100%)

.nav-img
  padding: 14px 19px

.nav
  background-color: $white
  border-right: 1px solid $border

.nav-item, .nav-item-static
  color: $text-color

.nav-item
  font-weight: 600
  &:hover
    color: $primary-color
  &:active
    background-color: $active-color

.divider
  border-bottom: 1px solid $border

.card
  background: none
  border-radius: 0
  box-shadow: none
  margin: 0 20% 100px
  width: auto
  a
    color: $primary-color
    text-decoration: none
    border-bottom: 1px solid transparent
    transition: border-bottom-color 150ms ease-in-out 100ms
    &:hover
      border-bottom-color: #4CAF50

.headline
  font-size: 30px
  line-height: 50px
  color: #383838 !important
  text-decoration: none
  border-bottom: none !important
  &:hover
    color: #4CAF50 !important

.date
  font-size: 13px

.articletext
  margin-top: 30px
  font-size: 16px
  line-height: 30px

.author, .tag
  font-size: 13px

.fab
  background-color: $primary-color
  box-shadow: 0 1px 1.5px 1.5px $fab-shadow

.subfab
  background-color: $white
  box-shadow: 0 1px 1.5px 1.5px $fab-shadow

.button
  color: $primary-color
  border-bottom: 1px solid transparent
  margin: 0
  min-width: 0
  padding: 0
  line-height: 16px
  height: 16px
  transition-property: border-bottom-color
  transition-delay: 50ms
  transition-duration: 125ms
  transition-timing-function: ease
  -moz-transition-property: border-bottom-color
  -moz-transition-delay: 50ms
  -moz-transition-duration: 125ms
  -moz-transition-timing-function: ease
  -webkit-transition-property: border-bottom-color
  -webkit-transition-delay: 50ms
  -webkit-transition-duration: 125ms
  -webkit-transition-timing-function: ease
  &:hover
    border-bottom-color: $primary-color

.pag_prev
  float: left

.button:last-child
  float: none

.footer
  text-align: center
  height: 60px
  background-color: $footer-background
  line-height: 60px
  width: 100%
  color: $white
  a
    color: $white
    text-decoration: none
    border-bottom: 1px solid transparent
    &:hover
      border-bottom-color: $white

.hljs
  background: none

@media screen and (min-width: 1440px)
  .title
    margin-left: calc(20% - 40px)
  .nav
    padding-top: 55px

@media screen and (max-width: 800px)
  body
    margin-top: 80px
  .title
    margin-left: 20%
  .card
    margin: 0 5% 100px