/*$Id: default.css,v 1.3 2003/10/20 10:45:00 ecki Exp $ */
/* # # # # # # # # # # # # # # # # # # # # # #  */
/*
default.css: zentrales CSS-Dokument für weitestgehend CSS2-Fähige Browser
 */
/* # # # # # # # # # # # # # # # # # # # # # #  */

/* beliebige Elemente verbergen */
.hidden{
  display: none !important;
}

body, html{
  margin:0 ;
  padding:0 ;
  height:100%; /* Höhe und Breite setzen, um Kind-Elemente in Höhe und Breite beeinflussen zu können */
  width:100%;
}

/* In diesem CSS Angabe der Schriftgröße in px.
Für den IE wird eine Schriftgrößenangabe via Conditional Comments
nachgeladen (ie.css) */
body{
  background-color: #fff;
  margin:20px 0 0 0;
  font: 11px/135% verdana, helvetica, sans-serif ;
	min-width: 1000px;
}

/* Überschriften: Farben und Größen. Größenangaben relativ(em) zur Body-Schriftgröße */
h1, h2, h3, h4{
  color:#17528e;
}

h1{
  font-size: 1.3em;
  margin: 0;
}

h2{
  font-size: 1.3em;

}

h3{
  font-size: 1em;
  margin: 1em 0 0.5em 0;

}

/* Links */

a {
 color: #17528e;
 text-decoration: none;
 font-weight: bold;
}

a:hover {
 color: #17528e;
 text-decoration: underline;
 font-weight: bold;
}


a.start {
 color: #FFFFFF;
 text-decoration: none;
 font-weight: bold;
}

a.start:hover {
 color: #FFFFFF;
 text-decoration: underline;
 font-weight: bold;
}


/* Links in Absätzen */
p a{

  font-weight: normal;
  text-decoration: underline;
}
p a:hover{
  font-weight: normal;
}


/* Horizontaler Strich  */

hr{
  color:#fff;
  background-color: #fff;
  border-width:0 0 1px 0;
  border-color: #17528e;
  border-style: solid;
  height: 1px;
  line-height: 1px;
  clear: both;
  padding: 0;
  margin:  0;
}



img, a img { /* unterdrückt blaue Ränder um Grafik-Links */
  border: none;
  }

/* Kennzeichnung von angesprungenen #-links, funktioniert nur in neuen Browsern (Mozilla, Safari etc.), nicht im IE */
*:target{
  background-color:#FFFF93;
  border: 1px dashed Fuchsia;
  padding:0.5em;
}
/* und noch einen Unicode-Pfeil davor:  */
*:target:before{
  content: "\21E8   ";
  white-space: nowrap;
}
/* Navigation */
/* Meta-Navigation */
#metanav{
  margin: 0;
  padding: 0 0 0 10px;
}

#metanav a{
  padding: 0;
	text-decoration: none;
	vertical-align: top;
	line-height: 16px;
}

#metanav a:hover {
	text-decoration: underline;
}

#metanav img {
	margin: 0px 10px 0 10px;
}

#metanav a .current {
	text-decoration: underline;
}

/* Hauptnavigation */
hauptnav img, #hauptnav a img{
  border:none;
  margin:0;
  padding:0;
}

#hauptnav a{
  margin:0;
  padding:0;

 }

#hauptnav {
  background:#17528c;
  margin: 18px 0 0 0;
  padding:0;
  height:30px;
  min-width:372px;
}
/* Umbruch der Naviagtionsleiste in en Block erzwingen */
#hauptnav #widthBlock{
  width:500px; /* Wert von 384px hochgesetzt HN 13.02.2007 */
  float:left;
  height:30px;
  min-width:378px;
  margin:0;
  padding:0;
}

/* Der erste Hack:
The Simplified Box model Hack (SBMH)
Dokumentation:
http://css-discuss.incutio.com/?page=BoxModelHack
http://centricle.com/ref/css/filters/tests/sbmh/
 */

 #logo{
  margin:0 0 12px 0;
  padding:0 10px 0 200px;
  background:#fff url(/px/leuchtturm.jpg) no-repeat scroll 0% 0%;
  float: right;
  margin-left: -3px;/* Für IE */
  m\argin-left: 0;/* alle anderen*/
 }

/* Homepage  2spaltig an Navigation ausgerichtet*/

  #homeblurp, .lead-in{
  clear: both;
  font-size: 1.2em;
  color:#333;
  line-height: 140%;
  margin: 40px 19% 40px 120px;
 }

  #lead-in{
  clear: both;
  color:#333;
  margin: 1em 19% 40px 120px;
 }
  #lead-in.gross{
  font-size: 1.1em;
  line-height: 140%;
  font-weight: bold;
 }

