/* Globale Vorgaben für HTML-Tags----------------------------------------------------------------------*/

html,body
{
	height: 100%;
	margin:0px;
	padding:0px;
	font-family: arial, helvetica, sans;
	font-size: 12px;
	color: black;
	//overflow: hidden;
}

ul
{
	padding-bottom: 0px;
	margin-bottom: 0px;
}

p
{
	width: 100%;
}

img
{
	border: none;
}


a
{
	text-decoration: none;
	color: rgb(48, 111, 199);
}

a.button
{
	border: none;
	background-image: url('../img/button.gif');
	color: rgb(255, 255, 255);
	cursor: pointer;
	width: 85px;
	height: 18px;
	line-height: 18px;
	text-align: center;
	vertical-align: middle;
	display: block;
	font-weight: normal;
	font-size: 11px;
}


table
{
	width: 100%;
	border-spacing: 0px;
	font-size: 12px;
	empty-cells: show;
}

td
{
	padding: 2px 6px;
	vertical-align: top;
	font-size: 12px;
	line-height: 18px;
}

td.middle
{
	vertical-align: middle;
}



form
{
	margin: 0px;
	padding: 0px;
	font-size: 12px;
}

form label
{
	clear: both;
	float: left;
	display: inline;
	width: 140px;
	font-size: 12px;
	padding-top: 2px;
}

form input[type="password"],
form input[type="text"]
{
	border: solid 1px rgb(47, 111, 199);
	margin-bottom: 3px;
	width: 85px;
	padding: 0px 1px;
}

form input[type="checkbox"]
{
	border: none;
	margin-bottom: 3px;
	width: auto;
}

form select
{
	border: solid 1px rgb(47, 111, 199);
	font-size: 11px;
	margin-bottom: 3px;
}

.box_header form select {
	font-size: 12px;
	padding: 1px;
}

form textarea
{
	border: solid 1px rgb(47, 111, 199);
	font-size: 12px;
	font-family: arial, helvetica, sans;
	padding: 1px;
	margin-bottom: 3px;
}

form input.button
{
	border: none;
	background-image: url('../img/button.gif');
	color: rgb(255, 255, 255);
	cursor: pointer;
	width: 85px;
	margin-top: 10px;
	height: 18px;
	line-height: 18px;
	vertical-align: middle;
	padding-bottom: 3px !important;
}



/* Clear Helper ---------------------------------------------------------------------------------------*/

div.clear
{
	clear: both;
	height: 0px;
	font-size: 0px;
	line-height: 0px;
}



/* Globales Layout ------------------------------------------------------------------------------------*/

#main_container
{
	position: relative;
	width: 873px;
	height: 100%;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}


#left_column
{
	position: absolute;
	left: 0px;
	width: 700px;
	height: 100%;
	background-image: url('../img/background.jpg');
	background-position: 5px bottom;
	background-repeat: no-repeat;
}

#right_column
{
	position: absolute;
	width: 168px;
	right: 0px;
	height: 100%;
}

#header
{
	position:absolute;
	top:0px; left:0px; right:0px;
	height: 60px;
	background-image: url('../img/header.jpg');
	text-align:center;
	padding:0px;
	width:100%;
	z-index: 100;
}

#footer
{
	position:absolute;
	bottom:0px;
	left:0px;
	right:0px;
	height: 17px;
	background-image: url('../img/footer.jpg');
	padding:0px;
	width: 100%;
	z-index: 100;
}

#content_container
{
	position:absolute;
	left: 4px;
	width: 690px;
	text-align: left;
}

html>body #content_container
{
	top: 60px;
	bottom: 17px;
}

* html #content_container
{
	border-top: solid 60px white;
	border-bottom: solid 17px white;
	height: 100%;
	top: 0px;
}

#main_content
{
	height: 100%;
	z-index: 1000;
	width: 690px;
}

