@charset "utf-8";

body {
   font:13px/22px Arial, Helvetica, sans-serif;
   color:#666c72;
   background:#fff url(../images/bg-body.jpg) 0 0 repeat-x;
}

html, body {
	height: 100%;}

br.clear {
   float:none;
   clear:both;
}

div#siteContainer {
   margin:0 auto -74px;
   width:860px;
   min-height: 100%;
   height: auto !important;
   height: 100%;
}

/* =header */

div#headerContainer {
   width:860px;
   height:145px;
   position:relative;
   background:#fff url(../images/bg-body.jpg) 0 0 repeat-x;
}

div#headerContainer h1#branding {
   width:300px;
   height:95px;
   display:block;
   position:absolute;
   top:0px;
   left:0px;
}

div#headerContainer h1#branding a,
div#headerContainer h1#branding a:visited {
   width:300px;
   height:95px;
   display:block;
   text-indent:-9000px;
   background:transparent url(../images/logo-jingle4you.jpg) 0 0 no-repeat;
}

div#headerContainer h1#branding a:hover,
div#headerContainer h1#branding a:active {
   background:transparent url(../images/logo-jingle4you.jpg) -300px 0 no-repeat;
}

ul#navigation {
   width:860px;
   height:50px;
   position:absolute;
   bottom:0px;
   left:0px;
   background:transparent url(../images/bg-navigation.jpg) 0 0 no-repeat;
}

ul#navigation li {
   height:50px;
   display:block;
   float:left;
}

ul#navigation li a {
   height:50px;
   display:block;
   float:left;
   text-indent:-9000px;
}

ul#navigation li a.news,
ul#navigation li a.news:visited {
   width:71px;
   background:transparent url(../images/bg-navigation.jpg) 0 0 no-repeat;
}

ul#navigation li a.news:hover,
ul#navigation li a.news:active,
ul#navigation li a.news-active {
   width:71px;
   background:transparent url(../images/bg-navigation.jpg) 0 -50px no-repeat !important;
}

ul#navigation li a.produkte,
ul#navigation li a.produkte:visited {
   width:96px;
   background:transparent url(../images/bg-navigation.jpg) -71px 0 no-repeat;
}

ul#navigation li a.produkte:hover,
ul#navigation li a.produkte:active,
ul#navigation li a.produkte-active {
   width:96px;
   background:transparent url(../images/bg-navigation.jpg) -71px -50px no-repeat;
}

ul#navigation li a.technik,
ul#navigation li a.technik:visited {
   width:86px;
   background:transparent url(../images/bg-navigation.jpg) -167px 0 no-repeat;
}

ul#navigation li a.technik:hover,
ul#navigation li a.technik:active,
ul#navigation li a.technik-active {
   width:86px;
   background:transparent url(../images/bg-navigation.jpg) -167px -50px no-repeat;
}

ul#navigation li a.demos,
ul#navigation li a.demos:visited {
   width:80px;
   background:transparent url(../images/bg-navigation.jpg) -253px 0 no-repeat;
}

ul#navigation li a.demos:hover,
ul#navigation li a.demos:active,
ul#navigation li a.demos-active {
   width:80px;
   background:transparent url(../images/bg-navigation.jpg) -253px -50px no-repeat;
}

ul#navigation li a.stimmen,
ul#navigation li a.stimmen:visited {
   width:95px;
   background:transparent url(../images/bg-navigation.jpg) -333px 0 no-repeat;
}

ul#navigation li a.stimmen:hover,
ul#navigation li a.stimmen:active,
ul#navigation li a.stimmen-active {
   width:95px;
   background:transparent url(../images/bg-navigation.jpg) -333px -50px no-repeat;
}

ul#navigation li a.preise,
ul#navigation li a.preise:visited {
   width:74px;
   background:transparent url(../images/bg-navigation.jpg) -428px 0 no-repeat;
}

ul#navigation li a.preise:hover,
ul#navigation li a.preise:active,
ul#navigation li a.preise-active {
   width:74px;
   background:transparent url(../images/bg-navigation.jpg) -428px -50px no-repeat;
}

ul#navigation li a.bestellen,
ul#navigation li a.bestellen:visited {
   width:98px;
   background:transparent url(../images/bg-navigation.jpg) -502px 0 no-repeat;
}

