html, body {
	height: 100%;
	position: relative;
}

.page-container {
	width: 100%;
	display: table;
	height: 100%;
	table-layout: fixed;

	@media screen and (max-width: @screen-sm-min){
		display: block;
	}

	&.loaded .page-container {
		position: relative;
	}

	.sidebar-menu {
		display: table-cell;
		vertical-align: top;
		background: @main_color;
		width: @sidebar_menu_width;
		position: relative;
		z-index: 100;
		.bs;

		@media screen and (max-width: (@screen-sm-min - 1)){
			display: block;
		}

		&.fixed {

			@media screen and (min-width: @screen-sm-min){

				.sidebar-menu-inner {
					position: fixed;
					height: auto;
					bottom:  0;
					width: @sidebar_menu_width;
				}
			}
		}

		.sidebar-menu-inner {
			position: relative;

			&.ps-container {
				overflow: hidden;
				height: 100%;

				.sidebar-collapsed& {
					overflow: visible;
				}
			}
		}

		.logo-env {
			width: 100%;
			padding: @inner_padding + @base_margin / 2;
			.bs;
			.clearfix;

			> div {
				display: block;
				vertical-align: middle;
				white-space: nowrap;
				float: left;

				> a {
					display: inline-block;
					color: @main_text_color;
				}

				&.sidebar-collapse,
				&.sidebar-mobile-menu {
					position: relative;
					float: right;

					a {
						display: inline-block;
						border: 1px solid @main_border_color;
						text-align: center;
						padding: 0;
						line-height: 1;
						font-size: 20px;
						font-weight: 300;
						padding: 5px 2px;
						.rounded;
						.transall(200ms);

						&:hover {
							background-color: fade(@main_border_color, 40%);
						}
					}
				}
			}
		}


		#main-menu {
			list-style: none;
			margin: 0;
			padding: 0;
			margin-bottom: @inner_padding;

			li {
				position: relative;
				margin: 0;
				font-size: @p_size;
				border-bottom: 1px solid fade(@main_border_color, 70%);

				&#search {
					background: @main_active_color;
					border-bottom-color: fade(@main_border_color, 50%);
					position: relative;
					height: 48px;

					.placeholder-color(fade(@main_text_color, 70%));

					.search-input {
						.input-reset();
						padding: @base_margin/2 @inner_padding;
						padding-right: @inner_padding + @inner_padding + @base_padding/2;
						width: 100%;
						color: @main_text_color;
						z-index: 100;
						.transition(~"350ms opacity ease-in-out");
						.bs;
					}

					button {
						position: absolute;
						right: 0;
						top: 0;
						.input-reset();
						color: @main_text_color;
						padding: @base_margin/2 @inner_padding;
						padding-top: @base_margin/2 - 2;
						//padding-right: @base_padding;

						i {
							margin: 0;
						}
					}
				}

				i {
					position: relative;
					font-size: 15px;
					margin-right: @base_padding / 2;
				}

				a {
					position: relative;
					display: block;
					padding: @base_padding @inner_padding;
					color: @main_text_color;
					z-index: 2;
					.transition(~"color 250ms ease-in-out, background-color 250ms ease-in-out");

					i {
						top: 1px;
						display: inline-block;
					}

					span {
						.transition(~"350ms opacity ease-in-out");
					}

					&:hover {
						background-color: fade(@main_border_color, 30%);
						color: @menu_active_text_color;
					}

					.badge {
						position: relative;
						float: right;
						font-size: 11px;
						line-height: 1.3;

						&.badge-primary {
							border: 1px solid @main_border_color;
							top: -1px;
						}
					}
				}

				&.active {

					> a {
						background-color: @menu_active_color;
						color: @menu_active_text_color;
					}
				}

				&.has-sub {

					> a:before {
						position: relative;
						content: '\e877';
						content: '\e879';
						display: inline-block;
						font-family: @font_entypo;
						color: @main_border_color;
						color: #FFF;
						float: right;
						font-size: 15px;
						margin-left: @base_padding + 3;
						top: 0px;
						.transall;
					}

					&.opened > a:before {
						.rotate(90deg);
					}
				}


				// Submenu (level 1)
				ul {
					position: relative;
					list-style: none;
					padding: 0;
					margin: 0;
					border-top: 1px solid fade(@main_border_color, 40%);
					display: none;
					overflow: hidden;
					z-index: 1;

					&.visible {
						display: block;
					}

					> li {
						border-bottom: 1px solid fade(@main_border_color, 40%);

						> a {
							background-color: @submenu_color;
							padding-left: @inner_padding * 2;

							&:hover {
								background-color: lighten(@submenu_color, 1%);
							}
						}

						&:last-child {
							border-bottom: 0;
						}

						// Submenu (level 2)
						ul {

							> li {

								> a {
									padding-left: @inner_padding * 3;
									background: @main_active_color;
								}

								// Submenu (level 3)
								ul {

									> li {

										> a {
											padding-left: @inner_padding * 4;
											background: @main_active_color;
										}

										// Submenu (level 4)
										ul {

											> li {

												> a {
													padding-left: @inner_padding * 5;
													background: @main_active_color;
												}
											}
										}
									}
								}
							}
						}
					}
				}
			}
		}

		// Added on v1.1
		.sidebar-user-info {
			position: relative;
			padding: (@inner_padding + @base_padding / 2) (@inner_padding + @base_margin / 2);
			border-top: 1px solid @main_border_color;
			.transition(~"padding 300ms ease-in-out");
			.bs;

			.user-link {
				display: block;
				.clearfix;
				.bs;

				img {
					display: block;
					float: left;
					margin-right: @base_margin / 2;
					border: 4px solid rgba(255,255,255,.11);
					.transition(~"transform 350ms cubic-bezier(0.445, 0.050, 0.550, 0.950)");
					.img-responsive;
				}

				span, strong {
					display: block;
					font-size: 14px;
					color: @menu_active_text_color;
					font-weight: normal;
					line-height: 1.2;
					.opacity(1);
					.transition(~"opacity 300ms ease-in-out");
				}

				span {
					.opacity(.8);
				}

				strong {
					font-size: 18px;
				}

				img + span, img + strong {
					padding-top: 8px;
				}
			}


			// Layers
			.sui-normal {
				position: relative;
			}

			.sui-hover {
				position: absolute;
				visibility: hidden;
				left: 0;
				right: 0;
				bottom: 0;
				top: 0;
				background: @menu_active_color;
				padding: (@inner_padding + @base_padding / 2) (@inner_padding + @base_margin / 4);
				.transition(~"opacity 200ms ease-in-out");
				.opacity(0);

				.close-sui-popup {
					position: absolute;
					right: 15px;
					top: 10px;
					color: fade(@menu_active_text_color, 60%);
					font-size: 11px;
					cursor: pointer;
					.opacity(0);
					.transall;
				}

				a {
					position: relative;
					color: @menu_active_text_color;
					display: block;
					.transall;

					& + a {
						margin-left: 0;
						margin-top: 5px;
					}
				}



				&.animate-in {
					@base_ms: 90ms;

					a {
						top: -20px;
						.opacity(0);
						.transition(~"all 350ms cubic-bezier(0.680, -0.550, 0.265, 1.550)");
						.transition-delay(1 * @base_ms);

						& + a { .transition-delay(2 * @base_ms); }
						& + a + a { .transition-delay(3 * @base_ms); }
						& + a + a + a { .transition-delay(4 * @base_ms); }
						& + a + a + a + a { .transition-delay(5 * @base_ms); }
						& + a + a + a + a + a { .transition-delay(6 * @base_ms); }
						& + a + a + a + a + a + a { .transition-delay(7 * @base_ms); }
						& + a + a + a + a + a + a + a { .transition-delay(8 * @base_ms); }
						& + a + a + a + a + a + a + a + a { .transition-delay(9 * @base_ms); }
						& + a + a + a + a + a + a + a + a + a { .transition-delay(10 * @base_ms); }
						& + a + a + a + a + a + a + a + a + a + a { .transition-delay(11 * @base_ms); }
					}
				}

				&.visible {
					visibility: visible;
					.opacity(1);

					.close-sui-popup {
						.opacity(1);
					}

					&.animate-in a {
						top: 0;
						.opacity(1);
					}
				}

				&.going-invisible {
					visibility: visible;
				}

				&.inline-links {

					a {
						line-height: 52px;

						color: @menu_active_text_color;
						display: inline-block;

						& + a {
							margin-left: 10px;
						}
					}
				}
			}
		}
	}

	.main-content {
		position: relative;
		/*
float: left;
		z-index: 2;
*/
		display: table-cell;
		vertical-align: top;
		padding: @inner_padding;
		background: @background_color;
		width: 100%;
		.bs;

		@media screen and (max-width: (@screen-sm-min - 1) ){
			display: block;
		}
	}

	// Collapsed Menu
	&.sidebar-collapsed {

		.sidebar-menu {
			width: @sidebar_collapsed_width;

			.sidebar-menu-inner {
				width: @sidebar_collapsed_width;
			}

			&.fixed {

				.sidebar-menu-inner {
					position: relative;
				}
			}
		}

		.sidebar-user-info {
			padding: @base_margin / 2.2 5px;

			.user-link {
				text-align: center;

				img {
					.scale(0.8);
				}

				span, strong {
					position: absolute;
					.opacity(0);
				}
			}

			.sui-hover {
				@p: @base_padding - 2;

				position: absolute;
				top: 0;
				left: @sidebar_collapsed_width;
				width: @sidebar_menu_width;
				padding-top: @p;
				padding-bottom: @p;
				background: @main_color;
				border: 1px solid @main_border_color;
				border-left: 0;

				a {
					line-height: 1.2;
				}
			}
		}

		&.sidebar-is-showing {

			.sidebar-user-info {
				padding: (@inner_padding + @base_padding / 2) (@inner_padding + @base_margin / 2);

				img {
					.scale(1);
				}
			}
		}

		.sidebar-menu {
			z-index: 100;
			width: @sidebar_collapsed_width;

			.logo-env {
				display: block;
				padding: @inner_padding;

				> div.logo {
					overflow: hidden;
					width: 0;
					//height: 0;
				}

				> div.sidebar-collapse {
					display: block;
					padding: 0;
					left: 3px;
				}
			}

			#main-menu {

				> li {

					&#search {

						.search-input {
							position: absolute;
							visibility: hidden;
						}

						button {
							//position: relative;
							padding-left: @inner_padding;
							padding-bottom: @inner_padding;
							margin: 0;
						}

						&.focused {

							.search-input {
								display: block;
								position: absolute;
								visibility: visible;
								top: 0px;
								left: @sidebar_collapsed_width;
								background: @main_active_color;
								border: 1px solid @main_border_color;
								width: @sidebar_menu_width - @base_margin;
								.border-radius(0 @border_radius @border_radius 0);
								border-left: 0;
								padding: @base_margin/2 @inner_padding;
								padding-bottom: @base_margin/2 + 1;
								border: 0;
								padding-left: 0;
							}
						}
					}

					&.has-sub > a:before {
						display: none;
					}

					&.has-sub {

						> a {
							background-color: transparent;
						}
					}

					> a {
						position: relative;

						> span:not(.badge) {
							display: block;
							position: absolute;
							top: 0;
							left: @sidebar_collapsed_width;
							margin-top: -1px;
							padding: 12px @base_padding;
							background: @main_color;
							border-top: 1px solid @main_border_color;
							border-bottom: 1px solid @main_border_color;
							width: @sidebar_collapsed_hover_width;
							visibility: hidden;
							.border-radius(0 @border_radius @border_radius 0);
							.opacity(0);
						}

						span {
							.transition(~"none");
						}

						span.badge {
							position: absolute;
							right: -@sidebar_collapsed_hover_width + @base_padding;
							top: 10px;
							display: none;
						}
					}

					ul {
						border-top-color: @main_border_color;
					}

					// Submenu (level 1)
					> ul {
						display: block;
						visibility: hidden;
						position: absolute;
						height: 0;
						top: auto;
						left: @sidebar_collapsed_width;
						width: @sidebar_collapsed_hover_width;
						.border-radius(0 0 @border_radius 0);
						.opacity(0);

						> li {

							> a {

								span {

									&.badge {
										display: none;
									}
								}
							}
						}

						li {
							border-bottom: 1px solid @main_border_color;
						}

						li a { padding-left: @base_padding; }
						li li a { padding-left: (@base_margin/2) * 2 - 5; }
						li li li a { padding-left: (@base_margin/2) * 3 - 5; }
						li li li li a { padding-left: (@base_margin/2) * 4 - 5; }
					}

					&.has-sub:hover,
					&:hover {

						&.has-sub > a {
							cursor: default;

							> span:not(.badge) {
								.border-radius(0 @border_radius 0 0);
							}

							&:hover {
								color: @main_text_color;
							}
						}

						> ul {
							height: auto;
						}

						> a > span {
							visibility: visible;
							.opacity(1);

							&.badge {

							}
						}

						a span.badge {
							display: block;
						}

						> ul {
							visibility: visible;
							.opacity(1);
						}
					}
				}
			}
		}

		&.sidebar-is-busy {

			.sidebar-menu #main-menu > li:hover,
			.sidebar-menu #main-menu > li.has-sub:hover {

				> a > span, > a > span:not(.badge) {
					//.opacity(0);
				}

				> ul {
					//.opacity(0);
				}
			}
		}
	}


	// Collapsing Animation
	&.sidebar-is-collapsing {

		.sidebar-user-info {
			padding: @base_margin / 2.2 @base_padding / 2;

			img {
				.scale(0.8);
			}
		}

		.sidebar-menu {

			#main-menu {

				li {

					&#search {

						.search-input {
							.opacity(0);
							.transall;
						}
					}

					a {

						&:before {
							display: none;
						}

						span {
							.opacity(0);
							.transition(~"opacity 250ms ease-in-out") !important;
						}
					}
				}
			}
		}
	}


	// Showing Animation
	&.sidebar-is-showing {

		.sidebar-menu {

			#main-menu {

				li {

					&#search {

						.search-input {
							.opacity(0);
						}
					}

					a {

						&:before {
							.opacity(0);
						}

						span {
							.opacity(0);
						}
					}
				}
			}
		}
	}


	// No Sidebar
	&.no-sidebar {
		padding-left: 0;

		.main-content {
			padding-left: @inner_padding;
		}
	}


	// Horizontal Menu
	&.horizontal-menu {
		@border: fade(@main_border_color, 50%);
		@vpadding: @inner_padding;

		@approx_height: ceil(@vpadding * 2 + @line-height-base * 15px);

		padding-left: 0;
		padding-top: @approx_height;

		.navbar {
			display: table-row;
		}

		&.with-sidebar {
			//padding-left: @sidebar_menu_width;

			&.sidebar-collapsed {
				//padding-left: @sidebar_collapsed_width;
			}

			&.fit-logo-with-sidebar {

				header.navbar {

					.navbar-brand {
						width: @sidebar_menu_width;
					}
				}
			}

			header.navbar {
				border-bottom: 1px solid @main_border_color;

				ul.nav {

					li.dropdown.open {

						&:after {
							bottom: -1px;
						}

						.dropdown-menu {
							margin-top: 1px;
						}
					}
				}
			}

			.sidebar-user-info {
				border-top: 0;
				border-bottom: 1px solid @main_border_color;
			}

			.sidebar-menu {
				//top: 62px;
				position: relative;
				z-index: 100;
			}

			.main-content {
				width: 100%;
			}
		}

		header {

			&.navbar {
				position: absolute;
				z-index: 8;
				background-color: @main_color;
				padding: 0;
				margin-bottom: 0;
				border: 0;
				left: 0;
				right: 0;
				top: 0;
				.rounded(0);
				.clearfix;
				
				@media screen and (max-width: @screen-sm-min){
					display: block;
					min-height: 63px;
				}

				&.navbar-fixed-top {
					position: fixed;
					z-index: 10000;
					
					@media screen and (max-width: @screen-sm-min){
						z-index: 10;
					}
				}

				> .navbar-inner {
					.clearfix;
				}

				// Logo
				.navbar-brand {
					padding: @vpadding @inner_padding;
				}


				// Menu
				.navbar-nav {
					border-left: 1px solid @border;
					margin: 0;
					padding: 0;
					list-style: none;
					.clearfix;

					> li {
						position: relative;

						> a {
							position: relative;
							display: block;
							padding: @vpadding @inner_padding;
							border-right: 1px solid @border;
							font-size: @p_size;
							color: @main_text_color;
							.transition(~"color 250ms ease-in-out, background-color 250ms ease-in-out");
							z-index: 10;

							i {
								top: 1px;
							}

							span {
								font-size: @p_size;
							}
						}

						&:hover > a {
							background-color: fade(@main_border_color, 30%);
							color: @menu_active_text_color;
						}

						&#search {
							border-right: 1px solid @border;

							// Search Input Collapsed
							&.search-input-collapsed {

								&:hover {
									background-color: fade(@main_border_color, 30%);
								}
							}
						}

						&.active {

							> a {
								background-color: @menu_active_color;
								color: @menu_active_text_color;
							}
						}

						&.active.has-sub {

							> a {

								&:after {
									@s: 6px;

									position: absolute;
									content: '';
									width: 0px;
									height: 0px;
									border-style: solid;
									border-width: @s @s 0 @s;
									border-color: @menu_active_color transparent transparent transparent;
									bottom: -@s;
									left: 50%;
									margin-left: -@s;
									.opacity(0);
									.transall;
									.transition-delay(300ms);
								}
							}

							&:hover > a:after {
								.opacity(1);
							}
						}

						.badge {
							margin-left: @base_padding;
							margin-right: -@base_padding/2;
						}

						// Submenu Level 1
						ul {
							position: absolute;
							list-style: none;
							margin: 0;
							padding: 0;
							left: 0;
							top: auto;
							margin-top: 1px;
							background-color: @submenu_color_2;
							min-width: @horizontal_submenu_width;
							display: none;
							//.rounded(0 0 @border_radius @border_radius);

							li {
								position: relative;

								a {
									display: block;
									padding: @base_padding @inner_padding;
									white-space: nowrap;
									font-size: @p_size;
									border-bottom: 1px solid @main_color;
									color: @main_text_color;
									.transition(~"color 250ms ease-in-out, background-color 250ms ease-in-out");
								}

								&.active {

									> a {
										background-color: @menu_active_color;
										color: @menu_active_text_color;
									}
								}


								&:hover > a {
									background-color: lighten(@submenu_color_2, 2%);
									color: @menu_active_text_color;
								}

								ul {
									position: absolute;
									left: 100%;
									top: -1px;
								}

								&.has-sub {

									> a:before {
										position: relative;
										content: '\e877';
										content: '\e879';
										display: inline-block;
										font-family: @font_entypo;
										color: @main_text_color;
										color: #FFF;
										float: right;
										font-size: 15px;
										margin-left: @inner_padding;
										top: -1px;
										.transall;
									}

									&:hover > a:before {
										color: @menu_active_text_color;
									}
								}
							}

							> li:last-child {

								> a {
									border-bottom: 0;
								}
							}
						}
					}
				}


				// Search Box
				.navbar-inner > ul, > ul {

					> li {

						&#search {
							position: relative;
							background-color: @main_active_color;
							.transition(~"background 300ms ease-in-out");

							.placeholder-color(fade(@main_text_color, 70%));

							.search-input {
								.input-reset();
								padding: @vpadding+2 @inner_padding;
								padding-right: @inner_padding + @inner_padding + @base_padding/2;
								width: 220px;
								color: @main_text_color;
								font-size: @p_size;
								line-height: @line-height-base;
								.opacity(1);
								.transition(~"all 350 ease-in-out");
								.bs;
							}

							button {
								position: absolute;
								right: 0;
								top: 0;
								.input-reset();
								color: @main_text_color;
								padding: @vpadding @base_padding;
								.transition(~"all 350 ease-in-out");

								i {
									margin: 0;
								}
							}

							// Search Input Collapsed
							&.search-input-collapsed {
								background-color: transparent;
								.placeholder-color(transparent);

								.search-input {
									overflow: hidden;
									width: 45px;
									padding-left: 0;
									.opacity(0);
								}

								button {
									padding-right: @base_padding + 5px;
								}
							}
						}
					}
				}


				// Second Navbar (with Notifications)
				ul.nav {
					color: @main_text_color;
					font-size: @p_size;
					.clearfix;

					> li {
						float: left;

						> a, > span {
							display: block;
							float: left;
							padding: @vpadding+2 @inner_padding;
							color: @main_text_color;
							font-size: @p_size;
							line-height: @line-height-base;

							i {
								margin-right: @base_padding/2;

								&.right {
									margin-right: 0;
									margin-left: @base_padding/2;
								}
							}
						}

						> a {
							.transall;

							&:hover, &:focus {
								color: @menu_active_text_color;
								background-color: transparent;
							}
						}

						&.sep {
							float: left;
							display: block;
							border-left: 1px solid @main_border_color;
							margin: @vpadding+2 0;
							height: 16px;
							width: 0px;
							line-height: @line-height-base;
							overflow: hidden;
						}

						// Search Input
						&#search {

							.search-input {
							}

							button {
								padding: @vpadding+2 @inner_padding;
							}

							&.search-input-collapsed {

								button {
									padding-right: @base_padding + 5px;
								}
							}
						}


						// Dropdowns
						&.dropdown {

							> a {
								position: relative;
								display: block;
								padding: 0;
								margin: @base_padding;
								margin-top: @vpadding - 2;
								margin-bottom: @vpadding - 4;
								.transall;

								i {
									font-size: 19px;
								}

								.badge {
									position: absolute;
									padding: 2px;
									font-size: 10px;
									right: 0px;
									top: -5px;
									min-width: 17px;
									line-height: 12px;
								}
							}

							// Dropdown menu
							.dropdown-menu {
								.neon-dropdown-menu-body;
							}

							// DD Menu is Open
							&.open {
								background-color: fade(@main_border_color, 50%);

								> a {
									background-color: transparent;
									color: @menu_active_text_color;
								}

								&:after {
									@arrow_color: #FFF;
									@size: 7px;

									content: '';
									position: absolute;
									display: block;
									width: 0px;
									height: 0px;
									border-style: solid;
									border-width: 0 @size @size @size;
									border-color: transparent transparent @arrow_color transparent;
									bottom: -2px;
									left: 50%;
									margin-left: -@size;

								}
							}
						}


						// Mobile Menu Icon
						.horizontal-mobile-menu {
							position: relative;

							a {
								display: inline-block;
								border: 1px solid @main_border_color;
								text-align: center;
								padding: 0;
								line-height: 1;
								font-size: 20px;
								font-weight: 300;
								padding: 5px 2px;
								color: @main_text_color;
								margin-top: @vpadding - 5;
								margin-left: @inner_padding;
								.rounded;
								.transall(200ms);

								&:hover {
									background-color: fade(@main_border_color, 40%);
								}
							}
						}
					}
				}
			}
		}
	}
}