#scroll_wrapper
{
	overflow: auto;
	height: 100%;
	padding: 0px 10px 0px 14px;
}

#content_wrapper
{
	z-index: 100;
	line-height: 18px;
	width: 650px;
}


.pageItem
{
	clear: both;
	margin-bottom: 20px;
}

.mceContentBody p,
.clubContent p {
	margin-bottom: 0px;
	margin-top: 0px;
}

.news p {
	margin-bottom: 0px;
	margin-top: 10px;
}



/* Rahmen für rechte Spalte ---------------------------------------------------------------------------*/

.rightbox
{
	width: 163px;
	margin-top: 9px;
}

.rightbox .top
{
	background: url('../img/rightbox_top.jpg');
	margin: 0px;
	padding: 0px;
	font-size: 2px;
	height: 7px;
}

.rightbox .content
{
	border-left: solid 1px rgb(48, 111, 199);
	border-right: solid 1px rgb(48, 111, 199);
}

.rightbox .bottom
{
	background: url('../img/rightbox_bottom.jpg');
	margin: 0px;
	padding: 0px;
	font-size: 2px;
	height: 7px;
}

.rightbox .header
{
	background-image: url('../img/rightbox_header.jpg');
	height: 20px;
	line-height: 18px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
	color: rgb(242, 242, 237);
	letter-spacing: 1px;
}

.rightbox .footer
{
	background-image: url('../img/rightbox_footer.jpg');
	background-position: bottom;
	height: 15px;
	line-height: 14px;
	font-size: 10px;
	padding-left: 10px;
	padding-right: 10px;
	color: rgb(242, 242, 237);
	letter-spacing: 1px;
}


/* Menü & Untermnü ------------------------------------------------------------------------------------*/

#main_menu
{
	position: absolute;
	top: 7px;
	left: 10px;
	height: 26px;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 1px;
}

#sub_menu
{
	position: absolute;
	top: 34px;
	left: 10px;
	height: 26px;
	line-height: 26px;
	vertical-align: middle;
	color: rgb(128, 128, 128);
	font-size: 12px;
	width: 660px;
	text-align: left;
}


.menu_selected
{
	background-image: url('../img/menu_selected.jpg');
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 26px;
	text-align: center;
	line-height: 26px;
	float: left;
	padding-left: 5px;
	padding-right: 5px;
}

.menu_selected a
{
	color: rgb(255, 247, 32);
}

.menu_unselected
{
	padding-left: 5px;
	padding-right: 5px;
	height: 26px;
	float: left;
	text-align: center;
	line-height: 26px;
}

.menu_unselected a
{
	color: rgb(255, 247, 32);
}

.menu_unselected a:hover
{
	color: rgb(217, 210, 21);
}

.submenu_selected
{
	color: rgb(0, 0, 0);
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	background-image: url('../img/submenu_selected.gif');
	background-repeat: no-repeat;
	background-position: center;
}

.submenu_unselected
{
	vertical-align: middle;
	color: rgb(32, 32, 32);
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 2px;
	padding-bottom: 2px;

}

a.submenu_unselected:hover
{
	color: rgb(48, 111, 199);
}


.usermenu
{
	background-image: url('../img/usermenu.jpg');
	height: 22px;
	line-height: 22px;
	vertical-align: middle;
	padding-left: 10px;
	padding-right: 10px;
}


.usermenu_selected
{
	color: rgb(100, 153, 223);
}

.usermenu_unselected
{
	color: rgb(32, 32, 32);
}



/* Tabellen - Header, alternierende Spalten -----------------------------------------------------------*/

.table_header td
{
	background: url('../img/divider2.jpg') bottom right no-repeat;
	border-bottom: solid 1px rgb(48, 111, 199);
	font-weight: bold;
	padding-top: 0px;
	overflow: hidden;
}


.table_rowodd
{
	background-color: rgb(242, 242, 237);
}

