body {
font-family: sans-serif;
}

a {
cursor:pointer;
color: #7d7d7d;
}

#index_header {
margin-left: 5%;
margin-top: 5%;
font-size: 2em;
font-family: monospace;
color: #ff5733;
display: flex;
}

#index_logo {
padding-left: 2%;
}

#new_div {
height: 40px;
color: #7d7d7d;
display: flex;
align-items: center;
justify-content: center;
margin-top: 10%;
}

#login_form {
height:40%;
display: flex;
align-items: center;
justify-content: center;
background-color: #fafafa;
}

#login_tab {
width: 30%;
}

#login_text {
height: 75px;
color: #7d7d7d;
}

#login_input {
}

#login_input_field {
height: 40px;
width: 100%;
border: 2px solid #e7e7e7;
}
#password_text {
height: 75px;
color: #7d7d7d;
}

#password_input {
}

#password_input_field {
height: 40px;
width: 100%;
border: 2px solid #e7e7e7;
}


#button_field {
}

#button {
height: 40px;
width: 100%;
background-color:#ff5733;
color: white;
font-weight: bold;
border: none;
box-shadow: none;
}

#container {
	margin-left: 5%;
	margin-top: 5%;
	margin-right: 5%;
}

#header {
    font-size: 2em;
    color: #FF5733;
    font-family: monospace;
    display: flex;
}

#logo {
    padding-left: 2%;
}

#menu {
    margin-top: 5%;
}

#navi {
    color: #7d7d7d;
    display: flex;
	justify-content: flex-start;
	padding-left: 0px;
}

#navi li {
    display: inline;
    margin-right: 3px;
    border-top: 4px solid #aaaaaa;
    padding: 20px 5px 5px 5px;
    background-color: #fafafa;
width: 10.25%;
text-align:center;  
}

#navi li:hover {
    background-color: #efefef;
    border-top: 4px solid #FF5733;
}

#navi li a:hover{
    text-decoration: none;
	color: #7d7d7d;
}

#navi li a:visited {
    color: #7d7d7d;
    text-decoration: none;
    
}

#navi li a:focus {
	color:#7d7d7d;
}

#navi li a:active {
	color: #7d7d7d;
}

#navi li a:visited:hover {
	color: #7d7d7d;
}

#navi_accounts_list {
    position: absolute;
    display: block;
    transition: 0.5s;
    background-color: #fafafa;
    top: 230px; 
    visibility: hidden;
}

#navi_accounts_list:hover {
    visibility: visible;
}

#accounts {
    position: relative;
    transition: 0.5s;
    box-sizing: border-box;
}

#main_menu {
    margin-bottom: 5%;
}


table {    
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 0px;
    font-size: 0.9em;
}

table a {
    padding-left: 10px;
    border-left: 4px solid transparent;
}

table a:hover {
     border-left: 4px solid #FF5733;
    color: #333;
}

table a:visited {
    color: #7d7d7d;
    text-decoration: none;
    
}

td {
    padding: 10px 10px;
}
#overview_title, #account_title, #statistics_title, #email_title, #logout_title {
    color: #7d7d7d;
}

#overview_text, #account_text, #statistics_text, #email_text, #logout_text {
    padding-left:60px;
}

#footer {

box-sizing: border-box;
width:100%;
display:flex;
align-items: center;
justify-content: flex-start;

border-top: 1px solid #bbbbbb;
background: #efefef;
color: #999999;
line-height: 20px;
text-align: left;
padding-left: 15px;
font-size: 9px;
}

#admin_footer {
	width: 10%;
}
#log_footer {
	width: 20%;
}
 
#domains_table {
	table-layout: fixed;
	width: 100%;
	height:50%;
}

#domains_table th {
	width: 15%;
}

#domains_headers_tr {
	height: 50px;
	width: 100%;
	background-color: #efefef;
	font-weight: lighter;
}
#domains_tr_1 {

	height: 50px;
}
#domains_table td {
	text-align: center;
}

#domains_status_icon {
	color: green;
}

