rt/share/html/NoAuth/css/base/superfish.css

   1
   2 /*** ESSENTIAL STYLES ***/
   3 .sf-menu, .sf-menu * {
   4         margin:                 0;
   5         padding:                0;
   6         list-style:             none;
   7 }
   8 .sf-menu {
   9         line-height:    1.0;
  10 }
  11 .sf-menu ul {
  12         position:               absolute;
  13         top:                    -999em;
  14         width:                  10em; /* left offset of submenus need to match (see below) */
  15 }
  16 .sf-menu ul li {
  17         width:                  100%;
  18 }
  19 .sf-menu li:hover {
  20         visibility:             inherit; /* fixes IE7 'sticky bug' */
  21 }
  22 .sf-menu li {
  23         float:                  left;
  24         position:               relative;
  25 }
  26 .sf-menu a {
  27         display:                block;
  28         position:               relative;
  29 }
  30 .sf-menu li:hover ul,
  31 .sf-menu li.sfHover ul {
  32         left:                   0;
  33         top:                    2em; /* match top ul list item height */
  34         z-index:                99;
  35 }
  36 ul.sf-menu li:hover li ul,
  37 ul.sf-menu li.sfHover li ul {
  38         top:                    -999em;
  39 }
  40 ul.sf-menu li li:hover ul,
  41 ul.sf-menu li li.sfHover ul {
  42         left:                   10em; /* match ul width */
  43         top:                    0;
  44 }
  45 ul.sf-menu li li:hover li ul,
  46 ul.sf-menu li li.sfHover li ul {
  47         top:                    -999em;
  48 }
  49 ul.sf-menu li li li:hover ul,
  50 ul.sf-menu li li li.sfHover ul {
  51         left:                   10em; /* match ul width */
  52         top:                    0;
  53 }
  54
  55 /*** DEMO SKIN ***/
  56 .sf-menu {
  57         float:                  left;
  58         margin-bottom:  1em;
  59 }
  60 .sf-menu a {
  61         border-left:    1px solid #fff;
  62         border-top:             1px solid #CFDEFF;
  63         padding:                .75em 1em;
  64         text-decoration:none;
  65 }
  66 .sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
  67         color:                  #13a;
  68 }
  69 .sf-menu li {
  70         background:             #BDD2FF;
  71 }
  72 .sf-menu li li {
  73         background:             #AABDE6;
  74 }
  75 .sf-menu li li li {
  76         background:             #9AAEDB;
  77 }
  78 .sf-menu li:hover, .sf-menu li.sfHover,
  79 .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
  80         background:             #CFDEFF;
  81         outline:                0;
  82 }
  83
  84 /*** arrows **/
  85 .sf-menu a.sf-with-ul {
  86         padding-right:  2.25em;
  87         min-width:              1px; /* trigger IE7 hasLayout so spans position accurately */
  88 }
  89 .sf-sub-indicator {
  90         position:               absolute;
  91         display:                block;
  92         right:                  .75em;
  93         top:                    1.05em; /* IE6 only */
  94         width:                  10px;
  95         height:                 10px;
  96         text-indent:    -999em;
  97         overflow:               hidden;
  98         background:             url(<%RT->Config->Get('WebPath')%>/NoAuth/css/images/arrows-ffffff.png) no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
  99 }
 100 a > .sf-sub-indicator {  /* give all except IE6 the correct values */
 101         top:                    .8em;
 102         background-position: 0 -100px; /* use translucent arrow for modern browsers*/
 103 }
 104 /* apply hovers to modern browsers */
 105 a:focus > .sf-sub-indicator,
 106 a:hover > .sf-sub-indicator,
 107 a:active > .sf-sub-indicator,
 108 li:hover > a > .sf-sub-indicator,
 109 li.sfHover > a > .sf-sub-indicator {
 110         background-position: -10px -100px; /* arrow hovers for modern browsers*/
 111 }
 112
 113 /* point right for anchors in subs */
 114 .sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
 115 .sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
 116 /* apply hovers to modern browsers */
 117 .sf-menu ul a:focus > .sf-sub-indicator,
 118 .sf-menu ul a:hover > .sf-sub-indicator,
 119 .sf-menu ul a:active > .sf-sub-indicator,
 120 .sf-menu ul li:hover > a > .sf-sub-indicator,
 121 .sf-menu ul li.sfHover > a > .sf-sub-indicator {
 122         background-position: -10px 0; /* arrow hovers for modern browsers*/
 123 }
 124
 125 /*** shadows for all but IE6 ***/
 126 .sf-shadow ul {
 127         background:     url(<%RT->Config->Get('WebPath')%>/NoAuth/css/images/shadow.png) no-repeat bottom right;
 128         padding: 0 8px 9px 0;
 129         -moz-border-radius-bottomleft: 17px;
 130         -moz-border-radius-topright: 17px;
 131         -webkit-border-top-right-radius: 17px;
 132         -webkit-border-bottom-left-radius: 17px;
 133         border-top-right-radius: 17px;
 134         border-bottom-left-radius: 17px;
 135 }
 136 .sf-shadow ul.sf-shadow-off {
 137         background: transparent;
 138 }