@charset "utf-8";
/* CSS Document */
/* 2010/08/23 by Aces :: aces@wewaii.com */
/* neutral ltr layout */

/* layout page framework */
body {
    direction:ltr;
    /*font:15px/1.5 Arial; */ /* nur für RTL und arabische schriftzeichen */
    margin-left:auto;
    margin-right:auto;
    text-align:center; /* zwingt den IE6 die Seite zu zentrieren */
}
#wrap {
    width:1000px;
    text-align:left; /* wird benötigt um die Zentrierung im Body für den IE6 aufzuheben */
    background-image: url(../img/wrap_bg.jpg);
    background-repeat: no-repeat;
    background-position: center 304px;
}
#wrap #content {
    background-image: url(../img/body_bg.png);
    background-repeat: repeat-y;
    position: static;
}


#contentLeft .top,
#footer .top{
    background-image: url(../img/left_side_top.png);
    background-repeat: no-repeat;
    height: 13px;
    width: 700px;
}
#contentLeft .middle,
#footer .middle{
    background-image: url(../img/left_side_middle.png);
    background-repeat: repeat-y;
    padding-bottom: 10px;
    width: 700px;
}
#contentLeft .bottom,
#footer .bottom{
    background-image: url(../img/left_side_bottom.png);
    background-repeat: no-repeat;
    height: 13px;
    width: 700px;
}
#contentLeft {
    float: left; /* good for IE7 */
    width:700px;
    padding-left:0px;
    padding-top:0px;
    position: relative;
}

#contentRight .top{
    background-image: url(../img/right_side_top.png);
    background-repeat: no-repeat;
    height: 12px;
    width: 295px; /* good for IE7 */
}
#contentRight .middle{
    background-image: url(../img/right_side_middle.png);
    background-repeat: repeat-y;
    padding-top: 5px;
    width: 295px; /* good for IE7 */
} 
#contentRight .bottom{
    background-image: url(../img/right_side_bottom.png);
    background-repeat: no-repeat;
    height: 12px;
    width: 295px; /* good for IE7 */
    /*
    position: absolute;
    bottom: -5px;
    */
}
#contentRight {
    float: left;
    width: 295px;
}

#contentRight .textBoxWrapper{
    margin: -10px 5px 0px 6px;
}
#contentRight .textBoxTop{
    background-image: url(../img/textbox_top.png);
    background-repeat: no-repeat;
    height: 28px;
    margin-top: 10px;
}
#contentRight .textBoxMiddle{
    background-image: url(../img/textbox_middle.png);
    background-repeat: repeat-y;
    width: 284px; /* good for IE7 */
    padding-bottom: 10px;
    padding-top: 5px;
}
#contentRight .textBoxBottom{
    background-image: url(../img/textbox_bottom.png);
    background-repeat: no-repeat;
    height: 20px;
    width: 284px; /* good for IE7 */
}
#contentRight .textBoxWrapper > div{
    position: relative;
}
#contentRight .textBoxWrapper .textBoxBottom{
    position: absolute;
    bottom: -10px;
}

.separatorH {
    background-image: url(../img/right_panel_white_block_separator.png);
    background-repeat: repeat-x;
    height: 1px;
    margin: 5px;
}
.sepace{
    height: 1px;
    margin: 5px;
}

/* supportLink */
a.supportlink {
    display: block;
    width: 143px;
    height: 30px;
    line-height: 30px;
    /* border: 1px solid #b3e9f6; */
    background-image: url(../img/c_box_button_sup.jpg);
    /* background-position: top left; */
    background-repeat: no-repeat;
    color: #fff;
    text-decoration: none;
    margin: 0 auto;
}	
a:hover.supportlink {
    /*background-image: url(../img/c_box_button.jpg);
    background-position: bottom;*/
    color: #fff;
    text-decoration: none;
}

/** layout - everything with images **/
/** page layout **/
body {
    background-image: url(../img/doc_bg.jpg);
    background-attachment: fixed;
    background-position: 50% 0%;
    background-repeat: no-repeat;
    background-color: #FFFFFF;
    background-size: cover;
    /* padding-top: 100px; */
    padding-bottom:25px;
}
#header {
    background-image:url(../img/header_bg.png);
    background-repeat:no-repeat;
    background-position: 0 100%;
    height:150px;
}
#startersGuide	{
    top: -231px;
    left: 680px;
    width: 187px;
    height: 105px;
    background-image: url(../img/startersGuide_button.png);
    display:none;
}
#logo {
    top: 32px;
    /* width: 392px; */
	 width: 465px;
    height: 107px;
	 /* height: 82px; */
    margin-left: 20px;
    position: absolute;
}
.logo_bg_en {
    background-repeat:no-repeat;
    background-image: url(../img/logo.png);
    /* display:none; */
}
.logo_bg_ar {
    background-repeat:no-repeat;
    background-image: url(../img/header_logo_en.png);
    display:none;
}
.logo_bg_de {
    background-repeat:no-repeat;
    background-image: url(../img/header_logo_en.png);
    display:none;
}
#footer {
    background-image:url(../img/footer_bg.png);
    background-repeat: no-repeat;
    height:69px;
    width: 700px;
    /* padding-top: 5px; */
}

