﻿/*Style mit altem Papier*/

html {
	font-family: 'Arial', sans-serif;
}

body{
    background: url("../grafik/altespapier.jpg");
	margin: 0px 0px 0px 0px;
	font-family: light;
	font-family: 'Arial', sans-serif;

}

#head{
    width: 100%;
    height: 160px;
    background-color: black;
    top: 0;
    right: 0;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

#foot{
	margin-top: 50px;
    width: 100%;
    background-color: black;
}

.carousel-inner>.item>img, .carousel-inner>.item>a>img {
	margin: auto;
}


h1, h2, h3, p, a, #closemenu, table, div{
	font-family: 'Arial', sans-serif;
}

h1 {
	text-align: center;
}

.schriftlogo {
	width: 35%;
}

.linkkachel {
	display: block;
	color: white;
	text-decoration: none;
}

.linkkachel:hover {
	text-decoration: none;
	color: white;
}

.kachel {
	height: 400px;
	width: 80%;
	margin: auto;
	margin-bottom: 50px;
	position: relative;
	z-index: 0;
}

.kachel:hover {
	-ms-transform: scale(0.98, 0.98); /* IE 9 */
    -webkit-transform: scale(0.98, 0.98); /* Chrome, Safari, Opera */
    transform: scale(0.98, 0.98);

    -moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition:0.5s;
	cursor: pointer;
}

.kachellinks {
	float: left;
	width: 50%;
	height: 400px;
}

.kachelrechts {
	float: right;
	width: 50%;
	height: 400px;
}



#idee{
    background-color: rgba(255, 90, 35, 0.5);
}
#ideerechts {
	background: url(../files/idee800400.png);
	-webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#wir {
    background-color: rgba(80, 210, 230, 0.5);
}
#wirlinks {
	background-image:url(../files/wer.jpg);
	background-position: right;
}

#wo {
    background-color: rgba(80, 180, 70, 0.5);
}
#worechts{
	background-image:url(../files/wo800400mit.png);
}

#aktuell {
    //background-color: rgba(244, 143, 177, 0.5);
    background-color: rgba(245, 218, 129, 0.5);
}
#aktuelllinks {
	background-image:url(../files/aktuelles800400.png);
	background-position: right;
}

#presse {
    //background-color: rgba(245, 218, 129, 0.5);
    background-color: rgba(60, 130, 211, 0.5);
}

#presserechts {
	background-image:url(../files/presse.png);
}

#galerie {
    background-color: rgba(239, 83, 80, 0.5);
//    background-color: rgba(243, 226, 169, 0.5);
}
#galerielinks {
	background-image:url(../files/galerie.png);
	background-position: right;
}

#eigener {
    background-color: rgba(215, 188, 103, 0.5);
    //background-color: rgba(141, 110, 99, 0.5);
}
#eigenerrechts {
	background-image:url(../files/eigener800400.png);
}

#weitere {
    background-color: rgba(141, 110, 99, 0.5);
    //background-color: rgba(255, 180, 66, 0.5);
    //background-color: rgba(173, 116, 231, 0.5);
}
#weiterelinks {
	background-image:url(../files/weblinks800400.png);
	background-position: right;
}


#sponsoren {
    background-color: rgba(70, 180, 100, 0.5);
}
#sponsorenrechts{
	background-image:url(../files/wo800400mit.png);
}


/*
#idee::after, #wir::after, #wo::after, #aktuell::after, #presse::after, #galerie::after, #eigener::after, #weitere::after {
	content: "→";
	display: block;
	font-size: 35px;
	padding-left: 5%;
}
*/

.center {
	margin: auto;
}


#navigation {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: black;s
}

#navigation li {
    float: left;
    padding-top: 0px;
    text-align: center;
}

#navigation li a {
    display: block;
    color: white;
    padding: 14px 16px;
    text-decoration: none;
    font-family: sans-serif;
    font-size: 16px;
}

#navigation li a:hover {
    background-color: #212120;
    border: none;
}

#navigation li {
	transition-property: width;
    transition-duration: 1s;
}


#logo:hover {
	/*background-color: #212120;*/
    border: none;
}

#logo {
	position: absolute;
    left: 50%;
    margin-left: -50px;
}

#closemenu {
	display: none;
	margin-left: 310px;
	text-decoration: none;
	background: none;
	border: none;
	color: white;
	font-size: 25px;
	font-weight: bold;
	margin-top: 35px;
	width: 35px;
	height: 35px;
	position: absolute;
}

.activenav {
    background-color: #424242 !important;
}



