/* * * * * * * * * * * * * * * * * * */
/*                                   */
/*          Listenseite.css          */
/*                                   */
/* * * * * * * * * * * * * * * * * * */

/* Ist abgeleitet von einspalter.css - aber radikal entschlackt von allem, was hier nicht gebraucht wird.
/* layout-einspalter.css */

/* Farbwerte:

Body: #f2f2f2
Linien:#ccc
große Schriften: #505040
kleine Schriften: #303025
Navigationsrahmen: #aaa
Hover-Background: #ccc
(Hover alternativ auch Akzentfarbe)
Akzente: #e9c484
@import url(basis-newsreader/css?family=Newsreader&display=swap"); 
*/

html {
    background-color: #f2f2f2;
}

body {
    background-color: #f2f2f2;
    line-height: 1.6;
    margin: 0 auto;
    max-width: 900px;
    min-height: 800px;
    padding: 1em 2em 1em;
}

h1,
h2,
h3,
h4 {
    color: #505040;
}

p {
    color: #303025;
}

h1 {
    font-style: italic;
    font-weight: 400;
    font-size: 3em !important;
    margin-top: 0.5em;
    margin-bottom: 0.2em;
}

/* Weitere H sind nicht vorgesehen*/

/*     Die obere Navigationsleiste     */

#navi ul {
    list-style-type: none;
    /*border-bottom: 2px solid #505040;*/
    border-bottom: 2px solid #ccc;
    margin: 0;
    padding: 0 3px 6px 3px;
}

#navi ul li {
    color: #303025;
    display: inline;
    margin: 10px;
    margin-left: -10px;
    padding-left: 0;
    /*    border-right: 2px solid #505040;*/
    border-right: 2px solid #aaa;
}

#navi ul li.special {
    float: right;
    border: none !important;
    position: relative;
    top: -0.5em;
    right: -1em;
    border-left: 2px solid #aaa !important;
    border-right: 2px solid #aaa !important;
}

#navi ul li.noborder {
    border-right: none;
}

#navi ul li a {
    font-family: arial;
    color: #505040;
    padding: 8px 8px 8px 8px;
    text-decoration: none;
}

#navi ul li a:hover {
    background-color: #ccc;
    color: black;
}

#navi ul li a.oval {
    border: 1px solid black;
    padding: 3px 6px;
    border-radius: 10px;
}

#navi ul li.leer a:hover {
    background-color: #f2f2f2;
    color: #f2f2f2;
}

navi ul li.special {
    display: flex;
    float: right;
    color: red !important;
}

/*   Ende obere Navigationsleiste     */

/* Beginn Code für backlink/Backlink  */

div.backlink {
    margin-bottom: 2.4em;
}

div.backlink p {
    font-family: "Arial";
    width: 6.4em;
    font-size: 1.2em !important;
    font-weight: 400 !important;
    border: 1px solid #505040;
    border-radius: 20px;
    padding: 0 4px 0;
    margin-left: auto;
    margin-right: auto;
    background-color: #e9c484;
}

div.backlink a {
    color: #505040;
    text-decoration: none;
}

div.backlink a:hover {
    color: #fff;
    background-color: #e9c484;
    text-decoration: none;
}
/*  *****************   Ende Backlink ********************* */

body.chronik {
    /*     Die obere Navigationsleiste  der Chronik   */

    #navi ul {
        text-align: center;
        list-style-type: none;
        /*border-bottom: 2px solid #505040;*/
        border-bottom: 2px solid #ccc;
        padding: 0 3px 6px 3px;
        margin-right: auto;
        margin-left: auto;
    }

    #navi ul li {
        display: inline-block;
        /*xmargin: 10px;*/
        margin-left: -10px;
        padding-left: 0;
        width: 4em !important;
        border-right: 2px solid #aaa;
    }

    #navi ul li.special {
        float: right;
        border: none !important;
        position: relative;
        top: -0.5em;
        right: -1em;
        border-left: 2px solid #aaa !important;
        border-right: 2px solid #aaa !important;
    }

    #navi ul li.noborder {
        border-right: none;
    }

    #navi ul li a {
        font-family: Newsreader;
        color: #505040;
        font-weight: 600;
        font-style: italic;
        text-decoration: none;
        font-size: 1.6em;
        line-height: 0.6;
    }

    #navi ul li a:hover {
        background-color: #ccc;
        color: black;
    }

    #navi ul li a.oval {
        border: 1px solid black;
        padding: 3px 6px;
        border-radius: 10px;
    }

    #navi ul li.leer a:hover {
        background-color: #f2f2f2;
        color: #f2f2f2;
    }

    navi ul li.special {
        display: flex;
        float: right;
        color: red !important;
    }
} /*   Ende obere Navigationsleiste  der Chronik   */

