img{ behavior: url('pngbehave.htc'); }


div, p, h1, h2, h3,img,form,body{margin:0; padding:0;}
form{overflow:hidden;}
a{color: #668826; text-decoration: underline;}
a:hover{text-decoration: none; color:#ffa302; }
/*p b{color: #000000;}*/
b.black {color:#000000;}


h1 {color: #333333; font-size:16px; font-weight: normal; padding-bottom: 6px; font-family: georgia, serif;}
div.float_left{float:left;}

body{margin-bottom:20px; background-color:  #FFFFFF; text-align: center; font-family: verdana, sans-serif; font-size:12px; color:#666666; line-height: 150%;}
span.clear{float:none; clear:both; overflow: hidden; height: 0px; display: block;}

#modal_container{position: absolute; z-index: 500; top:0px; left:0px;}
#modal_container_iframe{position: absolute; width: 100%; height:100%; z-index: 501; top:0px; left:0px;filter:alpha(opacity=0);-moz-opacity:.0;opacity:.0;}
#modal_container_trans{position: absolute; width: 100%; height:100%; z-index: 502; top:0px; left:0px; background:#FFFFFF; filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;}



#popup {position: absolute; z-index: 1000; width: 795px; text-align: left;  }
#popup p b{color:#666666;}

div.pu_c{background-color: #FFFFFF; width: 757px; height: 402px; padding:10px; float:left;}
div.pu_close {float:right;}
div.pu_close a{background: url('img/layer/close.jpg') top right no-repeat; height: 19px; padding-right: 25px; display:block; float: left; text-decoration: none;}
div.pu_close a:hover{text-decoration: underline; background-position: right -39px;}

div.spacer_left{padding-left:24px;} /*this two things should be the only things needed to change in order to tighten up the pagewidth*/
div.spacer_right{padding-right:23px;}

a.btn{background: url('img/btn_left_n.jpg') top left no-repeat; color: #FFFFFF; text-decoration: none; padding-left: 2px; display: block; float:left;}
a.btn:hover {background: url('img/btn_left_h.jpg') top left no-repeat;}

a.btn span{ background: url('img/btn_right_n.jpg') top right no-repeat; display:block; float:left; padding-bottom: 3px; cursor: pointer;}
a.btn:hover span{background: url('img/btn_right_h.jpg') top right no-repeat;}

#container{width: 1004px; /*needed to be changed later*/ margin:0px auto; /*center the whole page*/ text-align: left;}

#metanavi{padding-top:10px; padding-left:20px; padding-bottom:24px;}
#metanavi a{padding-left: 10px; padding-right:20px;  color: #666666; font-size: 11px; background: url('img/arrow_n.gif') top left no-repeat; background-position: 0px 4px;  text-decoration: none;}
#metanavi a:hover, #metanavi a.meta_active{text-decoration:none; color:#ffa302; background: url('img/arrow_h.gif') top left no-repeat;background-position: 0px 4px;}
#meta_left{float:left;}
#meta_right{text-align: right; padding-right: 20px;}

div.mn_left{background: url('img/mn_bg_left.jpg') bottom left no-repeat;}
#mainnavi{background: url('img/mn_bg_versuch.jpg') bottom left no-repeat; height: 26px; padding-left: 236px;}
#mainnavi a {color:#668826; font-size: 16px; font-family: georgia, serif; font-weight: normal; display: block; float:left; padding-left:20px; padding-right:20px; padding-top:4px; padding-bottom: 0px; text-decoration: none;}
#mainnavi a:hover, #mainnavi a.mn_active{ color: #ffa302;}
#mainnavi img{float:left;}

div.fl_left{background: url('img/flash_left.jpg') top left no-repeat; float:left;}
div.fl_right{background: url('img/flash_right.jpg') top right no-repeat; float:left;}

#flashheader img{float:left;}

div.c_left {background: url('img/content_left.jpg') top left repeat-y;}
div.c_right {background: url('img/content_right.jpg') top right repeat-y;}
#content{padding-left:40px; padding-bottom: 75px;}

div.container397{width: 397px; padding-right:40px;}
div.container200{width: 200px; padding-right:40px;}
div.container299{width: 299px;}
div.container657{width:657px;}

div.right_shade{background: url('img/shade_right_stretch.jpg') top right repeat-y;}

a.teaser_lnk {padding-left: 10px; color: #668826; font-size: 12px; background: url('img/arrow_n.gif') top left no-repeat; background-position: 0px 4px; text-decoration: underline;  }
a.teaser_lnk:hover{text-decoration: none; color:#ffa302; background: url('img/arrow_h.gif') top left no-repeat; background-position: 0px 4px;}

a.img_teaser {display: block; width: 200px; height: 126px; background-repeat: no-repeat; text-decoration: none;}
a.img_teaser:hover{ background-position: 0px -136px; text-decoration: none;}

a.teaser_leistungen{background-image: url('img/teaser/teaser_leistungen.jpg');}
a.teaser_content_leistungen{background-image: url('img/teaser/teaser_content_leistungen.jpg');}

a.teaser_referenzen{background-image: url('img/teaser/teaser_referenzen.jpg');}
a.teaser_sprachproben{ background-image: url('img/teaser/teaser_sprachproben_big.jpg');}
a.teaser_kontakt{background-image: url('img/teaser/teaser_kontakt.jpg');}

a.teaser_sprachproben_large{display:block; width: 298px; height: 136px; background: url('img/teaser/teaser_sprachproben_large.jpg') no-repeat; background-position: 0px 0px; text-decoration: none; }
a.teaser_sprachproben_large:hover{background-position: 0px -141px;}
div.foot_left{background: url('img/footer_left.jpg') top left no-repeat;}
div.foot_right{background: url('img/footer_right.jpg') top right no-repeat;}

#content_navi div.cn_left{float:left; padding-left:10px;}
#content_navi div.cn_right{float:right; padding-right:40px;}

#content_navi a{display:block; float:left; height: 22px; padding-left:20px; padding-right:10px; background-repeat: no-repeat; background-position: 0px 4px; }
#content_navi a.back{background-image: url('img/icons/back.jpg');}
#content_navi a.empfehlen{background-image: url('img/icons/empfehlen.jpg');}
#content_navi a.print{background-image: url('img/icons/print.jpg');}
#content_navi a.top{background-image: url('img/icons/top.jpg');}

#content_navi a:hover{color:#ffa302; }

#footer {background: url('img/footer_bg.jpg') top left no-repeat; text-align: center; font-size: 11px;}
#footer img.footer_aiic{height: 65px;  width: 240px; border:none;}
#footer a.footer_aiic_lnk{ display:block;}
#footer a{color:#666666; text-decoration: none;}
#footer a:hover{text-decoration: underline;}

span.acordeon_grey, span.acordeon_grey p, a.acordeon, a.acordeon p {color: #668826; font-size: 12px; text-decoration: underline;}
span.acordeon_grey span.arrow, a.acordeon span.arrow{background: url('img/arrow_n.gif')top left no-repeat; display: block; width: 8px; height:18px; float:left; background-position: 0px 11px; padding-right:5px;}
span.acordeon_grey img, a.acordeon img{border:none; float:left; margin-right:5px;}
a.acordeon:hover, a.acordeon:hover p{text-decoration: none;}
a.acordeon:hover span.arrow, a.acordeon:hover p{color:#ffa302; background: url('img/arrow_h.gif') top left no-repeat;  background-position: 0px 11px;}
span.acordeon_grey b, a.acordeon b{ color: #668826;}
a.acordeon:hover b{color:#ffa302;}
/*
span.acordeon_grey img {border:none; float:left;}
span.acordeon_grey p b {color:#666666;}
*/
#kontakt_form{padding-top:10px;}
div.x-form-element input, TEXTAREA, select{ width: 230px; border: 1px solid #668826; color: #668826; float:left; font-size:12px; font-family: verdana, sans-serif;}
div.x-form-element label{width: 125px; float:left; display: block; padding-left:20px;}
div.x-form-element TEXTAREA { height: 90px; width: 470px; }

/*firefox workaround for cursor bug*/
div.x-form-input, div.x-form-input input, div.x-form-input TEXTAREA{ overflow: auto;}
/*IE Workaround TEXTAREA Width*/
html>body #send_to_form TEXTAREA{width: 340px; }
* html #send_to_form TEXTAREA{width: 336px;}


#send_to_form div.x-form-element label{padding-left:0px;}

#klangprobe_flash{float:left; margin-right:20px; width: 217px; height:257px;}
div.sp_accordeon{}