/* contentMiddle */
#contentMiddle {
    background-image:url(../img/arrow.gif);
    background-repeat:no-repeat;
    display:inline;
    float:left;
    height:461px;
    width:55px;
    position:relative;
    margin-top:155px;
    z-index:20;
}

/** layout h1 headers **/
.shortBox {
    width:291px;
    height:33px;
    /* background-image: url(../img/h1_short_bg.jpg);
    background-repeat: no-repeat; */

    margin-bottom:8px;
}
#contentRight .shortBox{
    margin-top: -35px;
    position: absolute;
}
.shortBox h1 {
    line-height:33px;
    color: #4f4f4f;
    font-size:14px;
    text-indent: 20px;
}

#contentRight .newsBox {
    margin-top: -35px;
    position: absolute;
}
.newsBox {
    /*
    width:291px;
    height:33px;
     background-image: url(../img/h1_short_bg.jpg);
    background-repeat: no-repeat; 
    margin-top:30px;
    margin-bottom:15px;
    */
}

.newsBox h1 {
    line-height:33px;
    color: #4f4f4f;
    font-size:14px;
    text-indent: 20px;
}
.longBox_a {
    height:28px;
    padding: 10px 20px 0px;
}
.longBox_a  h1 {
    line-height:28px;
    color:#4F4F4F;
    font-size:17px;
    text-indent: 20px;
    background: #E2EAEF;
    border-radius: 5px;
}
.longBox_b {
    height:28px;
    padding: 10px 20px 0px;
}
.longBox_b  h1 {
    line-height:28px;
    color:#4F4F4F;
    font-size:17px;
    text-indent: 20px;
    background: #E2EAEF;
    border-radius: 5px;
}

/** layout content boxes **/
#c_box_select, #c_box_search, #c_box_sitemap {
    background: #F3F7FA;
    border-radius: 5px;
    margin: 20px 20px 0px;
    padding: 10px 20px;
}
.c_box_header {
    height: 26px;
    background-image: url(../img/c_box_top.jpg);
    background-repeat: no-repeat;
    margin-bottom:10px;
}
* html .c_box_header {
    height: 26px;
    background-image: url(../img/c_box_top.jpg);
    background-repeat: no-repeat;
    /* width:572px; */
    width:566px;
    margin-bottom:0px;
}
.c_box_header h1 {
    line-height: 26px;
    color:#4f4f4f;
    font-size: 14px;
    background: #F3F7FA;
    border-radius: 5px;
}
.c_box_footer {
    background-image:url(../img/c_box_footer.jpg);
    background-repeat:no-repeat;
    background-position:bottom;
    text-align:center;
    height:20px;
    width:566px;
}

/** layout ul navlist **/
ul.navList{
    margin-bottom: 0px;
}
ul.navList li a, ul.navList li span {
    display: block;
    background-image: url(../img/list_bg.jpg);
    background-position: top right;
    background-repeat:no-repeat;
    color: #5F849C;
    text-decoration: none;
    padding-left: 10px;
    cursor: pointer;
}
ul.navList li a:hover, ul.navList li span:hover {
    display: block;
    /*background-image: url(../img/list_bg.jpg);
    background-position: bottom;
    background-repeat: repeat-x; */
    color: #9eb9cb;
    text-decoration: none;
    padding-left: 10px;
}

/* layout div's */

/* starters guide */
/** werden nur gebraucht wenn #startersGuide angezeigt wird **/
#startersGuide p {
    color:#fff;
    padding-top:30px;
    padding-right:5px;
    display:none;
}
#startersGuide a {
    color:#fff;
    text-decoration:none;
    display:none;
}
#startersGuide a:hover {
    color:#fff;
    text-decoration:underline;
    display:none;
}

/* ul navlist */
ul.navList li {
    width: 268px;
    height:28px;
    line-height: 28px;
    /*padding: 0 0 5px 10px;*/
}
* html ul.navList li a {
    width: 268px;
    height:25px;
}

/* newscontent */
.newscontent {
    text-indent: 10px;
    /*
    margin:0 5px 0 20px;
    width:255px;
    */
}
.newscontent p {
    color:#4f4f4f;
    padding-top:10px;
    padding-bottom:10px;
}
div.newscontent p.author {
    font-size:80%;
}

