










* {
	margin: 0;
	padding: 0;
	} 


body {
	/*width:320px;*/
	font-size:80%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	/*background-image:url(graphics/karo.png);*/
	/*background-repeat:repeat;*/
	}

	
#all {
	width:98%;
	margin-left:auto;
	margin-right:auto;
	margin-top:0px;
	/*border:1px dotted red;*/
	}	

a .top {
	display:none;
	}
	
#header {
	}
	
#header h1 a,
#header h1 a:link,
#header h1 a:visited,
#header h1 a:active,
#header h1 a:hover,
#header h1 a:visited:hover {
	/*background-image: url(graphics/random/<?php echo $new[$zufall]; ?>);*/
	background-image: url(graphics/logo_bricks_mobile.png);
	background-repeat: no-repeat;
	display:block;
	height:25px;
	font-size:16pt;
	/*color:green;*/
	text-decoration: none;
	font-weight:normal;
	text-align:right;
	padding:36px 0px 0px 0px; /* erster Wert fuer Position des opacity-balkens vor dem Hintergrund */
	margin-top:0px;
	width:100%;
	}	

.opacity {
	display:block;
	padding-right:24px;
	background:white;
	color:black;
	zoom: 1;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; /* IE 8 first!*/
	filter: alpha(opacity=75);					/* IE other second! */
	-moz-opacity:0.75; /* Für Gecko-Browser */
	opacity:0.75; /* Für Konqueror, Opera 9+, Safari */
	}


/* container fuer sprachumschaltung */
#language-switch {
	/*position: absolute; top:144px;*/
	margin: 8px 0px 6px 0px; /*rand von oben*/
	border-top: 0px solid;
	border-left: 0px solid;
	border-bottom: 0px solid;
	border-right: 0px solid;
	border-color: #586876;
	padding-left: 10px;
	padding-right: 10px;
	text-align:right;
	}

#language-switch img,
.bookmark img {
	border:0px;
	}
	
/* navigation bereich*/	
#navigation {
	/*position: absolute; top:116px; /*left: 12px; top: 124px; 124*/
	/*z-index:2;
	/*border-top: 1px solid;
	border-left: 1px solid;
	border-bottom: 1px solid;
	border-right: 1px solid;
	border-color: #586876;*/
	/*margin-left:0px;
	/*width:220px;
	/*background-repeat: no-repeat;*/
	display:none;
	}
	
.gadget .bookmark {
	font-size:90%;
	padding:4px;
	border: 1px solid #94A9C4;
	margin-top:8px;
	line-height:125%;
	background-color:white;
	}



/* content bereich*/
#content {
	margin: 0px 0px 0px 0px; /*linker rand fuer navigations menu*/ 
	border-top: 0px solid;
	border-left: 0px solid;
	border-bottom: 0px solid;
	border-right: 0px solid;
	border-color: #586876;
	padding-top: 0px;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom:6px;
	line-height: 125%;
	z-index:1;
	background-color: #EBEBEB; /*230-230-230 = E6E6E6 | 235-235-235 EBEBEB*/
	float:none;
	width:auto;
	}

#content .img-left {
	float:left;
	margin-left:10px;
	margin-bottom:0px;
	/*display: block; ++ img zentrieren ++
    margin-left: auto;
    margin-right: auto;
	border: 2px solid red;*/
	}		
	
#content .img-right {
	float:right;
	margin-left:10px;
	margin-bottom:0px;
	}	

#content .topic {
	margin-top:2px;
	margin-bottom:2px;
	padding-top:5px;
	padding-bottom:5px;
	clear:both;
	border-top: 0px solid;
	border-left: 0px solid;
	border-bottom: 0px solid;
	border-right: 0px solid;
	border-color: red;
	display:block;
	}		

#content .topic:after {
	display:block;
	content:"";
	clear:both;
	line-height:1px;
	padding:0;
	margin:0;
	font-size:0pt;
	}	/* erweitert den div wenn bild hoeher ist als der text neben dem bild */

#content .topic:hover {
	background-color:#F5F5F5;
	}

