/*
AUTHOR+COPYRIGHT:
Wilhelmine Freudenthal
Barrierefreies Webdesign / Semantischer Code
--- mit Auszuegen aus dem Style Sheet von wko.at ---

CONTACT:
wilhelmine@semantic-coding.net
http://www.semantic-coding.net
January 2007

last modified: 05/02/2007
*/


/* -------------------------------------- */
/* ------ Allgemeine HTML-Elemente ------ */
form { margin-top: 0; } /* Fuer Opera */

body
{
 font:10px Verdana, "Lucida Grande", "Bitstream Vera Sans", "Sun Sans-Regular", Helvetica, Arial, sans-serif;
 text-align:center;
 padding:0;
 margin:0;
 background:#B3B3B3 url("../pics/body_bg.gif") repeat-y center center;
}

h1 { font-size:13px; }
h2 { font-size:12px; }
h3 { font-size:11px; }
h4 { font-size:10px; }

img, a img { border:none; }

a { color:black; text-decoration:none; }
a:hover { text-decoration:underline; }

textarea { font: 12px Verdana, sans-serif; }

abbr { border-bottom:1px dotted; }

/* ------------------------------ */
/* -------- Seitenlayout -------- */
#page
{
 background:#FFFFFF url("../pics/schatten_unten.gif") repeat-x bottom left;
 padding-bottom:20px;
 position:relative;
 text-align:left;
 margin:auto;
 width:974px;
 left:0 !important;
}

#main
{
 background:#FFFFFF url("../pics/schatten.gif") repeat-x;
 padding:40px 0 0 0;
 position:relative;
 min-height:42em;
}

#inhalt
{
 float:right;
 position:relative;
 margin:0 175px 10px 0;
 width:594px;
 border-top:1px solid #D6D6D6;
 padding-top:14px;
}

#nav-box
{
 position:relative;
 top:0;
 left:30px;
 width:145px;
}

#clearpage { clear: right; }
div.clearpage { clear: both; }
/* ---------------------------------- */
/* ------------- Header ------------- */
#header
{
 background:#E1E4E5 url("../pics/header_bg.gif") repeat-x;
 margin:0;
 position:relative;
 border-top:1px solid #E1E4E5;
}

#header a
{
 margin:0;
 padding:0;
 display:block;
 position:absolute;
 width:170px;
 height:51px;
 top:5px;
 left:33px;
}

#farbcode
{
 background:#818A8B url("../pics/fc_neutral.gif") repeat-x;
 font:normal 17px "Trebuchet MS", Verdana, "Lucida Grande", "Bitstream Vera Sans",
 "Sun Sans-Regular", Helvetica, Arial, sans-serif;
 color:#FFFFFF;
 padding:5px 5px 5px 30px;
 margin:90px 0 0 0;
 border-bottom:1px solid #738081;
 text-shadow:1px 1px 5px #666;
}

/* --------------------------------- */
/* -------- Navigtaions-Box -------- */
div#nav-box ol { margin:0;  padding:4px 4px 8px 8px ;  border:1px solid #D6D6D6; border-top:none; }

div#nav-box h3
{
 background:url("../pics/verlauf_rot.gif");
 margin:0;
 padding:4px;
 font-size:10px;
 border:1px solid #D13424;
 color:#FFFFFF;
}

div#nav-box h3 em
{
 padding-left:14px;
 background:url("../pics/pfeil_solid_weiss_open.gif") no-repeat 0 50%;
 font-style:normal;
}

#nav-box li
{
 margin:0;
 background:url("../pics/pfeil_vorwaerts.gif") no-repeat 0 50%; 
 list-style:none;
 padding:2px 0 2px 0;
}

#nav-box li.one { background: url("../pics/1.gif") no-repeat 0 50%; }
#nav-box li.two { background: url("../pics/2.gif") no-repeat 0 50%; }
#nav-box li.three { background: url("../pics/3.gif") no-repeat 0 50%; }
#nav-box li.four { background: url("../pics/4.gif") no-repeat 0 50%; }
#nav-box li.five { background: url("../pics/5.gif") no-repeat 0 50%; }
#nav-box li.six { background: url("../pics/6.gif") no-repeat 0 50%; }
#nav-box li.seven { background: url("../pics/7.gif") no-repeat 0 50%; }
#nav-box li.eight { background: url("../pics/8.gif") no-repeat 0 50%; }
#nav-box li.nine { background: url("../pics/9.gif") no-repeat 0 50%; }

#nav-box a, #nav-box li strong.current { padding-left:10px; } 
#nav-box a { display:block; }
#nav-box li strong.current { color:#FF0000; font-weight:bold; }

