Difference between revisions of "Team:Emory/Team"

Line 1: Line 1:
 +
{{Team:Emory/Test}}
  
 +
<html lang="en">
 +
    <head>
 +
        <title>Team:Emory iGEM 2017</title>
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
 +
<style>
 +
#content{width:100%}
 +
#bodyContent{width:100%}
 +
#cssmenu{width:100%}
  
 +
/* NAV STYLE*/
 +
*{margin:0px;padding:0;text-decoration:none;}
  
 +
nav{position:relative;width:980px;margin:0px 0px -50px 0px; auto;}
 +
#cssmenu,#cssmenu ul,#cssmenu ul li,#cssmenu ul li a,#cssmenu #head-mobile{border:0;list-style:none;line-height:1;display:block;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
 +
#cssmenu:after,#cssmenu > ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
 +
#cssmenu #head-mobile{display:none}
 +
#cssmenu{font-family:sans-serif;background:#333}
 +
#cssmenu > ul > li{float:left}
 +
#cssmenu > ul > li > a{padding:17px;font-size:12px;letter-spacing:1px;text-decoration:none;color:#ddd;font-weight:700;}
 +
#cssmenu > ul > li:hover > a,#cssmenu ul li.active a{color:#fff}
 +
#cssmenu > ul > li:hover,#cssmenu ul li.active:hover,#cssmenu ul li.active,#cssmenu ul li.has-sub.active:hover{background:#448D00!important;-webkit-transition:background .3s ease;-ms-transition:background .3s ease;transition:background .3s ease;}
 +
#cssmenu > ul > li.has-sub > a{padding-right:30px}
 +
#cssmenu > ul > li.has-sub > a:after{position:absolute;top:22px;right:11px;width:8px;height:2px;display:block;background:#ddd;content:''}
 +
#cssmenu > ul > li.has-sub > a:before{position:absolute;top:19px;right:14px;display:block;width:2px;height:8px;background:#ddd;content:'';-webkit-transition:all .25s ease;-ms-transition:all .25s ease;transition:all .25s ease}
 +
#cssmenu > ul > li.has-sub:hover > a:before{top:23px;height:0}
 +
#cssmenu ul ul{position:absolute;left:-9999px}
 +
#cssmenu ul ul li{height:0;-webkit-transition:all .25s ease;-ms-transition:all .25s ease;background:#333;transition:all .25s ease}
 +
#cssmenu ul ul li:hover{}
 +
#cssmenu li:hover > ul{left:auto;margin:0px;}
 +
#cssmenu li:hover > ul > li{height:35px}
 +
#cssmenu ul ul ul{margin-left:100%;top:0}
 +
#cssmenu ul ul li a{border-bottom:1px solid rgba(150,150,150,0.15);padding:11px 15px;width:170px;font-size:12px;text-decoration:none;color:#ddd;font-weight:400;}
 +
#cssmenu ul ul li:last-child > a,#cssmenu ul ul li.last-item > a{border-bottom:0}
 +
#cssmenu ul ul li:hover > a,#cssmenu ul ul li a:hover{color:#fff}
 +
#cssmenu ul ul li.has-sub > a:after{position:absolute;top:16px;right:11px;width:8px;height:2px;display:block;background:#ddd;content:''}
 +
#cssmenu ul ul li.has-sub > a:before{position:absolute;top:13px;right:14px;display:block;width:2px;height:8px;background:#ddd;content:'';-webkit-transition:all .25s ease;-ms-transition:all .25s ease;transition:all .25s ease}
 +
#cssmenu ul ul > li.has-sub:hover > a:before{top:17px;height:0}
 +
#cssmenu ul ul li.has-sub:hover,#cssmenu ul li.has-sub ul li.has-sub ul li:hover{background:#363636;}
 +
#cssmenu ul ul ul li.active a{border-left:1px solid #333}
 +
#cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active> a{border-top:1px solid #333}
  
