@charset "utf-8";
/* CSS Document */

/* Reset
--------------------------------------------------------------------------------------- */
* {
	padding: 0;
	margin: 0;
	border: 0;
}
/* Globals und Typo 
--------------------------------------------------------------------------------------- */

html {
/* Wahlweise Grid-Hintergrund
Rasterhintergrund, der die Breite bis 100 Pixel und eine Höhe bis 950 Pixel anzeigt. Die Breite von 960 Pixel ist markiert. Der Hintergrund ist transparent, muss also nicht nur mit #fff verwendet werden. Es wird eine Schriftgröße von 75% oder 12px festgelegt.
	background: #fff url(bilder/grid.png) top left no-repeat;
*/	
	background: #ccc;
}

body {
/* Wahlweise Linienhintergrund
Linienhintergrund abgestimmt auf eine Schriftgröße von 12px.	
	background: transparent url(bilder/line-height.gif) top left;
	*/	
	font-size: 100.01%;
	line-height: 1.7em;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align:center;
	background: #e6e6e6;
	font-size: 75%;
	color: #444;
}

html>body {
	font-size: 12px;
}


a:link {
	color: #0066FF;
	text-decoration: none;
}

a:visited {
	color: #0066FF;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

a[href$='.pdf'] { 
	padding: 5px 20px 5px 0;
	background: transparent  url(../images/icon_pdf.png) no-repeat center right;
}


/* Macht die gepunktete Linie um geklickte Links unsichtbar
--------------------------------------------------------------------------------------- */
a:focus {
    outline: none;
}

.clr {
	clear:both;
	}
	

/* Basis Boxen
--------------------------------------------------------------------------------------- */
#container {
	background-image: url(/1_newDesign/images/bgTop.jpg);
	background-repeat:repeat-x;
	background-position:top;
	}
/*  #main {
	width: 983px;
	margin: auto;
	overflow: hidden;
	} */
	
#header {
	width: 975px;
	height: 120px;
	margin: auto;
	overflow: hidden;
	text-align:left;
	}
	
#top {
	width: 975px;
	height: 120px;
	margin: auto;
	position: relative;
	overflow: hidden;
	text-align:left;
	
	}

p {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.0em;
	color: #444;
	text-align:left;
}


h1 {
	padding: 24px 0 24px 15px;
	margin: 0;
}
h1 span {
	position: absolute;
	top: -332px;
	left: -767px;
	width: 508px;
}



h2 {
	color: #006FDE;
	font-size: 1.8em;
	font-weight: normal;
	margin-bottom: 10px;
	}



#mainNavi {
	height: 40px;
	width: 975px;
	margin: auto;
	border-left: 1px solid #6c6b6b;
	}

/* Navigation
--------------------------------------------------------------------------------------- */

#navigation {
	float: left;
	width: auto;
	padding: 0 0px;
	}

#navigation li {
	font-size: 14px;
	float: left;
	list-style:none;
	max-height: 40px;
	line-height: 40px;
	color: #FFF;
	}
.about {
	border-right: 1px solid #504f4f;
	}

#navigation li a, #navigation li a:visited {
	float: left;
	color: #fff;
	padding:0px 30px;
	text-align: center;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-left: 1px solid #504f4f;
	border-right: 1px solid #6c6b6b;
	line-height: 40px;
	}

#navigation li a:hover {
	background-image: url(../images/naviHover.jpg);
	background-repeat: repeat-x;
	color:#f2f2f2;
	text-decoration: underline;
	}
	
#navigation li a.active {
	background-color: #f2f2f2;
	background-image: url(../pix/active.jpg);
	background-repeat: repeat-x;
	color:#333;
	text-decoration: underline;

	}
#mainNavi span {
	display: none;
}

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


#beschreibung {
	position: absolute;
	top: 200px;
	left: 228px;
	width: 438px;
	padding: 10px 10px 8px 25px;
	background-image: url(../images/transparentBG.png);
	height: 104px;
	color: #000;
}
#beschreibungVideo{
	position: absolute;
	top: 200px;
	left: 228px;
	width: 438px;
	padding: 10px 10px 8px 25px;
	height: 154px;
	color: #000;
}
#beschreibung h2 {
	font-size: 1.5em;
	margin: 0 0 2px 0;
	text-align: left;
	}

