/*
Theme Name: SGA ASPE
Author: macREC GmbH
Author URI: https://www.macrec.ch
Description: Ziel der Schweizerische Gesellschaft für Aussenpolitik ist, das Interesse an Schweizer Aussenpolitik zu fördern und sie möglichst breiten Kreisen der Bevölkerung verständlich zu machen. Darin finden alle Aspekte der Aussenpolitik – Frieden und Sicherheit, soziale und politische Stabilität, Wirtschaft, Wissenschaft und Umwelt – ihren Platz. Design von Atelier Lapislazuli, Bern (lapislazuli.ch)
Version: 1.2.2
*/

@font-face{
    font-family:"Diverda Sans W01";
    src:url("fonts/d8ae34b5-62ea-43bb-9998-c248f984ee93.woff2") format("woff2"),url("fonts/f3191edf-8989-43fe-980d-681bc4f18507.woff") format("woff");
font-weight: 400;
font-style: normal;
}
@font-face{
    font-family:"Diverda Sans W01";
    src:url("fonts/a9a1de53-37f8-4fea-8d15-9c9fae2e75b2.woff2") format("woff2"),url("fonts/6e8d636f-1edb-49be-90a9-73793b3a9ff3.woff") format("woff");
font-weight: 400;
font-style: italic;
}
@font-face{
    font-family:"Diverda Sans W01";
    src:url("fonts/78f594a4-58f7-4f12-a32f-e7e873dae119.woff2") format("woff2"),url("fonts/c26d04b2-42c4-4741-bf3c-eb1b78932cb6.woff") format("woff");
font-weight: 700;
font-style: normal;
}
@font-face{
    font-family:"Diverda Serif W01";
    src:url("fonts/5b8fca43-3a2f-47a9-9b01-90f232d1a596.woff2") format("woff2"),url("fonts/cfda6551-b83a-4f2c-8603-504ec5b9c585.woff") format("woff");
font-weight: 400;
font-style: normal;
}
@font-face{
    font-family:"Diverda Serif W01";
    src:url("fonts/f57d5606-11cb-43a1-b748-9ae7f1be5265.woff2") format("woff2"),url("fonts/f6e0f799-1094-4c16-b62f-9c4fee30365d.woff") format("woff");
font-weight: 700;
font-style: normal;
}

/*
This CSS resource incorporates links to font software which is the valuable copyrighted
property of Monotype Imaging and/or its suppliers. You may not attempt to copy, install,
redistribute, convert, modify or reverse engineer this font software. Please contact Monotype
Imaging with any questions regarding Web Fonts:  http://www.fonts.com
*/

/* 
original http://fast.fonts.net/cssapi/e1b5caeb-2f4e-408e-88a0-dca07f482373.css :

#sga{font-family:"Diverda Sans W01_n4";}
.cat{font-family:"Diverda Sans W01_n7";}
.menu{font-family:"Diverda Sans W01_n4";}
.title{font-family:"Diverda Sans W01_n7";}
body{font-family:"Diverda Serif W01_n4";}
@media all and (min-width: 0px) { /* non- IE */
/*
#sga{font-family:"Diverda Sans W01";font-weight:400;font-style:normal;}
.cat{font-family:"Diverda Sans W01";font-weight:700;font-style:normal;}
.menu{font-family:"Diverda Sans W01";font-weight:400;font-style:normal;}
.title{font-family:"Diverda Sans W01";font-weight:700;font-style:normal;}
body{font-family:"Diverda Serif W01";font-weight:400;font-style:normal;}
} */


/* @import "sga-aspe.min.css"; */





/*
breakpints in code
1 column <= 500px
2 column <= 960px
3 columns (forced 1100px width on #page)
*/

:root {
    --color-text: #000;
    --color-brand: #c00;
    --color-mid: #999;
    --color-duotone: #704214;
    --tamaro-button-primary-color: white;
    --tamaro-button-primary-bg-color: var(--color-brand);
    --tamaro-block-header-position-bg-color: var(--color-brand);

    /* Event Registration Form */
    --form-label-spacing: 2em;
    --form-label-width: 17em;
}

.tamaro-widget {
    font-family: "Diverda Serif W01" !important;
}

#tamaro-widget.tamaro-widget .widget-content .widget-block + .widget-block {
    margin-top: 2.0rem !important;
}

