@import url(reset.css);

/*******************
*
* globale Selektoren
*
********************/

html {
  height: 100.1%;
  font-size: 16px;
}

body {
  font-size: 0.75em;
  font-family: arial, "DejaVu Sans", verdana, sans-serif;
  color: #000000;
  background-color: #FFFFFF;
  line-height: 160%
}

h2, h3, h4, h5, h6 {
  color: #000000;
  line-height: 130%;
  font-weight: normal
}

h2 {
  font-size: 1.5em;
  margin: 0 0 1em 0;
	color: #A0C20B
}

h3 {
  font-size: 1.167em;
  margin: 0 0 0.5em 0;
	color: #A0C20B;
	font-weight: bold
}

h4 {
  margin: 0 0 0.5em 0;
	color: #A0C20B;
	font-weight: bold
}

p {
  margin: 0 0 1em 0
}

a, a:hover {
  text-decoration: none
}

strong {
  font-weight: bold
}

blockquote {
  font-style: italic
}

sup {
  font-size: 0.917em;
  line-height: 100%;
  vertical-align: top
}

small {
  font-size: 0.917em;
  line-height: 130%
}

.clear {
	display: block;
	clear: both;
	height: 0;
	width: 0;
	visibility: hidden
}

label,
input[type=button], input[type=submit], input[type=reset], input[type=image],
button {
  cursor: pointer;
}

input[type=hidden] {
  display: none;
}

/*******
*
* Bloecke
*
********/

#accessibility {
  display: none;
  height: 0;
  text-indent: -3000em
}

#badge {
	position: absolute;
	top: 300px;
	left: 0;
	width: 15px;
	height: 150px;
	background: #DF031C url(../images/badge.gif) no-repeat 0 0;
	text-indent: -3000em
}

#container {
	position: relative;
  width: 1010px;
  background: #FFFFFF url(../images/bg_main.gif) repeat-y 0 0;
  color: inherit;
  margin: 0 auto
}

#container:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden
}

#head {
  position: relative;
  height: 182px;
	width: 970px;
	margin-left: 15px;
	background: #FFFFFF url(../images/bg_header.jpg) no-repeat 0 0
}

#content {
  display: inline;
  float: left;
	margin-top: 50px;
  width: 670px
}

#nav {
  display: inline;
  float: left;
  width: 180px;
	margin: 15px 30px 0 30px;
	background: #FFFFFF /*url(../images/4.png) repeat-x 0 0*/
}

#foot {
  position: relative;
  clear: both;
  height: 30px;
  background: transparent url(../images/bg_bottom.gif) no-repeat 0 0
}

/*************
*
* Bereich oben
*
**************/

h1 {
  padding: 24px 0 0 0
}

h1 a {
  display: block;
  height: 110px;
  width: 470px;
  line-height: 0;
  text-indent: -3000em

}

#meta {
	position: absolute;
	top: 153px;
	right: -3px;
	color: #FFFFFF;
	font-size: 0.917em
}

#meta a {
	margin: 0 0.66em
}

#meta a,
#meta a:hover {
	color: #FFFFFF
}

/***************
*
* Inhaltsbereich
*
****************/

#warentest {
	text-align: center
}

#content #warentest a, #content #warentest a:hover, #content #warentest img {
	border: none
}

#content #warentest img {
	margin: 0 2em
}

#content a {
  border-bottom: 1px solid #000000;
  color: #000000;
	font-weight: bold
}

#content a:hover,
#content a:focus {
  border-bottom: 1px dashed #000000;
  color: #000000;
}

#content a:active {
  position: relative;
  top: 1px
}

#content a:visited {
	color: #000000;
	border-color: #000000;
	font-weight: normal
}

#content ol {
  margin: 0 0 1em 2.067em;
  list-style-type: decimal
}

#content ul {
  margin: 0 0 1em 1.667em;
  list-style: disc
}

#content li {
  padding-bottom: 0.5em
}

#content .small {
  font-size: 0.917em;
  line-height: 130%
}

#content .left,
#content .right {
  width: 50%;
  text-align: center
}