#accounts_table {
	table-layout:fixed;
	width: 100%;
	
}
#accounts_headers_tr {
	height: 50px;
	background-color: #efefef;
}
#accounts_tr_1 {

	height: 50px;
}
#accounts_table td {
	text-align: center;
}


#accounts_info_div {
height: 75px;
display: flex;
justify-content: space-between;
font-size: 12px;
}

#accounts_info_form {
	width: 20%;
	display: flex;
align-items: center;
justify-content: center;	
}

#accounts_info_select {
	width: 150px;
	height: 35px;
}
#accounts_info_settings {
width: 32.5%;
height: 100%;
display:flex;
flex-direction: column;
justify-content: space-evenly;
color: #7d7d7d;
}

#accounts_info_header {
	font-weight: bold;
	display: flex;
	justify-content: center;
}
#accounts_info_in {
	width: 100%;
	display: flex;
	justify-content:flex-end;
}

#accounts_info_in_title {
	width: 30%;
display:flex;
justify-content: flex-end;
font-weight: bold;
}

#accounts_info_in_settings {
	width: 70%;
display:flex;
justify-content: center;
}

#accounts_info_out {
	display: flex;
	justify-content: flex-end;
}

#accounts_info_out_title {
	width: 30%;
display:flex;
justify-content: flex-end;
font-weight: bold;
}

#accounts_info_out_settings {
width: 70%;
display: flex;
justify-content: center;
}

#accounts_td_input, #accounts_edit_input {

	height: 35px;
	width: 100;
	background-color: #ff5733;
	border:none;
	color: white;
font-weight: bold;
font-sise: 12px;
}

#edit_container {

padding-top: 10px;
display: flex;
flex-direction: column;
justify-content: space-between;
color: #7d7d7d;
font-size: 12px;
box-sizing:border-box;
}

#edit_add_account {

height: 150px;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
box-sizing: border-box;}

#edit_add_account_header {
height: 40px;
background-color: #efefef;
font-size: 14px;
font-weight: bold;
display: flex;
align-items: center;
}

#edit_add_account_header_icon {
color: #ff5733;
background-color: #ff5733;
margin-right: 5px;
}

#user_form {
height: 50%;
width: 100%;
display:flex;
justify-content: space-between;
box-sizing: border-box;
}

#edit_username_input {
height: 40px;
}

#edit_password_input {
height: 40px;
}

#edit_password2_input {
height: 40px;
}
#edit_container_header {
height: 20%;
width: 100%;
font-weight: bold;
font-size: 14px;
box-sizing: border-box;
}

#edit_status_input, #edit_welcome_input {
	width: 25px;
	height: 25px;
}

#edit_save_form {
	width: 100px;
	height: 35px;
}

.save_button {
	width: 100px;
	height: 35px;
	background-color: #ff5733;
	color: white;
text-transform: capitalize;
	border: none;	
}

#edit_alias_account {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
box-sizing: border-box;	
}

#edit_alias_account_header{ 
height:40px;
width: 100%;
background-color: #efefef;
	font-size: 14px;
	font-weight: bold;
display: flex;
align-items: center;
	box-sizing: border-box;
}

#edit_alias_account_header_icon {
color: #ff5733;
background-color: #ff5733;
margin-right: 5px;
}

#edit_alias_account_content {

width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.alias-table {
width: 100%;
margin-top: 10px;
margin-bottom: 20px;

}


.alias-tr {
height: 40px;
	display: flex;
justify-content: flex-start;
border-bottom: 2px solid #efefef;
}
.alias-td {
width: 20%;
font-size: 12px;
color: #7d7d7d;
display: flex;
justify-content: flex-start;
}


#alias_td_icon {
width: 5%;
height: 100%;	
padding: 0px;
color: #7d7d7d;
display: flex;
align-items: center;
justify-content: center;
}

#alias_td_icon_button {
	height: 100%;
width: 100%;
background-color: transparent;
cursor: pointer;
color: #7d7d7d;
border:none;
box-shadow: none;
}