.table_roweven
{
	background: url('../img/table_roweven.jpg') bottom left no-repeat;
}

.table_selected
{
	background-color: rgb(220, 220, 210);
}



/* Box mit runden Ecken -------------------------------------------------------------------------------*/

.box_header
{
	line-height: 21px;
	vertical-align: middle;
	font-size: 12px;
	font-weight: bold;
	color: rgb(242, 242, 237);
	background: url('../img/box_header.gif') top left;
	display: block;
	padding-top: 1px;
	padding-left: 8px;
	padding-right: 8px;
	overflow: hidden;
	margin-bottom: 0px;
	border-bottom: solid 1px rgb(47, 111, 199);
	width: 634px !important;
	width: 650px;
}

.box_body
{
	margin: 0px;
	background-color: rgb(255, 255, 255);
	border-left: solid 1px rgb(47, 111, 199);
	border-right: solid 1px rgb(47, 111, 199);
	padding: 12px 7px 7px 7px;
	background: white;
	background-repeat: repeat-x;
	width: 634px !important;
	width: 650px;
}

.box_body_nopadding
{
	margin: 0px;
	background-color: rgb(255, 255, 255);
	border-left: solid 1px rgb(47, 111, 199);
	border-right: solid 1px rgb(47, 111, 199);
	padding: 0px;
	background-repeat: repeat-x;
	width: 648px !important;
	width: 650px;
	overflow: auto;
}

.box_bottom
{
	height: 4px;
	font-size: 4px;
	background: url('../img/box_bottom.gif') top left;
	display: block;
	overflow: hidden;
	margin: 0px 0px 20px 0px;
	width: 650px;
}

.box_top
{
	height: 4px;
	font-size: 4px;
	background: url('../img/box_top.gif') top left;
	display: block;
	overflow: hidden;
	margin: 0px;
	width: 650px;
}



/* Textformatierungen (auch für Nutzer im CMS) --------------------------------------------------------*/

.textBlue
{
	color: rgb(48, 111, 199);
}

.textRed
{
	color: rgb(255, 30, 0);
}

.textBlack
{
	color: rgb(0, 0, 0);
}

.textSizeNormal
{
	font-size: 12px;
}

.textSizeSmall
{
	font-size: 9px;
}

.textSizeBig
{
	font-size: 13px;
}

.textSizeBigger
{
	font-size: 14px;
}

.textHeader
{
	line-height: 20px;
	padding-top: 1px;
	vertical-align: middle;
	font-size: 12px;
	font-weight: bold;
	color: rgb(48, 111, 199);
	border-bottom: solid 1px rgb(48, 111, 199);
	display: block;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-left: 5px;
	padding-right: 5px;
	overflow: hidden;
}



/* Login-Maske ----------------------------------------------------------------------------------------*/

form.loginForm
{
	padding: 8px 0px 0px 0px;
	margin: 0px 5px 0px 8px;
}

form.loginForm label
{
	clear: both;
	float: left;
	display: block;
	width: 57px;
	padding-top: 2px;
}

form.loginForm input
{
	border: solid 1px rgb(48, 111, 199);
	margin-bottom: 3px;
	width: 85px;
}

form.loginForm input.button
{
	border: none;
	background-image: url('../img/button.gif');
	color: rgb(255, 247, 32);
	margin-left: 57px !important;
	margin-left: 60px;
	width: 85px;
}



/* Seiten für Jugendclubs -----------------------------------------------------------------------------*/

.clubHeader
{
	background: url('../img/box_header_left.gif') top left no-repeat;
	margin: 0px;
	padding: 0px;
	font-size: 2px;
}

.clubHeader div
{
	background: url('../img/box_header.gif') top right;
	height: 20px;
	margin-left: 10px;
	padding-left: 0px;
	padding-top: 2px;
	padding-right: 10px;
	font-size: 12px;
	font-weight: bold;
	color: rgb(255, 255, 255);
	letter-spacing: 1px;
}

