Team:Penn

From 2013.igem.org

(Difference between revisions)
Line 55: Line 55:
}
}
-
/*Sections of page*/
+
 
-
.two {
+
-
margin-top: -20px;
+
-
height:800px;
+
-
position: relative;
+
-
padding-top: 30px;
+
-
width: 100%;
+
-
background-color: #50393F;
+
-
background-image: url("https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/-ZtRJ7Gu1U/photo-8.JPG?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg");
+
-
background-position: 300px -100px;
+
-
background-repeat: no-repeat;
+
-
background-size: 80%;
+
-
background-attachment: fixed;
+
-
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
+
-
  filter: alpha(opacity=70);
+
-
-moz-opacity: 0.7;
+
-
-khtml-opacity: 0.7;
+
-
  opacity: 0.7;
+
-
}
+
-
       
+
-
    .three {
+
-
/*
+
-
no background image for now
+
-
background-image: url("https://dl.dropboxusercontent.com/sh/h4cxid18rzzjgan/8XND1QonMj/Profile%20Photos/coolbluestuff.jpg?token_hash=AAGlfzG2xZpKrOTI8pyH02EbYxY1vK3QLUWKsWuYdaPbYg");*/
+
-
position: relative;
+
-
text-align: center;
+
-
height:800px;
+
-
width: 100%;
+
-
padding-top: 50px;
+
-
}
+
   /* CUSTOMIZE THE CAROUSEL
   /* CUSTOMIZE THE CAROUSEL
Line 105: Line 76:
     }
     }
-
    .carousel .item {
+
  .carousel .item {
         height: 500px;
         height: 500px;
     }
     }
 +
   
     .carousel img {
     .carousel img {
       position: absolute;
       position: absolute;
-
       top: -50px;
+
       top: -100px;
       left: 0;
       left: 0;
       min-width: 100%;
       min-width: 100%;
-
     
+
 
     }
     }
     .carousel-caption {
     .carousel-caption {
       background-color: rgba(0,0,0,.4);
       background-color: rgba(0,0,0,.4);
-
      position: static;
+
    position: static;
-
    max-width: 90%;
+
      max-width: 500px;
       padding: 5 20px;
       padding: 5 20px;
-
       margin-top: 250px;
+
       margin-top: 300px;
     }
     }
 +
   
     .carousel-caption h1,
     .carousel-caption h1,
     .carousel-caption .lead {
     .carousel-caption .lead {
Line 130: Line 103:
       text-shadow: 0 1px 1px rgba(0,0,0,.4);
       text-shadow: 0 1px 1px rgba(0,0,0,.4);
     }
     }
 +
   
     .carousel-caption .btn {
     .carousel-caption .btn {
       margin-top: 10px;
       margin-top: 10px;
Line 146: Line 120:
          
          
          
          
-
            /* CUSTOMIZE THE NAVBAR
+
 
-
    -------------------------------------------------- */
+
-
 
+
-
    /* Special class on .container surrounding .navbar, used for positioning it into place. */
+
-
    .navbar-wrapper {
+
-
      position: absolute;
+
-
      top: 0;
+
-
      left: 0;
+
-
      right: 0;
+
-
      z-index: 10;
+
-
      margin-top: 20px;
+
-
      margin-bottom: -90px; /* Negative margin to pull up carousel. 90px is roughly margins and height of navbar. */
+
-
    }
+
-
    .navbar-wrapper .navbar {
+
-
 
+
-
    }
+
-
 
+
-
    /* Remove border and change up box shadow for more contrast */
+
-
    .navbar .navbar-inner {
+
-
      border: 0;
+
-
      -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.25);
+
-
        -moz-box-shadow: 0 2px 10px rgba(0,0,0,.25);
+
-
              box-shadow: 0 2px 10px rgba(0,0,0,.25);
+
-
    }
+
-
 
+
-
    /* Downsize the brand/project name a bit */
+
-
    .navbar .brand {
+
-
      padding: 14px 20px 16px; /* Increase vertical padding to match navbar links */
+
-
      font-size: 16px;
+
-
      font-weight: bold;
+
-
      text-shadow: 0 -1px 0 rgba(0,0,0,.5);
+
-
    }
+
-
 
+
-
    /* Navbar links: increase padding for taller navbar */
+
-
    .navbar .nav > li > a {
+
-
      padding: 15px 20px;
+
-
    }
+
-
 
+
-
    /* Offset the responsive button for proper vertical alignment */
+
-
    .navbar .btn-navbar {
+
-
      margin-top: 10px;
+
-
    }
+
     </style>
     </style>
   </head>
   </head>
Line 193: Line 126:
      
      
      
      
-
       
 
     <div class="navbar-wrapper">
     <div class="navbar-wrapper">
       <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
       <!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
Line 280: Line 212:
               <p class="lead">Learn more about what Penn's iGEM team is doing in the community.  This wiki is currently under construction, but check
               <p class="lead">Learn more about what Penn's iGEM team is doing in the community.  This wiki is currently under construction, but check
               back with us soon to learn more about what we're up to! Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
               back with us soon to learn more about what we're up to! Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
-
               <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Penn/HumanPractices">More Outreach</a>
+
               <a class="btn btn-large btn-primary" href="https://2013.igem.org/Team:Outreach">More Outreach</a>
             </div>
             </div>
           </div>
           </div>
