/*---------------------------- General -----------------------------*/
html, body {
margin: 0;
padding: 0;
height: 100%;
font-family: Arial, sans-serif;
font-size: 12px;
}

div.vert_spacer {
height: 10px;
}

/*------------------------- Background left ------------------------*/
body {
background-image: url(../images/background_left.png);
background-position: left top;
background-repeat: no-repeat;
background-repeat: repeat-y;
}

/*------------------------ Background right ------------------------*/
div.bodyframe {
background-image: url(../images/background_right.png);
background-color: transparent;
background-position: right top;
background-repeat: repeat-y;
height: 100%;
width: 100%;
}

/*---------------------------- Login ------------------------------*/
div.logo {
background-image: url(../images/logo.png);
background-repeat: no-repeat;
background-position: left top;
width: 190px;
height: 100px;
}

div.loginframe {
position: absolute; 
width: 400px;
height: 250px;
top: 50%;
left: 50%;
margin-top: -125px;
margin-left: -200px;
}

div.login_content {
position: absolute;
bottom: 0;
top: 0;
left: 0;
right: 0;
background-color: white;
margin: 17px 18px 17px 18px;
}

div.greeting {
padding-left: 10px;
border: 1px solid #D5D5D5;
background-color: #D5D5D5;
font-weight: bold;
line-height: 25px;
}

div.loginframe div.fields {
padding: 10px 10px 10px 6px;
border: 1px solid #D5D5D5;
position: absolute;
bottom: 0;
top: 25px;
left: 0;
right: 0;
}

/*-------------------------- Content left --------------------------*/
div.content_left,
div.card_content_left {
color: white;
background-image: url(../images/logo.png);
background-repeat: no-repeat;
background-position: left top;
padding-top: 100px;
min-height: 427px;
width: 193px;
position: absolute;	/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
top: 0; 			/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
bottom: 0;			/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
left: 0;			/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
}

div.content_left a {
color: white;
text-decoration: none;
}

/*-------------------------- Filter left -------------------------*/
div.menu_top_frame1 {
overflow: auto;
}

div.menu_top_content1,
div.card_menu_content1 {
height: 30px;
padding-left: 50px;
line-height: 30px;
font-weight: bold;
background-repeat: no-repeat;
background-image: url(../images/filter.gif);
background-position: 10px;
}

div.seperator {
font-weight: bold;
line-height: 20px;
padding-left: 15px;
}

div.menu_top_content2{
margin-top: 10px;
overflow: hidden;
}

div.menu_top_content2 a {
display: block;
height: 20px;
line-height: 20px;
padding: 0 5px 0 15px;
}

div.menu_top_content2 a.selected,
div.menu_top_content2 a:hover,
div.menu_top_content2 a.selected:hover  {
text-decoration: none;
}

/*------------------------ Functions left ------------------------*/
div.menu_bottom_frame1 {
width: 193px;
overflow: hidden;
position: absolute;	/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
bottom: 0;			/*Nicht ändern - Damit bleibt das Menü Functions unten!*/
}

div.menu_bottom_content1 {
height: 30px;
padding-left: 50px;
line-height: 30px;
font-weight: bold;
background-repeat: no-repeat;
background-image: url(../images/functions.gif);
background-position: 10px;
}

div.menu_bottom_content2,
div.card_bottom_content2 {
padding: 10px 5px 10px 15px;
}

div.menu_bottom_content2 a,
div.card_bottom_content2 a {
line-height: 24px;
padding-left: 5px;
vertical-align: bottom;
color: white;
text-decoration: none;
}

div.menu_bottom_content2 a:hover,
div.card_bottom_content2 a:hover {
text-decoration: underline;
}

/*----------------------------- Border right ---------------------------*/
div.frame_right {
position: absolute; 
left: 180px; 
top: 0; 
bottom: 0; 
right: 0;
margin: 25px 5px 5px 5px;
min-width: 720px;
min-height: 500px;
}