body {
    color: var(--color-text);
    background: var(--color-mid);
    margin: 0;
    padding: 0;
    margin-top: 1px;
    -webkit-text-size-adjust: 100%;
    background: #9999993d;

    font-family: "Diverda Serif W01", serif;
    font-weight: 400;
    font-style: normal;
}

strong,
b {
    font-weight: 700;
}

.title,
h2,
h3,
.cat,
u {
    /* misused <u> in french text at https://www.sga-aspe.ch/la-suisse-au-conseil-de-securite/ */
    font-family: "Diverda Sans W01";
    font-weight: 700;
    font-style: normal;
}

/* has to stand separate from ↑ because of Firefox */
/* br + br + strong:has(+ br + br) {
    font-family: "Diverda Sans W01";
    font-weight: 700;
    font-style: normal;
} */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 1em;
    margin-bottom: 0;
}

h2,
h3,
h4,
h5,
h6 {
    /* overwritten by .title */
    margin-block-start: 1.06em;
}
/* 
br + br + h2,
br + br + h3,
br + br + h4,
br + br + h5,
br + br + h6,
br + br + p {
    margin-block-start: 0;
} */

p {
    margin-block-start: 0;
    margin-block-end: 0;
}

p + p {
    margin-block-start: 1.5em;
}



/* remove erroneous empty lines from WP */
/* h1 + br,
h2 + br,
h3 + br,
h4 + br,
h5 + br,
h6 + br,
p + br,
u + br,
strong + br + br, */
/* if IE dropped: */
/* :is(h1, h2, h3, h4, h5, h6) + br,
:is(h1, h2, h3, h4, h5, h6) + br + br,
ul > br,
ol > br,
hr + br,
hr + br + br */
/* more restrictive, still: ul > br make no sense */
/* ul:not([class]) > br */ /*{
    display: none;
}*/

/* misused <u> in french text at https://www.sga-aspe.ch/la-suisse-au-conseil-de-securite/ */

u {
    text-decoration: none;
}

/* strong + br + br:has(+ strong) {
    display: block;
} */


/* hr instead of ******************************** */
hr {
    border-style: solid;
    border-width: 1px 0 0;
}

.text hr {
    color: #ddd;
    border-color: #ddd;
    /* content: '*';
    color: #eee; */
}

/* lists used on UNO page */
/*ul:not([class]) {
    padding-left: 1em;
}

ul:not([class]) + br {
    display: none;
}

.text ol {
    margin-top: 1em;
}
ol > li {
    margin: .2em 0;
}*/

/* (removed because of mnissing <p>s in WP output:
remove third consecutive br (nischt, nischt!) */
/*a + br + br,
br + br + br {
    display: none;
} */

/* … but give it some margin to not punish <strong> instead of h3 */
/*br + br + strong {
    margin-top: 1.3em;
    display: inline-block;
}
strong + br + br {
    display: none;
}*/

/* hide empty div.text */
/* .content .text:empty {
    display: none;
} */


#sga,
.menu {
    font-family: "Diverda Sans W01";
    font-weight: 400;
    font-style: normal;
}

.cat,
ul.menu.nav li,
.pagination [aria-current="page"],
#sidebar.fakten a:hover,
#sidebar.fakten a:focus {
    color: var(--color-brand);
}

.grey {
    color: var(--color-mid);
    font-size: 0.8em;
    padding-bottom: 4px;
}

#page {
    background: #fff;
    max-width: 1100px;
    margin: 0 auto;
}


#container {
    min-height: 99vh;
}

@media (min-width: 960px) {
    #container {
        box-shadow:
        0 2.8px 2.2px rgba(0, 0, 0, 0.034),
        0 6.7px 5.3px rgba(0, 0, 0, 0.048),
        0 12.5px 10px rgba(0, 0, 0, 0.06),
        0 22.3px 17.9px rgba(0, 0, 0, 0.072),
        0 41.8px 33.4px rgba(0, 0, 0, 0.086),
        0 100px 80px rgba(0, 0, 0, 0.12);
    }
}

#header {
    font-size: .8em;
    padding-bottom: 30px;
    margin: 0 10px;
    padding: 20px 20px 30px 0;
    line-height: 1em;
    border-bottom: 8px solid var(--color-brand);
    -webkit-text-size-adjust: none;
}

.menu-sga-aspe-container {
    margin: 0 10px;
    /* outline: 1px solid green; */
}