h1.lead-in{
  color:#333;
  margin: 40px 19% 0 120px;
    font-size: 1.3em;
}

#homeRight, .rechts {
float:right;
width:430px;
wid\th:392px;
background:#fff;
padding:0 30px 60px 15px;
margin: 0;
}

#homeLeft, .links {
border:1px solid #eaeaea;/* Notwendig,, sonst Probleme mit Box-Model, Floats und Abständen */
color:black;
padding:0 30px 30px 120px;
margin:0 435px 0 0;
background:#eaeaea;
height:70%; /* IE5.x */
hei\ght:75%;/* IE 6.0 */
ma\rgin-right: 440px ;
}

/*
Child Selector Hack:
http://w3development.de/css/hide_css_from_browsers/child/
*/
html>body #homeLeft{ /* andere Browser */
height: auto;
min-height:35%;
}

#homeRight h2, #homeLeft h2{
 margin-top:20px;
}

.links{
  padding:0 30px 20px 120px;
}

.rechts{
padding:0 30px 20px 15px;
}

#footer{
  clear:right;
  background:#fff;
  margin:0;
	padding: 15px 0 15px 10px;
}

#footer a{
  padding: 0;
	text-decoration: none;
	vertical-align: top;
	line-height: 14px;
}

#footer a:hover {
	text-decoration: underline;
}

#footer img {
	margin: 0px 10px 0 10px;
}


#foot p{margin:0;padding:0;}

/* 2-Spaltiges Layout fuer die Startseite via Tabelle */
table#layout2col{
  clear: left;
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border-style: none;
  margin-top:50px;
  width:100%;
}

table#layout2col td{
  padding:10px;
  vertical-align: top;
}


table#layout2col #left {
  background-color: #eaeaea;
  /* width:17.5em; */
	width: 196px;
  color: #17528e;
	padding-top: 20px;
	border-top: 10px solid #eaeaea;
	border-bottom: 10px solid #eaeaea;
}

table#layout2col #content{
  background-color: #fff;
  /* padding: 0 12px 12px 20px; */
	border-top: 10px solid #eaeaea;
	border-bottom: 10px solid #eaeaea;
}

table#layout2col #content .thema img{
 float: left;
}

table#layout2col #content h1{
	color: #333;
	font-size: 14px;

}

#innercontent {
	width: 100%;
}

#innercontent .thema h1 {
	margin:30px 0 0 140px !important;
	color: #333;
	font-size: 13px !important;
	line-height: 16px !important;
}

#contentRight {
	float: right;
	width: 400px !important;
}

#contentRight hr,
#contentLeft hr {
	margin: 14px 0 7px 0;
}

#contentLeft li{
  margin: 15px 0 ! important;
}


/* 3-Spaltiges Layout via Tabelle */

table#layout3col{
  clear: left;
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border-style: none;
  margin-top:50px;
  width:100%;
}

table#layout3col td{
  padding:10px;
  vertical-align: top;
}

table#layout3col #left {
  background-color: #eaeaea;
  /* width:17.5em; */
	width: 196px;
  color: #17528e;
	padding-top: 20px;
	border-top: 10px solid #eaeaea;
	border-bottom: 10px solid #eaeaea;
}

table#layout3col #right {
  background-color: #eaeaea;
  width:12.5em;
  color: #17528e;
	border-top: 10px solid #eaeaea;
	border-bottom: 10px solid #eaeaea;
}

/* nochmal nachgelegt für Browser, dies gar nicht kapieren wollen: */
table#layout3col #right{
	/* width:14.5em;   für den IE */
	width: 196px;
}

html>body table#layout3col #right{
  /* width:17.5em;  alle anderen */
	width: 196px;
}


#right h2{
  color:#000;
  font-size: 1.0em;
}
#right p {
	background:#eaeaea url(/px/dotted.gif) 0 0 repeat-x;
 }
/* in der rechten Spalte auf Wunsch normale Textauszeichnung */
td#right a, td#right ul li a,
td#right a:visited, td#right ul li a:visited{
  font-weight: normal;
}

table#layout3col #content{
  background-color: #fff;
  padding: 8px 12px 12px 10px;
	border-top: 10px solid #eaeaea;
	border-bottom: 10px solid #eaeaea;
}

#content p{
  margin: 0 0 0.25em 0 ;
/* oben rechts unten links (oben beginnend in Uhrzeigersinn)*/
}

/* orginal
#content p{
  margin: 0;
}*/