#navdiv {
	background-color: #212120;
	position: absolute;
	width: 100%;
	margin-top: 110px;
}

#menu {
	display: none;
	margin-top: 35px;
}

p {
	font-size: 18px;
}
.inhalt {
	/*background-color: rgba(255, 242, 204, 0.5);*/
	/*padding: 20px;*/
	width: 70%;
	margin: auto;
}



.13px {
	font-size: 13px;
}

#wobsp {
	width: 90%;
	background-image: url();
}

#footerleiste p a{
	color: #BDBDBD;
}

#footerleiste p a:hover{
	color: white;
	text-decoration: none;
	font-size: 19px;
	-moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition:0.5s;
}

#footerleiste{
	margin-left: 10%;
	padding-top: 14px;
	background: black;
	font-size: 15px;
	height: 50px;
}

.sitemap {
	background: #151515;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 1px solid grey;
	padding-left: 10%;
	color: white;
	height: 220px;
}

.sitemap a{
	color: #E6E6E6;
	list-style-type: none;
	font-size: 16px;
}

.sitemap a:hover{
	color: white;
	text-decoration: none;
	font-size: 17px;
	-moz-transition: 0.5s;
	-webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition:0.5s;
}

.sitemaplist li{
	list-style-type: none;
	padding-bottom: 5px;
}


.sitemaplist {
	padding-left: 50px;
	float: left;
}


body {
	position: relative;
}

#foot {
	float: right;
	right: 0;
	bottom: 0;
	left: 0;
}

@media screen and (max-width: 1300px){
	#navdiv {
		float: left;
		margin-top: 0px;
	}
	#navigation li:first-child {
		margin-top: 30px;
	}
    #navigation li {
    	float: none;
    }
    #navigation li {
    	display: none;
	}
	#menu {
		display: inline;
		border: none;
		background: none;
	}

	#foot{
		text-align: center;
	}
	#footerleiste, #foot {
		padding-left: 0;
		margin-left: 0;
	}
	.sitemap {
		text-align: center;
		padding-left: 0;
		height: 350px;
	}
	.sitemaplist {
		float: none;
		padding-left: 0;
	}

	.kachel {
		height: 600px;
		width: 800px;
		font-size: 14px;
	}
	.bild {
		position: absolute;
		float: left;
		z-index: 2;
		width: 800px;
		margin: auto;
	}
	.schrift{
		position: absolute;
		float: right;
		margin-top: 200px;
		padding-top: 200px;
		z-index: 1;
		width: 800px;
		margin-right: auto;
		margin-left: auto;
	}
	.linkdiv img{
		max-width: 100% !important;
	}
}

@font-face {
	font-family: Suetterlin;
	src: url(../font/18thCtrKurStart.ttf);
}
.sutterlin {
	font-family: Suetterlin;
}
.psutterlin {
	font-size: 35px;
}

@media screen and (max-width: 800px){
	.kachel, .kachellinks, .kachelrechts {
		width: 90%;
		/* -ms-transform: scale(0.4, 0.4); /* IE 9 */
   		/* -webkit-transform: scale(0.4, 0.4); /* Chrome, Safari, Opera */
   		 /* transform: scale(0.4, 0.4);
   		 margin-right: 100px;
   		 float: left; */
   		 margin-left: auto;
   		 margin-right: auto;
	}
	.kachel h1 {
		font-size: 20px;
	}
	.schriftlogo {
		width: 80% !important;
	}
	#galerie2 {
	  /* Prevent vertical gaps */
	  line-height: 0;

	  -webkit-column-count: 3 !important;
	  -webkit-column-gap:   0px !important;
	  -moz-column-count:    3 !important;
	  -moz-column-gap:      0px !important;
	  column-count:         3 !important;
	  column-gap:           0px !important;
	}
	#wirlinks {
		background-position: center;
	}
	#myCarousel2 .carousel-indicators {
		display: none;
	}
}

@media screen and (max-width: 500px){
	#galerie2 {
	  /* Prevent vertical gaps */
	  line-height: 0;

	  -webkit-column-count: 2 !important;
	  -webkit-column-gap:   0px !important;
	  -moz-column-count:    2 !important;
	  -moz-column-gap:      0px !important;
	  column-count:         2 !important;
	  column-gap:           0px !important;
	}
	#myCarousel2 .carousel-indicators {
		display: none;
	}

	.pressediv img{
		display: block !important;
		float: none !important;
	}
}

