html, body  {	
	XXfont-size: 12px;
	margin:0;
	padding:0;
	min-height:101%;
}

body  {
		
	background: #b3b3b3 url(img/bodybg.jpg) no-repeat fixed bottom right;
	background-size: 100% 100%, auto;			
}


/* Raster:
990 = 10 + 200 + 770 + 10
770 = 20 + 750: leer + mainbox
750 = 530 + 220: contentbox + sidebarbox

	
/*----- boxes -------------------------*/

.wrapper {
	background: #fff;
	width:96%;
	max-width:1400px;
	min-height:100%;
	margin:0 auto 0 auto;
	box-shadow: 20px 0px 80px 0 rgba(0, 0, 0, 0.2);
}



#leftbox {
	float:left;
	clear:left;
	margin: 0 0 0 0;	
	width:20%;
	XXdisplay:inline;		
}




.mainbox {
	float:right;
	XXdisplay:inline;
	width:78%;
	margin: 0 0 0 0;
	background-image: url(img/kachel.jpg);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: right bottom;
	
}

.contentbox {
	margin:0 0 0 0px;
	width:66%;
	padding-right:0%;
	float:left;	
	XXdisplay:inline;
	XXborder-right:1px solid #ddd;
	XXbackground: url(img/rightborder.png) no-repeat  right top;	
}

.sidebarbox {
	margin-top:0px;
	width:30%;
	float:right;	
	XXdisplay:inline;
	background-color: transparent;
}

.sidebarbox p {padding-right:10px;}
.sidebarbox img {margin-left:0; }

.XXsidebarbox .sidebarteaser {border-left: 2px dotted #c00; font-weight:bold;}

.footerbox {clear:both; border-top: 1px solid #999;}
.footerbox span, .footerbox a   {display:block; float:left; width: 180px; padding: 5px 0;}
.footerbox span {clear:left;}




blockquote {
	float:right;
	margin-top: 0;
	margin-right: -51.5%;
	width:48%;
	position:relative;
	clear:left;
	background-color: transparent;
	XXborder-left: 2px solid #3a5577;
	XXmargin: 3px 0 20px 0;
	color:#555;
	
}

blockquote p {padding-right:5px; line-height:140%; font-size:0.9em;}
blockquote p.gc_comm_com {font-size:1em;}

/*
.webdesign-referenzen {width:103%;}
.webdesign-referenzen-block {width:30%; float:left; margin:0 3% 0 0;}
.webdesign-referenzen blockquote {width:100%; height:133px; overflow:hidden; margin: 0 0 0 0; padding: 0 0 0 0; background:#eee; transition:0.5s height;}
.webdesign-referenzen blockquote:hover {height:190px; transition:0.5s height;}
.webdesign-referenzen blockquote img {max-width:100%;}
*/

.contentboxwide {
	margin:0 0 0 0px;
	width:100%;
	float:left;	
	display:inline;
	XXbackground-color: #ddffff;
	
}
.contentboxwide p{
	XXmargin:0;
	font-size: 11px;
	line-height:130%;	
}

.home1 {width: 47%; float: left;}
.home2 {width: 47%; float: right; XXmargin-left: 6%;}
.home3 {width: 90%; float: left;}

	
.headerbox {
	height:280px;
	width:100%;	
	XXbackground: transparent url(img/topright.jpg) no-repeat;	
	margin:0;
}

.search_box {	
	padding-left:36px; float:right; width:200px; height:30px; XXoverflow:hidden; XXdisplay:none;
	XXbackground-color:#333;
}

.menueheader { height:30px; text-align:right; margin:5px 15px 0 0; font-size:11px; }
#teaser {width:662px; height: 184px; float:right;margin:40px 10px 0 0; overflow:hidden;}


.logobox {
	XXwidth:199px;
	height:285px;
	XXborder-right: 1px solid #000;	
}

.logobox a { 
	display:block;
	float:right;
	width:200px;	
	height:105px;
	margin-top:110px;	
	background: #fff url(img/logo-media.jpg) no-repeat;
	
}


a.logolink4 { background: #fff url(img/logo-graphic.jpg) no-repeat; }
a.logolink5 { background: #fff url(img/logo-web.jpg) no-repeat; }
a.logolink3 { background: #fff url(img/logo-interactive.jpg) no-repeat; }

.mobilelogobox {display:none;}




/*-- footer  -----------*/

#footerbox {
	width:990px;
	height:118px;
	clear:both;
	color:#aaaaaa;
	background: #bcbcbc url(img/footer.jpg) no-repeat;	
}

#footerbox .inner { margin: 0 0 0 260px; font-size:11px; padding:10px;}

#footerbox a {	
	text-decoration: none;
	color:#aaaaaa;
}



/*-- Menue Left  -----------*/

#menu {
	margin: 0 0 0 0px;
	line-height: 125%;
	text-align:right;
	font-size: 13px;
	text-transform: lowercase;
	
		
}	

#menu ul {
	margin: 0 0 0 0;
	padding-left: 0;
	list-style-type: none;
	list-style-image: none;	
}


#menu li {	
	padding: 5px 0 0px 0;
	margin: 0 0 0 0;
	line-height:140%;		
} 
#menu li.lev0 {	
	padding: 15px 0 0px 0;		
} 

