Team:Amsterdam/Header

From 2011.igem.org

(Difference between revisions)
Line 99: Line 99:
****************If you have any questions, you can always contact igemamsterdam@gmail.com*****************
****************If you have any questions, you can always contact igemamsterdam@gmail.com*****************
*/
*/
-
 
+
#contenuto{width:778px;display:block;margin:auto;}
-
#contenuto{
+
#contenuto2{width:778px;display:block;margin-left:auto;}
-
width:778px;
+
.polaroid{width:150px;background-color:#fff;border:1px solid #c2c2c2;text-align:center;-moz-box-shadow:0 0 20px #292929;-webkit-box-shadow:2px 5px 8px #292929;box-shadow:2px 5px 8px #292929;margin-right:20px;margin-top:20px;float:left;position:relative;-webkit-transition:all 0.5s ease-in-out;-moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;padding:10px 10px 50px;}
-
display: block;
+
.polaroid:last-child{margin-right:0 !important;}
-
margin:auto;
+
.polaroid img{width:150px;height:150px;margin-bottom:10px;}
-
}
+
.polaroid span{font-size:16px;}
-
#contenuto2{
+
.polaroid:hover{-webkit-transform:rotate(-8deg);-moz-transform:rotate(-8deg);transform:rotate(-8deg);}
-
width:778px;
+
a#comeback{font-family:Arial, sans-serif;font-size:30px;position:absolute;bottom:30px;left:20px;color:#888;text-shadow:1px 1px 0 #fff;}
-
display: block;
+
a#comeback:hover{color:#333;text-shadow:1px 1px 0 #fff;}
-
margin-left: auto;
+
#contentgrid p{display:inline;}
-
}
+
#tech-slideshow{height:200px;position:relative;overflow:hidden;}
-
 
+
#tech-slideshow > div{width:2526px;background:url();position:absolute;top:0;left:0;height:100%;-moz-transition:opacity 0.5s ease-out;-o-transition:opacity 0.5s ease-out;-webkit-transition:opacity 0.5s ease-out;-ms-transition:opacity 0.5s ease-out;-webkit-animation:moveSlideshow 60s linear infinite;-moz-animation:moveSlideshow 60s linear infinite;}
-
.polaroid{
+
100%{left:-1684px;}
-
width:150px;
+
#groupparts{width:100% !important;}
-
background-color: #fff;
+
#biobricks table{border:1px solid #000;border-collapse:collapse;}
-
border: 1px solid #c2c2c2;
+
#menu{width:975px;text-align:center;background-color:#FFF;margin:10px auto;}
-
text-align:center;
+
#menu ul{list-style:none;white-space:nowrap;text-align:left;background:#FFF;display:inline-block;margin:0;padding:0;}
-
/* CSS3 box shadow */
+
#menu li{list-style:none;display:inline;margin:0;padding:0;}
-
-moz-box-shadow:0 0 20px #292929;
+
#menu ul ul{position:absolute;left:-9999px;border-bottom:5px solid red;z-index:9001;}
-
-webkit-box-shadow:2px 5px 8px #292929;
+
#menu ul.level1 li.level1-li{float:left;display:block;position:relative;}
-
box-shadow:2px 5px 8px #292929;
+
#menu b{position:absolute;}
-
/* fine box shadow */
+
#menu a{display:block;font:normal 11px verdana,arial,sans-serif;color:#000;line-height:25px;text-decoration:none;padding:0 20px;}
-
+
#menu ul.level1 li.level1-li a.level1-a{float:left;}
-
padding: 10px 10px 50px 10px;
+
#menu ul li:hover > ul{visibility:visible;left:0;top:21px;}
-
margin-right: 20px;
+
#menu ul ul li:hover > ul{visibility:visible;left:100%;top:auto;margin-top:-25px;margin-left:-4px;}
-
margin-top:20px;
+
#menu li.left:hover > ul{visibility:visible;left:auto;right:0;top:25px;}
-
float: left;
+
#menu li.left ul li:hover > ul{visibility:visible;left:auto;right:100%;top:auto;margin-top:-25px;margin-right:-4px;}
-
position: relative;
+
#menu a:hover ul{left:0;top:23px;}
-
+
#menu li.left a:hover ul{left:auto;right:-1px;top:23px;}
-
-webkit-transition: all 0.5s ease-in-out;
+
#menu li.left ul a{text-align:right;}
-
    -moz-transition: all 0.5s ease-in-out;
+
#menu a:hover a:hover ul,#menu a:hover a:hover a:hover ul{left:100%;visibility:visible;}
-
    -o-transition: all 0.5s ease-in-out;
+
#menu li.left a:hover a:hover ul,#menu li.left a:hover a:hover a:hover ul{left:auto;right:0;visibility:visible;}
-
}
+
#menu li a.drop{background:transparent url(https://static.igem.org/mediawiki/2011/7/7b/Arrow_down.png) no-repeat right center;}
-
 