<!DOCTYPE html>
+
@media screen and (max-width:700px){
<html lang="en">
+
.logo{position:absolute;top:0;left: 0;width:100%;height:46px;text-align:center;padding:10px 0 0 0 ;float:none}
 +
.logo2{display:none}
 +
nav{width:100%;}
 +
#cssmenu{width:100%}
 +
#cssmenu ul{width:100%;display:none}
 +
#cssmenu ul li{width:100%;border-top:1px solid #444}
 +
#cssmenu ul li:hover{background:#363636;}
 +
#cssmenu ul ul li,#cssmenu li:hover > ul > li{height:auto}
 +
#cssmenu ul li a,#cssmenu ul ul li a{width:100%;border-bottom:0}
 +
#cssmenu > ul > li{float:none}
 +
#cssmenu ul ul li a{padding-left:25px}
 +
#cssmenu ul ul li{background:#333!important;}
 +
#cssmenu ul ul li:hover{background:#363636!important}
 +
#cssmenu ul ul ul li a{padding-left:35px}
 +
#cssmenu ul ul li a{color:#ddd;background:none}
 +
#cssmenu ul ul li:hover > a,#cssmenu ul ul li.active > a{color:#fff}
 +
#cssmenu ul ul,#cssmenu ul ul ul{position:relative;left:0;width:100%;margin:0;text-align:left}
 +
#cssmenu > ul > li.has-sub > a:after,#cssmenu > ul > li.has-sub > a:before,#cssmenu ul ul > li.has-sub > a:after,#cssmenu ul ul > li.has-sub > a:before{display:none}
 +
#cssmenu #head-mobile{display:block;padding:23px;color:#ddd;font-size:12px;font-weight:700}
 +
.button{width:55px;height:46px;position:absolute;right:0;top:0;cursor:pointer;z-index: 12399994;}
 +
.button:after{position:absolute;top:22px;right:20px;display:block;height:4px;width:20px;border-top:2px solid #dddddd;border-bottom:2px solid #dddddd;content:''}
 +
.button:before{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;position:absolute;top:16px;right:20px;display:block;height:2px;width:20px;background:#ddd;content:''}
 +
.button.menu-opened:after{-webkit-transition:all .3s ease;-ms-transition:all .3s ease;transition:all .3s ease;top:23px;border:0;height:2px;width:19px;background:#fff;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}
 +
.button.menu-opened:before{top:23px;background:#fff;width:19px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}
 +
#cssmenu .submenu-button{position:absolute;z-index:99;right:0;top:0;display:block;border-left:1px solid #444;height:46px;width:46px;cursor:pointer}
 +
#cssmenu .submenu-button.submenu-opened{background:#262626}
 +
#cssmenu ul ul .submenu-button{height:34px;width:34px}
 +
#cssmenu .submenu-button:after{position:absolute;top:22px;right:19px;width:8px;height:2px;display:block;background:#ddd;content:''}
 +
#cssmenu ul ul .submenu-button:after{top:15px;right:13px}
 +
#cssmenu .submenu-button.submenu-opened:after{background:#fff}
 +
#cssmenu .submenu-button:before{position:absolute;top:19px;right:22px;display:block;width:2px;height:8px;background:#ddd;content:''}
 +
#cssmenu ul ul .submenu-button:before{top:12px;right:16px}
 +
#cssmenu .submenu-button.submenu-opened:before{display:none}
 +
#cssmenu ul ul ul li.active a{border-left:none}
 +
#cssmenu > ul > li.has-sub > ul > li.active > a,#cssmenu > ul ul > li.has-sub > ul > li.active > a{border-top:none}
 +
}
  
  
 +
/* NAV END*/
  
 +
#team {
 +
  background: url(https://static.igem.org/mediawiki/2017/2/24/Genetics.jpg);
 +
        -webkit-background-size: cover;
 +
-moz-background-size: cover;
 +
-o-background-size: cover;
 +
background-size: cover;
 +
background-attachment: fixed;
 +
        height: auto;
 +
}
  
 +
/*TEAM*/
  
  <head>
+
@import url('http://fonts.googleapis.com/css?family=Open+Sans:400,700');
  
<style>
+
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
 +
  margin: 0;
 +
  padding: 0;
 +
  border: 0;
 +
  font-size: 100%;
 +
  font: inherit;
 +
  vertical-align: baseline;
 +
  outline: none;
 +
  -webkit-font-smoothing: antialiased;
 +
  -webkit-text-size-adjust: 100%;
 +
  -ms-text-size-adjust: 100%;
 +
  -webkit-box-sizing: border-box;
 +
  -moz-box-sizing: border-box;
 +
  box-sizing: border-box;
 +
}
 +
html { overflow-y: scroll; }
 +
body {
 +
  background: #f5f5f5;
 +
  font-family: "Trebuchet MS", Arial, Tahoma, sans-serif;
 +
  font-size: 62.5%;
 +
  line-height: 1;
 +
  color: #343434;
 +
  padding: 55px 0;
 +
}
  
*!
+
br { display: block; line-height: 1.6em; }
* Start Bootstrap - Round About (https://startbootstrap.com/template-overviews/round-about)
+
* Copyright 2013-2017 Start Bootstrap
+
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-round-about/blob/master/LICENSE)
+
*/
+
  
body {
+
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
   padding-top: 54px;
+
ol, ul { list-style: none; }
 +
 
 +
input, textarea {  
 +
   -webkit-font-smoothing: antialiased;
 +
  -webkit-text-size-adjust: 100%;
 +
  -ms-text-size-adjust: 100%;
 +
  -webkit-box-sizing: border-box;
 +
  -moz-box-sizing: border-box;
 +
  box-sizing: border-box;
 +
  outline: none;  
 
}
 
}
  
@media (min-width: 992px) {
+
blockquote, q { quotes: none; }
   body {
+
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
    padding-top: 56px;
+
strong, b { font-weight: bold; }
   }
+
em, i { font-style: italic; }
 +
 
 +
table { border-collapse: collapse; border-spacing: 0; }
 +
img { border: 0; max-width: 100%; }
 +
 
 +
h1 {
 +
   font-family: 'Open Sans', Helvetica, Arial, sans-serif;
 +
  font-size: 3.6em;
 +
   line-height: 1.4em;
 +
  margin-bottom: 10px;
 +
  color: #515151;
 +
  font-weight: normal;
 
}
 
}
 +
 +
h2 {
 +
  font-family: 'Open Sans', Helvetica, Arial, sans-serif;
 +
  font-size: 3.0em;
 +
  line-height: 1.2em;
 +
  margin-bottom: 4px;
 +
  color: #515151;
 +
  font-weight: bold;
 +
}
 +
 +
h3 {
 +
  font-family: 'Open Sans', Helvetica, Arial, sans-serif;
 +
  font-size: 1.75em;
 +
  line-height: 1.2em;
 +
  letter-spacing: -0.02em;
 +
  text-transform: uppercase;
 +
  margin-bottom: 11px;
 +
  color: #515151;
 +
  font-weight: normal;
 +
}
 +
 +
p {
 +
  display: block;
 +
  font-size: 1.6em;
 +
  line-height: 1.4em;
 +
  margin-bottom: 15px;
 +
  color: #666;
 +
}
 +
 +
a {
 +
  color: #739ecf;
 +
  text-decoration: none;
 +
}
 +
 +
a:hover {
 +
  text-decoration: underline;
 +
}
 +
 +
 +
/** page structure **/
 +
#w {
 +
  display: block;
 +
  margin: 0 auto;
 +
  width: 900px;
 +
  padding: 10px 25px;
 +
  background: #fff;
 +
  -webkit-border-radius: 4px;
 +
  -moz-border-radius: 4px;
 +
  border-radius: 4px;
 +
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3);
 +
  -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.3);
 +
  box-shadow: 0 1px 1px rgba(0,0,0,0.3);
 +
}
 +
 +