/* Contentseite 2-spaltig ohne Tabelle
wahlweise kann auch die rechte Spalte  des 3-Spaltigen Tabellengerüstst einfach weggelassen werden.
*/


/* Liste mit Dot */
/*
Die Darstellung des Aufzählungszeichen wird hier mit einem HIntergrundbil realisiert,
da dieses Feature in den Browsern sehr unterschiedlich und z.T. unzulänglich ungestzt ist.
Nur so kann man eine angemesse Anordnung der Grafik auch bei unterschiedlich Schriftgrößen erreichen
 */
ul {
        list-style-type:none;
        margin:0.8em 0 0 0 ;
        padding:0;
}

li {
  padding: 0 0 0.5em 11px;
  background: transparent url(/px/dot-blau.gif) no-repeat 0  0.4em;
  color: #000;
}

li a {
 color: #17528e;
 text-decoration: none;
 font-weight: normal;
}

li a:hover {
 color: #17528e;
 text-decoration: underline;
 font-weight: normal;
}


html>body li a {/* wird vom IE ignoriert */
  width: auto;
}

/* verschachtelte Liste */
ul li ul{
  margin-top:0;
}

ul li ul li{

 background:none!important;
padding:0.2em 0 0 0.4em;
}

/* Navigationsliste in der linken Spalte */


#left strong a {
  color: #333;
	font-size: 14px;
}

#left li {
  background: #eaeaea url(/px/dot-blau.gif) no-repeat 0  0.4em;
}

#left li.aktiv {
  background:#eaeaea url(/px/dot-blau.gif) no-repeat 0 0.4em;
  color: #000;
}

#left li.aktiv a {
  color: #000;
}


#left li a.sub { /* Subnavigation eingerückt */
 background: #eaeaea url(/px/dot-orange.gif) no-repeat 0  0.4em;
 display:block;
 /* die fond-weight von dsn und padding-top auskommentiert*/
 font-weight: normal;
 padding-left:10px;
 /* padding-top:10px; */
}

#left li a:hover   {
  color:black;
  text-decoration: underline;
}
#left li:hover   {
  background:#eaeaea url(/px/dot-blau.gif) no-repeat 0 0.4em;
}

#left p {
	background:#eaeaea url(/px/dotted.gif) 0 0 repeat-x;
}

/* Definitionslisten */

/* Liste im Dokument */
 dl{
    line-height:1.5em;
    color: #000;
    width:90%;
  }
  dt{
    margin-top:.5em;
    margin-left:20px;
    font-weight: normal; /* geändert von bold in normal Nerstheimer */
    padding: 0 0 0 11px;
    background: transparent url(/px/dot-blau.gif) no-repeat 0  0.5em;
  }
  dd{
    margin-left:11px;
  }

/* Liste auf der Homepage */
  #homeLeft dt{
    font-weight:bold;
  }

  #homeLeft dd{
    margin-left:0;
  }

/* Überschriften mit positioniertem Hintergrundbild auf der Homepage */
/* Achtung, fragiles Konstrukt. Hintergrundbild links, Schrift unten ausgerichtet */

.grafikhead{
 font: bold 1.4em/120% verdana, sans-serif ;
 color: #333 !important;
 padding:10px 5px 0 55px;
 margin: 15px 0 0.4em 0;
 min-height: 45px;
 line-height: 125%;
}

.grafikhead small{
    display:block;
    font-weight: bold;
    font-size:0.7em;
    padding: 0 0 10px 11px;
    background: #fff url(/px/dot-blau.gif) no-repeat 0 0.7em;
 color: #17528e;
}

.grafikhead2{
 font: bold 1.4em/120% verdana, sans-serif ;
 color: #333 !important;
 padding:10px 5px 0 55px;
 margin: 15px 0 0.4em 0;
 min-height: 45px;
 line-height: 125%;
}

.grafikhead2 small{
    display:block;
    font-weight: bold;
    font-size:0.7em;
    padding: 0 0 10px 30px;
/*    background: #fff url(/px/dot-blau.gif) no-repeat 0 0 25px 0.7em; */
 color: #17528e;
}

#homeRight p{
  margin: 0;
}

#homeRight p.whatami{
  margin-top: 20px;
}

td#content.padtop{
  padding-top: 20px!important;
}

.grafikhead-gross{
 font: bold 1.25em/135% verdana, sans-serif ;
 color: #17528e !important;
 padding:45px 5px 0 75px;
 margin: 0 0 0.4em 0;
 min-height: 45px;
}


.grafikhead-produkt{
 font: bold 1.25em/135% verdana, sans-serif ;
 color: #17528e !important;
 padding:45px 5px 0 150px;
 margin: 0 0 0.4em 0;
 min-height: 45px;
}