/* infoArea */
#infoAreaWrap h1 {
    background-image:none;
    margin-bottom:1px;
    padding-top:15px;
    width:100%;
}
#infoAreaWrap p {
    color:#fff;
    font-size:11px;
    margin-top:5px;
    width:200px;
    margin-left:15px;
}

/* contentRight */
#contentRight p, #contentRight ul, #contentRight h2   {
    /*
    margin-left:20px;
    margin-right:10px;
    */
    margin: 0px 10px;
    background: #FFF;
}

/* Socialbookmarks */
#socialbookmarks {
    margin:0 0 50px 0px;
    list-style-image:none !important;
    list-style-position:outside !important;
    list-style-type:none !important;
}
#socialbookmarks li {
    float:left;
    margin:0px;
    margin-right:8px;
    padding:0px;
}

/* result */
.result {

}
.result ul {
    list-style-image:none !important;
    list-style-position:inside !important;
    list-style-type:square !important;
    margin-left:30px;
}
.result .answer_result{
    padding: 10px 20px 0px;
}

/* footer */
#footer .middle{
    padding: 0px;
}
#footer p {
    color:#787878;
    font-size:11px;
    text-align:center;
    margin-bottom: 0px;
}
#footer p a {
    color:#787878;
    text-decoration:none;
}
#footer p a:hover {
    color:#787878;
    text-decoration:underline;
}

/* sitemap Stuff */
#sitemap  {
    text-align:left;
    padding: 10px;
    background-color: #F3F7FA; 
}

.openSitemap {
    background-image:url(../img/sitemap.png);
    background-repeat:no-repeat;
    background-position:center;
    height:30px;
    text-align:center;
}
.openSitemap a, .openSitemap a:hover, .openSitemap a:visited, .openSitemap a:active  {
    color: #fff;
    text-decoration:none;
    font-weight:bold;
    line-height: 25px;
}
#zoom_content h1 {
    color: #fff !important;
}
#utilityNav ul, #utilityNav li {
    list-style-type: none;
}
#utilityNav li {
    float: right; /* vermutlich verantwortlich für den 100% fancybox bug in ie7 */
    padding: 0;
    margin: 5px;
}
#primaryNav li span {
    /* font-weight:bold; */
    color:#000;
    margin-left: 5px;
}
#primaryNav li a{
    margin-left: 5px;
}
#primaryNav ul, #primaryNav li {
    list-style-type:  none;
    margin-left: 15px;
    color:#000;
    text-align:left;
}

/** html tags **/
/* hx */
h1.introduction {
    color: #fff;
    padding-bottom:4px;
}
h2 {
    color:#787878;
    font-size:14px;
    line-height:20px;
    width:100%;
}
.result h2 {
    margin-bottom:10px;
}

/* select */
select, input[type="text"], input[type="password"], textarea {
    border:1px solid #787878;
    background-color:#fff;
    color:#787878;
    font-size:100%;
    padding:5px;
}
select {
    margin-left:20px;
    margin-right:20px;
}
select.category {
    margin: 0px 0px 20px;
    width:530px;
}

/* input */
input.mediuminput, select.mediuminput {
    width:520px;
}

/* hr */
hr {
    border-color:#787878;
    border-style:solid;
    border-width:1px 0 0;
    clear:both;
    height:0;
    width:660px;
}

/* p */
p.note {
    color: #aaa;
    font-size: 0.85em;	
}
p, ul, li {
    color: #4f4f4f;
}

/* links general */
a {
    color:#4f4f4f;
    text-decoration:underline;
}
a:hover {
    color:#4f4f4f;
    text-decoration:none;
}
p a, ul li a {
    color:#4f4f4f;
    text-decoration:underline;
}
p a:hover, ul li a:hover {
    color:#4f4f4f;
    text-decoration:none;
}
a.registerButton /* for Safari */ {
    text-decoration: none;
}

/* fancybox */
#fancybox-outer {
    background: #f0f0f0 !important;
}

/* tables */
table {
    border-collapse:separate;
    border-spacing:5px;
    color:#04B0DE;
    empty-cells:hide;
    margin-left:20px;
    width:500px;
}
td {
    border:1px solid #04B0DE;
    text-align:center;
}

/* others */
.result p b {
    color:#04B0DE;
}
.anchor {
    color:#333;
    margin-left:20px;
}
.important {
    color:#ff0000;
}

