#top-bar {
	floar: left;
	width: 100%;	
	position: relative;
	z-index: 2;
	clear: both;
	background-color: #ccc;
	background-color: #444343;
	border-left: 0;
	border-right: 0;
     font-family: 'Yanone Kaffeesatz';
     letter-spacing: 1px;
	font-size: 0.8em;
	min-height: 60px;

/*
	-moz-box-shadow: 0px 1px 10px #1b1b1b;
	-webkit-box-shadow: 0px 1px 10px #1b1b1b;
	box-shadow: 0px 1px 10px #1b1b1b;
*/
border-bottom: 1px solid #111111;
	background-color: #F1F1F1;



 background-color: #232323;
 background-repeat: repeat-x;
 background-size: auto 100%;
 /*border-bottom:2px solid #685640;*/	
	
	padding:0;
	margin-top: 0px;
	border-top: 0;
    color: white;
	
	
}

#top-bar ul
{
 margin: 0;
 padding: 0;
 
}

#top-bar-content {
 max-width: 1050px;
 display: block;
 height: 100%;
 margin: 0 auto;	
}

#top-bar-left,
#top-bar-middle,
#top-bar-right
{
 float: left;
 width: 40%;
 display: block;
 clear: none;
 	
}

#top-bar-middle
{
 width: 20%;
 height: 100%;	
}


#top-bar-menu  li a {
 display: block;
 padding: 4px;	
 padding-bottom: 5px;
}

#top-bar li a,#top-bar li a:visited {
 text-decoration: none;

	

}


#top-bar a:link,#top-bar a:visited {	
	color: inherit;
   -moz-transition: color 0.2s ease-in 0s;
}

#top-bar li a:active 
{
    -moz-box-shadow:inset 0px 2px  5px #1b1b1b;
    -webkit-box-shadow:inset 0px 2px  5px #1b1b1b;
	box-shadow:inset px 2px 5px #1b1b1b;
	bordeR: 0;
}


#top-bar li a:hover {


}
#top-bar .hashover:hover
{
 background: rgba(255,255,255,0.1);
 bborder-left: 1px solid rgba(255,255,255,0.1);
 bborder-right: 1px solid rgba(255,255,255,0.1);
 background: url(/images/pallohover.png) no-repeat center center;	

 
 
}
#top-bar .user a:active {
	color: gray;
}



#top-bar-menu  {
 height: 100%;
 width: 100%;
 
 padding: 0;
 margin: 0;
 list-style: none;
 
}

#top-bar #select-employee {
  float: left;
  display: block;
  
  margin-top: 17px; 
}

#top-bar .pob-info {
  float: none;
  display: block;
  margin: 0 auto;
  
  text-align: center;
   
}
#top-bar .pob
{
 width: 100%;
 padding-top: 6px;
 clear: both;
 float: none;
 display: inline-block;
 	
}
#top-bar .pob-info .city
{
  color: #D3D3D3;
  color: #A9A9A9;
    font-family: "arial";
    font-weight: bold;
    margin-top: 0;
    padding-top: 0;
    ttext-shadow: -1px -1px 0px #696969;
    text-transform: uppercase;
    font-size: 0.9em;
 }


 




#top-bar-menu li {
  float:left;	
  
  min-height: 60px;
  
  bborder-left: 1px solid #1b1b1b;
  bborder-right: 1px dotted #252525;
  bordeR: 0px solid transparent;
  padding: 0;
  margin: 0;
  text-align: center;
  
  
  
  background-position: center center;
  background-repeat: no-repeat;

  b-moz-box-shadow:inset 0 0 20px #1b1b1b;
  b-webkit-box-shadow:inset 0 0 20px #1b1b1b;
  bbox-shadow:inset 0 0 20px #1b1b1b;
  
  bbackground: #272727;
  cursor: pointer;

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;

   
  
}

#top-bar-right #top-bar-menu li
{
 float: right;	
 
}

#top-bar .unread-messages {
 text-shadow: 2px 2px 1px black;
 text-align: center; 
 height: 60px;
 width: 30px;
 display: block;
 padding: 0;
 margin: 0; 
 overflow: hidden;	
 float: left;
 background-color: transparent;
 }