ul#navigation li a.bestellen:hover,
ul#navigation li a.bestellen:active,
ul#navigation li a.bestellen-active {
   width:98px;
   background:transparent url(../images/bg-navigation.jpg) -502px -50px no-repeat;
}

ul#navigation li a.kontakt,
ul#navigation li a.kontakt:visited {
   width:86px;
   background:transparent url(../images/bg-navigation.jpg) -600px 0 no-repeat;
}

ul#navigation li a.kontakt:hover,
ul#navigation li a.kontakt:active,
ul#navigation li a.kontakt-active {
   width:86px;
   background:transparent url(../images/bg-navigation.jpg) -600px -50px no-repeat;
}

ul#navigation li a.faq,
ul#navigation li a.faq:visited {
   width:61px;
   background:transparent url(../images/bg-navigation.jpg) -686px 0 no-repeat;
}

ul#navigation li a.faq:hover,
ul#navigation li a.faq:active,
ul#navigation li a.faq-active {
   width:61px;
   background:transparent url(../images/bg-navigation.jpg) -686px -50px no-repeat;
}

ul#navigation li a.impressum,
ul#navigation li a.impressum:visited {
   width:113px;
   background:transparent url(../images/bg-navigation.jpg) -747px 0 no-repeat;
}

ul#navigation li a.impressum:hover,
ul#navigation li a.impressum:active,
ul#navigation li a.impressum-active {
   width:113px;
   background:transparent url(../images/bg-navigation.jpg) -747px -50px no-repeat;
}

/* =login */

div#loginContainer {
   margin:0 0 0 350px;
   width:500px;
   position:relative;
}

div#login {
   width:550px;
   height:48px;
   color:#fff;
   background:#007dba;
}

div#login form {
   padding:8px 0 0 0;
   width:550px;
   height:30px;
   display:block;
   font-size:12px;
}

div#login form label {
   margin:0;
   padding:0 5px 0 0;
   width:57px;
   text-align:right;
   float:left;
}

div#login form input {
   margin:0 10px 10px 0;
   padding:2px 5px 2px 5px;
   width:125px;
   height:18px;
   display:block;
   border:1px solid #00a5e8;
   background:#00457a url(../images/bg-login-input.jpg) 0 0 repeat-x;
   float:left;
   color:#fff;
}

div#login form input#mwb_benutzer_login_submit {
   margin:0 0 10px 0;
   padding:0px 5px 4px 5px;
   display:block;
   width:60px;
   height:24px;
   display:block;
   border:1px solid #bbe9ff;
   background:#56baeb url(../images/bg-login-submit.jpg) 0 0 repeat-x;
   float:left;
   color:#00599d;
   font-weight:bold;
   font-size:12px;
   cursor:pointer;
}

div#login form input#mwb_benutzer_login_submit:hover {
   background:#9bdeff;
}

div#loginContainer a.toggle-kundenlogin,
div#loginContainer a.toggle-kundenlogin:visited {
   width:110px;
   height:30px;
   position:absolute;
   bottom:-30px;
   right:-4px;
   z-index:100;
   background:url(../images/toggle-kundenlogin.jpg) 0 0 no-repeat;
   text-align:center;
   font-size:12px;
   color:#fff;
   text-decoration:none;
}

div#loginContainer a.toggle-kundenlogin:hover,
div#loginContainer a.toggle-kundenlogin:active {
   background:url(../images/toggle-kundenlogin.jpg) 0 -30px no-repeat;
   color:#fff;
   text-decoration:none;
}

/* =content */

div#contentContainer {
   padding:30px 0 0 0;
   width:860px;
   position:relative;
}

div#contentContainer div#contentMain {
   padding:0 40px 40px 20px;
   width:530px;
   float:left;
}

div#contentContainer div#contentMain div.contentMain1 {
   margin:0 30px 20px 0;
   width:250px;
   float:left;
}

div#contentContainer div#contentMain div.contentMain2 {
   margin:0 0 20px 0;
   width:250px;
   float:left;
}


div#contentMain h2 {
   margin:0 0 20px 0;
   padding:0 0 2px 0;
   font-weight:normal;
   font-size:28px;
   color:#1976b0;
   border-bottom:1px solid #d7dbdd;
}

div#contentMain h3 {
   margin:0 0 10px 0;
   font-weight:normal;
   font-size:18px;
   color:#1976b0;
}