+
#menu li a.fly{background:transparent url(../images/white-right.gif) no-repeat right center;}
-
.polaroid:last-child{
+
#menu li.left ul a.fly{background:transparent url(../images/white-left.gif) no-repeat left center;}
-
margin-right: 0 !important;
+
#menu li a:hover,#menu li a.fly:hover{color:red;}
-
}
+
#menu li:hover > a,#menu ul li:hover > a.fly{color:red;background-color:#FFF;}
-
 
+
#menu table{position:absolute;height:0;width:0;left:0;border-collapse:collapse;margin-top:-6px;}
-
.polaroid img{
+
#menu table table{position:absolute;left:99%;height:0;width:0;border-collapse:collapse;margin-top:-30px;margin-left:-4px;}
-
width: 150px;
+
#menu li.left table{position:absolute;height:0;width:0;left:auto;right:0;border-collapse:collapse;margin-top:-4px;}
-
height: 150px;
+
#menu li.left table table{position:absolute;left:auto;right:100%;height:0;width:0;border-collapse:collapse;margin-top:-30px;margin-right:-4px;}
-
margin-bottom:10px;
+
-
}
+
-
 
+
-
.polaroid span{
+
-
font-size:16px;
+
-
}
+
-
 
+
-
.polaroid:hover{
+
-
-webkit-transform: rotate(-8deg);
+
-
-moz-transform: rotate(-8deg);
+
-
transform: rotate(-8deg);
+
-
}
+
-
+
-
#contenuto a{
+
-
color: #333;
+
-
font-weight: bold;
+
-
text-decoration: none;
+
-
}
+
-
#contenuto2 a{
+
-
color: #333;
+
-
font-weight: bold;
+
-
text-decoration: none;
+
-
}
+
-
a#comeback{
+
-
font-family: Arial, sans-serif;
+
-
font-size: 30px;
+
-
position: absolute;
+
-
bottom: 30px;
+
-
left: 20px;
+
-
color: #888;
+
-
text-shadow: 1px 1px 0px #fff;
+
-
}
+
-
+
-
a#comeback:hover{
+
-
color: #333;
+
-
text-shadow: 1px 1px 0px #fff;
+
-
}
+
-
 
+
-
#contentgrid p {   display: inline; }  
+
-
 
+
-
#tech-slideshow {
+
-
    height: 200px;
+
-
    position: relative;
+
-
    overflow: hidden;
+
-
}
+
-
#tech-slideshow > div {
+
-
    height: 200px;
+
-
    width: 2526px;
+
-
    background: url();
+
-
    position: absolute;
+
-
    top: 0;
+
-
    left: 0;
+
-
    height: 100%;
+
-
   
+
-
    -moz-transition: opacity 0.5s ease-out;  
+
-
      -o-transition: opacity 0.5s ease-out;  
+
-
  -webkit-transition: opacity 0.5s ease-out;  
+
-
      -ms-transition: opacity 0.5s ease-out;  
+
-
 
+
-
    -webkit-animation: moveSlideshow 60s linear infinite;
+
-
    -moz-animation:   moveSlideshow 60s linear infinite;
+
-
   
+
-
}
+
-
 
+
-
@-webkit-keyframes moveSlideshow {
+
-
    0% { left: 0; }
+
-
    100% { left: -1684px; }
+
-
}
+
-
@-moz-keyframes moveSlideshow {
+
-
    0% { left: 0; }
+
-
    100% { left: -1684px; }
+
-
}
+
-
#groupparts {width:100% !important;}
+
-
#biobricks table{border:1px solid black;border-collapse:collapse;}
+
-
#biobricks table td{border-bottom:1px solid black;}
+
-
#menu {width:975px; text-align:center; margin:0 auto;background-color:white;margin-top:10px; margin-bottom:10px;}
+
-
 
+
-
#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left; background:white;}
+
-
#menu ul {display:inline-block;}
+
-
 