.clubMenu
{
	background: url('../img/divider_down.jpg') bottom left;
	border-left: solid 1px rgb(200, 200, 200);
	border-right: solid 1px rgb(200, 200, 200);
	border-bottom: solid 1px rgb(200, 200, 200);
	line-height: 22px;
	vertical-align: middle;
	padding-left: 4px;
	padding-right: 4px;
	margin-bottom: 10px;
	color: rgb(128, 128, 128);
}

.clubMenu span {
	margin-left: 2px;
	margin-right: 2px;
	line-height: 22px;
	padding-bottom: 2px;
}


.clubMenu span.selected {
	line-height: 22px;
	background-image: url('../img/pagemenu_selected.gif');
	background-repeat: no-repeat;
	background-position: center bottom;
}

.clubMenu a
{
	color: rgb(32, 32, 32);
	margin-left: 3px;
	margin-right: 3px;
}

.clubMenu a.notvisible
{
	color: rgb(255, 64, 64);
	margin-left: 5px;
	margin-right: 5px;
}

.clubMenu a:hover
{
	color: rgb(48, 111, 199);
}

.clubContent
{
	text-align: justify;
	padding-right: 2px;
	margin-bottom: 15px;
}

.clubImages
{
	width: 200px;
	float: right;
	text-align: right;
}

.clubImages img
{
	margin-bottom: 10px;
}

.clubPageImage
{
	margin-right: 210px;
}



/* Newsticker & Liste der aktuellen Meldungen ---------------------------------------------------------*/

.news {
	margin-bottom: 25px;
}


.news .notvisible
{
	color: rgb(255, 64, 64);
}

#newsticker{
	width: 100%;
	color: rgb(80, 80, 80);
}

#newsticker.tickerAttached{
	display:block;
	margin:0;
	padding: 0;
	height:24px;
	line-height: 24px;
	vertical-align: middle;
	width: 650px !important;
	overflow:hidden;
	background: url('../img/newsticker.jpg');
}
#newsticker.tickerAttached ul{
	margin: 0;
	padding: 0;
}
#newsticker.tickerAttached ul li{
	list-style-type:none;
	float:left;
	margin-right: 25px;
}

.newsTickerDate
{
	color: black;
	font-size: 10px;
	float: right;
}



/* Gästebuch ------------------------------------------------------------------------------------------*/

.guestbookHeader
{
	background: url('../img/divider2.jpg');
	border-bottom: solid 1px black;
	padding: 4px;
}

.guestbookBody
{
	border: solid 1px rgb(240, 240, 240);
	padding: 4px;
	margin-bottom: 30px;
}

.gbcountry
{
	display: none;
}



/* Ansicht Nutzerprofil -------------------------------------------------------------------------------*/

#profilePicture
{
	float: right;
	padding-left: 10px;
	padding-bottom: 10px;
}

.profileLabel
{
	color: rgb(160, 160, 160);
	display: block;
	width: 100px;
	float: left;
}

.profileText
{
	margin-left: 100px;
	margin-bottom: 10px;
}



/* Kommentare bei Ansicht Nutzerprofil ----------------------------------------------------------------*/

.commentHeader
{
	background: url('../img/divider2.jpg') bottom right no-repeat;
	font-size: 9px;
	margin: 0px;
	padding-left: 4px;
	padding-right: 4px;
}

.commentBody
{
	border: solid 1px rgb(240, 240, 240);
	padding: 4px;
	margin-bottom: 20px;
}

.commentDate
{
	color: black;
	font-size: 10px;
	float: right;
}



/* Fotos beim Nutzerprofil & Fotos ändern -------------------------------------------------------------*/

.pictureTable
{
	width: auto;
}

.pictureTable td
{
	width: 90px;
	text-align: center;
	vertical-align: bottom;
	padding-bottom: 20px;
}

