Team:UNAM-Genomics Mexico/Templates/Menu

From 2011.igem.org

(Difference between revisions)
(Entered the menu CSS, separating and modularizing it)
 
Line 6: Line 6:
VERSION  3.0.0
VERSION  3.0.0
AUTHOR  Treviño Garza Abiel
AUTHOR  Treviño Garza Abiel
-
        Eduardo Vladimir Muñoz Hernández
 
DESC    The file contains the layout instructions for the menu used in the UNAM-Genomics_Mexico Team wiki.
DESC    The file contains the layout instructions for the menu used in the UNAM-Genomics_Mexico Team wiki.
*/
*/
/* Menu Style Definitions */
/* Menu Style Definitions */
-
ul#h2igemmenu ul{
+
/* MENU STYLE DEFINITIONS */
 +
/*PINK PART*/
 +
ul#h2igemmenupink ul{
display:none
display:none
}
}
-
ul#h2igemmenu li:hover>*{
+
ul#h2igemmenupink li:hover>*{
display:block
display:block
}
}
-
ul#h2igemmenu li:hover{
+
ul#h2igemmenupink li:hover{
position:relative;
position:relative;
}
}
-
ul#h2igemmenu ul{
+
ul#h2igemmenupink ul{
position: absolute;
position: absolute;
left:-1px;
left:-1px;
-
top:98%;
+
top:100%;
}
}
-
ul#h2igemmenu ul ul{
+
ul#h2igemmenupink ul ul{
position:absolute;
position:absolute;
left:98%;
left:98%;
top:-2px;
top:-2px;
}
}
-
ul#h2igemmenu,ul#h2igemmenu ul{
+
ul#h2igemmenupink,ul#h2igemmenupink ul{
margin:0px;
margin:0px;
list-style:none;
list-style:none;
Line 39: Line 40:
border-color:transparent;
border-color:transparent;
}
}
-
ul#h2igemmenu table {
+
ul#h2igemmenupink table {
border-collapse:collapse
border-collapse:collapse
}
}
-
ul#h2igemmenu {
+
ul#h2igemmenupink {
display:block;
display:block;
font-size:0;
font-size:0;
Line 49: Line 50:
float: left;
float: left;
}
}
-
ul#h2igemmenu ul{
+
ul#h2igemmenupink ul{
//width:204px;
//width:204px;
padding:0;
padding:0;
}
}
-
ul#h2igemmenu li{
+
ul#h2igemmenupink li{
display:block;
display:block;
zoom:1;
zoom:1;
Line 60: Line 61:
float:left;
float:left;
}
}
-
ul#h2igemmenu a:active, ul#h2igemmenu a:focus {
+
ul#h2igemmenupink a:active, ul#h2igemmenupink a:focus {
outline-style:none
outline-style:none
}
}
-
ul#h2igemmenu a,ul#h2igemmenu li.dis a:hover{
+
ul#h2igemmenupink a,ul#h2igemmenupink li.dis a:hover{
display:block;
display:block;
vertical-align:middle;
vertical-align:middle;
_display:inline-block;
_display:inline-block;
_vertical-align:top;
_vertical-align:top;
-
background-color:#333;
+
background-color:#FF3366;
border-width:0px;
border-width:0px;
border-style:none;
border-style:none;
Line 76: Line 77:
padding:11px 15px 5px 5px;
padding:11px 15px 5px 5px;
_padding-left:0;
_padding-left:0;
-
font:normal 8pt Verdana;
+
font:bold 8pt Verdana;
color: #FFFFFF;
color: #FFFFFF;
text-decoration:none;
text-decoration:none;
cursor:pointer;
cursor:pointer;
}
}
-
ul#h2igemmenu ul li {
+
ul#h2igemmenupink ul li {
float:none;
float:none;
}
}
-
ul#h2igemmenu ul a,ul#h2igemmenu ul li.dis a:hover{
+
ul#h2igemmenupink ul a,ul#h2igemmenupink ul li.dis a:hover{
display:block;
display:block;
text-align:left;
text-align:left;
white-space:nowrap;
white-space:nowrap;
}
}
-
ul#h2igemmenu li:hover>a{
+
ul#h2igemmenupink li:hover>a{
-
background-color:#999;
+
background-color:#993366;
border-color:transparent;
border-color:transparent;
border-style:none;
border-style:none;
-
font:normal 8pt Verdana;
+
font:bold 8pt Verdana;
color: #FFFFFF;
color: #FFFFFF;
text-decoration:none;
text-decoration:none;
}
}
-
ul#h2igemmenu li a:hover{
+
ul#h2igemmenupink li a:hover{
_position:relative;
_position:relative;
-
background-color:#666;
+
background-color:#993366;
border-color:transparent;
border-color:transparent;
border-style:none;
border-style:none;
-
font:normal 8pt Verdana;
+
font:bold 8pt Verdana;
color: #FFFFFF;
color: #FFFFFF;
text-decoration:none;
text-decoration:none;
}
}
-
ul#h2igemmenu li.dis a{
+
ul#h2igemmenupink li.dis a{
color: #AAAAAA !important;
color: #AAAAAA !important;
}  
}  
-
ul#h2igemmenu img{
+
ul#h2igemmenupink img{
border:none;
border:none;
vertical-align:middle;
vertical-align:middle;
margin-right:22px;
margin-right:22px;
}
}
-
ul#h2igemmenu img.over{
+
ul#h2igemmenupink img.over{
display:none
display:none
}
}
-
ul#h2igemmenu li.dis a:hover img.over{
+
ul#h2igemmenupink li.dis a:hover img.over{
display:none !important
display:none !important
}
}
-
ul#h2igemmenu li.dis a:hover img.def {
+
ul#h2igemmenupink li.dis a:hover img.def {
display:inline !important
display:inline !important
}
}
-
ul#h2igemmenu li:hover > a img.def  {
+
ul#h2igemmenupink li:hover > a img.def  {
display:none
display:none
}
}
-
ul#h2igemmenu li:hover > a img.over {display:inline}
+
ul#h2igemmenupink li:hover > a img.over {display:inline}
-
ul#h2igemmenu a:hover img.over,ul#h2igemmenu a:hover ul img.def,ul#h2igemmenu a:hover a:hover ul img.def,ul#h2igemmenu a:hover a:hover img.over,ul#h2igemmenu a:hover a:hover a:hover img.over{display:inline}
+
ul#h2igemmenupink a:hover img.over,ul#h2igemmenupink a:hover ul img.def,ul#h2igemmenupink a:hover a:hover ul img.def,ul#h2igemmenupink a:hover a:hover img.over,ul#h2igemmenupink a:hover a:hover a:hover img.over{display:inline}
-
ul#h2igemmenu a:hover img.def,ul#h2igemmenu a:hover ul img.over,ul#h2igemmenu a:hover a:hover ul img.over,ul#h2igemmenu a:hover a:hover img.def,ul#h2igemmenu a:hover a:hover a:hover img.def{display:none}
+
ul#h2igemmenupink a:hover img.def,ul#h2igemmenupink a:hover ul img.over,ul#h2igemmenupink a:hover a:hover ul img.over,ul#h2igemmenupink a:hover a:hover img.def,ul#h2igemmenupink a:hover a:hover a:hover img.def{display:none}
-
ul#h2igemmenu a:hover ul,ul#h2igemmenu a:hover a:hover ul{display:block}
+
ul#h2igemmenupink a:hover ul,ul#h2igemmenupink a:hover a:hover ul{display:block}
-
ul#h2igemmenu a:hover ul ul{display:none}
+
ul#h2igemmenupink a:hover ul ul{display:none}
-
ul#h2igemmenu span{
+
ul#h2igemmenupink span{
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
-
ul#h2igemmenu ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
+
ul#h2igemmenupink ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
-
ul#h2igemmenu li a.istylei0,ul#h2igemmenu li.dis.istylei0:hover a.istylei0{
+
ul#h2igemmenupink li a.istylei0pink,ul#h2igemmenupink li.dis.istylei0pink:hover a.istylei0pink{
height:25px;
height:25px;
-
background-color:#333;
+
background-color:#FF3366;
border-width:0px;
border-width:0px;
border-style:none;
border-style:none;
-
font:normal 14px Trebuchet MS;
+
font:bold 14px Trebuchet MS;
color:#FFFFFF;
color:#FFFFFF;
text-decoration:none;
text-decoration:none;
Line 155: Line 156:
}
}
-
ul#h2igemmenu li.istylei0:hover>a{
+
ul#h2igemmenupink li.istylei0pink:hover>a{
-
background-color:#333;
+
background-color:#FF3366;
border-style:none;
border-style:none;
-
font:normal 14px Trebuchet MS;
+
font:bold 14px Trebuchet MS;
color:#FFFFFF;
color:#FFFFFF;
text-decoration:none;
text-decoration:none;
}
}
-
ul#h2igemmenu li.istylei0,ul#h2igemmenu li.dis.istylei0:hover{
+
ul#h2igemmenupink li.istylei0pink,ul#h2igemmenupink li.dis.istylei0pink:hover{
margin:0 10px 0 0;
margin:0 10px 0 0;
-
background-color:#333;
+
background-color:#FF3366;
background-position:0 0;
background-position:0 0;
}
}
-
ul#h2igemmenu li.istylei0:hover{
+
ul#h2igemmenupink li.istylei0pink:hover{
-
background-color:#333;
+
background-color:#FF3366;
}
}
-
ul#h2igemmenu li a.istylei0:hover{
+
ul#h2igemmenupink li a.istylei0pink:hover{
-
background-color:#666;
+
background-color:#993366;
border-style:none;
border-style:none;
-
font:normal 14px Trebuchet MS;
+
font:bold 14px Trebuchet MS;
color:#FFFFFF;
color:#FFFFFF;
text-decoration:none;
text-decoration:none;
Line 182: Line 183:
}
}
-
ul#h2igemmenu.istylem0,ul#h2igemmenu ul.istylem0{
+
ul#h2igemmenupink.istylem0pink,ul#h2igemmenupink ul.istylem0pink{
background-color:transparent;
background-color:transparent;
border-width:0px;
border-width:0px;
Line 189: Line 190:
}
}
-
ul#h2igemmenu ul.istylem0 li{
+
ul#h2igemmenupink ul.istylem0pink li{
margin:0;
margin:0;
}
}
-
ul#h2igemmenu.istylem0 li a,ul#h2igemmenu ul.istylem0 li a,ul#h2igemmenu.istylem0 li.dis a:hover,ul#h2igemmenu ul.istylem0 li.dis a:hover{
+
ul#h2igemmenupink.istylem0pink li a,ul#h2igemmenupink ul.istylem0pink li a,ul#h2igemmenupink.istylem0pink li.dis a:hover,ul#h2igemmenupink ul.istylem0pink li.dis a:hover{
padding:5px 5px 5px 5px;
padding:5px 5px 5px 5px;
}
}
 +
 +