div.content_right_upper_left_corner {
background-image: url(../images/border/upper_left_corner.png);
background-repeat: no-repeat;
position: absolute; 
height: 17px;
width: 18px;
left: 0; 
top: 0; 
}

div.content_right_upper_border {
background-image: url(../images/border/upper_border.png);
position: absolute;
height: 17px;
left: 18px;
top: 0;
right: 18px;
}

div.content_right_upper_right_corner {
background-image: url(../images/border/upper_right_corner.png);
background-repeat: no-repeat;
position: absolute; 
height: 17px;
width: 18px;
top: 0; 
right: 0;
}

div.content_right_left_border{
background-image: url(../images/border/left_border.png);
background-repeat: repeat-y;
position: absolute;
width: 18px;
left: 0;
bottom: 17px;
top: 17px;
}

div.content_right_right_border{
background-image: url(../images/border/right_border.png);
background-repeat: repeat-y;
position: absolute;
width: 18px;
right: 0;
bottom: 17px;
top: 17px;
}

div.content_right_lower_left_corner{
background-image: url(../images/border/lower_left_corner.png);
background-repeat: no-repeat;
position: absolute; 
height: 17px;
width: 18px;
left: 0; 
bottom: 0; 
}

div.content_right_lower_border{
background-image: url(../images/border/lower_border.png);
position: absolute;
height: 17px;
left: 18px;
bottom: 0;
right: 18px;
}

div.content_right_lower_right_corner {
background-image: url(../images/border/lower_right_corner.png);
background-repeat: no-repeat;
position: absolute; 
height: 17px;
width: 18px;
bottom: 0; 
right: 0;
}

/*--------------------------- Content right ----------------------------*/
div.content_right, 
div.card_content_right{
position: absolute; 
left: 0;
top: 0; 
bottom: 0; 
right: 0;
margin: 17px 18px;
color: black;
background-color: white;
overflow: auto;
min-height: 457px;
min-width: 684px;
overflow: auto;
}

div.simple_border{
border: 1px solid #D5D5D5;
margin: 10px 0;
padding: 10px;
overflow: hidden;
}

div.simple_border_without_margin{
border: 1px solid #D5D5D5;
padding: 5px;
overflow: hidden;
}

/*------------------------ Content/ Header -------------------------*/
div.content_header,
div.content_header_text, 
div.card_header,
div.card_header_text {
height: 30px;
line-height: 30px;
padding-left: 10px;
font-weight: bold;
margin-bottom: 10px;
background-color: #D5D5D5;
border: 1px solid #D5D5D5;
}

/*---------------------------- Paging -----------------------------*/
div.content_paging_frame {
position: absolute; 
top: 40px;
left: 0; 
right: 0;
height: 40px;
background-color: #EDEDED;
border: 1px solid #D5D5D5;
}

div.content_paging {
float: right;
height: 25px;
margin: 8px 10px 0 0;
width: 200px;
}

div.paging_counter {
float: left;
line-height: 25px;
}

div.paging_element {
float: right;
margin-left: 5px;
}

div.paging_element a.active,
div.paging_element span.inactive {
display: block;
text-decoration: none;
}

div.paging_element a.active:hover {
text-decoration: none;
}

div.paging_element img {
border: none;
}

/*------------------------- List --------------------------*/
div.list {
position: absolute; 
top: 80px; 
right: 0; 
left: 0; 
bottom: 205px;
overflow: auto; 
border: 1px solid #D5D5D5;
}

table.list_table {
width: 100%;
border-collapse: collapse;
padding: 0 5px;
height: 25px;
}

table.list_table a{
text-decoration: none;
}

table.list_table th {
background-color: #D5D5D5;
font-weight: normal;
text-align: left;
color: black;
}

table.list_table th a {
color: black;
text-decoration: none;
}

