"
Team:Shenzhen BGIC ATCG/css/menu.css
From 2013.igem.org
| Line 174: | Line 174: | ||
h5 { | h5 { | ||
| - | background-color:# | + | background-color:#999; |
font-size:15px; | font-size:15px; | ||
| - | color:# | + | color:#ccc ; |
line-height: 24px; | line-height: 24px; | ||
height: 24px auto; | height: 24px auto; | ||
Revision as of 16:25, 26 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; }
- content {
width: 1171px; background: #ccc; border:0px; position:absolute; }
.container{ position:relative; } a{ color: #ccc ; text-decoration: none !important; outline: none !important; hide-focus: expression(this.hideFocus=true); } .clr{ clear: both; }
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; line-height:20px; font-family:'Terminal Dosis', Arial, sans-serif !important; color: #ccc !important; }
.box p { color: #333 !important; padding:5px; } h4 { padding:5px; border: 2px 4px 4px 2px; border-color: #333; background:#666; border-style: dotted; color: #ccc; } .box img { padding:5px; }
- bodymain {
position:relative; width: 986px; max-width: 988px; top:308px; left:193px; }
.context{ background-color:#333; opacity:0.8; } .context:hover{ opacity:1; }
h5 { background-color:#999; font-size:15px; color:#ccc ; 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; }
.menu {
position: absolute; height:302px; width:1171px; left: 20px; padding:0; background: url() no-repeat;
}
.menu_navi {
position: relative; list-style: none; margin: 0; padding: 0; z-index:9999;
}
.subs {
z-index: 9999998; background: #333; width: 242px;
} .mainnavi {
position: relative; float: left; width: 118px; margin-right:6px; margin-top:227px;
}
.subnavi {
text-align:center;
} .subnavi a{
height:30px !important; text-align:center; width: 242px; background: #666 !important; line-height:30px !important; z-index: 9999999; border-top:2px solid #ccc;
} .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(
) 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;
}
.igemlogo {
background: url(
) no-repeat; text-decoration: none !important;
background-size: contain;
width: 60px; height: 60px; position: absolute; top: 102px; left:445px; z-index: 999999999;
} .igemlogo a{
display: block;
width: 100%; height: 100%;
z-index: 999999999;
}
.hotspot1 {
width: 40px; height: 40px; position: absolute; top: 188px; left:185px; z-index: 999;
} .hotspot2 {
width: 320px; height: 300px; position: absolute; top: 20px; left:20px; z-index: 998;
}
.text1, .text2 { display: none; background: #333; padding:5px; position: absolute; white-space:nowrap; }
.text1 { top:-4px; left: 135px; } .text2 { top:164px; left: 300px; } .hotspot1:hover .text1{ display:block; } .hotspot2:hover .text2{ display:block; }
.backtotop a{
background: url(
) no-repeat; text-decoration: none !important;
width: 145px; height: 130px;
position: fixed; bottom: -55px; right: -50px; z-index: 1000000; -moz-transform: translate(0,0);
-webkit-transform: translate(0,0);
-o-transform: translate(0,0);
-ms-transform: translate(0,0);
transform: translate(0,0);
-webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; } .backtotop a:hover{ -moz-transform: translate(-55px,-60px);
-webkit-transform: translate(-55px,-60px);
-o-transform: translate(-55px,-60px);
-ms-transform: translate(-55px,-60px);
transform: translate(-55px,-60px);
-webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -ms-transition: all 300ms ease-in-out; }
.board { top:10px; position:relative; display: inline; float:left;
width: 500px; height:325px; margin-left:-8px; padding-right:4px;
padding-bottom:5px; }
.team #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board5 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board6 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board7 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board8 {
background:url(
) no-repeat; text-decoration: none !important;
}
.team #board9 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board5 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board6 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board7 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board8 {
background:url(
) no-repeat; text-decoration: none !important;
}
.stories #board9 {
background:url(
) no-repeat; text-decoration: none !important;
}
.modeling #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.modeling #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.modeling #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.modeling #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.modeling #board5 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board5 {
background:url(
) no-repeat; text-decoration: none !important;
}
.results #board6 {
background:url(
) no-repeat; text-decoration: none !important;
}
.humanpractice #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.humanpractice #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.humanpractice #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.humanpractice #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.parts #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.parts #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.parts #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.parts #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.notes #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.notes #board2 {
background:url(
) no-repeat; text-decoration: none !important;
}
.notes #board3 {
background:url(
) no-repeat; text-decoration: none !important;
}
.notes #board4 {
background:url(
) no-repeat; text-decoration: none !important;
}
.notes #board5 {
background:url(
) no-repeat; text-decoration: none !important;
}
.safety #board1 {
background:url(
) no-repeat; text-decoration: none !important;
}
.media { top:10px; display: inline;
position: relative;
float:left;
width: 490px; height:325px;
padding-bottom:5px; }
.iframes{ frameborder:0; scrolling:no; top:10px; display: inline;
position: relative;
float:left;
width: 490px; height:325px;
padding-bottom:5px; }
.navleft {
width:100px;
height:295px;
position:fixed;
left:75px;
padding-top:80px;
padding-right:10px;
top:310px;
z-index:1999;
background:url(
) no-repeat; text-decoration: none !important;
background-position :right;
}
.navleft li {
display: block;
float:right;
text-align:right;
cursor:pointer;
padding-top:2px;
}
.navleft li a {
height:26px;
line-height:26px;
white-space:nowrap;
text-align:center;
background: #666;
padding: 4px 6px 4px 6px;
}
.navleft li a:hover{
background:#333;
}
.navleft li a.cur {
background:#ccc;
color: #333 !important;
border: 2px 4px 4px 2px;
border-color: #333;
height:24px;
border-style:dotted;
}
.box {
position:relative;
float:left;
width: 976px;
min-height: 300px;
border:5px solid #333;
background: #aaa;
top:10px;
bottom:5px;
margin-bottom:5px;
}
h3 {
background:url(
) no-repeat; text-decoration: none !important;
background-position: -1px 0;
height: 25px;
color: #ccc !important;
height:25px;
line-height:25px !important;
padding-left: 35px !important;
border-bottom:5px solid #333;
font-family:'Terminal Dosis', Arial, sans-serif !important;
}
.eye_wrapper { left: 0px; top:0px; }
.eye-left { position: absolute; width:20px; height:20px; top: 186px; left: 215px; }
.eye-right {
position: absolute;
width:18px; height:18px; top: 218px; left: 170px; }