#content .left {
  float: left
}

#content .right {
  float: right
}

#content img.bildRechts {
  padding: 0 0 1em 1em;
  float: right
}

#content sup a {
  vertical-align: top;
  border: none
}

table {
  width: 100%;
  margin: 0 0 1em 0;
	border-top: 1px solid #000000;
	border-left: 1px solid #000000
}

table th,
table td {
  padding: 3px 5px;
	border-bottom: 1px solid #000000;
	border-right: 1px solid #000000;
	font-size: 0.917em;
  line-height: 130%
}

table th {
  font-weight: bold
}

#content #address {
	display: block;
	padding-top: 1em;
	font-weight: bold
}

/* Glossar/Fachbegriffe */

.glossar {
	margin: 0;
	list-style: none;
	text-align: center
}

.glossar li {
	margin: 0 1em 0 0;
	display: inline
}

.glossar li a, #content .glossar li a:visited {
	font-size: 1.167em;
	font-weight: bold
}

h3.glossar-cat {
	margin: 1em 0;
	background: #A0C20B;
	color: #FFFFFF;
	text-align: center
}

/* Tabelle KIG-Einstufung */

#kig-stufen .head td, #kig-stufen .befund td {
	font-size: 1.091em;
	font-weight: bold;
	text-align: center
}

#kig-stufen td {
	background: #A0C20B;
	color: #FFFFFF
}

#kig-stufen td.not {
	background: #DF031C
}

#kig-stufen .befund td {
	background: #FFFFFF;
	color: #000000
}

/* Vergleichstabelle */

#shownav {
	display: block;
	margin: 15px 0 0 15px;
	height: 24px;
	width: 180px;
	background: #DF031C;
	color: #FFFFFF;
	font-weight: bold;
	line-height: 24px;
	text-align: center;
	cursor: pointer
}

#tarifvergleich table .info {
	padding: 0;
	line-height: 110%;
	font-weight: normal;
	font-size: 9px
}

#tarifvergleich #content {
	display: block;
	float: none;
	clear: both;
	margin-left: 45px;
	width: 900px
}

#tarifvergleich #nav {
	display: none;
	position: absolute;
	z-index: 100;
	margin: 0 0 0 15px;
	border: 15px solid #FFFFFF
}

#tarifvergleich .tarifvergleich {
	position: relative;
	line-height: 100%;
	padding: 0
}

#tarifvergleich .tarifvergleich span {
	position: absolute;
	left: 84px;
	bottom: 2px;
	display: block;
	width: 164px;
	height: 69px
}

#tarifvergleich .tarifvergleich span a {
	display: block;
	height: 22px;
	text-indent: -3000em;
	background: transparent url(../images/haslayout.gif)
}
#tarifvergleich .tarifvergleich span a,
#tarifvergleich .tarifvergleich span a:hover {
	outline: none;
	border: none;
	text-decoration: none
}

#tarifvergleich .dent-max span {
	height: 80px;
	bottom: 3px
}

#tarifvergleich .dent-max span a {
	height: 26px
}

#tarifvergleich .tarifvergleich .angebote {
	bottom: 5px;
	left: 3px;
	width: 81px;
	height: 66px
}

#tarifvergleich .tarifvergleich .angebote a {
	height: 66px
}

/* CSS-Tabelle */

#css th {
	background: #A0C20B
}

#css .beitrag th, #css .beitrag td {
	font-size: 1.091em;
	font-weight: bold;
	background: #DF031C;
	color: #FFFFFF
}

#css .beitrag td {
	text-align: center
}

#css .antragdown td, #css .antraganford td {
	text-align: center;
	background: #A0C20B;
	color: #FFFFFF
}

#css .antragdown td a, #css .antraganford td a,
#css .antragdown td a:hover, #css .antraganford td a:hover {
	border: none;
	text-decoration: none
}

/* Sitemap-Liste */

#content ul#sitemap li {
  padding: 0.2em 0
}

#content ul#sitemap li ul {
  margin-bottom: 0
}

/* Downloadformular */