/*YELLOW PART*/
 +
ul#h2igemmenyellow ul{
 +
display:none
 +
}
 +
ul#h2igemmenyellow li:hover>*{
 +
display:block
 +
}
 +
ul#h2igemmenyellow li:hover{
 +
position:relative;
 +
}
 +
ul#h2igemmenyellow ul{
 +
position: absolute;
 +
left:-1px;
 +
top:100%;
 +
}
 +
ul#h2igemmenyellow ul ul{
 +
position:absolute;
 +
left:98%;
 +
top:-2px;
 +
}
 +
ul#h2igemmenyellow,ul#h2igemmenyellow ul{
 +
margin:0px;
 +
list-style:none;
 +
padding:0px;
 +
background-image:#CCC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
}
 +
ul#h2igemmenyellow table {
 +
border-collapse:collapse
 +
}
 +
ul#h2igemmenyellow {
 +
display:block;
 +
font-size:0;
 +
zoom:1;
 +
width:100%;
 +
float: left;
 +
}
 +
ul#h2igemmenyellow ul{
 +
//width:204px;
 +
padding:0;
 +
}
 +
ul#h2igemmenyellow li{
 +
display:block;
 +
zoom:1;
 +
margin:0;
 +
font-size:0;
 +
float:left;
 +
}
 +