+
-
#menu li {margin:0; padding:0; list-style:none;}
+
-
#menu li {display:inline-block; display:inline;}
+
-
#menu ul ul {position:absolute; left:-9999px;border-bottom:5px solid red;z-index:9001}
+
-
 
+
-
#menu ul.level1 {margin:0 auto;}
+
-
#menu ul.level1 li.level1-li {float:left; display:block; position:relative;}
+
-
 
+
-
#menu b {position:absolute;} /* -- for IE6 non-flyout dropdowns to stop flickering - who knows why --*/
+
-
 
+
-
#menu a {display:block; font:normal 11px verdana,arial,sans-serif; color:#000; line-height:25px; text-decoration:none;padding:0 20px;}
+
-
#menu ul.level1 li.level1-li a.level1-a {float:left;}
+
-
 
+
-
#menu ul li:hover > ul {visibility:visible; left:0; top:21px;}
+
-
#menu ul ul li:hover > ul {visibility:visible; left:100%; top:auto; margin-top:-25px; margin-left:-4px;}
+
-
#menu li.left:hover > ul {visibility:visible; left:auto; right:0; top:25px;}
+
-
#menu li.left ul li:hover > ul {visibility:visible; left:auto; right:100%; top:auto; margin-top:-25px; margin-right:-4px;}
+
-
 
+
-
 
+
-
#menu a:hover ul {left:0; top:23px;}
+
-
#menu li.left a:hover ul {left:auto; right:-1px; top:23px;}
+
-
 
+
-
#menu li.left ul a {text-align:right;}
+
-
 
+
-
 
+
-
#menu a:hover a:hover ul,  
+
-
#menu a:hover a:hover a:hover ul {left:100%; visibility:visible;}
+
-
#menu li.left a:hover a:hover ul,  
+
-
#menu li.left a:hover a:hover a:hover ul {left:auto; right:0; visibility:visible;}
+
-
 
+
-
#menu a:hover ul ul,
+
-
#menu a:hover a:hover ul ul {left:-9999px;}
+
-
#menu li.left a:hover ul ul,
+
-
#menu li.left a:hover a:hover ul ul {left:-9999px;}
+
-
 
+
-
#menu li a.drop {background:transparent url(https://static.igem.org/mediawiki/2011/7/7b/Arrow_down.png) no-repeat right center;}
+
-
#menu li a.fly {background:transparent url(../images/white-right.gif) no-repeat right center;}
+
-
#menu li.left ul a.fly {background:transparent url(../images/white-left.gif) no-repeat left center;}
+
-
 
+
-
#menu li a:hover,
+
-
#menu li a.fly:hover {color:red; background-color-white;}  
+
-
#menu li:hover > a,
+
-
#menu ul li:hover > a.fly {color:red; background-color:white;}
+
-
 
+
-
#menu table {position:absolute; height:0; width:0; left:0; border-collapse:collapse; margin-top:-6px;}
+
-
#menu table table {position:absolute; left:99%; height:0; width:0; border-collapse:collapse; margin-top:-30px; margin-left:-4px;}
+
-
 
+
-
#menu li.left table {position:absolute; height:0; width:0; left:auto; right:0; border-collapse:collapse; margin-top:-4px;}
+
-
#menu li.left table table {position:absolute; left:auto; right:100%; height:0; width:0; border-collapse:collapse; margin-top:-30px; margin-right:-4px;}
+
#content{width:975px;}
#content{width:975px;}
#contentgrid{width:945px;background-color:#FFF;margin-bottom:-5px;padding-left:15px;padding-right:15px;text-align:justify;}
#contentgrid{width:945px;background-color:#FFF;margin-bottom:-5px;padding-left:15px;padding-right:15px;text-align:justify;}
Line 276: Line 148:
#headerimage{width:975px;margin-top:-18px;}
#headerimage{width:975px;margin-top:-18px;}
#headerimage img{max-width:975px;}
#headerimage img{max-width:975px;}
-
 
