@charset "utf-8";
/*
Bankamız

URI: http://www.bankamiz.de
Description: Bankamız, first step
Version: 1.4
Author: SinnerSchrader GmbH Frankfurt, Jens Grochtdreis

    Inhaltsverzeichnis:

    0. ...... Basis
    1. ...... Struktur
	2. ...... Die Metanavigation
	3. ...... Der Footer
	3. ...... Horizontales Menue
	3.1 ..... Dropdown-Funktionalitaet
	3.2 ..... Design
	3.3 ..... Highlighting
	4. ...... Header
	5. ...... Contenarea
	5.1 ..... Jetzt informieren - Link
	5.2 ..... Toolboxes	in General
	5.3 ..... Newsletter
	5.4 ..... E-Mail
	5.5 ..... Teasercontainer
	5.6 ..... Teasercontainer min-height
	5.7 ..... broad Content
	6. ...... Imagemap
	6.1 ..... Hinweis bei der Imagemap
	7. ...... Breiter Teaser
	8. ...... Fussnote
*/



/* ========= 0. Basis ============== */
body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 62.5%;
  background-color: #fff;
  color: #505050;
  }
* {
  margin: 0px;
  padding: 0px;
  font-size: 1em;
  }
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  }
a {
  color: #505050;
  }
img, a img {
  border:none;
  }
.klaerchen {
  clear: both;
  line-height: 0px;
  font-size: 1px;
  height: 0px;
  }

/* ====== 1. Struktur ====== */

#metanavi, #header, #inhalt, #footer {
 float: left;
 display: inline;
 width: 980px;
 margin-bottom: 10px;
}
#header {
	margin-bottom: 30px;
	}
#metanavi {
 margin-top: 10px;
}
#footer {
 margin-bottom: 20px;
}


/* ====== 2. Die Metanavigation ========= */
.efainitialisierung {
   float: right;
   display: inline;
   width: 15%;
   text-align: right;
   margin: 0;
   padding: 0;
   }
.efainitialisierung * {
 line-height: 16px;
  vertical-align: middle;
  }
#metanavi #metalinks {
   float: left;
   display: inline;
   width: 100%;
  }
#metalinks p {
 padding: 0px;
 background-color: transparent;
 font-size: 1em;
 margin-left: 12px; /* Keine 15px, weil den Links horizontales Padding zugewiesen ist. */
}
#metalinks p a {
  padding: 0 3px;
}
#metalinks p a:hover {
   text-decoration: none;
}


/* ================ 3. Der Footer  ================== */
#footer p {
 font-size: 1em;
 margin: 10px 10px 10px 15px;
}
#statistiken {
 padding-top: 10px;
}
/*  === Schriften für Formulartypen zuweisen */
* select, #suchbegriff  {
  font-size: 1.1em;
  line-height: 1.4em;
  margin-top: 5px;
  }
#wertpapiersuche input.eingabefeld  {
  font-size: 0.9em;
  line-height: 1.4em;
  }

* select {
  font-size: 1em;
  }


/* ======  3. Horizontales Menue ====== */

#dropdownmenue {
 float: left;
 display: inline;
 width: 980px;
 background-color: #039;
}
/* ====== 3.1 Dropdown-Funktionalitaet ====== */

ul#nav {
  list-style: none;
  margin: 0 0 0 10px;
  line-height: 32px;
}

ul#nav ul {
  list-style: none;
	display:none;
	position:absolute;
	z-index:99;
   line-height: 14px;
   margin-left: 20px;
}

ul#nav li {
   float:left;
   padding: 1px 0px; /* hilft Opera mit :hover - nicht beseitigen! */
}

ul#nav li li {
    float:none;
    position: relative;
}

ul#nav a {
    display:block;
}

ul#nav li:hover ul ul, ul#nav li:hover ul ul ul, ul#nav li:hover ul ul ul ul {
    display:none;
}

ul#nav li:hover ul, ul#nav ul li:hover ul, ul#nav ul ul li:hover ul {
    display:block;
}

/* ====== 3.2 Design ====== */

ul#nav li {
  margin: 0;
  }

ul#nav a {
    background-color: transparent;
    color: #87A7CE;
    padding: 0 20px;
    text-decoration:none;
    margin: 0;
    text-align: center;
    }

ul#nav a:hover, ul#nav a:active {
    background-color: transparent;
    color:#87a8d9;
  }

ul#nav ul a, ul#nav ul ul a {
  border: 0;
  text-align: left;
  }

ul#nav ul {
    background-color: #039;
  }

ul#nav ul a {
    background-color:#039;
    color:#fff;
    text-decoration:none;
  }
ul#nav ul a:hover {
    background-color:#039;
    color: #87a8d9;
}

