@charset "utf-8";
/* Begin of the Login and Registration Form */
.error_message {
	display: ;
}
.container a.psw_forgot {
	color: #006C00;
	text-decoration: none;
}
.container a.psw_forgot:hover {
	text-decoration: underline;
}
#info_box {
	position: absolute;
	margin: 1%;
	padding: 1%;
	width: 30%;
	height: auto;
	top: 50%;
    left: 50%;
	font-size: 20px;
	transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
	color: #FFF;
	text-align: center;
	border: 1px solid #333;
	box-shadow: 3px 3px 3px #252525;
	background-color: #AE0000; 
}
#info_box a {
	color: #FFF;
	text-decoration: none;
}
#info_box a:hover {
	text-decoration: underline;
}
#login_top {
	position: absolute;
    top: 50%;
    left: 50%;
	width: 100%;
	text-align: center;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
	background-color: rgb(255, 255, 255, 0.3);	
}
#login_top img {
	position: absolute;
	left: 40%;
	width: 7%;
	height: auto;
}
/* Full-width input fields */
.container input[type=text], input[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
}

/* Set a style for all buttons */
.container button, #login_top button {
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 200px;
	background-color: #090;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}

.container button:hover, #login_top button:hover {
    background-color: #006C00;
}

/* Extra styles for the cancel button */
.container button.cancelbtn {
    width: 200px;
    padding: 10px 18px;
    background-color: #C00;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
.container button.cancelbtn:hover {
    width: 200px;
    padding: 10px 18px;
	background-color: #006C00;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}

/* Center the image and position the close button */
.imgcontainer {
    text-align: center;
    margin: 24px 0 12px 0;
    position: relative;
}

img.logo {
    width: 40%;
}

.container {
    padding: 16px;
}

span.psw {
    float: right;
    padding-top: 16px;
}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    padding-top: 60px;
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 5% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button (x) */
.close {
    position: absolute;
    right: 25px;
    top: 0;
    color: #000;
    font-size: 35px;
    font-weight: bold;
}
.close:hover,
.close:focus {
    color: red;
    cursor: pointer;
}

/* Add Zoom Animation */
.animate {
    -webkit-animation: animatezoom 0.6s;
    animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}
    
@keyframes animatezoom {
    from {transform: scale(0)} 
    to {transform: scale(1)}
}

/* Change styles for span and cancel button on extra small screens */
@media only screen and (max-width: 1024px) and (min-width: 300px) {
span.psw {
     display: block;
     float: none;
}
.cancelbtn {
     width: 100%;
}
#login_top img {
	position: relative;
	left: 0%;
	width: 60%!important;
	height: auto;
}
#info_box {
	width: 90%;	
}
}
/* End of the Login and Registration Form */
body {
	background-color: #91CB8D;
	font-family: Calibri, "MS Serif", "New York", serif;
	font-size: 14px;
	transition: background-color .5s; /* for sidebar transition effect */
}
#container {
	margin: 0px auto;
	padding: 0px;
	position: relative;
}
h1 {
	margin: 0px;
	padding: 0px;
	font-size: 28px;
}
p {
	margin: 0px;
	padding: 5px;
}
#infobox {
	top: 200px;
	left: 30%;
	margin: 50px 0px 0px 0px;
	padding: 50px 0px 0px 0px;
	width: 500px;
	height: 120px;
	text-align: center;
    color: #fff;
	border: 2px solid #000;
	box-shadow: 5px 5px 5px #252525;
	background-color: #C90115;
	position: absolute;
}
.navbtn {
	color: #fff;
	text-decoration: none;
	text-align: center;
	display: block;
	margin: 0px 0px 30px 0px;
	padding-top: 10px;
	width: 269px; /* originally 268 */
	height: 30px;
	background-color: #E2072E;
	border: 1px solid #333;
	font-size: 16px;
	font-weight: bold;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
.navbtn.exp {
	background-color: #006C00;
}
.navbtn.exp:hover {
	background-color: #090; /* #C00513 */
}
.navbtn:hover {
	background-color: #090; /* #C00513 */
	cursor: pointer;
}
.navbtn.exp {
	background-color: #006C00;
}
#navbtns {
	padding-top: 10px;
	padding-bottom: 50px;
	width: 50%;
	height: 45px;
	float: left;
	position: relative;
}
#navbtns ul {
	margin: 0px;
	padding: 0px;
  	list-style: none;
}
#navbtns ul li {
	margin: 0px 20px 0px 0px;
	padding: 0px;
  	float: left; 
}
#displaybtn {
	margin: 20px 0px 0px 0px;
	width: 50%;
	height: 45px;
	float: left;
	position: relative;
}
#urbtn {
	margin: 0px;
	padding: 0px;
}
#urbtn p {
	margin: 0px;
	padding: 3px 0px 0px 0px;
}
#btn_update {
	width: 100px;
	color: #FFF;
	border: 1px solid #CCC;
	border-radius: 0px;
	padding-bottom: 2px;
	background-color: #090;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;
}
#btn_update:hover {
	background-color: #0C0;
	cursor: pointer;
}
#btn_delete {
	width: 100px;
	color: #FFF;
	border: 1px solid #CCC;
	border-radius: 0px;
	padding-bottom: 2px;
	background-color: #E2072E;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;
}
#btn_delete:hover {
	background-color: #F00;
	cursor: pointer;
}
#search {
	padding-top: 10px;
	padding-right: 5%;
	width: 45%;
	height: 45px;
	float: left;
	position: relative;
	text-align: right;
}
/* Response */
#container_response {
	margin: 0px auto;
	padding: 0px;
	width: 704px;
	position: relative;
}
#alert {
	margin: 50px 0px 0px 0px;
	padding: 50px 0px 50px 0px;
	width: 700px;
	height: auto;
	text-align: center;
    color: #fff;
	border: 2px solid #000;
	background-color: #2B9827;
	box-shadow: 5px 5px 5px #252525;
	position: relative;
}
#alert p {
    font-size: 28px;
	text-align: center;
	font-weight: bold;
}
#alert ul {
    margin: 0px 0px 0px 100px;
	list-style: none;
}
#alert ul li p  {
    text-align: left;
	font-style: italic;
	font-size: 25px;
}
#reply_nav {
	margin: 30px 0px 0px 0px;
	padding: 0px;
	width: 704px;
	text-align: center;	
	position: relative;
}
#reply_nav ul {
	margin: 0px 0px 0px 30px;
	padding: 0px;
	list-style: none;
	/*display: inline-block;*/
}
#reply_nav ul li  {
	margin: 0px 0px 0px 40px;
	padding: 0px;
	position: relative;
	float: left;
}
/* End of Response */
#mid {
	margin: 0px auto;
	padding: 0px;
	position: relative;
	height: auto;
}
#main {
	margin: 0px auto;
	padding: 0px;
	width: 920px; /* 860px */
	height: auto;
	position: relative;
}
/* Left side */
#left {
	margin: 0px 30px 0px 0px;
	padding: 0px;
	width: 270px;
	height: auto;
	float: left;
	position: relative;
}
#nav {


	margin: 0px;
	padding: 0px;
	width: 270px;
	height: 42px;
	position: relative;
	float: left;
	box-shadow: 5px 5px 5px #575757;
}
#info {
	margin: 0px 30px 30px 0px;
	padding: 10px 0px 10px 10px;
	width: 260px;
	background-color: #aedce1;
	position: relative;
	float: left;
	box-shadow: 5px 5px 5px #575757;
}
#company_info {
	margin: 0px 0px 0px 0px;
	padding: 10px 0px 10px 10px;
	width: 260px;
	position: relative;
	float: left;
	background-color: #CFCFCF; 
	box-shadow: 5px 5px 5px #575757;
}
#health_insurance {
	margin: 30px 0px 0px 0px;
	padding: 10px 0px 10px 10px;
	width: 260px;
	position: relative;
	float: left;
	background-color: #CFCFCF; 
	box-shadow: 5px 5px 5px #575757;
}
#health_insurance p {
	margin: 0px;
	padding: 0px;
}
#health_box_info {
	margin: 0px;
	padding: 0px;
	width: 50%;
	position: relative;
	float: left;
}
#health_insurance_btn {
	margin: 0% 2% 0% 0%;
	padding: 0px;
	width: 48%;
	position: relative;
	float: right;
}
#health_insurance_btn a {
	float: right;
}
#company_info table.co_info td {
	border: 0px; 
}
#company_info .co_info a {
	color: #ED030A;
	text-decoration: none;
}
#company_info .co_info a:hover {
	text-decoration: underline;
}
#company_info h2 {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	text-align: left;
}
#container_btn_update_info {
	margin: 0px 5px 0px 0px;
	padding: 0px;
}
#btn_update_company {
    width: 100px;
	color: #FFF;
	border: 1px solid #CCC;
	border-radius: 0px;
	padding: 0px 0px 2px 0px;
	display: block;
	font-size: 14px;
	text-decoration: none;
	text-align: center;
	background-color: #4F4F4F;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;
}
#btn_update_company:hover {
	background-color: #8B8B8B;
}
.content_table {
	width: 99%;
}
#here_display_list input.except5 {
	width: 180px;
}
/* End of left side */
/* Begin of the middle part */
#search_main {
	margin: 0px;
	padding: 8px 0px 0px 0px;
	width: 270px;
	height: 34px;
	background-color: #D1D1D1;
	position: relative;
	float: left;
	text-align: center;
}
#form {
	margin: 0px;
	padding: 5px 20px 20px 30px;
	width: 220px;
	background-color: #EAEAEA;
	position: relative;
	float: left;
}
/* End of the middle part */
/* Right side */
#right {
	margin: 0px 30px 0px 0px;
	padding: 0px;
	width: 270px;
	float: left;
	position: relative;
	box-shadow: 5px 5px 5px #575757;
}
#info_news {
	margin: 0px ;
	padding: 0px 10px 10px 10px;
	width: 300px;
	background-color: #DDD;
	position: relative;
	float: left;
	box-shadow: 5px 5px 5px #575757;
}
#info_news table td {
	border-bottom: 1px;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
}
#news_box {
	margin: 0px 0px 20px 0px;
	padding: 0px;
	width: 300px;
	background-color: #090;
	border: 1px solid #000;
	text-align: center;
}
#news_box h2 {
    margin: 0px;
	padding: 5px;
	color: #fff;
}
#activ_tasks table.termin_update {
    margin: 0px;
	padding: 0px;
	width: 100%;
	/*border: 1px solid #000;*/
	text-align: center;
}
#activ_tasks table.termin_update th {
	background-color: #BCBCBC;
}
#activ_tasks table.termin_update .td_except {
	text-align: left;
}
a.termin_link {
    margin: 0px;
	padding: 0px;
	color: #3C7B3E;
	font-weight: bold;
	text-decoration: none;
	-webkit-transition: color 400ms ease-out;
 	-moz-transition: color 400ms ease-out;
  	-o-transition: color 400ms ease-out;
  	transition: color 400ms ease-out;
}
a.termin_link:hover {
    margin: 0px;
	padding: 0px;
	color: #F00;
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;
}
p.termin {
	color: #F00;
	font-weight: bold;
}
#prices {
	margin: 30px 0px 0px 0px;
	padding: 0px 10px 10px 10px;
	width: 300px;
	background-color: #DDD;
	position: relative;
	float: left;
	box-shadow: 5px 5px 5px #575757;
}
#info_prices h1, h2, h3 {
	text-align: center;
}
#prices .table_prices {
	width: 75%;
}
#prices .table_prices td {
	border: 0px; 
}
#price_box {
	margin: 5px 0px 0px 0px;
	padding: 10px 0px 0px 0px;
	width: 100%;
	position: relative;
	float: left;
	border-top: 1px solid #999;
}
#prices_update_btn {
	margin: 0px;
	padding: 0px;
	width: 50%;
	position: relative;
	float: left;
}
#prices_link {
	margin: 0px;
	padding: 0px;
	width: 50%;
	position: relative;
	float: left;
	text-align: right;	
}
#prices_link a {
	float: right;
}
/* End of right side */
#here_display_list input.termin {
	color: #F00;
	font-weight: bold;
	text-align: center;
	width: 40px;
}
#edit_form {
	margin: 30px 0px 0px 0px;
	padding: 5px 20px 20px 30px;
	background-color: #EAEAEA;
	position: relative;
}
#here_display_list input {
	width: 120px;
}
#here_display_list input.except {
	width: 50px;
}
#here_display_list input.except2 {
	width: 20px;
	text-align: center;
}
#here_display_list input.except3 {
	width: 90px;
}
#here_display_list input.except4 {
	width: 40px;
}
#main_content {
	margin: 0px auto; /* 0px 15px 0px 0px */
	padding: 0px 0px 0px 5px;
	width: 1650px; /* 105% length of the main content and bg of the table with SQL results  */
	background-color: #EFEFEF;
	position: relative;
	box-shadow: 5px 5px 5px #252525;
}
table.content_table {
	width: 80%;
	margin: 0px;
	border: solid 1px #C8C8C8;
	padding-bottom: 10px;
}
table.content_table td {
	height: 80px;
}
table.content_table th, td {
	padding: 5px;
	border: solid 1px #C8C8C8;
}
table.content_table th {
	text-align: left;
}
table.content_table td {
	text-align: center;
}
#here_display_list th {
	text-align: center;	
}
#here_display_list th.except {
	width: 110px;
	text-align: center;	
}
/* Pagination */
#pagination {
	margin: 20px auto;
	padding: 0px 0px 30px 0px;
	width: 100%;
	height: auto;
	font-size: 16px;
}
#pagination_container {
	margin: 0px auto;
	padding: 10px 0px 5px 0px;
	width: 500px;
}
#pagination_info_txt {
	margin: 0px;
	padding: 1% 0% 0% 0%;
	width: 100%;
	height: 30px;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	position: relative;
}
#back {
	margin: 0px;
	padding: 0px;
	width: 110px;
	height: auto;
	font-size: 16px;
	text-align: right;
	position: relative;
	float: left;
}
#choose_page {
	margin: 0px;
	padding: 5px 0px 0px 0px;
	width: 200px;
	height: 25px;
	font-size: 16px;
	text-align: center;
	position: relative;
	float: left;
	background-color: #85D391; 
}
#next {
	margin: 0px;
	padding: 0px;
	width: 110px;
	height: auto;
	font-size: 16px;
	text-align: left;
	position: relative;
	float: left;
}
#first_page {
	margin: 0px;
	padding: 0px;
	width: 40px;
	height: auto;
	font-size: 15px;
	text-align: left;
	position: relative;
	float: left;
}
#first_page a.first_result {
	margin: 0px;
	padding: 5px;
	width: 30px;
	height: auto;
	display: block;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	background-color: #36622F;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
