/*
Theme Name: Focusing Future
Author: Simon J.
Author URI: http://simonj.fi
Text Domain: focusingfuture
*/

.post_nav {
    margin: 1rem 0;
    text-align: center;
}

.flip_wrapper .frontside .image_container img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.link.active a {
    background-color: #DA0071;
    color: #fff;
    text-align: center;
    display: inline-block;
    padding: 0 0.5em;
}

.link.hide a {
    display: none;
}

.link.show + .link.hide:before {
    content: '...';
}

.link.hide + .link.hide {
    display: none;
}

#menu_opener,
[for="menu_opener"],
#header .mod_navigation:before {
    display: none;
}

/*.browser-safari .flip:hover .frontside,
.browser-safari .flip .flipside {
    -webkit-transform: none;
    transform: none;
}

.browser-safari .flip .flipside {
    display: none;
}

.browser-safari .flip:hover .flipside {
    display: block;
}*/

.front #logo {
    top: 40px;
    left: 40px;
}

.front #logo img {
    width: auto;
}

#logo .image_container img {
    visibility: hidden;
}

#logo .image_container {
    background-image: url(img/logo-new-w.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}

.front #logo .image_container {
    background-image: url(img/logo-new.png);
}

@media (max-width:1024px) {
    #header .level_1 li {
        font-size: 0.825rem;
        line-height: 1.75em;
    }

    #front .mod_search {
        bottom: 4.5em;
        right: 108px;
    }

    .flip:hover .flip_wrapper > div, 
    .flip_wrapper > div {
        transform: none;
        transition: none;
    }

    .flip .flipside {
        display: none;   
    }

    .flip:hover .frontside {
        opacity: 0.9;
        background-color: #000;
    }


}

@media (max-width:767px) {
    #header [for="menu_opener"] {
        width: 32px;
        height: 28px;
        right: 0;
        top: .25em;
        position: absolute;
        display: block;
        background-image: url(img/menu_opener.png);
        cursor: pointer;
    }

    #header .mod_navigation .level_1 {
        display: block;
    }

    [for="menu_opener"] + ul {
        max-height: 0;
        overflow: hidden;
        transition: max-height 250ms ease-in-out;
    }
    :checked + [for="menu_opener"] + ul {
        max-height: 1000px;
    }

    #logo .image_container {
        background-image: url(img/logo-new.png);
        background-size: contain;
    }

    .front #logo img {
        width: 75px;
    }
}