#alias_td_icon_button:hover {
color: black;

}
#edit_alias_account_form_header {
height: 20px;
width: 100%;
display:flex;
align-items: center;
justify-content:flex-start;
font-size: 14px;
font-weight: bold;
color: #7d7d7d;
background-color: #efefef;
margin-bottom: 20px;
} 

#edit_alias_table_header {
width: 100%;
height: 20px;
display: flex;
align-items: center;
justify-content: flex-start;
font-size: 14px;
font-weight: bold;
color: #7d7d7d;
background-color: #efefef;
margin-top: 20px;
}

#edit_alias_account_main {
width: 400px;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
}

#edit_alias_account_form {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
}

#edit_alias_account_input {
height: 40px;
width: 400px;
box-sizing: border-box;
}

#edit_alias_account_domainname {
width: 30%;
font-size: 14px;
display: flex;
justify-content: flex-end;
box-sizing: border-box;
}

#edit_umleitung {
display: flex;
flex-direction: column;

}
#edit_umleitung_header {
height: 40px;
background-color: #efefef;
font-size: 14px;
font-weight: bold;
display: flex;
align-items: center;
box-sizing: border-box;
}
#edit_umleitung_header_icon {
color: #ff5733;
background-color: #ff5733;
margin-right: 5px;
}

#forward_td_icon_button {
background-color: transparent;
border: none;
box-shadow: none;
}

#edit_umleitung_form {
display: flex;
align-items: center;
justify-content: space-between;	
}

#edit_umleitung_select {
height: 40px;
width: 400px;
margin-top: 20px;
background-color: white;
border: 1px solid #7d7d7d;
}

#edit_umleitung_block_checkbox {
display: flex;
flex-direction: column;
align-items: center;
}

#edit_umleitung_form_copy {
height: 25px;
width: 25px;
}
#edit_weiterleitung_header {
background-color: #efefef;
font-size: 14px;
font-weight: bold;
display:flex;
align-items: center;
box-sizing: border-box;
}

#edit_weiterleitung_header_icon {
color: #ff5733;
background-color: #ff5733;
margin-right: 5px;
}
#edit_weiterleitung_form {

display: flex;
align-items: center;
justify-content: space-between;
}

#edit_weiterleitung_input {
	height: 40px;
	width: 400px;
margin-top: 20px;
}

#edit_weiterleitung{
height: 150px;

}

#edit_abwesenheit {
height: 400px;
display: flex;
flex-direction:column;
justify-content: space-between;
}

#edit_abwesenheit_header {
height: 40px;
background-color: #efefef;
font-weight: bold;
font-size: 14px;
display: flex;
align-items: center;
box-sizing: border-box;
}

#edit_abwesenheit_header_icon{
color: #ff5733;
background-color: #ff5733;
margin-right: 5px;
}

#edit_abwesenheit_form {
display:flex;
flex-direction: column;
justify-content: space-between;
}

#edit_abwesenheit_block_subject {
width: 40%;
height: 60px;
display: flex;
flex-direction: column;
justify-content: center;
}

#edit_abwesenheit_subject {
height: 40px;
}

#edit_abwesenheit_von_input {
height: 40px;
}

#edit_abwesenheit_bis_input {
height: 40px;
}

#edit_abwesenheit_block_text {

width: 80%;
height: 200px;
display: flex;
flex-direction: column;
justify-content: center;
}

#edit_abwesenheit_text {
	height: 140px;
}

#edit_abwesenheit_block_active {
	height: 60px;
width: 5%;
display: flex;
flex-direction: column;
justify-content:center;
align-items: flex-start;
}

#edit_abwesenheit_input_toggle {
height: 25px;
width: 25px;
}

#edit_abwesenheit_block_daten {
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: space-between;
}
#edit_abwesenheit_block_daten_von {
width: 25%;
display: flex;
flex-direction: column;

}

#edit_abwesenheit_block_daten_bis {
width: 25%;
display: flex;
flex-direction: column;
}