Team:St Andrews/about
From 2010.igem.org
(Difference between revisions)
Line 3: | Line 3: | ||
<style type="text/css"> | <style type="text/css"> | ||
+ | #globalWrapper { | ||
+ | position: relative; | ||
+ | font-size: 127%; | ||
+ | width: 100%; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | padding-bottom: 10px; | ||
+ | } | ||
+ | .visualClear { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
#top-section { | #top-section { | ||
position: relative; | position: relative; | ||
Line 9: | Line 21: | ||
# margin-left: 10px; | # margin-left: 10px; | ||
margin: 0 auto 0 auto; | margin: 0 auto 0 auto; | ||
- | border-left: 1px solid # | + | border-left: 1px solid #000000; |
- | border-right: 1px solid # | + | border-right: 1px solid #000000; |
} | } | ||
Line 115: | Line 127: | ||
} | } | ||
- | #nav { | + | html>body #nav { |
- | filter: alpha(opacity= | + | filter: alpha(opacity=80); |
- | filter: progid:DXImageTransform.Microsoft.Alpha(opacity= | + | filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); |
- | -moz-opacity: 0. | + | -moz-opacity: 0.8; opacity:0.8; |
z-index:1; | z-index:1; | ||
margin: 0; | margin: 0; | ||
Line 148: | Line 160: | ||
border: solid 1px #6d6d6d; | border: solid 1px #6d6d6d; | ||
} | } | ||
- | #nav li { | + | html>body #nav li { |
margin: 0 5px; | margin: 0 5px; | ||
padding: 0 0 8px; | padding: 0 0 8px; | ||
Line 156: | Line 168: | ||
} | } | ||
/* main level link */ | /* main level link */ | ||
- | #nav a { | + | html>body #nav a { |
font-weight: bold; | font-weight: bold; | ||
color: #e7e5e5; | color: #e7e5e5; | ||
Line 169: | Line 181: | ||
/* main level link hover */ | /* main level link hover */ | ||
- | #nav .current a, #nav li:hover > a { | + | html>body #nav .current a, #nav li:hover > a { |
background: #d1d1d1; /* for non-css3 browsers */ | background: #d1d1d1; /* for non-css3 browsers */ | ||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#808080'); /* for IE */ | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#808080'); /* for IE */ | ||
Line 183: | Line 195: | ||
} | } | ||
/* sub levels link hover */ | /* sub levels link hover */ | ||
- | #nav ul li:hover a, #nav li:hover li a { | + | html>body #nav ul li:hover a, #nav li:hover li a { |
background: none; | background: none; | ||
border: none; | border: none; | ||
Line 190: | Line 202: | ||
-moz-box-shadow: none; | -moz-box-shadow: none; | ||
} | } | ||
- | #nav ul a:hover { | + | html>body #nav ul a:hover { |
background: #0399d4 !important; /* for non-css3 browsers */ | background: #0399d4 !important; /* for non-css3 browsers */ | ||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000066', endColorstr='#000000'); /* for IE */ | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000066', endColorstr='#000000'); /* for IE */ | ||
Line 202: | Line 214: | ||
} | } | ||
/* level 2 list */ | /* level 2 list */ | ||
- | #nav ul { | + | html>body #nav ul { |
background: #ddd; /* for non-css3 browsers */ | background: #ddd; /* for non-css3 browsers */ | ||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#c8c8c8'); /* for IE */ | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#c8c8c8'); /* for IE */ | ||
Line 224: | Line 236: | ||
} | } | ||
/* dropdown */ | /* dropdown */ | ||
- | #nav li:hover > ul { | + | html>body #nav li:hover > ul { |
display: block; | display: block; | ||
} | } | ||
- | #nav ul li { | + | html>body #nav ul li { |
z-index:1; | z-index:1; | ||
float: none; | float: none; | ||
Line 233: | Line 245: | ||
padding: 0; | padding: 0; | ||
} | } | ||
- | #nav ul a { | + | html>body #nav ul a { |
font-weight: normal; | font-weight: normal; | ||
text-shadow: 0 1px 1px rgba(255, 255, 255, .9); | text-shadow: 0 1px 1px rgba(255, 255, 255, .9); | ||
} | } | ||
/* level 3+ list */ | /* level 3+ list */ | ||
- | #nav ul ul { | + | html>body #nav ul ul { |
left: 138px; | left: 138px; | ||
top: -8px; | top: -8px; | ||
} | } | ||
/* rounded corners for first and last child */ | /* rounded corners for first and last child */ | ||
- | #nav ul li:first-child > a { | + | html>body #nav ul li:first-child > a { |
-webkit-border-top-left-radius: 9px; | -webkit-border-top-left-radius: 9px; | ||
-moz-border-radius-topleft: 9px; | -moz-border-radius-topleft: 9px; | ||
Line 249: | Line 261: | ||
-moz-border-radius-topright: 9px; | -moz-border-radius-topright: 9px; | ||
} | } | ||
- | #nav ul li:last-child > a { | + | html>body #nav ul li:last-child > a { |
-webkit-border-bottom-left-radius: 9px; | -webkit-border-bottom-left-radius: 9px; | ||
-moz-border-radius-bottomleft: 9px; | -moz-border-radius-bottomleft: 9px; | ||
Line 256: | Line 268: | ||
} | } | ||
/* clearfix */ | /* clearfix */ | ||
- | #nav:after { | + | html>body #nav:after { |
content: "."; | content: "."; | ||
display: block; | display: block; | ||
Line 264: | Line 276: | ||
height: 0; | height: 0; | ||
} | } | ||
- | #nav { | + | html>body #nav { |
z-index:1; | z-index:1; | ||
display: inline-block; | display: inline-block; | ||
} | } | ||
- | html[xmlns] #nav { | + | html>body html[xmlns] #nav { |
display: block; | display: block; | ||
} | } | ||
- | * html #nav { | + | * html html>body #nav { |
height: 1%; | height: 1%; | ||
} | } | ||
Line 307: | Line 319: | ||
position:absolute; | position:absolute; | ||
top:3px; | top:3px; | ||
- | left: | + | left:1000px; |
} | } | ||
img.gradient | img.gradient | ||
Line 369: | Line 381: | ||
text-indent: 1em; | text-indent: 1em; | ||
font-family:"Verdana"; | font-family:"Verdana"; | ||
- | font-size: | + | font-size:15px; |
} | } | ||
div.exphoto | div.exphoto | ||
{ | { | ||
+ | border-top-left-radius:5em; | ||
+ | border-top-right-radius:2em; | ||
+ | border-bottom-left-radius:2em; | ||
+ | border-bottom-right-radius:2em; | ||
+ | |||
+ | -webkit-border-top-left-radius: 5em; | ||
+ | -webkit-border-top-right-radius: 2em; | ||
+ | -webkit-border-bottom-left-radius: 2em; | ||
+ | -webkit-border-bottom-right-radius: 2em; | ||
+ | -moz-border-radius-topleft: 5em; | ||
+ | -moz-border-radius-topright: 2em; | ||
+ | -moz-border-radius-bottomleft: 2em; | ||
+ | -moz-border-radius-bottomright: 2em; | ||
+ | |||
filter: alpha(opacity=75); | filter: alpha(opacity=75); | ||
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=75); | filter: progid:DXImageTransform.Microsoft.Alpha(opacity=75); | ||
Line 378: | Line 404: | ||
background: #d1d1d1; /* for non-css3 browsers */ | background: #d1d1d1; /* for non-css3 browsers */ | ||
- | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='# | + | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ebebeb'); /* for IE */ |
- | background: -webkit-gradient(linear, left top, left bottom, from(# | + | background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ebebeb)); /* for webkit browsers */ |
- | background: -moz-linear-gradient(top, # | + | background: -moz-linear-gradient(top, #ffffff, #ebebeb); /* for firefox 3.6+ */ |
color: #444; | color: #444; | ||
Line 388: | Line 414: | ||
box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
text-shadow: 0 1px 0 rgba(255, 255, 255, .8); | text-shadow: 0 1px 0 rgba(255, 255, 255, .8); | ||
- | |||
- | |||
- | |||
- | |||
position:absolute; | position:absolute; | ||
left:20px; | left:20px; | ||
- | top: | + | top:300px; |
float:right; | float:right; | ||
- | |||
background; | background; | ||
- | color:# | + | color:#000000; |
float:center; | float:center; | ||
margin-left:150px; | margin-left:150px; | ||
width:560px; | width:560px; | ||
- | padding: | + | padding:30px; |
} | } | ||
Line 423: | Line 444: | ||
div.exmain | div.exmain | ||
{ | { | ||
+ | border-top-left-radius:5em; | ||
+ | border-top-right-radius:2em; | ||
+ | border-bottom-left-radius:2em; | ||
+ | border-bottom-right-radius:2em; | ||
+ | |||
+ | -webkit-border-top-left-radius: 5em; | ||
+ | -webkit-border-top-right-radius: 2em; | ||
+ | -webkit-border-bottom-left-radius: 2em; | ||
+ | -webkit-border-bottom-right-radius: 2em; | ||
+ | -moz-border-radius-topleft: 5em; | ||
+ | -moz-border-radius-topright: 2em; | ||
+ | -moz-border-radius-bottomleft: 2em; | ||
+ | -moz-border-radius-bottomright: 2em; | ||
+ | filter: alpha(opacity=100); | ||
+ | filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); | ||
+ | -moz-opacity: 1; opacity:1; | ||
+ | position:relative; | ||
+ | background:#FFFFFF; | ||
+ | background: #d1d1d1; /* for non-css3 browsers */ | ||
+ | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ebebeb'); /* for IE */ | ||
+ | background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ebebeb)); /* for webkit browsers */ | ||
+ | background: -moz-linear-gradient(top, #ffffff, #ebebeb); /* for firefox 3.6+ */ | ||
+ | |||
+ | color: #000000; | ||
+ | border-top: solid 1px #f8f8f8; | ||
+ | -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | text-shadow: 0 1px 0 rgba(255, 255, 255, .8); | ||
+ | top:0px; | ||
+ | left:0px; | ||
+ | float:center; | ||
+ | margin-left:20px; | ||
+ | margin-top:0px; | ||
+ | margin-bottom:50px; | ||
+ | width:560px; | ||
+ | padding:20px; | ||
+ | } | ||
+ | div.main | ||
+ | { | ||
+ | border-top-left-radius:5em; | ||
+ | border-top-right-radius:2em; | ||
+ | border-bottom-left-radius:2em; | ||
+ | border-bottom-right-radius:2em; | ||
+ | |||
+ | -webkit-border-top-left-radius: 5em; | ||
+ | -webkit-border-top-right-radius: 2em; | ||
+ | -webkit-border-bottom-left-radius: 2em; | ||
+ | -webkit-border-bottom-right-radius: 2em; | ||
+ | -moz-border-radius-topleft: 5em; | ||
+ | -moz-border-radius-topright: 2em; | ||
+ | -moz-border-radius-bottomleft: 2em; | ||
+ | -moz-border-radius-bottomright: 2em; | ||
filter: alpha(opacity=80); | filter: alpha(opacity=80); | ||
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); | filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); | ||
-moz-opacity: 0.8; opacity:0.8; | -moz-opacity: 0.8; opacity:0.8; | ||
- | position: | + | position:relative; |
- | background:# | + | background:#808080; /* for non-css3 browsers */ |
- | top: | + | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#808080', endColorstr='#808080'); /* for IE */ |
+ | background: -webkit-gradient(linear, left top, left bottom, from(#808080), to(#808080)); /* for webkit browsers */ | ||
+ | background: -moz-linear-gradient(top, #808080, #808080); /* for firefox 3.6+ */ | ||
+ | |||
+ | color: #000000; | ||
+ | border-top: solid 1px #f8f8f8; | ||
+ | -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | box-shadow: 0 1px 1px rgba(0, 0, 0, .2); | ||
+ | text-shadow: 0 1px 0 rgba(255, 255, 255, .8); | ||
+ | top:260px; | ||
+ | left:50px; | ||
float:center; | float:center; | ||
- | margin-left: | + | margin-left:50px; |
- | width: | + | margin-top:0px; |
+ | margin-bottom:50px; | ||
+ | width:660px; | ||
padding:20px; | padding:20px; | ||
} | } | ||
+ | |||
div.ly | div.ly | ||
{ | { | ||
Line 452: | Line 540: | ||
position:absolute; | position:absolute; | ||
right:-10px; | right:-10px; | ||
- | top: | + | top:280px; |
float:right; | float:right; | ||
margin-left:0px; | margin-left:0px; | ||
Line 465: | Line 553: | ||
</head> | </head> | ||
<body> | <body> | ||
- | <img class="gradient" border="0" src="https://static.igem.org/mediawiki/2010/2/22/Standrewsgradient.jpg" width="200" height=" | + | <img class="gradient" border="0" src="https://static.igem.org/mediawiki/2010/2/22/Standrewsgradient.jpg" width="200" height="120%" /> |
<img class="lybanner" border="0" src="https://static.igem.org/mediawiki/2010/f/fb/Standrewsbanner2.jpg" width="977" height="750" /> | <img class="lybanner" border="0" src="https://static.igem.org/mediawiki/2010/f/fb/Standrewsbanner2.jpg" width="977" height="750" /> | ||
<ul id="nav" class="navigation"> | <ul id="nav" class="navigation"> |
Revision as of 09:18, 26 July 2010