#first_page a.first_result:hover {
	background-color: #33A636;
	cursor: pointer;
}
#last_page {
	margin: 0px;
	padding: 0px;
	width: 40px;
	height: auto;
	font-size: 15px;
	text-align: left;
	position: relative;
	float: left;
}
#last_page a.last_result {
	margin: 0px;
	padding: 5px;
	width: 30px;
	height: auto;
	display: block;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	background-color: #B70214;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
#last_page a.last_result:hover {
	background-color: #FF001A;
	cursor: pointer;
}
#pagination a {
	color: #000;
	text-decoration: none;
}
#pagination a.active_nav {
	color: #FFF;
}
span.alert_info {
	color: #FFF;
	font-weight: bold;
}
#back a.page_back {
	margin: 0px;
	padding: 5px;
	width: 100px;
	height: 20px;
	display: block;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	background-color: #B70214;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
#back a.page_back:hover {
	background-color: #FF001A;
	cursor: pointer;
}
#next a.page_next {
	margin: 0px;
	padding: 5px;
	width: 100px;
	height: 20px;
	display: block;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	background-color: #36622F;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
}
#next a.page_next:hover {
	background-color: #33A636;
	cursor: pointer;
}
/* End of Pagination */
#btn_invoice {
    width: 100px;
	color: #FFF;
	border: 1px solid #CCC;
	border-radius: 0px;
	padding: 0px 0px 2px 0px;
	display: block;
	font-size: 14px;
	text-decoration: none;
	background-color: #4F4F4F;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;
}
#btn_invoice:hover {
	background-color: #8B8B8B;
	cursor: pointer;
}
/* Link in the list leading to the invoice table */
a.invoice_link {
   color: #F00;
   text-decoration: none;
   -webkit-transition: color 400ms ease-out;
   -moz-transition: color 400ms ease-out;
   -o-transition: color 400ms ease-out;
   transition: color 400ms ease-out;
}
a.invoice_link:hover {
   color: #C00;
   text-decoration: underline;
}
/* Endo of Link in the list leading to the invoice table */
/* Begin of invoice table */
#invoice_display_list th {
	height: 50px;  		
}
#invoice_display_list td {
	background-color: #FDFDFD; 	/* Color of the cell invoice table */
}
#invoice_list {
   width: auto;
   height: auto;
   margin: 30px 0px 0px 0px;
   padding: 0px;
}
#invoice_display_list table.content_table {
   width: 99%;
   height: auto;
   margin: 0px 0px 0px 0px;
   padding: 0px;
}
#invoice_display_list table.content_table th {
   text-align: center;
}
.invoice_table {
   width: auto;
   height: auto;
   margin: 0px;
   padding: 0px;
}
.invoice_table td.inv_icon {
   width: 150px;
   height: 200px;
   margin: 0px;
   padding: 0px;
   text-align: center;
   background-color: #FFF;
   box-shadow: 3px 3px 3px #D7D7D7;
}
.invoice_table td.inv_icon a {
    width: 150px;
	height: 170px;
	color: #000;
	border: 1px solid #CCC;
	border-radius: 0px;
	padding: 30px 0px 0px 0px;
	display: block;
	font-size: 14px;
	text-decoration: none;
	text-align: center;
	background-color: #FDFDFD;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;			
}
.invoice_table td.inv_icon a:hover {
	border: 1px solid #800;
	background-color: #C40000;
	color: #FFF;
	-webkit-transition: background-color 400ms ease-out 0.1s;
    -moz-transition: background-color 400ms ease-out 0.1s;
    -o-transition: background-color 400ms ease-out 0.1s;
    transition: background-color 400ms ease-out 0.1s;			
}
/* End of invoice table */