#beschreibungVideo h2 {
	font-size: 1.5em;
	margin: 0 0 2px 0;
	text-align: left;
	}

#beschreibungVideo img {
	margin-top: 10px;
	}
	
.artikelBild {
	height: 170px;
	width: 220px;
}
#bildOben {
	position:absolute;
	left:714px;
	top:173px;
	width: 264px;
	height:140px;
}
/* Breadcrumb-Navi */
#breadNavi {
	position: absolute;
	top: 175px;
	left: 249px;
	width: 469px;
	height: 30px;
}
#breadNavi h3 {
	font-size: 11px;
	line-height: 30px;
	font-weight:normal;
	text-align: left;
}
#breadNavi h3 a {
	color: #444;
}
#breadNavi h3 a:hover {
	color: #c4c4c4;
}




#wrapper {
	width: 983px;
	margin: auto;
	overflow: hidden;
	position: relative;
	}
#content {
	float: left;
	width: 983px;
	text-align: left;
	}	
	
#contentMain {
	clear: both;
	width: 963px;
	padding: 10px 10px 10px 10px;
	background-image: url(../images/bgWhiteMid.jpg);
	background-repeat: repeat-y;
	}

#contentTop {
	margin-top: 10px;
	clear: both;
	width: 983px;
	height: 6px;
	background-image: url(../images/bgWhiteTop.jpg);
	background-repeat: no-repeat;
	}
#contentBottom {
	clear: both;
	width: 983px;
	height: 6px;
	background-image: url(../images/bgWhiteBottom.jpg);
	background-repeat: no-repeat;
	}
	
	
	
	

#left {
	width: 215px;
	float: left;
	margin-right: 10px;
	text-align: left;
	}
	
#subNavi {
	width: 195px;
	float: left;
	margin-right: 10px;
	border: 1px solid #e0e0e0;
	background: #f4f4f4;
	padding: 0 10px;
	background-image: url(../images/bgSub.jpg);
	background-repeat: repeat-x;
	background-position: top;
	margin-bottom: 10px;
	}

#subNavi ul {
	margin:  0;
	}

#subNavi li  {
	font-size: 1.0em;
	line-height: 2.2em;
	border-bottom: 1px solid #e0e0e0;
	border-top: 1px solid #fff;
	padding: 0px 10px 0 20px;
	color: #333;
	list-style: none;
	background: transparent url(../images/werbeartikel-bedruckung-pfeil.jpg) no-repeat center left;
}

#subNavi li a {
	color: #333;
	}
#subNavi li a:hover {
	color: #000;
	}


#subNavi h3 {
	font-size: 1.2em;
	text-align: center;
	line-height: 30px;
	color:#1462CE;
	margin: 0;
	padding: 0;
	}
	

#subNavi .current {
	font-weight: bold;
	background: transparent url(../images/bedruckte-werbeartikel-pfeil2.jpg) no-repeat center left;
	color: #1462CE;
	border-bottom:0px solid #fff;
}
#subNavi .current a {
	font-weight: bold;
	color: #1462CE;
}
#subNavi .current2 {
	line-height: 2.0em;
	border-bottom:1px solid #fff;
	border-top: 1px solid #fff;
	padding: 0px 10px 0 25px;
	color: #333;
	list-style: none;
	background: #fdfdfd url(../images/bedruckte-werbeartikel-pfeil.jpg) no-repeat center left;
	border-left: 1px dotted #e0e0e0;

}
#subNavi .current2 a {
	font-weight: normal;
	color: #1462CE;
}
#subNavi .current2 a:hover {
	font-weight: normal;
	color: #444;
}

.subBox {
	width: 195px;
	float: left;
	margin-right: 10px;
	border: 1px solid #e0e0e0;
	background: #f4f4f4;
	padding: 0 10px;
	background-image: url(../images/bgSub.jpg);
	background-repeat: repeat-x;
	background-position: top;
	margin-bottom: 10px;
	}

