/*!
Theme Name: Optics-MWS
Template:   optics
Theme URI: https://markus-spring.info/themes/optics-mws
Author: Markus Spring
Author URI: https://markus-spring.info
Description: Child theme of graphpaperpress optics
Version: 1.0.1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mws optics
Tags: two-columns, three-columns, right-sidebar, flexible-header, custom-background, custom-header, custom-menu, featured-images, full-width-template, post-formats, threaded-comments, translation-ready, blog, photography, portfolio

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

mws-Optics ist based on optics

Optics is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*
   $Id: style.css,v 1.3 2018/04/06 08:31:47 springm Exp springm $
   $Header: /www/vhosts/mediawiki-wp/wp/wp-content/themes/optics-mws/RCS/style.css,v 1.3 2018/04/06 08:31:47 springm Exp springm $
   $Date: 2018/04/06 08:31:47 $
   $Revision: 1.3 $
   $Author: springm $

   $Log: style.css,v $
   Revision 1.3  2018/04/06 08:31:47  springm
   Summary: before changing mosaic box sizes

*/

/* fonts */

/* @font-face { */
/* 	font-family: RalewayHeavy;   */
/* 	src: local('RalewayHeavy'),  */
/* 		url("Raleway-Black.ttf") format('truetype');   */
/* 	font-weight: normal;   */
/* } */

/* @font-face { */
/* 	font-family: RobotoCondensed;   */
/* 	src: local('RobotoCondensed'),  */
/* 		url("RobotoCondensed-Regular.ttf") format('truetype');   */
/* 	font-weight: normal;   */
/* } */

/* site */

body {
    /* font-family: RobotoCondensed, Arial; */
    /* font-size: 1.2rem; */
    background-color: #484848;
}

.site {
    background-color: #f8f8f8;
    background-color: #444 ;
    color: white;
}

.site-branding {
    color: white;
    text-align: right;
}

.site-main .red-wrapper {
    margin-top: .2rem;
}

.site-content {
    /* padding: 5% 0 0 2%; */
    /* width: 79%; */
    color: white;
}

.site-content .content-area {
    width: 100%;
}

.site-branding {
    @media screen and (min-width: 1024px) {
        text-align: right;
    }
    /* margin-right: 1.8em; */
}

.site-header {
    /* width: 21%; */
    color: white;
}

.site-title {
    text-transform: none;
    font-size: 1.9rem;
}

@media screen and (max-width: 50em) {
    /* .site-header { */
    /*     padding-right: 0; */
    /* } */
    /* .site-title { */
    /*     font-size: 1.1rem; */
    /* } */
    .menu-primary-container {
        background-color: #666;
    }
}

#primary {
    /* margin-right: 0; */
}

.entry-content {
    margin-top: 0;
}
.entry-content:first {
    margin-top: 3em;
}
@media screen and (max-width: 1024px) {
    /* .entry-content { */
    /*     margin-top: 0; */
    /* } */
    .entry-content:first {
        margin-top: .5rem;
    }
    .site-branding {
        margin-bottom: .5rem;
    }
    .menu-primary-container {
        background-color: transparent;
    }
}

.entry-meta, .entry-footer, .wp-caption-text {
    /* font-size: 100%; */
    /* opacity: 0.6; */
}

footer.entry-footer:before {
    border-top: none;
    margin-top: 0;
}
footer.entry-footer {
    margin-bottom: 0;
}
@media screen and (min-width: 1024px) {
    footer.entry-footer:before {
        border-top: 1px solid grey;
        margin-top: 2em;
    }
    footer.entry-footer {
        margin-bottom: 8em;
    }
    .menu-primary-container {
        background-color: transparent;
    }
}

span.entry-footer::before {
    border-top: 1px solid grey;
}

span.entry-footer:empty::before {
    border-top: none;
}

.comment-meta {
    /* font-size: 100% !important; */
    /* padding-left: 4em; */
}

.comment-author {
    /* font-size: 100% !important; */
}    

.comment-reply-title, .comments-title {
    font-size: 1em !important;
}

.comment-form-subscriptions label {
    width: 100% !important;
}

/* .entry-footer::before { */
    /* display: inline;  */
    /* border-top: none; */
    /* padding-bottom: 0; */
    /* margin-top: 0; */
/* } */

/* ------------------------------------------------------------- menu --- */

a[href$="books\/"], a[href$="search\/"] {
    margin-top: 0.5em;
}

/* ------------------------------------------------------- navigation --- */
@media screen and (min-width: 1024px) {
    .main-navigation li {
        text-align: right;
    }
}

button.menu-toggle {
    /* width: 50%; */
    /* color: black; */
    /* background-color: #ddd; */
    /* border: 1px solid grey; */
}

nav#site-navigation.main-navigation.toggled {
    /* width: 50%; */
    /* margin-left:25%; */
    background-color: #666;
}

nav#site-navigation.main-navigation.toggled button.menu-toggle {
    width: 100%;
}

.post-navigation a {
    display: inline;
}

.nav-previous::before {
    content: '<< ';
}

.nav-next::after {
    content: ' >>';
}

.site-main .comment-navigation, .site-main .post-navigation {
    border-top: 1px solid grey;
    border-bottom: 1px solid grey;
    opacity: 0.6;
}