/* Start of sidebar navigation */
#nav_btn a {
	cursor:pointer;
	position: fixed;
	top: 90px;
	left: -45px;
	z-index: 3;
	color: #fff;
	text-decoration: none;
	text-align: left;
	margin: 0px;
	padding: 5px 0px 0px 10px;
	width: 45px; 
	height: 50px;
	background-color: #E2072E;
	border: 1px solid #333;
	border-radius: 0 5px 5px 0;
	font-size: 30px;
	font-weight: bold;
	box-shadow: 4px 4px 4px #666;
	-webkit-transition: background-color 800ms ease-out;
 	-moz-transition: background-color 800ms ease-out;
  	-o-transition: background-color 800ms ease-out;
  	transition: background-color 800ms ease-out;
	transition: 0.5s;
}
#nav_btn a:hover {
	left: 0px;
	transition: 0.5s;
	background-color: #090; /* #C00513 */
	cursor: pointer;
}
#mySidenav .navbtn {
	box-shadow: 5px 5px 5px #000;
}
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0, 0.9);  /* Transparenz effect */
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 200px;
}
.sidenav ul {
	margin: 0px;
	padding: 0px;
	list-style: none;
}
.sidenav li {
	margin-bottom: -10px;
	padding: 0px;
}
.sidenav a {
	padding-left: 10px;
    text-align: left;
}
.sidenav a:hover {
    color: #f1f1f1;
}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
	color: #818181;
	text-decoration: none;
}
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
/* End of sidebar navigation */
/* Overlay effect */
#overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5);
    z-index: 2;
    cursor: pointer;
	color: white;
}
#intro_text {
    position: absolute;
    top: 30%;
    left: 50%;
    font-size: 50px;
	text-align: center;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}