html>body .grafikhead-gross{
 padding-top:20px;
}

html>body .grafikhead-produkt{
 padding-top:60px;
}


/* Schmuckgrafiken für Überschriften auf der Homepage; werden über Klassen zugewiesen */

#nordgate{
 background:#fff url(/px/produktlogos/nordgate45.jpg) no-repeat scroll 0% 95%;
}

#nordgate-gross{
 background:#fff url(/px/produktlogos/nordgate65.jpg) no-repeat scroll 0% 95%;
}
#ips{
 background:#fff url(/px/produktlogos/ips45.jpg) no-repeat scroll 0% 95%;
}
#ips-gross{
 background:#fff url(/px/produktlogos/ips65.jpg) no-repeat scroll 0% 95%;
}
#optum{
 background:#fff url(/px/produktlogos/optum45.jpg) no-repeat scroll 0% 95%;
}
#optum-gross{
 background:#fff url(/px/produktlogos/optum65.jpg) no-repeat scroll 0% 95%;
}
#ipstools{
 background:#fff url(/px/produktlogos/ipstools45.jpg) no-repeat scroll 0% 95%;
}
#ipstools-gross{
 background:#fff url(/px/produktlogos/ipstools65.jpg) no-repeat scroll 0% 95%;
}
#pswitch{
 background:#fff url(/px/produktlogos/pswitch45.jpg) no-repeat scroll 0% 95%;
}
#pswitch-gross{
 background:#fff url(/px/produktlogos/pswitch65.jpg) no-repeat scroll 0% 95%;
}

#sicherheit{
 background:#fff url(/px/web_icons/aktenordner_45.jpg) no-repeat scroll 0% 95%;
}

#sicherheit-gross{
 background:#fff url(/px/web_icons/aktenordner_65.jpg) no-repeat scroll 0% 95%;
}

#scan-gross{
 background:#fff url(/px/web_icons/tastatur_65.jpg) no-repeat scroll 0% 95%;
}

#scan{
 background:#fff url(/px/web_icons/tastatur_45.jpg) no-repeat scroll 0% 95%;
}

#audits{
 background:#fff url(/px/web_icons/maus_45.jpg) no-repeat scroll 0% 95%;
}

#audits-gross{
 background:#fff url(/px/web_icons/maus_65.jpg) no-repeat scroll 0% 95%;
}

#konzepte{
 background:#fff url(/px/web_icons/schoenfelder_45.jpg) no-repeat scroll 0% 95%;
}
#konzepte-gross{
 background:#fff url(/px/web_icons/schoenfelder_65.jpg) no-repeat scroll 0% 95%;
}

#sap{
 background:#fff url(/px/web_icons/platine2_45.jpg) no-repeat scroll 0% 95%;
}

#sap-gross{
 background:#fff url(/px/web_icons/platine2_65.jpg) no-repeat scroll 0% 95%;
}

#cc{
 background:#fff url(/px/web_icons/laptop_45.jpg) no-repeat scroll 0% 95%;
}

#cc-gross{
 background:#fff url(/px/web_icons/laptop_65.jpg) no-repeat scroll 0% 95%;
}

#seminar{
 background:#fff url(/px/web_icons/pc-anschluss_45.jpg) no-repeat scroll 0% 95%;
}

#seminar-gross{
 background:#fff url(/px/web_icons/pc-anschluss_65.jpg) no-repeat scroll 0% 95%;
}

#datenschutzbeauftragter{
 background:#fff url(/px/web_icons/luefter_45.jpg) no-repeat scroll 0% 95%;
}

#datenschutzbeauftragter-gross{
 background:#fff url(/px/web_icons/luefter_65.jpg) no-repeat scroll 0% 95%;
}

#signatur{
 background:#fff url(/px/web_icons/schloss_45.jpg) no-repeat scroll 0% 95%;
}
#signatur-gross{
 background:#fff url(/px/web_icons/schloss_65.jpg) no-repeat scroll 0% 95%;
}

#sicherheitsbeauftragter{
 background:#fff url(/px/web_icons/platine1_45.jpg) no-repeat scroll 0% 95%;
}
#sicherheitsbeauftragter-gross{
 background:#fff url(/px/web_icons/platine1_65.jpg) no-repeat scroll 0% 95%;
}

address{
  font-style: normal;
  font-size:1em;
  line-height: 125%;
  margin: 1em 0;
}