.subBox ul {
	margin:  0;
	}

.subBox li  {
	font-size: 1.0em;
	line-height: 2.2em;
	border-bottom: 1px solid #e0e0e0;
	border-top: 1px solid #fff;
	padding: 0px 10px 0 20px;
	color: #333;
	list-style: none;
	background: transparent url(../images/werbeartikel-bedruckung-pfeil.jpg) no-repeat center left;
}

.subBox li a {
	color: #333;
	}
.subBox li a:hover {
	color: #000;
	}


.subBox h3 {
	font-size: 1.2em;
	text-align: center;
	line-height: 30px;
	color:#1462ce;
	margin: 0;
	padding: 0;
	}
	

.subBox .current {
	font-weight: bold;
	background: transparent url(../images/bedruckte-werbeartikel-pfeil2.jpg) no-repeat center left;
	color: #1462CE;
	border-bottom:0px solid #fff;
}
.subBox .current a {
	font-weight: bold;
	color: #1462CE;
}
.subBox .current2 {
	line-height: 2.0em;
	border-bottom:1px solid #fff;
	border-top: 1px solid #fff;
	padding: 0px 10px 0 25px;
	color: #333;
	list-style: none;
	background: #fdfdfd url(../images/bedruckte-werbeartikel-pfeil.jpg) no-repeat center left;
	border-left: 1px dotted #e0e0e0;

}
.subBox .current2 a {
	font-weight: normal;
	color: #1462CE;
}
.subBox .current2 a:hover {
	font-weight: normal;
	color: #444;
}

/* Hier sind die Master-Styles drinne */

#main {
	width: 710px;
	float: left;
	margin: 150px 0px 15px 15px;
}
#mainVideo {
	width: 710px;
	float: left;
	margin: 200px 0px 15px 15px;
}
.mainContent {
	width: 220px;
	float: left;
	margin: 0 12px 15px 0;
	border: 1px solid #e0e0e0;
	text-align: center;
}
.artikelNummer {
	width: 216px;
	text-align: left;
	padding: 2px 0px 2px 4px;
	color:#444;
	background-color: #CCCCCC;
}

.artikelBild {
	height: 170px;
	width: 220px;
}

.artikelBez {
	height: 36px;
	width: 216px;
	text-align: left;
	padding: 2px 0px 1px 4px;
	background-color: #f4f4f4;
	border-top: 1px solid #e0e0e0;
	line-height: 1.5em;
	position: relative;
}

.artikelVideo {
	position: absolute;
	top: -10px;
	right: 10px;
	width: 30px;
	height: 29px;
	background-image: url(../../pix/video.gif);
	display: block;
	}
.artikelBez a {
	color: #1462CE;
	text-decoration: none;
}


.artikelBez a:hover {
	color: #CCCCCC;
	text-decoration: underline;
}


#footer {
	margin-top: 25px;
	clear: both;
	background: url(../images/bgGreyBottom.jpg);
	min-height: 120px;
	background-color: #f2f2f2;
	}
#footer p {
	padding-top: 10px;
	width: 960px;
	margin: auto;
	text-align: center;
}

#footer a {
	color: #444;
}

.end {
	width: 700px;
	position:absolute;
	top: -936px;
	left: 50px;
}
/* Landing Page / Default */