ul#h2igemmenyellow a:active, ul#h2igemmenyellow a:focus {
 +
outline-style:none
 +
}
 +
ul#h2igemmenyellow a,ul#h2igemmenyellow li.dis a:hover{
 +
display:block;
 +
vertical-align:middle;
 +
_display:inline-block;
 +
_vertical-align:top;
 +
background-color:#FFCC33;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
text-align:center;
 +
text-decoration:none;
 +
padding:11px 15px 5px 5px;
 +
_padding-left:0;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
cursor:pointer;
 +
}
 +
ul#h2igemmenyellow ul li {
 +
float:none;
 +
}
 +
ul#h2igemmenyellow ul a,ul#h2igemmenyellow ul li.dis a:hover{
 +
display:block;
 +
text-align:left;
 +
white-space:nowrap;
 +
}
 +
ul#h2igemmenyellow li:hover>a{
 +
background-color:#999900;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenyellow li a:hover{
 +
_position:relative;
 +
background-color:#999900;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenyellow li.dis a{
 +
color: #AAAAAA !important;
 +
}
 +
ul#h2igemmenyellow img{
 +
border:none;
 +
vertical-align:middle;
 +
margin-right:22px;
 +
}
 +
ul#h2igemmenyellow img.over{
 +
display:none
 +
}
 +
ul#h2igemmenyellow li.dis a:hover img.over{
 +
display:none !important
 +
}
 +
ul#h2igemmenyellow li.dis a:hover img.def {
 +
display:inline !important
 +
}
 +
ul#h2igemmenyellow li:hover > a img.def  {
 +
display:none
 +
}
 +
ul#h2igemmenyellow li:hover > a img.over {display:inline}
 +
 +
ul#h2igemmenyellow a:hover img.over,ul#h2igemmenyellow a:hover ul img.def,ul#h2igemmenyellow a:hover a:hover ul img.def,ul#h2igemmenyellow a:hover a:hover img.over,ul#h2igemmenyellow a:hover a:hover a:hover img.over{display:inline}
 +
 +
ul#h2igemmenyellow a:hover img.def,ul#h2igemmenyellow a:hover ul img.over,ul#h2igemmenyellow a:hover a:hover ul img.over,ul#h2igemmenyellow a:hover a:hover img.def,ul#h2igemmenyellow a:hover a:hover a:hover img.def{display:none}
 +
 +
ul#h2igemmenyellow a:hover ul,ul#h2igemmenyellow a:hover a:hover ul{display:block}
 +
 +
ul#h2igemmenyellow a:hover ul ul{display:none}
 +
 +
ul#h2igemmenyellow span{
 +
 +
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
 +
 +
ul#h2igemmenyellow ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
 +
 +
ul#h2igemmenyellow li a.istylei0yellow,ul#h2igemmenyellow li.dis.istylei0yellow:hover a.istylei0yellow{
 +
