/**
 * /res/ism/css/ism_customer_static.css (screen)
 *
 * Hier werden alle statischen CSS-Einträge für den Standardmandanten erfasst, die bei allen
 * Kunden wirksam sein müssen.
 *
 * Anpassungen, die nur für einige Kunden relevant sind, müssen in die ism_customer_static.css
 * (des Kunden) geschrieben werden.
 *
 * Style-Anpassungen z.B. für die Breiten der Hauptmenü-Felder werden weiterhin über die ISMA in die
 * customer.css geschrieben.
 *
 */


/* ---------- viewport all ---------- */
@media all {

    p {
        margin: .7em 0 0.7em;
        text-align: justify;
    }

    .modSidebarSubject .toggle-content ul li p {
        text-align: left;
    }

    .modContent table tr p {
        text-align: inherit;
    }

    .modContent table tbody tr td, .modContent table tbody tr th {
        text-align: justify;
    }

    .modContent ul li {
        text-align: justify;
    }

    table a {
        text-decoration: underline;
    }

    .modContent li, .modContent ul {
        margin: 0.7em 1.0em 0.7em;
    }

    .modContent ul li {
        width: 90%;
    }

    .modContent .modPagination ul li {
        width: auto;
    }

    .modContent figure {
        float: right;
    }

    .modContent figure.imageLink {
        float: none;
    }

    .modHeader {
        min-height:auto;
        background: none;
    }

    table ul {
        overflow: inherit !important;
    }

    #puzzle {
        max-width: 600px;
        padding: 0px 10px 10px 10px;
        margin: auto;
    }

    .modContent #puzzle h2 {
        margin: 0 0 .45em 0;
        line-height: 1.2em;
    }

    /* Breites durchlaufendes Hintergrundbild */
    body {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_home.png);
        background-repeat: no-repeat;
        background-position: center 157px !important;
        background-size: auto !important;
    }

    body.infos_zu_extremismus {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_infos_zu_extremismus.png);
    }

    body.beratung_und_bildung {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_beratung_und_bildung.png);
    }

    body.was_tun_wenn {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_was_tun_wenn.png);
    }

    body.aussteiger {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_aussteiger.png);
    }

    body.ueber_uns {
        background-image: url(../img/backgrounds/bge_hintergrund_desktop_ueber_uns.png);
    }

    .modHeader > img {
        /* display: none; */
        height: 0px;
    }

    .ym-wbox {
        padding-top: 29px;
    }

    /* Beschriftungen im Slider entfernen */
    .modHeader section#modHeaderStage ul li figure > div figcaption {
        display:none;
    }
    .modHeader section#modHeaderStage ul li figure > div {
        bottom:0px;
    }

    /* TagCloud */

    .tagcloud a.tag1  { font-size: 14px; }
    .tagcloud a.tag2  { font-size: 18px; }
    .tagcloud a.tag3  { font-size: 22px; }
    .tagcloud a.tag4  { font-size: 14px; }
    .tagcloud a.tag5  { font-size: 18px; }
    .tagcloud a.tag6  { font-size: 22px; }
    .tagcloud a.tag7  { font-size: 14px; }
    .tagcloud a.tag8  { font-size: 18px; }
    .tagcloud a.tag9  { font-size: 22px; }
    .tagcloud a.tag10 { font-size: 14px; }
    .tagcloud a.tag11 { font-size: 18px; }
    .tagcloud a.tag12 { font-size: 22px; }

    .tagcloud a:hover.tag1, .tagcloud a:focus.tag1   { color:#fff; background-color: #ec9600; }
    .tagcloud a:hover.tag2, .tagcloud a:focus.tag2   { color:#fff; background-color: #ec9600; }
    .tagcloud a:hover.tag3, .tagcloud a:focus.tag3   { color:#fff; background-color: #ec9600; }
    .tagcloud a:hover.tag4, .tagcloud a:focus.tag4   { color:#fff; background-color: #ab881a; }
    .tagcloud a:hover.tag5, .tagcloud a:focus.tag5   { color:#fff; background-color: #ab881a; }
    .tagcloud a:hover.tag6, .tagcloud a:focus.tag6   { color:#fff; background-color: #ab881a; }
    .tagcloud a:hover.tag7, .tagcloud a:focus.tag7   { color:#fff; background-color: #d2052f; }
    .tagcloud a:hover.tag8, .tagcloud a:focus.tag8   { color:#fff; background-color: #d2052f; }
    .tagcloud a:hover.tag9, .tagcloud a:focus.tag9   { color:#fff; background-color: #d2052f; }
    .tagcloud a:hover.tag10, .tagcloud a:focus.tag10 { color:#fff; background-color: #734300; }
    .tagcloud a:hover.tag11, .tagcloud a:focus.tag11 { color:#fff; background-color: #734300; }
    .tagcloud a:hover.tag12, .tagcloud a:focus.tag12 { color:#fff; background-color: #734300; }

    .tagcloud { padding: 4px; text-align: center; margin: 0; background-image: url("/res/ism/img/backgrounds/bge_hintergrund_tagcloud.png"); background-repeat: repeat; background-size:100%; }
    .tagcloud a { padding: 0px; border: solid 4px transparent; color:#000; }
    .tagcloud li { display: inline; white-space: nowrap; width: auto !important; margin: 0px; }
    .tagcloud ul { margin: 0px; }
    .tagcloud ul li { left: 0px; }

    div.tagcloud { line-height: 2em; }

    /* Textbox Startseite */

    .modContent div.bge-textbox {
        width: 48%;
        padding-right: 12px;
    }

    .modContent .bge-textbox p {
        padding-right: 20px;
    }

    /* Farbanpassungen */

    .modFooterToggle {
        background-color: #d7d7d7;
    }

    .modFooterToggle .button, .modFooterToggle a, .modFooterToggle button {
        color: #3f3f3f;
    }

    .modFooterToggle a:hover {
        background-color: #008dc9;
        color: #ffffff;
    }

    .modFooterToggle .acc-title {
             background: #f3f3f3;
             color: #3f3f3f;
             border-top: double 3px #d7d7d7;
             border-bottom: double 3px #d7d7d7;
    }

    .modFooterToggle .acc-title a {
        color: #3f3f3f;
    }

    .modFooterToggle .acc-title a:hover {
        background-color: #008dc9;
        color: #ffffff;
    }

    .modFooter {
        background: linear-gradient(to bottom,#f3f3f3 0,#d7d7d7 100%);
        color: #3f3f3f;
    }

    .modFooter .button, .modFooter a, .modFooter button {
        color: #3f3f3f;
    }

    .modFooter ul li {
        border-right: solid 1px #3f3f3f;
    }

    .modHeader div.header-navigation ul li.accessibility a {
        background: linear-gradient(to bottom,#f3f3f3 0,#d7d7d7 100%);
        color: #3f3f3f;
    }

    .modMainNavigation ul.nav-level-1>li>a {
        background: linear-gradient(to bottom,#f3f3f3 0,#d7d7d7 66px);
        color: #3f3f3f;
        border-left: solid 1px #d7d7d7;
        border-right: solid 1px #c1c1c1;
    }

    .modMainNavigation ul.nav-level-1>li.active>a {
        background: linear-gradient(to bottom,#ffffff 0,#f3f3f3 66px);
        color: #3f3f3f;

    }

    .modMainNavigation ul.nav-level-1>li>a:hover {
        background: linear-gradient(to bottom,#06b3ff 0,#008dc9 66px);
        color: #ffffff;

    }

    .modMainNavigation ul.nav-level-2 > li a {
        padding-left: 10px;
        padding-right: 10px;
    }

    /* ENDE Farbanpassungen */

    /* Styling Überschriften */

    h1 {
        font-weight: 700;
        color: #008dc9;
        font-size: 160%;
    }

    .modContent h1 {
        line-height: 1.5em;
        margin: 0.3em 0 1.0em;
    }

    h2 {
        font-weight: 700;
        color: #008dc9;
        font-size: 145%;
    }

    .modContent h2 {
        line-height: 1.5em;
        margin: 1.6em 0 0.9em;
    }

    h3 {
        font-weight: 700;
        color: #000;
        font-size: 130%;
    }

    .modContent h3 {
        line-height: 1.5em;
        margin: 1.4em 0 0.8em;
    }

    h4 {
        font-weight: 700;
        color: #000;
        font-size: 115%;
        line-height: 1.2em;
        margin: 0 0 .45em;
    }

    .modContent h4 {
        line-height: 1.5em;
        margin: 1.2em 0 0.7em;
    }

    /* ENDE Styling Überschriften */

    /* Layout Anchorliste */

    div.quicklinks {
        background-color: #f3f3f3;
        border: solid 1px #d7d7d7;
        padding: 10px;
    }

    div.quicklinks h2.module-heading{
        margin:0;
        text-transform:initial;
        color:#000;
        font-weight:700;
        text-align: center;
    }

    .quicklinks ol.anchorlist {
        margin: 0;
        padding: 0;
    }

    .quicklinks ol.anchorlist li {
        margin: 0px 0px 0px 1px;
        padding: 0;
        font-weight:normal;
    }

    .quicklinks ol.anchorlist li li {
        list-style-type: disc;
    }

    .quicklinks ol.anchorlist li li {
        list-style-type: circle;
    }

    .modContent ol.anchorlist {
        list-style: none;
    }

    .modContent ol.anchorlist li {
        list-style-type: disc !important;
        font-weight:700;
    }

    .modContent ol.anchorlist li a {
        font-size:110%;
    }

    .modContent ol.anchorlist li li {
        list-style-type: circle !important;
        margin-left: 20px;
        font-weight: normal;
    }

    .modContent ol.anchorlist li li li {
        list-style-image: url('/res/ism/img/icons/list_dash.gif');
        font-weight: normal;
    }

    /* ENDE Layout Anchorliste */

    /* Akkordeonfarben im Content-Bereich */
    .modContent .modSidebarSubject .toggle-title {
        background-color: #ffffff;
    }

    .modContent .modSidebarSubject .toggle-title a {
        color: #008dc9;
    }

    .modContent .modSidebarSubject .toggle-title a:hover {
        background-color: #008dc9;
        color: #ffffff;
    }

    .modContent .modSidebarSubject .toggle-content {
        border-left: 1px solid #e1e7f0;
        border-right: 1px solid #e1e7f0;
    }

    .modContent .modSidebarVideos ul {
        list-style-image: none !important;
        overflow: inherit !important;
        margin: 0.5em 0 0 0 !important;
    }

    .modContent .modPagination ul {
        margin: 0 0 0 0 !important;
    }

    .modContent .modPagination ul li {
        list-style-image: none !important;
        overflow: inherit !important;
        margin: 0.5em 0 0 0 !important;
        left: 0px;
    }


    /* Burger-Menu-Farben */

    .modHeader div.header-navigation .modBurgerNavigation
    div.burger-navigation-content [data-role="main-navigation"]
    ul.nav-level-1 > li.active:not(.open) > a {
        background: linear-gradient(to bottom,#ffffff 0,#f3f3f3 100%);
        color: #000000;
    }
    .modHeader div.header-navigation .modBurgerNavigation
    div.burger-navigation-content [data-role="main-navigation"]
    ul.nav-level-1 > li.active:not(.open) > a:hover {
        background: linear-gradient(to bottom, #06b3ff 0, #008dc9 100%);
        color: #ffffff;
    }

    .modHeader div.header-navigation .modBurgerNavigation
    div.burger-navigation-content [data-role="main-navigation"]
    ul.nav-level-1 > li > a {
        background: linear-gradient(to bottom,#f3f3f3 0,#d7d7d7 100%);
        color: #000000;
    }

    .modHeader div.header-navigation .modBurgerNavigation
    div.burger-navigation-content [data-role="main-navigation"]
    ul.nav-level-1 > li.open > a {
        color: #ffffff;
    }

    .modHeader div.header-navigation ul li.accessibility a:hover {
        color: #ffffff;
    }

    .contrastMode .modMainNavigation ul.nav-level-1 > li > a:active,
    .contrastMode .modMainNavigation ul.nav-level-1 > li > a:focus,
    .contrastMode .modMainNavigation ul.nav-level-1 > li > a,
    .contrastMode .modHeader div.header-navigation .modBurgerNavigation div.burger-navigation-content [data-role=main-navigation] ul.nav-level-1>li>a {
        color: #fff;
    }

    .contrastMode .modFooterToggle .acc-title a {
        color: #fff;
    }

    figure.news {
        margin-right: 20px;
    }

    .accordion .toggle-content ul ul {
        list-style-image: url(../img/icons/list_square.gif) !important;
    }

    img.editor_bild_klein {
        margin-left: 10px;
        margin-bottom: 10px;
    }

    a.editor_bild {
        margin-left: 10px;
        margin-bottom: 10px;
    }

    /* Podigee Player ohne Einrückung */
    li.modContentPodcast {
        margin: 0.7em 0;
    }
}


/* ---------- viewport desktop ---------- */
@media screen {

    .modHeader div.header-navigation {
        margin-bottom: 396px;
    }

    aside figure.news {
        display: none !important;
    }

}



/* ---------- viewport tablet ---------- */
@media only screen and (min-width : 767px) and (max-width : 1024px) {

    /* Breites durchlaufendes Hintergrundbild */
    body {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_home.png);
    }

    body.infos_zu_extremismus {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_infos_zu_extremismus.png);
    }

    body.beratung_und_bildung {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_beratung_und_bildung.png);
    }

    body.was_tun_wenn {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_was_tun_wenn.png);
    }

    body.aussteiger {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_aussteiger.png);
    }

    body.ueber_uns {
        background-image: url(../img/backgrounds/bge_hintergrund_tablet_ueber_uns.png);
    }

    .modHeader div.header-navigation {
        margin-bottom: 212px;
    }

    .ym-wbox {
        padding-top: 39px;
    }

    .modContent img {
        width: auto !important;
    }

    aside > div.ym-cbox {
        flex-basis: 100%;
    }

    aside: figure.news {
        display: inline-block !important;
    }
}


/* ---------- viewport smartphone ---------- */
@media only screen and (min-width : 20px) and (max-width : 766px) {

    /* Breites durchlaufendes Hintergrundbild */
    body {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_home.png);
        background-position: -193px 223px !important;
    }

    body.infos_zu_extremismus {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_infos_zu_extremismus.png);
    }

    body.beratung_und_bildung {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_beratung_und_bildung.png);
    }

    body.was_tun_wenn {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_was_tun_wenn.png);
    }

    body.aussteiger {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_aussteiger.png);
    }

    body.ueber_uns {
        background-image: url(../img/backgrounds/bge_hintergrund_smartphone_ueber_uns.png);
    }

    .modHeader div.header-navigation {
        margin-bottom: 220px;
    }

    .modHeader > img {
        display: block;
    }

    .modContent img {
        width: auto !important;
        max-width: 100%;
    }

    .smartphone-100proz {
        width: 100% !important;
    }

    .modContent .smartphone-100proz figure a {
        display: block;
    }

    .modContent .smartphone-100proz img {
        width:100% !important;
    }

    aside > div.ym-cbox {
        flex-basis: 100%;
    }

    aside figure.news {
        display: inline-block !important;
    }

    .modContent figure {
        float: inherit;
    }

}