ul#nav ul li {
    background-color:#039;
}


ul#nav {
  font-size: 1.1em;
  font-weight: bold;
  }
ul#nav ul, ul#nav ul ul  {
  font-size: 1.0em;
  font-weight: bold;
  }

/* ====== 3.3 Highlighting ====== */
body.home li.home a, body.leistungsversprechen li.leistungsversprechen a, body.angebote li.angebote a, body.standorte li.standorte a, body.karriere li.karriere a  { color: #fff !important;}

/* ====== 4. Der Header ====== */

#logofragment {
 float: left;
 display: inline;
 width: 90px;
 margin-left: 106px;
 }

#topbalken {
 float: right;
 width: 770px;
 height: 18px;
 background-color: #d3dced;
 }
#headteaser {
 float: left;
 width: 600px;
}
#kundenlogin {
 float: left;
 width: 380px;
}

#kundenlogin #logocontainer {
 float: left;
 width: 380px;
 height: 90px;
 background: #d1dded url(../bilder/logo_php_relaunch2005.gif) no-repeat center right;
}

h1 {
  height: 20px;
  width: 170px;
  margin: 35px 0 10px 15px;
  text-indent: -9000px;
  background: #fff url(../bilder/logo_bankamiz.gif) no-repeat top left;
}

p.intro {
  color: #505050;
  margin-bottom: 10px;
  margin-left: 15px;
  font-size: 1.1em;
  line-height: 1.4;
}

#sprache {
  text-align: right;
  float: right;
  display: inline;
  color: #505050;
  width: 380px;
  font-size: 1.1em;
  line-height: 18px;
}

#sprache span { vertical-align:top;}
.schmal h1 {
	float: left;
	width: 160px;
}
.schmal #sprache {
	width: 160px;
	margin-top: 40px;
	}
#tuerkisch { margin-left: 10px;}
/* ====== 5. Contentarea ====== */

#inhalt {
  width: 965px;
  margin-left: 15px;
}
#content {
  float: left;
  width: 575px;
  padding-bottom: 10px;
}
#funktionsboxen {
  float: right;
  width: 380px;
}

#content ul {
  list-style-type: square;
  font-size: 1.1em;
  margin-left: 8px;
  padding-left: 8px;
}
#content ul li {
  margin-bottom: 10px;
}
/* ====== 5.1 Jetzt informieren - Link ====== */

.informieren {
position: relative;
bottom: 0;
 text-align: left;
 font-size: 1.1em;
 padding-left: 15px;
 margin-top: 10px;
 background: url(../bilder/pfeil_informieren.gif) no-repeat center left;
}

.breiterTeaser .informieren  {
 margin-top: 10px;
}

/* ====== 5.2 Toolboxes in General ====== */

.funktionsbox {
  width: 380px;
  background-color: rgb(241,245,250);
  margin-bottom: 3px;
  padding-bottom: 15px;
}

.funktionsbox h3 {
  color: rgb(0,51,153);
  background-color: rgb(217,227,240);
  width: 380px;
  text-indent: 10px;
  height: 17px;
  line-height: 17px;
  font-size: 1.1em;
  font-weight: bold;
  margin-bottom: 10px;
}

.funktionsbox  p {
  font-size: 1.1em;
  color: #505050;
  margin-left: 10px;
}
.absenden {
  width: 18px;
}

/* ====== 5.3 Newsletter ====== */

.funktionsbox  form#infoservice {
  margin: 0 0 0 10px;
  width: 360px;
  text-align: right;
  height: 18px;
}
.funktionsbox  form#infoservice input#emailadresse  {
  margin-right: 5px;
  width: 132px;
  height: 16px;
  border: 1px solid rgb(127,157,185);
  line-height: 1.4em;
  font-size: 1em !important;
  position: relative;
  padding-top: 1px;
  padding-left: 3px;
/*  margin-top: -3px;*/
  }

/* =================
Ohne das hängt der Button höher, als das Inputfeld.
Leider sind sich IE und Mozilla nicht über den Wert einig.
====================*/
  form#infoservice .absenden {
  margin-bottom: -6px;
  }

/* ====== 5.4 E-Mail ====== */

  #emailbutton {
  width: 360px;
  text-align: right;
  }

/* ====== 5.5 Teasercontainer ====== */
.teasercontainer {
	float: left;
	width: 185px;
	display: inline;
	margin-left: 10px;
	position: relative;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	height:277px;
}

#teaserlinksaussen.teasercontainer { margin-left: 0px;height:277px;}

.teasercontainer h3 {
	font-size: 1.2em;
	color: #00308F;
	font-weight: bold;
	margin: 10px 0;
}