height:25px;
 +
background-color:#FFCC33;
 +
border-width:0px;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
margin:0 -10px 0 10px;
 +
_margin:0 0 0 0;
 +
background-position:100% 0;
 +
}
 +
 +
ul#h2igemmenyellow li.istylei0yellow:hover>a{
 +
background-color:#FFCC33;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
}
 +
 +
ul#h2igemmenyellow li.istylei0yellow,ul#h2igemmenyellow li.dis.istylei0yellow:hover{
 +
margin:0 10px 0 0;
 +
background-color:#FFCC33;
 +
background-position:0 0;
 +
}
 +
 +
ul#h2igemmenyellow li.istylei0yellow:hover{
 +
background-color:#FFCC33;
 +
}
 +
 +
ul#h2igemmenyellow li a.istylei0yellow:hover{
 +
background-color:#999900;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
font-weight: bold;
 +
}
 +
 +
ul#h2igemmenyellow.istylem0yellow,ul#h2igemmenyellow ul.istylem0yellow{
 +
background-color:transparent;
 +
border-width:0px;
 +
border-style:none;
 +
padding:0;
 +
}
 +
 +
ul#h2igemmenyellow ul.istylem0yellow li{
 +
margin:0;
 +
}
 +
 +
ul#h2igemmenyellow.istylem0yellow li a,ul#h2igemmenyellow ul.istylem0yellow li a,ul#h2igemmenyellow.istylem0yellow li.dis a:hover,ul#h2igemmenyellow ul.istylem0yellow li.dis a:hover{
 +
padding:5px 5px 5px 5px;
 +
}
 +
 +
/*Blue Part*/
 +
ul#h2igemmenublue ul{
 +
display:none
 +
}
 +
ul#h2igemmenublue li:hover>*{
 +
display:block
 +
}
 +
ul#h2igemmenublue li:hover{
 +
position:relative;
 +
}
 +
ul#h2igemmenublue ul{
 +
position: absolute;
 +
left:-1px;
 +
top:100%;
 +
}
 +
ul#h2igemmenublue ul ul{
 +
position:absolute;
 +
left:98%;
 +
top:-2px;
 +
}
 +
ul#h2igemmenublue,ul#h2igemmenublue ul{
 +
margin:0px;
 +
list-style:none;
 +
padding:0px;
 +
background-image:#CCC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
}
 +
ul#h2igemmenublue table {
 +
border-collapse:collapse
 +
}
 +
ul#h2igemmenublue {
 +
display:block;
 +
font-size:0;
 +
zoom:1;
 +
width:100%;
 +
float: left;
 +
}
 +
ul#h2igemmenublue ul{
 +
//width:204px;
 +
padding:0;
 +
}
 +
ul#h2igemmenublue li{
 +
display:block;
 +
zoom:1;
 +
margin:0;
 +
font-size:0;
 +
float:left;
 +
}
 +
ul#h2igemmenublue a:active, ul#h2igemmenublue a:focus {
 +
outline-style:none
 +
}
 +
ul#h2igemmenublue a,ul#h2igemmenublue li.dis a:hover{
 +
display:block;
 +
vertical-align:middle;
 +
_display:inline-block;
 +
_vertical-align:top;
 +
background-color:#3399CC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
text-align:center;
 +
text-decoration:none;
 +
padding:11px 15px 5px 5px;
 +
_padding-left:0;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
cursor:pointer;
 +
}
 +
ul#h2igemmenublue ul li {
 +
float:none;
 +
}
 +
ul#h2igemmenublue ul a,ul#h2igemmenublue ul li.dis a:hover{
 +
display:block;
 +
text-align:left;
 +
white-space:nowrap;
 +
}
 +
ul#h2igemmenublue li:hover>a{
 +
background-color:#006699;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenublue li a:hover{
 +
_position:relative;
 +
background-color:#006699;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenublue li.dis a{
 +
color: #AAAAAA !important;
 +
}
 +
ul#h2igemmenublue img{
 +
border:none;
 +
vertical-align:middle;
 +
margin-right:22px;
 +
}
 +
ul#h2igemmenublue img.over{
 +
display:none
 +
}
 +
ul#h2igemmenublue li.dis a:hover img.over{
 +
display:none !important
 +
}
 +
ul#h2igemmenublue li.dis a:hover img.def {
 +
display:inline !important
 +
}
 +
ul#h2igemmenublue li:hover > a img.def  {
 +
display:none
 +
}
 +
ul#h2igemmenublue li:hover > a img.over {display:inline}
 +
 +
ul#h2igemmenublue a:hover img.over,ul#h2igemmenublue a:hover ul img.def,ul#h2igemmenublue a:hover a:hover ul img.def,ul#h2igemmenublue a:hover a:hover img.over,ul#h2igemmenublue a:hover a:hover a:hover img.over{display:inline}
 +
 +
ul#h2igemmenublue a:hover img.def,ul#h2igemmenublue a:hover ul img.over,ul#h2igemmenublue a:hover a:hover ul img.over,ul#h2igemmenublue a:hover a:hover img.def,ul#h2igemmenublue a:hover a:hover a:hover img.def{display:none}
 +
 +