@media (min-width: 500px) {
    #header {
        padding-left: 35%;
        margin: 0 20px;
        border-bottom-width: 10px;
    }
    .menu-sga-aspe-container {
        margin: 0 20px;
    }
}

@media (min-width: 960px) {
    #header {
        font-size: 1em;
        padding: 40px 10px 30px 50.5%;
        margin: 0 40px;
        border-bottom-width: 17px;
    }
    .menu-sga-aspe-container {
        margin: 0 40px;
    }
}

#header abbr {
    color: var(--color-brand);
    text-decoration: none;

    /* enable for lighter color */
    /* -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; */
}

#header [lang] {
    display: block;
}

#header a:hover > strong > abbr,
#header a:focus > strong > abbr {
    color: var(--color-text);
}

ul.menu {
    /* display: table; */
    list-style: none;
    margin: 5px 0;
}

.menu-sga-aspe-container ul.menu {
    padding: 0;
}

@media (min-width: 510px) {
    .menu-sga-aspe-container ul.menu {
        padding: 0 100px 0 0;
    }
}

/*
@media (min-width: 960px) {
    .menu-sga-aspe-container ul.menu {
        padding: 0 80px 0 0;
    }
} */

ul.menu.sub,
ul.menu.tag,
ul.menu.nav {
    padding: 0;
}
ul.menu.sub {
    padding-bottom: 21px;
}

ul.menu li,
.cat {
    /* width: 130px; */
    display: inline-block;
    vertical-align: top;
    position: relative; /* TODO: needed? */
    padding-top: 2px;
    padding-left: 4px;
}

ul.menu > li:before,
.cat:before {
    content: '';
    height: 1.38em;
    left: -4px;
    top: -2px;
    display: inline-block;
    vertical-align: top;
    /* margin-bottom: -2em; */
    position: relative;
    border-left: 1px solid #000;
	user-select: none;
}

.cat.schweiz-im-sicherheitsrat:before,
.cat.espresso:before,
.cat.geneva-observer:before {
    display: none;
}


/* empty category rendered for «Frauen, Frieden, Sicherheit»: Die Schweiz im UNO-Sicherheitsrat 2023/2024» */
.cat:empty {
    display: none;
}

.cat:empty + .title {
    margin-top: 4px;
}



.pagination.pagination li {
    display: block;
}
ul + .page-numbers {
    margin-left: 4px;
}

.pagination.pagination ul.menu.nav.years li {
    float: left;
    padding-right: 5px;
}

.pagination.pagination li:before {
    display: none;
}



/* no line before
- Aktuell
- Alle Beiträge anzeigen
- nächste Seite
- 1 2 3 … (pagination)
*/

.current-subjects:before,
#sidebar .nav > li:before {
    display: none;
}

.cat:before {
    top: -.3em;
    height: 1.6em;
    margin-bottom: -1em;
}



/* main navigation  */

#menu-sga-aspe {
    position: relative; /* #magnifier */
}


@media (min-width: 730px) {
    #menu-sga-aspe > .menu-item {
        width: 7.6em;
    }
}

@media (min-width: 960px) {
    #menu-sga-aspe > .menu-item {
        width: 130px;
    }
}

#menu-sga-aspe a {
    display: inline-block;
}



.menu.tag > li:before,
#magnifier:before {
    display: none;
}

/* remove broder from Themen > «Aktuell» > .cat */
.current-subjects {
    border: 0;
}

#magnifier {
    position: absolute;
    top: -40px;
    padding-right: 0;
    /* border-left: none; */
    /* padding-left: 170px; */
    right: 0;
}

/* todo: better in em */
@media (min-width: 510px) {
    #magnifier {
        top: 0;
    }
}


.menu.sub {
    margin-top: 0;
}

.menu.sub > li {
    display: block;
}

ul.menu.nav li > a,
ul.menu.nav li.black {
    color: #000;
}



.menu.sub > li:before {
    content: "";
    height: 1px;
    width: 20px;
    display: block;
    top: 0;
    left: 0;
    border-top: 1px solid var(--color-brand);
    border-left: 0;
}

.menu.sub a {
    display: block;
    line-height: 1.1;
    padding: .175em 0;
}


.menu.tag li:after {
    content: '';
    height: 1.25em;
    padding-left: 5px;
    border-right: 1px solid var(--color-brand);
    display: inline-block;
    vertical-align: top;
    user-select: none;
}


