MediaWiki:Common.css

@@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,wght@0,400;0,600;1,400&display=swap');

/* Changes the default font used for MediaWiki to Noto Sans (does not include headings or monospaced text): */
body {
  font-family: "Noto Sans", sans-serif;
}

a:link{
    color: #B20904;
}
a:active{
    color: #B20904;
    text-decoration:underline;

}

a:visited{
color:#3a0703;
}

.mw-body{
    margin-bottom:0;
}

#mw-content-text{
    min-height: calc(100vh - 100px);
}
.mw-body h1 {
    font-size: 2em;
    font-style: italic;
    color: #69883a;
}

.mw-body h2 {
    font-size: 1em;
    font-style:normal; 
    color:#000; 
    border:0px;
    font-weight:700;
}

.mw-body h2::after {
    background-color: #DEE2E6; 
    bottom: 0;
    content: '';
    display: block;
    height: 1px;
    left: 50%;
    transform: translate(-50%,0);
    width:100%;
}

.mw-body .toc .toctitle h2::after  {
    height:0px
}





.mw-body h3 {
   font-size: 1.1em;  
}
.mw-headline {
    text-shadow: 1px 1px 0 rgb(255,255,255);
}
.mw-body .firstHeading {
    border-bottom: 1px solid #a3b561;
    margin-bottom: 1rem;
    overflow: visible;
}
/*Einstellung für :focus bei Chrom*/
:focus {
    outline: #b20904 auto 0px;
    outline-color: #b20904;
    outline-style: auto;
    outline-width: 0px;
}

/*############# Navbar ############*/
#mw-navigation{
display:none;
}
.navbar-default{
    border:0px;
}
.p-navbar{
background-color:#ede8de !important;
}

.navbar-light .navbar-nav .nav-link, 
.p-navbar .navbar-nav .nav-link, 
.navbar-light .navbar-nav .p-navbar .navbar-tool > a, 
.p-navbar .navbar-light .navbar-nav .navbar-tool > a, 
.p-navbar .navbar-nav .navbar-tool > a {
    color: #B20904;
}

.navbar-light .navbar-nav .nav-link:hover, 
.p-navbar .navbar-nav .nav-link:hover, 
.navbar-light .navbar-nav .p-navbar .navbar-tool > a:hover, 
.p-navbar .navbar-light .navbar-nav .navbar-tool > a:hover, 
.p-navbar .navbar-nav .navbar-tool > a:hover {
    color: #3a0703;
    text-decoration:underline

}






.skin-chameleon .navbar-tools > li > a.navbar-usernotloggedin:visited:hover, 
.skin-chameleon .navbar-tools > li.open > a.navbar-usernotloggedin:visited:hover,
.skin-chameleon .navbar-tools > li.open > a.navbar-usernotloggedin:link,
.skin-chameleon .navbar-tools > li.open > a.navbar-usernotloggedin:visited, 
.skin-chameleon .navbar-tools > li > a.navbar-usernotloggedin:link,
.skin-chameleon .navbar-tools > li.open > a.navbar-usernotloggedin:visited:focus,
.skin-chameleon .navbar-tools > li > a.navbar-userloggedin:hover, 
.skin-chameleon .navbar-tools > li.open > a.navbar-userloggedin:hover,
.skin-chameleon .navbar-tools > li > a.navbar-userloggedin:active, 
.skin-chameleon .navbar-tools > li.open > a.navbar-userloggedin:active
 {
    color: white;
}
.skin-chameleon .navbar-tools > li > a.navbar-usernotloggedin:visited
 {
    color: #B20904;
}

.btn-default {
    border-color: #b20904;
}

.btn-default:focus, .btn-default.focus,
.btn-default:hover, .btn-default.hover {
    border-color: #b20904;
}
.btn-default:active, .btn-default.active, 
.open > .dropdown-toggle.btn-default{
   border-color: #b20904;
}


/*############# Kategorien ############*/
div.catlinks {
    background-color: #8c8a75;
    margin: 1em -15px 0px -15px;

}


div.mw-normal-catlinks{
    margin: 10px;
    padding: 10px;
    background-color: #dbd9c4;
    border: 1px solid #514f3a;
    border-radius: 3px;

}
#catlinks {
    margin: 0 30px;
}

