|
|
Line 3: |
Line 3: |
| @charset "UTF-8"; | | @charset "UTF-8"; |
| /*CSS Document */ | | /*CSS Document */ |
- |
| |
- | /* colors #2ab117; is the intense green that our background has
| |
- | #357c24; is more dark green
| |
- | #000000; is black
| |
- | #ffffff; is white
| |
- | #10143a; is the dark blue we had at first */
| |
- |
| |
- | /* colors lab notebook */
| |
- | .day-empty {
| |
- | color: red;
| |
- | }
| |
- | .day-active {
| |
- | color: green;
| |
- | }
| |
- |
| |
- | *{
| |
- | border:0;
| |
- | margin:0;
| |
- | padding:0;
| |
- | }
| |
- |
| |
- |
| |
- |
| |
- | body {
| |
- | width:100%;
| |
- | height:100%;
| |
- | background-color:#2ab117
| |
- | border:none;
| |
- | padding:0;
| |
- | z-index:800;
| |
- | }
| |
- |
| |
- | #contentboxnew {
| |
- |
| |
- | background:white;
| |
- | float: left;
| |
- | text-decoration:none;
| |
- | border:none;
| |
- | z-index:800;
| |
- | }
| |
- |
| |
- | table#tbtext
| |
- | {
| |
- | width:400px;
| |
- | font-weight:400;
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-size: 10px;
| |
- | text-align: left;
| |
- | padding-left: 3px;
| |
- | text-align: justify;
| |
- | }
| |
- | td#tdunderline{border-bottom: green solid thin;}
| |
- |
| |
- | h1 {
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-size:18px;
| |
- | text-transform:uppercase;
| |
- | letter-spacing:1px;
| |
- | /*border-bottom:2px solid #2ab117; */
| |
- | text-decoration: none;
| |
- | color: #2ab117;
| |
- | }
| |
- |
| |
- |
| |
- | h2{
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-size:16px;
| |
- | text-transform:uppercase;
| |
- | letter-spacing:1px;
| |
- | border-bottom:2px solid #000000;
| |
- | text-decoration: none;
| |
- | color: #000000;
| |
- | }
| |
- |
| |
- | h3{
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-variant: small-caps;
| |
- | font-stretch: ultra-expanded;
| |
- | color: #2ab117;
| |
- | font-size:12px;
| |
- | font-weight:bold;
| |
- | line-height:18px;
| |
- | letter-spacing:1px;
| |
- | }
| |
- | h6{
| |
- | color: #357c24;
| |
- | font-size:11px;
| |
- | }
| |
- |
| |
- | a:link, a:active, a:visited{
| |
- | color: #357c24;
| |
- | text-decoration:none;
| |
- | font-weight:#2ab117;
| |
- | target-name:new;
| |
- | target-new:tab;
| |
- |
| |
- | }
| |
- | a:hover{
| |
- | color:#2ab117;
| |
- | }
| |
- | #content {
| |
- | font-family:"Verdana",Arial,sans-serif;
| |
- | background-color: #E0F574;
| |
- | }
| |
- | #bodyContent{
| |
- | }
| |
- |
| |
- | #contentbox {
| |
- | background:white;
| |
- | width:590px;
| |
- | margin: -10px auto 0 auto;
| |
- | padding:20px 50px 50px 50px;
| |
- | float: left;
| |
- | text-decoration:none;
| |
- | border:none;
| |
- | z-index:800;
| |
- | }
| |
- |
| |
- |
| |
- | img.bg_team {
| |
- |
| |
- |
| |
- | /* Set rules to fill background */
| |
- | min-height: 100%;
| |
- | min-width: 1024px;
| |
- |
| |
- | /* Set up proportionate scaling */
| |
- | width: 100%;
| |
- | height: auto;
| |
- |
| |
- | /* Set up positioning */
| |
- | position: fixed;
| |
- | top: 0;
| |
- | left: 0;
| |
- | z-index:-1;
| |
- | }
| |
- |
| |
- | @media screen and (max-width: 1024px){
| |
- | img.bg_team {
| |
- | left: 50%;
| |
- | margin-left: -512px; }
| |
- | }
| |
- |
| |
- | #logo_ed{
| |
- | position:fixed;
| |
- | width:150px;
| |
- | height:100px;
| |
- | margin:10px 0 0 10px;
| |
- | border:0;
| |
- | top:0px;
| |
- | left:0px;
| |
- | padding:0;
| |
- | float:left;
| |
- | z-index:999;
| |
- | }
| |
- | #logo_igem2{
| |
- | position:fixed;
| |
- | width:70px;
| |
- | height:57px;
| |
- | margin:120px 0 0 20px;
| |
- | border:0;
| |
- | top:0px;
| |
- | left:0px;
| |
- | float:left;
| |
- | z-index:9990;
| |
- | background-image:url('https://static.igem.org/mediawiki/igem.org/6/6b/Logo_igem_black.png');
| |
- | }
| |
- | #logo_igem2:hover{
| |
- | background-image:url('https://static.igem.org/mediawiki/2012/6/64/TUDelftLogo_igem_color.png');
| |
- | }
| |
- |
| |
- | #twitter_widget{
| |
- | position:fixed;
| |
- | width:155px;
| |
- | height:240px;
| |
- | background:white;
| |
- | padding:10px 0 0 0;
| |
- | bottom:90px;
| |
- | left:0px;
| |
- | z-index:1001;
| |
- | }
| |
- |
| |
- | #social_linkall{
| |
- | position:fixed;
| |
- | bottom:48px;
| |
- | left:10px;
| |
- | width:120px;
| |
- | height:35px;
| |
- | z-index:1001;
| |
- | border:0;
| |
- | }
| |
- |
| |
- | #social_icons{
| |
- | position:fixed;
| |
- | bottom:15px;
| |
- | left:20px;
| |
- | width:110px;
| |
- | height:24px;
| |
- | z-index:1001;
| |
- | }
| |
- | /*
| |
- | #video-container{
| |
- | position:relative;
| |
- | z-index:800;
| |
- | }
| |
- | */
| |
- |
| |
- | #nav { /*main menu css*/
| |
- | position:fixed;
| |
- | width:1300px;
| |
- | bottom:10px;
| |
- | left:30%;
| |
- | right:70%;
| |
- | margin: 0 0 0 -330px;
| |
- | padding: 0;
| |
- | z-index:1001;
| |
- |
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-size:14px;
| |
- | letter-spacing:1px;
| |
- | text-transform:uppercase;
| |
- | }
| |
- | #nav ul{
| |
- | width: 630px;
| |
- | background: white;
| |
- | text-align:center;
| |
- | margin: 0 auto;
| |
- | }
| |
- | #nav li.on ul, #nav li.off ul {
| |
- | margin: 0;
| |
- | padding: 0;
| |
- | }
| |
- | #nav a {
| |
- | text-decoration: none;
| |
- | }
| |
- | #nav li { /*float the main list items*/
| |
- | margin: 0;
| |
- | float: left;
| |
- | display: inline;
| |
- | padding:0 3px;
| |
- | background:white ;
| |
- | text-align:center;
| |
- | }
| |
- | #nav li ul {
| |
- | display: none;
| |
- |
| |
- | }
| |
- | #nav li.off ul, #nav li.on ul { /*put the subnav above*/
| |
- | position:absolute;
| |
- | /*width:1300px;*/
| |
- | bottom:100%;
| |
- | /*left:30px;
| |
- | right:50%;*/
| |
- | /*margin: 0 0 0 -343px;*/
| |
- | padding: 0 0 5px 0;
| |
- | background:white;
| |
- | /*text-align:center;*/
| |
- |
| |
- | }
| |
- |
| |
- | #nav li a {
| |
- | color: #000000; /*the main menu letters color but home*/
| |
- | font-weight: bold;
| |
- | display: block;
| |
- | height: 15px;
| |
- | width: auto;
| |
- | border-bottom:0;
| |
- | margin: 5px;
| |
- | padding: 0 0 5px 0;
| |
- | }
| |
- |
| |
- | #nav li a span { /*i dont know what this is about*/
| |
- | color: #FFD109;
| |
- | }
| |
- |
| |
- | #nav li a span span{ /*i dont know what this is about*/
| |
- | color: #FFD109;
| |
- | }
| |
- |
| |
- | #nav li a span span span{ /*i dont know what this is about*/
| |
- | color: #FFD109;
| |
- | }
| |
- |
| |
- | #nav li.on a {
| |
- | border-bottom: 2px solid black;
| |
- | color: #000000; /*the color of HOME by default*/
| |
- | }
| |
- |
| |
- | #nav li.on2 a { /*i dont know what this is about*/
| |
- | border-bottom: 2px solid blue;
| |
- | color: aqua;
| |
- | }
| |
- |
| |
- | #nav li.on a:hover {
| |
- | color: #2ab117;
| |
- | }
| |
- |
| |
- | #nav li.on a:hover span{
| |
- | color:#2ab117;
| |
- | }
| |
- |
| |
- | #nav li.on ul a, #nav li.off ul a {
| |
- | /*float: center; ie doesn't inherit the float*/
| |
- | border: 0;
| |
- | font-size:12px;
| |
- | color: #2ab117;
| |
- | width: auto;
| |
- | margin-right: 0px;
| |
- | /*text-align: center;*/
| |
- | }
| |
- | #nav li.on ul {
| |
- | display: block;
| |
- | }
| |
- | #nav li.off:hover ul {
| |
- | display: inline;
| |
- | z-index: 6000;
| |
- | }
| |
- | #nav li.off a:hover, #nav li:hover a {
| |
- | background:white;
| |
- | color: black;
| |
- | }
| |
- |
| |
- | #nav li.off a:hover span, #nav li:hover a {
| |
- | background: white;
| |
- | color: #2ab117;
| |
- | }
| |
- |
| |
- | .third{
| |
- | font-size:11px;
| |
- | padding:0;
| |
- | }
| |
- |
| |
- | #footer {
| |
- | text-decoration:none;
| |
- | border:none;
| |
- | width:100%;
| |
- | }
| |
- | #footer-box{
| |
- | width:0px;
| |
- | height:0px;
| |
- | display:none;
| |
- | }
| |
- |
| |
- | .sum_dot{
| |
- | list-style: disc;
| |
- | }
| |
- |
| |
- | .sum_number{
| |
- | list-style: decimal;
| |
- | }
| |
- |
| |
- | #contentSub{
| |
- | width:0px;
| |
- | height:0px;
| |
- | display:none;
| |
- | }
| |
- |
| |
- |
| |
- |
| |
- | #catlinks{
| |
- | width:0px;
| |
- | height:0px;
| |
- | display:none;
| |
- | }
| |
- |
| |
- | .twtr-widget {
| |
- | width: 150px;
| |
- | }
| |
- |
| |
- | .twtr-hd, .twtr-ft {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #siteSub {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #search-controls {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | .firstHeading {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #search-controls {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #p-logo {
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #top-section {
| |
- | border:none;
| |
- | height:0px ! important;
| |
- | }
| |
- | #centeredimage {
| |
- | display: block;
| |
- | text-align:center;
| |
- | margin-left: auto;
| |
- | margin-right: auto;
| |
- | }
| |
- | #globalWrapper{
| |
- | margin:0;
| |
- | padding:0;
| |
- | border:0;
| |
- | }
| |
- | .visualClear{
| |
- | height:0;
| |
- | width:0;
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #menubar {
| |
- | /* format top menubar */
| |
- | top: 0px;
| |
- | float: left;
| |
- | border: none;
| |
- | font-family:"Trebuchet MS","Verdana",Arial,sans-serif;
| |
- | font-size:85%;
| |
- | height: 24px;
| |
- | }
| |
- |
| |
- | #menubar li a {
| |
- | color: #7297BA;
| |
- | }
| |
- | #menubar li a:hover {
| |
- | text-decoration: underline;
| |
- | }
| |
- | #menubar.right-menu {
| |
- | /* format right part of top menubar and add iGEM mini logo */
| |
- | text-align: right;
| |
- | right: auto;
| |
- | background-color: #336699;
| |
- | width: 975px;
| |
- | z-index: 7;
| |
- | }
| |
- | #menubar.left-menu {
| |
- | /* format left part of top menubar */
| |
- | text-align: left;
| |
- | width: auto;
| |
- | z-index: 8;
| |
- | }
| |
- | #menubar.left-menu:hover {
| |
- | background-color: transparent;}
| |
- |
| |
- |
| |
- | #centeredmenu_bg{
| |
- | position:fixed;
| |
- | bottom:0px;
| |
- | background:#ffffff; /* the line at the botom of the page*/
| |
- | left:0px;
| |
- | width:100%;
| |
- | height:40px;
| |
- | z-index:999;
| |
- | }
| |
- |
| |
- | #centeredmenu {
| |
- | position:fixed;
| |
- | width:690px;
| |
- | bottom:15px;
| |
- | left:50%;
| |
- | margin:0 0 0 -345px;
| |
- | padding:0;
| |
- |
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | font-size:14px;
| |
- | letter-spacing:1px;
| |
- | text-transform:uppercase;
| |
- | z-index:999;
| |
- | text-align:center;
| |
- | }
| |
- |
| |
- | #centeredmenu ul {
| |
- | display:inline;
| |
- | clear:left;
| |
- | list-style:none;
| |
- | line-height:20px;
| |
- | height:20px;
| |
- | margin:0;
| |
- | position:relative;
| |
- | right:0px;
| |
- | text-align:center;
| |
- | background:red;
| |
- | }
| |
- | #centeredmenu ul li {
| |
- | display:inline;
| |
- | list-style:none;
| |
- | margin:0;
| |
- | text-decoration:none;
| |
- | padding:10px;
| |
- | position:relative;
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | color:aqua;
| |
- | font-size:14px;
| |
- | font-weight:bold;
| |
- | text-transform:uppercase;
| |
- | line-height:16px;
| |
- | letter-spacing:1px;
| |
- | }
| |
- |
| |
- | #centeredmenu ul li a {
| |
- | display:inline;
| |
- | margin:0 0 0 1px;
| |
- | text-decoration:none;
| |
- | font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
| |
- | color:aqua;
| |
- | font-size:14px;
| |
- | font-weight:bold;
| |
- | text-transform:uppercase;
| |
- | line-height:16px;
| |
- | letter-spacing:1px;
| |
- | }
| |
- | #centeredmenu ul li a:hover {
| |
- | text-decoration:none;
| |
- | border-bottom: 2px solid black;
| |
- | }
| |
- |
| |
- |
| |
- | .left-menu li a {
| |
- | padding: 0px 10px 0px 0px;
| |
- | color:
| |
- | }
| |
- | .left-menu .selected {
| |
- | # color: white;
| |
- | }
| |
- | #.left-menu .selected:hover {
| |
- | # color: #000000;
| |
- | #}
| |
- |
| |
- | .left-menu:hover a {
| |
- | color: #000000;
| |
- | }
| |
- |
| |
- | .left-menu, .left-menu a {
| |
- | left: 0px;
| |
- | text-align: left;
| |
- | color:transparent;
| |
- | text-transform: lowercase;
| |
- | }
| |
- |
| |
- | .left-menu a:hover {
| |
- | text-decoration:underline;
| |
- | }
| |
- | .left-menu:hover {
| |
- | color: #000000;
| |
- | background-color: white;
| |
- | }
| |
- |
| |
- | .right-menu li {
| |
- | # background-color: yellow ;
| |
- | }
| |
- |
| |
- | .right-menu li a {
| |
- | padding: 0px 15px 0px 0px;
| |
- | color: white;
| |
- | background-color: #2ab117;
| |
- | }
| |
- | .right-menu li a:hover {
| |
- | color: #2ab117;
| |
- | text-decoration: underline;
| |
- | background-color: white;
| |
- | }
| |
- | .right-menu, .right-menu a {
| |
- | right: 0px;
| |
- | text-align: right;
| |
- | color: white;
| |
- |
| |
- | }
| |
- |
| |
- | #logo_igem_div{
| |
- | position:relative;
| |
- | top:0;
| |
- | left:0;
| |
- | width:70px;
| |
- | height:57px;
| |
- | border:0;
| |
- | margin:0;
| |
- | padding:0;
| |
- | overflow:hidden;
| |
- | }
| |
- |
| |
- |
| |
- |
| |
- |
| |
- |
| |
- |
| |
- | #lightbox{
| |
- | position: absolute;
| |
- | left: 0;
| |
- | width: 100%;
| |
- | z-index: 100;
| |
- | text-align: center;
| |
- | line-height: 0;
| |
- | }
| |
- | #lightbox img{
| |
- | width: auto;
| |
- | height: auto;
| |
- | }
| |
- | #lightbox a img{
| |
- | border: none;
| |
- | }
| |
- |
| |
- | #outerImageContainer{
| |
- | position: relative;
| |
- | background-color: white;
| |
- | width: 250px;
| |
- | height: 250px;
| |
- | margin: 0 auto;
| |
- | }
| |
- | #imageContainer{
| |
- | padding: 10px;
| |
- | }
| |
- |
| |
- | #loading{
| |
- | position: absolute;
| |
- | top: 40%;
| |
- | left: 0%;
| |
- | height: 25%;
| |
- | width: 100%;
| |
- | text-align: center;
| |
- | line-height: 0;
| |
- | }
| |
- | #hoverNav{
| |
- | position: absolute;
| |
- | top: 0;
| |
- | left: 0;
| |
- | height: 100%;
| |
- | width: 100%;
| |
- | z-index: 10;
| |
- | }
| |
- | #imageContainer>#hoverNav{ left: 0;}
| |
- | #hoverNav a{ outline: none;}
| |
- |
| |
- | #prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
| |
- | #prevLink { left: 0; float: left;}
| |
- | #nextLink { right: 0; float: right;}
| |
- | #prevLink:hover, #prevLink:visited:hover { background: url(http://homes.esat.kuleuven.be/~igemwiki/images/lighbox/prevlabel.gif) left 15% no-repeat; }
| |
- | #nextLink:hover, #nextLink:visited:hover { background: url(http://homes.esat.kuleuven.be/~igemwiki/images/lightbox/nextlabel.gif) right 15% no-repeat; }
| |
- |
| |
- | #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100% ; }
| |
- |
| |
- | #imageData{ padding:0 10px; color: #000; }
| |
- | #imageData #imageDetails{ width: 70%; float: left; text-align: left; }
| |
- | #imageData #caption{ font-weight: bold; }
| |
- | #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; }
| |
- | #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; outline: none;}
| |
- |
| |
- | #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
| |
- |
| |
- |
| |
| | | |
| </style> | | </style> |
| <html> | | <html> |