.teasercontainer p {
	line-height: 1.4;
}

.teasercontainer p.informieren {
	position: absolute;
	bottom: 0;
}

.teasercontainer p.fussnote {
	margin:5px 0;
}

.teasercontainer img {
	margin:0 auto;
	display:block;
}

/* ====== 5.6 Teasercontainer min-height ====== */
.teasercontainer {
	height: 277px;
    min-height: 277px;
    height: auto;
}
/*\*/
* html .teasercontainer {
    height: 277px;
}
/**/


/* ====== 5.7 broad Content ====== */

#content h2 {
	color: #039;
	font-size: 1.6em;
	font-weight: bold;
	margin-bottom: 20px;
}

#content h3 {
	color: #039;
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 5px;
}

#content p {
	color: #505050;
	font-size: 1.1em;
	margin-bottom: 5px;
	line-height: 1.4;
}

#content ul {
	margin: 10px 5px ;
}

/* ====== 5.8 Aktionsboxen ====== */

img.aktionsbox { line-height: 21px; vertical-align:text-bottom;}

/* ====== 5.9 zweispaltig ====== */

.spalte1 { float: left; width: 380px; }
.spalte2 { float: right; width: 185px;}

/* ====== 6. Imagemap ====== */

/* set the size of the definition list <dl> and add the background image */
#imap {
	display:block;
	width:330px;
	height:446px;
	background:url(../bilder/standorte_punkte.gif) no-repeat;
	position:relative;
	}

/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
	display:block;
	width:330px;
	height:0;
	padding-top:449px;
	overflow:hidden;
	position:absolute;
	left:0;
	top:0;
	cursor:default;
	}


/* the <dt><a> hover style to move the background image to position 0 0*/
#imap a#title:hover {background-position: 0 0; z-index:10;}

/* place the <dd>s in the correct absolute position */
#imap li {position:absolute; padding:0; margin:0; list-style-type: none;}
#imap li a span { display: none;}
#imap #gladbach {left:32px; top:224px; z-index:20;}
#imap #koeln_nippes {left:45px; top:234px; z-index:20;}
#imap #remscheid {left:62px; top:217px; z-index:20;}
#imap #koeln_muehlheim {left:53px; top:234px; z-index:20;}

#imap #berlin1 {left:260px; top:146px; z-index:20;}
#imap #berlin2 {left:273px; top:147px; z-index:20;}
#imap #berlin3 {left: 266px; top: 149px; z-index: 20;}
#imap #berlin4 {left:266px; top:141px; z-index:20;}

/*#imap #offenbach { left: 114px; top: 265px; z-index: 20;}
#imap #frankfurt {left: 104px; top: 264px; z-index: 20;}
#imap #wiesbaden {left: 95px; top: 265px; z-index: 20;}*/
#imap #muenchen {left: 209px; top: 395px; z-index: 20;}
#imap #ingolstadt {left: 203px; top: 364px; z-index: 20;}
#imap #nuernberg {left: 182px; top: 312px; z-index: 20;}
#imap #augsburg {left: 180px; top: 380px; z-index: 20;}

#imap #kiel {left: 152px; top: 49px; z-index: 20;}
#imap #luebeck {left: 170px; top: 73px; z-index: 20;}
#imap #ludwigsburg {left: 113px; top: 358px; z-index: 20;}
#imap #stuttgart {left: 117px; top: 369px; z-index: 20;}
#imap #duesseldorf {left: 51px; top: 217px; z-index: 20;}
#imap #stuttgart_feuerb {left: 107px; top: 368px; z-index: 20;}
#imap #kirchheim {left: 130px; top: 375px; z-index: 20;}
#imap #hannover {left: 146px; top: 156px; z-index: 20;}
#imap #kassel {left: 128px; top: 218px; z-index: 20;}
#imap #wiesloch {left: 100px; top: 329px; z-index: 20;}
#imap #bremen {left: 110px; top: 117px; z-index: 20;}
#imap #bielefeld {left: 105px; top: 172px; z-index: 20;}
#imap #sindelfingen {left: 102px; top: 379px; z-index: 20;}
#imap #leverkusen {left: 60px; top: 230px; z-index: 20;}

#imap #aachen {left: 8px; top: 240px; z-index: 20;}
#imap #bietigheim {left: 113px; top: 344px; z-index: 20;}
#imap #ludwigshafen {left: 90px; top: 318px; z-index: 20;}

#imap #duisburg {left: 49px; top: 211px; z-index: 20;}
#imap #oberhausen {left: 57px; top: 211px; z-index: 20;}
#imap #bochum {left: 64px; top: 210px; z-index: 20;}
#imap #dortmund {left: 72px; top: 209px; z-index: 20;}
#imap #hamm {left: 80px; top: 206px; z-index: 20;}
#imap #ahlen {left: 86px; top: 204px; z-index: 20;}

