Merge branch 'refs/heads/feature/3.0.0-pre/design-fixes-accessibility-master' into feature/2.4.0/accessibility-master

public/stylesheets/application.css

@@ -1205,14 +1205,22 @@ a:hover {
   width:100%;
 }
 #header li.drop-down > a {
-	background:url(../images/arrow-down-white.png) no-repeat right center;
+  /* Arrow down white */
+  background-image:url(../images/top_menu_arrow_grey_white_sprite.png);
+  background-position:right -40px;
+  background-repeat:no-repeat;
 	padding-right:35px;
 }
 #header li > a:hover {
         background-color:#700407;
 }
 #header li.drop-down > a:hover {
-        background:#700407 url(../images/arrow-down-grey.png) no-repeat right center;
+  /* Arrow down grey */
+  background-image:url(../images/top_menu_arrow_grey_white_sprite.png);
+  background-position:right -2px;
+  background-repeat:no-repeat;
+
+  background-color:#700407;
 	padding-right:35px;
 }
 #header li li a:hover {
@@ -1240,17 +1248,30 @@ li a.home {
   text-indent:-999em;
   width:20px;
   height:43px;
-  background:url(../images/icon_home.png) no-repeat 50% 50%;
+
+  /* Home Black */
+  background-image:url(../images/home_black_white_sprite.png);
+  background-position:center -3px;
+  background-repeat:no-repeat;
+}
+
+li a.home:hover {
+  background-position:center -35px;
 }
 
 li a.help {
   text-indent:-999em;
   width:20px;
   height:43px;
-  background:url(../images/icon_help.png) no-repeat 50% 50%;
+
+  /* Question mark white */
+  background-image:url(../images/question_mark_grey_white_sprite.png);
+  background-repeat:no-repeat;
+  background-position:center -6px;
 }
 li a.help:hover {
-  background-image:url(../images/icon_help_grey.png);
+  /* Question mark grey */
+  background-position:center -41px;
 }
 #header li.drop-down.open > a {
 	background:#FFFFFF url(../images/arrow-down-grey.png) no-repeat right center;
@@ -1490,24 +1511,29 @@ div#optional_login_fields {
 	position:absolute;
 	right:0px;
 	top:0px;
-	background:url(../images/projectnavi_arrow_down.png) no-repeat 22px 7px;
 	width:40px;
 	height:25px;
 }
-#main-menu ul.menu_root li .open .toggler {
-  background-image:url(../images/projectnavi_arrow_up.png);
-}
-#main-menu ul.menu_root li .open:hover .toggler {
-  background-image:url(../images/projectnavi_arrow_up_white.png);
+#main-menu .toggler {
+  /* Arrow down */
+  background-image: url(../images/double_arrows_grey_white_sprite.png);
+  background-position: 10px -1px;
 }
-#main-menu ul.menu_root li .selected .toggler {
-  background-image:url(../images/projectnavi_arrow_down_white.png);
+
+#main-menu ul.menu_root li .open .toggler {
+  /* Arrow up */
+  background-image: url(../images/double_arrows_grey_white_sprite.png);
+  background-position: 10px -26px;
 }
-#main-menu ul.menu_root li .selected.open .toggler {
-  background-image:url(../images/projectnavi_arrow_up_white.png);
+#main-menu ul.menu_root li .selected.open .toggler, #main-menu ul.menu_root li .open:hover .toggler {
+  /* Arrow up white */
+  background-image: url(../images/double_arrows_grey_white_sprite.png);
+  background-position: 10px -159px;
 }
-#main-menu ul.menu_root li a:hover .toggler {
-  background-image:url(../images/projectnavi_arrow_down_white.png);
+#main-menu ul.menu_root li a:hover .toggler, #main-menu ul.menu_root li .selected .toggler {
+  /* Arrow down white */
+  background-image: url(../images/double_arrows_grey_white_sprite.png);
+  background-position: 10px -120px;
 }
 
 #main-menu ul.menu_root li li .toggler {
@@ -2812,14 +2838,32 @@ ul.action_menu_more {
 #main-menu #toggle-project-menu a.navigation-toggler {
   position:relative;
   float:right;
-  background: url(../images/projectnavi_arrow_left.png) 160px 5px no-repeat;
   width:100%;
   height:15px;
+
+  /* Arrow left */
+  background-image:url(../images/double_arrows_grey_white_sprite.png);
+  background-position:148px -91px;
+  background-repeat:no-repeat;
 }
 #main-menu #toggle-project-menu.show a.navigation-toggler {
-  background: url(../images/projectnavi_arrow_right.png) 4px 5px no-repeat;
   width:15px;
   height:100%;
+
+  /* Arrow right */
+  background-image:url(../images/double_arrows_grey_white_sprite.png);
+  background-position:-8px -200px;
+  background-repeat:no-repeat;
+}
+#main-menu #toggle-project-menu a.navigation-toggler:hover {
+  /* Arrow left white */
+  background-position:148px -58px;
+  background-repeat:no-repeat;
+}
+#main-menu #toggle-project-menu.show a.navigation-toggler:hover {
+  /* Arrow right white */
+  background-position:-39px -200px;
+  background-repeat:no-repeat;
 }
 .navigate-left {
   background: url(../images/arrow_left_darkred.png) 0 0px no-repeat;