div#catlinks li{
    border-left: 0px;
    display:block;
}

div#catlinks li a:link{
   color: #8c8a75;
}

div#catlinks li a:hover, 
div#catlinks li a::active{
   color: #646251;
}

div#catlinks li:first-child{
    padding-left: 0.5em;
}

#catlinks #mw-normal-catlinks > a {
    color: #4C4B3E;
    font-size: 18px;
    font-weight: bolder;
    font-style: italic;
}

/*############# Footer############*/
div.footer{
    background-color: #575757;
    margin-top: 0px;
    padding-bottom: 0px;
    padding-top: 3px;
    min-height: 50px;
}

div.footer .navbar-default{
    background-color: #575757;
    text-align:center;
}

div.footer .navbar-nav{
    float: none;
}
div.footer .navbar-nav > li{
    float: none;
    display: inline-block;
}

div.footer .list-inline{
    text-align:center;
}

div.footer .list-inline li a:link,
div.footer .list-inline li a:visited{
    color: #8c8a75;
}

div.footer .list-inline li a:hover,
div.footer .list-inline li a:active,
div.footer .list-inline li a:focus
{
    color: #FFF;
    text-decoration:underline;
}

div.footer .navbar li>a:link,
div.footer .navbar li>a:visited{
    color: #8c8a75;
}

div.footer .navbar li>a:hover,
div.footer .navbar li>a:active,
div.footer .navbar li>a:focus{
      color: #FFF;
    text-decoration:underline;
}

/*############# Startseite ############*/

/* Header Hauptseite */
div#header_top{
display:none;
}

body.page-Hauptseite div#header_top {
    background-image: url(/orte/images/header_4.jpg);
    background-repeat: no-repeat;
    
    display: block;
}

body.page-Hauptseite div#header_top h1 {
    font-family: 'Bodoni Moda', serif;
    font-weight:bold;
    color: #2B0405; 
    margin-top: 0px;
    border-bottom:0px;
}


@media (min-width: 1280px){
    body.page-Hauptseite div#header_top {
      height: 540px;
   }
   .navbar-brand {
      border-right:0px;

   }
   .nav > li > a{
      padding:10px 20px;
   }
    body.page-Hauptseite div#header_top h1{
       padding-top: 420px;
       font-size: 62pt;
       padding-left: 140px;
   } 
}


@media (min-width: 1024px) and (max-width:1279px){
   body.page-Hauptseite div#header_top {
      height: 440px;
      background-size: 1290px;
   }
   .navbar-brand {
      border-right:0px;
   }
   .nav > li > a{
      padding:10px 10px;
   }
    body.page-Hauptseite div#header_top h1{
      padding-top: 280px;
      font-size:48pt;
      padding-left: 60px;
   }
}
@media (min-width: 800px) and (max-width:1023px){
   body.page-Hauptseite div#header_top {
      height: 350px;
      background-size: 1030px;
   }
   .navbar-brand {
      border-right:0px;
   }
   .nav > li > a{
      padding:10px 10px;
   }
   body.page-Hauptseite div#header_top h1{
      padding-top: 220px;
      padding-left: 67px;
      font-size:46px;
   }
}
@media (min-width: 641px) and (max-width:799px){
    body.page-Hauptseite div#header_top {
      height: 250px;
      background-size: 800px;
   }
   .navbar-brand {
      border-right:0px;
   }
   .nav > li > a{
      padding:10px 10px;
   }
   body.page-Hauptseite div#header_top h1{
      padding-top: 180px;
      padding-left: 58px;
      font-size:32px;
   }
}
@media (min-width: 361px) and (max-width:640px){
 body.page-Hauptseite div#header_top {
      height: 200px;
      background-size: 640px;
   }
   .navbar-brand {
      border-right:0px;
   }
   .nav > li > a{
      padding:10px 10px;
   }
   body.page-Hauptseite div#header_top h1{
     padding-top: 140px;
    padding-left: 40px;
    font-size: 28px;
   }
}


