Difference between revisions of "Team:UMaryland/about"

(Undo revision 112952 by Bwalton9 (talk))
Line 1: Line 1:
</div></div>
 
 
<html lang="en">
 
<html lang="en">
<head>
+
<head>
 +
      <script>
 +
/* Hiding stupid stuff*/
 +
                $('#top_title').css('display', 'none');
 +
$('#top_menu').css('display', 'none');
 +
//$('#top_menu_14').css('display', 'none');
 +
                $('#HQ_page').css('display', 'none');
 +
$('#top_menu_under').css('display', 'none');
 +
$('#content').removeClass('mw-body');
 +
$('#content').attr('role','dummy2')
 +
$('#content').attr('id','dummy')
 +
$('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code
 +
$('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr');
 +
</script>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Line 13: Line 25:
 
}
 
}
 
</script>
 
</script>
<link href='https://fonts.googleapis.com/css?family=Exo|Lora' rel='stylesheet' type='text/css'>
 
       
 
 
<link href='https://fonts.googleapis.com/css?family=Raleway:400,200' rel='stylesheet' type='text/css'>
 
<link href='https://fonts.googleapis.com/css?family=Raleway:400,200' rel='stylesheet' type='text/css'>
<link href='http://sachinchoolur.github.io/lightGallery/lightgallery/css/lightgallery.css' rel='stylesheet' type='text/css'>
+
<link href='https://fonts.googleapis.com/css?family=Exo|Lora' rel='stylesheet' type='text/css'>
<title>2nd Annual Mid-Atlantic Meet-up</title>
+
<title>About Our Team</title>
 
</head>
 
</head>
<body>
 
 
<style>
 
<style>
        #bars_item {
 
            display: none;
 
        }
 
  
        #top_menu_14 {
+
#bars_item {
            z-index: 4;
+
display: none;
        }
+
}
  
        #sideMenu {
+
#sideMenu {
            display: none;
+
display: none;
        } 
+
}    
        #bodyContent, #content, html, body, #globalWrapper, #iGEM, #overruled {
+
            width: 100%;
+
            height: 100%;
+
            padding: 0 0 0 0;
+
            border: none;
+
            margin: 0 0 0 0;
+
            background: transparent;
+
        }
+
  
        #top_title {
+
#content {
            display: none;
+
        margin-top: 0px;
            line-height: inherit;
+
}
        }
+
  
        #sideMenu {
+
body {
            display: none;
+
/* Enforces font on the entire page, colored black by default
        }
+
  Makes background off-white slightly to improve visibility with gray font */
 +
font-family: 'Raleway', sans-serif;
 +
color: black;
 +
background-color: #FEFFFA;
 +
overflow-x:hidden;
 +
    margin-right: auto;
 +
    margin-left: auto;
 +
}
  
        /* Navbar and body setup */
+
.follow {
        body {
+
background-color: #FEFFFA;
            font-family: 'Lora', serif;
+
}
            overflow-x: hidden;
+
        }
+
  
        #content {
+
/* Navbar */
            margin-top: 0px;
+
nav {
        }
+
    opacity: 1.0;
 +
    position: fixed;
 +
    top: 0;
 +
    left: 0;
 +
    right: 0;
 +
    line-height: 10px;
 +
    font-size: 20pt;
 +
    display: block;
 +
    background: #fff;
 +
    border-bottom: 1px solid black;
 +
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
 +
    border-bottom-left-radius: 5px;
 +
    border-bottom-right-radius: 5px;
 +
    z-index: 1;
 +
    margin-top: 18px;
 +
}  
  
        /* Navbar */
+
nav a {
        nav {
+
    text-decoration: none;
            opacity: 1.0;
+
    color: black;
            position: fixed;
+
    font-family: 'Exo', sans-serif;
            top: 0;
+
}
            left: 0;
+
            right: 0;
+
            line-height: 10px;
+
            font-size: 20pt;
+
            display: block;
+
            background: #fff;
+
            border-bottom: 1px solid black;
+
            box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
+
            border-bottom-left-radius: 5px;
+
            border-bottom-right-radius: 5px;
+
            z-index: 1;
+
            margin-top: 18px;
+
        }  
+
  
        element.style {
+
a:visited {
            text-decoration: none;
+
    color: black;
        }
+
}
  
        nav a {
+
nav ul {
            text-decoration: none;
+
    list-style: none;
            color: black;
+
    transition: all .5s ease;
            font-family: 'Exo', sans-serif;
+
    text-align: right;
        }
+
}
  
        nav a:visited {
+
nav li {
            color: black;
+
    display: inline;
        }
+
    margin-right: 20px;
 +
}
  
        nav a:hover {
+
nav a:hover, nav a:focus {
            opacity: .7;
+
    opacity: .7;
            text-decoration: none;
+
    text-decoration: none;
        }
+
}
  
        nav a:focus {
 
            text-decoration: none;
 
        }
 
  
        nav ul {
+
/* Nav bar when more icon is clicked */
            list-style: none;
+
            transition: all .5s ease;
+
            text-align: right;
+
        }
+
  
        nav li {
+
#div-navResized {
            display: inline;
+
    font-size: 20pt;
            margin-right: 20px;
+
    position: fixed;
        }
+
    text-align: center;
 +
    display: none;
 +
    width: 100%;
 +
    left: 0;
 +
    right: 0;
 +
    margin-top: 200px;
 +
    z-index: 3;
 +
}
  
        /* Nav bar when more icon is clicked */
+
#div-navResized a {
 +
    text-decoration: none;
 +
    color: black;
 +
    font-family: 'Exo', sans-serif;
 +
}
  
        #div-navResized {
+
#div-navResized ul {
            font-size: 20pt;
+
    list-style: none;
            position: fixed;
+
    margin-right: 40px;
            text-align: center;
+
    margin-top: 0px;
            display: none;
+
}
            width: 100%;
+
            left: 0;
+
            right: 0;
+
            margin-top: 200px;
+
            z-index: 3;
+
        }
+
  
        #div-navResized a {
+
#div-navResized ul li {
            text-decoration: none;
+
    margin-top: 4px;
            color: black;
+
}
            font-family: 'Exo', sans-serif;
+
        }
+
  
        #div-navResized.pushed a:hover {
+
#div-title {
            text-decoration: none !important;
+
    z-index: -999;
            opacity: .7;
+
}
        }
+
  
        #div-navResized ul {
 
            list-style: none;
 
            margin-right: 40px;
 
            margin-top: 0px;
 
        }
 
  
        #div-navResized ul li {
+
#copyrightResized {
            margin-top: 4px;
+
    margin-top: -23px;
        }
+
}
  
        #div-title {
+
#contactResized {
            z-index: -999;
+
    margin-top: -10px;
        }
+
}
  
        /* Background of page */
+
#contactResized:hover {
 +
    text-shadow: .1px .1px black;
 +
}
  
        html {
+
/* Content */
            background-color: rgba(0, 0, 0, 0.06);
+
        }
+
  
        /* Start Page Specific CSS */
+
table {
       
+
    background: none;
        #Speakers p, #Info p {
+
    border: none;
            font-family: 'Raleway', sans-serif;
+
}
        }
+
  
        /* Title */
+
h1 {
        h1, h1-2 {
+
}
            font-size: 30pt;
+
            position: absolute;
+
            top: 350px;
+
            left: 39px;
+
            width: 100%;
+
            border-bottom: none;
+
            color: white;
+
            font-family: 'Lora', serif;
+
        }
+
  
        h1-2 span {  
+
#h1-header {
            color: white;  
+
border-style: none; /* Centers the heading text on the page at different sizes */
            padding-bottom: 2px;
+
color: white; /* makes the text centered and gray colored */
            padding-right: 10px;
+
font-size: 56pt;
            padding-left: 10px;  
+
font-weight: 200;
            letter-spacing: -1px; 
+
text-align: center;
            background: rgb(0, 0, 0); /* fallback color */
+
padding-top: 100px;
            background: rgba(0, 0, 0, 0.7);
+
}
        }