#teamcontent {
 +
  display: none;
 +
  margin-bottom: 15px;
 +
}
 +
 +
 +
/** team member list **/
 +
.team {
 +
  display: block;
 +
}
 +
 +
.team li {
 +
  display: block;
 +
  float: left;
 +
  margin-right: 20px;
 +
  margin-bottom: 20px;
 +
}
 +
.team li:hover {
 +
  cursor: pointer;
 +
}
 +
 +
.team li.last { margin-right: 0; }
 +
 +
.team .hcontent {
 +
  display: none;
 +
}
 +
 +
 +
 +
/** hidden team content **/
 +
#teamcontent .bigimg {
 +
  display: block;
 +
  float: left;
 +
}
 +
 +
#teamdetails {
 +
  display: block;
 +
  float: left;
 +
  width: 600px;
 +
  padding-left: 15px;
 +
}
 +
 +
 +
/** clearfix **/
 +
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
 +
.clearfix { display: inline-block; }
 +
 +
html[xmlns] .clearfix { display: block; }
 +
* html .clearfix { height: 1%; }
 +
 +
/* TEAM */
 +
 +
/* P2T */
 +
#return-to-top {
 +
    position: fixed;
 +
    bottom: 20px;
 +
    right: 20px;
 +
    background: rgb(0, 0, 0);
 +
    background: rgba(0, 0, 0, 0.7);
 +
    width: 50px;
 +
    height: 50px;
 +
    display: block;
 +
    text-decoration: none;
 +
    -webkit-border-radius: 35px;
 +
    -moz-border-radius: 35px;
 +
    border-radius: 35px;
 +
    display: none;
 +
    -webkit-transition: all 0.3s linear;
 +
    -moz-transition: all 0.3s ease;
 +
    -ms-transition: all 0.3s ease;
 +
    -o-transition: all 0.3s ease;
 +
    transition: all 0.3s ease;
 +
}
 +
