// //colors
// $COLOR_LINK_HOVER_BACKGROUND: #ccdda0;
// $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT1: #e4f3bf;
// $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2: #d6e5af;
// $COLOR_NAVDETAIL_BORDER: #b8e353;
// $COLOR_NAVDETAIL_HOVER_BACKGROUND: #f3f9e4;
// $COLOR_LINK_BORDER: #b8e353;
// $COLOR_LINK_BACKGROUND: #ccdda0;
// $COLOR_LINK_BACKGROUND_LINER_GRADIENT1: #edfcc8;
// $COLOR_LINK_BACKGROUND_LINER_GRADIENT2: #d6e5af;
// $COLOR_LINK_BACKGROUND_LINER_GRADIENT4: #bacb8e;
//
// //urls
// $url_imagecolor_01: url(../../../../images/gem/skin/vertical/icon-navgreen-02.png);
//
// $color_name: green

//@extend-elements
//original selectors
//#nav li.bg-green.menu-action.selected p a, #nav li.bg-green.menu-entity.selected p a
%extend_imagecolor_01 {
	background: $url_imagecolor_01, $COLOR_LINK_HOVER_BACKGROUND;
	background: $url_imagecolor_01, linear-gradient($COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT1 0, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND 54%, $COLOR_LINK_HOVER_BACKGROUND 100%);
	background-repeat: no-repeat;
	background-position: 5% 50%;
}

.hgroup-01 span.imgclr_#{$color_name} svg {
	color: $COLOR_IMAGE_COLOR;
}

#nav li.bg-#{$color_name} {
	&.menu-action {
		&.selected p a {
			@extend %extend_imagecolor_01;
		}
		p a:hover {
			background: $COLOR_LINK_HOVER_BACKGROUND;
			background: linear-gradient($COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT1 0, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND 54%, $COLOR_LINK_HOVER_BACKGROUND 100%);
		}
	}
	&.menu-entity {
		&.selected p a {
			@extend %extend_imagecolor_01;
		}
		p a:hover {
			background: $COLOR_LINK_HOVER_BACKGROUND;
			background: linear-gradient($COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT1 0, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND 54%, $COLOR_LINK_HOVER_BACKGROUND 100%);
		}
	}
	&.hover {
		ul {
			&.nav-detail {
				border-color: $COLOR_NAVDETAIL_BORDER;
				li {
					&.current a {
						background: $COLOR_NAVDETAIL_HOVER_BACKGROUND;
						font-weight: bold;
					}
					&.menu-node.selected > a {
						background: $COLOR_NAVDETAIL_HOVER_BACKGROUND;
					}
					&.menu-action.selected > a {
						background: $url_imagecolor_01 no-repeat scroll 5% 50% $COLOR_NAVDETAIL_HOVER_BACKGROUND;
					}
					&.menu-entity.selected > a {
						background: $url_imagecolor_01 no-repeat scroll 5% 50% $COLOR_NAVDETAIL_HOVER_BACKGROUND;
					}
				}
				a:hover {
					background: $COLOR_NAVDETAIL_HOVER_BACKGROUND;
				}
			}
			&.subMenuList li:hover {
				background: $COLOR_NAVDETAIL_HOVER_BACKGROUND;
			}
		}
		p a {
			background: $COLOR_LINK_HOVER_BACKGROUND;
			background: linear-gradient($COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT1 0, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_HOVER_BACKGROUND 54%, $COLOR_LINK_HOVER_BACKGROUND 100%);
			border: 1px solid $COLOR_LINK_BORDER;
			border-bottom: none;
		}
	}
	p a {
		background: $COLOR_LINK_BACKGROUND;
		background: linear-gradient($COLOR_LINK_BACKGROUND_LINER_GRADIENT1 0, $COLOR_LINK_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_BACKGROUND_LINER_GRADIENT2 51%, $COLOR_LINK_BACKGROUND 54%, $COLOR_LINK_BACKGROUND_LINER_GRADIENT3 100%);
		border: 1px solid $COLOR_LINK_BORDER;
	}
}