+
  
        h1 {
+
/* Descriptions */
            max-width: 759px;
+
            min-width: 759px;
+
            background: rgb(0, 0, 0); /* fallback color */
+
            background: rgba(0, 0, 0, 0.7);
+
            padding-left: 10px;
+
            padding-bottom: 22px;
+
        }
+
       
+
        #h1 {
+
            font-weight: normal !important;
+
        }
+
  
        /* Info */
+
#h3-header {
 +
font-family: Raleway !important;
 +
color: white;
 +
margin-top: 0px;
 +
text-align: center;
 +
font-size: 16pt;
 +
line-height: 1.5;
 +
margin-bottom: 0px !important;
 +
max-width: 860px;
 +
margin-left: auto;
 +
    margin-right: auto;
 +
padding-bottom: 20px;
 +
font-weight: 400;
 +
padding-bottom: 80px;
 +
}
  
        #Info {
+
#div-content p {
            margin-top: 100px;
+
max-width: 500px;
            margin-left: auto;
+
font-size: 12pt;
            margin-right: auto;
+
    line-height: 2;
            margin-bottom: 50px;
+
    font-weight: 400;
width: 970px;
+
}
        }
+
  
        #meetup {
+
.description {
float: left;
+
display: none;
            padding-top: 80px;
+
margin-top: -450px;
padding-bottom: 80px;
+
min-height: 420px;
            height: 400px;
+
}
            width: 600px;
+
margin-right: 20px;
+
        }
+
  
        #Info p {
+
#table-selector {
            font-size: 15pt;
+
/* formats the table containing nav elements to be centered, addes space on top / bottom */
            line-height: 2;
+
width: 100%;
        }
+
margin-top: 30px;
 +
margin-bottom: 30px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
    max-width: 1035px;
 +
}
  
.pInfo {
+
#table-selector th {
text-align: left;
+
/* makes each cell of nav evenly spaced */
}
+
text-align: center;  
        /* Schedule */
+
width: 25%; /* modify when adding / deleting elements in nav */
 +
}
  
        #div-white {
+
th p {
            z-index: -999;
+
/* formats text inside table of navigational elements */
            position: absolute;
+
/* makes cursor emulate a link to show it's clickable */
            background-color: white;
+
font-size: 5vw;
            width: 100%;
+
font-weight: 400;
            left: 0px;
+
cursor: pointer;
            height: 700px;
+
padding: 5px 0px 15px 0px;
            margin-top: -52px;
+
margin: 0 0 0 0;
            min-width: 1200px;
+
}
        }
+
  
        #img-schedule {
 
            display: block;
 
            margin-top: 50px;
 
            opacity: 1;
 
            width: 600px;
 
            margin-right: auto;
 
            margin-left: auto;
 
        }
 
       
 
        #div-img {
 
            width: 600px;
 
            margin-left: 30%;
 
            margin-right: auto;
 
           
 
        }
 
 
        /* Speakers */
 
  
        h2 {
+
th p:hover {
            font-size: 30pt; width: 970px; margin-right: auto; margin-left: auto; margin-bottom: 20px;
+
/* makes links bold when hovered to show it is a link */
            overflow: visible;
+
font-weight: 800;
        }
+
}
  
        #div-ganesh p, #div-eli p { margin-top: 20px;}
+
#table-selector {
 +
/* makes a single border between two cells rather than two */
 +
    border-collapse: collapse;
 +
}
  
        #Speakers {
+
.profiles {
            margin-left: -8px;
+
display: none;
            margin-right: -8px;
+
}
        }
+
  
        #Speakers img {
+
.clickImage:hover {
            position: absolute;
+
cursor: pointer;
        }
+
}
  
        #Speakers p {
+
/* Acknowledgements */
            font-size: 15pt;
+
            line-height: 2;
+
            width: 970px;
+
            margin-right: auto;
+
            margin-left: auto;
+
            margin-top: 20px;
+
        }
+
  
        #Speakers li {
+
#companies li, #school li {
            display: inline;
+
    display: inline;
            margin-right: 400px;
+
    margin-right: 35px;
        }
+
}
+
        #img-speaker1, #img-speaker2:hover {
+
            cursor: pointer;
+
        }
+
+
#img-speaker1, #img-speaker2 {
+
margin-left: 265px;
+
margin-bottom: 20px;
+
}
+
  
#descriptions {
+
#launch li {
margin-top: 20px;
+
    display: inline;
}
+
    margin-left: 13px;
+
margin-right: 13px;
#ul-images {
+
    font-size: 14pt;
height: 30px;
+
    letter-spacing: 2px;
}
+
    line-height: 1.7em;
+
}
        h3 {
+
            font-size: 20pt;
+
            margin-left: 270px;
+
        }
+
  
        h6 {
+
#div-acknowledgements ul {
            font-size: 20pt;
+
    margin-right: auto;
            margin-left: 670px;
+
    margin-left: auto;
            margin-top: 11px;
+
    text-align: center;
margin-bottom: 0px;
+
}
            font-family: "Arial",Gadget,sans-serif;
+
            font-weight: bold;
+
        }    
+
  
        /* Footnotes (References) */
+
#div-acknowledgements {
 +
    margin-bottom: 30px;
 +
}
  
        small {
+
#companies {
            margin-left: 125px;
+
    max-width: 930px;
            margin-top: 25px;
+
}
        }
+
  
        /* Classes */
+
#school {
 +
    max-width: 1000px;
 +
}
  
        .description {
+
#launch {
            margin-top: 200px;
+
    max-width: 752px;
            min-width: 970px;
+
}
        }
+
  
        .border {
+
#companies img {
            border-bottom: 1px black;
+
    margin-bottom: 20px;
        }
+
}
  
        .image {  
+
#school img {
          position: relative;  
+
    margin-bottom: 30px;
          width: 100%; /* for IE 6 */
+
}
        }
+
  
        .pull-right {
+
/* creates a solid gray border between elements of navigational element */
            float: right !important;
+
.borderRight {
            margin-left: -28px;
+
border-right: 2px solid #A8A8A8;
        }
+
}
  
        .pull-left {
+
.borderLeft {
            float: left !important;
+
border-left: 2px solid #A8A8A8;
        }
+
}
  
        /* Pushed class actives */
+
.borderRight {
        #img-more.pushed {
+
border-bottom: 4px solid #A8A8A8;
            box-shadow: inset 1px 1px 1px 2px rgba(0, 0, 0, .3);
+
}
        }
+
  
        #div-navResized.pushed {
+
.borderBoth {
            display: block;
+
border-left: 2px solid #A8A8A8;
        }
+
border-right: 2px solid #A8A8A8;
 +
}
  
        #div-navResized.pushed a:hover {
+
/* Pushed class actives */
            text-decoration: underline;
+
#img-more.pushed {
        }
+
    box-shadow: inset 1px 1px 1px 2px rgba(0, 0, 0, .3);
 +
}
  
        nav.pushed {
+
#div-navResized.pushed {
            height: 100%;
+
    display: block;
        }
+
}
  
        body.pushed {
+
#div-navResized.pushed a:hover {
            overflow-y: hidden;
+
    opacity: .7;   
        }
+
    text-decoration: none;
 +
}
  
        nav img.pushed {
+
nav.pushed {
            display: none;
+
    height: 100%;
        }
+
}
  
        /* Hides nav bar when scrolling */
+
body.pushed {
        .scrolled {
+
    overflow-y: hidden;
            font-size: 10pt;
+
}
            line-height: 20px;
+
        }
+
  
        /* animation when mouse is over Navbar */
+
nav img.pushed {
        .hover {
+
    display: none;
            font-size: 20pt;
+
}
            line-height: 40px;
+
        }
+
  
        /* Images */
+
/* Hides nav bar when scrolling */
 +
.scrolled {
 +
    font-size: 10pt;
 +
    line-height: 20px;
 +
}
  
        /* Logo */
+
/* animation when mouse is over Navbar */
        #img-logo {
+
.hover {
            width: 260px;
+
    font-size: 20pt;
            float: left;
+
    line-height: 40px;
            position: fixed;
+
}
            margin-top: 4px;
+
            margin-left: 65px;
+
            opacity: 1.0;
+
        }