ul.menu.tag li.last:after,
/* Preparation for removing .last logic */
ul.menu.tag li:last-child:after {
    border-right: none;
}

.title,
.cat {
    width: 100%;
    height: auto;
    padding-top: 4px;
    padding-left: 4px;
    /* h1, h2, … */
    font-size: 1em;
    margin-top: 0;
    margin-bottom: 0;
}

.cat + .title {
    padding-top: 0;
}

/*.content--uno .title {
    //left side and right side (inside <article>),
    //does not affect middle column 
    padding-left: 0;
}*/

#sidebar.espresso,
#sidebar.geneva-observer,
#sidebar.schweiz-im-sicherheitsrat,
.schweiz-im-sicherheitsrat + #sidebar,
#sidebar.schweiz-im-sicherheitsrat + .main, /* history */
/* #page-content:not(:has(> .cat)),  /* no category, only applies to page «Themen», has to stay separate because of Firefox */
.home #primary > .main:not(:has(> .cat))  /* no category, applies to page home > middle column */ {
    border-top-color: var(--color-brand);
}

/* has to stay separate because of Firefox */
#page-content:not(:has(> .cat)) {
    border-top-color: var(--color-brand);
}

#page-content:first-child, /* tagcloud and single.tpl view */
#page-content[class*="agenda"],
#page-content.page-content--archiv,
.home #primary > .main.img {
    border-top-color: var(--color-text);
}


/* used where? */
#sidebar.espresso,
#sidebar.geneva-observer {
    margin-bottom: 15px;
}



.cat.fakten,
.cat.espresso,
.cat.geneva-observer,
.cat.schweiz-im-sicherheitsrat {
    /* color: var(--color-brand); */
    text-transform: uppercase;
}

.cat.schweiz-im-sicherheitsrat > a {
    color: var(--color-brand);
}

.cat.buchpublikation {
    color: var(--color-brand);
    /* TODO check with Bernard: this was custom made */
    /* font-weight: 300; */
    /* font-size: 0.92em; */
    text-transform: uppercase;
}

.cat.fakten {
    font-weight: 300;
}

.cat.espresso,
.cat.geneva-observer {
    margin-bottom: 0px;
}

/*.cat {
	height: 18px;
}*/
.text,
.credits,
#em-wrapper,
#page-content > p {
    padding-left: 4px;
    /* hyphens require correct lang attribute  and only work in Safari prefixed */
    -webkit-hyphens: auto;
    hyphens: auto;
}

/* https://www.sga-aspe.ch/buch/ */
.text form {
    -webkit-hyphens: none;
    hyphens: none;
}

.credits:empty {
    display: none;
}

/* TODO fix thema .schweiz-im-sicherheitsrat */

/* quick fix «Aktuel» */
/* .content--uno-right #sidebar:first-child {
    padding-left: 0;
} */


.desk {
    display: block;
}

.mobi {
    /* TODO: make redundant */
    display: none;
}

.text ul,
.text ol {
    display: table;
    margin: 0;
    -webkit-hyphens: auto;
    hyphens: none;
}

.text ul {
    list-style: none;
    padding-left: 15px;
    margin-top: 1.3em;
    margin-bottom: 1.3em;
}

.text ul > li:before {
    content: "-";
    display: inline-block;
    width: 0.8em;
    margin-left: -0.8em;
}

.credits {
    padding-bottom: 15px;
}

.text p {
    margin-block-start: 0em;
}

.text p + p,
.text p + br + p {
    margin-block-start: 1.5em;
}

/* https://www.sga-aspe.ch/buch/ */
.text .form p + p {
    margin-block-start: 0;
}


.credits>div.links a,
#sidebar>div.links a {
    padding-left: 24px;
}

.credits a,
.text a,
a.arrow div span,
span.extlink a {
    padding-left: 18px;
}

.credits>div.links a,
#sidebar>div.links a,
.credits a,
.text a,
a.arrow div span,
span.extlink a {

    /* https://css-tricks.com/a-complete-guide-to-svg-fallbacks/
The trick here is to find syntax that is supported by (nearly all) browsers that support SVG, but not by the older browsers. Here’s the magic:
 */
    background: url(img/link--26.png) no-repeat 2px 1px;
    background: url(img/link.svg) no-repeat 2px 1px, linear-gradient(transparent, transparent);
    /* TODO express in em */
    background-size: 13px 13px;
    /* TODO express in em */
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    /* color-adjust: exact; TODO: check before re-enabling, marked ad Unknown property by VSCode */
}