div#contentMain h4 {
   margin:0 0 5px 0;
   font-weight:bold;
   font-size:15px;
   color:#50bf00;
}

div#contentMain h5 {
   margin:0 0 5px 0;
   font-weight:bold;
   font-size:13px;
   color:#484e53;
}

div#contentMain p {
   margin:0 0 10px 0;
   font-weight:normal;
   font-size:13px;
   color:#484e53;
   line-height:22px;
}

div#contentMain pre code {
   display:block;
   width:510px;
   margin:0 0 10px 0;
   padding:10px;
   background:#f6f6f6;
   border:1px solid #ebebeb;
   font-family:"Courier New", Courier, monospace;
   color:#000000;
   font-size:12px;
   overflow:auto;
}

div#contentMain p.highlight {
   margin:0 0 10px 0;
   font-weight:bold;
   font-size:13px;
   color:#50bf00;
   line-height:20px;
}

div#contentMain a,
div#contentMain a:visited {
   color:#50bf00;
   text-decoration:none;
}

div#contentMain a:hover,
div#contentMain a:active {
   color:#50bf00;
   text-decoration:underline;
}

div#contentMain a.download {
   display:block;
   padding:5px 0 5px 22px;
   background:url(../images/download.jpg) 0 7px no-repeat;
}

div#contentMain ul {
   margin:5px 0 20px 10px;
   font-weight:normal;
   font-size:13px;
   color:#484e53;
   line-height:22px;
}

div#contentMain ul li {
   padding:0 0 0 16px;
   background:url(../images/li-content-main.jpg) 0 7px no-repeat;
}

div#contentMain dl {
   margin:5px 0 20px 0;
   font-weight:normal;
   font-size:13px;
   color:#484e53;
   line-height:22px;
}

div#contentMain dl di {
   margin:0 0 5px 0;
}

div#contentMain dl dt {
   font-weight:bold;
   font-size:13px;
   color:#1976b0;
   padding:0 0 0 16px;
   background:url(../images/li-content-main.jpg) 0 7px no-repeat;
}

div#contentMain dl dd {
   padding:0 0 0 16px;
}

div#contentMain div.hr {
   margin:20px 0 20px 0;
   height:1px;
   background:#d4d8db;
   clear:both;
}

div#contentMain ul#tabs {
   margin:10px 0 10px 0;
   padding:5px 0 0 0;
   display:block;
   width:550px;
   height:30px;
   background:#d7dce1 url(../images/bg-tabs.jpg) 0 0 repeat-x;
   border-bottom:1px solid #c5cbd0;
}

div#contentMain ul#tabs li {
   margin:0 5px 0px 5px;
   padding:2px 10px 0 10px;
   height:28px;
   display:block;
   float:left;
   background:none;
}

div#contentMain ul#tabs li.tab-active {
   background:#fff;
   border-top:1px solid #c5cbd0;
   border-right:1px solid #c5cbd0;
   border-bottom:none;
   border-left:1px solid #c5cbd0;
}

div#contentMain ul#tabs li a {
   padding:0 !important;
   background:none !important;
}

div#contentMain h4.question {
   margin:2px 0 5px 0;
   font-weight:bold;
   font-size:13px;
   color:#50bf00;
   cursor: pointer;
   background:#e6e8ea url(../images/bg-tabs.jpg) 0 0 repeat-x;
   padding: 3px 5px 1px;
}

div#contentMain div.answer p {
   margin:0 0 20px 5px;
   font-weight:normal;
   font-size:13px;
   color:#484e53;
   line-height:22px;
}

div#contentMain div.package {
   width:249px;
   height:166px;
   background:url(../images/bg-package.jpg) 0 0 no-repeat;
   position:relative;
   float:left;
}

div#contentMain div.package-left {
   margin:0 30px 20px 0;
}

div#contentMain div.package-right {
   margin:0 0 20px 0;
}

div#contentMain div.package h4 {
   margin:5px 0 20px 10px;
   font-size:18px;
   font-weight:normal;
   color:#fff;
}

div#contentMain div.package p {
   margin:0 0 20px 10px;
   font-size:13px;
   font-weight:bold;
   color:#484e53;
}