/* Lower screen than large screen */
@media (max-width: @screen-md-min) {

	.page-body .page-container {

		&.horizontal-menu {

			&.fit-logo-with-sidebar {

				header.navbar {

					.navbar-brand {
						width: auto;
					}
				}
			}
		}
	}
}

@media (min-width: @screen-xs-max) and (max-width: 1100px) {

	.page-container {

		// Horizontal Menu
		&.horizontal-menu {

			header.navbar {

				.navbar-nav > li > a {

					padding-left: @base_padding;
					padding-right: @base_padding;
					.transition(~"padding 250ms ease-in-out");

					.badge {
						display: none;
					}
				}

				> ul > li#search .search-input,
				.navbar-inner > ul > li#search .search-input {
					width: 140px;
				}

				.navbar-nav > li ul li a {
					padding: 10px 15px;
				}
			}
		}
	}
}

/* Tablets Only */
@media (min-width: @screen-xs-max) and (max-width: @screen-md-min) {

	.page-container {

		// Horizontal Menu
		&.horizontal-menu {

			header.navbar {

				.navbar-nav > li > a {
					padding-left: @base_margin / 2;
					padding-right: @base_margin / 2;

					i + span {
						display: none;
					}
				}
			}
		}

		// Horizontal Menu
		&.Xhorizontal-menu {

			header.navbar {
				@hpadding: @base_padding;

				//.navbar-brand,
				.navbar-nav li a,
				.navbar-nav li ul li a,
				ul.nav > li > a {
					padding-left: @hpadding;
					padding-right: @hpadding;
					font-size: @p_size - 1;
				}

				ul > li#search .search-input {
					width: 150px;
				}

				ul.nav > li.dropdown .dropdown-menu {
					width: ceil(@horizontal_notifications_width * .85);
				}
			}
		}
	}
}