a.link-to-pdf {
    background: none;
    padding-left: 0;
}

a.link-to-pdf>img {
    border: solid 1px #000;
    margin-right: 15px;
    margin-bottom: 10px;
}

#social {
    background: url(img/facebook.svg) no-repeat;
    background-size: 20px 20px;
    /* TODO express in em */
    margin: 0;
    clear: both;
    padding: 3px 0 0 18px;
    margin-top: 8px;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
    /* color-adjust: exact; TODO: check before re-enabling, marked ad Unknown property by VSCode */
}

#search {
    margin-top: -2px;
    max-width: 130px;
}

/* Removes the default outline only in browsers that support :focus-visible */
#search:focus:not(:focus-visible) {
    outline: none;
}

/* #magnifier {
    width: auto;
} */

#lupe {
    margin: -2px 0 0 5px;
    width: 13px;
    height: 13px;
    float: right;
}

#lupe:hover {
    cursor: pointer;
}

#main-img-text {
    font-size: 0.6em !important;
    margin-top: -14px;
    text-align: right;
}



figure > img {
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 5px;
    margin-top: 7px;
    /* only needed with set height */
    /* object-fit: cover;
    object-position: 50%; */
    filter: grayscale(1) contrast(.88) sepia(.26);
}

figure > img[src*='-sga-edit'] {
    filter: none;
}


/* .duotone {
    margin-bottom: 5px;
    margin-top: 7px;
    position: relative;
} */
/* @supports (mix-blend-mode: soft-light) {
    .duotone:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        mix-blend-mode: color;
        opacity: .51;
        background: var(--color-duotone);
        /* make transparent to drag, enaböes drag of image underneath * /
        pointer-events: none;
    }
    .duotone > img[src*='-sga-edit'] {
        position: relative;
        z-index: 2;
    }
} */

/* security: don't show container of empty image */
/* figure:has(:not(img)) {
    display: none;
} */




a,
.menu a,
.menu a:hover {
    color: #000;
    text-decoration: none;
}

/* .menu a {
    display: block;
} */

a:hover,
a:focus,
ul.menu li a:hover,
ul.menu li a:focus,
ul.menu li.current-menu-item a,
ul.menu li.current-menu-ancestor a,
ul.menu.sub li.current_page_item,
ul.menu li.current_page_parent a,
.link--goto-events {
    /* TODO: use aria-roles for styling current pages */
    color: var(--color-brand);
}

#content {
    line-height: 1.3em;
    padding: 15px 10px 0;
}

figcaption {
    padding-left: 4px;
    padding-top: 5px;
    padding-bottom: 1px;
    -webkit-hyphens: auto;
    hyphens: auto;
}

@media (min-width: 500px) {
    #content {
        display: grid;
        grid-auto-flow: column;
        grid-template-columns: auto 30%;
        grid-column-gap: 1.5%;
        padding: 20px;
        /* grid-template-rows: auto; */
    }

    /* Agenda: sidebar on left side */
    .page-template-agenda #content {
        grid-template-columns: 30% auto;
    }

    body.home #primary {
        grid-column-start: 1;
        grid-row-start: 2;
    }

    @media (max-width: 959px) {
    /* move to right side (more content == longer container) */
        .content--uno-left {
            grid-column-start: 2;
            grid-row: 1 / 3;
        }

        .content--uno-right {
            grid-column-start: 1;
            grid-row-start: 2;
        }
    }



    #secondary {
        grid-column-start: 2;
        grid-row: 1 / 5; /* TODO: check */
    }
    .page-template-agenda #secondary {
        grid-column-start: 1;
    }
}

@media (min-width: 960px) {
    #content {
        grid-template-columns: auto 20%;
        grid-column-gap: 1.6%;
        padding: 20px 40px;
    }
    body.home #content,
    body.term-schweiz-im-sicherheitsrat #content,
    #content.schweiz-im-sicherheitsrat {
        grid-template-columns: 20% auto 20%;
    }

    body.home #primary,
    body.term-schweiz-im-sicherheitsrat #primary,
    #content.schweiz-im-sicherheitsrat #primary {
        grid-column-start: 2;
        grid-row-start: 1;
    }
    body.home #secondary,
    body.term-schweiz-im-sicherheitsrat .content--uno-right,
    #content.schweiz-im-sicherheitsrat .content--uno-right {
        grid-column-start: 3;
    }

    /* Agenda: sidebar on left side */
    .page-template-agenda #content {
        grid-template-columns: 20% auto;
    }
}