+
#headermenu{text-align:center;width:975px;height:22px;background-color:#fff;margin-bottom:12px;}
-
#headermenu{text-align:center;width:975px;height:22px; background-color: #ffffff; margin-bottom:12px;}
+
#headermenu a{display:block;font:normal 11px verdana,arial,sans-serif;color:#444;line-height:22px;text-decoration:none;padding:0 20px;}
#headermenu a{display:block;font:normal 11px verdana,arial,sans-serif;color:#444;line-height:22px;text-decoration:none;padding:0 20px;}
-
#headermenu a.down b{float:left; no-repeat right top;cursor:pointer;padding:0 20px 0 0;}
+
#headermenu a.down b{float:left;cursor:pointer;padding:0 20px 0 0;}
-
#headermenu a.down:hover b,#headermenu a.down:focus b,#headermenu a.down:active b{color:#000; no-repeat right -30px;cursor:pointer;}
+
#headermenu a.top-a{float:left;text-align:center;padding:0;}
-
#headermenu a.top-a{float:left;) no-repeat left top;padding:0 0 0 0px; text-align:center;}
+
#headermenu a.top-a b{float:left;cursor:hand;min-width:96px;text-align:center;padding:0 20px 0 0;}
-
#headermenu a.top-a b{float:left;) no-repeat right top;cursor:hand;padding:0 20px 0 0;min-width:96px;text-align:center;}
+
#headermenu a.top-a:hover,#headermenu li.top-li:hover > a{white-space:nowrap;}
-
#headermenu a.top-a:hover b,#headermenu a.top-a:focus b,#headermenu a.top-a:active b{color:#000; no-repeat right -30px;cursor:pointer;}
+
-
#headermenu a.top-a:hover,#headermenu li.top-li:hover > a{white-space:nowrap;) no-repeat left -30px;}
+
#headermenu a:hover ul ul,#headermenu a:hover a:hover ul ul{visibility:hidden;}
#headermenu a:hover ul ul,#headermenu a:hover a:hover ul ul{visibility:hidden;}
#headermenu li{margin:0;padding:0;}
#headermenu li{margin:0;padding:0;}
-
#headermenu li li{border-bottom:1px solid #000000;}
+
#headermenu li.top-li{width:119px;border-left:1px solid #000;text-align:center;float:left;position:relative;margin-right:1px;}
-
#headermenu li.top-li{float:left;position:relative;margin-right:1px; width:119px; border-left: 1px solid #000000; text-align: center;}
+
#headermenu li.top-li2{float:left;position:relative;margin-right:1px;width:127px;border-left:1px solid #000;text-align:center;}
-
#headermenu li.top-li2{float:left;position:relative;margin-right:1px; width:127px; border-left: 1px solid #000000; text-align: center;}
+
#headermenu li.top-li3{float:left;position:relative;margin-right:1px;width:117px;}
-
#headermenu li.top-li3{float:left;position:relative;margin-right:1px; width:117px; }
+
#headermenu li li a{background:#fff;}
#headermenu li li a{background:#fff;}
#headermenu li li a:hover,#headermenu li li:hover > a{background:#e3e6ed;}
#headermenu li li a:hover,#headermenu li li:hover > a{background:#e3e6ed;}
#headermenu li li ul{left:100%;margin-top:-23px;margin-left:-5px;}
#headermenu li li ul{left:100%;margin-top:-23px;margin-left:-5px;}
-
#headermenu li ul{display:block;position:absolute;visibility:hidden;background:#ff0000;left:0;padding:0px 0px 8px;}
+
#headermenu li ul{display:block;position:absolute;visibility:hidden;background:red;left:0;padding:0 0 8px;}
-
#headermenu li.top-li{float:left;position:relative;margin-right:1px;}
+
-
#headermenu li.top-li:hover > a b{color:#000; no-repeat right -30px;}
+
-
#headermenu li.top-li:hover > a.down b{color:#000; no-repeat right -30px;}
+
#headermenu li:hover > ul,#headermenu a:hover ul,#headermenu a:hover a:hover ul,#headermenu a:hover a:hover a:hover ul{visibility:visible;}
#headermenu li:hover > ul,#headermenu a:hover ul,#headermenu a:hover a:hover ul,#headermenu a:hover a:hover a:hover ul{visibility:visible;}
#headermenu table{text-align:left;position:absolute;top:0;left:0;border-collapse:collapse;}
#headermenu table{text-align:left;position:absolute;top:0;left:0;border-collapse:collapse;}
Line 304: Line 169:
#headermenu table ul li a{padding-left:20px;}
#headermenu table ul li a{padding-left:20px;}
#headermenu ul{zoom:1px;text-align:left;list-style:none;white-space:nowrap;margin:0;padding:0;}
#headermenu ul{zoom:1px;text-align:left;list-style:none;white-space:nowrap;margin:0;padding:0;}
-
#headermenu ul.drop-down{top:22px;opacity:1px;z-index:52; width:175px}
+
#headermenu ul.drop-down{top:22px;opacity:1px;z-index:52;width:175px;}
-
#headermenu ul.top{margin:0 auto;}
+
#leftcolumn{width:669px;float:left;border-right:1px solid #FFF;height:1400px;padding-right:15px;}
#leftcolumn{width:669px;float:left;border-right:1px solid #FFF;height:1400px;padding-right:15px;}
#menubar.left-menu{background-color:#FFF;width:975px;float:left;border:none;}
#menubar.left-menu{background-color:#FFF;width:975px;float:left;border:none;}
Line 313: Line 177:
#sitenews{overflow:auto;border:1px solid #529bc7;height:300px;width:248px;margin-top:25px;margin-bottom:25px;}
#sitenews{overflow:auto;border:1px solid #529bc7;height:300px;width:248px;margin-top:25px;margin-bottom:25px;}
#news{overflow:auto;height:500px;width:654px;padding-right:25px;}
#news{overflow:auto;height:500px;width:654px;padding-right:25px;}
-
#news h2{ font-size:125%;}
+
#news h2{font-size:125%;}
#sponsors{width:673px;margin-top:658px;background-color:#FFF;border:1px solid #529bc7;}
#sponsors{width:673px;margin-top:658px;background-color:#FFF;border:1px solid #529bc7;}
#toc,.toc{float:right;margin-top:50px;margin-left:20px;}
#toc,.toc{float:right;margin-top:50px;margin-left:20px;}
#top-section{height:14px;margin:0 auto !important;}
#top-section{height:14px;margin:0 auto !important;}
.day-active{color:blue;font-weight:700;}
.day-active{color:blue;font-weight:700;}
-
.day-empty,#menubar.left-menu a,#menubar.right-menu a{color:#000;}
 