#return-to-top i {
 +
    color: #fff;
 +
    margin: 0;
 +
    position: relative;
 +
    left: 16px;
 +
    top: 13px;
 +
    font-size: 19px;
 +
    -webkit-transition: all 0.3s ease;
 +
    -moz-transition: all 0.3s ease;
 +
    -ms-transition: all 0.3s ease;
 +
    -o-transition: all 0.3s ease;
 +
    transition: all 0.3s ease;
 +
}
 +
#return-to-top:hover {
 +
    background: rgba(0, 0, 0, 0.9);
 +
}
 +
#return-to-top:hover i {
 +
    color: #fff;
 +
    top: 5px;
 +
}
 +
 +
 +
/* P2T END */
 +
 +
 +
/* ANIMATION */
 +
 +
 +
 +
 +
/* ANIMATION END */
  
 
</style>
 
</style>
 +
</head>
  
    <meta charset="utf-8">
 
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
    <meta name="description" content="">
 
    <meta name="author" content="">
 
  
    <title>Round About - Start Bootstrap Template</title>
+
<body>
  
    <!-- Bootstrap core CSS -->
 
    <link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 
  
    <!-- Custom styles for this template -->
+
<!-- NAV BAR-->
    <link href="css/round-about.css" rel="stylesheet">
+
<nav id='cssmenu'>
 +
<div id="head-mobile"></div>
 +
<div class="button"></div>
  
  </head>
+
<ul>
 +
<li class='active'><a href='https://2016.igem.org/Team:Emory'>HOME</a></li>
 +