table.list_table td.inner,
table.list_table th.inner,
table.list_table td.inner_icon,
table.list_table th.right,
table.list_table td.right,
.entries_table_new_line td.inner,
.entries_table_new_line th.inner,
.entries_table_new_line td.inner_icon,
.entries_table_new_line th.right,
.entries_table_new_line td.right {
padding: 0 1px;
height: 25px;
}

table.list_table th.left {
padding-left: 3px;
color: black;
}

table.list_table td.left {
padding-left: 3px;
}

table.list_table tr.odd {
background-color: white;
}

table.list_table tr.even {
background-color: #EDEDED;
}

table.list_table td img{
top: 2px;
border: none;
position: relative;
}

table.list_table td.inner img{
vertical-align: middle;
margin-bottom: 4px;
}

table.list_table td.inner input,
table.list_table td.inner select,
table.list_table td.right input,
table.list_table td.right select,
.entries_table_new_line td.inner input,
.entries_table_new_line td.inner select,
.entries_table_new_line td.right input,
.entries_table_new_line td.right select{
border: 1px solid #D5D5D5;
background-color: white;
white-space: nowrap;
vertical-align: middle;
font-family: Arial, sans-serif;
font-size: 12px;
}

/*-------------------------- New entry form ------------------------*/
div.content_newentry_frame {
position: absolute; 
bottom: 0;
left: 0; 
right: 0;
height: 195px;
border: 1px solid #D5D5D5;
}

div.content_newentry_header {
height: 45px;
background-color: #EDEDED;
overflow: hidden;
padding: 5px;
}

div.content_newentry_header_content_left {
margin-right: 100px;
}

div.content_newentry_header_content_right {
position: absolute;
right: 5px;
top: 10px;
}

.content_newentry_formframe{
position: absolute;
top: 55px;
left: 0;
right: 0;
bottom: 0;
overflow: auto;
}

td.errors {
padding-left: 5px;	
color: red;
}

input.description {
margin-top: 2px;
}

/*------- Service Line List (i.e. suggestion lines) and Status List ---------*/
div.suggestion_list {
margin-top: 5px;
border: 1px solid #D5D5D5;
}

div.comment_form {
margin-top: 10px;
}

div.status_list table.list_table {
border: 1px solid #D5D5D5;
width: 100%;
margin: 10px 0;
}

div.dialog div.button{
margin-left: 5px;
}

div.dialog div#notice {
clear: left;
padding-top: 3px;
margin-left: 5px;
color: red;
}

/*------------- Transfer, Summary, Password, and New Absence --------------*/
div.transfer_list table.list_table {
border: 1px solid #D5D5D5;
}

div.password_form {
margin: 10px 0;
padding: 10px;
border: 1px solid #D5D5D5;
}

div.absence_form {
margin: 10px 0;
padding: 10px;
border: 1px solid #D5D5D5;
}

/*------------------------------ Card -------------------------------*/
div.card_warning {
margin: 10px 0;
padding: 10px;
border: 1px solid red;
}

div.card_text span.field_description {
font-weight: bold;
}

table.card td.field_caption_left,
table.card td.field_caption_right,
table.card td.field_data_right,
table.card td.field_data_left {
padding-right: 10px;
}

table.card td.field_data_left input,
table.card td.field_data_left select,
table.card td.field_data_right input,
table.card td.field_data_right select {
border: 1px solid #D5D5D5;
background-color: white;
}

table.card td.field_data_left input.inactive,
table.card td.field_data_right input.inactive {
border: 1px dotted #D5D5D5;
color: grey;
}

table.card tr td {
padding-bottom: 3px;
}

table.card td img {
border: none;
position: relative;
top: 3px;
}

table.card form.status {
margin: 0px;
width: 171px;
}

table.card select.status {
width: 145px;  
}

table.card form.status input{
position: relative;
border: none;
margin: 0px;
}

table.card td.table_error {
color: red;
}

/*---------------------------- Error page ----------------------------*/
div.error {
position: absolute;
bottom: 0;
top: 0;
left: 0;
right: 0;
background-color: white;
padding: 10px;
}