#nav-box li.one strong.current { background: url("../pics/1-current.gif") no-repeat 0 50%; }
#nav-box li.two strong.current { background: url("../pics/2-current.gif") no-repeat 0 50%; }
#nav-box li.three strong.current { background: url("../pics/3-current.gif") no-repeat 0 50%; }
#nav-box li.four strong.current { background: url("../pics/4-current.gif") no-repeat 0 50%; }
#nav-box li.five strong.current { background: url("../pics/5-current.gif") no-repeat 0 50%; }
#nav-box li.six strong.current { background: url("../pics/6-current.gif") no-repeat 0 50%; }
#nav-box li.seven strong.current { background: url("../pics/7-current.gif") no-repeat 0 50%; }
#nav-box li.eight strong.current { background: url("../pics/8-current.gif") no-repeat 0 50%; }
#nav-box li.nine strong.current { background: url("../pics/9-current.gif") no-repeat 0 50%; }

#nav-box li em.required
{
 font-style:normal;
 background:url("../pics/icon_stern-empty.gif") no-repeat 100% 0;
 padding:0 13px 0 10px;
}

#nav-box li strong.current em.required { color:#FF0000; padding-left:0; }
#nav-box li a em.required { color:#000000; padding-left:0; }

#nav-box li.alert { background: url("../pics/icon-alert.gif") no-repeat 0 50% !important; }
#nav-box li.alert { padding-left:6px; }
#nav-box li.alert strong.current { background:none; }

/* ---------------------------------------------- */
/* -------------- Inhalt allgemein -------------- */
#main h2
{
 color:black;
 font-size:10px;
 border:1px solid #CCCCCC;
 padding:4px;
 background:#CCCCCC url("../pics/verlauf.gif");
 margin:0;
 width:584px;
}

/* ----------------------------------------- */
/* ---------------- Legende ---------------- */
#legende { margin:0 0 10px 0; color:#6D6D6D; }
#legende h3 { position:absolute; left:-3000px; }
#legende ul { margin:0; padding:0; list-style:none; }
#legende li { padding:4px 0 4px 19px; position:relative;}

#legende .info
{
 display:inline-block;
 background:url("../pics/icon_info.gif") no-repeat 100% 100%;
 position:absolute;
 left:0;
 height:18px;
 width:18px;
}

#legende .required-field
{ background:url("../pics/icon_stern.gif") no-repeat 0 50%; }
#legende .required-page
{ background:url("../pics/icon_stern-empty.gif") no-repeat 0 50%; }

#legende .info span, #legende .required-field span, #legende .required-page span
{ position:absolute; left:-3000px; }

/* -------------------------------------------- */
/* ---------- Formular-Eingabe-Daten ---------- */
ul.applicant-data { margin:10px 0 0 0; padding:0; list-style:none; position:relative; }
ul.applicant-data ul{ margin:0; padding:0; list-style:none; }

ul.applicant-data li { position:relative; margin:4px 0 10px 0; padding:2px 0 2px 16px; }
ul.applicant-data li li { position:absolute; padding:0; margin:0; top:0; left:0; width:auto; }

ul.applicant-data .required span, ul.applicant-data .info span { position:absolute; left:-3000px; }
ul.applicant-data .required
{
 font-style:normal;
 font-weight:bold;
 padding:0 12px 0 0;
 background:url("../pics/icon_stern.gif") no-repeat 100% 50%;
}

ul.applicant-data a.info
{
 display:block;
 height:14px;
 width:14px;
 background:url("../pics/icon_info_kl.gif") no-repeat 0 0;
}
ul.applicant-data a:hover { background:url("../pics/icon_info_kl.gif") no-repeat 100% 100% !important; }

ul.applicant-data li li div.normalText,
ul.applicant-data li li input.single-line,
ul.applicant-data li li input.single-line_active,
ul.applicant-data li li.radio-buttons,
ul.applicant-data li li.select-list,
ul.applicant-data li li.multiple-line textarea
{ position:absolute; left:210px; width:18em; }

ul.applicant-data li li input.single-line,
ul.applicant-data li li input.single-line_active,
ul.applicant-data li li select,
ul.applicant-data li li.multiple-line textarea
{
 margin:0;
 padding:2px 0 2px 0;
 border:2px groove #91B7E5;
 font:10px Verdana, "Lucida Grande", "Bitstream Vera Sans", "Sun Sans-Regular", Helvetica, Arial, sans-serif;
}
ul.applicant-data li li select { padding:0; }

ul.applicant-data li li.select-list { width:400px; }
ul.applicant-data li li.select-list select { display:inline; }