+
  
        /* iGEM logo */
+
/* Images */
        #img-igemlogo {
+
            width: 60px;
+
            float: right;
+
            position: fixed;
+
            margin-top: 1px;
+
            opacity: 1.0;
+
        }
+
  
        /* More Icon */
+
/* Logo */
        #img-more {
+
#img-logo {
            position: fixed;
+
    width: 260px;
            display: none;
+
    float: left;
            width: 50px;
+
    position: fixed;
            height: 50px;
+
    margin-top: 4px;
            margin-right: 0px;
+
    margin-left: 65px;
            right: 15px;
+
    opacity: 1.0;
            z-index: 2;
+
}
            margin-top: -11px;
+
        }
+
  
        #img-UMD {
+
/* More Icon */
            z-index: -999;
+
#img-more {
            margin-left: -8px;
+
    position: fixed;
            margin-top: -12px;
+
    display: none;
            height: 600px;
+
    width: 50px;
        }
+
    height: 50px;
 +
    margin-right: 0px;
 +
    right: 15px;
 +
    z-index: 2;
 +
    margin-top: 12px;
 +
}
  
        /* Logos when more button is clicked */
+
/* Logo when more button is clicked */
  
        #img-logoResized {
+
#img-logoResized {
            width: 300px;
+
    width: 300px;
            display: block;
+
    display: block;
            margin-right: auto;
+
    margin-right: auto;
            margin-left: auto;
+
    margin-left: auto;
            margin-top: -165px;
+
    margin-top: -160px;
        }
+
}
     
+
        .centered {
+
            margin-left:auto;
+
            margin-right:auto;
+
width: 1200px;
+
            text-align: left;
+
        }
+
       
+
#table-pictures p {
+
text-align: center;
+
font-size: 14pt;
+
}
+
+
#table-pictures {
+
background-color: #F0F0F0;
+
            margin-right: auto;
+
            margin-left: auto;
+
}
+
+
.center {
+
margin-top: 80px;
+
text-align: center;
+
}
+
+
.thumbnail {
+
width: 256px;
+
}
+
+
#lightgallery {
+
width: 800px;
+
margin-left: auto;
+
margin-right: auto;
+
}
+
  
        #lightgallery img {
+
/* Sponsors */
            margin-top: 1px;
+
            margin-right: -2px;
+
        }
+
  
        #lightgallery a:hover {
+
#img-Qiagen {
            text-decoration: none;
+
    height: 120px;
        }
+
}
+
 
#h2-pic1, #h2-pic2 {
+
#img-IDT {
margin-top: 80px;
+
    height: 75px;
margin-bottom: 50px !important;
+
}
            font-family: 'Lora', serif;
+
 
            font-weight: normal;
+
#img-NEB {
}
+
    height: 105px;
</style>
+
}
        <script>
+
 
/* Hiding stupid stuff*/
+
#img-Edge, #img-CMNS {
$(document).ready(function() {
+
    height: 70px;
                $('#top_title').css('display', 'none');
+
}
$('#top_menu').css('display', 'none');
+
 
//$('#top_menu_14').css('display', 'none');
+
#img-IBBR, #img-ILS {
                $('#HQ_page').css('display', 'none');
+
    height: 100px;
$('#top_menu_under').css('display', 'none');
+
        });
+
 
$('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code
+
/* Classes */
$('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr');
+
 
</script>
+
.centered {
 +
    margin-right: auto;
 +
    text-align: center;
 +
}
 +
 
 +
.clickImage {
 +
width: 200px;
 +
height: 128px;
 +
margin-right:0px;
 +
margin-left: auto;
 +
border: 4px solid #FEFFFA;
 +
}
 +
 
 +
#table-advisors, #table-students {
 +
margin-top: 50px;
 +
width: 420px;
 +
margin-left: auto;
 +
margin-right: 0px;
 +
}
 +
 
 +
.clickImageSmall {
 +
display: none;
 +
width: 80px;
 +
height: 50px;
 +
}
 +
 
 +
.clickImageSmallS {
 +
display: none;
 +
width: 80px;
 +
height: 50px;
 +
}
 +
 
 +
.clickImageSmall, .clickImageS, .clickImageSmallS:hover {
 +
cursor: pointer;
 +
}
 +
 
 +
.nospacing {
 +
width: 80px;
 +
padding: 0 0 0 0;
 +
margin: 0 0 0 0;
 +
}
 +
 
 +
 
 +
.clickImageS  {
 +
width: 150px;
 +
}
 +
 
 +
.navigator {
 +
background-color: #FEFFFA;
 +
}
 +
 
 +
#div-content {
 +
display: block;
 +
min-width: 960px;
 +
max-width: 1035px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
}
 +
 
 +
.thanks {
 +
font-size: 14pt;
 +
font-weight: 800;
 +
text-align: center;
 +
margin-left:auto;
 +
margin-right:auto;
 +
max-width:752px;
 +
}
 +
 
 +
#launch li {
 +
white-space: nowrap;
 +
}
 +
 
 +
#otherPeople li {
 +
    list-style: none; 
 +
    font-size: 10pt;
 +
    letter-spacing: 2px;
 +
    line-height: 1.7em;
 +
}
 +
 
 +
</style>
 +
 
 +
<body>
 
<nav>
 
<nav>
<img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo">
+
<img src="https://static.igem.org/mediawiki/2016/2/26/T--UMaryland--newlogo.jpeg" id="img-logo" >
<a href="https://2016.igem.org/Main_Page">
+
</a>
+
 
<ul>
 
<ul>
 
<a style="opacity: 0">Fix</a>
 
<a style="opacity: 0">Fix</a>
Line 525: Line 513:
 
</ul>
 
</ul>
 
</div>
 
</div>
<div id="div-title" class="image">
+
<!-- For nav bar scrolling + hovering -->
<div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/8/85/T--UMaryland--meetup.jpeg" id="img-UMD">
+
<script>
                </div>
+
// Animation over top nav bar when mouse hovers
<h1 id="h1"><span>2nd Annual Mid-Atlantic Mini-Jamboree</span> </h1>
+
$('nav').mouseover(
                <h1-2><br/><br/><br/><br/><span>July 22nd, 2016</span></h1-2>  
+
function () {
 +
$('#img-logo').css('transition', '.35s ease-in');
 +
$('#img-logo').css('opacity', '1');
 +
$('nav ul').addClass("hover");
 +
}
 +
),
 +
$('nav').mouseout(
 +
function () {
 +
var scroll = $(window).scrollTop();
 +
if (scroll > 0) {if ( $(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
 +
$('#img-logo').css('transition', '.25s ease');
 +
$('#img-logo').css('opacity', '0');
 +
$('nav ul').removeClass("hover");
 +
$('nav').css('transition', '.5s ease');
 +
}}}
 +
 
 +
}
 +
),
 +
// Window width effect on top nav bar
 +
$(document).ready(function() {   
 +
            function checkSponsors() {
 +
                if ($(window).width() < 788){
 +
                    $('#img-Edge').css('margin-top', '33px');
 +
                    $('#img-Medimmune').css('margin-top', '-10px');                   
 +
                    if ($(window).width() < 563){
 +
                        $('#img-Edge').css('margin-top', '0px');     
 +
                        $('#img-Medimmune').css('margin-top', '-40px');                           
 +
                    }
 +
                } else {
 +
                    $('#img-Edge').css('margin-top', '0px');
 +
                    $('#img-Medimmune').css('margin-top', '-10px');                   
 +
                }
 +
}   
 +
function checkWidth() {
 +
if ($(window).width() < 980 || $('nav').hasClass('pushed')){
 +
$('nav li').css('display', 'none');
 +
$('#img-more').css('display','block');
 +
$('nav ul').addClass("hover");
 +
$('#img-logo').css('transition', '.35s ease-in');
 +
$('#img-logo').css('opacity', '1');
 +
} else {
 +
$('nav li').css('display', 'inline');
 +
$('#img-more').css('display','none');
 +
$('nav ul').removeClass("hover");
 +
if ($(window).scrollTop() > 0) {
 +
$('#img-logo').css('transition', '.25s ease');
 +
$('#img-logo').css('opacity', '0');
 +
$('nav ul').addClass("scrolled");
 +
}
 +
}
 +
}
 +
            //Page specific
 +
            function headerFontSize() {
 +
if ($(window).width() < 645){
 +
                    $('th p').css('font-size', '5vw');
 +
} else {
 +
                    $('th p').css('font-size', '24pt');
 +
}
 +
}
 +
           
 +
// Execute on load
 +
    checkWidth();
 +
            headerFontSize();
 +
            checkSponsors();
 +
    // Bind function to window resize
 +
    $(window).resize(checkWidth);
 +
    $(window).resize(headerFontSize);
 +
    $(window).resize(checkSponsors);
 +
});
 +