.pictureTable a.button
{
	margin-top: 10px;
	margin-left: auto;
	margin-right: auto;
}

.pictureTable td.pictureUpdate
{
	vertical-align: top;
	width: auto;
	text-align: left;
	padding-left: 30px;
}



/* Nutzerprofil bearbeiten ----------------------------------------------------------------------------*/

.userError
{
	color: red;
	margin-top: 0px;
	margin-bottom: 10px;
	padding: 0px;
}

.userError li
{
	list-style-type:none;
}



/* Nachrichtensystem ----------------------------------------------------------------------------------*/

.mailContentHeader
{
	background: url('../img/divider2.jpg');
	padding: 2px 8px 0px 8px;
	height: 20px;
	width: 616px !important;
	width: 632px;
	line-height: 20px;
	vertical-align: middle;
}



/* Buddyliste, Aktionen Buddyliste---------------------------------------------------------------------*/

.buddyNotice
{
	color: rgb(60, 60, 255);
	font-weight: bold;
	margin-bottom: 20px;
	background: url('../img/divider2.jpg');
	padding: 4px;
}



/* Passwort ändern ------------------------------------------------------------------------------------*/


.passwordForm
{
	margin-top: 20px;
}

.passwordError
{
	color: red;
	font-weight: bold;
	margin-bottom: 20px;
}

.passwordForm .button
{
	margin-top: 10px;
	margin-left: 140px;
}



/* Formular Bild hochladen (Nutzer & Seiten Jugendclubs) ----------------------------------------------*/

.pictureForm label
{
	display: inline;
	width: 90px;
	margin-right: 10px;
}

.pictureForm input.button
{
	margin-left: 100px;
	margin-right: 0px;
}

.pictureNew
{
	border-top: solid 1px rgb(255, 223, 190);
	padding-top: 10px;
}

.pictureExplain
{
	margin-left: 100px;
	font-size: 9px;
}

.pictureError
{
	color: red;
	font-weight: bold;
	margin-left: 100px;
}



/* Buttons zur Administration (Nutzer, Seiten) --------------------------------------------------------*/

.editButtons
{
	margin-top: 10px;
}

.editButtons img
{
	margin-bottom: 0px;
}

.editButtons a
{
	margin-right: 2px;
	margin-bottom: 0px;
}

.buttonImageDelete
{
	margin-top: -30px;
	margin-left: -20px;
}

/*-----------------------------------------------------------------------------------------------------*/

.videoHeader
{
	line-height: 20px;
	padding-top: 1px;
	vertical-align: middle;
	font-size: 12px;
	color: black;
	border-bottom: solid 1px rgb(48, 111, 199);
	display: block;
	margin-top: 10px;
	margin-bottom: 20px;
	padding-left: 5px;
	padding-right: 5px;
	overflow: hidden;
}

.video {
	text-align: center;
	margin-top: 30px;
}

.yt_video {
	margin-top: 10px;
	width: 185px;
	height: 170px;
	text-align: center;
	float: left;
	font-size: 11px;
	margin-right: 30px;
}

.yt_video img {
	margin-bottom: 5px;
}

.videodescription {
	margin-top: 20px;
	width: 420px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}


.navigationPrev {
	float: left;
}

.navigationNext {
	float: right;
}


.random {
	padding: 8px 0px 0px 0px;
	margin: 0px 5px 0px 8px;
}


.chatActive {
	background-color: #f2f2ed;
	padding: 8px 8px 8px 8px;
}

.chatMessage {
	background-color: #f2f2ed;
	padding: 8px 8px 8px 8px;
}


.adminMode {
	text-align: right;
	padding-right: 4px;
}

.adminMode a {
	color: rgb(255, 255, 128);
	font-weight: bold;
}

#pageModified {
	background-color: rgb(255, 220, 220);
	color: red; 
	font-weight: bold; 
	margin-bottom: 5px;
	padding: 3px;
}