html {
	/*height: 99%;*/
	
	margin: 4;
	font-family:arial, verdana;
	font-size:14px;
	//background-image: url('img/bg.jpg');
	//background-repeat:repeat-x;
	//float:left;
	}

body {
	/*height: 99%;*/
	margin: 4; 
	font-family:arial, verdana;
	font-size:14px;
	color:#606060;
	//background-color:#F2F2F2 ;
	
	}

	
/*
	a:link { text-decoration:none; 
	color:#FFB441;}
 a:visited { text-decoration:line-through; color:#FFB441;}
 a:hover { text-decoration:underline; color:#FFB441;}
 a:active { text-decoration:underline;color:#FFB441; }
 a:focus { text-decoration:blink;color:#FFB441; }
 */
div.header {
	color:#F2F2F2 ;
	background-color:#606060 ;
	height:30px;
	padding-left:5px;
	padding-top:10px;
	font-size:16px;
	}
	
div.result_name a:link,a:visited {
	color:#FF7800;
			text-decoration:none;
	}

.result_name {
	color:#FF7800;
			text-decoration:none;

display: inline-block;
  border:0px;
  //border: 1px solid silver;
  //border-radius: 5px;
  background-color: white;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  //color: #444;
  //text-decoration: none;
  //padding: 6px 10px 4px 10px;
  //margin: 5px 10px;

	}
	
div.details_name {
	font-weight: bold;
	}
div.details_geo a:link,a:visited {
	color:#FF7800;
			text-decoration:none;
	}
div.details_email a:link,a:visited {
	color:#FF7800;
			text-decoration:none;
	}
div.details_phone a:link,a:visited {
	color:#FF7800;
			text-decoration:none;
	}	

div.callerlist_phone a:link,a:visited {
	color:#FF7800;
			text-decoration:none;
	}	

.summary_header
	{
	background-color:#606060;
		//font-weight: bold;
		color:#F2F2F2 ;
		height:20px;
		padding-left:5px;
		padding-top:2px;

}
	div.invoice_header {
	//background-color:#FF7800;
		font-weight: bold;

}

div.invoice_header_year {
	color:#FF7800;
		font-weight: bold;
		font-size: 14px;

}	
div.details_header_contacts {
		color:#F2F2F2 ;
	background-color:#606060 ;
	height:20px;
	padding-left:5px;
	padding-top:3px;
	}
div.details_header_turnover {
		color:#F2F2F2 ;
	background-color:#606060 ;
	height:20px;
	padding-left:5px;
	padding-top:3px;
	}
div.details_info_header{
	color:#F2F2F2 ;
	background-color:#606060 ;
	height:20px;
	padding-left:5px;
	padding-top:3px;
	}
	
div.details_info_name {
	font-weight: bold;
}

div.header_search_results {
	font-weight: bold;
}

div.header_callerlist {
	font-weight: bold;
}

.button_login {
    background-color: #FF7800; 
    border: none;
    color: white;
    margin-left:5px;
	padding:3px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
}

.button_search {
    position:relative;
	background-color: #FF7800; 
    border: none;
    color: white;
    margin-left:5px;
	padding:3px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
	left:-4px;
	top:1px;
	height:21px;
}

/*
.button_search {
 background:url(img/search.png) no-repeat left center;
 //width:128px;
 //height:128px;
 border:0;
}
	*/


.search {
	border-bottom-color:#FF7800;
}

.button_logout {
    background-color: #FF7800; 
    border: none;
    color: white;
    margin-left:5px;
	padding:3px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
}

div.invoice_selling_price {
	text-align: right;
}
div.invoice_selling_value {
	text-align: right;
}
div.invoice_amount {
	text-align: right;
}

div.invoice_header_amount,div.invoice_header_price,div.invoice_header_value {
	font-size: 14px;
	text-align: right;
	font-weight:bold; 	
	min-width:20px;
}


div.invoice_desc, div.invoice_selling_value,div.invoice_header,div.invoice_amount,div.invoice_selling_price ,.button_menu {
	font-size: 14px;
	
}

div.login_user,div.login_passwort,div.login_cryptkey {
	font-size: 14px;
}

div.callerlist_date,div.callerlist_phone,div.callerlist_desc {
	font-size: 14px;
}

/*
div.table_invoice {
	vertical-align: top;
	border-bottom:1px solid black; 
	border-right:1px solid black
}
*/

div.table { 
      display: table; 
      border-collapse:collapse; 
	  width: 100%;
	  vertical-align: top;
    }
    div.tr { 
      display:table-row; 
	  border-bottom:1px solid #606060; 
    }
    div.td { 
      display:table-cell; 
      //border:thin solid red; 
      padding:1px; 
	  width:100%;
    }

.img_logo {
	position:absolute;
	top:13px;
	z-index: 1;
}

.search_box {

	position:absolute;
	top:15px;
	//left:50px;
	left:80px;
	z-index: 4;
}

/*
div.button_logout {
	height:23px; 
	background:url(img/logout.png) right no-repeat; 
	width:auto; 
	float:left;
	}
div.button_logout input {
	height:23px; 
	background:url(img/logout.png) left  no-repeat; 
	color:#ffffff; 
	font-weight:bold; 
	border:none; 
	overflow:visible; 
	display:inline; 
	margin:0px; 
	padding:0px 4px 2px 4px; 
	font-size:11px; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	}
*/
/*dropdown */