.pdflink{
 display: block;
 background:transparent url(/px/icon-pdf.gif) no-repeat scroll 0% 0%;
 padding:12px 0 2px 40px;
 line-height:1.6em;
 font-weight: bold;
}
a.pdflink:hover, a:hover.pdflink{
  font-weight: bold;
  color: Black;
}

.pdfmini{
/*  display: block; */
 background:transparent url(/px/icon2-pdf.gif) no-repeat scroll 0% 0%;
 padding:0 0 0 10px;
/* line-height:1.6em; */
 font-weight: bold;
}
a.pdfmini:hover, a:hover.pdfmini{
  font-weight: bold;
  color: Black;
}

.extlink{
 /* display: block; */
 background:transparent url(/px/extlink.gif) no-repeat scroll 0% 0%;
 padding:0 0 0 10px;
 /*line-height:1.6em; */
 font-weight: bold;
}
a.extlink:hover, a:hover.extlink{
  font-weight: bold;
  color: Black;
}

/* Über uns, zweispaltige Tabellenansicht mit zentriertem Bild */


 .layout2col, .mitarbeiter{
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
  border-style: none;
  width:85%;
  table-layout: fixed;
 }

.layout2col{
  clear: both;

}

 table.mitarbeiter td
 {
  vertical-align: top;
  background-color: #eaeaea;
}


table.layout2col .left
{
  background-color: #eaeaea;
  padding-left:120px;
  color: #17528e;
}

table.layout2col .right,
table.mitarbeiter .right
{
  width:300px;
  background-color: #fff;
}


table.layout2col td p,
table.mitarbeiter td p,
table.layout2col td address,
table.mitarbeiter td address{
  margin:10px;
}


table.mitarbeiter td.image{
    width:110px;
    padding-left:20px;
}

td.bottom{
  vertical-align: bottom!important;
}

td.borderbottom{
border-bottom: 1px solid #17528e;
}

.toplink{
 padding: 0;
  border-bottom: 1px solid #17528e;
  text-align:right;

}
.td-toplink{
 padding: 0!important;
  border-bottom: 1px solid #17528e;
  text-align:right;
  background-color: #fff!important;
  border-right:180px solid #fff;
  width:400px;
  wid\th:240px;
}
html>body .td-toplink{
width:auto
}

td.-center-img{
  padding:0!important;
  background-color:#eaeaea;
}

/* Grosses Bild auf der "über Uns"-Seite */
img.center2col{
position:relative;
left:120px;
}

p.logo{
  margin: 1em 0 !important;
}

/* Teaser auf der Einstiegseite. zwiespaltige Darstellung wird durch Linksfluss und Prozentuale Breiten erzeugt  */
.einstieg-teaser{
  float: left;
  padding: 12px 30px 12px 0;
}

.einstieg-teaser { width:200px }
/* commented backslash hack v2, IE5Mac ignoriert die folgende Regel  \*/
.einstieg-teaser {
  width:48%;
  w\idth:43%;
}
/* end hack, zur Sicherheit noch ien leere Regel hinterher */

.einstieg-teaser {  }

/* Blaue Kästen auf der Referenzen-Seite */

html>body .bluebox{
  width:42%;
  margin-top: 20px;
}

.bluebox{
  float: left;
  width:46%;
  padding: 8px;
  height: 120px;
  border: 1px solid #17528e;
  margin: 0 20px 18px 0;
  wid\th:42%;
}

.bluebox2{
  float: left;
  width:46%;
  padding: 8px;
  height: 100px;
  border: 1px solid #17528e;
  margin: 0 20px 18px 0;
  wid\th:42%;
}

html>body .bluebox{
  width:42%;
  margin-top: 20px;
}

.boxlogo{
  height:100px;
  text-align: center;
}
.boxlogo img{
  margin-top: auto;
  vertical-align: middle;
  text-align: center;

}

.breakall{
  margin: 0;
  padding: 0;
  font-size:1px;
  height:1px;
  overflow:hidden;
  line-height: 1px;
  clear:both;

}
li a.sub2 { /* Subnavigation eingerückt */
background:/*  #eaeaea */ url(/px/dot-orange.gif) no-repeat 0  0.4em;
 display:block;
 /* die fond-weight von dsn und padding-top auskommentiert*/
 font-weight: small;
 padding-left:10px;
 /* padding-top:10px; */
}
li a.sub3 { /* Subnavigation eingerückt */
background:/*  #eaeaea */  url(/px/dot-orange2.gif) no-repeat 0  0.4em;
 display:block;
 /* die fond-weight von dsn und padding-top auskommentiert*/
 font-weight: normal;
 padding-left:20px;
 /* padding-top:10px; */
}
td.start{
  color: #FFFFFF;
  }