#beschreibungLP {
	position: absolute;
	top: -946px;
	left: -159px;
	width: 455px;
	padding: 5px;
	border: 1px solid #c4c4c4;
	background-image: url(../layout/pix/verlauf.gif);
	background-repeat: repeat-x;
	background-position: top;
	height: 87px;
}
.teaserOben {
	width: 700px;
	height: auto;
	float: left;
	background-color: #f4f4f4;
	background-repeat: repeat-y;
	margin: 0 0 30px 10px;
	border: 1px solid #c4c4c4;
}
.teaserOben img {
	position: absolute;
	left: 789px;
	top: 189px;
}
.teaserOben h4 {
	font-size:18px;
	font-weight: bold;
	margin: 20px 10px 10px 40px;
	color: #1462CE;
}
.teaserOben p {
	margin: 0px 40px 20px 40px;
}
#mainLP4 {
	width: 715px;
	float: left;
	margin: 30px 0px 10px 5px;
	text-align: left;
}
.rubrikCont {
	width:700px;
	height: auto;
	float: left;
	padding: 0 0 0 8px;
}
.rubrik4 {
	height: 265px;
	width: 165px;
	border: 1px solid #c4c4c4;
	float: left;
	margin: 0 10px 10px 0;
}
.rubrik4rechts {
	height: 265px;
	width: 165px;
	border: 1px solid #c4c4c4;
	float: left;
	margin: 0;
}
.rubrik5 {
	height: 265px;
	width: 165px;
	border: 1px solid #c4c4c4;
	float: left;
	margin: 0 25px 15px 30px;
}
.rubrik5links {
	height: 265px;
	width: 165px;
	border: 1px solid #c4c4c4;
	float: left;
	margin: 0 0 0 170px;
}
.rubrikBez {
	line-height: normal;
	height: 45px;
	width: 165px;
	background-color: #f4f4f4;
	text-align: center;
	font-weight: bold;
	color: #1462CE;
	padding-top: 8px;
	border-bottom: 1px solid #c4c4c4;
}
.rubrikBez a {
	font-weight: bold;
	color: #1462CE;
	text-decoration: none;
}
.rubrikBez a:hover {
	font-weight: bold;
	color: #c4c4c4;
}
.rubrikBild {
	height: 165px;
	width: 165px;
}
.rubrikLink {
	width: 149px;
	border-top: 1px solid #c4c4c4;
	font-size: 10px;
	padding: 5px 8px 0 8px;
	line-height: 13px;
}
.rubrikLink a {
	color: #444;
	text-decoration: none;
}
.rubrikLink a:hover {
	color: #444;
}
.keys {
	width: 715px;
	height: auto;
	border: 1px solid #c4c4c4;
	float: left;
	background-color: #FFFFFF;
	margin: 18px 0 18px 0;
}
.keys p {
	margin: 5px 8px 5px 8px;
}
.keys strong a {
	font-size: 13px;
	color: #1462CE;
	font-weight:normal;
	text-decoration: none;
}
.keys strong a:visited {
	color: #1462CE;
	font-weight:normal;
	text-decoration: none;
}
.keys strong a:hover {
	color: #1462CE;
	font-weight:normal;
	text-decoration: none;
}
.keys em a {
	font-size: 14px;
	color: #1462CE;
	font-weight:bold;
	font-style:normal;
	text-decoration: none;
}
.keys em a:visited {
	color: #1462CE;
	font-weight:bold;
	font-style:normal;
	text-decoration: none;
}
.keys em a:hover {
	color: #1462CE;
	font-weight:bold;
	font-style:normal;
	text-decoration: none;
}


/* CSS für wissen, servcie, about CONTENT */

#mainCenter {
	width: 700px;
	float: left;
	margin: 15px 0px 10px 18px;
	text-align: left;
}
#mainCenter h1 {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
}
#mainCenter p {
	font-size: 12px;
	color: #444;
	margin: 0 0 0 10px;
}


/* CSS für LandingPageNeu */

#mainCenterLP {
	width: 650px;
	float: left;
	margin: 15px 0px 10px 40px;
	text-align: left;
}
#mainCenterLP h1 {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
}

#mainCenterLP h2 {
	font-size: 16px;
	color: #1462CE;
	margin: 0px 0 0 0;
	padding: 10px;
	font-weight: bold;
}

#mainCenterLP h3 {
	font-size: 16px;
	color: #1462CE;
	margin: 0px 0 0 0;
	padding: 10px;
	font-weight: bold;
}

#mainCenterLP ul {
	margin: 0px 0 0 0;
	padding: 0px 10px 0px 30px;
}
#mainCenterLP li {
	padding: 5px 10px;
}

#mainCenterLP ol {
	margin: 0px 0 0 0;
	padding: 0px 10px 10px 30px;
}
#mainCenterLP li {
	padding: 5px 10px;
}
.teaserBild {
	width: 140px;
	height: 150px;
	border: 1px solid #CCC;
	margin: 10px;
	float: left;
	font-size: 9px;
	}