div#contentMain div.package h5 {
   font-size:32px;
   line-height:70px;
   font-weight:bold;
   color:#fff;
   display:bock;
   width:70px;
   height:70px;
   position:absolute;
   top:80px;
   right:8px;
}
div#contentMain div.package h6 {
   font-size:22px;
   line-height:70px;
   font-weight:bold;
   color:#fff;
   display:bock;
   width:70px;
   height:70px;
   position:absolute;
   top:80px;
   right:8px;
}
div#contentMain img.image {
   margin:5px 20px 5px 0;
   float:left;
   border:7px solid #d7dbdd;
}

/* =sidebar */

div#contentSidebar {
   padding:0 0 20px 10px;
   width:260px;
   float:left;
}

div#contentSidebar div.sidebarbox {
   padding:15px 0 15px 60px;
   width:200px;
   height:60px;
   border-bottom:1px solid #d7dbdd;
}

div.sidebarbox-hotline {
   background:transparent url(../images/icon-hotline.jpg) 0px 25px no-repeat;
}

div.sidebarbox-kunden-center {
   background:transparent url(../images/icon-kunden-center.jpg) 0px 25px no-repeat;
}

div.sidebarbox-live-support {
   background:transparent url(../images/icon-live-support.jpg) 0px 25px no-repeat;
}

div.sidebarbox-preisliste {
   background:transparent url(../images/icon-testi.jpg) 0px 25px no-repeat;
}

div.sidebarbox h4 {
   font-weight:normal;
   font-size:22px;
   color:#1976b0;
}

div.sidebarbox p {
   font-weight:normal;
   font-size:12px;
   color:#484e53;
   line-height:20px;
}

div.sidebarbox p span.number {
   color:#50bf00;
   font-size:19px;
}

div.sidebarbox p span.online {
   color:#50bf00;
}

div.sidebarbox p span.offline {
   color:#cd2727;
}

div.sidebarbox p a,
div.sidebarbox p a:visited {
   color:#50bf00;
   text-decoration:none;
}

div.sidebarbox p a:hover,
div.sidebarbox p a:active {
   color:#50bf00;
   text-decoration:underline;
}

/* =footer */

div#footerContainer {
   margin:0;
   width:100%;
   height:74px;
   background:url(../images/bg-footer-container.jpg) 0 0 repeat-x;
}

div#push {
   height:70px;
}

div#footer {
   margin:0 auto;
   padding:20px 0 0 20px;
   width:840px;
   height:50px;
   position:relative;
}

div#footer p {
   font:12px/22px Arial, Helvetica, sans-serif;
   color:#b6d4eb;
}

div#footer p span {
   padding:0 5px 0 0;
   display:block;
   float:left;
}

div#footer p span.trenner {
   display:block;
   padding:0 8px 0 8px;
   color:#327d98;
   float:left;
}

div#footer a,
div#footer a:visited {
   color:#b6d4eb;
   text-decoration:underline;
    display:block;
	float:left;
}

div#footer a:hover,
div#footer a:active {
   color:#fff;
   text-decoration:underline;
}

div#footer a.logo {
   display:block;
   width:120px;
   height:40px;
   background:url(../images/logo-footer-jingle4you.jpg) 0 0 no-repeat;
   position:absolute;
   top:18px;
   right:0px;
   text-indent:-10000px;
}

div#footer p a.twitter,
div#footer p a.twitter:visited {
   margin:6px 0 0 0;
   display:inline-block;
   width:50px;
   height:13px;
   text-indent:-9000px;
   float:left;
   background:url(../images/twitter.jpg) 0 0 no-repeat;
}

div#footer p a.twitter:hover,
div#footer p a.twitter:active {
   background:url(../images/twitter.jpg) -50px 0 no-repeat;
}

/* =form */

form#Kontaktformular {
	width:400px;
	margin:0 0 20px 0;
	padding:0 0 10px 0;
}

form#Kontaktformular label, form#Kontaktformular input, form#Kontaktformular textarea {
	font:inherit;
	color:inherit;
	width:200px;
	margin:10px 5px 0 0;
	padding:1px;
   display:block;
   float:left;
}

form#Kontaktformular input, form#Kontaktformular textarea {
   border:1px solid #bbbfc5;
   background:#f9fafb url(../images/bg-form-input.jpg) 0 0 repeat-x;
}

form#Kontaktformular textarea {
	height:90px;
}