#white_stripe {
	margin: 0px;
	padding: 0px;
    width: 100%;
    height: 150px;
	top: 40%;
	position: relative;
    background-color: rgba(255,255,255, 0.4);
    z-index: 1;
	text-align: center;
}
#overlay .except {
	font-size: 20px;
}
#overlay span.bigger {
	font-size: 30px;
}
/* for index - under construction */
#under_construction {
    position: absolute;
    top: 30%;
    left: 50%;
    font-size: 50px;
	text-align: center;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
	background-color: #EFEFEF;
}
/* End of Overlay effect */
/* Begin of the Termin info box */
#info_termin {
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 20px;
	padding: 10px;
	width: 200px;
	height: auto;
	text-align: center;
    color: #fff;
	border: 1px solid #333;
	box-shadow: 3px 3px 3px #7D7D7D;
	background-color: #C90115;
}
#info_termin_box {
	display: none /* for jQuery fade in code */
}
/* End of the Termin info box */
/* Begin of Invoice (the styles for the invoice template were placed in a separate file style-invoice.css
#invoice_main {
	margin: 0px auto;
	padding: 20px;
	width: 100%;
	position: relative;
	clear: both;
	background-color: #FFF;	
}
#top_invoice {
	margin: 0px 0px 100px 0px;
	padding: 0px;
	width: 100%;
	position: relative;
} 
#top_invoice p {
	font-weight: bold;
} 
#date {
	margin: 0px;
	padding: 0px;
	width: 200px;
	float: right;
	position: relative;
	text-align: right;
}
#top_invoice table td {
	border: 0px;
}
#middle_invoice {
	margin: 100px 0px 0px 0px;
	padding: 0px;
	width: 100%;
	position: relative;
}
#middle_invoice h1, h2, h3 {
	text-align: center;
}
#middle_invoice p.invoexcpt {
	text-align: left;
}
#main_box_info {
	width: 100%;
	position: relative;
	color: #999;
	background-color: #FCFCFC; 
	border-top: 1px solid #E1E1E1;
	border-bottom: 1px solid #E1E1E1;
}
#main_box_info p {
	margin: 0px;
	padding: 0px;
	font-size: 14px;
}
#main_top_info {
	margin: 10px 0px 20px 0px;
	padding: 0px;
	width: 100%;
	text-align: center;
}
#main_top_info p {
	font-size: 25px;
}
#main_left_info {
	width: 30%;
	position: relative;
	float: left;
	text-align: left;
}
#main_left_info a {
	text-decoration: none;
	color: #999;
}
#main_middle_info {
	width: 40%;
	position: relative;
	float: left;
}
#main_recht_info {
	width: 30%;
	position: relative;
	float: left;
	text-align: right;
}
#main_bottom_info {
	padding: 10px 0px 10px 0px;
	width: 100%;
	text-align: center;
	clear: both;
}
#date {
	margin: 0px;
	width: 100%;
	position: relative;
	float: left;
}
#invoicenr {
	margin: 0px 0px 50px 0px;
	width: 100%;
	position: relative;
	float: left;
}
#invoicenr p {
	margin: 0px;
	padding: 0px;
}
#middle_invoice table {
	width: 100%;
	border: 0px;
}
#middle_invoice table td {
	border: 0px;
}
#payment_cond {
	margin: 100px 0px 0px 0px;
	padding: 0px;
	width: 100%;
	position: relative;
	float: left;
	text-align: center;
}
#footer_inv {
	margin: 300px 0px 0px 0px;
	padding: 0px;
	border-top: 1px solid #E1E1E1;
	border-bottom: 1px solid #E1E1E1;
	background-color: #FCFCFC; 
	width: 100%;
	clear: both;
}
 End of Invoice */