<li><a href='#'>PROJECT</a>
 +
  <ul>
 +
      <li><a href='https://2017.igem.org/Team:Emory/Description'>Description</a></li>
 +
      <li><a href='https://2017.igem.org/Team:Emory/Experiments'>Experiments</a></li>
 +
      <li><a href='https://2017.igem.org/Team:Emory/Proof'>Proof of Concept</a></li>
 +
      <li><a href='https://2017.igem.org/Team:Emory/Results'>Results</a></li>
 +
      <li><a href='https://2017.igem.org/Team:Emory/Notebook'>Notebook</a></li>
  
  <body>
+
  </ul>
 +
</li>
  
    <!-- Navigation -->
+
<li><a href='https://2017.igem.org/Team:Emory/Basic_Part'>PARTS</a></li>
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
+
<li><a href='https://2017.igem.org/Team:Emory/Safety'>SAFETY</a></li>
      <div class="container">
+
<li><a href='https://2017.igem.org/Team:Emory/HP/Silver'>COMMUNITY INVOLVEMENT</a>
        <a class="navbar-brand" href="#">Start Bootstrap</a>
+
<li><a href='https://2017.igem.org/Team:Emory/Collaborations'>COLLABORATIONS</a></li>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
+
<li><a href='https://2017.igem.org/Team:Emory/Team'>TEAM</a></li>
          <span class="navbar-toggler-icon"></span>
+
<li><a href='https://2017.igem.org/Team:Emory/Attributions'>ATTRIBUTIONS</a></li>
        </button>
+
</ul>
        <div class="collapse navbar-collapse" id="navbarResponsive">
+
</nav>
          <ul class="navbar-nav ml-auto">
+
            <li class="nav-item active">
+
              <a class="nav-link" href="#">Home
+
                <span class="sr-only">(current)</span>
+
              </a>
+
            </li>
+
            <li class="nav-item">
+
              <a class="nav-link" href="#">About</a>
+
            </li>
+
            <li class="nav-item">
+
              <a class="nav-link" href="#">Services</a>
+
            </li>
+
            <li class="nav-item">
+
              <a class="nav-link" href="#">Contact</a>
+
            </li>
+
          </ul>
+
        </div>
+
      </div>
+
    </nav>
+
  
    <!-- Page Content -->
 
    <div class="container">
 
  
      <!-- Introduction Row -->
+
<!--Push Up-->
      <h1 class="my-4">About Us
+
<a href="javascript:" id="return-to-top"><i class="icon-chevron-up"></i></a>
        <small>It's Nice to Meet You!</small>
+
      </h1>
+
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint, explicabo dolores ipsam aliquam inventore corrupti eveniet quisquam quod totam laudantium repudiandae obcaecati ea consectetur debitis velit facere nisi expedita vel?</p>
+
  
      <!-- Team Members Row -->
 
      <div class="row">
 
        <div class="col-lg-12">
 
          <h2 class="my-4">Our Team</h2>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
        <div class="col-lg-4 col-sm-6 text-center mb-4">
 
          <img class="rounded-circle img-fluid d-block mx-auto" src="http://placehold.it/200x200" alt="">
 
          <h3>John Smith
 
            <small>Job Title</small>
 
          </h3>
 
          <p>What does this team member to? Keep it short! This is also a great spot for social links!</p>
 
        </div>
 
      </div>
 
  
    </div>
+
<!-- ICON NEEDS FONT AWESOME FOR CHEVRON UP ICON -->
    <!-- /.container -->
+
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
 +
 
 +
 +
<!--Push up End-->
 +
 
 +
 
 +
<!--ANIMATION-->
 +
 
 +
 
 +
<!--ANIMATION END-->
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<!-- FILLER -->
 +
<div style="height:300px;color:white;">
 +
</div>
 +
 
 +