Line 307: Line 239:
  <table class="team" cellpadding="5">
  <table class="team" cellpadding="5">
     <tr>
     <tr>
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEbXRKT3lpN1VQaHc"/>
+
         <td>
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzETDEzdFdSOC1ZVW8"/>
+
             <img id="flipbox" src="https://googledrive.com/host/0B4ZBZOYYKBzETDEzdFdSOC1ZVW8"/>
             <div class="name"><h4></h4></div></td>
             <div class="name"><h4></h4></div></td>
          
          
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzESzZjdGhVVWY3TWc"/>
+
         <td>
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzEZ0tlUUViY2Z6Ymc"/>
+
             <img src="https://googledrive.com/host/0B4ZBZOYYKBzETldtZHBxMTM3Ujg"/>
-
             <div class="name"><h4></h4></div></td>
+
             <div class="name"><h4>Josh</h4></div></td>
          
          
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEU25rV1dHYm1Falk"/>
+
     
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzEU3VZUnNOdWFqYVE"/>
+
       
-
             <div class="name"><h4></h4></div></td>
+
         <td>
 +
             <img src="https://googledrive.com/host/0B4ZBZOYYKBzEU3VZUnNOdWFqYVE"/>
 +
             <div class="name"><h4>Danielle</h4></div></td>
     </tr>
     </tr>
     <tr>
     <tr>
          
          
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEYUtVa3BNSHQ4dTg"/>
+
         <td>
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzEZXRRMlRtODR2OVk/">
+
             <img src="https://googledrive.com/host/0B4ZBZOYYKBzEZXRRMlRtODR2OVk/">
                 <div class="name"><h4>Daniel</h4></div></td>
                 <div class="name"><h4>Daniel</h4></div></td>
        
        
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEVDNlV0UyVWdMVlE"/>
+
         <td><h4><!--Center--></h4></td>
-
            <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzEVDNlV0UyVWdMVlE"/>
+
         <td>
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEVm5ET0R1QndIRVU"/>
+
             <img src="https://googledrive.com/host/0B4ZBZOYYKBzELXJ5NlFKUkJXRnc"/>
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzELXJ5NlFKUkJXRnc"/>
+
             <div class="name"><h4>Mahamad</h4></div></td>
             <div class="name"><h4>Mahamad</h4></div></td>
     </tr>
     </tr>
     <tr>
     <tr>
-
         <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzERzdYWHVkZWxSS2c"/>
+
         <td>
-
            <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzETldtZHBxMTM3Ujg"/>
+
             <img src="https://googledrive.com/host/0B4ZBZOYYKBzERmpYczlyYU5TTUE"/>
-
            <div class="name"><h4>Josh</h4></div></td>
+
-
        <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEOHViLXJJMjVuWTg"/>
+
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzERmpYczlyYU5TTUE"/>
+
             <div class="name"><h4></h4></div>
             <div class="name"><h4></h4></div>
-
        <td><img src="https://googledrive.com/host/0B4ZBZOYYKBzEZ3dMcXBweFE2X1U"/>
+
       
-
             <img class="hidden" src="https://googledrive.com/host/0B4ZBZOYYKBzET2NBWmlOLVMtaVE">
+
          <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzEZ0tlUUViY2Z6Ymc"/>
 +
             <div class="name"><h4></h4></div></td>
 +
       
 +
        <td>
 +
            <img src="https://googledrive.com/host/0B4ZBZOYYKBzET2NBWmlOLVMtaVE">
                 <div class="name"><h4>Spencer</h4></div></td>
                 <div class="name"><h4>Spencer</h4></div></td>
     </tr>
     </tr>
Line 354: Line 289:
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzETkFqdnhMeV9fMzA" ></script>
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
     <script src="https://googledrive.com/host/0B4ZBZOYYKBzEZTdBSFdUV19LYjQ"></script>
 +
    <script src="https://googledrive.com/host/0B4ZBZOYYKBzEOFVQV0ZLWEZqN2M"></script></script>
      
      
     <script src="../assets/js/jquery.js"></script>
     <script src="../assets/js/jquery.js"></script>
Line 391: Line 327:
  });
  });
            
            
-
          $(".team tr td").mouseenter(function(){
+
        /*  $(".team tr td").mouseenter(function(){
           $(this).children(":first").toggleClass("hidden");
           $(this).children(":first").toggleClass("hidden");
           $(this).children(":nth-child(2)").toggleClass("hidden");
           $(this).children(":nth-child(2)").toggleClass("hidden");
Line 414: Line 350:
           $(this).children(":nth-child(3)").hide();
           $(this).children(":nth-child(3)").hide();
            
            
-
             });
+
             });*/
 +
       
 +
        /*Temporary toggle that doesn't really work*/
 +
        var t = 2;
 +
          $("td").click(function(){
 +
            if (t==2) { 
 +
            $(this).flip({direction: 'tb',
 +
                        content: 'Name/description'});
 +
            t=t-1;
 +
            }
 +
            else {
 +
            $(this).revertFlip();
 +
            t=t+1;
 +
            }
 +
            });
 +
         
 +
         
 +
 
 +
         
       }(window.jQuery)
       }(window.jQuery)
     </script>
     </script>

Revision as of 13:03, 11 July 2013

Homepage

Penn's iGEM Team

The project

A brief overview

Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit. Learn more

Meet the Bunch

Josh

Danielle

Daniel

Mahamad

Spencer

Photos by Erica Sachse

Retrieved from "http://2013.igem.org/Team:Penn"