Team:Shenzhen BGIC ATCG/css/menu.css

From 2013.igem.org

(Difference between revisions)
(Created page with " html { background:#ccc ; min-height: 100%; margin: 0; font-size: 100%; } .menu { position: absolute; height:302px; width:1171px; left: 50%; margin-left: -585px; p...")
Line 1: Line 1:
-
html { background:#ccc ; min-height: 100%; margin: 0; font-size: 100%; }
+
html {
 +
  background:#ccc ;
 +
  min-height: 100%;
 +
  margin: 0;
 +
  font-size: 100%;
 +
  font-family: 'Terminal Dosis', Arial, sans-serif !important;
 +
  font-size: 13px;
 +
}
 +
ul, li {
 +
  list-style: none;
 +
  padding: 0;
 +
}
 +
 
 +
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
 +
margin:0;
 +
padding:0;
 +
border-bottom: 0px;
 +
}
 +
#content {
 +
width: 1117px;
 +
background: #ccc;
 +
border:0px;
 +
}
 +
 
 +
.container{
 +
position:relative;
 +
}
 +
a{
 +
color: #fff;
 +
text-decoration: none;
 +
 
 +
outline: none !important;
 +
hide-focus: expression(this.hideFocus=true);
 +
}
 +
.clr{
 +
clear: both;
 +
}
 +
.content{
 +
position:relative;
 +
}
 +
h1{
 +
margin:0px;
 +
padding:20px;
 +
font-size:32px;
 +
color:#000;
 +
    text-shadow:1px 1px 1px rgba(255,255,255,0.9);
 +
text-align:center;
 +
font-weight:400;
 +
}
 +
h1 span{
 +
    display:block;
 +
font-size:14px;
 +
color:#666;
 +
    font-style:italic;
 +
    font-family:Georgia, serif;
 +
padding-top:5px;
 +
}
 +
h2 {
 +
font-size:18px !important;
 +
font-family:'Terminal Dosis', Arial, sans-serif !important;
 +
font-weight:bold !important;
 +
color: #000;
 +
}
 +
/* Header Style */
 +
.header{
 +
font-family:'Arial Narrow', Arial, sans-serif;
 +
line-height: 24px;
 +
font-size: 11px;
 +
background: #000;
 +
opacity: 0.9;
 +
text-transform: uppercase;
 +
z-index: 9999;
 +
position: relative;
 +
-moz-box-shadow: 1px 0px 2px #000;
 +
-webkit-box-shadow: 1px 0px 2px #000;
 +
box-shadow: 1px 0px 2px #000;
 +
}
 +
.header a{
 +
padding: 0px 10px;
 +
letter-spacing: 1px;
 +
color: #ddd;
 +
display: block;
 +
float: left;
 +
}
 +
.header a:hover{
 +
color: #fff;
 +
}
 +
.header span.right{
 +
float: right;
 +
}
 +
.header span.right a{
 +
float: none;
 +
display: inline;
 +
}
 +
 
 +
.more{
 +
position:relative;
 +
clear:both;
 +
    font-size: 11px;
 +
    padding: 20px 0px;
 +
    text-transform:uppercase;
 +
    width: 390px;
 +
    height:55px;
 +
    margin: 0 auto;
 +
}
 +
.more ul{
 +
display:block;
 +
text-align:center;
 +
}
 +
.more ul li{
 +
display: block;
 +
    padding: 4px 4px;
 +
    float:left;
 +
}
 +
.more ul li.selected a,
 +
.more ul li.selected a:hover{
 +
background:#0099c5;
 +
color:#fff;
 +
text-shadow:none;
 +
    font-weight:bold;
 +
}
 +
.more ul li a{
 +
color:#555;
 +
    float:left;
 +
background:#fff;
 +
    width:64px;
 +
padding: 2px 5px;
 +
-moz-box-shadow:1px 1px 2px #aaa;
 +
-webkit-box-shadow:1px 1px 2px #aaa;
 +
box-shadow:1px 1px 2px #aaa;
 +
}
 +
.more ul li a:hover{
 +
background:#000;
 +
color:#fff;
 +
}
 +
ul li {
 +
list-style:none;
 +
}
 +
 
 +
a, p{
 +
font-size:15px !important;
 +
line-height:20px !important;
 +
font-family:'Terminal Dosis', Arial, sans-serif !important;
 +
color: #D9D9D9 !important;
 +
}
 +
 
 +
#bodymain {
 +
position:relative;
 +
width: 865px;
 +
top:-15px;
 +
MARGIN-RIGHT: 3px;
 +
MARGIN-LEFT: auto;
 +
}
 +
 
 +
 
 +
.context{
 +
background-color:#333;
 +
opacity:0.8;
 +
}
 +
.context:hover{
 +
opacity:1;
 +
}
 +
 
 +
h5 {
 +
background-color:#666;
 +
font-size:15px;
 +
color:#d9d9d9 ;
 +
line-height: 24px;
 +
height: 24px auto;
 +
padding-left:5px;
 +
padding-right:5px;
 +
}
 +