@media (max-width:360px){
 body.page-Hauptseite div#header_top {
      height: 190px;
      background-size: 640px;
   }
   .navbar-brand {
      border-right:0px;
   }
   .nav > li > a{
      padding:10px 10px;
   }
   body.page-Hauptseite div#header_top h1{
     padding-top: 140px;
     padding-left: 45px;
     font-size: 28px;
   }
}

/*Seitenntitel ausgeschaltet*/
body.page-Hauptseite h1#firstHeading{
   display:none;
}

/*Infoboxen*/ 
.infoHeader{
    border:1px solid #D9826E;
    color:#D9826E;
    padding:10px 0;
    text-align:center; 
    height:auto; 
    margin:20px 0 20px 0; 
    font-weight:bold; 
}

div.infoFooter{
    border: 1px solid #225588;
    padding: 5px;
    clear: both;
}

.flex-container {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
    flex-wrap: wrap;
} 


div.flex-container>div:nth-child(1){
    border-width:1px 5px 1px 1px;
    border-color:#f1ebdd;
    border-style:solid;
    margin-bottom:10px;
    padding:10px;
    background-color:#bcc9b5;
}

div.flex-container>div:nth-child(2){
    border-width:1px 5px 1px 5px;
    border-color:#f1ebdd;
    border-style:solid;
    margin-bottom:10px;
    padding:10px;
    background-color:#f5ceac;
}
div.flex-container>div:nth-child(3){
    border-width:1px 1px 1px 5px;
    border-color:#f1ebdd;
    border-style:solid;
    margin-bottom:10px;
    padding:10px;
    background-color:#bcc9b5;
}



 /*################## Button Form ##################*/
.mw-ui-button.mw-ui-progressive,
.mw-ui-button.mw-ui-progressive:hover{
    background-color:#B20904;
    border:0px;
    color:#FFF;
}

.mw-ui-input:focus {
    border-color: #B20904;
    box-shadow: inset 0 0 0 1px #B20904;
    outline: 0;
}


 /*################## Button Form ##################*/
.form-control {
    border: 1px solid #B20904;
    color: #B20904;
}
.form-control::placeholder {
    color: #B20904;
    opacity: 0.5;
}
.p-navbar .navbar-form button {
    color: #B20904;
}

.p-search .searchGoButton:last-child, .p-search .mw-searchButton:last-child {
    border-right-color: #B20904;
}

.p-search .searchGoButton, .p-search .mw-searchButton {
    border-top-color: #B20904;
    border-bottom-color: #B20904;
    border-left-width: 0;
}

.btn-light, .p-search .searchGoButton, .p-search .mw-searchButton {
    background: #EDE8DE linear-gradient(180deg,#eceff1,#EDE8DE) repeat-x;
}


/*Infobox Orte*/
table#vorlage-infobox-Orte {
    background-color: #FFF;
    border: 1px solid #DDD;
    float: right;
    width: 380px;
}

/*################## Bild Daten Tabelle ##################*/

#vorlage-infobox-Bilddaten{
    margin-top:0px;
    float: right;
    width:298px;
}

#vorlage-infobox-Bilddaten .bilddaten_headline{
    text-align: center;
    color: #f1ebdd;
    background: #8c8a75;
    font-size: 1.1em !important;
    font-weight:bold;
}

/*################## Artikel Daten Tabelle ##################*/



#vorlage-infobox-Bibliografie .bibliografie_headline{
    text-align: center;
    color: #86100f;
    background-color: #d9826e !important;
    font-size: 1.1em !important;
}
#vorlage-infobox-Orte th {
    font-weight:bold;
    background-color:#a3b561;
    color:#FFF;
}

/*################## Orte Daten Tabelle ##################*/
table#vorlage-infobox-Orte {
    background-color:#FFF;
    border:1px solid #DDD;
    margin-left:25px; 
}
table#vorlage-infobox-Orte tr > td,
table#vorlage-infobox-Orte tr > th{
  padding:5px 8px;
   border:1px solid #DDD;
}


/*################## Page Glossar ##################*/
.page-Glossar table{
    margin-bottom:10px;
}

.page-Glossar table>tbody>tr>td{
    padding:10px;
}

/*################## Tabelle Ortsseiten ##################*/
.table > tbody > tr >td:first-child{
   font-weight:bold;
   vertical-align: top; 
   width:280px; 
}