Team:UCSF UCB/CSS

From 2014.igem.org

(Difference between revisions)
 
(21 intermediate revisions not shown)
Line 417: Line 417:
   ========================================================================== */
   ========================================================================== */
.landing-container {
.landing-container {
-
   background: #3D4C53;
+
   background: #3d4c53;
   width: 1026px;
   width: 1026px;
   -webkit-animation: zoom-dark, 12s, 0, linear, infinite;
   -webkit-animation: zoom-dark, 12s, 0, linear, infinite;
Line 429: Line 429:
@-webkit-keyframes zoom-dark {
@-webkit-keyframes zoom-dark {
   0% {
   0% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   10% {
   10% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   20% {
   20% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   90% {
   90% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   100% {
   100% {
-
     background: #3D4C53; } }
+
     background: #3d4c53; } }
@-moz-keyframes zoom-dark {
@-moz-keyframes zoom-dark {
   0% {
   0% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   10% {
   10% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   20% {
   20% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   90% {
   90% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   100% {
   100% {
-
     background: #3D4C53; } }
+
     background: #3d4c53; } }
@keyframes zoom-dark {
@keyframes zoom-dark {
   0% {
   0% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   10% {
   10% {
-
     background: #3D4C53; }
+
     background: #3d4c53; }
 +
 
   20% {
   20% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   90% {
   90% {
     background: #4e5d64; }
     background: #4e5d64; }
 +
   100% {
   100% {
-
     background: #3D4C53; } }
+
     background: #3d4c53; } }
@-webkit-keyframes zoom {
@-webkit-keyframes zoom {
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   50% {
   50% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   60% {
   60% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   90% {
   90% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 474: Line 490:
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   50% {
   50% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   60% {
   60% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   90% {
   90% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 485: Line 505:
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   50% {
   50% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   60% {
   60% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   90% {
   90% {
     opacity: 0.05; }
     opacity: 0.05; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 496: Line 520:
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   10% {
   10% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   20% {
   20% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   90% {
   90% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 507: Line 535:
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   10% {
   10% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   20% {
   20% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   90% {
   90% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 518: Line 550:
   0% {
   0% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   10% {
   10% {
     opacity: 0.4; }
     opacity: 0.4; }
 +
   20% {
   20% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   90% {
   90% {
     opacity: 0.1; }
     opacity: 0.1; }
 +
   100% {
   100% {
     opacity: 0.4; } }
     opacity: 0.4; } }
Line 648: Line 684:
.landing #Title {
.landing #Title {
 +
  width: 500px;
 +
  height: 450px;
 +
  padding: 50px 0;
 +
  float: left;
 +
  color: white; }
 +
 +
#bodyContent .landing #Title {
   width: 500px;
   width: 500px;
   height: 450px;
   height: 450px;
Line 656: Line 699:
.landing #Title h1 {
.landing #Title h1 {
   font-size: 2.5em;
   font-size: 2.5em;
-
   line-height: 1em; }
+
   line-height: 1em;
 +
  color: white; }
 +
 
 +
#bodyContent .landing #Title h1 {
 +
  font-size: 2.5em;
 +
  line-height: 1em;
 +
  color: white; }
 +
 
 +
.notebooks-container .home {
 +
  color: black; }
 +
  .notebooks-container .home .call {
 +
    color: black;
 +
    border: 1px black solid; }
 +
 
 +
#bodyContent .notebooks-container .home {
 +
  color: black; }
 +
  #bodyContent .notebooks-container .home .call {
 +
    color: black;
 +
    border: 1px black solid; }
 +
 
 +
#bodyContent .home {
 +
  color: white; }
 +
  #bodyContent .home article {
 +
    float: left;
 +
    margin: 150px 0;
 +
    width: 500px; }
 +
    #bodyContent .home article h1 {
 +
      font-size: 2.5em;
 +
      color: white; }
 +
  #bodyContent .home svg {
 +
    float: left; }
 +
  #bodyContent .home svg.right {
 +
    float: right; }
 +
 
 +
.home {
 +
  color: white; }
 +
  .home article {
 +
    float: left;
 +
    margin: 150px 0;
 +
    width: 500px; }
 +
    .home article h1 {
 +
      font-size: 2.5em; }
 +
  .home svg {
 +
    float: left; }
 +
  .home svg.right {
 +
    float: right; }
 +
 
 +
.landing .call, .home .call {
 +
  float: right;
 +
  padding: 5px 20px;
 +
  border: 1px white solid;
 +
  margin: 0 20px;
 +
  color: white;
 +
  text-decoration: none; }
 +
.landing a.call:hover, .home a.call:hover {
 +
  background: white;
 +
  color: #3d4c53; }
 +
.landing a.call:active, .home a.call:active {
 +
  top: 1; }
.notebooks-container {
.notebooks-container {
-
   background: #FFE11A;
+
   background: #ffe11a;
   width: 1026px;
   width: 1026px;
   position: relative; }
   position: relative; }
Line 670: Line 771:
#bodyContent .notebooks-container .menu a:hover h2 {
#bodyContent .notebooks-container .menu a:hover h2 {
-
   border: 1px #FFE11A solid; }
+
   border: 1px #ffe11a solid; }
.notebooks-container .menu a h2 {
.notebooks-container .menu a h2 {
Line 676: Line 777:
.notebooks-container .menu a:hover h2 {
.notebooks-container .menu a:hover h2 {
-
   border: 1px #FFE11A solid; }
+
   border: 1px #ffe11a solid; }
.notebooks-container h1, .notebooks-container h2 {
.notebooks-container h1, .notebooks-container h2 {
Line 717: Line 818:
.multi-container ul li .active {
.multi-container ul li .active {
-
   background: #FFE11A;
+
   background: #ffe11a;
   font-weight: 500; }
   font-weight: 500; }
Line 739: Line 840:
.multi-container aside li a:hover {
.multi-container aside li a:hover {
-
   background: #FFE11A; }
+
   background: #ffe11a; }
.multi-container #member-select header {
.multi-container #member-select header {
Line 839: Line 940:
.team-container {
.team-container {
-
   background: #0CDBE8;
+
   background: #0cdbe8;
-
   width: 1026px;
+
   width: 1026px; }
-
  margin-bottom: 10px; }
+
.team-container .menu a:hover h2 {
.team-container .menu a:hover h2 {
-
   border: 1px #0CDBE8 solid; }
+
   border: 1px #0cdbe8 solid; }
 +
 
 +
#bodyContent .team-container .menu a:hover h2 {
 +
  border: 1px #0cdbe8 solid; }
#attributions article, #team-members .member, #advisors .member {
#attributions article, #team-members .member, #advisors .member {
Line 876: Line 979:
   padding: 5px;
   padding: 5px;
   margin: 0 0 0 5px;
   margin: 0 0 0 5px;
-
   border: 1px solid #3D4C53; }
+
   border: 1px solid #3d4c53; }
.project-container {
.project-container {
-
   background: #3D4C53;
+
   background: #3d4c53;
   width: 1024px; }
   width: 1024px; }
.project-container .menu a:hover h2 {
.project-container .menu a:hover h2 {
-
   border: 1px #3D4C53 solid; }
+
   border: 1px #3d4c53 solid; }
 +
 
 +
#bodyContent .project-container .menu a:hover h2 {
 +
  border: 1px #3d4c53 solid; }
#project table {
#project table {
Line 894: Line 1,000:
   padding: 0; }
   padding: 0; }
   #project table tr .active {
   #project table tr .active {
-
     background: #EA2E49;
+
     background: #ea2e49;
     text-decoration: none;
     text-decoration: none;
     text-align: center; }
     text-align: center; }
     #project table tr .active a {
     #project table tr .active a {
       color: white; }
       color: white; }
 +
#project #biobricks table a {
 +
  text-decoration: underline; }
#project table tr:nth-child(2n) {
#project table tr:nth-child(2n) {
   background-color: #f8f8f8; }
   background-color: #f8f8f8; }
Line 906: Line 1,014:
   text-align: left;
   text-align: left;
   font-weight: bold;
   font-weight: bold;
-
   padding: 6px 13px; }
+
   padding: 0px 13px; }
#project table tr td {
#project table tr td {
   border: 1px solid #cccccc;
   border: 1px solid #cccccc;
   margin: 0;
   margin: 0;
-
   padding: 6px 13px;
+
   padding: 0px 13px;
   font-size: 0.9em; }
   font-size: 0.9em; }
#project table tr th :first-child, #project table tr td :first-child {
#project table tr th :first-child, #project table tr td :first-child {
Line 917: Line 1,025:
   margin-bottom: 0; }
   margin-bottom: 0; }
#project table a {
#project table a {
-
   color: #3D4C53; }
+
   color: #3d4c53; }
#project .graph {
#project .graph {
   float: right;
   float: right;
Line 926: Line 1,034:
     text-align: center;
     text-align: center;
     font-family: "Helvetica Neue", Arial, sans-serif;
     font-family: "Helvetica Neue", Arial, sans-serif;
-
     margin: 0; }
+
     margin: 0;
 +
    padding: 0; }
 +
#project #future .direction {
 +
  overflow: hidden;
 +
  padding: 10px;
 +
  margin: 10px 10px 0 0;
 +
  float: left;
 +
  border: 1px solid #ccc;
 +
  width: 280px; }
 +
  #project #future .direction h3 {
 +
    margin: 5px;
 +
    padding: 0; }
 +
#project #results {
 +
  background: #eee;
 +
  padding: 10px 0; }
 +
  #project #results h2 {
 +
    padding-top: 10px;
 +
    background: white; }
 +
  #project #results .graph-description {
 +
    width: 300px;
 +
    margin: 50px 0;
 +
    padding: 10px 10px;
 +
    float: left;
 +
    border-left: 1px #888 solid; }
 +
  #project #results .result-graph {
 +
    float: left; }
 +
    #project #results .result-graph svg {
 +
      margin-right: 20px; }
 +
    #project #results .result-graph h3 {
 +
      padding-top: 30px;
 +
      text-align: center;
 +
      margin-bottom: 0; }
 +
#project #model img {
 +
  float: right;
 +
  border: 1px #ccc solid;
 +
  margin: 20px;
 +
  padding: 10px; }
 +
#project #model img.formula {
 +
  float: none;
 +
  display: block;
 +
  margin: 0 auto;
 +
  clear: both;
 +
  border: none; }
#project #design #project-circuit table {
#project #design #project-circuit table {
   float: left;
   float: left;
Line 951: Line 1,101:
     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAMAAAC67D+PAAAABlBMVEXW2N7x8fFtFbdeAAAAKUlEQVR42jXKAQoAAAjCQPf/T8egCaEcbcxgA8MkjhcvsVmapBqJgb4PC6kAOLAu0ikAAAAASUVORK5CYII=); }
     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAMAAAC67D+PAAAABlBMVEXW2N7x8fFtFbdeAAAAKUlEQVR42jXKAQoAAAjCQPf/T8egCaEcbcxgA8MkjhcvsVmapBqJgb4PC6kAOLAu0ikAAAAASUVORK5CYII=); }
   #project #design #project-circuit article .slide-controls a {
   #project #design #project-circuit article .slide-controls a {
-
     color: #3D4C53;
+
     color: #3d4c53;
     float: right;
     float: right;
     margin: 0 15px 0 0;
     margin: 0 15px 0 0;
Line 961: Line 1,111:
   #project #design #project-circuit article .slide-controls a:hover {
   #project #design #project-circuit article .slide-controls a:hover {
     color: white;
     color: white;
-
     background: #EA2E49; }
+
     background: #ea2e49; }
   #project #design #project-circuit article .slide-controls a:active {
   #project #design #project-circuit article .slide-controls a:active {
     color: #000; }
     color: #000; }
Line 1,018: Line 1,168:
   stroke: rgba(255, 225, 26, 0.8); }
   stroke: rgba(255, 225, 26, 0.8); }
#project #pTEF1 #pTEF1graph-pTEF1, #project #pTEF1_m3 #pTEF1graph-m3, #project #pTEF1_m6 #pTEF1graph-m6, #project #pTEF1_m7 #pTEF1graph-m7, #project #pTEF1_m10 #pTEF1graph-m10 {
#project #pTEF1 #pTEF1graph-pTEF1, #project #pTEF1_m3 #pTEF1graph-m3, #project #pTEF1_m6 #pTEF1graph-m6, #project #pTEF1_m7 #pTEF1graph-m7, #project #pTEF1_m10 #pTEF1graph-m10 {
-
   fill: #98C000; }
+
   fill: #98c000; }
#project #biobricks {
#project #biobricks {
   margin-bottom: 20px; }
   margin-bottom: 20px; }
Line 1,039: Line 1,189:
       padding: 0 25px; }
       padding: 0 25px; }
     #project #biobricks article .biobrick-tidbit {
     #project #biobricks article .biobrick-tidbit {
-
       width: 230px;
+
       width: 240px;
       padding: 10px 10px;
       padding: 10px 10px;
       border: 1px #ddd solid;
       border: 1px #ddd solid;
Line 1,049: Line 1,199:
.hp-container {
.hp-container {
-
   background: #EA2E49;
+
   background: #ea2e49;
   width: 1024px; }
   width: 1024px; }
.hp-container .menu a:hover h2 {
.hp-container .menu a:hover h2 {
-
   border: 1px #EA2E49 solid; }
+
   border: 1px #ea2e49 solid; }
-
#hp #super-science {
+
#bodyContent .hp-container .menu a:hover h2 {
 +
  border: 1px #ea2e49 solid; }
 +
 
 +
#hp #super_science {
   position: relative; }
   position: relative; }
-
   #hp #super-science img {
+
   #hp #super_science img {
     border: 1px solid #ccc;
     border: 1px solid #ccc;
     padding: 10px;
     padding: 10px;
     float: right;
     float: right;
     margin: 10px; }
     margin: 10px; }
-
   #hp #super-science ul {
+
   #hp #super_science ul {
     list-style-position: inside; }
     list-style-position: inside; }
-
     #hp #super-science ul li {
+
     #hp #super_science ul li {
       padding: 5px 0; }
       padding: 5px 0; }
-
   #hp #super-science #dna-man {
+
   #hp #super_science #dna-man {
     float: left;
     float: left;
     shape-outside: polygon(nonzero, 0px 2px, 309px 8px, 359px 38px, 340px 91px, 343px 156px, 318px 212px, 436px 265px, 458px 378px, 454px 475px, 469px 533px, 455px 600px, 462px 674px, 3px 674px);
     shape-outside: polygon(nonzero, 0px 2px, 309px 8px, 359px 38px, 340px 91px, 343px 156px, 318px 212px, 436px 265px, 458px 378px, 454px 475px, 469px 533px, 455px 600px, 462px 674px, 3px 674px);
Line 1,080: Line 1,233:
   margin-bottom: 30px; }
   margin-bottom: 30px; }
-
.models-container {
+
.judging-container {
-
   background: #98C000;
+
   background: #98c000;
   width: 1024px; }
   width: 1024px; }
-
.models-container .menu a:hover h2 {
+
.judging-container .menu a:hover h2 {
-
   border: 1px #98C000 solid; }
+
   border: 1px #98c000 solid; }
 +
 
 +
#bodyContent .judging-container .menu a:hover h2 {
 +
  border: 1px #98c000 solid; }
 +
 
 +
#medal article {
 +
  margin: 1em 0; }
 +
  #medal article svg {
 +
    float: left; }
 +
  #medal article ol {
 +
    float: left;
 +
    width: 750px; }
 +
    #medal article ol p {
 +
      margin: .2em; }
 +
    #medal article ol p.requirement {
 +
      border-top: 1px #ccc solid;
 +
      font-weight: normal; }
 +
 
 +
#implications img {
 +
  float: right;
 +
  padding: 5px;
 +
  border: 1px solid #ccc;
 +
  margin: 10px; }
h1, h2, h3, h4, h5, h6 {
h1, h2, h3, h4, h5, h6 {
Line 1,096: Line 1,271:
   width: 1026px;
   width: 1026px;
   position: relative;
   position: relative;
-
   margin-top: -14px;
+
   margin-top: -2em;
   background: #efefef; }
   background: #efefef; }
Line 1,140: Line 1,315:
   display: block; }
   display: block; }
-
nav a:hover, nav .on-page {
+
nav ul li a:hover, nav ul li a.on-page {
   color: #fff;
   color: #fff;
-
   text-shadow: 0 0 2px #222; }
+
   text-shadow: 0 0 2px #222;
 +
  text-decoration: none; }
 +
 
 +
nav a:visited {
 +
  color: black; }
nav a:active {
nav a:active {
Line 1,149: Line 1,328:
nav .project a:hover, nav .project .on-page {
nav .project a:hover, nav .project .on-page {
-
   background: #3D4C53; }
+
   background: #3d4c53; }
-
nav .models a:hover, nav .models .on-page {
+
nav .judging a:hover, nav .judging .on-page {
-
   background: #98C000; }
+
   background: #98c000; }
nav .hp a:hover, nav .hp .on-page {
nav .hp a:hover, nav .hp .on-page {
-
   background: #EA2E49; }
+
   background: #ea2e49; }
nav .notebooks a:hover, nav .notebooks .on-page {
nav .notebooks a:hover, nav .notebooks .on-page {
-
   background: #FFE11A; }
+
   background: #ffe11a; }
nav .team a:hover, nav .team .on-page {
nav .team a:hover, nav .team .on-page {
-
   background: #0CDBE8; }
+
   background: #0cdbe8; }
-
 
+
-
nav .judging a:hover, nav .judging .on-page {
+
-
  background: #707f86; }
+
nav .igem a {
nav .igem a {
Line 1,170: Line 1,346:
nav .igem a:hover .cogs {
nav .igem a:hover .cogs {
-
   fill: #98C000;
+
   fill: #98c000;
   stroke: none; }
   stroke: none; }
Line 1,186: Line 1,362:
     WIDE: Main
     WIDE: Main
   ============ */
   ============ */
-
.main article {
 
-
  float: left;
 
-
  width: 57%; }
 
-
 
-
.main aside {
 
-
  float: right;
 
-
  width: 28%; }
 
-
 
.wrapper {
.wrapper {
   width: 1000px;
   width: 1000px;
Line 1,207: Line 1,375:
     width: 100%; }
     width: 100%; }
-
   .landing-container, .notebooks-container, .team-container, .hp-container, .models-container, .project-container {
+
   .landing-container, .notebooks-container, .team-container, .hp-container, .judging-container, .project-container {
     width: 100%; } }
     width: 100%; } }
.main-container h2, .main-container h3, .main-container h4 {
.main-container h2, .main-container h3, .main-container h4 {
Line 1,238: Line 1,406:
   z-index: 100;
   z-index: 100;
   top: 0;
   top: 0;
-
   position: fixed;
+
   position: relative;
   width: 1026px;
   width: 1026px;
   left: 50%;
   left: 50%;
Line 1,374: Line 1,542:
.footer-container {
.footer-container {
-
  margin-top: 20px;
+
   background: #3d4c53; }
-
   background: #3D4C53; }
+
footer {
footer {
   color: white;
   color: white;
-
   background: #3D4C53; }
+
   background: #3d4c53; }
footer h3 {
footer h3 {

Latest revision as of 07:19, 17 October 2014

Retrieved from "http://2014.igem.org/Team:UCSF_UCB/CSS"