.context:hover h5{
 +
background-color:#FBB042;
 +
color:#333 ;
 +
}
 +
h6 {
 +
font-size:15px;
 +
color:#d9d9d9;
 +
line-height: 24px;
 +
height: 24px auto;
 +
padding-left:5px;
 +
padding-right:5px;
 +
}
 +
.context p,.context li{
 +
list-style:none;
 +
padding-left:5px;
 +
padding-right:5px;
 +
}
 +
 
 +
 
 +
}
 +
.context li, .personintrolong li, .personintroshort li{
 +
color:#fff;
 +
}
 +
.context:hover li{
 +
color:#FBB042;
 +
}
 +
.context:hover table{
 +
border:3px solid #FBB042;
 +
}
 +
 
 +
.context ul{
 +
MARGIN-top: 10px;
 +
MARGIN-bottom: 10px;
 +
}
 +
 
 +
.figurep {
 +
width:100%;
 +
text-align: center !important;
 +
MARGIN-left: auto;
 +
MARGIN-right: auto;
 +
}
 +
.figurep img {
 +
text-align: center !important;
 +
MARGIN-left: auto;
 +
MARGIN-right: auto;
 +
}
 +
.figurep p{
 +
width:30% auto;
 +
MARGIN-left: auto;
 +
MARGIN-right: auto;
 +
}
 +
table {
 +
background-color:#333;
 +
color:#D9D9D9 ;
 +
border:3px solid #999;
 +
text-align: center !important;
 +
MARGIN-left: auto;
 +
MARGIN-right: auto;
 +
}
 +
table td{
 +
padding: 2px;
 +
border:2px solid #333;
 +
}
 +
 
 +
#backtotop {
 +
position: fixed;
 +
bottom:15px;
 +
right:15px;
 +
z-index:1000000;
 +
opacity:0.75;
 +
}
 +
#backtotop:hover {
 +
opacity:1;
 +
}
 +
 