#menu li a {	
	padding: 2px 10px 2px 0;
	border-right: 5px solid #ddd;
	border-bottom: none;
	color:#666;		
} 

#menu li a:hover {
	border-right: 5px solid #c00;
	font-weight: bold;
			
}

#menu li.menu-current a {
	border-right: 5px solid #666;
	font-weight: bold;
	color:#c00 ! important;		
}

#menu li.menu-parent a  {	
	border-right: 5px solid #ddd;
		color:#000;		
}



#menu li.menu-expand, .lev0 {
	border-top: 1px solid #ddd;
	font-weight: bold;
	color:#666;		
}

#menu li.menu-parent a {	
		
}

#menu li.menu-expand {
	font-weight: bold;
	color:#666;		
}

#XXmenu li.menu-sibling a {border-right: 5px solid #aaa;}

#XXmenu li.pid1 { border-top: none;}

#XXmenu li.menu-first { border-top: none; padding-top: 0;}


#menu li.mtop {font-weight: bold; color:#333;}
#menu li.mtop a {border-right:none; padding: 2px 15px 2px 0;}
#menu li.mtop a:hover {color:#c00;}
#menu li span.titleonly {display:block; padding:20px 15px 0 0; margin-top:0; border-top: 1px solid #ddd; font-weight: bold; color:#333;}



/*

#menu a:link, #menu  a:visited
{
XXcolor: #000;
text-decoration: none;
}

#menu li a {
	display: block;
	padding: 3px 15px 4px 10px;
	color: #555;
	border-bottom: 1px solid #ededed;
	XXborder-right: 1px solid #ddd;
	XXbackground-color: #ededed;	
}

*/




/*
.colorclass2 #headerbox { background-image: url(img/headerbg2.gif); }
.colorclass3 #headerbox { background-image: url(img/headerbg3.gif); }
.colorclass4 #headerbox { background-image: url(img/headerbg4.gif); }
*/

#headerbox { background-image: url(img/headerbg0.gif ! important); }


/*sitemap*/
.sitemap li {	
	padding-bottom: 4px;		
} 

.sitemap ul {	
	line-height: 140%;
	margin-top: 0px;
	margin-bottom: 10px;
	margin-left: 0.6em;
	padding-left: 0.6em;
	list-style-image: none;
	list-style-type: none	
}

.sitemap a {text-decoration: none;}
.sitemap a:hover {text-decoration: underline;}

/*
.sitemap .mlev1 li {font-size:16px; line-height:28px; font-weight: bold;}
.sitemap .mlev2 li {font-size:12px; line-height:18px; font-weight: normal;}
.sitemap .mlev3 li {font-size:11px; line-height:14px; font-weight: normal;}
*/







#editthis {padding: 2px 15px; width: 170px; margin-left: 3px; font-size:10px;}	
#editthis a {display:inline; text-decoration: none; color: #000}