#yab_cd_download, #yab_dl_antraege {
	margin-bottom: 1em;
	clear: both
}

#yab_cd_download select, #yab_dl_antraege select {
  margin: 2px 5px;
  padding: 2px;
  border: 1px solid #000000
}

#yab_cd_download .yab_cd_checkbox label,
#yab_dl_antraege .yab_cd_checkbox label {
  padding: 2px 1em 2px 0.5em
}

#yab_cd_download input.yab_cd_submit,
#yab_dl_antraege input.yab_cd_submit {
	width: 135px;
  padding: 2px;
  background: #A0C20B;
  color: #FFFFFF;
	font-weight: bold;
  border: 3px double #FFFFFF
}

#yab_dl_antraege .yab_cd_select {
	width: 300px;
	float: left
}

#yab_dl_antraege input.yab_cd_submit {
	width: auto;
	float: left
}

#yab_cd_download input.yab_cd_submit:focus,
#yab_cd_download input.yab_cd_submit:hover,
#yab_dl_antraege input.yab_cd_submit:focus,
#yab_dl_antraege input.yab_cd_submit:hover {
  background: #FFFFFF;
  color: #000000;
  border: 3px double #A0C20B
}

#content p.notice {
  padding: 1em 0.5em;
  border: 2px dashed #DF031C;
  text-align: center;
  font-weight: bold
}

/*****************
*
* Kontaktformulare
*
******************/

.zemContactForm {
  margin: 0 0 2em 0
}

.zemContactForm fieldset {
  margin: 0 0 1em 0;
  padding: 1em 0.5em;
  border: 1px solid #A0C20B
}

.zemContactForm legend {
  padding: 0 0.5em;
  font-size: 1.5em;
	color: #A0C20B
}

.zemContactForm input {
  display: none
}

.zemContactForm p {
  clear: both;
  padding: 0;
  margin: 0;
  line-height: 100%
}

.zemContactForm p:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden
}

.zemContactForm label {
  width: 13em;
  float:  left;
  margin: 2px 5px 2px 0;
  padding: 2px;
  text-align: right;
  line-height: 130%
}

.zemContactForm label.zemRequired,
.zemContactForm label.zemRequirederrorElement {
  font-weight: bold
}

.zemContactForm p input {
  display: block;
  float: left;
  width: 30em;
  margin: 2px 5px;
  padding: 2px;
  border: 1px solid #000000
}

.zemContactForm p select {
  display: block;
  float: left;
  width: auto;
  margin: 2px 5px;
  padding: 2px;
  border: 1px solid #000000
}

.zemContactForm select.zemRequirederrorElement,
.zemContactForm input.zemRequirederrorElement,
.zemContactForm textarea.zemRequirederrorElement {
  background: #DF031C;
  color: #FFFFFF
}

.zemContactForm input:focus {
  border: 1px solid #A0C20B;
  background: #FFFFFF;
  color: #000000
}

.zemContactForm textarea {
  float: left;
  width: 30em;
  height: 12em;
  margin: 2px 5px;
  padding: 2px;
  border: 1px solid #000000
}

.zemContactForm textarea:focus {
  border: 1px solid #A0C20B
}

.zemContactForm input.zemSubmit {
  clear: left;
  float: none;
  width: auto;
  margin: 0 auto;
	padding: 0.5em 1em;
  background: #A0C20B;
  color: #FFFFFF;
  border: 3px double #FFFFFF;
	font-size: 1.167em;
	font-weight: bold
}

.zemContactForm input.zemSubmit:focus,
.zemContactForm input.zemSubmit:hover {
  background: #FFFFFF;
  color: #000000;
  border: 3px double #A0C20B
}

#content .zemContactForm .zemError {
  margin-left: 0;
  padding: 1em 2em;
  border: 2px dashed #DF031C
}

.zemContactForm .small {
  padding: 0.2em 0 0 18.5em;
  font-size: 0.87em
}

.zemContactForm .radio span.input {
  display: block;
  float: left;
  width: 25em;
  margin: 2px 5px 2px 11em;
  padding: 2px
}

.zemContactForm .radio {
	text-align: center
}

