/* Basic reset */
* { margin: 0; padding: 0; }
img, a img, fieldset { border: none; }
html { overflow-y: scroll;}

/* Fluides Raster (10.09.2026): border-box ist die Voraussetzung dafuer, dass
   Prozentbreiten und Innenabstaende sich nicht addieren. Ohne das muesste jede
   Spaltenbreite um ihr Padding korrigiert werden. */
*, *::before, *::after { box-sizing: border-box; }

/* Medien duerfen nie breiter werden als ihr Container. */
img, video, iframe, object, embed { max-width: 100%; }
img, video { height: auto; }


/* Clearfix hack. Gotta love it. */
.clearfix:after
{
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both; 
    height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

body
{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 15px;
  color: #000;
  background: url('../Images/bg/bg.jpg') repeat;
}

p 
{
  line-height: 160%;
  padding-bottom: 10px;
}
p.csc-linkToTop {text-align: right;}

a
{
  color: #004077;
  text-decoration: none;
  outline: none;
}
a:hover
{
  text-decoration: underline;
}

.clear {clear: both;}

.alert {color: #880000 !important;}

.blue { color: #004077; }

ul
{
  margin: 0 0 15px 15px;
  padding: 0;
  line-height: 160%;
}
ol
{
  margin: 0 0 15px 20px;
  padding: 0;
  line-height: 160%;
}

#page 
{
  width: 100%;
  max-width: 1000px;
  background: none;
  margin: 0 auto;
}

/****************************************************************
   HEADER SETTINGS
****************************************************************/
#header 
{
	min-height: 285px;
	padding: 0 20px;
	position: relative;
}

#logo 
{
	width: 209px;
	height: 214px;
	float: left;
	margin: 35px 0 0;
}

/* page subtitle */
#title 
{
	position: absolute;
	bottom: 70px;
	right: 20px;
}

/****************************************************************
   KEYVISUAL SETTINGS
****************************************************************/
#keyvisual
{
	width: auto;
	height: auto;
	padding: 0 20px 0;
}
#keyvisual img { display: block; width: 100%; height: auto; }

/****************************************************************
   CONTENT SETTINGS
****************************************************************/
#wrap
{
	background: url('../Images/bg/wrap-bg.png') repeat-y;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;
	-webkit-border-top-left-radius: 20px;
	-webkit-border-top-right-radius: 20px;
	border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  
  padding-top: 20px;
}

#form-content
{
	width: auto;
	margin: 0 20px 0;
	padding-bottom: 35px;
	
	border-top-left-radius: 20px;
  	border-top-right-radius: 20px;
}
#form-register-content {
	width: auto;
	background: url('../Images/bg/content-bg.png') repeat-y;
	margin: 0 20px 0;
	padding-bottom: 35px;
	
	border-top-left-radius: 20px;
  	border-top-right-radius: 20px;
}
#content
{
	width: auto;
	background: url('../Images/bg/content-bg.png') repeat-y;
	margin: 0 20px 0;
	padding-bottom: 35px;
}

/* Zweispalter: Flexbox statt Floats. Die Klasse steht in den beiden
   content-two-columns-*.html; der Einspalter bleibt ein normaler Block. */
#content.cols
{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
}
#content.no-key
{
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;
	-webkit-border-top-left-radius: 20px;
	-webkit-border-top-right-radius: 20px;
	border-top-left-radius: 20px;
 	border-top-right-radius: 20px;
}

#content #full-width-w960,
#content #column-main-w680,
#content #column-right-w220,
#content #column-main-w460,
#content #column-right-w440
{
	padding-top: 45px;
}
#content #full-width-w960,
#form-register-content #full-width-w960
{
	padding-left: 20px;
	padding-right: 20px;
}
#content #column-main-w680,
#content #column-main-w460
{
	padding-left: 20px;
}
#content #column-right-w220,
#content #column-right-w440 
{
	padding-right: 20px;
}
/* Prozentwerte bezogen auf die 960 px des Rasters, Innenabstaende inklusive
   (border-box): 720/960 = 75 %, 240/960 = 25 %, 500/960 = 52,0833 %,
   460/960 = 47,9167 %. Am Desktop ergibt das exakt die alten Pixelbreiten. */
#content #column-main-w680
{
	width: 75%;
	padding-right: 20px;
}
#content #column-right-w220
{
	width: 25%;
}

#content #column-main-w460
{
	width: 52.0833%;
	padding-right: 20px;
}
#content #column-right-w440
{
	width: 47.9167%;
}

/****************************************************************
   MENU SETTINGS
****************************************************************/
/* main-menu */
#main-menu
{
  font-size: 12px;
  position: absolute;
  right: 20px;
  bottom: 0;
}
#main-menu ul
{
  list-style: none;
  margin: 0;
  display: flex;
  gap: 2px;
}
#main-menu ul li
{
  width: 230px;
  line-height: 160%;
  text-align: center;
  background: url("../Images/bg/sprite.png") no-repeat 0 -85px !important;
}

#main-menu ul li a
{
	font-size: 18px;
  	color: #004077;
  	display: block;
  	text-decoration: none;
  	padding: 8px 0;
}
#main-menu ul li a:hover
{
  /*color: #fff;*/
  text-decoration: none;
}

#main-menu ul li a:hover 
{
	background: url("../Images/bg/sprite.png") no-repeat 0 -85px !important;
}
#main-menu ul li a.selected,
#main-menu ul li a.active
{
	background: url("../Images/bg/sprite.png") no-repeat 0 -85px !important;
}

/* top menu */
#top-menu
{
	color: #fff;
	float: right;
	margin: 35px 0 0;
}
#top-menu ul {list-style: none; display: flex; flex-wrap: wrap; justify-content: flex-end;}
#top-menu ul li
{
  line-height: 1;
	margin-left: 10px;
}
#top-menu ul li + li
{
  border-left: 1px solid;
  margin-left: 10px;
  padding-left: 10px;
}
#top-menu ul li a {color: #fff;}
#top-menu ul li a:hover {text-decoration: underline;}

/****************************************************************
   FOOTER SETTINGS
****************************************************************/
#footer
{
  font-size: 12px;
  color: #fff;
  min-height: 45px;
  border-top: 1px solid #fff;
}
#footer a {color: #fff;}
#footer a:hover {text-decoration: underline;}
#footer p {padding: 0;}

#footer-left {float: left;}
#footer-right {float: right;}

#footer-left,
#footer-right {margin: 5px 20px 0;}

/****************************************************************
   H1-H6
****************************************************************/
h1 
{
  font-size: 25px;
  font-weight: normal;
  color: #004077;
  margin-bottom: 10px;
}
#title h1 
{
	font-size: 33px;
	color: #f99000;
	margin: 0;
}
h2 
{
  font-size: 20px;
  font-weight: normal;
  color: #004077;
  margin-bottom: 10px;
}
h3 
{
  font-size: 18px;
  font-weight: normal;
  color: #004077;
  margin-bottom: 10px;
}
h4 
{
  background-color: #EBF1F7;
  color: #004077;
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 10px;
  padding: 6px 0 6px 5px;
}
h5 
{
  font-size: 16px;
  font-weight: normal;
  color: #004077;
  margin-bottom: 10px;
}
h5 a, h5 a:hover {color: #fff;}
h6 
{
  font-size: 14px;
  font-weight: bold;
  color: #004077;
  margin-bottom: 10px;
}

/****************************************************************
   LINK SETTINGS
****************************************************************/
.internal-link
{
  background-image: url("../Images/icons/blue/link_intern.gif"); 
  background-repeat: no-repeat;
  background-position: 2px 2px;
  display: inline; 
  padding-left: 16px;
}
#footer .internal-link {background-image: url("../Images/icons/white/link_intern.gif");}
/* Link 'Alle Veranstalungen anzeigen' in tx_bdeventregistrationmgr_pi1 */
#tx_bdeventregistrationmgr_pi1_filterform .show-all a {background-image: url("../Images/icons/black/link_intern.gif");}
.external-link
{
  background-image: url("../Images/icons/blue/link_intern.gif"); 
  background-repeat: no-repeat;
  background-position: 3px 2px;
  display: inline; 
  padding-left: 15px;
}
.internal-link-new-window
{
  background-image: url("../Images/icons/blue/link_extern.gif"); 
  background-repeat: no-repeat;
  background-position: 2px 2px;
  display: inline; 
  padding-left: 15px;
}
.external-link-new-window
{
  background-image: url("../Images/icons/blue/link_extern.gif");
  background-repeat: no-repeat;
  background-position: 1px 2px;
  display: inline;
  padding-left: 15px;
}
#footer .external-link-new-window {background-image: url("../Images/icons/white/link_extern.gif");}
.mail
{
  background-image: url("../Images/icons/blue/link_email.gif"); 
  background-repeat: no-repeat;
  background-position: 2px 3px;
  display: inline;
  padding-left: 18px;
  text-decoration: none;
}
.download,
.filelinks_link
{
  background-image: url("../Images/icons/blue/link_download.gif");
  background-repeat: no-repeat;
  background-position: 3px 1px;
  display: inline; 
  padding-left: 18px;
}
.link-up
{
	background-image: url("../Images/icons/blue/link_up.gif");
  background-repeat: no-repeat;
  background-position: 3px 2px;
  display: inline; 
  padding-left: 15px;
}
#footer .link-up {background-image: url("../Images/icons/white/link_up.gif");}
.print
{
  background-image: url("../Images/icons/blue/link_print.gif"); 
  background-repeat: no-repeat;
  background-position: left top;
  display: inline; 
  padding-left: 20px;
}

/****************************************************************
   EXTENDED CONTENT SETTINGS
****************************************************************/
blockquote 
{  
  color: #fff;
  background: #f99000;
  font-style: italic;
  margin-bottom: 10px !important;
  padding: 4px 10px 4px 10px;
}
blockquote p 
{
  margin: 0;
  padding: 0 !important;
}
.liniedavor,
.frame-custom-100
{
  border-top: 1px solid #004077;
  padding-top: 5px;
}
.liniedanach,
.frame-custom-110
{
  border-bottom: 1px solid #004077;
  margin-bottom: 5px;
}
.rahmen,
.frame-custom-115
{
  border: 1px solid #004077;
  margin-bottom: 10px;
}
.rahmen p, .frame-custom-115 p {padding: 5px 10px 5px;}
.gefuellt,
.frame-custom-120
{
  color: #fff;
  background: #f99000;
  padding: 10px 10px 0 10px !important;
  margin-bottom: 10px;
}
.gefuellt p, .frame-custom-120 p {padding: 0 0 10px 0;}

/* Prepend images wrapped in ul from beeing transferred */
.ce-row ul {padding: 0 !important; margin-bottom: 0 !important;}


/****************************************************************
   FORMULARFELDER (10.09.2026)
****************************************************************/
/* iOS Safari zoomt beim Antippen automatisch hinein, wenn ein Feld kleiner
   als 16 px gesetzt ist -- und verschiebt dabei das ganze Layout. Deshalb
   gilt der Wert auf allen Geraeten, nicht nur unter dem Breakpoint. */
input, select, textarea, button { font-size: 16px; font-family: inherit; }
