/*
 * Rangitaki Project
 *
 * 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.
 *
 * A stylesheet for overriding the default styles if the navigation drawer is disabled
 */

/*      BODY        */

body
    margin-top: 94px

.main
    height: 100%
    margin-left: 0

.overlay
    opacity: 0
    position: fixed
    top: 0
    left: 0
    background-color: black
    width: 100%
    z-index: 30
    height: 100%
    display: none

/*      HEADER      */
.header
    top: 0
    right: 0
    left: 0
    width: 100%
    height: 64px
    position: absolute

.title
    color: #fff
    font-size: 23px
    text-decoration: none
    line-height: 64px
    vertical-align: middle
    left: 75px

.title > a
    text-decoration: none
    color: #fff

.fadeout
    position: absolute
    height: 64px
    top: 0
    right: 0
    width: 40px

.nav-img
    height: 26px
    padding: 19px
    cursor: pointer

/*      NAV DRAWER      */

.nav
    width: 300px
    position: fixed
    height: 100%
    top: 0
    left: -301px
    z-index: 40

.nav-item, .nav-item-static
    text-decoration: none
    text-indent: 0
    display: inline-block
    height: 48px
    vertical-align: middle
    width: 284px
    line-height: 48px
    padding-left: 16px
    transition: background-color 125ms ease-in-out 0ms

.nav-close
    cursor: pointer

.nav-close-img
    height: 35px
    padding: 12px

.nav-item
    cursor: pointer

.divider
    width: 100%

/*      MAIN            */

.card
    margin-right: auto
    margin-left: auto
    width: 75%
    padding: 24px
    margin-bottom: 40px
    max-width: 1160px

.card a
    -moz-hyphens: auto
    -epub-hyphens: auto
    -ms-hyphens: auto
    -webkit-hyphens: auto
    hyphens: auto
    word-wrap: break-word

.card a:hover

.headline
    display: block
    padding-bottom: 8px

.card img
    max-width: 100%
    max-height: 400px
    display: block
    margin-left: auto
    margin-right: auto

.date

.articletext

.author
    display: block

.tag

.readmore
  padding: 12px 0 25px 0
 
/*      FAB             */

.fabmenu
    position: fixed
    bottom: 20px
    right: 20px

.fab
    height: 60px
    width: 60px
    border-radius: 30px
    cursor: pointer

.fab-img
    width: 28px
    padding: 15px

.subfab
    height: 45px
    width: 45px
    border-radius: 30px
    margin-right: auto
    margin-left: auto
    margin-bottom: 25px
    display: none

.subfab-img
    width: 22px
    padding: 12px

/* BUTTON */

.pag_buttons
    margin-right: auto
    margin-left: auto
    width: calc(75% + 48px)
    margin-bottom: 80px
    max-width: 1160px
    text-align: right

.button
    text-decoration: none
    color: #fff
    line-height: 36px
    min-width: 64px
    text-align: center
    height: 36px
    padding: 8px
    margin-top: 4px
    margin-bottom: 5px
    cursor: pointer

.pag_next
    margin-left: 8px

/*      FOOTER          */

.footer

.footer a
    transition: border-bottom-color 150ms ease-in-out 100ms

.footer a:hover
    border-bottom-color: #383838

@media screen and (min-width: 1440px)

    .nav
        left: 0
        padding-top: 64px

    .nav-close-img
        display: none

    .nav-close
        display: none

    .nav-img
        display: none

    .header
        left: 300px

    .main
        margin-left: 300px
        width: calc(100% - 300px)

@media screen and (max-width: 720px)

    .card
        width: 82%

    .pag_buttons
        width: calc(82% + 48px)