.menu {
.menu {
Line 11: Line 257:
   background: url(https://static.igem.org/mediawiki/2013/9/99/Menu.png) no-repeat;
   background: url(https://static.igem.org/mediawiki/2013/9/99/Menu.png) no-repeat;
}
}
 +
.menu_navi {
.menu_navi {
Line 19: Line 266:
}
}
-
.menu_navi li {
+
 
 +
 
 +
.mainnavi {
   position: relative;
   position: relative;
   float: left;
   float: left;
Line 27: Line 276:
}   
}   
-
.menu_navi li a {
+
.subnavi {
 +
  text-align:center;
 +
  padding-top:2px;
 +
}
 +
.subnavi a{
 +
  height:30px !important;
 +
  text-align:center;
 +
  background: #666  !important;
 +
  line-height:30px  !important;
 +
  text-align:center;
 +
}
 +
.subnavi a:hover{
 +
  background: #333  !important;
 +
}
 +
.mainnavi ul{
 +
  display:none;
 +
}
 +
.menu_navi li:hover ul{
 +
  display:block;
 +
}
 +
.mainnavi a {
   position: relative;  
   position: relative;  
   display: block;  
   display: block;  
   height: 60px;
   height: 60px;
-
  background: url(https://static.igem.org/mediawiki/2013/c/cc/Navi2.png) no-repeat; text-decoration: none !important;
+
background: url(https://static.igem.org/mediawiki/2013/c/cc/Navi2.png) no-repeat; text-decoration: none !important;
}   
}   
-
.js .front_navi li a:hover {
+
.js .mainnavi a:hover {
   top: 0;
   top: 0;
}
}

Revision as of 20:01, 13 September 2013

html { 

 background:#ccc ;
 min-height: 100%;
 margin: 0;
 font-size: 100%;
 font-family: 'Terminal Dosis', Arial, sans-serif !important;
 font-size: 13px;

} ul, li { 

 list-style: none; 
 padding: 0;

}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; border-bottom: 0px; }

  1. content {

width: 1117px; background: #ccc; border:0px; }

.container{ position:relative; } a{ color: #fff; text-decoration: none;

outline: none !important; hide-focus: expression(this.hideFocus=true); } .clr{ clear: both; } .content{ position:relative; } h1{ margin:0px; padding:20px; font-size:32px; color:#000; 

   text-shadow:1px 1px 1px rgba(255,255,255,0.9);

text-align:center; font-weight:400; } h1 span{ 

   display:block;

font-size:14px; color:#666; 

   font-style:italic;
   font-family:Georgia, serif;

padding-top:5px; } h2 { font-size:18px !important; font-family:'Terminal Dosis', Arial, sans-serif !important; font-weight:bold !important; color: #000; } /* Header Style */ .header{ font-family:'Arial Narrow', Arial, sans-serif; line-height: 24px; font-size: 11px; background: #000; opacity: 0.9; text-transform: uppercase; z-index: 9999; position: relative; -moz-box-shadow: 1px 0px 2px #000; -webkit-box-shadow: 1px 0px 2px #000; box-shadow: 1px 0px 2px #000; } .header a{ padding: 0px 10px; letter-spacing: 1px; color: #ddd; display: block; float: left; } .header a:hover{ color: #fff; } .header span.right{ float: right; } .header span.right a{ float: none; display: inline; }

.more{ position:relative; clear:both; 

   font-size: 11px;
   padding: 20px 0px;
   text-transform:uppercase;
   width: 390px;
   height:55px;
   margin: 0 auto;

} .more ul{ display:block; text-align:center; } .more ul li{ display: block; 

   padding: 4px 4px;
   float:left;

} .more ul li.selected a, .more ul li.selected a:hover{ background:#0099c5; color:#fff; text-shadow:none; 

   font-weight:bold;

} .more ul li a{ color:#555; 

   float:left;

background:#fff; 

   width:64px;

padding: 2px 5px; -moz-box-shadow:1px 1px 2px #aaa; -webkit-box-shadow:1px 1px 2px #aaa; box-shadow:1px 1px 2px #aaa; } .more ul li a:hover{ background:#000; color:#fff; } ul li { list-style:none; }

a, p{ font-size:15px !important; line-height:20px !important; font-family:'Terminal Dosis', Arial, sans-serif !important; color: #D9D9D9 !important; }

  1. bodymain {

position:relative; width: 865px; top:-15px; MARGIN-RIGHT: 3px; MARGIN-LEFT: auto; }


.context{ background-color:#333; opacity:0.8; } .context:hover{ opacity:1; }

h5 { background-color:#666; font-size:15px; color:#d9d9d9 ; line-height: 24px; height: 24px auto; padding-left:5px; padding-right:5px; } .context:hover h5{ background-color:#FBB042; color:#333 ; } h6 { font-size:15px; color:#d9d9d9; line-height: 24px; height: 24px auto; padding-left:5px; padding-right:5px; } .context p,.context li{ list-style:none; padding-left:5px; padding-right:5px; }


} .context li, .personintrolong li, .personintroshort li{ color:#fff; } .context:hover li{ color:#FBB042; } .context:hover table{ border:3px solid #FBB042; }

.context ul{ MARGIN-top: 10px; MARGIN-bottom: 10px; }

.figurep { width:100%; text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } .figurep img { text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } .figurep p{ width:30% auto; MARGIN-left: auto; MARGIN-right: auto; } table { background-color:#333; color:#D9D9D9 ; border:3px solid #999; text-align: center !important; MARGIN-left: auto; MARGIN-right: auto; } table td{ padding: 2px; border:2px solid #333; }

  1. backtotop {

position: fixed; bottom:15px; right:15px; z-index:1000000; opacity:0.75; }

  1. backtotop:hover {

opacity:1; }


.menu { 

 position: absolute;  
 height:302px;
 width:1171px;
 left: 50%;
 margin-left: -585px;
 padding:0;
 background: url(Menu.png) no-repeat;

}


.menu_navi { 

 position: relative;
 list-style: none; 
 margin: 0; 
 padding: 0;

}


.mainnavi { 

 position: relative;
 float: left;
 width: 118px;
 padding-right:6px;
 padding-top:227px;

}

.subnavi { 

 text-align:center;
 padding-top:2px;

} .subnavi a{ 

 height:30px !important;
 text-align:center;
 background: #666  !important;
 line-height:30px  !important;
 text-align:center;

} .subnavi a:hover{ 

 background: #333  !important;

} .mainnavi ul{ 

 display:none;

} .menu_navi li:hover ul{ 

 display:block;

} .mainnavi a { 

 position: relative; 
 display: block; 
 height: 60px;

background: url(Navi2.png) no-repeat; text-decoration: none !important; }

.js .mainnavi a:hover { 

 top: 0;

}

.menu_navi li.c1 { 

 padding-left: 179px;

}

.menu_navi li.c1 a { 

 background-position: 0 0;

}

.menu_navi li.c1 a:hover { 

 background-position: 0 -65px;

}

.menu_navi li.c2 a { 

 background-position: -123px 0;

}

.menu_navi li.c2 a:hover { 

 background-position: -123px -65px;

} .menu_navi li.c3 a { 

 background-position: -246px 0;

}

.menu_navi li.c3 a:hover { 

 background-position: -246px -65px;

}

.menu_navi li.c4 a { 

 background-position: -369px 0;

}

.menu_navi li.c4 a:hover { 

 background-position: -369px -65px;

} .menu_navi li.c5 a { 

 background-position: -492px 0;

}

.menu_navi li.c5 a:hover { 

 background-position: -492px -65px;

}

.menu_navi li.c6 a { 

 background-position: -615px 0;

}

.menu_navi li.c6 a:hover { 

 background-position: -615px -65px;

} .menu_navi li.c7 a { 

 background-position: -738px 0;

}

.menu_navi li.c7 a:hover { 

 background-position: -738px -65px;

}

.menu_navi li.c8 a { 

 background-position: -861px 0;

}

.menu_navi li.c8 a:hover { 

 background-position: -861px -65px;

}

Retrieved from "http://2013.igem.org/Team:Shenzhen_BGIC_ATCG/css/menu.css"