<!--PAGE 9 TEAM-->
 +
 
 +
    <div id="w">
 +
    <h1>Meet the Team</h1>
 +
    <p>Click any of the team member's photos to show more details.</p>
 +
   
 +
    <div id="teamcontent" class="clearfix">
 +
      <img src="http://i.imgur.com/TkSNOpF.jpg" class="bigimg" width="225" height="260">
 +
      <div id="teamdetails">
 +
        <h2 id="bigname">Name</h2>
 +
        <h3 id="bigjob">Title</h3>
 +
        <p id="bigdesc">A brief description.</p>
 +
       
  
    <!-- Footer -->
 
    <footer class="py-5 bg-dark">
 
      <div class="container">
 
        <p class="m-0 text-center text-white">Copyright &copy; Your Website 2017</p>
 
 
       </div>
 
       </div>
       <!-- /.container -->
+
    </div>
     </footer>
+
   
 +
    <ul class="team clearfix">
 +
       <li>
 +
        <img src="https://static.igem.org/mediawiki/2017/f/f5/Cyrillus_Tan.jpg" alt="Cyrillus Tan" width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">A senior student at Emory College majoring in biology and computer science. While his research interest is to reform the personalized medicine with information technology, he is also a student of international economics concerning with modern business model. He intends to pursue a doctoral degree in biomedical informatics after graduation.</span>
 +
      </li>
 +
     
 +
      <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/thumb/1/12/CyrillusEmory.jpg/475px-CyrillusEmory.jpg" alt="Cyrillus Tan " width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">Cyrillus is a junior student at Emory College majoring in biology and computer science. While his research interest is to reform the personalized medicine with information technology, he is also a student of international economics concerning with modern business model. He intends to pursue a doctoral degree in biomedical informatics after graduation.</span>
 +
      </li>
 +
     
 +
      <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/d/d1/TaliaEmory.jpg" alt="Talia Akoh-Arrey" width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <p class="hcontent desc">Talia is a senior at Emory University pursuing a double major in Neuroscience and Creative Writing. Following graduation, she is eager to begin her MD/PhD dual degree program and from there, would like to go on to do translational research in neuropharmacology.</a> links.</p>
 +
      </li>
 +
     
 +
      <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/3/30/SujithEmory.jpg" alt="Sujith Swarna" width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">Sujith is a sophomore at Emory University, majoring in Neuroscience and Psychology. Currently, he is researching the virulence of both S. aureus and S. pneumoniae. Outside of lab, he loves to play his guitar and piano. Every once in a while, he also likes to capture a Pidgey or two./span>
 +
      </li>
 +
     
 +
            <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/d/d8/KathyEmory.jpg" alt="Kathy Pei" width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">Kathy is a sophomore at Emory University, majoring in Biology and Violin Performance. While at Emory, she works in Dr. Jin-Tang Dong's lab at Winship Cancer Institute learning lab practices and assisting Emory graduate students in their research.Outside of the lab, she focuses more of her time on music, video games, and the occasional inspired workout.</span>
 +
      </li>
 +
     
 +
            <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/0/0d/MoneEmory.jpg" alt="Mone Anzai " width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">Mone is a sophomore student at Emory College studying biology and psychology. She currently works at an HIV lab Yerkes national primate research center, but hopes to pursue research in psychiatric disorders in the future.</span>
 +
      </li>
 +
     
 +
                  <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/d/d4/MichaelEmory.jpg" alt="Michael Hwang " width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Student</span>
 +
        <span class="hcontent desc">Michael is an Emory College sophomore pursuing degrees in Biology and Chemistry. While at Emory, he works at Dr. Yoon's lab assisting an investigator researching about treatments for diabetic neuropathy. He is also part of the Emory iGEM team working on quite an exciting synthetic biology research. When he is outside of lab, he spends his time reading books and playing squash!</span>
 +
      </li>
 +
     
 +
                        <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/2/25/MaurfEmory.jpg" alt="Maruf Hoque " width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Secondary PI</span>
 +
        <span class="hcontent desc">Maruf completed his bachelors and masters at Georgia State University. He was the iGEM graduate advisor at GSU in 2014-2015. Afterwards, he became a lab coordinator at Emory University in the department of Rehabilitation Medicine and is looking forward to enrolling in a Neuroscience graduate program in 2017.</span>
 +
      </li>
 +
     
 +
                        <li>
 +
        <img src="https://static.igem.org/mediawiki/2016/6/62/MatsumuraEmory.jpg" alt="Dr. Ichiro Matsumura " width="130" height="150" class="profilepic">
 +
        <span class="hcontent job">Primary PI</span>
 +
        <span class="hcontent desc">Ichiro was once an undergraduate at MIT and subsequently at Ph.D. student at UC Berkeley. He was a postdoc at UT Austin before he became an assistant prof at Emory University. He normally studies mechanisms of adaptive protein evolution; he believes that evolutionary theory is the best instruction manual for biological engineers.</span>
 +
      </li>
 +
    </ul>
 +
  </div>
 +
 
 +
 
 +