// Resized nav bar effect when more icon is clicked
 +
$('#img-more').click(function() {
 +
$('#img-more').toggleClass('pushed');
 +
$('#div-navResized').toggleClass('pushed');
 +
$('nav').toggleClass('pushed');
 +
$('nav img').toggleClass('pushed');
 +
$('body').toggleClass('pushed');
 +
if ($(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
 +
$('nav li').css('display', 'inline');
 +
$('#img-more').css('display','none');
 +
$('nav ul').removeClass("hover");
 +
$('#img-logo').css('transition', '.25s ease');
 +
$('#img-logo').css('opacity', '0');
 +
}}
 +
});
 +
// Scrolling animation for top nav bar
 +
var nav = $('nav ul');
 +
$(window).scroll(function() {
 +
var scroll = $(window).scrollTop();
 +
if (scroll > 0) { if ( $(window).width() >= 980) {
 +
nav.addClass("scrolled");
 +
nav.removeClass("hover");
 +
$('#img-logo').css('transition', '.25s ease');
 +
$('#img-logo').css('opacity', '0');
 +
}} else {
 +
nav.removeClass("scrolled");
 +
$('#img-logo').css('transition', '.35s ease-in');
 +
$('#img-logo').css('opacity', '1');
 +
}
 +
});
 +
</script>
 +
<div id="div-background" data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/6/66/T--UMaryland--teampic.jpeg" >  
 +
<h1 id="h1-header">Our Team</h1>
 +
<h3 id="h3-header">UMaryland iGEM was founded in 2014 and won two gold medals since its founding. Composed of undergraduate students under the advising of graduate mentors and faculty members, UMaryland iGEM aims to train new scientists in the field of synthetic biology and to apply their knowledge in solving major local and global issues.</h3>
 
</div>
 
</div>
    <div class="centered">
+
<div class="follow">
<div id="Info" style="text-align: center">
+
<table id="table-selector"> <!-- Table of navigational links -->
<p class="pInfo"> UMaryland iGEM founded the first Mid-Atlantic Meet-up and hosted
+
<thead>
four other teams: UVA, William and Mary, Duke, and Rock Ridge High School.
+
<!-- .border classes signify where border needs to be drawn -->
Each team gave a 25 minute presentation of their project followed by a Q&A
+
<!-- navigator class trigger javascript on that element    -->
with the audience. We were also fortunate enough to have Special Agent
+
<!-- data-select attribute sends to script which element    -->
Edward You of the FBI and UMD Professor Raymond St. Leger as guest speakers.</p>
+
<!-- was clicked -->
<p class="pInfo">This year we included more iGEM teams in the Mid Atlantic Area hosting the University of Pittsburgh, the US Naval Academy, the College of Willam and Mary, and University of Virginia iGEM Teams. We shared ideas and received feedback about ours projects during our discussion session. We were joined by guest speakers Dr. Eli Groban and Dr. Ganesh Sriram with opening remarks by Dr. Edward Eisenstein and closing remarks by Anna Sifuentes.</p>
+
<th class="borderRight navigator" id="th-students" data-select="students"><p>Students</p></th>
<p class="pInfo center">Thank you to everyone who participated!</p>
+
<th class="borderBoth navigator" id="th-advisors" data-select="advisors"><p>Advisors</p></th>
</div>
+
<th class="borderLeft navigator" id="th-acknowledgements" data-select="acknowledgements"><p>Acknowledgements</p></th>
<div id="div-participants">
+
</thead>
<table id="table-pictures">
+
<tbody>
+
<tr>
+
<td>
+
<img src="https://static.igem.org/mediawiki/2016/3/3a/T--UMaryland--WM.jpeg" width="240px" />
+
<a href="https://2016.igem.org/Team:William_and_Mary" target="_blank"><p>William & Mary</p></a>
+
</td>
+
<td>
+
<img src="https://static.igem.org/mediawiki/2016/2/22/T--UMaryland--UPitt.jpeg" width="240px" />
+
<a href="https://2016.igem.org/Team:Pittsburgh" target="_blank"><p>University of Pittsburgh</p></a>
+
</td>
+
<td>
+
<img src="https://static.igem.org/mediawiki/2016/d/d7/T--UMaryland--USNA.jpeg" width="240px" />
+
<a href="https://2016.igem.org/Team:USNA-Annapolis" target="_blank"><p>US Naval Academy</p></a>
+
</td>
+
<td>
+
<img src="https://static.igem.org/mediawiki/2016/1/16/T--UMaryland--UVA.jpeg" width="240px" />
+
<a href="https://2016.igem.org/Team:Virginia" target="_blank"><p>University of Virginia</p></a>
+
</td>
+
</tr>
+
</tbody>
+
 
</table>
 
</table>
</div>
+
<div id="div-content">
<div id="Speakers" class="bios">
+
<div id="div-students" class="profiles">
<h2 id="h2-pic1"> Speakers </h2>
+
<style>
        <ul id="ul-images" class = "centered">
+
.table-container {
<li><img src="https://static.igem.org/mediawiki/2016/0/0b/T--UMaryland--GaneshSriram.jpg" id="img-speaker1" data-select="ganesh"/></li>
+
width: 460px;
<li><img src="https://static.igem.org/mediawiki/2016/c/c8/T--UMaryland--EliGroban.jpg" id="img-speaker2" data-select="eli"/></li>
+
height: 450px;
</ul>
+
margin-left: auto;
        <div id="descriptions">
+
margin-right: 0px;
<div id="div-ganesh" class="description">
+
}
<h3> Dr. Ganesh Sriram</h3>
+
<p> Dr. Ganesh Sriram is a professor in the Department of Chemical and Biomolecular Engineering and an Affiliate Faculty Member in the Bioengineering and Plant Biology graduate programs at UMD. He has earned his B.S. and M.S degrees in Chemical Engineering from the Indian Institute of Technology in Bombay, and received his Ph.D. in chemical engineering from Iowa State University. His current research pertains to metabolic engineering and systems biology, especially of eukaryotes.<sup>1</sup></p>
+
#table-navigatorS, #table-navigator {
<small>1. Bio from http://www.ench.umd.edu/faculty/sriram</small>
+
margin-right: 0px;
 +
margin-left: auto;
 +
}
 +
 +
#table-students img, #table-advisors img {
 +
margin-left: auto;
 +
margin-right: 0px;
 +
}
 +
</style>
 +
<div id="student-container" class="table-container">
 +
<table id="table-students">
 +
<tbody>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/1/1b/T--UMaryland--chaoyang.jpg" class="clickImageS" id="wang" data-select="chaoyang"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/7/74/T--UMaryland--chunmun.jpg" class="clickImageS" id="loke" data-select="chunmun"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/4/47/T--UMaryland--nancy.jpg" class="clickImageS" id="zhang" data-select="nancy"></td>
 +
</tr>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--maria.jpg" class="clickImageS" id="novitskaya" data-select="maria"></td>
 +
 +
<td><img src="https://static.igem.org/mediawiki/2016/e/e2/T--UMaryland--seth.jpg" class="clickImageS" id="cohen" data-select="seth"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/8/8f/T--UMaryland--sangho.jpg" class="clickImageS" id="jee" data-select="sangho"></td>
 +
</tr>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/0/0d/T--UMaryland--ben.png" class="clickImageS" id="walton" data-select="ben"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/3/3d/T--UMaryland--jacob.png" class="clickImageS" id="premo" data-select="jacob"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/8/8b/T--UMaryland--subhashini.jpg" class="clickImageS" id="arumugam" data-select="subhashini"></td>
 +