ul#h2igemmenublue a:hover ul,ul#h2igemmenublue a:hover a:hover ul{display:block}
 +
 +
ul#h2igemmenublue a:hover ul ul{display:none}
 +
 +
ul#h2igemmenublue span{
 +
 +
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
 +
 +
ul#h2igemmenublue ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
 +
 +
ul#h2igemmenublue li a.istylei0blue,ul#h2igemmenublue li.dis.istylei0blue:hover a.istylei0blue{
 +
height:25px;
 +
background-color:#3399CC;
 +
border-width:0px;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
margin:0 -10px 0 10px;
 +
_margin:0 0 0 0;
 +
background-position:100% 0;
 +
}
 +
 +
ul#h2igemmenublue li.istylei0blue:hover>a{
 +
background-color:#3399CC;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
}
 +
 +
ul#h2igemmenublue li.istylei0blue,ul#h2igemmenublue li.dis.istylei0blue:hover{
 +
margin:0 10px 0 0;
 +
background-color:#3399CC;
 +
background-position:0 0;
 +
}
 +
 +
ul#h2igemmenublue li.istylei0blue:hover{
 +
background-color:#3399CC;
 +
}
 +
 +
ul#h2igemmenublue li a.istylei0blue:hover{
 +
background-color:#006699;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
font-weight: bold;
 +
}
 +
 +
ul#h2igemmenublue.istylem0blueblue,ul#h2igemmenublue ul.istylem0blueblue{
 +
background-color:transparent;
 +
border-width:0px;
 +
border-style:none;
 +
padding:0;
 +
}
 +
 +
ul#h2igemmenublue ul.istylem0blueblue li{
 +
margin:0;
 +
}
 +
 +
ul#h2igemmenublue.istylem0blueblue li a,ul#h2igemmenublue ul.istylem0blueblue li a,ul#h2igemmenublue.istylem0blueblue li.dis a:hover,ul#h2igemmenublue ul.istylem0blueblue li.dis a:hover{
 +
padding:5px 5px 5px 5px;
 +
}
 +
 +
/*Purple part*/
 +
ul#h2igemmenupurple ul{
 +
display:none
 +
}
 +
ul#h2igemmenupurple li:hover>*{
 +
display:block
 +
}
 +
ul#h2igemmenupurple li:hover{
 +
position:relative;
 +
}
 +
ul#h2igemmenupurple ul{
 +
position: absolute;
 +
left:-1px;
 +
top:100%;
 +
}
 +
ul#h2igemmenupurple ul ul{
 +
position:absolute;
 +
left:98%;
 +
top:-2px;
 +
}
 +
ul#h2igemmenupurple,ul#h2igemmenupurple ul{
 +
margin:0px;
 +
list-style:none;
 +
padding:0px;
 +
background-image:#CCC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
}
 +
ul#h2igemmenupurple table {
 +
border-collapse:collapse
 +
}
 +
ul#h2igemmenupurple {
 +
display:block;
 +
font-size:0;
 +
zoom:1;
 +
width:100%;
 +
float: left;
 +
}
 +
ul#h2igemmenupurple ul{
 +
//width:204px;
 +
padding:0;
 +
}
 +
ul#h2igemmenupurple li{
 +
display:block;
 +
zoom:1;
 +
margin:0;
 +
font-size:0;
 +
float:left;
 +
}
 +
ul#h2igemmenupurple a:active, ul#h2igemmenupurple a:focus {
 +
outline-style:none
 +
}
 +
ul#h2igemmenupurple a,ul#h2igemmenupurple li.dis a:hover{
 +
display:block;
 +
vertical-align:middle;
 +
_display:inline-block;
 +
_vertical-align:top;
 +
background-color:#993399;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
text-align:center;
 +
text-decoration:none;
 +
padding:11px 15px 5px 5px;
 +
_padding-left:0;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
cursor:pointer;
 +
}
 +
ul#h2igemmenupurple ul li {
 +
float:none;
 +
}
 +
ul#h2igemmenupurple ul a,ul#h2igemmenupurple ul li.dis a:hover{
 +
display:block;
 +
text-align:left;
 +
white-space:nowrap;
 +
}
 +
ul#h2igemmenupurple li:hover>a{
 +
background-color:#660066;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenupurple li a:hover{
 +
_position:relative;
 +
background-color:#660066;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenupurple li.dis a{
 +
color: #AAAAAA !important;
 +
}
 +
ul#h2igemmenupurple img{
 +
border:none;
 +
vertical-align:middle;
 +
margin-right:22px;
 +
}
 +
ul#h2igemmenupurple img.over{
 +
display:none
 +
}
 +
ul#h2igemmenupurple li.dis a:hover img.over{
 +
display:none !important
 +
}
 +
ul#h2igemmenupurple li.dis a:hover img.def {
 +
display:inline !important
 +
}
 +
ul#h2igemmenupurple li:hover > a img.def  {
 +
display:none
 +
}
 +
ul#h2igemmenupurple li:hover > a img.over {display:inline}
 +
 +