.firstHeading{width:0;height:0;display:none;position:relative;top:0;left:0;margin:0;}
.firstHeading{width:0;height:0;display:none;position:relative;top:0;left:0;margin:0;}
table{font-family:sans-serif;}
table{font-family:sans-serif;}
-
body{font-family: 'Trebuchet MS', Helvetica, sans-serif;}
+
body{font-family:'Trebuchet MS', Helvetica, sans-serif;}
-
h1,h2,h3,h4,h5,h6{color:#FF0000;font-weight:bold;}
+
h1,h2,h3,h4,h5,h6{color:red;font-weight:700;}
table.calendar td{vertical-align:top;align:center;}
table.calendar td{vertical-align:top;align:center;}
table.month .dow td{color:#000;text-align:center;font-size:100%;}
table.month .dow td{color:#000;text-align:center;font-size:100%;}
Line 329: Line 192:
table.month td{border:none;text-align:center;background-color:#FFF;}
table.month td{border:none;text-align:center;background-color:#FFF;}
table.month,#menubar.right-menu li a{background-color:#FFF;}
table.month,#menubar.right-menu li a{background-color:#FFF;}
-
img.bg{min-height: 100%;min-width: 1024px;width: 100%;height: auto;position: fixed;top: 0;left: 0;z-index:-1;}
+
img.bg{min-height:100%;min-width:1024px;width:100%;height:auto;position:fixed;top:0;left:0;z-index:-1;}
-
ul { line-height: 1.5em; list-style-type: square; margin: .3em 0 0 1.5em; padding: 0; list-style-image: url(https://static.igem.org/mediawiki/2011/4/4a/Bullit.jpg);
+
ul{line-height:1.5em;list-style-type:square;list-style-image:url(https://static.igem.org/mediawiki/2011/4/4a/Bullit.jpg);margin:.3em 0 0 1.5em;padding:0;}
-
 
+
#contenuto a,#contenuto2 a{color:#333;font-weight:700;text-decoration:none;}
 +
#biobricks table td,#headermenu li li{border-bottom:1px solid #000;}
 +
#menu ul.level1,#headermenu ul.top{margin:0 auto;}
 +
#menu a:hover ul ul,#menu a:hover a:hover ul ul,#menu li.left a:hover ul ul,#menu li.left a:hover a:hover ul ul{left:-9999px;}
 +
#headermenu a.down:hover b,#headermenu a.down:focus b,#headermenu a.down:active b,#headermenu a.top-a:hover b,#headermenu a.top-a:focus b,#headermenu a.top-a:active b{color:#000;cursor:pointer;}
 +
#headermenu li.top-li:hover > a b,#headermenu li.top-li:hover > a.down b,.day-empty,#menubar.left-menu a,#menubar.right-menu a{color:#000;}
</style>
</style>
<html>
<html>

Revision as of 15:19, 12 September 2011