upload/admin_area/styles/cb_2014/theme/assets/css/less/ace-nav.less
.navbar {
  margin-bottom:0;
}

.navbar {
  padding-left:0; padding-right:0;
  margin-left:0; margin-right:0;

 //.navbar-inner {
	  border:none;
	  .box-shadow(none);
	  .border-radius(0);

	  margin:0;
	  padding-left:0; padding-right:0;
	  
	  min-height:@navbar-mh;
	  position:relative;

	  .gradient(#eee, #eee, #FFF);
 // }

  > .container {
	padding-left:0;
	padding-right:0;

	 border-bottom : 1px solid #CCC;
  }

  .navbar-text, .navbar-link {
	 color:@navbar-text-color;
  }
  .navbar-brand {
	 color:@navbar-text-color;
	 font-size:@brand-size;
	 text-shadow:none;
	 padding-top: 10px;
	 padding-bottom: 10px;
	 &:hover , &:focus {
		color: @navbar-text-color;
	 }
  }
  
  .navbar-header {
	margin:0 !important;
  }


  .navbar-nav {
	> li {
	   > a {
			& , &:hover , &:focus {
				font-size:13px;
				text-shadow:none;
				color:@navbar-text-color;
			}
		}
	}//li
  }//.nav

}
.navbar-fixed-top, .navbar-fixed-bottom {
	position: fixed;
}

.navbar-container {
	padding-left:10px;
	padding-right:20px;
}
.navbar-container.container {
	padding-left:0;
	padding-right:0;
}



/* ace-nav */
.ace-nav {
 height:100%;
 margin:0 !important;
 
 > li {
	line-height:@navbar-mh;
	height:@navbar-mh;

	border:0px;
	padding:0;

	position:relative;
	float:left !important;
	
	&:first-child {
	  border-left:none;
	}
	
	> a {
		.gradient(#fff,#fff,#eee);
		//box-shadow: inset 0px 0px 6px rgba(0,0,0,0.1);
		color: #222;


	    border-left: 1px solid #ccc;

		display: block;
		line-height: inherit;
		text-align: center;

		height: 100%;
		width: auto;
		min-width: 50px;
		padding: 0 8px;

		position: relative;

		> [class*="icon-"] {
			font-size: 16px;
			color: #222;
			display: inline-block;
			width: 20px;
			text-align: center;
		}

		> .badge {
			position: relative;
			top: -4px;
			left: 2px;

			padding-right: 5px;
			padding-left: 5px;
		}
	}


	> a:hover , > a:focus {
		background-color: desaturate(darken(@ace-nav-default, 4%), 4%);
	}
	&.open > a {
		background-color: desaturate(darken(@ace-nav-default, 4%), 4%) !important;
	}

	/* different colors */
	.ace-nav-color(@color) {
	  @ace-nav-class: ~`"ace-nav-@{color}"`;
	  @ace-nav-bg: ~`"ace-nav-@{color}"`;
	  @ace-nav-cl: @@ace-nav-bg;

	  &.@{color} > a {
		background-color:@ace-nav-cl;
		&:hover , &:focus {
			background-color: desaturate(darken(@ace-nav-cl, 4%), 4%);
		}
	  }
	  &.open.@{color} > a {
		background-color: desaturate(darken(@ace-nav-cl, 4%), 4%) !important;
	  }
	}
	 &.open > a {
		color:#FFF !important;
	 }
	.ace-nav-color(~"grey");
	.ace-nav-color(~"purple");
	.ace-nav-color(~"green");
	.ace-nav-color(~"light-blue");
	.ace-nav-color(~"light-blue2");
	.ace-nav-color(~"red");
	.ace-nav-color(~"light-green");
	.ace-nav-color(~"light-purple");
	.ace-nav-color(~"light-orange");
	.ace-nav-color(~"light-pink");
	.ace-nav-color(~"dark");
	.ace-nav-color(~"white-opaque");
	.ace-nav-color(~"dark-opaque");



	
	//margins
	.marginX (@index) when (@index > 0) {
		&.margin-@{index} { margin-left: unit(@index,px); }
		.marginX(@index - 1);
	}
	.marginX(4);
	
	&.no-border {
		border: none !important;
	}

	
	///
	.dropdown-menu {
		z-index: @zindex-navbar-fixed + 1;
	}
 }
 
 .nav-user-photo {
	 margin: -4px 8px 0 0;

	 border-radius: 100%;
	 border: 2px solid #FFF;

	 max-width: 40px;
 }
 
 
  li:last-child  a [class^="icon-"] {/* the arrow indicating "See more" on each dropdown , and the icons of user menu */
	display: inline-block;
	width: 1.25em;
	text-align: center;
  }

}




/* ace-nav responsive */
@media only screen and (max-width: @screen-xs-max) {
 .navbar-container {
	padding-left:0;
	padding-right:0;
 }
}
@media only screen and (max-width: @screen-xs-max) {
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right {
	right:-80px;
 }
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:after {
  right:100px;
 }
 
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right {
	right:-40px;
 }
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:after {
  right:60px;
 }

 .user-menu.dropdown-close.pull-right {
	right: 0 !important;
 }
}

@media only screen and (max-width: @screen-xs) {
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right {
	right:-120px;
 }
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:after {
	right:140px;
 }
 
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right {
	right:-80px;
 }
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:after {
	right:100px;
 }
 
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right {
	right:-50px;
 }
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right:after {
	right:70px;
 }
}


@media only screen and (max-width: @screen-topbar-down) {
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right {
	left:-5px;
	right:auto;
 }
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(4) > .dropdown-menu.pull-right:after {
	right:auto;
	left:25px;
 }
 
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right {
	left:-60px;
	right:auto;
 }
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(3) > .dropdown-menu.pull-right:after {
	left:80px;
	right:auto;
 }
 
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right {
	left:-110px;
	right:auto;
 }
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right:before,
 .ace-nav > li:nth-last-child(2) > .dropdown-menu.pull-right:after {
	left:130px;
	right:auto;
 }
}


/* move the icons to the line below */
@media only screen and (max-width: @screen-topbar-down) {
 .navbar .navbar-header.pull-left {
  display:block;
  float:none !important;
 }
 .navbar .navbar-header.pull-right {
  display:block;
  float:none !important;
 }

 /*.navbar .navbar-inner {
  border-bottom-width:0;
 }*/
 .ace-nav {
	display:block;
	float:none !important;
	text-align:center;
	
	background-color:#404040;
	
	border:1px solid #DDD;
	border-width:1px 0;

	letter-spacing: -3px;
 }
 .ace-nav > li{
	display:inline-block;
	float:none !important;
	text-align:left;

	letter-spacing: normal;
 }
 .ace-nav > li:first-child{
	border-left:1px solid #DDD;
 }
 .ace-nav > li:last-child{
	border-right:1px solid #DDD;
 }
}

@media only screen and (max-width: @screen-tiny) {
 .ace-nav > li  > a {
	padding:0 5px !important;
 }
}






 .user-menu > li > a {
	padding:4px 12px;

	> [class*="icon-"] {
		margin-right:6px;
		font-size:120%;
	}
 }

 .user-info {
	max-width:100px;
	display:inline-block;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	text-align:left;

	vertical-align:top;
	line-height:15px; 
	position:relative; top:6px;

	 small {
		display:block;
	 }
 }
 
 @media (min-width: @screen-topbar-down-min) and (max-width: @screen-xs) , (max-width: 360px) {
	.user-menu {
		padding-top:42px !important;
	}
	.ace-nav .nav-user-photo {
		margin-right:0;
	}
	.user-info {
		position:absolute !important;
		margin-top:40px; margin-left:1px; right:2px;

		z-index:1032;
		color:#777; font-size:14px;
		width:156px;
		max-width:156px;
		
		padding-left:8px;
		padding-right:8px;
		height:32px;
		line-height:26px !important;


		display:none;

		border-bottom:1px solid #E5E5E5;

		text-align:center;

		vertical-align:none;
		line-height:normal; 
	}

	.user-info > small {
		display:inline;
		opacity:1;
	}

	li.open .user-info {
		display:inline-block;
	}
 }
 