/* Relatively-Small screen */
@media (max-width: @screen-xs-max) {

	.page-body .page-container {
		padding-left: 0;

		.sidebar-menu {
			position: relative;
			width: 100%;
			min-height: 0px !important;

			.logo-env {
				padding: @base_margin/2 @inner_padding;
				.transall(padding);

				> div {

					&.logo {
						display: block;
						width: auto;
					}

					&.sidebar-collapse {
						display: none;
					}
				}
			}

			#main-menu {
				display: none;
				margin-bottom: 0;

				li {

					a {

						span {
							.transition(~"none");
						}
					}
				}
			}
		}

		.main-content {
			min-height: auto !important;
		}

		// Horizontal Menu
		&.horizontal-menu {
			padding-top: 0;

			&.with-sidebar {
				padding-left: 0;
			}

			header.navbar {
				position: relative;

				.navbar-nav {
					@border: 1px solid fade(@main_border_color, 40%);
					@vpadding: 12px;

					clear: left;
					border-top: @border;
					display: none;

					> li > a {
						border-right: 0;
						border-bottom: @border;
						padding-top: @vpadding;
						padding-bottom: @vpadding;
					}


					> li#search {
						@vpadding: 15px;

						border-right: 0;
						background-color: @main_active_color;
						border-bottom: @border;
						.placeholder-color(@main_text_color);

						&:hover {
							background-color: @main_active_color;
						}

						.search-input {
							.opacity(1);
							width: 100%;
							padding-left: @inner_padding;
							padding-top: @vpadding;
							padding-bottom: @vpadding;
						}

						button {
							padding-top: @vpadding;
							padding-bottom: @vpadding;
						}
					}

					// Submenus
					> li {

						> ul > li > a:first-child { border-top: 0; }

						ul {
							overflow: hidden;
							width: 100%;
							position: relative;
							left: 0;
							.transform(~"none !important");

							&.visible {
								display: block !important;
								visibility: visible !important;
								opacity: 1 !important;
							}

							li {

								a {
									border: none;
									border-bottom: 1px solid fade(@main_border_color, 30%);
								}

								&:hover > a {
									background: transparent;
								}

								& > a:hover {
									background-color: fade(@main_border_color, 20%);
								}

								&.active > a {
									background-color: fade(@main_border_color, 15%);
									color: @menu_active_text_color;
								}

								&.opened {

									> a:before {
										.rotate(90deg);
									}
								}
							}


							li a { padding-left: @inner_padding * 2; }
							li li a { padding-left: @inner_padding * 3; }
							li li li a { padding-left: @inner_padding * 4; }
						}
					}
				}

				//.navbar-nav,
				ul.nav {
					//display: none;
					position: absolute;
					top: 0px;
					right: @inner_padding;

					> li {
						display: none;

						&.dropdown {
							display: block;

							&.open {

								> .dropdown-menu {
									width: @horizontal_notifications_width * .7;
									margin-left: -@horizontal_notifications_width/2;
									.rounded(@border_radius);
								}
							}
						}
					}
				}
			}
		}
	}

	// Main Content
	.page-body .page-container .main-content {
		min-height: 0 !important;
	}
}