form#Kontaktformular input:focus, form#Kontaktformular textarea:focus {
	border:1px solid #58b714;	
}

form#Kontaktformular label {
	text-align:right;				
	width:90px;						
	padding:0 15px 0 0;			
}

form#Kontaktformular legend {
	display:none;
}

form#Kontaktformular fieldset {
	border:none;
	padding:0;
}

form#Kontaktformular input#submit {
	width:120px;
	padding:5px;
	background:#025c8d;
	color:#fff;
	font-size:13px;
	font-weight:bold;
	cursor:pointer;
	border:none;
}

form#Kontaktformular input#submit {
	background:#50bf00;
}

form#Kontaktformular fieldset#submitbox {
	width:120px;
	height:25px;
	padding:0 0 0 110px;
	clear:both;
}

form#Kontaktformular fieldset#adresse {
	margin:0 10px 0 0;
}

form#Kontaktformular input.radio {
	width:20px;
	margin-top:2px;
	border:none;
	background:transparent;
}

* html form#Kontaktformular input.radio {
	margin-top:2px;
}

form#Kontaktformular label.radio {
	width:auto;
}

form#Kontaktformular input.checkbox {
	width:20px;
	margin-top:10px;
}

* html form#Kontaktformular input.checkbox {
	margin-top:7px;
}

form#Kontaktformular label.checkbox {
	width:90px;
}

form#Kontaktformular label.required {
	background:url(../images/required.png) top right no-repeat;	
}

/* FORMULAR KALKULATION */

/* =form */

form#Kalkulation {
	width:400px;
	margin:0 0 20px 0;
	padding:0 0 10px 0;
}

form#Kalkulation label, form#Kalkulation input, form#Kalkulation textarea {
	font:inherit;
	color:inherit;
	
	margin:10px 5px 0 0;
	padding:1px;
   display:block;
   float:left;
}

form#Kalkulation input, form#Kalkulation textarea {
   border:1px solid #bbbfc5;
   background:#f9fafb url(../images/bg-form-input.jpg) 0 0 repeat-x;
}

form#Kalkulation textarea {
	height:150px;
}

form#Kalkulation input:focus, form#Kalkulation textarea:focus {
	border:1px solid #58b714;	
}

form#Kalkulation label {
	text-align:right;				
	width:180px;						
	padding:0 15px 0 0;			
}

form#Kalkulation legend {
	display:none;
}

form#Kalkulation fieldset {
	border:none;
	padding:0;
}

form#Kalkulation input#submit {
	width:120px;
	padding:5px;
	background:#025c8d;
	color:#fff;
	font-size:13px;
	font-weight:bold;
	cursor:pointer;
	border:none;
}

form#Kalkulation input#submit {
	background:#50bf00;
}

form#Kalkulation fieldset#submitbox {
	width:120px;
	height:25px;
	padding:0 0 0 110px;
	clear:both;
}

form#Kalkulation fieldset#adresse {
	margin:0 10px 0 0;
}

form#Kalkulation input.radio {
	width:20px;
	m
	border:none;
	background:transparent;
}

* html form#Kalkulation input.radio {
	margin-top:2px;
}

form#Kalkulation label.radio {
	width:auto;
}

form#Kalkulation input.checkbox {
	width:20px;
	margin-top:10px;
}

* html form#Kalkulation input.checkbox {
	margin-top:7px;
}

form#Kalkulation label.checkbox {
	width:90px;
}

form#Kalkulation label.required {
	background:url(../images/required.png) top right no-repeat;	
}


.error {
	color:#025c8d !important;
	font-weight:bold !important;
}

p#fehlermeldung {
	display:none;
	background:#ebeef2;
	padding:20px;
	margin:0 0 15px 0;
}

form#Kontaktformular br {
	clear:left;
}

form#Kontaktformular input[type=hidden] {
	display:none;
	border:0;
	padding:0;
}
   blockquote {
      background: #fffff; ;
      padding: 1em 1em 0 1em;
      border-top: 2px solid #003366;;
      border-bottom: 2px solid #003366;;
      margin-left: 0; /* keine Zentrierung */
   }

div#Badge, div#Badge a, div#Badge img {
	position: absolute;
	top: 0;
	right: 0;
	border: 0;
}
div#flags {
	background:url(../images/de.png);
}