.zemContactForm .radio label.zemRadio,
.zemContactForm .radio input.zemRadio {
  margin: 0;
  padding: 0;
  float: none;
  width: auto;
  display: inline;
  border: none
}

.zemContactForm .radio label.zemRadio {
  margin: 0 1em 0 0;
}

#kontakt .text {
	line-height: 160%
}

#kontakt .select {
	padding: 0.5em;
	text-align: center
}

#kontakt .select label {
	float: none;
	text-align: left
}

#kontakt .select select, #kontakt .select input {
	float: none;
	margin: 0.5em auto
}

#kontakt .checkbox input {
	width: 2.5em;
	border: none
}

#kontakt .checkbox label {
	width: 600px;
	text-align: left
}

#kontakt .flyer label {
	float: right;
	width: 600px;
	text-align: left
}

#kontakt .flyer input {
	width: 2em
}

/**************
*
* Bereich links
*
***************/

#nav .rot,
#nav .blau {
	display: block;
	padding: 7px;
	color: #FFFFFF;
	line-height: 130%
}

#nav .blau {
	margin: 3px 0;
	background: #A0C20B;
	font-weight: bold
}

#nav .rot {
	background: #DF031C;
	font-weight: bold
}

#nav a.blau:hover {
	color: #DF031C
}

#nav {
  list-style: none
}

#nav ul {
 margin: 15px 0
}

#nav ul li {
  margin-bottom: 3px;
  height: 1%
}

#nav ul a {
  display: block;
  padding: 10px;
  background: #A0C20B;
  color: #FFFFFF;
	font-weight: bold;
  line-height: 130%
}

#nav ul a:hover,
#nav ul li.active a {
	font-weight: bold;
	color: #DF031C
}

/**************
*
* Bereich unten
*
***************/

#afterFooter {
	width: 970px;
	margin: 0 auto;
	color: #ADADAD;
	font-size: 0.9em
}

#afterFooter a,
#afterFooter a:hover,
#afterFooter a:visited {
	color: #ADADAD
}

/* Tariftabelle */

#tarifvergleich table {
	border: 2px solid #000000
}

#tarifvergleich .empty td {
	border: none;
	border-bottom: 2px solid #000000
}

#tarifvergleich th {
	background: #FFFFFF
}

#tarifvergleich th,
#tarifvergleich .bottom td {
	border-bottom: 2px solid #000000
}

#tarifvergleich  td {
	line-height: 110%;
}

#tarifvergleich th,
#tarifvergleich td {
	text-align: center;
	vertical-align: middle;
}

#tarifvergleich .top td {
 font-weight: bold
}

#tarifvergleich .bottom td {
 background: #FFFFFF
}

#tarifvergleich .green {
	background: #0CFF00
}

#tarifvergleich .red {
	background: #FF0000
}

#tarifvergleich .tarifname,
#tarifvergleich .kfo,
#tarifvergleich .blue {
	background: #CCFEFE
}

#tarifvergleich .grenzen {
	width: 300px
}

#tarifvergleich .beitrag {
	background: #FF9800
}

#tarifvergleich .praemie {
	font-size: 1.091em
}

#tarifvergleich .kfo {
	width: 60px
}

#tarifvergleich .antrag {
	padding: 0
}

#tarifvergleich .antrag a {
	display: block;
	line-height: 100%;
	padding: 3px 0
}

#tarifvergleich .antrag a:hover {
	border-bottom: 1px solid #000000;
	top: 0px
}

#tarifvergleich .antrag a.anfordern {
	background: #FFFF01
}

#tarifvergleich .antrag a.ausdrucken {
	background: #99CC04
}

#tarifvergleich .antrag a.avb {
	background: #00FFFF
}
#tarifvergleich .antrag a.muster {
	border: none
}

#tarifvergleich .maxi {
	padding: 0;
	background: #0CFF00
}

#tarifvergleich .maxi span {
	display: block;
	border-bottom: 1px solid #000000;
	padding: 4px 0;
	background: transparent url(../images/red.png) no-repeat 500px 500px
}