/* find an answer button stuff */
/* only here, nowhere else!! */
#headerInfoAreaWrapperPos {
    /* top:125px;
    left:153px; */
    top:227px;
    left:290px;
    position:absolute;
    display:none;
}
#infoAreaWrap {
    width:200px; /* 10px addition durch folgendes padding mit 5px je Seite, daher eigentlich 272px */
    height:150px;
    padding:5px;
    text-align:center;
    position:absolute;
    z-index:70;
}
* html #infoAreaWrap {
    \width: 210px; /* for IE5 and IE6 in quirks mode */
    w\idth: 210px; /* for IE6 in standards mode */
}
#call2action {
    /* background-image:url(../img/call2action.png);
    background-repeat:no-repeat;
    background-position:top center; */
    height:75px;
    width:200px; /* 10px subtraktion da padding auf 5px steht */
    position:absolute; /* muss wegen Safari bei RTL entfernt werden */
    z-index:71;
    top:45px;
}
* html #call2action /* IE6 */ {
    right: 0px;
}
*:first-child+html #call2action /* IE7 */ {
    right: 0px;
}
#infoAreaWrap #call2action:hover {
    /* background-image: url(../img/call2action.png);
    background-position: bottom; */
    text-decoration: none;
}
a #call2action {
    text-decoration: none;
}
.registerButton {
    text-decoration: none;
}

/* find an answer */
#c2aText1 {
    width:200px;
    margin-top:21px;
    position:absolute;
    z-index:72;
}
* html #c2aText1 /* IE6 */ {
    left: -100px;
}
*:first-child+html #c2aText1 /* IE7 */ {
    left: -100px;
}
.c2aText1Light {
    color:#40351a;
    font-size: 16px;
    font-weight: bolder;
    z-index:74;
    position:absolute;
    width:200px;
}
.c2aText1Dark {
    color: #19430f;
    font-size: 16px;
    font-weight: bolder;
    z-index:73;
    position:absolute;
    width:200px;
    margin-top:1px;
    display:none;
}

/* hover link für "find an answer" */
#infoAreaWrap #call2action:hover div.c2aText1Light {
    color: #7C4910;
    text-decoration: none;
}
#infoAreaWrap #call2action:hover div.c2aText1Dark {
    color: #7C4910;
    text-decoration: none;
}

/* click to start */
#c2aText2 {
    width:200px;
    margin-top:43px;
    position:absolute;
    z-index:75;
}
* html #c2aText2 /* IE6 */ {
    left: -100px;
}
*:first-child+html #c2aText2 /* IE7 */ {
    left: -100px;
}
.c2aText2Light {
    z-index:77;
    position: absolute;
    font-size: 9px;
    font-weight: bolder;
    color:#593109;
    width:200px;
}
.c2aText2Dark {
    z-index:76;
    position: absolute;
    font-size: 9px;
    font-weight: bolder;
    margin-top:1px;
    color:#CEFC9D;
    width:200px;
    display:none;
}

/* got a question? */
#question {
    height:35px;
    line-height:35px;
    width:200px;
    margin-top:10px;
    position:absolute;
    z-index:80;
    display:none;
}
* html #question /* IE6 */ {
    left: -100px;
}
*:first-child+html #question /* IE7 */ {
    left: -100px;
}
.questionLight {
    position: absolute;
    z-index:82;
    color: #fff;
    font-size: 16px;
    font-weight: bolder;
    margin-top:10px;
    width:200px;
}
.questionDark {
    display:none;
}

/* answers will help you ... */
#answer{
    width:200px;
    position:absolute;
    z-index:83;
    top:123px;
    display:none;
}
* html #answer /* IE6 */ {
    left: -100px;
}
*:first-child+html #answer /* IE7 */ {
    left: -100px;
}
.answerLight {
    color: #fff;
    font-size:11px;
    width:200px;
    position:absolute
}
.answerDark {
    display:none;
}

/* autocomplete */
/* Farbschema der Autocompletebox dem Design anpassen */
.autocomplete { 
    color: #000; /* text farbe */
    border-color: #B3E9F6 !important; /* randfarbe der box */
    /* text-align: left !important; */ /* text ausrichtung innerhalb der box anpassen */
}
.autocomplete .selected {
    background: #D0D0D0 !important; /* zu highlightende auswahl innerhalb der box */
}  
.autocomplete strong {
    color: #3399FF !important; /* zu highlightendes wort */
}

/* ie6update textausrichtung */
/* um richtig zu funktionieren wurde innerhalb der ie6update.1.0.js in den zeilen 247 und 261 das float attribut auskommentiert */
#activebar-container { text-align: left; }
#activebar-container .icon { float: left; }
#activebar-container .close { float: right; }

/* schlagschatten mit css3 */

.shadow {
    box-shadow: 0px 0px 6px #666;
    -moz-box-shadow: 0px 0px 6px #666;
    -webkit-box-shadow: 0px 0px 6px #666;
    border: 8px solid #F8F8F8;
    filter:progid:DXImageTransform.Microsoft.Shadow(strength=6,color=#666666,direction=135); /* Schatten für die IE Freunde */
}

/* floats */
.float-left {
    float:left;
    margin-right: 15px;
}
.float-right {
    float:right;
    margin-left: 15px;
}