.teaserBildText {
	padding-left: 5px;
	}

#mainCenterLP p {
	font-size: 12px;
	color: #444;
	margin: 0 0 0 10px;
}




/* CSS LANDINGPAGE */

#landingCenter {
	width: 700px;
	float: left;
	margin: 15px 0px 10px 18px;
	text-align: left;
}
#landingCenter h1 {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
}
#landingCenter p {
	font-size: 12px;
	color: #444;
	margin: 0 0 0 10px;
}

#landingCenter h1.landingpage {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
	}

#landingCenter h2.landingpage {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
	}

#landingCenter h3.landingpage {
	font-size: 16px;
	color: #1462CE;
	margin: 10px 0 0 0;
	padding: 10px;
	font-weight: normal;
	}

#landingCenter ul {
	margin: 0 0 0 0;
	padding: 10px 0 0 40px;
	font-weight: normal;
	}

#landingCenter li {
	font-size: 14px;
	font-weight: normal;
	border-top: 1px solid #efefef;;
	width: 600px;
	margin: 10px 0 0 0;
	padding: 10px;
	}

#landingCenter li strong {
	font-weight: normal;
	}

#landingCenter img {
	margin: 0 0 0 20px;
	padding: 10px;
	font-weight: normal;
	border: 0px dotted #efefef;
	}


/* WISSEN: Druckverfahren */		
#box {
	width: 600px;
	height: auto;
	margin-left: 60px;
	margin-bottom: 30px;
	margin-right: 0;
	margin-top: 0;
}
#box h4 {
	font-size: 12px;
	margin-bottom: 25px;
	margin-left: 0px;
}
#tabDruck {
	margin: 0;
	padding: 0;
	width: 150px;
	float: left;
	text-align: right;
	padding-top: 20px;
}
#tabDruck table {
	width: 150px;
	list-style: circle;
}
#tabDruck td {
	height: 25px;
	line-height: 25px;
	padding-left: 20px;
	cursor: pointer;
	text-align: right;
}
.tabHover {
	color: #0066CC;
}
.tabAuswahl {
	color: #0066cc;
	font-weight: bold;
}
#detailArea {
	width: 350px;
	float: left;
	margin-left: 30px;
	border-left: 1px solid #b3b3b5;
}
#detailArea p {
	margin: 0;
	padding-top: 10px;
	padding-left: 35px;
}
#detailArea h2 {
	margin: 0;
	padding-top: 10px;
	padding-left: 35px;
	font-size: 16px;
}
#detailArea img {
	padding-top: 25px;
	padding-left: 35px;
}

.endDetail {
	position: absolute;
	top: -356px;
	left: -508px;
	}



/* SERVICE */
p img {
float: left;
margin-right: 20px;
margin-bottom: 3px;
border: 1px solid #f3f3f3;
}

.bildOhneRand img{
float: left;
margin-left: 40px;
margin-right: 10px;
margin-bottom: 3px;
border: 0px solid #f3f3f3;
}
.bildWissen {
float: none;
}
/* Katalog DIV*/
.katalog {
	width: 300px;
	height: 225px;
	float: left;
	margin-left: 50px;
	}
.katalog_form {
	background-color:#CCC;
	margin-left: 50px;
	width: 500px;
	border: 1px solid #ccc;}

/* video*/
.video {
	width: 600px;
	height: 235px;
	margin-left: 50px;
	margin-bottom: 25px;
	border-bottom: 1px solid #CCC;
	}

object {
	float:left;
}

.videodes {
	margin-left: 15px;
	float: left;
	width: 250px;
	}

.videodes strong {
	color:#06c;
	font-size: 12px;
	}
	
/*** Top Tip ***/
.toptip {
  clear: both;
  margin: 0 0 0 10px;
  font-size: 14px;
  color: #06c;
  font-weight: bold;
	}
.toptipschrift {
	font-size: 13px;
  color: #06c;
  font-weight: normal;
	}

/*** TestText ***/

.testText {
	width: 960px;
	margin: auto;
	}