#top-bar .unread-messages-pulse {
 animation: unreadpulse 6s;
 animation-timing-function: linear;
 animation-delay: 4s;
 animation-iteration-count: infinite;
 animation-direction: alternate;
 animation-play-state: running;
 -webkit-animation: unreadpulse 6s;
 -webkit-animation-timing-function: linear;
 -webkit-animation-delay: 4s;
 -webkit-animation-iteration-count: infinite;
 -webkit-animation-direction: alternate;
 -webkit-animation-play-state: running; 
	box-shadow:inset 0px 0px 10px #666666;
}
@keyframes unreadpulse
{
 from {background: transparent;}
 to {background: #efe831;}
}

@-webkit-keyframes unreadpulse
{
from {background: transparent;}
to {background: #efe831;}
}

#top-bar .unread-messages a
{
 height: 60px;
 width: 100%;
 padding: 0;
 margin: 0;
 text-align: right;
 display: inline-block;
 font-size: 120%;	
 background-image: url(../images/talkbubble.png);
 background-repeat: no-repeat;
 background-position: 5px 25px;
 background-size: auto 20px;
 background-color: transparent;
 
 position: relative;
}


#top-bar .unread-number
{
 margin-top: 10px;
 margin-left: 10px;
 text-align: center;
 background: transparent url(../images/oliveball_bg_20.png) no-repeat center center;
 color: white;
 height: 20px;
 position: absolute;
 width: 20px;
 text-shadow: 1px 1px 0px black;
 font-family: arial;
 font-size: 12px;
 padding: 0;
 padding-top: 4px;
 letter-spacing: 0;
}

#top-bar .user,
#top-bar .user-group 
{
	margin: 0;
	padding: 0;
	clear: both;
	float: left;
	width: 100%;
	text-align: left;
	padding-left: 10px;
}

#top-bar .user {
	mmargin-top: -3px;
	font-size: 1.1em;
	font-family: arial;
	font-size: 10px;
	ffont-weight: bold;
	 text-shadow: 2px 3px 1px black;
	letter-spacing: 0;
    margin-top: 12px;
    margin-right: 15px;
    bmargin-left: 8px;
    padding: 0;
	color: white;
	float: left;
	display: block;
	width: auto;
	min-width: 120px;
	clear: none;
	text-align: right;
}

#top-bar .user-group 
{
 display: none;	
}

#top-bar .pob, #top-bar .user-group {
	color: #999999;
	color: white;
	font-size: 90%;
	font-size: 140%;
	text-shadow: 2px 3px 1px black;
  font-family: 'Yanone Kaffeesatz' !important;
  letter-spacing: 1px !important;
  ttext-transform: uppercase; 
}
#top-bar .pob
{
 font-size: 1.3em;	
}
li#top-bar-logo
{
 padding: 0; 
 margin: 0;
 height: 60px;
 width: 120px;
 display: block;
 background-image: url(/images/logo_main.png);
 background-position: center center;
 background-repeat: no-repeat;
 background-size: auto 85%;	
}

li#top-bar-logo a {
 margin: 0;
 padding: 0;
 border: 0;
 height: 100%;
 width: 120px;
 display: block; 
}
#top-bar li#top-bar-logo a:hover
{ 
 background-color: transparent;
 background-size: auto 85%;
 border: 0;
   
}

#top-bar-logo:active {
	position: relative;
	top: 1px;
	
}

#top-bar #logout
{
 width: 80px;
}

#topbar #logout a
{
 font-size: 0.7em;	
}