ul#h2igemmenupurple a:hover img.over,ul#h2igemmenupurple a:hover ul img.def,ul#h2igemmenupurple a:hover a:hover ul img.def,ul#h2igemmenupurple a:hover a:hover img.over,ul#h2igemmenupurple a:hover a:hover a:hover img.over{display:inline}
 +
 +
ul#h2igemmenupurple a:hover img.def,ul#h2igemmenupurple a:hover ul img.over,ul#h2igemmenupurple a:hover a:hover ul img.over,ul#h2igemmenupurple a:hover a:hover img.def,ul#h2igemmenupurple a:hover a:hover a:hover img.def{display:none}
 +
 +
ul#h2igemmenupurple a:hover ul,ul#h2igemmenupurple a:hover a:hover ul{display:block}
 +
 +
ul#h2igemmenupurple a:hover ul ul{display:none}
 +
 +
ul#h2igemmenupurple span{
 +
 +
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
 +
 +
ul#h2igemmenupurple ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
 +
 +
ul#h2igemmenupurple li a.istylei0purple,ul#h2igemmenupurple li.dis.istylei0purple:hover a.istylei0purple{
 +
height:25px;
 +
background-color:#993399;
 +
border-width:0px;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
margin:0 -10px 0 10px;
 +
_margin:0 0 0 0;
 +
background-position:100% 0;
 +
}
 +
 +
ul#h2igemmenupurple li.istylei0purple:hover>a{
 +
background-color:#993399;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
}
 +
 +
ul#h2igemmenupurple li.istylei0purple,ul#h2igemmenupurple li.dis.istylei0purple:hover{
 +
margin:0 10px 0 0;
 +
background-color:#993399;
 +
background-position:0 0;
 +
}
 +
 +
ul#h2igemmenupurple li.istylei0purple:hover{
 +
background-color:#993399;
 +
}
 +
 +
ul#h2igemmenupurple li a.istylei0purple:hover{
 +
background-color:#660066;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
font-weight: bold;
 +
}
 +
 +
ul#h2igemmenupurple.istylem0purple,ul#h2igemmenupurple ul.istylem0purple{
 +
background-color:transparent;
 +
border-width:0px;
 +
border-style:none;
 +
padding:0;
 +
}
 +
 +
ul#h2igemmenupurple ul.istylem0purple li{
 +
margin:0;
 +
}
 +
 +
ul#h2igemmenupurple.istylem0purple li a,ul#h2igemmenupurple ul.istylem0purple li a,ul#h2igemmenupurple.istylem0purple li.dis a:hover,ul#h2igemmenupurple ul.istylem0purple li.dis a:hover{
 +
padding:5px 5px 5px 5px;
 +
}
 +
 +
/*Orange part*/
 +
 +
ul#h2igemmenuOrange ul{
 +
display:none
 +
}
 +
ul#h2igemmenuOrange li:hover>*{
 +
display:block
 +
}
 +
ul#h2igemmenuOrange li:hover{
 +
position:relative;
 +
}
 +
ul#h2igemmenuOrange ul{
 +
position: absolute;
 +
left:-1px;
 +
top:100%;
 +
}
 +
ul#h2igemmenuOrange ul ul{
 +
position:absolute;
 +
left:98%;
 +
top:-2px;
 +
}
 +
ul#h2igemmenuOrange,ul#h2igemmenuOrange ul{
 +
margin:0px;
 +
list-style:none;
 +
padding:0px;
 +
background-image:#CCC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
}
 +
ul#h2igemmenuOrange table {
 +
border-collapse:collapse
 +
}
 +
ul#h2igemmenuOrange {
 +
display:block;
 +
font-size:0;
 +
zoom:1;
 +
width:100%;
 +
float: left;
 +
}
 +
ul#h2igemmenuOrange ul{
 +
//width:204px;
 +
padding:0;
 +
}
 +
ul#h2igemmenuOrange li{
 +
display:block;
 +
zoom:1;
 +
margin:0;
 +
font-size:0;
 +
float:left;
 +
}
 +
ul#h2igemmenuOrange a:active, ul#h2igemmenuOrange a:focus {
 +
outline-style:none
 +
}
 +
ul#h2igemmenuOrange a,ul#h2igemmenuOrange li.dis a:hover{
 +
display:block;
 +
vertical-align:middle;
 +
_display:inline-block;
 +
_vertical-align:top;
 +
background-color:#FF9933;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
text-align:center;
 +
text-decoration:none;
 +
padding:11px 15px 5px 5px;
 +
_padding-left:0;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
cursor:pointer;
 +
}
 +
ul#h2igemmenuOrange ul li {
 +
float:none;
 +
}
 +
ul#h2igemmenuOrange ul a,ul#h2igemmenuOrange ul li.dis a:hover{
 +
display:block;
 +
text-align:left;
 +
white-space:nowrap;
 +
}
 +
ul#h2igemmenuOrange li:hover>a{
 +
background-color:#CC6600;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenuOrange li a:hover{
 +
_position:relative;
 +
background-color:#CC6600;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenuOrange li.dis a{
 +