#tarifvergleich table small {
	font-size: 0.8em;
	line-height: 90%
}

/* Anpassung Einzel-Zellen */

#tarifvergleich .css-basis .maxi span {
	padding: 5px 0
}

#tarifvergleich .rv-ze30 .maxi span {
	padding: 34px 0;
	background-position: 180px 0
}

#tarifvergleich .sdk-privattop .maxi span {
	padding: 11px 0;
}

#tarifvergleich .sdk-privattop .maxi span.bis6 {
	background-position: 90px 0
}

#tarifvergleich .sdk-privattop .maxi span.bis9 {
	background-position: 60px 0
}

#tarifvergleich .sdk-privattop .maxi span.ab10 {
	background-position: 30px 0
}

#tarifvergleich .universa-dentpriv .maxi span {
	background-position: 45px 0
}

#tarifvergleich .janitos-ja .maxi span.j1 {
	background-position: 30px 0
}

#tarifvergleich .janitos-ja .maxi span.j2 {
	background-position: 60px 0
}

#tarifvergleich .janitos-ja .maxi span.j3 {
	background-position: 90px 0
}

#tarifvergleich .janitos-ja .maxi span.j4 {
	background-position: 120px 0
}

#tarifvergleich .arag-90b .maxi span.j1 {
	background-position: 40px 0
}

#tarifvergleich .arag-90b .maxi span.j2 {
	background-position: 80px 0
}

#tarifvergleich .arag-90b .maxi span.j3 {
	background-position: 120px 0
}

#tarifvergleich .arag-90b .maxi span.j4 {
	background-position: 160px 0
}

#tarifvergleich .arag-100 .maxi span.j1 {
	background-position: 30px 0
}

#tarifvergleich .arag-100 .maxi span.j2 {
	background-position: 60px 0
}

#tarifvergleich .mv-dentcare .maxi span.j1,
#tarifvergleich .mv-dentcare .maxi span.j2 {
	background-position: 30px 0
}

#tarifvergleich .mv-dentcare .maxi span.j3 {
	background-position: 60px 0
}

#tarifvergleich .mv-dentcare .maxi span.j4,
#tarifvergleich .mv-dentcare .maxi span.j5 {
	background-position: 200px 0
}

#tarifvergleich .signal-dentmax .maxi span {
	background-position: 30px 0
}

#tarifvergleich .signal-komfort .maxi span {
	background-position: 100px 0
}

#tarifvergleich .arag-70 .maxi span.j1 {
	background-position: 30px 0
}

#tarifvergleich .arag-70 .maxi span.j2 {
	background-position: 60px 0
}

#tarifvergleich .signal-dentfest .maxi span {
	background-position: 100px 0
}

#tarifvergleich .arag-50 .maxi span.j1 {
	background-position: 30px 0
}

#tarifvergleich .arag-50 .maxi span.j2 {
	background-position: 60px 0
}

/*Logos*/

#tarifvergleich .bottom .logo {
	background: transparent url(../images/logos.png) no-repeat 0 -10px
}

#tarifvergleich .bottom.rv-ze30 .logo {
	background-position: -83px -10px
}

#tarifvergleich .bottom.sdk-privattop .logo {
	background-position: -162px -10px
}

#tarifvergleich .bottom.universa-dentpriv .logo {
	background-position: -240px -10px
}

#tarifvergleich .bottom.ukv-premium .logo {
	background-position: -322px -10px
}

#tarifvergleich .bottom.arag-100 .logo,
#tarifvergleich .bottom.arag-90b .logo,
#tarifvergleich .bottom.arag-70 .logo,
#tarifvergleich .bottom.arag-50 .logo {
	background-position: -400px -10px
}

#tarifvergleich .bottom.mv-dentcare .logo {
	background-position: -480px -10px
}

#tarifvergleich .bottom.signal-dentmax .logo,
#tarifvergleich .bottom.signal-komfort .logo,
#tarifvergleich .bottom.signal-dentfest .logo {
	background-position: -560px -5px
}

#tarifvergleich .bottom.janitos-ja .logo {
	background-position: -640px -10px
}