#top-bar li.userInfo
{
 min-width: 120px;
}
#top-bar li.userInfo > a
{
 width: 100%;
 height: 100%;
 margin: 0;
 padding: 0;	
}
/* Stock Alert */
@keyframes myfirst
{
from {background-color: #471313;}
to {background-color: #cd2020;}
}

@-webkit-keyframes myfirst
{
 from {background-color: #471313;}
 to {background-color: #cd2020;}
}

#top-bar .stock-alert
{
 float: left;
 display: inline-block;
 clear: both;
 
 display: inline-block;
 background-image: url(/images/order.png) ;
 background-repeat: no-repeat;
 background-position: center 25px;
 background-size: auto 18px;

 background-color: #471313;
 
 animation: myfirst 2s;
 animation-timing-function: linear;
 animation-delay: 2s;
 animation-iteration-count: infinite;
 animation-direction: alternate;
 animation-play-state: running;
 /* Chrome and safari */
 -webkit-animation: myfirst 2s;
 -webkit-animation-timing-function: linear;
 -webkit-animation-delay: 2s;
 -webkit-animation-iteration-count: infinite;
 -webkit-animation-direction: alternate;
 -webkit-animation-play-state: running;

  box-shadow:inset 0px 0px 10px #1b1b1b;
  
}

#top-bar .stock-alert a
{
 height: 100%;
 display: block;
 font-size: 120%;
 margin: 0;
 padding: 0;
 width: 30px;
 height: 60px;
 position: relative;
}

#top-bar .stock-alert .unread-number
{ 
 background: url(../images/redball_bg_20.png) no-repeat center center;
}


	


#top-bar .switch-employee
{
 width: 60px;
}

#top-bar-level2
{
 width: 100%;
 clear: both;
 float: left;
 font-family: arial;
 font-size: 12px;
 display: inline-block;
 background-image: none;
 background-color: #444444 !important;
 margin: 0;
 padding: 0;
 border: 0;
}

#top-bar-level2-left-side,
#top-bar-level2-right-side
{
 width: 50%;
 float: left;
 display: inline-block;
 background: transparent;
 color: white;
}

#top-bar-level2-right-side
{
 text-align: right;
}

#top-bar-level2-right-side span,
#top-bar-level2-left-side span
{
 padding: 5px;
 display: inline-block;
}

#top-bar-level2-right-side a:link,
#top-bar-level2-right-side a:visited,
#top-bar-level2-right-side a:active
{
 color: white;
 text-decoration: none;
}

#top-bar-menu > .timecard
{
 width: 80px;	
 border-left: 1px solid #444444;
 border-right: 1px solid #444444;
 
 background-size: auto 20px;
 background: #232323 url(/images/login_area_bg.png) top left;

 font-family: arial;
 font-size: 10px;
 text-align: center;
 color: #e8e8e8;
 ftext-shadow: 1px 1px 0px #000000;	
}
#top-bar-menu > .timecard > img
{
	height: 30px;
	margin-top: 15px;
	margin-bottom: 3px;
}
#top-bar-menu > .in
{
	background: #0C9B56 url(/images/login_area_bg.png) top left;
	
}

#top-bar-menu > .break
{
	background: #EAA423 url(/images/login_area_bg.png) top left;
	
}

.user > .star-rating
{
	
 margin-top:5px;
 display: inline-block;
 
}


@media all and (max-width: 880px) {
  #top-bar-menu li.userInfo
  {
   width: 60px;
  }
  
  #tob-bar-menu
  {
   display: inline-block;
   height: auto;
  }

  li#top-bar-logo
  {
   background-size: 80% auto;
   width: 80px;
  }

}

@media all and (max-width: 530px) {
  #top-bar-menu li.userInfo
  {
   width: 60px;
  }
  li#top-bar-logo 
  {
   background-size: 80% auto;
   width: 60px;
  }
  #top-bar-level2
  {
   display: none;
   
  }
}

@media all and (max-width: 469px) {
  #top-bar,
  #top-bar-level2,
  #content
  {
   min-width: 319px;
  }

 #top-bar-menu li.userInfo
  {
   display: none;
  }

  #top-bar .switch-employee
  {
   width: 60px;
   margin-left: 20px;
  } 

  #top-bar #logout
  {
   width: 60px;
   margin-left: 20px;
  }
 #top-bar #top-bar-left,
 #top-bar #top-bar-right
 {
  width: 50%;
 }
 
 #top-bar #top-bar-middle
 {
  display: none;
 }

 #top-bar-level2
 {
  display: inline-block !important;
  
 }
}