#toolbar{
    width: 100%;
	height:6.9%;
	text-align: center;
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAxCAIAAACUDVRzAAAAA3NCSVQICAjb4U/gAAAALElEQVQImWMwMrJi+v//PxMDw3+m//8ZoPR/qBgDEhuXGLoeYswhXg8R5gAAdVpfoJ3dB5oAAAAASUVORK5CYII=) 100% 100%; 
	background: -moz-linear-gradient(top, #F2F2F2 0%, #E8E8E8 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F2F2F2), color-stop(100%, #E8E8E8));
	background: -webkit-linear-gradient(top, #F2F2F2 0%, #E8E8E8 100%);
	background: -o-linear-gradient(top, #F2F2F2 0%, #E8E8E8 100%);
	background: -ms-linear-gradient(top, #F2F2F2 0%, #E8E8E8 100%);
	background: linear-gradient(to bottom, #F2F2F2 0%, #E8E8E8 100%);
	-moz-box-shadow:2px 2px 5px #666666,-2px -2px 5px lightblue;    /*   For Older Versions    */
    -webkit-box-shadow:2px 2px 5px #666666,-2px -2px 5px lightblue;  
    box-shadow:2px 2px 5px #666666,-2px -2px 5px lightblue;   
    /* For  'IE'  */
      filter:
       progid:DXImageTransform.Microsoft.Shadow(color=lightblue,direction=0,strength=5)   /*  Top     */
       progid:DXImageTransform.Microsoft.Shadow(color=#777777,direction=90,strength=3)    /*  Right   */
       progid:DXImageTransform.Microsoft.Shadow(color=#777777,direction=180,strength=3)   /*  Bottom  */
       progid:DXImageTransform.Microsoft.Shadow(color=lightblue,direction=270,strength=5);/*  Left    */
}

ul.toolbar_list
{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden; 
	display:inline-table;
	height:100%;
	margin: 0 auto;
}

ul.toolbar_list li
{
    float: left;
	margin-left:20px;
	height:100%;
	width:80px;
}
@media only screen and (max-height: 768px) {
   ul.toolbar_list li {margin-left:0px;}
}

ul.toolbar_list li a
{
    display: block;
    text-decoration: none;
}

ul.toolbar_list li a:hover
{
	opacity:0.8;
}

#lock {	background-image:url("../imgs/unlock.png"); background-repeat:no-repeat;background-size:contain; width:50px; height:6.3%; position:absolute; right:10; top:6}
@media only screen and (max-height: 768px) {
   #lock {right:0;}
}

#img4 {	background-image:url("../imgs/customers.png"); background-position:center;}
#img2 {	background-image:url("../imgs/add_customer.png"); background-position:center;}
#img3 {	background-image:url("../imgs/plan.png"); background-position:center;}
#img5 {	background-image:url("../imgs/settings.png"); background-position:center;}
#img6 {	background-image:url("../imgs/about.png"); background-position:center;}
#img7 {	background-image:url("../imgs/esex.png"); background-position:center;}
#img8 {	background-image:url("../imgs/ekkremotites.png"); background-position:center;}

.fillme{
	width:100%;
	height:100%;
	background-repeat:no-repeat;
	background-size:contain;
}

.dropdown, .dropdown2 {
	visibility: hidden;
	opacity: 0;
	position:absolute;
	transition: all 0.5s ease;
	display: none;
	z-index:0;
 	background:#FFF;
	box-shadow: 2px 2px 0 #BEBEBE;
	list-style: none;
	margin: 0;
    padding: 0;
	min-width:180px;
}

.dropdown2 {
	margin-left:150px;
	margin-top:-40px;
}

ul.toolbar_list li:hover > ul,
.dropdown:hover {
  visibility: visible;
  opacity: 1;
  display: block;
  z-index:1000;
}

.dropdown li {
  clear: both;
  min-width:180px;
}

.dropdown li a {
  border-bottom: 1px dotted #ccc;
  border-right: none;
  color: #000;
  padding: 15px 15px;
}

.dropdown li a:hover {
  color: #000;
  background: #eeeeee;
}