/* Small Screen */
@media (max-width: @screen-xs-min) {

	.page-body .page-container {

		// Horizontal Menu
		&.horizontal-menu {

			header.navbar {

				.horizontal-mobile-menu a {
					margin-left: @base_padding;
				}

				ul.nav > li.dropdown > a {
					margin-left: @base_padding/2;
					margin-right: @base_padding/2;
				}

				//.navbar-nav,
				ul.nav {

					> li {

						&.dropdown {

							&.open {

								> .dropdown-menu {
									width: @horizontal_notifications_width * .6;
									margin-left: -@horizontal_notifications_width/3;
								}
							}
						}
					}
				}
			}
		}
	}
}



/* Right Sidebar Menu */
.page-container.right-sidebar {

	.sidebar-menu .sidebar-user-info .sui-hover.inline-links a {
		margin-left: 10px;
	}

	.sidebar-menu .sidebar-user-info .sui-hover .close-sui-popup {
		right: auto;
		left: 15px;
	}
}

@media screen and (min-width: @screen-sm-max)
{
	.page-container.right-sidebar {
		//padding-left: 0;
		//padding-right: @sidebar_menu_width;

		direction: rtl;

		> * {
			direction: ltr;
		}

		// Sidebar
		.sidebar-menu {
			left: auto;
			right: 0;
		}

		&.sidebar-collapsed {
			padding-left: 0;
			//padding-right: @sidebar_collapsed_width;

			.sidebar-menu #main-menu > li {

				> a > span,
				> ul {
					left: auto;
					right: @sidebar_collapsed_width;
				}

				> a {

					> i {
						margin-right: 0;
					}

					> span.badge {
						right: 75px;
						left: auto;
						//left: -(@sidebar_menu_width - @sidebar_collapsed_width + @inner_padding + @base_padding/2);
						//left: -45px;
					}

					> span:not(.badge) {
						.border-radius(@border_radius 0 0 @border_radius);
						padding-left: 15px;
					}
				}

				> ul {

					li a {
						padding-left: @base_margin/2;
						padding-right: @base_padding;

						i {
							margin-right: 0;
							margin-left: @base_padding/2;
						}
					}
				}
			}
		}

		&.sidebar-collapsed .sidebar-menu #main-menu > li > ul {
			right: @sidebar_collapsed_width;
			left: auto;
		}

		&.sidebar-collapsed .sidebar-menu #main-menu > li > ul {
			.border-radius(0 0 0 @border_radius);
		}

		&.sidebar-collapsed .sidebar-menu #main-menu > li#search.focused .search-input {
			left: auto;
			right: @sidebar_collapsed_width;
			.border-radius(@border_radius 0 0 @border_radius);
		}


		// Horizontal
		&.horizontal-menu.with-sidebar {
			padding-left: 0;
			//padding-right: @sidebar_menu_width;
		}

		&.horizontal-menu.with-sidebar.sidebar-collapsed {
			padding-left: 0;
			//padding-right: @sidebar_collapsed_width;
		}


		// Chat
		&.chat-visible .main-content {
			padding-left: @chat_width + @inner_padding;
			padding-right: @inner_padding;
		}

		#chat {
			left: 0;
			right: auto;

			.chat-conversation {
				left: @chat_width;
				right: auto;
				.border-radius(0 @border-radius-base @border-radius-base 0);
			}
		}

		// Sidebar Collapsing
		&.sidebar-is-collapsing {

			.sidebar-menu #main-menu li a i {
				.translateX(0);
			}

			.sidebar-menu {
				.transition(~"all 350ms");

				.sidebar-user-info .user-link {

					span, strong {
						.opacity(0);
					}
				}
			}

			&.sidebar-collapsing-phase-2 {
				padding-right: @sidebar_collapsed_width;
				.transition(~"all 600ms");

				.sidebar-menu {
					width: @sidebar_collapsed_width;

					.logo-env > .logo,
					#main-menu li > a:before,
					#main-menu li a span,
					.sidebar-user-info .user-link span,
					.sidebar-user-info .user-link strong {
						.opacity(0);
						visibility: hidden;
						display: none;
					}
				}
			}
		}

		// Sidebar Expanding
		&.sidebar-is-showing {

		}

		&.sidebar-collapsed .sidebar-menu #main-menu > li.has-sub:hover.has-sub > a > span:not(.badge),
		&.sidebar-collapsed .sidebar-menu #main-menu > li:hover.has-sub > a > span:not(.badge) {
			.border-radius(@border_radius 0 0 0);
		}
	}
}