color: #AAAAAA !important;
 +
}
 +
ul#h2igemmenuOrange img{
 +
border:none;
 +
vertical-align:middle;
 +
margin-right:22px;
 +
}
 +
ul#h2igemmenuOrange img.over{
 +
display:none
 +
}
 +
ul#h2igemmenuOrange li.dis a:hover img.over{
 +
display:none !important
 +
}
 +
ul#h2igemmenuOrange li.dis a:hover img.def {
 +
display:inline !important
 +
}
 +
ul#h2igemmenuOrange li:hover > a img.def  {
 +
display:none
 +
 +
}
 +
ul#h2igemmenuOrange li:hover > a img.over {display:inline}
 +
 +
ul#h2igemmenuOrange a:hover img.over,ul#h2igemmenuOrange a:hover ul img.def,ul#h2igemmenuOrange a:hover a:hover ul img.def,ul#h2igemmenuOrange a:hover a:hover img.over,ul#h2igemmenuOrange a:hover a:hover a:hover img.over{display:inline}
 +
 +
ul#h2igemmenuOrange a:hover img.def,ul#h2igemmenuOrange a:hover ul img.over,ul#h2igemmenuOrange a:hover a:hover ul img.over,ul#h2igemmenuOrange a:hover a:hover img.def,ul#h2igemmenuOrange a:hover a:hover a:hover img.def{display:none}
 +
 +
ul#h2igemmenuOrange a:hover ul,ul#h2igemmenuOrange a:hover a:hover ul{display:block}
 +
 +
ul#h2igemmenuOrange a:hover ul ul{display:none}
 +
 +
ul#h2igemmenuOrange span{
 +
 +
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
 +
 +
ul#h2igemmenuOrange ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
 +
 +
ul#h2igemmenuOrange li a.istylei0orange,ul#h2igemmenuOrange li.dis.istylei0orange:hover a.istylei0orange{
 +
height:25px;
 +
background-color:#FF9933;
 +
border-width:0px;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
margin:0 -10px 0 10px;
 +
_margin:0 0 0 0;
 +
background-position:100% 0;
 +
}
 +
 +
ul#h2igemmenuOrange li.istylei0orange:hover>a{
 +
background-color:#FF9933;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
}
 +
 +
ul#h2igemmenuOrange li.istylei0orange,ul#h2igemmenuOrange li.dis.istylei0orange:hover{
 +
margin:0 10px 0 0;
 +
background-color:#FF9933;
 +
background-position:0 0;
 +
}
 +
 +
ul#h2igemmenuOrange li.istylei0orange:hover{
 +
background-color:#FF9933;
 +
}
 +
 +
ul#h2igemmenuOrange li a.istylei0orange:hover{
 +
background-color:#CC6600;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
font-weight: bold;
 +
}
 +
 +
ul#h2igemmenuOrange.istylem0orange,ul#h2igemmenuOrange ul.istylem0orange{
 +
background-color:transparent;
 +
border-width:0px;
 +
border-style:none;
 +
padding:0;
 +
}
 +
 +
ul#h2igemmenuOrange ul.istylem0orange li{
 +
margin:0;
 +
}
 +
 +
ul#h2igemmenuOrange.istylem0orange li a,ul#h2igemmenuOrange ul.istylem0orange li a,ul#h2igemmenuOrange.istylem0orange li.dis a:hover,ul#h2igemmenuOrange ul.istylem0orange li.dis a:hover{
 +
padding:5px 5px 5px 5px;
 +
}
 +
 +
/* GREEN */
 +
 +
ul#h2igemmenuGreen ul{
 +
display:none
 +
}
 +
ul#h2igemmenuGreen li:hover>*{
 +
display:block
 +
}
 +
ul#h2igemmenuGreen li:hover{
 +
position:relative;
 +
}
 +
ul#h2igemmenuGreen ul{
 +
position: absolute;
 +
left:-1px;
 +
top:100%;
 +
}
 +
ul#h2igemmenuGreen ul ul{
 +
position:absolute;
 +
left:98%;
 +
top:-2px;
 +
}
 +
ul#h2igemmenuGreen,ul#h2igemmenuGreen ul{
 +
margin:0px;
 +
list-style:none;
 +
padding:0px;
 +
background-image:#CCC;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
}
 +
ul#h2igemmenuGreen table {
 +
border-collapse:collapse
 +
}
 +
ul#h2igemmenuGreen {
 +
display:block;
 +
font-size:0;
 +
zoom:1;
 +
width:100%;
 +
float: left;
 +
}
 +
ul#h2igemmenuGreen ul{
 +
//width:204px;
 +
padding:0;
 +
}
 +
ul#h2igemmenuGreen li{
 +
display:block;
 +
zoom:1;
 +
margin:0;
 +
font-size:0;
 +
float:left;
 +
}
 +
ul#h2igemmenuGreen a:active, ul#h2igemmenuGreen a:focus {
 +
outline-style:none
 +
}
 +
ul#h2igemmenuGreen a,ul#h2igemmenuGreen li.dis a:hover{
 +
display:block;
 +