#editorial,
#primary > div,
#primary > article,
#secondary > div,
#secondary > article,
#primary > figure,
.content--uno-right #sidebar,
.content--uno-left article,
.content--uno-right article {
    padding-top: 5px;
    border-top: 5px solid var(--color-text);
    /* margin-bottom: 15px; */
    padding-bottom: 15px;
}

/* variant: no line between articles (UNO) */
/* .content--uno-left article + article,
.content--uno-right article + article {
    padding-top: 0;
    border: 0;
} */

.content--uno-right > #sidebar:first-child {
    padding-bottom: 15px;
    display: none;
}

@media (min-width: 960px) {
    .content--uno-right > #sidebar:first-child {
        display: block;
    }
}

/* sticky navigation for archive and «Veranstaltungen» */
body.archive.tag nav.pagination,
body.page-id-46 nav.pagination {
    position: sticky;
    top: 10px;
}


.pagination {
    padding-top: 5px;
    border-top: 5px solid #000;
    /* margin-bottom: 15px; */
    padding-bottom: 15px;
}

/* .content--uno-right #sidebar + article {
    margin-top: 15px;
} */


#primary > figure {
    margin: 0;
}

/* add :first-child after figure for security */


#sidebar.seq,
#page-content.content.seq,
.main.content.seq,
div#page-content.seq,
article#page-content.seq {
    border-top-width: 1px !important;
}

div.edi.seq {
    border-top: 1px solid #000;
    padding-top: 5px;
    margin-top: 15px;
}

/* #primary > div {
    margin-right: 2%;
} */

/* #editorial {
    width: 25%;
    margin-bottom: 100px;
} */



/* #sidebar {
    width: 100%;
} */

/* .content {
    width: 98%;
} */

/* has to stay after .content */
/* .main {
    width: 71%;
} */

/* place content in grid */

/* #editorial {
    grid-column-start: 1;
}
.main {
    grid-column-start: 2;
}
#sidebar {
    grid-column-start: 3;
} */


#credits {
    width: 100%;
    /* background: var(--color-mid); */
    padding: 3px 0;
    font-size: 0.5em;
}

.main.infoletter,
.main.espresso,
.main.geneva-observer {
    margin-top: 15px;
    padding-top: 5px;
    border-top: 5px solid var(--color-text);
}

.main.infoletter div.text {
    border-bottom: 1px solid var(--color-text) !important;
    padding-bottom: 8px;
    margin-bottom: 5px;
}

.main.infoletter div.text.last {
    /*padding-bottom: 0;*/
    margin-bottom: 0;
}

/* ¿ qué ? */
div > #magnifier {
    display: none;
}

/* … mayve bc of double #magnifier onm book ordering page */


/*Formular Plug-In*/
.left_aligned .fields label {
    width: 30% !important;
}

/* following caused overlap h1 ↔︎ form on https://www.sga-aspe.ch/organisation/mitglied-werden/ */
/* .cpp_form {
    margin-top: -25px !important;
} */

div#fieldlist_1 {
    width: 60%;
}

div.cpefb_error {
    background: #FFF !important;
    border: 1px solid var(--color-brand) !important;
}

.pbSubmit {
    margin: 20px 0 !important;
}

.a2a_kit {
    margin-top: 20px;
    clear: both;
    display: block !important;
}

.last,
div#social.text,
div.main.infoletter.mobi {
    border-bottom: none !important;
    margin-bottom: 0 !important;
}

.a2a_img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

/*Formular Plug-In Form 7*/
.square {
    width: 50px;
    height: 50px;
    background: var(--color-brand);
}

/* Clear floats after columns */
.2col:after {
    content: "";
    display: table;
    clear: both;
}


/* Content on pager UNO Sicherheitsrat */

/* .content--uno {

} */

