@import url(style.navi.css);
@import url(style.shop.css);
@import url(style.forum.css);
code                 {font-size: 11px; font-family: courier, verdana, arial, helvetica, sans-serif; }
fieldset             {padding: 6px; margin: 6px; border:1px solid #ddd}
legend               {font-size: 11px;  padding:4px; color:#777}
td,th,div,input,
textarea,
select,option        {font-size: 14px; color: #000; font-family:  Arial, Verdana, Helvetica, sans-serif;}
option         		{border:none}
textarea             {padding:2px}
form                 {/*display:inline; */
             margin: 2px;}
small                {font-size:10px}
fieldset             {border-color:#ccc}
h1							{font-size:18px}
h2							{font-size:16px; color:#006699}
a h2:hover   			    {color:#cccccc}
h3							{font-size:15px; color:#ff6600}
p,ul,ol,li					{font-size:14px;}
p							{margin-top: revert;}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {color:#0084b5;} 
/*.navbar-light .navbar-nav .nav-link {color:#0084b5;} */
.img img {
    margin-right: 20px; 
	margin-bottom: 10px; 
    border:1px solid #eeeeee;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 0.1em 0.1em 3px 1px rgba(200,200,200,0.5); /* Ïàðàìåòðû òåíè */
}

.img-r img {
    margin-left: 10px; 
	margin-bottom: 10px; 
    border:1px solid #eeeeee;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 0.1em 0.1em 3px 1px rgba(200,200,200,0.5); /* Ïàðàìåòðû òåíè */
}

.img a img:hover { opacity:.75; }

.img-r a img:hover { opacity:.75; }
.img-soc a img:hover { opacity:.75; }
/* ----------  Haupttabelle ---------- */
.mainbody             {width: 95%; max-width: 1400px; background-color: #ffffff; padding:8px;  text-align:left; border:2px solid #cccccc; margin: auto;}

/* ----------  Seitenhintergrund ---------- */
html body             {margin:5px; background:#858585 url('../img/background.jpg') no-repeat center top; background-attachment: fixed;}

/* ----------  Seitenkopf   ---------- */
.pageheader           {background: url(../img/page/header_bg.gif); max-height:160px}
.pageheader   img        { max-width:100%; }
.pageheader   a img:hover {opacity:1;}
#layout { /*overflow: hidden;*/
display:table;
width:100%;} 
#layout >div{ 
display:table-cell;
vertical-align:top;} 

/* ----------  linke & rechte Spalte ---------- */
#leftnavi             {width:210px; padding-top:8px}
#rightnavi            {width:200px; padding-top:8px; background-color: #ffffff;}

/* ----------  mittige Spalte bzw. Inhalt ---------- */
#content              { margin: 0 200px 0 210px; background-color: #ffffff;}
.content-div              {padding-left:30px; padding-right:30px; padding-top:15px;}

.icons  a img  {padding:3px;}

.reclama {font-size:9px; color:#696969; font-weight:bold; text-align: right; font-style: italic}

.fotogaler  { max-width: 800px;
margin: 0 auto;
display: -webkit-flex; /* Safari */
 display: flex;
    flex-wrap: wrap;
	justify-content: space-around;
}

.fotogaler-poll  { max-width: 660px;
margin: auto;
display: -webkit-flex; /* Safari */
 display: flex;
    flex-wrap: wrap;
	justify-content: space-around;
}

.foto-poll {
border: 1px solid #CCCCCC;
float: left;
margin: 5px;
}

.foto1 {
border: 1px solid #CCCCCC;
max-width: 255px;
float: left;
margin: 5px;
}

.foto3 {
border: 1px solid #CCCCCC;
max-width: 300px;
float: left;
margin: 5px;
}

.fotocalend {
float: left;
margin: 5px;
}
.fotocalend-small{
border: 1px solid #CCCCCC;
padding:2px;
float: left;
margin: 5px;
}

.foto1 p{
font-size:12px;
text-align:center;
padding:3px;
}

.foto2 {
width: 200px;
height: 180px;
margin: 0 2px;
padding:2px;
}

.foto2 p{
font-size:12px;
text-align:center;
padding:3px;
font-weight:bold;
}
.videobox {
display: -webkit-flex; /* Safari */
 display: flex;
    flex-wrap: wrap;
	justify-content: center;
} 
.video {
border: 1px solid #CCCCCC;
width: 340px;
float: left;
margin: 5px;
font-size:12px;
text-align:center;
font-weight:bold;
}

.videonew {
max-width: 100%; 
position: relative;
width: 100%; 
padding-bottom: 56%;
}
.videonew  iframe{
width: 100%; height: 100%; position: absolute;
}

.textshadow {
    background: #e5f9ff; /* Öâåò ôîíà */
    box-shadow: 0.4em 0.4em 5px rgba(122,122,122,0.5); /* Ïàðàìåòðû òåíè */
    padding: 10px;
	margin: auto;
	width: 80%;
	border:1px solid #d4f0f8;
   }


/* ----------  Links ---------- */
a:link,a:visited      {color: #0084b5; text-decoration:none;}
a:hover               {color: #cccccc; text-decoration:none;}

/* ----------  Links der Navigations-Boxen ---------- */
a.links_boxes:link,
a.links_boxes:visited {color: #0084b5; text-decoration:none}
a.links_boxes:hover   {color: #cccccc; text-decoration:none}

a.light:link,
a.light:visited       {color: #0084b5; text-decoration: none; font-weight: normal;}
a.light:hover         {color: #cccccc;text-decoration:none;font-weight: normal;}

/* ----------  Hauptkategorie-Link Downloads & Links ---------- */
a.categtitle_b:link,
a.categtitle_b:visited{color: #cccccc; font-size:15px; font-weight:bold}
a.categtitle_b:hover  {color: #0084b5; font-size:15px; font-weight:bold}

/* ----------  Links unter Newstitel ---------- */
a.newsintro:link      {color: #0084b5;font-weight:normal; text-decoration:none}
a.newsintro:visited   {color: #0084b5;font-weight:normal; text-decoration:none}
a.newsintro:hover     {color: #cccccc;font-weight:normal; text-decoration:none}

/* ----------  Link News + Artikelarchiv ---------- */
a.ticker:link        {font-size:11px; font-weight:bold; line-height:22px}
a.ticker:visited     {font-size:11px; font-weight:bold; line-height:22px}
a.ticker:hover       {color: #cccccc; font-size:11px; font-weight:bold; line-height:22px}

/* ----------  Links der Speedbar- Navigation ---------- */
a.speedbar:link		 {font-weight:bold; color:#464646;text-decoration:none}
a.speedbar:visited   {font-weight:bold; color:#464646;text-decoration:none}
a.speedbar:hover     {font-weight:bold; color:#f7941d;text-decoration:none}

/* ----------  Hauptüberschriften Boxen + Hintergrund ---------- */
.navigation_box       {background:#ffffff; height:25px; padding-left:12px; line-height:25px; font-weight:bold; color:#464646; border-bottom:1px solid #464646}

/* ----------  Hintergrund Boxen ---------- display:inline;*/
.navigation_box_bg    {background:#ffffff; padding:5px}

#archivebox h1     { font-size:17px; font-weight: bold}
#archivebox h2     { font-size:16px; font-weight: bold}

/* ----------  1. und 2. alternierende Zeilenfarbe ---------- */ 
.row_first            {background-color: #d7f5ff}
.row_second           {background-color: #effbff}

/* ----------  Normale Boxen (Inhalte) ---------- */
.box_inner            {background-color:#ffffff;} 
.box_inner_body       {background-color:#ffffff;}

/* ----------  Formatierung Tabelle "Downloadpopup, Login, galeriebild, Inlineshot ---------- */ 
.outer_boxborder    {background-color: #ffffff; margin: 1px; padding: 1px; border: 1px solid #f7941d;}

/* ----------  Box Kommentare News, Gästebuch, usw ---------- */
.commentfield         {border:1px solid #ffffff; color:#666; padding:10px; background-color:#ffffff; margin-bottom:3px}

/* ----------  Zellenauffüllung Inhaltboxen ---------- */
.box_padding          {padding:4px}

/* ----------  Titel Suchergebnisse ---------- */
.title_result_search  {font-size:14px; font-weight:bold}

/* ----------  Newstitel in Newsansicht ---------- */
.title_big            {font-size:18px; font-weight:bold; color:#777}

/* ----------  Artikel-Text eigene Ansicht ---------- */
.article              {text-align:justify}

/* ----------  Topnews / Topartikel Startseite ---------- */
.topnews              {border-bottom: 1px solid #ddd; background: #e2f4f8 url(../img/lightning.png) left no-repeat; padding:5px; margin-top:5px; padding-left: 30px;}
.topnews-txt          {font-size:12px;}
td.intro.topnews-txt p  {font-size:12px;}

/* ----------  Ëåíòà Ñîöñåòåé ---------- */
.societynews              {border-bottom:1px solid #ddd; border-top:1px solid #ddd; background-color:#fff}

/* ----------  Newsansicht wenn 1-Spaltig ---------- */
.content_left_one      {}

/* ----------  Obere Navigation ---------- */
.topnavtd              {border-bottom:1px dotted #0084b5; border-top:1px dotted #0084b5; background-color: #fff;} 
.speedbar              {color:#464646}

/* ----------  Linien unter und oberhalb von Navigationen (News und Artikel ---------- */
.hrdiv                 {height:1px; background-color:#D7D7D7; margin-top:5px; margin-bottom:5px}

/* ----------  Trenner: Trennt einzelne Artikel in Archiven News & Artikel ---------- */
.news_spacer           {border-bottom:1px solid #fff;}

/* ----------  Mittige Bild - Ausrichtung ---------- */
.absmiddle             {vertical-align:middle}
img.absmiddle:hover {opacity:.75;} 

/* ----------  Inlineshot ---------- */
.inlineshotbox         {margin-top:10px; margin-right:10px; float:left; border:0px solid #ddd; width:130px; padding:1px;}
.inlineshot_text       {background-color:#ffffff; padding:2px; color:#464646;}

/* ----------  Normale Boxen Titel(Inhalte) ---------- */
.box_innerhead         {background:#ffffff;padding:5px; border-bottom: 1px solid #858585; font-weight:bold; position:relative}

/* ----------  Container Boxen (Beinhalten Normale Boxen) ---------- */
.box_outer             {background-color: #ffffff; font-size: 10.0pt; }
.box_outerhead         {background-color: #ffffff; padding: 8px; font-size: 10.0pt; position:relative}

/* ----------  Boxen (Archiv- Auswahl in News & Artikelarchiv) ---------- */
.box_archive_selector  {}

/* ----------  0px Rahmen Style für IE (Checkboxen) ---------- */
.noborder              {border: 0px}

/* ----------  Schaltflächen  ---------- */
.button,.button_bbodes {font-weight: bold;font-size:12px;color: #ffffff;background-color: #0084b5; cursor: pointer; border: 1px solid #ffffff; margin-right:1px}

/* ----------  Codeboxen für HTML und PHP ---------- */				
.divcode               {background-color:#fff;}

/* ----------  Fehlermeldungen ---------- */	
.errorfont             {color: red;  font-weight: normal;}

/* ----------  Seiten-Navigation 1,2,3 usw. ---------- */
a.page_navigation:link,
a.page_navigation:visited{font-weight:normal;color:#fff;background-color:#C0C0C0;text-decoration: none;padding-bottom:1px;padding-left:4px;padding-right:4px;padding-top:1px}

a.page_navigation:hover,
a.page_navigation,.pnav  {font-weight:normal;color:#fff;background-color:#777;text-decoration: none;padding-bottom:1px;padding-left:4px;padding-right:4px;padding-top:1px;}

/* ----------  Spalte in Archiven zwischen 2 Artikeln (News + Artikel) ---------- */
.newsticker_header      {border-top:1px dotted #0084b5; border-bottom:1px dotted #0084b5; background-color:#f6f6f6;padding:2px;text-align: right}

/* ----------  Datumformatierung (News + Artikel + PN) ---------- */
.time_ticker,.time      {font-weight:bold;}		

/* ----------  Kurzintro News, Einleitung Topnews, Untertitel Artikel  ---------- */
.text_ticker            {line-height:15px;font-weight: bold;}

/* ----------  Hervorhebung von Suchergebnissen ---------- */ 
.highlight              {font-weight:bold }

/* ----------  Tabellenrahmen Galeriebilder ---------- */ 
.gallery_box	        {padding:2px; margin:2px; border:1px solid #ddd; }
.gallery_nextthumb	    {float:left; width:10%; padding:2px; text-align:center}

/* ----------  Rahmen aktives & inaktives Bild / Galerie ---------- */ 
.active_image		    {border: 1px solid #000}
.inactive_image		    {border: 1px solid #ccc}

/* ----------  Text unter jedem Bild (Hits / Kommentare) ---------- */ 
.galimage_smalltext     {font-size:11px;color:#666}

/* ----------  Textformatierung F.A.Q ---------- */
.faqtext                {padding: 8px;}

/* ----------  Auswahlmenü "Hersteller" ---------- */
.selectfield            {background-color:#ebebeb; border: 1px solid #0084b5; overflow:auto; height:100px; padding: 3px}

/* ----------  Punktlinie Artikel, Testinfos ---------- */
.infostretch		    {background-image: url(../img/page/infostretch.gif);}
.infostretch_back	    {background-color:#fff}
.infostretch_left	    {background-image: url(../img/page/infostretch.gif); float:left; width:60% ; text-align:left; background-position: 2px; overflow:hidden}
.infostretch_right      {background:url(../img/page/infostretch.gif)}

/* ----------  Seitefuß Copyrighthinweis ---------- */
.page_footer		    {background-color: #d7f5ff; border: 1px solid #b3e1ee; padding:5px; margin:0;}
.page_footer  a:hover {color: #FFF}

/* ----------  DIV CONTAINER AGB REGISTRIERUNG ---------- */
.agb_container_payment   {border:1px solid #DCDCDC;padding:2px;height:180px;overflow:auto;background-color:#fff}

/* ----------  DIV CONTAINER AGB REGISTRIERUNG WENN FEHLER ---------- */
.agb_container_payment_error{border:1px solid #DCDCDC;padding:2px;height:180px;overflow:auto;background-color:#fff}

/* Kalender */
/* Kalender - Hintergrund */
.calendarBackground {background-color:#fff;}

/* Kalender - Rahmen */
.calendarBorder     {border: 1px solid #d1d1d1; padding:3px; margin:5px;}   /*background-color:#d1d1d1;*/

/* Select - Felder */
.calendarForms      {border: 1px solid #cccccc}

/* Titel des Kalenderereignis */
.calendarEventTitle {font-size:18px; font-weight:bold}
.calendarEventTxt a {font-size:14px; font-weight:bold;}

.calendarEventImg img { margin:10px; border:1px solid #ddd; float:left; width:200px;  border-radius: 100px;}
.calendarnumEventImg img { margin:5px;  padding:3px; border:1px solid #ddd; float:left; width:45%;}

/* Alter eines Benutzers (Geburtstag) */
.calendarNorm       {font-weight:normal; font-size:11px}

/* Hintergrund Tage, die nicht zum Monat gehören + linke Spalte (Wochenansicht) */
.calendarBlanc      {background-color:#f7f7f7}

/* Tabellenkopf Tage (kleine + großer Kalender) */
.calendarHeader     {background-color:#56b8ce; color:#fff; font-weight:bold;padding:2px;text-align:center}
.calendarHeaderBig  {background-color:#56b8ce; color:#fff; font-weight:bold;padding:8px;text-align:center}

/* Inaktive Kalendertage (kleine + großer Kalender) */
.calendar           {color:#777; background-color:#eeeeee; font-weight:normal; padding:3px}
.calendarBig        {color:#777; height:90px;background-color:#eeeeee;font-weight:normal; padding:3px}

/* Kalendertage, die nicht zum aktuellen Monat gehören */
.calendarInactiveDay{color:#ccc;font-style:italic; font-size:10px;padding:4px}

/* Aktive Kalendertage heute (kleine + großer Kalender) */
.calendarToday      {background-color:#56b8ce; color:#ffffff; font-weight:bold; padding:3px}
.calendarTodayBig   {height:90px;background-color:#fff;border: 1px solid #56b8ce;font-weight:bold; font-size:14px;padding:4px}

/* Links Kalender - Ereignisse */
a.calendarEventLink:link,
a.calendarEventLink:visited {color:#0B5567;text-decoration:none;font-weight:normal;font-size:12px}
a.calendarEventLink:hover   {color:#56b8ce;text-decoration:none;font-weight:normal;font-size:12px}

/* Links für kleinen Kalender heutiger Tag */
a.calendarLinkSmall:link,
a.calendarLinkSmall:visited {color:#fff;text-decoration:underline; font-size:12px}
a.calendarLinkSmall:hover   {color:#fff;text-decoration:none; font-size:12px}

/* Kalender - Links (Datumlink) inaktiver Tage (nicht heute) */
a.calendarLink:link,
a.calendarLink:visited {color:#f7941d;text-decoration:none;font-size:12px}
a.calendarLink:hover   {text-decoration:none;font-size:12px}

/* ----------  Muss nicht editiert werden ---------- */
/* ----------  Setzt 'float' auf 0 ---------- */
.clear                 {clear:both}
.floatcontent          {padding:3px; padding-top:8px; min-height:80px; /* ----------  FÜR IE: ---------- */ _height: 6em }

.floatcontent  img {box-shadow: 0.2em 0.2em 3px rgba(200,200,200,0.5); /* Ïàðàìåòðû òåíè */
margin-right: 10px; border:1px solid #eeeeee;   border-radius: 100px;
}

.floatcontent a img:hover { opacity:.75; }

.calendarnumberPDF img{
margin-left:2px; 
margin-right:2px; 
max-width:100px; 
min-width:30px; 
width:100%}

.banner-right-calend {
box-shadow: 0.1em 0.1em 3px 1px rgb(200 200 200 / 50%);
padding:2px; 
margin:7px;
}

.banner-right  {
/*border: 1px solid #cccccc; */
padding:2px; 
margin:7px;
}
.banner-right a img:hover { opacity:.75; }

#photo-wall-gallery{
	max-width: 800px;
	margin: 0 auto;
display: -webkit-flex; /* Safari */
 display: flex;
    flex-wrap: wrap;
	justify-content: space-around;
}


.gallery-container {
	width: 100%;
	margin: 10px auto;
	overflow: hidden;
}
.gallery-container div{
/*		-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
border: 1px solid #CCCCCC;*/
width: 21%;
float: left;
padding:2px;
	font-size:12px;
text-align:center;
padding:3px;
 }
 
.gallery-container p{
	font-size:12px;
text-align:center;
padding:3px;
} 

.gallery-container h3{
		font-size:12px;
text-align:center;
padding:3px;
text-transform: uppercase;
} 


/*.gallery-container ul li {
	list-style:none;
	float: left;
	font: 10px/1.5 Verdana, Helvetica, Sans-serif;
	width: 21%;
	margin: 2% 2% 30px 2%;
}*/
 
 
.gallery-container  a { 
	color: #5d5f5d;
}
 
.gallery-container  a img {
	max-width: 100%;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    box-sizing: border-box;
	box-shadow: 0.2em 0.2em 2px rgba(150,150,150,0.5);
	border-radius: 5px;
}
.container-fluid {
  padding-left: 0;
  padding-right: 0;
}
.gallery-container a img:hover { opacity:.75; }

section {
  margin: 0;
  overflow: hidden;
}
 
 
/* 100% - (5 * 4%) = 80% */
/* 80%/5 = 16% */
/* 100% - (4 * 4%) = 84% */
/* 80%/4 = 21% */
/* Media Queries */
 
@media only screen and (min-width : 941px) {
	.gallery-container div:nth-child(4n+1){
		clear:left;
	}
}
  
@media only screen and (min-width: 721px ) and (max-width : 941px) { 
	.gallery-container div{
		width: 29.33333%
	}
	.gallery-container div:nth-child(3n+1){
		clear:left;
	}
}
 
/* 100% - (3 * 4%) = 88% */
/* 88%/3 = 29.33333% */
 
@media only screen and (min-width: 618px ) and (max-width : 721px) { 
	.gallery-container div  {
		width: 46%
	}
	.gallery-container div:nth-child(2n+1){
		clear:left;
	}
}
 
/* 100% - (2 * 4%) = 92% */
/* 92%/2 = 46% */
 
@media only screen and (min-width: 320px ) and (max-width : 618px) { 
	.gallery-container div {
		width: 96%
	}
/*	.gallery-container ul li:nth-child(2n+1){
		clear:left;
	}*/
 .banner  {width:100%}
}
 
/* 100% - 4% = 96% */
/* 96% */
 
@media only screen and (max-width : 320px) {  
	.gallery-container div  {
		width: 96%
	}
	.banner  {width:100%}
}

@media only screen and (min-width: 480px ) and (max-width : 740px) { 
#layout { display:flex;
          flex-wrap: wrap;
		  -webkit-justify-content: space-between; /* Safari */
          justify-content: space-between;}
	#layout >div{ 
display:flex;
          flex-wrap: wrap;
		  -webkit-justify-content: space-between; /* Safari */
          justify-content: space-between;} 
		  #leftnavi             {width: 33%; width-max: 210px;}
		 #content  {float:right;  margin: 0; width: 65%; }
		 #rightnavi  {-webkit-flex-basis: auto  /* Safari */
 flex-basis: auto;}
 .content-div              {padding:10px;}
 .calendarnumberPDF img{
margin-left:1px; 
margin-right:1px; 
max-width:75px; 
width:100%}
.skrit{display:none;}
.calendarBig        {vertical-align: middle;
text-align: center; font-size:14px}
a.calendarLink:link,
a.calendarLink:visited {vertical-align: middle;
text-align: center; font-size:14px}
.calendarTodayBig   {vertical-align: middle;
text-align: center; font-size:16px}
.calendarBlanc {vertical-align: middle;
text-align: center}
}

@media only screen and (max-width : 480px) {  
#layout { display:flex;
          flex-flow: column;}
	#layout >div{ 
display:flex;
          flex-flow: column;} 
#content              { margin: 0; order:1; width: 100%;}
#leftnavi             {order:2; margin: auto; width: 95%;}
#rightnavi            {order:3; margin: auto; width: 95%;}
html body             {margin:0px;}
.mainbody             {width: 100%;}
.content-div              {padding:1px;}
.calendarnumberPDF img{
margin-left:1px; 
margin-right:1px; 
max-width:50px; 
width:100%}
.nodisplay {display:none;}
.skrit{display:none;}
.skrit-min{display:none;}
.calendarBig        {vertical-align: middle;
text-align: center; font-size:14px}
a.calendarLink:link,
a.calendarLink:visited {vertical-align: middle;
text-align: center; font-size:14px}
.calendarTodayBig   {vertical-align: middle;
text-align: center; font-size:16px}
.calendarBlanc {vertical-align: middle;
text-align: center}
.img img {
	width:100%;}
.img-r img {
	width:100%;}
.floatcontent div a img {float: none;}
.banner-right  {border: 0px solid #cccccc;}
.banner  {width:100%}
}