</tr>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/e/e6/T--UMaryland--paula.jpeg" class="clickImageS" id="kleyman" data-select="paula"></td>
 +
</tr>
 +
</tbody>
 +
</table>
 +
<table id="table-navigatorS">
 +
<tbody>
 +
<tr>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/1/1b/T--UMaryland--chaoyang.jpg" class="clickImageSmallS" id="chaoyangSmall" data-select="chaoyang" data-id="wang" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/7/74/T--UMaryland--chunmun.jpg" class="clickImageSmallS" id="chunmunSmall" data-select="chunmun" data-id="loke" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/4/47/T--UMaryland--nancy.jpg" class="clickImageSmallS" id="nancySmall" data-select="nancy" data-id="zhang" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--maria.jpg" class="clickImageSmallS" id="mariaSmall" data-select="maria" data-id="novitskaya" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/e/e2/T--UMaryland--seth.jpg" class="clickImageSmallS" id="sethSmall" data-select="seth" data-id="cohen" ></td>
 +
</tr>
 +
<tr>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/8/8f/T--UMaryland--sangho.jpg" class="clickImageSmallS" id="sanghoSmall" data-select="sangho" data-id="jee" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/0/0d/T--UMaryland--ben.png" class="clickImageSmallS" id="benSmall" data-select="ben" data-id="walton" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/3/3d/T--UMaryland--jacob.png" class="clickImageSmallS" id="jacobSmall" data-select="jacob" data-id="premo" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/8/8b/T--UMaryland--subhashini.jpg" class="clickImageSmallS" id="subhashiniSmall" data-select="subhashini" data-id="arumugam" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/e/e6/T--UMaryland--paula.jpeg" class="clickImageSmallS" id="paulaSmall" data-select="paula" data-id="kleyman" ></td>
 +
</tr>
 +
</tbody>
 +
</table>
 +
</div>
 +
<div class="descriptions">
 +
<div id="div-subhashini" class="description">
 +
<h2>Subhashini Arumugam</h2>
 +
<p>Subhashini Arumugam is a freshman bioengineering major that aspires to go to medical school someday. Besides science, she is very interested in learning languages, writing, and political activism. She is also very passionate about dance, yoga, making breakfast, and taking naps. She hopes to gain research experience and exposure to the many facets of synthetic biology through iGEM, and looks forward to contributing to the team's outreach projects.</p>
 +
</div>
 +
<div id="div-jacob" class="description">
 +
<h2>Jacob Premo</h2>
 +
<p>Jacob Premo is a freshman currently majoring in biochemistry and microbiology. He joined the UMaryland iGEM team in hopes of working with his peers on meaningful and unique research topics. After his undergraduate career, Jacob plans to pursue a PhD which he would like to put to use developing new medicines. Outside of his academic and research life Jacob enjoys reading books and watching sports.</p>
 +
</div>
 +
<div id="div-ben" class="description">
 +
<h2>Ben Walton</h2>
 +
<p>Ben is a rising sophomore pursuing a double-degree in Mechanical Engineering and Computer Science. At this point in college, he still does not know his career path, but hopes that the experience of iGEM will help to give him some ideas. Outside of school, Ben can be found playing cards or board games with friends, reading, or slack-lining. Very recently, he has developed an interest in snorkeling and scuba diving.</p>
 +
</div>
 +
<div id="div-sangho" class="description">
 +
<h2>SangHo Jee</h2>
 +
<p>SangHo is a freshman biochemistry and neurobiology & physiology double major in the Integrated Life Sciences program, who primarily joined iGEM to work on their wiki and website design, while gaining exposure to how the wet labs work. He hopes to one day attend medical school in the future but is interested in research as well. Outside of iGEM he enjoys web programming, reading the news, and playing video games.</p>
 +
</div>
 +
<div id="div-seth" class="description">
 +
<h2>Seth Cohen</h2>
 +
<p>Seth is a freshman biochemistry major at the University of Maryland. Outside of science his favorite things to do are play basketball and write fiction. His favorite food is probably falafel on pita bread with tomatoes, cucumbers, feta, lettuce, tahini, and hummus. His favorite animal is definitely the elephant. Another kind of interesting fact about him is that he is vegetarian. That's pretty much all you need to know about Seth!<p>
 +
</div>
 +
<div id="div-maria" class="description">
 +
<h2>Maria Novitskaya</h2>
 +
<p>Maria is a rising sophomore Neurobiology and Physiology major. She is passionate about science, friendship, and getting enough sleep. Her likes include the color green, movies and documentaries, and making great guacamole. Her dislikes include getting stuck in traffic, spinach, and writing bios.<p>
 +
</div>
 +
<div id="div-nancy" class="description">
 +
<h2>Nancy Zhang</h2>
 +
<p>Presenting Nancy Zhang! Nancy is a freshman majoring in Neurology & Physiology and is also a part of the ILS program in the Honors College. Aside from her strong focus in science, Nancy has a great passion for art and devotes her spare time to arts, crafts and sculpture, therefore she brings an artistic touch in addition to years of research experience. She hopes to be able to unite different disciplines like engineering, graphic design, and wet lab work in research to help the team create a strong project this year!<p>
 +
</div>
 +
<div id="div-chaoyang" class="description">
 +
<h2>Chaoyang Wang</h2>
 +
<p>Chaoyang is a freshman studying Neurobiology and Physiology with a minor in Music Performance in the Integrated Life Sciences Program. Aspiring to become a surgeon one day, Chaoyang is an Executive Board Member of the American Medical Student Association. He has researched 2 summers at an Adult Stem Cell lab at the NIH and hopes to contribute his lab experience to the iGEM team.</p>
 +
<p>Chaoyang has also recently partaken in an Alternative Spring Break to New York City to join the movement to end the stigma against HIV and AIDS. Outside of academics, he enjoys playing piano and has played in various renowned locales, including Carnegie Hall and the Millennium Stage at the Kennedy Center. Among his many wins are first prize at the 29th annual International Young Artist Piano Competition. Chaoyang also enjoys taking artsy pictures and loves hanging out with friends. <p>
 +
</div>
 +
<div id="div-chunmun" class="description">
 +
<h2>Chun Mun Loke</h2>
 +
<p>Chun Mun Loke (né Descan Aï Rembassa Adéwola Köloe !Xobile) was born in the village of Tokkna in Kenya. Born with jaundice, he has struggled to gain acceptance of his African heritage since birth. At age 3, his parents won the national lottery, earning enough money for a boat to leave Africa. Their intended destination was America, but the monsoon winds blew them off course and they arrived in Singapore.
 +
 
 +
While in Singapore, Loke gained publicity for his performance on the WISC, being the youngest person to score 5 standard deviations over the general mean. He also gained publicity for his skills as an actor, starring as lead roles in the Singaporean feature films Xiao Hai Bu Ben. He decided not to pursue a career in acting, however, declining offers from noteworthy Western producers, due to the lack of opportunity for Asian American actors to succeed in the Hollywood industry.
 +
 
 +
At age 7, he moved to Australia. Nothing interesting happened there, so we'll skip over that part. At age 9, he moved to America. Loke dedicated a majority of his free time (over 15 minutes a day) to honing his piano skills. He won the International Tchaikovsky Competition for his performance of Liszt's Hungarian Rhapsody No. 20. Two years later, he performed the famous P.D.Q. Bach Concerto for Two Pianos vs Orchestra with Lang Lang and the Berlin Philharmonic.
 +
 
 +
Loke has won the Nobel Prize in physics twice, once for experimental procedures disproving the breakdown of classical mechanics at the quantum level and reaffirming Einstein's determininstic description of the Universe, and another time for his discovery of the existance of Bose-Einstein condensate particles exhibiting monopole like qualities. That same year, he also received the Nobel Prize in medicine for his methods of indefinite telomere expansion supplemented by p53 upregulation, achieving long term totiopotency.
 +
 
 +