div.error h1 {
color: #CC0000;	
}

div.error p.message {
padding: 10px;
border: 1px solid #CC0000;
}

div.error div.image {
float: left;
margin: 20px 20px 0 10px;
}

/*------------------------------- Buttons  -----------------------------*/
div.button {
margin: 0 5px 5px 0;
float: left;
}

div.button a{
display: block;	
border: 0;
}

div.button a:hover{
border: 0;
}

.submit_button,
.submit_button a,
#submit_button,
#submit_button a{
background: url(../images/button.gif) no-repeat 0 -23px;
width: 74px;
height: 23px;
border: none;
padding-bottom: 3px;
line-height: 23px;
text-align: center;
text-decoration: none;
color: black;
font-family: Arial, sans-serif;
}

.submit_button:hover,
.submit_button a:hover,
#submit_button:hover,
#submit_button a:hover {
background: url(../images/button.gif) no-repeat;
cursor: pointer;
}

.submit_button2,
.submit_button2 a,
#submit_button2,
#submit_button2 a{
background: url(../images/button.gif) no-repeat 0 -23px;
width: 74px;
height: 20px;
border: none;
padding-bottom: 3px;
line-height: 23px;
text-align: center;
text-decoration: none;
color: black;
}

.submit_button2:hover,
.submit_button2 a:hover,
#submit_button2:hover,
#submit_button2 a:hover {
background: url(../images/button.gif) no-repeat;
cursor: pointer;
}

.submit_button_long,
.submit_button_long a,
#submit_button_long,
#submit_button_long a{
background: url(../images/button_long.gif) no-repeat 0 -23px;
width: 128px;
height: 23px;
border: none;
padding-bottom: 3px;
line-height: 23px;
text-align: center;
text-decoration: none;
color: black;
font-family: Arial, sans-serif;
}

.submit_button_long:hover,
.submit_button_long a:hover,
#submit_button_long:hover,
#submit_button_long a:hover {
background: url(../images/button_long.gif) no-repeat;
cursor: pointer;
}

.submit_button_login,
.submit_button_login a{
background: url(../images/login.gif) no-repeat 0 -23px;
width: 69px;
height: 23px;
border: none;
padding-bottom: 3px;
line-height: 23px;
text-align: right;
text-decoration: none;
color: black;
padding-right: 5px;
}

.submit_button_login:hover {
background: url(../images/login.gif) no-repeat;
cursor: pointer;
}

.button_expenses {
background: url(../images/expenses.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

.button_expenses:hover{
background: url(../images/expenses.gif) no-repeat;
}

.button_expenses_empty {
background: url(../images/expenses_empty.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

.button_expenses_empty:hover{
background: url(../images/expenses_empty.gif) no-repeat;
}

.button_new {
background: url(../images/new.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
}

.button_new:hover{
background: url(../images/new.gif) no-repeat;
}

input.button_save{
background: url(../images/save.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
border: none;
}

input.button_save:hover {
background: url(../images/save.gif) no-repeat;
cursor: pointer;
}

.button_delete{
background: url(../images/delete.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
margin-top: 4px;
}

.button_delete:hover {
background: url(../images/delete.gif) no-repeat;
}

#button_next{
background: url(../images/next.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

#button_next:hover {
background: url(../images/next.gif) no-repeat;
}

#button_first{
background: url(../images/first.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

#button_first:hover {
background: url(../images/first.gif) no-repeat;
}

#button_previous{
background: url(../images/previous.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

#button_previous:hover {
background: url(../images/previous.gif) no-repeat;
}

#button_last{
background: url(../images/last.gif) no-repeat 0 -23px;
width: 26px;
height: 23px;
float: left;
}

#button_last:hover {
background: url(../images/last.gif) no-repeat;
}

/*--------------------------- Calendar -----------------------------*/
div.calendar input {
width: 6em;
}

div.calendar_frame{
float: left;
margin-right: 10px;
display: block;
}