/* Menu box
===================*/

	.rgsm21 {
		background:#303030; /* Old browsers */
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2f21_menu_bg.png);
		background-image:-moz-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#606060),color-stop(100%,#000000));
		background-image:-webkit-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-o-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-ms-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:linear-gradient(top,#606060 0%,#000000 100%);
		-moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px;
	}
	.rgsm21-vertical { -moz-box-shadow:0 1px 4px rgba(0,0,0,0.3);  -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.3);  box-shadow:0 1px 4px rgba(0,0,0,0.3); }
	.rgsm21 ul {
		border:1px solid #000000; padding:7px 0; background:#333;
		-moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px; border-radius:0 0 4px 4px;
		-moz-box-shadow:0 5px 12px rgba(0,0,0,0.9); -webkit-box-shadow:0 5px 12px rgba(0,0,0,0.9); box-shadow:0 5px 12px rgba(0,0,0,0.9);
	}
	/* for vertical main menu subs and 2+ level horizontal main menu subs round all corners */
	.rgsm21-vertical ul, .rgsm21 ul ul { -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; }


/* Menu items
===================*/

	.rgsm21 a {
		padding:13px 24px; line-height:23px;
		font-family:"Helvetica","Arial Narrow",Arial,Helvetica,sans-serif;
		color:#fff; font-size:14px; font-weight:bold; text-decoration:none; text-shadow:0 1px 2px rgba(0,0,0,0.7);
	}
	.rgsm21 a:hover, .rgsm21 a:focus, .rgsm21 a:active,
	.rgsm21 a.highlighted {
		background:#303030; /* Old browsers */
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2fmain-item-hover-bg.png);
		background-image:-moz-linear-gradient(top,#505050 0%,#080808 100%);
		background-image:-webkit-gradient(linear,left top, left bottom,color-stop(0%,#505050),color-stop(100%,#080808));
		background-image:-webkit-linear-gradient(top,#505050 0%,#080808 100%);
		background-image:-o-linear-gradient(top,#505050 0%,#080808 100%);
		background-image:-ms-linear-gradient(top,#505050 0%,#080808 100%);
		background-image:linear-gradient(top,#505050 0%,#080808 100%);
		color:#fff;
	}
	.rgsm21-vertical a {
		padding:9px 40px 8px 23px;
		background:#303030; /* Old browsers */
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2fvertical-main-item-bg.png);
		background-image:-moz-linear-gradient(top,#505050 0%,#111111 100%);
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#505050),color-stop(100%,#111111));
		background-image:-webkit-linear-gradient(top,#505050 0%,#111111 100%);
		background-image:-o-linear-gradient(top,#505050 0%,#111111 100%);
		background-image:-ms-linear-gradient(top,#505050 0%,#111111 100%);
		background-image:linear-gradient(top,#505050 0%,#111111 100%);
	}
	.rgsm21 ul a {
		padding:9px 40px 8px 23px; background:transparent;
		color:#c0c0c0; font-size:15px; text-shadow:1px 1px 3px rgba(0,0,0,0.9);
	}
	.rgsm21 ul a:hover, .rgsm21 ul a:focus, .rgsm21 ul a:active,
	.rgsm21 ul a.highlighted {
		background:#303030; /* Old browsers */
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2fmain-menu-bg.png);
		background-image:-moz-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#606060),color-stop(100%,#000000));
		background-image:-webkit-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-o-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:-ms-linear-gradient(top,#606060 0%,#000000 100%);
		background-image:linear-gradient(top,#606060 0%,#000000 100%);
		color:#fff; text-shadow:0 1px 0 rgba(0,0,0,0.7);
	}
	/* current items - add the class manually to some item or check the "markCurrentItem" script option */
	.rgsm21 a.current, .rgsm21 a.current:hover, .rgsm21 a.current:focus, .rgsm21 a.current:active,
	.rgsm21 ul a.current, .rgsm21 ul a.current:hover, .rgsm21 ul a.current:focus, .rgsm21 ul a.current:active {
		background:#181818;
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2fcurrent-item-bg.png);
		background-image:-moz-linear-gradient(top,#080808 0%,#282828 100%);
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#080808),color-stop(100%,#282828));
		background-image:-webkit-linear-gradient(top,#080808 0%,#282828 100%);
		background-image:-o-linear-gradient(top,#080808 0%,#282828 100%);
		background-image:-ms-linear-gradient(top,#080808 0%,#282828 100%);
		background-image:linear-gradient(top,#080808 0%,#282828 100%);
		color:#fff; text-shadow:0 1px 0 rgba(0,0,0,0.7);
	}
	/* round the left corners of the first item for horizontal main menu */
	.rgsm21 > li:first-child > a { -moz-border-radius:8px 0 0 8px; -webkit-border-radius:8px 0 0 8px; border-radius:8px 0 0 8px; }
	/* round the corners of the first and last items for vertical main menu */
	.rgsm21-vertical > li:first-child > a { -moz-border-radius:8px 8px 0 0; -webkit-border-radius:8px 8px 0 0; border-radius:8px 8px 0 0; }
	.rgsm21-vertical > li:last-child > a { -moz-border-radius:0 0 8px 8px; -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px; }
	.rgsm21 a.has-submenu { 	}


/* Sub menu indicators
===================*/

	.rgsm21 a span.sub-arrow {
		position:absolute; overflow:hidden; bottom:2px; left:50%; margin-left:-5px;
		/* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
		width:0; height:0;
		border-width:5px; /* tweak size of the arrow */
		border-style:solid dashed dashed dashed;
		border-color:#909898 transparent transparent transparent;
	}
	.rgsm21-vertical a span.sub-arrow,
 	.rgsm21 ul a span.sub-arrow {
		bottom:auto; top:50%; margin-top:-5px; right:15px; left:auto; margin-left:0;
		border-style:dashed dashed dashed solid;
		border-color:transparent transparent transparent #909898;
	}


/* Items separators
===================*/

	.rgsm21 li { border-left:1px solid #303030; }
	.rgsm21 li:first-child, .rgsm21-vertical li, .rgsm21 ul li { border-left:0; }


/* Scrolling arrows containers for tall sub menus - test sub menu: "Sub test" -> "more..." -> "more..." in the default download package
===================*/

	.rgsm21 span.scroll-up, .rgsm21 span.scroll-down {
		position:absolute; display:none; visibility:hidden; overflow:hidden;
		background:#ffffff; height:20px;
		/* width and position will be automatically set by the script */
	}
	.rgsm21 span.scroll-up-arrow, .rgsm21 span.scroll-down-arrow {
		position:absolute; overflow:hidden; top:-2px; left:50%;	margin-left:-8px;
		/* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
		width:0; height:0;
		border-width:8px; /* tweak size of the arrow */
		border-style:dashed dashed solid dashed;
		border-color:transparent transparent #303838 transparent;
	}
	.rgsm21 span.scroll-down-arrow {
		top:6px;
		border-style:solid dashed dashed dashed;
		border-color:#303838 transparent transparent transparent;
	}



/*
---------------------------------------------------------------
  Responsiveness
  These will make the sub menus collapsible when the screen width is too small.
---------------------------------------------------------------*/


/* decrease horizontal main menu items left/right padding to avoid wrapping */
@media screen and (max-width: 850px) {
	.rgsm21:not(.rgsm21-vertical) > li > a { padding-left:18px; padding-right:18px; }
}
@media screen and (max-width: 750px) {
	.rgsm21:not(.rgsm21-vertical) > li > a { padding-left:10px; padding-right:10px; }
}

@media screen and (max-width: 640px) {
	/* The following will make the sub menus collapsible for small screen devices (it's not recommended editing these) */
	ul.rgsm21{width:auto !important;}
	ul.rgsm21 ul{display:none;position:static !important;top:auto !important;left:auto !important;margin-left:0 !important;margin-top:0 !important;width:auto !important;min-width:0 !important;max-width:none !important;}
	ul.rgsm21>li{float:none;}
	ul.rgsm21>li>a,ul.rgsm21 ul.sm-nowrap>li>a{white-space:normal;}
	ul.rgsm21 iframe{display:none;}

	/* Uncomment this rule to disable completely the sub menus for small screen devices */
	/*.rgsm21 ul, .rgsm21 span.sub-arrow, .rgsm21 iframe {
		display:none !important;
	}*/


/* Menu box
===================*/

	.rgsm21 {
		background:transparent;
		-moz-box-shadow:0 1px 4px rgba(0,0,0,0.3); -webkit-box-shadow:0 1px 4px rgba(0,0,0,0.3); box-shadow:0 1px 4px rgba(0,0,0,0.3);
	}
	.rgsm21 ul {
		border:0; padding:0; background:#fff;
		-moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
		-moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none;
	}
	.rgsm21 ul ul {
		/* darken the background of the 2+ level sub menus and remove border rounding */
		background:rgba(100,100,100,0.1);
		-moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
	}


/* Menu items
===================*/

	.rgsm21 a {
		padding:10px 5px 10px 28px !important; /* add some additional left padding to make room for the sub indicator */
		background:#303030 !important; /* Old browsers */
		background-image:url(axd_h/gett.axd?f=public%2fmenu_h%2f21%2fVertical-main-item-bg.png) !important;
		background-image:-moz-linear-gradient(top,#505050 0%,#111111 100%) !important;
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#505050),color-stop(100%,#111111)) !important;
		background-image:-webkit-linear-gradient(top,#505050 0%,#111111 100%) !important;
		background-image:-o-linear-gradient(top,#505050 0%,#111111 100%) !important;
		background-image:-ms-linear-gradient(top,#505050 0%,#111111 100%) !important;
		background-image:linear-gradient(top,#505050 0%,#111111 100%) !important;
		color:#fff !important;
	}
	.rgsm21 ul a {
		background:transparent !important;
		color:#303838 !important;
		text-shadow:none !important;
	}
	.rgsm21 a.current {
		background:#181818 !important; /* Old browsers */
		background-image:url(css-gradients-fallback/current-item-bg.png) !important;
		background-image:-moz-linear-gradient(top,#080808 0%,#282828 100%) !important;
		background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0%,#080808),color-stop(100%,#282828)) !important;
		background-image:-webkit-linear-gradient(top,#080808 0%,#282828 100%) !important;
		background-image:-o-linear-gradient(top,#080808 0%,#282828 100%) !important;
		background-image:-ms-linear-gradient(top,#080808 0%,#282828 100%) !important;
		background-image:linear-gradient(top,#080808 0%,#282828 100%) !important;
		color:#fff !important;
	}
	/* add some text indentation for the 2+ level sub menu items */
	.rgsm21 ul a {	border-left:8px solid transparent; }
	.rgsm21 ul ul a { border-left:16px solid transparent; }
	.rgsm21 ul ul ul a { border-left:24px solid transparent; }
	.rgsm21 ul ul ul ul a { border-left:32px solid transparent; }
	.rgsm21 ul ul ul ul ul a { border-left:40px solid transparent; }
	/* round the corners of the first and last items */
	.rgsm21 > li:first-child > a { -moz-border-radius:8px 8px 0 0; -webkit-border-radius:8px 8px 0 0; border-radius:8px 8px 0 0; }
	/* presume we have 4 levels max */
	.rgsm21 > li:last-child > a,
	.rgsm21 > li:last-child > ul > li:last-child > a,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > a,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a,
	.rgsm21 > li:last-child > ul,
	.rgsm21 > li:last-child > ul > li:last-child > ul,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul {
		-moz-border-radius:0 0 8px 8px; -webkit-border-radius:0 0 8px 8px; border-radius:0 0 8px 8px;
	}
	/* highlighted items, don't need rounding since their sub is open */
	.rgsm21 > li:last-child > a.highlighted,
	.rgsm21 > li:last-child > ul > li:last-child > a.highlighted,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted,
	.rgsm21 > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted {
		-moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
	}


/* Sub menu indicators
===================*/

	.rgsm21 a span.sub-arrow,
	.rgsm21 ul a span.sub-arrow {
		top:50%; margin-top:-9px; right:auto; left:6px; margin-left:0;
		width:17px; height:17px; border:0;
		font:bold 16px/16px monospace !important;
		text-align:center; text-shadow:none;
		background:rgba(0,0,0,0.1);
		-moz-border-radius:100px; -webkit-border-radius:100px; border-radius:100px;
	}
	/* Hide sub indicator "+" when item is expanded - we enable the item link when it's expanded */
	.rgsm21 a.highlighted span.sub-arrow { display:none !important; }


/* Items separators
===================*/
	.rgsm21 li { border-left:0; }
	.rgsm21 ul li { border-top:1px solid rgba(0,0,0,0.05); }
	.rgsm21 ul li:first-child { border-top:0; }

}