Unbeknownst to society, Loke has invented a time machine and has been preserving the stability of the world in our timeline. He seeded the Earth during the Cambrian Explosion, implanted a tall, black monolith in prehistoric Africa, taught Fibonacci mathematics, presented blueprints for the printing press to Gutenberg, prevented the advancement of the Cold War into a full nuclear war, developed kill codes to terminate existing LOICs, and forewarned the TLC of First Contact.
 +
 
 +
In order to live a more humble life as Siddhartha Gautama did, Loke sold all his assets and donated all his money to the charities. He now lives in a cardboard box behind the North Campus Diner in the University of Maryland. To supplement his efforts, he teaches introductory chemistry and biology classes. Recently, he has picked up weightlifting. His newest goal is to be able to bench a crate of 420 Kaplan MCAT study guide books.</p>
 +
</div>
 +
<div id="div-paula" class="description">
 +
<h2>Paula Kleyman</h2>
 +
<p>Paula is a rising sophomore studying bioengineering. She hopes to further her studies in graduate school and pursue a career in academia. Her hobbies include long distance running, singing, and playing logic games. On campus she is involved with the Resident Hall Association and is a part of the Integrated Life Sciences living-learning program. She loves dogs, especially corgis, and bunnies, especially Angora rabbits. </p>
 +
</div>
 +
</div>
 
</div>
 
</div>
<div id="div-eli" class="description" style="display: none;">
+
<div id="div-advisors" class="profiles">
<h6> Dr. Eli Groban </h6>
+
<div id="advisors-container" class="table-container">
<p> Dr. Eli Groban is the senior manager of of Bio/Nano Research at Autodesk, and has 6 patent applications on the development of new technologies for engineering proteins, metabolic pathways, and whole microbes. Eli will also be serving as an iGEM judge in the 2016 competition. He received his PhD in Biophysics from the University of California, San Francisco, and his B.A. in Chemistry from Williams College.<sup>2</sup>
+
<table id="table-advisors">
</p>
+
<tbody>
<small>2. Bio from https://www.autodeskresearch.com/people/eli-groban</small>
+
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/d/dd/T--UMaryland--Dr.Eisenstein.png" class="clickImage" id="Eisenstein" data-select="Ed"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--Dr.Kahn.png" class="clickImage" id="Kahn" data-select="Jason"></td>
 +
</tr>
 +
<tr>
 +
<td><img src="https://static.igem.org/mediawiki/2016/9/91/T--UMaryland--Dr.Quimby.png" class="clickImage" id="Quimby" data-select="Boots"></td>
 +
<td><img src="https://static.igem.org/mediawiki/2016/6/6b/T--UMaryland--Naren.jpeg" class="clickImage" id="Bhokisham" data-select="Naren"></td>
 +
</tr>
 +
</tbody>
 +
</table>
 +
<table id="table-navigator">
 +
<tbody>
 +
<tr>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/d/dd/T--UMaryland--Dr.Eisenstein.png" class="clickImageSmall" id="EdSmall" data-select="Ed" data-id="Eisenstein" ></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/a/ae/T--UMaryland--Dr.Kahn.png" class="clickImageSmall" id="JasonSmall" data-select="Jason" data-id="Kahn"></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/9/91/T--UMaryland--Dr.Quimby.png" class="clickImageSmall" id="BootsSmall" data-select="Boots" data-id="Quimby"></td>
 +
<td class="nospacing"><img src="https://static.igem.org/mediawiki/2016/6/6b/T--UMaryland--Naren.jpeg" class="clickImageSmall" id="NarenSmall" data-select="Naren" data-id="Bhokisham"></td>
 +
</tr>
 +
</tbody>
 +
</table>
 +
</div>
 +
<div class="descriptions">
 +
<div id="div-Ed" class="description">
 +
<h2>Dr. Edward Eisenstein</h2>
 +
<p> Edward Eisenstein is a Fellow in the Institute for Bioscience and
 +
Biotechnology Research and an Associate Professor in the Fischell Department
 +
of Bioengineering at the University of Maryland. Trained in modern structural
 +
enzymology, his current research interests are focused on protein and biosystem
 +
engineering for discovery and application in plants and microorganisms.
 +
</p>
 +
</div>
 +
<div id="div-Jason" class="description">
 +
<h2>Dr. Jason Kahn</h2>
 +
<p> Jason D. Kahn is a biophysical chemist who studies protein-nucleic acid
 +
interaction and engineering. He is best known for studies of DNA looping,  
 +
bending, twisting, and cyclization, as well as hybridization thermodynamics
 +
for modified bases. He teaches a variety of chemistry, biochemistry, and
 +
molecular biology courses, which he credits for initiating his interest in
 +
synthetic biology. Dr. Kahn was a graduate student at UC Berkeley and a
 +
post-doc at Yale before coming to Maryland in 1994.
 +
</p>
 +
</div>
 +
<div id="div-Boots" class="description">
 +
<h2>Dr. Booth "Boots" Quimby</h2>
 +
<p> Dr. Quimby is Associate Director of the Integrated Life Sciences
 +
honors program in the Honors College at the University of Maryland.
 +
Prior to joining the Department of Cell Biology and Molecular Genetics
 +
at UMD as a full-time instructor, she earned her Master's of Arts in  
 +
teaching from the University of South Carolina, after which she taught
 +
high school science in Atlanta, Georgia for eight years. She then returned
 +
to graduate school and received her doctorate in genetics and molecular biology
 +
from Emory University.
 +
</p>
 +
</div>
 +
<div id="div-Naren" class="description">
 +
<h2>Naren Bhokisham</h2>
 +
<p> Naren is a Graduate Student in Molecular and Cell Biology at the University of Maryland, College Park. He received his undergraduate degree in Industrial Biotechnology from St. Joseph’s College of Engineering, Anna University, India. He works in the intersection of synthetic biology, metabolic engineering and biomaterials, involving assembly of enzyme cascades on various interfaces to generate small molecules and engineering microbes to display novel phenotypes in response to small molecules. Apart from science, his pursuits include traveling, running and latin dancing.
 +
</p>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
<div id="div-acknowledgements" class="profiles">
 +
<ul id="companies">
 +
<li> <img src="https://static.igem.org/mediawiki/2016/7/79/T--UMaryland--Qiagen.jpg" id="img-Qiagen"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/6/67/Idt_logo.png" id="img-IDT"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/4/44/T--Pittsburgh--SponsorsNEB.jpg" id="img-NEB"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/1/1e/T--UMaryland--EdgeBio.jpg" id="img-Edge"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/a/a7/T--UMaryland--MedImmune.jpg" id="img-Medimmune"/></li>
 +
</ul>
 +
<ul id="school">
 +
<li> <img src="https://static.igem.org/mediawiki/2016/d/d8/T--UMaryland--Clark.jpg" id="img-Clark"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/f/fd/T--UMaryland--CMNS2.jpg"id ="img-CMNS"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/1/1b/T--UMaryland--IBBR.jpg" id="img-IBBR"/></li>
 +
<li> <img src="https://static.igem.org/mediawiki/2016/a/aa/T--UMaryland--ILS.jpg" id="img-ILS"/></li>
 +
</ul>
 +
<p class="thanks"> We would like to thank everyone who donated to our Launch campaign, especially: </p>
 +
<ul id="launch" style="text-align: justify;">
 +
<li> Ana Cohen </li>
 +
<li> Dan and Rita Premo </li>
 +
<li> Teresa McTigue </li>
 +
<li> John Kuffner </li>
 +
<li> Natalia Novitskaya </li>
 +
<li> Khing Loke </li>
 +
<li> Tyson Slocum </li>
 +
<li> Jenny Yang </li>
 +
<li> Pandoor Arumugam </li>
 +
<li> Suchitra and Jayanth Banavar </li>
 +
<li> Lawrence Rutledge </li>
 +
<li> Raymond St. Leger </li>
 +
<li> Ed Eisenstein </li>
 +
<li> Tassia Kolesnikow </li>
 +
<li> Tong Guo </li>
 +
<li> Bertha Reyes </li>
 +
<li> Byrne Quimby </li>
 +
<li> Qiang Yang </li>
 +
<li> Alexandra Cohen </li>
 +