@media screen and (max-width: 50em) {
    .site-branding {
        text-align: left;
    }
    .main-navigation {
        position: fixed;
        /* position: absolute; */
        top: 2.5em;
    }
    .main-navigation label {
        position: absolute;
        top: -0.3em;
        right: -.3em;
        display: block;
        min-height: 3em;
    }
    .main-navigation label::after {
        position: absolute;
        right: 2em;
        top: -1.3em;
        content: "\2261";
        font-size: 1.8em;
        color: #4d4d4d;
        color: white;
    }
    .menu-primary-container {
        /* background-color: transparent; */
        background-color: #666;
        opacity: 0.98;
    }
    li.menu-item {
        text-align:right;
        padding-right:1.3em;
    }
}

#site-navigation input.menu-toggle {
    position: absolute;
    top: -9999px;
    left: -9999px;
}
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
/* ----------------------------------------------------------- images --- */

.size-large {
    border: 1px solid #ddd;
}

.gallery-thumb {
    margin-right: 1em;
    margin-bottom: 1em;
}

figure {
    margin: 0;
}

/* ------------------------------------------- custom post-type image --- */
.format-image {
    margin-top: -0.5em !important;
}

.format-image .entry-title {
    /* font-family: RobotoCondensed; */
    font-size: 1rem !important;
}

.mycaption {
    float: right;
    margin-top: -1.5em;
}

.image-header, .inline-caption {
    display: inline-block;
}

.format-image p {
    margin: 0 0 1em 0;
}

.format-image+.entry-meta {
    margin-top: 1em;
}

/* --------------------------------------- origamiez-style start page --- */
#red-wrapper {
    width: 100%;
}

/* http://www.javascriptkit.com/dhtmltutors/cssmediaqueries2.shtml */

.box, .rbox {
    display: inline-block;
    width: 140px;
    height: 140px;
    float: left;
    border: 1px solid #f4f4f4;
/* https://www.cssmatic.com/box-shadow */
    -webkit-box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.15);
    -moz-box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.15);
    box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.15);
}

.rbox {
    float: right;
}

.box1 {
    width: 280px;
    height: 280px;
    float: left;
    -webkit-box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.2);
    -moz-box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.2);
    box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.2);
}

@media screen and (min-width: 600px){
    .box, .rbox {
        width: 270px;
        height: 270px;
        margin: 0 10px 10px 0;
    }
    .box1 {
        width: 550px;
        height: 550px;
        margin: 0 10px 10px 0;
    }
}


.imagetitlebar {
    position: relative;
    width: 100%;
    bottom: 7em;
    padding: 1em;
    background: #222;
    display: none;
}

.box:hover>div {
    display: block;
    opacity: 0.75;
}

.box a:hover>span {
    font-weight: bold;
}

.box a {
    text-decoration: none;
}

/* --------------------------------------------------------- blogroll --- */

ul.blogroll {
    margin-left: 0;
}

.linkhead {
    margin-top: 1em;
    list-style-type: none;
    font-weight: bold;
}

.linkhead:first-child {
    margin-top: 0;
}

/* --------------------------------------------------------- archives --- */

h1.page-title {
    margin-top: 0;
    font-size: 1.6rem;
}

h1.entry-title {
    /* margin-top: 0; */
    font-size: 1.6rem;
}

h1.entry_title, .image-mosaic {
    margin-top: 0;
    font-size: 1.6rem;
}

#archive-monthly ul, #archive-category ul  {
    margin-left: 0;
}

.mosaic-tile {
    display: inline-block;
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
    width: 260px;
    height: 260px;
}

.mosaic-tile>div {
    bottom: 5em;
}

/* --------------------------------------------------- search results --- */

/* .search-result > header > h2 { */
.search-result h2 {
    display: inline;
}

.search-result h2 a {
    text-decoration: none;
}

.search-result .box2 {
    margin-right: 2em;
}

/* ---------------------------------------------------- comments page --- */
.comments-page .entry-summary {
    margin-top: 1em;
}

/* ------------------------------------------------------------ links --- */
a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline red !important;
}

h2 {
    font-size: 1rem;
}

/* ---------------------------------------------------- form elements --- */
input[type="submit"] {
    border: 1px solid grey;
    padding: 4px 12px;
    font-size: 1rem;
}

/* ----------------------------------------------- infinite scrolling --- */

.mosaic-container ~ .mosaic-container {
    margin-top: 0;
}

#infscr-loading ~ .mosaic-container {
    margin-top: 0;
}

 /* ------------------------------------ super-size-image startpage v3 --- */
img.ri
{
    position: absolute;
    max-width: 90%;
    top: 0%;
    left: 0%;
    border-radius: 2px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.9);
}
img.ri:empty
 {
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     -moz-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     -o-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
 }

@media screen and (orientation: portrait) {
    img.ri { max-width: 99%; }
}

@media screen and (orientation: landscape) {
    img.ri { max-height: 99%; }
}

/* ------------------------------------- neue farben braucht das land --- */
a {
    color: #ddd;
}

a:hover {
    color: #fff !important;
}

.menu-primary-container {
    background-color: #4a4a4a;
}

/* https://wojnowski.net.pl/main/index/genericons-unicode-values */
/* https://waaz.xyz/adding-external-link-indicator-with-css/ */
a[target="_blank"]:after {
    content: '  \f442';
    color: red;
    font: normal 16px/1 'Genericons';
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;    
}

a.owner:after, .page-template-linkpage a[target="_blank"]:after {
    content: '';
}