#content h2 {
	color:white;
	background-color:black;
	padding: 6px 6px 8px 6px;
	margin-top:0px;
	margin-bottom:4px;
	margin-left:-6px;
	margin-right:-6px;
	font-weight:normal;
	}	
	
#content h3 {
	margin-top:0px;
	margin-bottom:6px;
	font-weight:bold;
	}	

#content p, li {
	/*color:green;*/
	padding: 3px 6px 3px 0px;
	}		
	
#content ul {
	padding-left:20px;
	list-style-type:square;
	overflow:hidden;
	}	
	
#content ol {
	padding-left:20px;
	list-style-type:square;
	overflow:hidden;
	list-style-image: url(graphics/icon_forward.png);
}	

#content img,
#content object {
	/*display: block; */
	/*margin:0px auto 2px auto;*/
	/*max-width:310px; mobile*/
	/*border: 1px solid gray;*/
	/*border: 2px solid red;*/
	}


.hint {
	background-image:url(graphics/icon_danger.png);
	background-repeat: no-repeat;
	border-top:2px solid #CC0000;
	border-bottom:2px solid #CC0000;
	padding: 6px 6px 2px 70px;
	margin:6px 0px 6px 0px;
	}	

.hint p {
	/*padding-top:0px;*/
	/*margin-top:0px;*/
	}

#content .bold {
	font-weight:bold;
	}

#content .center{
	text-align:center;
	/*line-height: 100%;*/
	}

#content .clearboth {
	clear:both;
	visibility:hidden;
	}

#content p img.inline{
	text-align:left;
	margin:0px 0px 0px 0px;
	display: inline;
	bottom:-3px;
	}

#content .margin p {
	font-weight: bold;
	}	
	
/* footer bereich*/
#footer {
	margin: 10px 0px 0px 0px; /*linker rand fuer navigations menu*/ 
	border-top: 0px solid;
	border-left: 0px solid;
	border-bottom: 0px solid;
	border-right: 0px solid;
	border-color: #586876;
	padding-left: 0px;
	padding-right: 0px;
	line-height: 135%;
	z-index:1;
	/*background-color: #E6E6E6;*/
	text-align: right;
	font-size: 70%;
	padding-right: 10px;
	padding-bottom: 100px;
	}	

#footer .validator-links{
	/*display:none;*/
	}	

/******************* mobile-menu **************************/	

#mobile-menu  {
	/*display:none;*/
	margin: 12px 0px 0px 0px; /*linker rand fuer navigations menu*/ 
	border-top: 0px solid;
	border-left: 0px solid;
	border-bottom: 0px solid;
	border-right: 0px solid;
	border-color: #586876;
	padding-top: 0px;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 0px;
	line-height: 125%;
	z-index:1;
	background-color: #EBEBEB; /*230-230-230 = E6E6E6 | 235-235-235 EBEBEB*/
	}

#mobile-menu ul { 
	list-style-type: none;
	padding-top: 4px;
	padding-left: 12px;
	padding-right: 6px;
	padding-bottom: 4px;
	text-align:center;
	}
	
#mobile-menu li {
	display:block;
	margin:0px auto 0px auto;
	text-align:center;
	white-space:nowrap;
	}
		



/*************Tabellengestaltung***************************/

#content table {
	border-collapse: collapse;
	padding: 0px;
	border:0px solid #CC0000;
	margin-top:8px;
	margin-bottom:8px;
	}

#content table tr td {
	border:1px solid #CC0000;
	}


#content table tr td,
#content table tr th,
#content table tr td p,
#content table tr th p  {
	padding: 4px;
	}	




/************LINKS******************************/	

#content p a,
#content li a,
#content td a,
.news p a,
.highslide-caption a,
#content p a:link,
#content li a:link,
#content td a:link,
.news p a:link,
.highslide-caption a:link,
#content p a:visited,
#content li a:visited,
#content td a:visited,
.news p a:visited,
.highslide-caption a:visited,
#content p a:active,
#content li a:active,
#content td a:active,
.news p a:active,
.highslide-caption a:active
	{
	color: #CC0000; /*0000cc*/
	text-decoration: none;
	padding-left:1px;
	padding-right:1px;
	font-weight:bold;
	}

	