ul.applicant-data li li input.single-line { color:#000000; font-style:italic; padding:1px; }
ul.applicant-data li li input.single-line_active { color:#000000; font-style:normal; padding:1px; }

ul.applicant-data li li.multiple-line
{
 display:block;
 width:594px;
 height:80px;
 position:static;
 margin-top:-14px;
}

ul.applicant-data li li.multiple-line textarea { height:76px; width:300px; }

ul.applicant-data li.disjunction
{
 border-bottom:1px solid #D6D6D6;
 padding-bottom:14px;
 margin-bottom:20px;
}

/* ------------------------------------------- */
/* ------------- Formular-Footer und Blaetter-Funktionalitaet ------------- */
p.expand
{
 position:relative;
 height:30px;
 text-align:right;
}

div.submit
{
 background:#F3F3F3;
 border:1px solid #E3E3E3;
 height:35px;
 position:relative;
 color:#787878;
 width:594px;
 margin:40px 0 40px 0;
}

div.submit input { margin: 1px 0 0 5px; }

div.submit span
{
 display:block;
 width:594px;
 text-align:center;
 position:absolute;
 top:12px;
}

/* Buttons wie im WKO-Portal-Prototyp */
input.button
{
 border: 2px solid #515151;
 font-family: Verdana, "Lucida Grande", "Bitstream Vera Sans", "Sun Sans-Regular", Helvetica, Arial, sans-serif;
 font-size: 13px;
 line-height: 16px;
 color: #515151;
 cursor: pointer;
 height:26px;
 background: #E3E3E3 url("../pics/button.gif") repeat-x 100% 0;
}

input.button:hover
{
 border: 2px solid #333333;
 background: url("../pics/button_hover.gif") repeat-x 100% 0;
}

input.button:active
{
 border: 2px solid #222222;
 border-right: 2px solid #CCCCCC;
 border-bottom: 2px solid #CCCCCC;
 color:#000000;
 background: url("../pics/button_active.gif") repeat-x 100% 0;
}

.submit input.button
{
 position:absolute;
 top:3px;
 right:8px;
}

.expand a
{
 border: 1px solid #ABABAB;
 font-family: Verdana, "Lucida Grande", "Bitstream Vera Sans", "Sun Sans-Regular", Helvetica, Arial, sans-serif;
 font-size: 13px;
 line-height: 16px;
 color: #06480D;
 cursor: pointer;
 padding:8px 34px 8px 4px;
 background:#EFEFEF url("../pics/icon_hinzufuegen.gif") no-repeat 99% 50%;
 text-decoration:underline;
 display:inline-block;
}

.expand a:hover { color: #0B8519; }

.expand a.delete
{
 padding:8px 4px 8px 22px;
 background:#EFEFEF url("../pics/icon_loeschen.gif") no-repeat 3px 50%;
 color: #AE1416;
 display: inline-block;
}

.expand a.delete:hover {color: #FF3514;}

/* Buttons wie am Portal (11.01.2006) */
/*.submit input.button
{
 border-bottom: 1px solid #CCCCCC;
 border-top: 1px solid #CCCCCC;
 border-left: 1px solid #CCCCCC;
 border-right: 1px solid #CCCCCC;
 background-color: #E3E3E3;
 font-weight: bold;
 font-family: Verdana, Lucida Grande, Bitstream Vera Sans,Sun Sans-Regular, Helvetica, Arial, sans-serif;
 font-size: 10px;
 line-height: 16px;
 color: #666666;
 cursor: pointer;
 position:absolute;
 top:8px;
 right:8px;
}
*/

/* ---------------------------------------------- */
/* --------------- (Link)-Widgets --------------- */
a.link_continue, a.link_back
{
 display:block;
 width:80px;
 color:#787878;
 position:absolute;
 top:9px;
}

a.link_continue
{
 background: url("../pics/icon-continue.gif") no-repeat 100% 50%;
 padding: 2px 10px 2px 0;
 right:8px;
 text-align:right;
}

a.link_back
{
 background: url("../pics/icon-back.gif") no-repeat 0 50%;
 padding: 2px 0 2px 10px;
 left:8px;
}

a.link_info
{
 background: url("../pics/icon_info_kl.gif") no-repeat 0 0;
 color: black;
 text-decoration: none;
 padding: 1px 0 1px 15px;
}

a.link_info:hover
{
 background-position: 0 100%;
 color: #039D19;
 text-decoration: underline;
}

/* ---------------------------------------------- */
/* ----------- User-Ausgabe-Meldungen ----------- */
div.alert, div.alert_info
{
 font-size: 1.1em;
 margin: 0 0 10px 0;
}

ul li div.alert, ul li div.alert_info
{
 margin:14px 0 0 -16px;
 padding-left:-16px;
}

div.alert ul, div.alert_info ul
{ padding:0; margin:2px 0 2px 0; list-style-position:inside; }

div.alert a { color: #563006; text-decoration:underline; }
div.alert_info a { color:#3F5FA9; text-decoration:underline; }

div.alert div, div.alert_info div {  padding: 5px 5px 5px 60px; }

div.alert
{
 background: #FFF8C1 url("../pics/alert.gif") repeat-x;
 border: 1px solid #F6DA35;
 color: #563006;
}

div.alert_info
{
 background: url("../pics/alert_info.gif") repeat-x;
 border: 1px solid #B5C1DD;
 color: #3F5FA9;
}

div.alert div { background: url("../pics/alert_icon.gif") no-repeat 5px 50%; }
div.alert_info div { background: url("../pics/alert_info_icon.gif") no-repeat 10px 50%; }

div.alert h3, div.alert p,
div.alert_info h3, div.alert_info p
{
 margin: 3px 0 0 0;
 font-size: 1.1em;
}
ul.applicant-data li li div.normalText
{
	width:35em;
}
ul.applicant-data li li input.invalidField
{	
	border:2px solid #F00;
}