@media screen and (max-width: 960px) {

    ul.menu li {
        font-size: 0.8em;
        width: auto;
        padding-right: 12px;
    }

    /* .menu.tag li {

    } */

    /* .menu-sga-aspe-container ul.menu li#magnifier {
        margin-right: 12px;
    } */

    ul.menu.tag li {
        padding-right: 0;
    }

    #editorial {
        margin-bottom: 15px !important;
    }

    /* figure > img {
        height: 414px;
    } */

    .desk {
        display: none;
    }

    .mobi {
        display: block;
    }

    /*Formular Plug-In*/
    .left_aligned .fields label {
        width: 30% !important;
    }

    div#fieldlist_1 {
        width: 100%;
    }
}

/* @media screen and (max-width: 880px) {
    figure > img {
        height: 378px;
    }
} */

/* @media screen and (max-width: 800px) {
    figure > img {
        height: 342px;
    }
} */

@media screen and (max-width: 720px) {
    /* figure > img {
        height: 324px;
    } */

    .wpcf7 {
        width: 100% !important;
    }
}

@media screen and (max-width: 640px) {
    /* figure > img {
        height: 270px;
    } */

    input#search {
        width: 70px;
    }

    /*Formular Plug-In*/
    .left_aligned .fields label {
        width: 35% !important;
    }

    .wpcf7 {
        width: 100% !important;
    }
}

@media screen and (max-width: 560px) {
    /* figure > img {
        height: 234px;
    } */

    #lupe {
        margin: -2px -2px 0 5px;
    }
}

@media screen and (max-width: 510px) {

    ul.menu li#magnifier {
        /* margin-right: 10px; */
        padding-left: 0;
        float: left;
    }

    input#search {
        width: 43px;
    }

    #primary,
    #secondary {
        width: 100%;
    }

    #primary>div,
    .content,
    .main.infoletter {
        width: 100%;
        margin-right: 0;
        /* float: rigth; /* TODO: check, as this was misspelled «rigth» */
    }

    /* figure > img {
        height: 200px;
    } */

    #lupe {
        margin: -2px -6px 0 5px;
    }

    .wpcf7 {
        width: 100% !important;
    }
}

/* don't force cropping of square images */
/* figure > img[height^="5"] {
    height: unset;
} */







/* hide #sidebar after year navigation */
#secondary > .pagination + #sidebar {
    display: none;
}


/* moved from «Zusätzliches CSS» in Theme Customizer */

/* .wpcf7 {
    width: 65% !important;
} */

.wpcf7-form .form {
    float: none !important; /* inline styles */
    display: flex;
    flex-wrap: wrap;
    gap: 1.4em 24px;
    align-items: end;
    margin-top: 1em;
}

.wpcf7-text,
.wpcf7-textarea {
    width: 100% !important;
}

.wpcf7-submit {
    font-family: "Diverda Serif W01";
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    outline-color: transparent !important;
    outline-style: none !important;
    background: #ccc;
    color: #000;
    display: block;
    float: left;
    cursor: pointer;
    margin: 10px 0px 0px 0px;
    padding: 5px 20px;
    border: 0px;
    border-style: none;
}

.wpcf7-list-item {
    /* float: left !important; */
    padding-bottom: 10px;
}

.wpcf7-list-item-label {
    display: block !important;
    margin-left: 20px !important;
    margin-top: -20px !important;
}

.wpcf7-not-valid-tip {
    color: #cc0000 !important;
}

div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
    border: 0px !important;
    margin-top: 5px !important;
    color: #cc0000 !important;
}

div.wpcf7-response-output {
    margin: 4em 0.5em 3em 0px !important;
}

div.wpcf7-mail-sent-ok {
    border: 0px !important;
    margin-top: 5px !important;
    color: #000000 !important;
}

span.wpcf7-list-item {
    display: table-row;
}

span.wpcf7-list-item * {
    display: table-cell;
}

#em-booking {
    margin-left: 3px;
}


#em-booking input[type="text"],
#em-booking input[type="email"] {
    width: 24em;
}

.em-booking-submit {
    margin-top: 1em;
}


#em-booking label {
    /* width: 25%; */
    display: inline-block;
    width: var(--form-label-width);
    margin-right: var(--form-label-spacing);
    vertical-align: top;
}

table.em-tickets td {
    display: inline-block;
    /* padding-right: 20px; */
    margin-right: var(--form-label-spacing);
}

.em-bookings-ticket-table-type {
    width: var(--form-label-width);
    margin-right: var(--form-label-spacing);
}