#content p a:hover,
#content li a:hover,
#content td a:hover,
.news p a:hover,
.highslide-caption a:hover,
#content p a:visited:hover,
#content li a:visited:hover,
#content td a:visited:hover,
.news p a:visited:hover,
.highslide-caption a:visited:hover
	{
	color: #FFFFFF;
	/*border-bottom: 1px dotted #0000cc;*/
	background-color: #CC0000; /*0000cc*/
	padding-left:1px;
	padding-right:1px;
	font-weight:bold;
	}

	
/******* Sonderbehandlung Links in mobile-menu fuer iphone *****/	
	
#mobile-menu a,
#mobile-menu a:link,
#mobile-menu a:visited,
#mobile-menu a:active
	{
	color: #CC0000; /*0000cc*/
	text-decoration: none;
	padding-left:1px;
	padding-right:1px;
	font-weight:bold;
	display:block;
	}

	
#mobile-menu a:hover,
#mobile-menu a:visited:hover

	{
	color: #FFFFFF;
	/*border-bottom: 1px dotted #0000cc;*/
	background-color: #CC0000; /*0000cc*/
	padding-left:1px;
	padding-right:1px;
	font-weight:bold;
	display:block;
	}	
	
/******* LINK in Ueberschriften ***********/
#content h2 a,
#content h3 a,
#content h2 a:link,
#content h3 a:link,
#content h2 a:visited,
#content h3 a:visited,
#content h2 a:active,
#content h3 a:active
	{
	color: black; /*0000cc*/
	text-decoration:none;
	}

	
#content h2 a:hover,
#content h3 a:hover,
#content h2 a:visited:hover,
#content h3 a:visited:hover
	{
	color: black; /*#FFFFFF;*/
	text-decoration:underline;
	}	



/******* LINK in Gadget ***********/	
.bookmark a,
.bookmark a:link,
.bookmark a:visited,
.bookmark a:active {
	text-decoration: none;
	padding:0px;
	}	
	
	
.bookmark a:hover,
.bookmark a:visited:hover {
	padding:0px;
	}
	
	
	
	
/* LINKS im Footer */	

#footer a,
#footer a:link,
#footer a:visited,
#footer a:active
	{
	color: #CC0000; /*0000cc*/
	text-decoration: none;
	padding-left:1px;
	padding-right:1px;
	}

#footer a:hover, 
#footer a:visited:hover
	{
	color: #FFFFFF;
	/*border-bottom: 1px dotted #0000cc;*/
	background-color: #CC0000; /*0000cc*/
	padding-left:1px;
	padding-right:1px;
	}
	
a[href^='#top']:before {
	content: url(graphics/top.png) " "; /*pfeil nach oben icon und leerzeichen vor toplink*/
	}	

.toplink {
	text-align:right;
	text-decoration: none;
	clear:both;
	}	

.highslide-caption a[href^='http://']:before,
#content a[href^='http']:before{
		content: url(graphics/icon_linkextern.png)" "; /* Icon fuer externe Links */
		white-space:nowrap;
		}	
		
#content sup {
	font-size: 70%;
	}			
	
.screen {color:red; display:none;}	
.tablet {color:green; display:none;}	
.mobile {color:orange; display:block;}	


.anzeige {
	display:none;
	}
	
.ad {
	display:none;
	}

/********* Video embedding **************/

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
	margin-bottom: 12px;
	}
	
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}	
		
		
/************COOKIE-Hinweis******************************/		


#holgermatthesbrickscookie {
	position: fixed; 
	text-align: left;
	font-size: 130%;
	bottom: 0; left: 0; right: 0; background: #eee; padding: 18px;}

#holgermatthesbrickscookie a.button {
	cursor: pointer; background: #ccc; padding: 8px 18px; margin-left: 10px; border-radius: 5px; font-weight: bold; float: right;}

#holgermatthesbrickscookie a.button:hover {
	background-color: #aaa;}

#holgermatthesbrickscookie p.cookietext {
	/*display: block; padding: 0; margin: 0;*/}				