/* *********** Hier beginnt die Artikelliste  ***************/

div#catliste {
    margin-top: 3em;
}

#catliste ul li {
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
    border-bottom: 2px solid #ccc;
    list-style: none;
    /*list-style-image: url('../tec_img/reserve/rechtspfeil_spitz_posi.png'); */
}

div#catliste ul li span.listdat {
    font-style: italic;
    font-size: 1.2em;
}

#catliste ul li p {
    font-size: 1.2em;
    line-height: 90% !important;
    /*color: #505040;*/
    color: #454535;
    margin: 8px 0 0 0;
    /*  Bie kleinen Schriften wie hier bei diesen p empfiehlt es sich, den Farbton etwas dunkler zu nehmen. Vielleicht aber auch generell?  */
}

#catliste ul li p a {
    font-size: 1em;
    padding: 0;
    z-index: 10;
}

#catliste a {
    font-size: 1.4em;
    line-height: 1;
    color: #505040;
    text-decoration: underline;
    z-index: 10;
}

#catliste a:hover {
    background-color: #e9c484;
}

/*   Beginn Sonderstyles Artikelliste der Chronik   */

body.chronik {
    #catliste ul.chronik li {
        line-height: 1 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        list-style: none;
        /*list-style-image: url('../tec_img/reserve/rechtspfeil_spitz_posi.png'); */
    }

    #catliste ul.chronik li a {
        font-size: 1.4em !important;
        font-style: italic;
        /*color: #505040;*/
        color: #454535;
        margin: 0;
        padding: 0;
    }

    #catliste ul.chronik li span.listdat {
        font-style: normal;
        font-size: 1em;
        margin-left: 1em;
    }
}

/*   Ende Sonderstyles Artikelliste der Chronik   */

/* *********** Ender der Artikelliste  ***************/

/*Das Grid bleibt zunächst erhalten. Es wird zur Reduzierung der Breite des Textfeldes genutzt und bleibt in Reserve, um später ggf. wieder reaktiviert und rechts mit einem include befüllt zu werden.*/

div.grid-main p {
    font-family: newsreader;
    font-size: 1.34em;
    font-weight: 400;
    line-height: 1.4em;
    /* wirkt wie hier auf einen ggf. angehängten Kommentar */
}

div.grid-main {
    display: grid;
    grid-template-columns: 95% 5%;
}

div.main-left {
    /*  border-right: 1px solid #ccc;*/
    margin-right: 10px;
    margin-left: 40px;
}

div.main-left a {
    color: #505040;
    padding: 8px 0 8px 4px;
    /*    text-decoration: none;*/
}

div.main-left a:hover {
    background-color: #ccc;
    color: black;
}

/*    Beginn der Weiter-Navigation   */
#weiter {
    font-family: sans-serif;
    width: 100%;
    position: relative;
    bottom: 35px;
}

#weiter a.links {
    float: left;
}

#weiter a.links span {
    margin: 0 1em;
    padding-left: 8px;
}

#weiter a.rechts {
    float: right;
}

#weiter a.rechts span {
    margin: 0 1em;
    padding-right: 8px;
}

#weiter a img {
    position: relative;
    top: 3px;
}

#weiter a {
    border: 1px solid black;
    border-radius: 20px;
    color: #111;
    text-decoration: none;
}

#weiter a:hover {
    color: #fff;
    background-color: #555;
    text-decoration: none;
}

/*    Ende der Weiter-Navigation   */

/* Die Styles für die Themen-Navigation können weg */

/* ******** Styles @media ********* */

/* Können evtl nach basis verschoben werden */

@media print {
    h1 {
        font-size: 2em !important;
    }

    div#navi {
        display: none;
    }

    div.grid-main p {
        font-size: 1.1em;
        color: black;
        line-height: 1.2em;
    }
}

/*
@media only screen and (max-width: 700px) {


    h1 {
        font-size: 3em !important;
    }

    div.main-left {
        margin: 0 !important;
    }

    #catliste {
        margin: 0;

    }

    #catliste ul li {
        margin: 0;
    }

    body#artlist header h1 {
        font-size: 2em !important;
    }

    body#artlist div.grid-main {
        grid-template-columns: 100% !important;

    }
    #footer p.headline{
        line-height:1!important;
    }
}*/

/* // end */