.input-group.input-checkboxes {
    line-height: 2;
}

.input-group.input-checkboxes > label {
    vertical-align: text-bottom;
}
.input-checkboxes > .input-group {
    display: inline-block;
}

.em-form-required {
    color: var(--color-brand);
    font-size: .8em;
    vertical-align: super;
}

table.em-tickets,
.em-booking .input-checkboxes {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

/* #em-booking .input-checkboxes label {
    float: none;
} */

p.ticket-desc {
    color: black;
}

p.ticket-desc:before {
    color: lightgray;
    content: '> '
}

.ui-tooltip-content {
    color: green;
    display: none;
    text-align: center;
    font-size: 0.8em;
}

.em-booking-message-error p {
    color: var(--color-brand);
}

.em-booking-message-success {
    color: var(--color-text);
    padding: 3em 1em 1em;
    border: 1px solid #ccc;
    margin: -2em 0 0 -1em;
}

textarea#booking_comment.input {
    width: 60% !important;
}

.em-booking-buttons input {
    font-family: "Diverda Serif W01";
    font-weight: 400;
    font-style: normal;
    font-size: 16px;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    outline-color: transparent !important;
    outline-style: none !important;
    background: #ccc;
    color: var(--color-text);
    display: block;
    float: left;
    cursor: pointer;
    padding: 5px 20px;
    border: 0px;
    border-style: none;
}

.input-checkbox {
    margin-bottom: 25px;
}

/* #em-booking input[type="checkbox"] {
    margin-left: -4px;
} */

.input-field-einverstandnis {
    margin-left: 0px !important;
    position: relative;
}

.input-field-einverstandnis input {
    width: auto !important;
}

.input-field-einverstandnis label {
    width: 85% !important;
    margin-bottom: 2em;
}

div.wpcf7-response-output {
    padding: 0;
}

.wpcf7 form.sent p {
    display: none;
}

.text img.alignleft {
    float: left;
    margin: 0 15px 15px 0;
}


/* changes on live site */
.tagcloud {
    display: none;
}
@media (min-width: 500px) {
    .tagcloud {
        display: block;
    }
}

/* TODO: fix this in Wordpress config */
/* single event has «THEMEN» as parent, Themen is marked as current page, fixed here with CSS (but not in code) */

body.event-template-default ul.menu li.current_page_parent a {
    color: var(--color-text);
}

body.event-template-default ul.menu li a[href$="veranstaltungen/"] {
    color: var(--color-brand);
}



/* TODO remove this after agenda archive completed */
/* .agenda--2027 + .agenda--2026,
.agenda--2026 + .agenda--2025,
.agenda--2025 + .agenda--2024,
.agenda--2024 + .agenda--2023,
.agenda--2023 + .agenda--2022,
.agenda--2022 + .agenda--2021,
.agenda--2021 + .agenda--2020,
.agenda--2020 + .agenda--2019,
.agenda--2019 + .agenda--2018,
.agenda--2018 + .agenda--2017,
.agenda--2017 + .agenda--2016,
.agenda--2016 + .agenda--2015 {
    border-top-width: 3px !important;
} */



/* Mobile Hackery */

/* only show 1 | 2 | all upcoming events on home */
/* hide plural vernastaltung-EN */

@media (max-width: 500px) {
    body.home .content--event + .content--event {
        display: none;
    }

    body.home .link--goto-events > span {
        display: none;
    }
}

@media (max-width: 960px) {
    body.home .content--event + .content--event + .content--event {
        display: none;
    }
}


/* overwrite plugin event booking form */

.em-tickets > tbody > tr:first-child > th {
    display: none;
}


div.em-booking-message-error {
    padding: 1em;
    margin: 0.4em;
    background: #eee;
    border: 1px solid #ddd;
}

.em-booking-message-error > p + p {
    margin-top: 0.2em;
}

/* Fix form «Tag der Aussenpolitik 2023» */
.postid-6747 .input-checkboxes + .input-checkboxes {
    display: none;
}

.postid-6747 .text + .title {
    margin-top: 2em;
}


/* Event booking anchor */
a[href="#anmeldung-inscription"] {
    padding: 0;
    background: none;
    text-decoration: underline;
}
div.title:target {
    animation: hilight 1s ease-out .2s 1;
}
@keyframes hilight {
    from {
        background: #fe1;
    }
    to {
        background: #fff;
    }
}