<li> Liangwei Wang </li>
 +
<li> Xinfeng Lu </li>
 +
</ul>
 +
<p class="thanks"> Thank you to all who made this year possible: </p>
 +
<ul id="otherPeople">
 +
<li> Dr. Francis Cunningham, UMD Department of Cell Biology and Molecular Genetics (CBMG) </li>
 +
<li> Cierra Clinkscales, UMD Institute of Bioscience and Biotechnology Research (IBBR) </li>
 +
<li> Dr. Ganesh Sriram, UMD Fischell Department of Bioengineering (BIOE) </li>
 +
<li> Tom O’Dougherty, Baltimore Port Discovery Children’s Museum </li>
 +
<li> Dr. Darryll J. Pines, UMD Clark School of Engineering</li>
 +
<li> Jennifer Schwartz, UMD Clark School of Engineering </li>
 +
<li> Heather Medina, UMD Clark School of Engineering </li>
 +
<li> Ben Woodard, UMD Bioprocess Scale-Up Facility </li>
 +
<li> Shelly Chamness, Howard County Public Schools </li>
 +
<li> Dr. Robert Infantino, UMD Department of Biology </li>
 +
<li> John Wilhelm III, Integrated DNA Technologies </li>
 +
<li> William E. Bentley Lab, UMD BIOE, IBBR </li>
 +
<li> Danielle Curtis, UMD Department of Art </li>
 +
<li> Dr. Angus Murphy, UMD Plant Sciences </li>
 +
<li> Lai-Xi Wang Lab, UMD Biochemistry </li>
 +
<li> Dr. Ian White, UMD BIOE </li>
 +
<li> Dr. Eli Groban, Autodesk </li>
 +
 
 +
</ul>
 
</div>
 
</div>
</div>
+
    </div>
</div>
+
<h2 id="h2-pic2">Pictures</h2>
+
<div id="lightgallery">
+
  <a href="https://static.igem.org/mediawiki/2016/e/e4/T--UMaryland--meetup1.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/e/e8/T--UMaryland--meetup1th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/1/1a/T--UMaryland--meetup2.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/8/87/T--UMaryland--meetup2th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/a/a3/T--UMaryland--meetup3.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/c/c3/T--UMaryland--meetup3th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/7/7c/T--UMaryland--meetup4.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/f/f4/T--UMaryland--meetup4th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/3/3b/T--UMaryland--meetup5.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/a/a6/T--UMaryland--meetup5th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/5/55/T--UMaryland--meetup6.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/f/f1/T--UMaryland--meetup6th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/c/c1/T--UMaryland--meetup7.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/f/f0/T--UMaryland--meetup7th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/5/5a/T--UMaryland--meetup8.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/1/16/T--UMaryland--meetup8th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/3/38/T--UMaryland--meetup9.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/e/e2/T--UMaryland--meetup9th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/1/18/T--UMaryland--meetup10.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/b/bb/T--UMaryland--meetup10th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/1/19/T--UMaryland--meetup11.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/6/6f/T--UMaryland--meetup11th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/7/7d/T--UMaryland--meetup12.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/3/3b/T--UMaryland--meetup12th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/e/ee/T--UMaryland--meetup13.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/4/49/T--UMaryland--meetup13th.jpg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/5/5e/T--UMaryland--meetup14.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/d/d6/T--UMaryland--meetup14th.jpeg" />
+
  </a>
+
  <a href="https://static.igem.org/mediawiki/2016/5/5a/T--UMaryland--meetup15.jpeg">
+
  <img class="thumbnail" src="https://static.igem.org/mediawiki/2016/4/43/T--UMaryland--meetup15th.jpg" />
+
  </a>
+
</div>
+
    </div>
+
 
     <div id="bot-nav">
 
     <div id="bot-nav">
 
         <div id="container">
 
         <div id="container">
Line 663: Line 906:
 
     font-size: 12pt;
 
     font-size: 12pt;
 
     font-family: 'Lora', serif;
 
     font-family: 'Lora', serif;
    margin-top: 50px;
 
 
     z-index: -1;
 
     z-index: -1;
    min-width: 1200px;
 
 
}
 
}
  
Line 672: Line 913:
 
margin:0 0 0 0;
 
margin:0 0 0 0;
 
}
 
}
 
+
.pull-right a {
.pull-right a {
+
padding-right: 0px !important;
    padding-right: 0px !important;
+
}
}
+
  
 
.copyright {
 
.copyright {
Line 713: Line 953:
 
width: 100%;
 
width: 100%;
 
padding: 0 0 0 0;
 
padding: 0 0 0 0;
margin-top: 2px;
+
margin-top: 0px;
 
float:left;
 
float:left;
 
}
 
}
Line 741: Line 981:
 
padding-right: 25px;
 
padding-right: 25px;
 
}
 
}
 +
  
 
.pull-left {
 
.pull-left {
Line 749: Line 990:
 
     text-decoration: none;
 
     text-decoration: none;
 
     color: black;
 
     color: black;
}
 
 
#contact {
 
    margin-top: -2px;
 
 
}
 
}
  
Line 758: Line 995:
 
     text-shadow: .1px .1px black;
 
     text-shadow: .1px .1px black;
 
}
 
}
 +
  
 
</style>
 
</style>
 +
</body>
 
<script>
 
<script>
 +
var clickedT = '';
 +
var current ='';
 +
var currentT = 'students';
 +
var lastStudents = '';
 +
var lastAdvisors = '';
  
$('.linkText').click( function() { $(this).css('text-decoration','none'); $(this).focusout();});
+
// sets initial display to be purpose
 +
$('.navigator').click( function() { // when any element with .class is clicked, trigger function
 +
var selectedT = $(this).attr('data-select'); // grabs the name of the navigational element clicked
 +
        if (selectedT != currentT) { // only change display / trigger animation if clicking different nav
 +
changeText(selectedT, lastAdvisors, lastStudents)
 +
}
 +
 
 +
})
 +
 +
function changeText(selectedT, lastAdvisors, lastStudents) {
 +
$('.navigator').css('border-bottom','1px solid #A8A8A8'); // make all navigational element have no bottom border
 +
$('#th-' + selectedT).css('border-bottom', '4px solid #A8A8A8'); // the clicked navigational element given border
 +
$('.profiles').css('display','none');
 +
$('#div-' + selectedT).css('margin-left', '60px') // slighly shifts right all text to set up for animation
 +
if (selectedT == 'students') {
 +
            var table1 = '#table-students';
 +
            var table2 = '#table-navigatorS';
 +
        } else if (selectedT == 'advisors') {
 +
            var table1 = '#table-advisors';
 +
            var table2 = '#table-navigator';
 +
        }
 +
        $(table1).css('margin-left', '60px') // slighly shifts right all text to set up for animation
 +
        $(table2).css('margin-left', '60px')
 +
        $('#div-' + selectedT).css('display','block');
 +
var returned = (selectedT == 'advisors') ? lastAdvisors : lastStudents;
 +
$('#div-' + returned).css('display','block');
 +
$('#div-' + selectedT).animate({ marginLeft: '0px'}, 200); // the text is animated to quickly move left
 +
$(table1).animate({ marginLeft: '0px'}, 200);
 +
$(table2).animate({ marginLeft: '0px'}, 200);
 +
currentT = selectedT; // sets the current display
 +
location.hash = currentT;
 +
}
  