<!-- FILLER -->
 +
<div style="height:500px;color:white;">
 +
</div>
 +
 
 +
 
 +
 
 +
<script>
 +
 
 +
(function($) {
 +
$.fn.menumaker = function(options) { 
 +
var cssmenu = $(this), settings = $.extend({
 +
  format: "dropdown",
 +
  sticky: false
 +
}, options);
 +
return this.each(function() {
 +
  $(this).find(".button").on('click', function(){
 +
    $(this).toggleClass('menu-opened');
 +
    var mainmenu = $(this).next('ul');
 +
    if (mainmenu.hasClass('open')) {
 +
      mainmenu.slideToggle().removeClass('open');
 +
    }
 +
    else {
 +
      mainmenu.slideToggle().addClass('open');
 +
      if (settings.format === "dropdown") {
 +
        mainmenu.find('ul').show();
 +
      }
 +
    }
 +
  });
 +
  cssmenu.find('li ul').parent().addClass('has-sub');
 +
multiTg = function() {
 +
    cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
 +
    cssmenu.find('.submenu-button').on('click', function() {
 +
      $(this).toggleClass('submenu-opened');
 +
      if ($(this).siblings('ul').hasClass('open')) {
 +
        $(this).siblings('ul').removeClass('open').slideToggle();
 +
      }
 +
      else {
 +
        $(this).siblings('ul').addClass('open').slideToggle();
 +
      }
 +
    });
 +
  };
 +
  if (settings.format === 'multitoggle') multiTg();
 +
  else cssmenu.addClass('dropdown');
 +
  if (settings.sticky === true) cssmenu.css('position', 'fixed');
 +
resizeFix = function() {
 +
  var mediasize = 700;
 +
    if ($( window ).width() > mediasize) {
 +
      cssmenu.find('ul').show();
 +
    }
 +
    if ($(window).width() <= mediasize) {
 +
      cssmenu.find('ul').hide().removeClass('open');
 +
    }
 +
  };
 +
  resizeFix();
 +
  return $(window).on('resize', resizeFix);
 +
});
 +
  };
 +
})(jQuery);
 +
 
 +
(function($){
 +
$(document).ready(function(){
 +
$("#cssmenu").menumaker({
 +
  format: "multitoggle"
 +
});
 +
});
 +
})(jQuery);
 +
 
 +
 
 +
</script>
 +
 
 +
<script>
 +
 
 +
$(function(){
 +
  $('.profilepic').on('click', function(e){
 +
     var $biginfo = $('#teamcontent');
 +
    var $bigname = $('#bigname');
 +
    var $bigjob  = $('#bigjob');
 +
    var $bigdesc = $('#bigdesc');
 +
   
 +
    var newname = $(this).attr('alt');
 +
    var newrole = $(this).siblings('.job').eq(0).html();
 +
    var newdesc = $(this).siblings('.desc').eq(0).html();
 +
   
 +
    $bigname.html(newname);
 +
    $bigjob.html(newrole);
 +
    $bigdesc.html(newdesc);
 +
   
 +
    if($biginfo.css('display') == 'none') {
 +
      $biginfo.slideDown(350);
 +
    }
 +
  });
 +
});
 +
 
 +