vertical-align:middle;
 +
_display:inline-block;
 +
_vertical-align:top;
 +
background-color:#00CC66;
 +
border-width:0px;
 +
border-style:none;
 +
border-color:transparent;
 +
text-align:center;
 +
text-decoration:none;
 +
padding:11px 15px 5px 5px;
 +
_padding-left:0;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
cursor:pointer;
 +
}
 +
ul#h2igemmenuGreen ul li {
 +
float:none;
 +
}
 +
ul#h2igemmenuGreen ul a,ul#h2igemmenuGreen ul li.dis a:hover{
 +
display:block;
 +
text-align:left;
 +
white-space:nowrap;
 +
}
 +
ul#h2igemmenuGreen li:hover>a{
 +
background-color:#669999;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenuGreen li a:hover{
 +
_position:relative;
 +
background-color:#669999;
 +
border-color:transparent;
 +
border-style:none;
 +
font:bold 8pt Verdana;
 +
color: #FFFFFF;
 +
text-decoration:none;
 +
}
 +
ul#h2igemmenuGreen li.dis a{
 +
color: #AAAAAA !important;
 +
}
 +
ul#h2igemmenuGreen img{
 +
border:none;
 +
vertical-align:middle;
 +
margin-right:22px;
 +
}
 +
ul#h2igemmenuGreen img.over{
 +
display:none
 +
}
 +
ul#h2igemmenuGreen li.dis a:hover img.over{
 +
display:none !important
 +
}
 +
ul#h2igemmenuGreen li.dis a:hover img.def {
 +
display:inline !important
 +
}
 +
ul#h2igemmenuGreen li:hover > a img.def  {
 +
display:none
 +
 +
}
 +
ul#h2igemmenuGreen li:hover > a img.over {display:inline}
 +
 +
ul#h2igemmenuGreen a:hover img.over,ul#h2igemmenuGreen a:hover ul img.def,ul#h2igemmenuGreen a:hover a:hover ul img.def,ul#h2igemmenuGreen a:hover a:hover img.over,ul#h2igemmenuGreen a:hover a:hover a:hover img.over{display:inline}
 +
 +
ul#h2igemmenuGreen a:hover img.def,ul#h2igemmenuGreen a:hover ul img.over,ul#h2igemmenuGreen a:hover a:hover ul img.over,ul#h2igemmenuGreen a:hover a:hover img.def,ul#h2igemmenuGreen a:hover a:hover a:hover img.def{display:none}
 +
 +
ul#h2igemmenuGreen a:hover ul,ul#h2igemmenuGreen a:hover a:hover ul{display:block}
 +
 +
ul#h2igemmenuGreen a:hover ul ul{display:none}
 +
 +
ul#h2igemmenuGreen span{
 +
 +
display:block;overflow:visible;background-position:right center;background-repeat: no-repeat;padding-right:0px;}
 +
 +
ul#h2igemmenuGreen ul span{background-image:url(imgs/arr_white.gif);padding-right:29px;}
 +
 +
ul#h2igemmenuGreen li a.istylei0green,ul#h2igemmenuGreen li.dis.istylei0green:hover a.istylei0green{
 +
height:25px;
 +
background-color:#00CC66;
 +
border-width:0px;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
margin:0 -10px 0 10px;
 +
_margin:0 0 0 0;
 +
background-position:100% 0;
 +
}
 +
 +
ul#h2igemmenuGreen li.istylei0green:hover>a{
 +
background-color:#00CC66;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
}
 +
 +
ul#h2igemmenuGreen li.istylei0green,ul#h2igemmenuGreen li.dis.istylei0green:hover{
 +
margin:0 10px 0 0;
 +
background-color:#00CC66;
 +
background-position:0 0;
 +
}
 +
 +
ul#h2igemmenuGreen li.istylei0green:hover{
 +
background-color:#00CC66;
 +
}
 +
 +
ul#h2igemmenuGreen li a.istylei0green:hover{
 +
background-color:#669999;
 +
border-style:none;
 +
font:bold 14px Trebuchet MS;
 +
color:#FFFFFF;
 +
text-decoration:none;
 +
font-weight: bold;
 +
}
 +
 +
ul#h2igemmenuGreen.istylem0green,ul#h2igemmenuGreen ul.istylem0green{
 +
background-color:transparent;
 +
border-width:0px;
 +
border-style:none;
 +
padding:0;
 +
}
 +
 +
ul#h2igemmenuGreen ul.istylem0green li{
 +
margin:0;
 +
}
 +
 +
ul#h2igemmenuGreen.istylem0green li a,ul#h2igemmenuGreen ul.istylem0green li a,ul#h2igemmenuGreen.istylem0green li.dis a:hover,ul#h2igemmenuGreen ul.istylem0green li.dis a:hover{
 +
padding:5px 5px 5px 5px;
 +
}
 +
 +
 +
</style>
</style>
</head>
</head>
</html>
</html>

Latest revision as of 07:27, 25 September 2011

Retrieved from "http://2011.igem.org/Team:UNAM-Genomics_Mexico/Templates/Menu"