#imap #hamburg {left: 120px; top: 80px; z-index: 20;}
#imap #bw {left: 94px; top: 351px; z-index: 20;}
#imap #berlin {left:238px; top:130px; z-index:20;}
#imap #nrw {left:22px; top:193px; z-index:20;}
#imap #rhm {left:74px; top:252px; z-index:20;}
/* style the <dd><a> links physical size and the background image for the hover */
/* zum Debuggen einfach hier eine Hintergrundfarbe eingeben.  */

#imap a#gladbachlnk,
#imap a#koeln_nippeslnk,
#imap a#remscheidlnk,
#imap a#koeln_muehlheimlnk,
#imap a#berlin1lnk,
#imap a#berlin2lnk,
#imap a#berlin3lnk,
#imap a#frankfurtlnk,
#imap a#wiesbadenlnk,
#imap a#muenchenlnk,
#imap a#ingolstadtlnk,
#imap a#nuernberglnk,
#imap a#offenbachlnk,
#imap a#kiellnk,
#imap a#luebecklnk,
#imap a#krefeldlnk,
#imap a#duesseldorflnk,
#imap a#hannoverlnk,
#imap a#kassellnk,
#imap a#wieslochlnk,
#imap a#augsburglnk,
#imap a#bremenlnk,
#imap a#bielefeldlnk,
#imap a#stuttgart_feuerblnk,
#imap a#kirchheimlnk,
#imap a#sindelfingenlnk,
#imap a#leverkusenlnk,
#imap a#ludwigsburglnk,
#imap a#stuttgartlnk,
#imap #ahlenlnk,
#imap #berlin4lnk,
#imap #bochumlnk,
#imap #dortmundlnk,
#imap #duisburglnk,
#imap #hammlnk,
#imap #oberhausenlnk,
#imap #aachenlnk,
#imap #bietigheimlnk,
#imap #ludwigshafenlnk{
	display:block;
	width:7px;
	height:7px;
	background: url(../bilder/standorte_punkterrrr.jpg) no-repeat;
	text-decoration: none;
	z-index:20;
	}

#imap a#nrwlnk {
	display:block;
	width:92px;
	height:56px;
	text-decoration: none;
	z-index:20;
	}
#imap a#rhmlnk {
	display:block;
	width:71px;
	height:45px;
	text-decoration: none;
	z-index:20;
	}
#imap a#hamburglnk {
	display:block;
	width:71px;
	height:45px;
	text-decoration: none;
	z-index:20;
	}
#imap a#berlinlnk {
	display:block;
	width:73px;
	height:48px;
	text-decoration: none;
	z-index:20;
	}
#imap a#bwlnk {
	display:block;
	width:71px;
	height:47px;
	text-decoration: none;
	z-index:20;
	}

/* ====== 6.1 Hinweis bei der Imagemap ====== */

#hinweis {
	position: relative;
	float: left;
	width: 185px;
	top: 0;
	margin-left: 400px;

}

/* ====== 7. Breiter Teaser ====== */

.breiterTeaser {
	border-bottom: 1px solid #cecece;
	padding-bottom: 5px;
	margin-bottom: 20px;
	width: 575px;
	position: relative;
}

.breiterTeaser h2 {
	margin-bottom: 3px !important;
}

/* ====== 8. Fussnote ====== */
.fussnote {
	font-size: 0.9em !important;
	margin: 30px 0;
}

.boxDetails {border:1px solid #335cad;width:460px;color:#ffffff;background:url(../bilder/bg_boxdetails.gif) repeat-y;position:absolute;top:0;left:0;font-weight:normal;}
.boxDetails ul {margin:10px 10px 20px 0px !important;list-style-type:none;}
.boxDetails ul li {margin-right:10px;margin-bottom:0px !important;list-style-type:none;}
.boxDetails ul li a {font-size:11px;line-height:12px;padding:5px 0 3px 0;border-bottom:1px solid #d9e3f0;background:url(../bilder/roter_listenpunkt.gif) 6px 8px no-repeat;padding-left:18px;color:#003399 !important;width:192px;display:block;text-decoration:none;}
* html .boxDetails ul li a {margin-top:-1px;}
.boxDetails ul li a:hover {background:#335cad url(../bilder/weisser_listenpunkt.gif) 6px 8px no-repeat;color:#fff !important;}
.boxDetails ul li a.aktiv {background:#335cad url(../bilder/weisser_listenpunkt.gif) 6px 8px no-repeat;color:#fff !important;}