$('.team img').click(function() { var loc = $(this).attr("src"); $('#teamcontent img').attr("src",loc); });
 +
</script>
 +
 
 +
 
 +
<script>
 +
// ===== Scroll to Top ====
 +
$(window).scroll(function() {
 +
    if ($(this).scrollTop() >= 50) {        // If page is scrolled more than 50px
 +
        $('#return-to-top').fadeIn(200);    // Fade in the arrow
 +
    } else {
 +
        $('#return-to-top').fadeOut(200);  // Else fade out the arrow
 +
    }
 +
});
 +
$('#return-to-top').click(function() {      // When arrow is clicked
 +
    $('body,html').animate({
 +
        scrollTop : 0                      // Scroll to top of body
 +
    }, 500);
 +
});
 +
</script>
  
    <!-- Bootstrap core JavaScript -->
 
    <script src="vendor/jquery/jquery.min.js"></script>
 
    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
 
  
  </body>
 
  
</html>
+
</body>

Revision as of 23:52, 23 October 2017

Template:Team:Emory/Test

Team:Emory iGEM 2017

Meet the Team

Click any of the team member's photos to show more details.

Name

Title

A brief description.

  • Cyrillus Tan Student A senior student at Emory College majoring in biology and computer science. While his research interest is to reform the personalized medicine with information technology, he is also a student of international economics concerning with modern business model. He intends to pursue a doctoral degree in biomedical informatics after graduation.
  • Cyrillus Tan Student Cyrillus is a junior student at Emory College majoring in biology and computer science. While his research interest is to reform the personalized medicine with information technology, he is also a student of international economics concerning with modern business model. He intends to pursue a doctoral degree in biomedical informatics after graduation.
  • Talia Akoh-Arrey Student

    Talia is a senior at Emory University pursuing a double major in Neuroscience and Creative Writing. Following graduation, she is eager to begin her MD/PhD dual degree program and from there, would like to go on to do translational research in neuropharmacology. links.

  • Sujith Swarna Student Sujith is a sophomore at Emory University, majoring in Neuroscience and Psychology. Currently, he is researching the virulence of both S. aureus and S. pneumoniae. Outside of lab, he loves to play his guitar and piano. Every once in a while, he also likes to capture a Pidgey or two./span>
  • Kathy Pei Student Kathy is a sophomore at Emory University, majoring in Biology and Violin Performance. While at Emory, she works in Dr. Jin-Tang Dong's lab at Winship Cancer Institute learning lab practices and assisting Emory graduate students in their research.Outside of the lab, she focuses more of her time on music, video games, and the occasional inspired workout.
  • Mone Anzai Student Mone is a sophomore student at Emory College studying biology and psychology. She currently works at an HIV lab Yerkes national primate research center, but hopes to pursue research in psychiatric disorders in the future.
  • Michael Hwang Student Michael is an Emory College sophomore pursuing degrees in Biology and Chemistry. While at Emory, he works at Dr. Yoon's lab assisting an investigator researching about treatments for diabetic neuropathy. He is also part of the Emory iGEM team working on quite an exciting synthetic biology research. When he is outside of lab, he spends his time reading books and playing squash!
  • Maruf Hoque Secondary PI Maruf completed his bachelors and masters at Georgia State University. He was the iGEM graduate advisor at GSU in 2014-2015. Afterwards, he became a lab coordinator at Emory University in the department of Rehabilitation Medicine and is looking forward to enrolling in a Neuroscience graduate program in 2017.
  • Dr. Ichiro Matsumura Primary PI Ichiro was once an undergraduate at MIT and subsequently at Ph.D. student at UC Berkeley. He was a postdoc at UT Austin before he became an assistant prof at Emory University. He normally studies mechanisms of adaptive protein evolution; he believes that evolutionary theory is the best instruction manual for biological engineers.