@media screen and (max-width: 400px){
	.kachel, .kachellinks, .kachelrechts {
		width: 90%;
		/* -ms-transform: scale(0.4, 0.4); /* IE 9 */
   		/* -webkit-transform: scale(0.4, 0.4); /* Chrome, Safari, Opera */
   		 /* transform: scale(0.4, 0.4);
   		 margin-right: 100px;
   		 float: left; */
   		 margin-left: auto;
   		 margin-right: auto;
	}
	.schriftlogo {
		width: 90% !important;
	}
	#myCarousel2 .carousel-indicators {
		display: none;
	}
	.inhalt {
		width: 90% !important;
	}
}



@media screen and (min-width: 1301px){
	#closemenu {
		display: none !important;
	}

	#navigation {
		width: 100% !important;
		height: auto !important;
		position: relative !important;
	}

	.carousel-indicators {
		display: initial !important;
	}
}

.test {
	background-color: red;
}

.beitraege {
	margin: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid black;
	width: 80%;
	font-size: 16px;
	background-color: rgba(255, 255, 255, 0.4);
}

.thdatum {
	float: right;
	padding-right: 5px;
}

.thname {
	padding-left: 5px;
}

.beitraege th {

}

.beitraege td {
	border-top: 1px solid black;
	padding-left: 5px;
}

.td1 {
	width: 88%;
}

#beitragformtxt {
	width: 100%;
}

#formbeitrag {
	width: 80%;
	margin: auto;
	font-size: 16px;
}

#fehlerchannel {
	display: none;
	font-size: 20px;
	color: red;
}

#richtigchannel {
	display: none;
	font-size: 20px;
	color: green;
}

.bildrechts img{
	float: right;
	margin: 10px;
}

.bildlinks img{
	float: left;
	margin: 10px;
}

.prewrap {
    white-space: pre-wrap;
}

.btn {
    background-color: #424242;
    border: none;
    color: white;
    padding: 10px 25px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}

.btn:hover {
    background-color: #616161;
    color: black;
}

#nichts {
	list-style: none;
}

#galerie2 {
  /* Prevent vertical gaps */
  line-height: 0;

  -webkit-column-count: 5;
  -webkit-column-gap:   0px;
  -moz-column-count:    5;
  -moz-column-gap:      0px;
  column-count:         5;
  column-gap:           0px;

  width: 70%; /* Weite der Bilder */
  margin: auto;
}

#galerie2 img {
  /* Just in case there are inline attributes */

  width: 100% !important;
  height: auto !important;
  padding-top: 25px !important; /* Die Weite der LÃ¼cken zwischen den Bildern */
  padding-left: 25px !important;

}

#galerie2 img:hover {
	cursor: pointer;
}

#myCarousel2 .carousel-inner > .item > img {
	max-height: 85vh;
	width: auto;
}
#myCarousel .carousel-inner > .item > img {
	max-height: 50vh;
	width: auto;
}
/*#myCarousel2.carousel.slide {
    width: 100%;
    max-width: 450px !important;
		max-height: 85vh !important;
		overflow: hidden;
}
*/
/*#myCarousel.carousel.slide {
    width: 100%;
    max-width: 450px !important;
}
*/

#myCarousel, #myCarousel2, #galerie3 {
	margin: auto;
}

#bilderanzahl {
	color: white;
	font-size: 16px;
	text-align: center;
}

#zurueck {
	display: block;
	margin: auto;
	margin-top: 0px;
}

#myCarousel2 .carousel-indicators li{
	display: none;
}

#galerie3 {
	position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 2;
}

#myCarousel2 {
	top: 0;
}

#weiterelinks div {
	overflow: hidden;
	margin-top: 20px;
}
.sponsorendiv {
	margin-bottom: 30px;
}

.sponsorendiv img {
	max-width: 300px;
	float: left;
	overflow: hidden;
	margin-right: 10px;
	padding: 20px;
	background-color: white;
}

._linksdiv img{
	max-width: 30%;
  height: auto;
	float: left;
	padding-right: 10px;
}

._linksdiv {
	padding-top: 50px;
	overflow: hidden;
}

.inhalt .linkdiv {
	margin: auto;
}

.aktuellesdiv p:first-of-type, .pressediv p:first-of-type{
	display: block;
}

.aktuellesdiv img {
	max-width: 330px;
	float: left;
	overflow: hidden;
	margin: 10px;
	padding: 6px;
	background-color: rgba(1,1,1,0.1);
}

.pressediv img img{
	max-height: 300px;
	height: auto;
	float: left;
	padding-right: 10px;
}

.pressediv, .aktuellesdiv {
	overflow: hidden;
	margin-bottom: 30px;
}