#searchresults h4 {margin:10px 0 0 60px; padding:0; }
#searchresults p {margin:0 0 6px 60px; padding:0 0 6px 0; border-bottom: #aaa dotted 1px; }

.searchimage {display:block; float: left; clear: both;  width:55px; height:55px; background-color:#ffffff; margin: 5px 5px 0 0; }



.weiterethemen, .partnerseiten {width:350px;}

/*-------------------------- MODULES -------------------------- */

blockquote.topics-commentbox {
	float:left;
	margin: 10px 0 10px 0;
	padding: 5px 5% 5px 5%;	
	width:70%;	
	clear:left;
	border-top: 1px solid #666;
	background-color: #eee;
	}
	
blockquote.topics-commentbox p {margin: 2px; line-height:140%; font-size:13px;}	
	

.tp_readmore {display:inline-block; XXfont-size:11px; line-height:120%; margin:-5px 0 0 0; padding: 0 0 10px 15px; background:transparent url(img/arr_link_kl.gif) no-repeat 0px 2px;}

/*Topics
.mod_topic_loop { margin: 10px 0 10px 0; }
.mod_topic_loop img { float:left;  height:50px; width:50px; border:0; float:left; margin:4px 10px 30px 0; }
.mod_topic_loop h3.mt_title, .mod_topic_loop p {margin:0; line-height:140%;}

*/






.XXmod_topic_prevnext p a {display:block; font-size:11px; line-height:120%; font-weight:normal;
}

a.linkpfeil {display:block; padding: 0 0 8px 15px; margin:0 0 5px 0; background:transparent url(img/arr_link_kl.gif) no-repeat 0px 2px; 
font-size:11px; line-height:120%; font-weight:normal;
}


/*2015 =================================================================*/
.topic_loop {margin: 0 0 0 0;}
.tp_thumb {float:left; XXwidth:70px; margin: 6px 10px 30px 0; border:1px solid #ddd;}


.sidebarbox .tp_pic {width:100%; margin-bottom: 2px;}
.sidebarbox .websidebarteaser { XXfont-weight:600; line-height: 130%; XXcolor: #666;}

a.sidebarpn {display:block; padding: 0 2% 2px 0; margin:2px 0 5px 0; color:#333; border-bottom: 1px solid #ddd; line-height: 130%; transition:0.5s all;}
a.sidebarpn:hover {padding: 5px 2px 15px 0; margin:2px 0 10px 0; }
a.sidebarpn img {width: 19%; margin: 3px 2% 4px 0; float:left;}
a.sidebarpn b {display:block; font-weight:400; color: #c00;}
a:hover.sidebarpn b { font-weight:400; color:#000; transition:0.5s all;}
.sidebarclear {display:block; height:1px; clear:both;}

.sidebarbox h4 {margin: 8px 5px 4px 0px; font-size:15px;}
.mod_topic_prevnext p {margin: 0px 5px 0 0px; XXheight:40px; clear:left; font-size:11px;}


/*
.mod_topic_page p.topics-back {padding:0px 0 10px 23px; margin: 20px 5px ; background: transparent url(img/back-topic-bg.gif) no-repeat; font-size:14px; font-weight: bold;}
*/
p.topics-back a {display:block; padding: 0 0 8px 15px; margin:0 0 5px 0; background:transparent url(img/pfeil-back.gif) no-repeat 0px 2px; 
XXfont-size:12px; line-height:120%; font-weight:bold ; border-bottom:none;
}


/*Homepage*/

.front {font-size:1em;}
.themenhome .homethema {padding: 5px 0 5px 0; margin: 0 15px 0 0; border-bottom:1px solid #ccc; XXfont-size:12px; transition:0.5s all;}
.themenhome .homethema:hover {padding: 15px 0 15px 0;}

.themenhome, .themenhome h3 {font-size:1em; line-height:130%; XXfont-weight:normal;}
.themenhome, .themenhome a {text-decoration: none ! important; border-bottom:none;}
.mainbox .themenhome .tp_thumb {width:40px; margin: 4px 5px 10px 0; max-width:18%;}

.mod_anytopics_comments div {padding: 5px 0 5px 0; margin: 0 5px 0 0; border-top:1px solid #ccc;}
.mod_anytopics_comments h3 {margin:30px 0 2px 0; }
.mod_anytopics_comments h4 {margin:2px 0 2px 0; }
.mod_anytopics_comments p {margin:0; }


#tnl_register {
    width: 92%;
	margin-top:40px;
}


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#suggestbox {
	z-index:980;
	margin: -10px 0 0 10px;	
	position: absolute;
	float:left;
	clear:both;		
}
#suggestbox ul {width: 180px; margin: 0 0 0 0; padding: 0 0 0 0;}
#suggestbox ul, #suggestbox li {
	list-style-type: none;
	list-style-image: none;	
	padding: 0 0 0 0 ;
	margin: 0 0 0 0 ;
	font-size:11px ;
	line-height: 110%;
	text-align: left;		
}


#suggestbox ul li a {
	display:block;
	padding: 2px 10px 2px 15px; 
	text-decoration: none;
	margin:0; 
	font-weight:normal;
	font-size:11px;
	line-height: 110%;
	overflow:hidden;
	border:none;
}


#suggestbox ul li a:hover { color:#000;}

#suggestbox ul li {background: transparent url(img/suggestli.png) repeat-y;} 
#suggestbox ul li.suggestdivide {font-size:5px;}
	
#suggestbox ul li.suggesttop {
	height:30px;
	background: transparent url(img/suggesttop.png) no-repeat;
} 
#suggestbox ul li.suggestbottom {height:15px; background: transparent url(img/suggestbottom.png) no-repeat;} 


/* Specials */
.mobileheader {display:block; font-size:42px; line-height:100%; font-weight:bold; text-align:center; color:#fff ! important; background-color: #55c3ec ! important; 
	margin: 0 10px 0 10px; padding: 10px 0 10px 0; }
	

/*Referenzen*/
table.referenzen {}
table.referenzen .td1 {width:25%; padding:0 10px 20px 0;text-align:center;}
table.referenzen .td1 img {max-width:100%;max-height:50px;  margin-right:10px;}

table.referenzen .td2  {padding: 0 0 20px 10px;}
table.referenzen .td2 h3 {margin:5px 0 0 0; XXfont-size: 12px; line-height:120%;}
table.referenzen .td2 p {margin:0 0 0 0 ; XXfont-size: 11px; line-height:120%;}


.logoshowbox { width: 100%; }
.logoshowbox .logo { float:left; width: 50%; height:160px; text-align:center;}
.logoshowbox  .logo img { width: 80%; }

.webdesign-links {width:106%;}
.webdesign-links .block {width:45%; height:140px; float:left; margin: 0 4% 10px 0;}
.webdesign-links .block .thumb {width:30%; float:left;}
.webdesign-links .block .thumb img {width:90%;}
.webdesign-links .block .text {width:69%; float:left; font-size: 14px ! important; line-height:140% ! important; }

.webdesign-referenzen .tp_pic {box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.2);}



.nomobiles, .mobileheaderbox, .closeswitch {display:none;}

.mainbox .contentbox img, .mainbox .sidebarbox img  {max-width:100% ! important; height:auto ! important;}


/*Extras*/
.infobalkenbox {
	padding: 20px 20% 50px 20%;
	background: url(../../pics/diverse/responsivecheckbg.png) no-repeat;
	background-size: 100% auto, auto;
}

.infobalkencontainer {height:18px; background-color:#ddd; padding:1px;  border:1px solid #666;}
.infobalken_plus {height:18px; background-color:#666; text-align:right; color:#fff; font-weight:bold; line-height:140%;}



/*Extra cookie_permission */
#cookie_permission {position:fixed; top:0; right:0; z-index:9950; width: 200px; padding:10px; background: #555; text-align:center; font-size: 0.9em; line-height:120%; border-radius: 0 0 0 25px; box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.2); }
#cookie_permission p , #cookie_permission a {color:#fff;}
#cookie_permission a.cookieaccepted {color:#000; background: #eeb300; display:block; padding:5px; border-radius: 15px; border: 1px solid #fff; font-weight:bold;}



/* ================================================================================================= */
/* Touch Screens */
@media screen and (max-width: 800px) {
	
	body, html { background-color:#fff;  background-image:none; width:100%; font-size:14px; color:#000;}
	.wrapper { width:100%; XXmargin-left:2%; background-color:#fff;  background-image:none; }
	.mainbox {float:none;  width:100%;}
	
	
	.headerbox {height:150px; width:100%;  float:right; background: #eee; margin-bottom: 30px;  }
	.mobileheaderbox {display:block; height:100px; }
	.mobileheaderbox a.logolink img {height:100px;}	
	#menuswitch {float: left; margin: 10px 10px 0 0; }
	.closeswitch  {display:block; XXfloat:right; padding: 10px 10px 0 0; }
	
	.XXmobilelogobox {display:none; height:100px;}
	.XXmobilelogobox a { float:left; 	width:200px; height:105px; margin-top:0; background: #fff url(img/logo-media.jpg) no-repeat; }
	.XXlogobox a { margin-top:0;}
	
	
	.contentbox { width:66%; padding:0 0 0 0; margin:0 0 0 2%;	}
	.contentbox blockquote  {width:45%; margin-right: -47%}
	.contentbox blockquote.topics-commentbox {width:90%; padding: 2px 2%; margin: 0 0 30px 0;}
	
	.sidebarbox  {width:30%; padding:0 0 0 0; margin:0 0 0 0;}
	
	.home1, .home2  {width:48%; padding:0 0 0 0; margin:0 0 0 0;}
	.home1 {margin-right:3% ;}
	.front {XXfloat:none;}
	
	#teaser, #leftbox, .logobox {display:none;}
	
	#leftbox {display:none; position:absolute; top:130px; left:-3%; width:240px; z-index:3000; background: #fff; 	box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.3);}
	#menu li { padding: 15px 0 10px 0; font-size: 16px;} 
	
/*	
	#leftbox {width:100%; }
	.logobox { height:100px; } 
	.logobox a {float:right;} 
	
	
	

	p, li, h4 {font-size: 14px;}
	h1 {font-size: 28px; }
	h2 {font-size: 18px; }
	h3 {font-size: 16px; line-height:110%; }
	
	#menu li { padding: 15px 0 10px 0; float:left;} 
	#menu li, #menu li a {border: none ! important; }
	#menu li.lev0 {padding: 25px 0 10px 0;} 

	#menu li a { padding: 12px 10px 12px 0;} 
	.titleonly  {display:none;}
	*/
	

}


/* ================================================================================================= */
/* Touch Screens */
@media screen and (max-width: 460px) {

	
	
	
	#block2start {display:none;}
	#block2startmobile {display:block;}
	#block2startmobile {display:block;}
	#block2startmobile .tp_pic_container {height:120px; overflow:hidden;}
	#block2startmobile .tp_pic_container img {width:100%;}
	
	.contentbox, .sidebarbox  {float:none; clear:both; width:96%; margin:0 2% 0 2%;}
	.contentbox blockquote  {background:#eee; width:30%; padding: 2px 2%; margin: 0 -2% 0 2%;}
	.contentbox blockquote.topics-commentbox {width:90%; padding: 2px 2%; margin: 0 0 30px 0;}
	
	.webdesign-referenzen blockquote {width:100%; height:133px; overflow:hidden; margin: 0 0 0 0; padding: 0 0 0 0; background:#eee; transition:0.5s height;}
	.webdesign-referenzen blockquote:hover {height:190px; transition:0.5s height;}
	.webdesign-referenzen blockquote img {max-width:100%;}
	
	.webdesign-links {width:100%;}
	.webdesign-links .block {width:100%; height:100px;  margin: 0 0 0 0;}
	.webdesign-links .block .thumb {}
	.webdesign-links .block .thumb img }
	.webdesign-links .block .text { }
	
	
	.themenhome .tp_thumb {width: 23%; margin: 3px 2% 4px 0; float:left;}
	
}

/*-------------------------PRINT-----------------------------*/
  
@media print {

 .nopr, #leftbox, #topmenu, #footerbox, #gecko_scrollbar {display:none;}
 #mainbox {width:80%; margin-left:15%}

}