.dropbtn {
    //background-color: #4CAF50;
	background-color:#606060 ;
    color: white;
    padding: 1px;
    font-size: 8px;
    border: none;
    cursor: pointer;
	z-index: 999;
}

.dropdown {
    position: relative;
    display: inline-block;
	top: -10px;
	right: 10px;
	z-index: 999;
}

.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
	
    //background-color: #f9f9f9;
    min-width: 160px;
    //box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 999;
	color:#F2F2F2 ;
	background-color:#606060 ;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
	font-size: 14px;
	    z-index: 999;
	color:#F2F2F2 ;
	background-color:#606060 ;

}

.dropdown-content a:hover {
	background-color: #f1f1f1;
	color:#F2F2F2 ;
	background-color:#606060 ;
	
	}

.dropdown:hover .dropdown-content {
    display: block;
	z-index: 999;
}

.dropdown:hover .dropbtn {
    //background-color: #3e8e41;
}
/*drowdown*/


.button_menu {
	text-decoration:none;

	background: #ededed;
	color: #FF7800; 
	//color:#F2F2F2 ;
	//background-color:#606060 ;
	font-weight: bold;

			
display: inline-block;
  border:0px;
  //border: 1px solid silver;
  //border-radius: 5px;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  //color: #444;
  //text-decoration: none;
  padding: 6px 10px 4px 10px;
  margin: 5px 10px;
  text-align:left;
  //z-index: 1000;

	}

div.creationdate {
	text-decoration:none;
	color:#606060 ;
	//color:#F2F2F2 ;
	//background-color:#606060 ;
font-size:14px;
			
display: inline-block;
  border:0px;
  //border: 1px solid silver;
  //border-radius: 5px;
  padding: 0px 0px 0px 0px;
  margin: 0px 0px;
  //color: #444;
  //text-decoration: none;
  padding: 6px 10px 4px 10px;
  margin: 5px 10px;
  text-align:left;

	}

	.btn-hamburger1{
 background-color: #FF7800; 
    border: none;
    color: white;
    margin-left:5px;
	padding:3px 10px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
}



.onoffswitch {

	position:absolute;
	top:-22px;
	left:195px;
}


.onoffswitch {
    position: relative; width: 75px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    //border: 2px solid #999999; border-radius: 20px;
	//border: 2px solid #999999; border-radius: 20px;
}

.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
//    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
	display: block; float: left; width: 50%; height: 23px; padding: 0; line-height: 23px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;
}

.onoffswitch-inner:before {
    content: "Firma";
    padding-left: 10px;
    background-color: #34A7C1; color: #FFFFFF;
}
.onoffswitch-inner:after {
    content: "Person";
    padding-right: 8px;
    background-color: #EEEEEE; color: #999999;
    text-align: right;
}

.onoffswitch-switch {
    //display: block; width: 18px; margin: 6px;
	display: block; width: 12px; margin: 6px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 56px;
    //border: 2px solid #999999; border-radius: 20px;
    transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
	    right: 0px; 
}


/*check*/

/*
a
{
  text-decoration: none;
  color: #232323;
  
  transition: color 0.3s ease;
}

a:hover
{
  color: tomato;
}
*/
#menuToggle
{
  display: block;
  position: relative;
  //top: 50px;
  top:-1px;
  left: 35px;
  
  //z-index: 1;
  
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle input
{
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: -5px;
  
  cursor: pointer;
  
  opacity: 0; /* hide this */
  z-index: 2; /* and place it over the hamburger */
  
  -webkit-touch-callout: none;
  //top:-50px;
}

/*
 * Just a quick hamburger
 */
#menuToggle span
{
  display: block;
  //width: 33px;
  width: 20px;
  height: 4px;
  margin-bottom: 5px;
  position: relative;
  
  background: #cdcdcd;
  border-radius: 3px;
  
  z-index: 1;
  
  transform-origin: 4px 0px;
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
			  
	//		  top:-50px;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
  
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

/* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
#menuToggle input:checked ~ span
{
  opacity: 1;
  //transform: rotate(45deg) translate(-2px, -1px);
  //background: #232323;
  
}


/*
 * But let's hide the middle one.
 */
#menuToggle input:checked ~ span:nth-last-child(3)
{
  //opacity: 0;
  //transform: rotate(0deg) scale(0.2, 0.2);
}

/*
 * Ohyeah and the last one should go the other direction
 */
#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

/*
 * Make this absolute positioned
 * at the top left of the screen
 */
#menu
{
	
  position: absolute;
  //width: 300px;
  width: 200px;
  margin: -100px 0 0 -50px;
  padding: 20px;
  padding-top: 125px;
  
  
  background: #ededed;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  /* to stop flickering of text in safari */
  
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
  height:1000px;
  //z-index: 3;
  }

#menu li
{
  padding: 10px 0;
  font-size: 22px;
  //z-index: 3;
}

/*
 * And let's slide it in from the left
 */
#menuToggle input:checked ~ ul
{
  transform: none;
}

#menuToggle input:checked
{
  width: 200px;
  height:70px;

}