// Text animation for speaker bios
+
var dir = location.hash; // grabs the anchor (text following the #)
var current = 'ganesh';
+
var n = dir.indexOf('?'); // and initially sets the page
$('.bios img').click( function() {  
+
dir = dir.substring(0, n != -1 ? n : dir.length);
 +
dir = dir.replace('#','');
 +
if (dir == '') {
 +
dir = 'students';
 +
}
 +
changeText(dir)
 +
 +
$('.profiles .clickImage').click( function() {
 
var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
 
var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
if (selected != current) { // only change display / trigger animation if clicking different nav
+
if (selected != current) {
 +
                var height = $('#div-' + selected).css('height');    // Fixes height of div-content so it covers bios
 +
               
 
$('.description').css('display','none'); // hides all text
 
$('.description').css('display','none'); // hides all text
$('.description').css('margin-left', '60px')
+
$('#div-' + selected).css('margin-left', '60px');
 
$('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
 
$('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
$('#div-' + selected).animate({ marginLeft: '0px'}, 200);
+
$('#div-' + selected).animate({ marginLeft: '0px'}, 400);
current = selected; // sets the current display
+
$('.clickImage').css('display', 'none')
 +
$(this).css('display', 'block');
 +
$(this).parent().attr('colspan', '3');
 +
$(this).animate({ width: '408px', height: '280px'}, 400);
 +
current = selected;
 +
lastAdvisors = current;
 +
$('.clickImageSmall').css('display','inline');
 
}
 
}
 
});
 
});
                $(body).css('display','block');
+
$('.profiles .clickImageSmall').click( function() {
</script>
+
var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
        <!-- For nav bar scrolling + hovering + window resize effects-->
+
var id = $(this).attr('data-id');
<script>
+
if (selected != current) { // only change display / trigger animation if clicking different nav
// Animation over top nav bar when mouse hovers
+
                var height = $('#div-' + selected).css('height');     // Fixes height of div-content so it covers bios
$('nav').mouseover(
+
               
function () {
+
                $('.description').css('display','none'); // hides all text
$('#img-logo').css('transition', '.35s ease-in');
+
$('#div-' + selected).css('margin-left', '60px');
$('#img-logo').css('opacity', '1');
+
$('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
$('#img-igemlogo').css('transition', '.35s ease-in');
+
$('#div-' + selected).animate({ marginLeft: '0px'}, 400);
$('#img-igemlogo').css('opacity', '1');
+
$('.clickImage').css('display', 'none');
$('nav ul').addClass("hover");
+
$('#' + id).css({ 'width': '200px', 'height': '128px' })
}
+
$('#' + id).css('display', 'block');
),
+
$('#' + id).parent().attr('colspan', '3');
$('nav').mouseout(
+
$('#' + id).animate({ width: '408px', height: '280px'}, 400);
function () {
+
current = selected;
var scroll = $(window).scrollTop();
+
lastAdvisors = current;
if (scroll > 0) {if ( $(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
+
$('.clickImageSmall').css('display','inline');
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('opacity', '0');
+
$('#img-igemlogo').css('transition', '.25s ease');
+
$('#img-igemlogo').css('opacity', '0');
+
$('nav ul').removeClass("hover");
+
$('nav').css('transition', '.5s ease');
+
}}}
+
 
+
 
}
 
}
),
+
});
// Window width effect on top nav bar
+
$(document).ready(function() {
+
$('.profiles .clickImageS').click( function() {
function checkWidth() {
+
var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
if ($(window).width() < 980 || $('nav').hasClass('pushed')){
+
if (selected != current) {
$('nav li').css('display', 'none');
+
                $('h1').addClass('clicked');
$('#img-more').css('display','block');
+
$('.description').css('display','none'); // hides all text
$('nav ul').addClass("hover");
+
$('#div-' + selected).css('margin-left', '60px');
$('#img-logo').css('transition', '.35s ease-in');
+
$('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
$('#img-logo').css('opacity', '1');
+
$('#div-' + selected).animate({ marginLeft: '0px'}, 400);
$('#img-igemlogo').css('transition', '.35s ease-in');
+
$('.clickImageS').css('display', 'none');
$('#img-igemlogo').css('opacity', '1')
+
$(this).css('display', 'block');
} else {
+
$(this).parent().attr('colspan', '3');
$('nav li').css('display', 'inline');
+
$(this).animate({ width: '408px', height: '280px'}, 400);
$('#img-more').css('display','none');
+
current = selected;
$('nav ul').removeClass("hover");
+
lastStudents = current;
if ($(window).scrollTop() > 0) {
+
$('.clickImageSmallS').css('display','inline');
$('#img-igemlogo').css('transition', '.25s ease');
+
}
$('#img-igemlogo').css('opacity', '0');
+
});
$('#img-logo').css('transition', '.25s ease');
+
$('.profiles .clickImageSmallS').click( function() {
$('#img-logo').css('opacity', '0');
+
var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
$('nav ul').addClass("scrolled");
+
var id = $(this).attr('data-id');
}
+
if (selected != current) { // only change display / trigger animation if clicking different nav
}
+
                $('.description').css('display','none'); // hides all text
 +
$('#div-' + selected).css('margin-left', '60px');
 +
$('#div-' + selected).animate({ marginLeft: '0px'}, 400);
 +
$('.clickImageS').css('display', 'none');
 +
$('#' + id).css({ 'width': '150px', 'height': '133px' })
 +
$('#' + id).css('display', 'block');
 +
$('#' + id).parent().attr('colspan', '3');
 +
$('#' + id).animate({ width: '408px', height: '280px'}, 400);
 +
$('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
 +
current = selected;
 +
lastStudents = current;
 +
lastClicked = 'students'// sets the current display
 +
$('.clickImageSmallS').css('display','inline');
 
}
 
}
// Execute on load
 
    checkWidth();
 
    // Bind event listener
 
    $(window).resize(checkWidth);
 
 
});
 
});
// Resized nav bar effect when more icon is clicked
+
$('#img-more').click(function() {
+
$('#bars_item').css('display','none');
$('#img-more').toggleClass('pushed');
+
$('#sideMenu').css('display','none');
$('#div-navResized').toggleClass('pushed');
+
$('#iGEM').css('display','block');
$('nav').toggleClass('pushed');
+
</script>
$('nav img').toggleClass('pushed');
+
<script>
if ($(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false){
+
function breakTable() {
$('nav li').css('display', 'inline');
+
var margin = $('#' + current + '-container').css('margin-left');
$('#img-more').css('display','none');
+
if (margin < 460) {
$('nav ul').removeClass("hover");
+
$('#' + currentT + '-container').prepend('<br />')
$('#img-igemlogo').css('transition', '.25s ease');
+
}
$('#img-igemlogo').css('opacity', '0');
+
}
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('opacity', '0');
+
$(window).resize(breakTable);
}}
+
breakTable();
});
+
// Scrolling animation for top nav bar
+
var nav = $('nav ul');
+
$(window).scroll(function() {
+
var scroll = $(window).scrollTop();
+
if (scroll > 0) { if ( $(window).width() >= 980) {
+
nav.addClass("scrolled");
+
nav.removeClass("hover");
+
$('#img-logo').css('transition', '.25s ease');
+
$('#img-logo').css('opacity', '0');
+
$('#img-igemlogo').css('transition', '.25s ease');
+
$('#img-igemlogo').css('opacity', '0');
+
}} else {
+
nav.removeClass("scrolled");
+
$('#img-logo').css('transition', '.35s ease-in');
+
$('#img-logo').css('opacity', '1');
+
$('#img-igemlogo').css('transition', '.35s ease-in');
+
$('#img-igemlogo').css('opacity', '1');
+
}
+
});
+
                 
+
                $(body).css('display','block');
+
 
</script>
 
</script>
 
         <script src="http://pixelcog.github.io/parallax.js/js/parallax.min.js">
 
         <script src="http://pixelcog.github.io/parallax.js/js/parallax.min.js">
 
         </script>
 
         </script>
<script src="http://sachinchoolur.github.io/lightGallery/lightgallery/js/lightgallery.js">
 
</script>
 
<script src="http://sachinchoolur.github.io/lightGallery/lightgallery/js/lg-fullscreen.js">
 
</script>
 
<script src="http://sachinchoolur.github.io/lightGallery/lightgallery/js/lg-thumbnail.js">
 
</script>
 
 
<script>
 
$(document).ready(function() {
 
$("#lightgallery").lightGallery();
 
});
 
</script>
 
</body>
 
 
</html>
 

Revision as of 01:24, 14 September 2016

About Our Team

Our Team

UMaryland iGEM was founded in 2014 and won two gold medals since its founding. Composed of undergraduate students under the advising of graduate mentors and faculty members, UMaryland iGEM aims to train new scientists in the field of synthetic biology and to apply their knowledge in solving major local and global issues.