Difference between revisions of "Team:ColumbiaNYC/Team"

Line 40: Line 40:
  
 
     <!-- Team Members Row -->
 
     <!-- Team Members Row -->
−
     <div class="row">
+
     <style>
−
      <div class="col-lg-12">
+
.headline {
−
        <h2 class="page-header">Our Team</h2>
+
opacity: 0.75;
−
      </div>
+
}
−
      <div class="col-lg-3 col-sm-6 text-center">
+
</style>
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Noah Basri
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Brandon Cuevas
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p> </p>
+
−
      </div>
+
  
−
      <div class="col-lg-3 col-sm-6 text-center">
+
<title>About Us</title>
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
<meta charset="UTF-8">
−
        <h3>Jennifer Fang
+
<meta name="viewport" content="width=device-width, initial-scale=1">
−
          <small>Job Title</small>
+
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
−
        </h3>
+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
−
        <p>   </p>
+
<style>
−
      </div>
+
body,h1,h2,h3,h4,h5 {font-family: "Raleway", sans-serif}
 +
.w3-third img{margin-bottom: -6px; opacity: 0.8; cursor: pointer}
 +
.w3-third img:hover {opacity: 1}
 +
   
 +
.container {
 +
   position: relative;
 +
    cursor: pointer
 +
}
  
 +
.overlay {
 +
  opacity: 1;
 +
  width: 100%;
 +
  height: 100%;
 +
  transition: .5s ease;
 +
  background-color: lightblue;
 +
}
  
−
      <div class="col-lg-3 col-sm-6 text-center">
+
.image {
−
        <img class="img-circle img-responsive img-center" src="https://static.igem.org/mediawiki/2017/3/38/T--ColumbiaNYC--benji.jpg" alt="" class="rotate90">
+
  display: block;
−
        <h3>Benjamin Greenfield
+
  width: 300px;
−
          <small>AKA: The Benjinator</small>
+
  height: 300px;
−
        </h3>
+
    }
−
        <p> </p>
+
   
−
      </div>
+
.text-content {
−
      <div class="col-lg-3 col-sm-6 text-center">
+
  color: white;
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
  font-size: 20px;
−
        <h3>Alex Kim
+
  position: absolute;
−
          <small>Job Title</small>
+
  top: 50%;
−
        </h3>
+
  left: 50%;
−
        <p> </p>
+
  transform: translate(-50%, -50%);
−
      </div>
+
  -ms-transform: translate(-50%, -50%);
−
      <div class="col-lg-3 col-sm-6 text-center">
+
}
−
        <img class="img-circle img-responsive img-center" src="https://static.igem.org/mediawiki/2017/0/07/T--ColumbiaNYC--nathan.jpg" alt="" class="rotate90">
+
 
−
         <h3>Nathan Lian
+
.container:hover .overlay {
−
          <small>Job Title</small>
+
  opacity: 0;
−
        </h3>
+
}
−
         <p> </p>
+
   
−
      </div>
+
 
−
       <div class="col-lg-3 col-sm-6 text-center">
+
   
−
        <img class="img-circle img-responsive img-center" src="https://static.igem.org/mediawiki/2017/7/7c/T--ColumbiaNYC--panos.jpg" alt="" class="rotate90">
+
.overlay p {
−
         <h3>Panagiotis Oikomonou
+
    color:black;
−
          <small>Job Title</small>
+
    background-color: whitesmoke;
−
         </h3>
+
    border: 5px solid red;
−
         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
    opacity: 1;
−
      </div>
+
   
−
       <div class="col-lg-3 col-sm-6 text-center">
+
    }
−
        <img class="img-circle img-responsive img-center" src="https://static.igem.org/mediawiki/2017/e/e1/T--ColumbiaNYC--tarun.jpg" alt="" class="rotate90">
+
</style>
−
         <h3>Tarun Srinivasan
+
   
−
          <small>Job Title</small>
+
<body class="w3-light-grey w3-content" style="max-width:1600px">
−
         </h3>
+
 
−
         <p>  </p>
+
 
−
      </div>
+
   
 +
   
 +
 
 +
<!-- Sidebar/menu -->
 +
<nav class="w3-sidebar w3-bar-block w3-white w3-animate-left w3-text-grey w3-collapse w3-top w3-center" style="z-index:3;width:300px;font-weight:bold" id="mySidebar"><br>
 +
  <h3 class="w3-padding-64 w3-center"><b>Columbia<br>iGEM</b></h3>
 +
  <a href="about_me_1.html" onclick="w3_close()" class="w3-bar-item w3-button">Students</a>  
 +
  <a href="about_me_2.html" onclick="w3_close()" class="w3-bar-item w3-button">Team Advisors</a>  
 +
  <a href="mailto:cuigem2017@gmail.com?subject=Columbia%20iGEM%20Inquiry" onclick="w3_close()" class="w3-bar-item w3-button">Contact Us!</a>
 +
</nav>
 +
 
 +
<!-- Top menu on small screens -->
 +
<header class="w3-container w3-top w3-hide-large w3-white w3-xlarge w3-padding-16">
 +
  <span class="w3-left w3-padding">Yes, we are not stuck in lab 24/7:</span>
 +
  <a href="javascript:void(0)" class="w3-right w3-button w3-white" onclick="w3_open()">☰</a>
 +
</header>
 +
 
 +
<!-- Overlay effect when opening sidebar on small screens -->
 +
<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
 +
 
 +
<!-- !PAGE CONTENT! -->
 +
<div class="w3-main" style="margin-left:300px">
 +
 
 +
  <!-- Push down content on small screens -->  
 +
  <div class="w3-hide-large" style="margin-top:83px"></div>
 +
 
 +
  <!-- Photo grid -->
 +
  <div class="w3-row">
 +
    <div class="w3-third">
 +
         <div class="container">
 +
        <img src="noah.jpg" class="image" style="width:100%" onclick="onClick(this)"  alt="A member of Columbia College’s Class of 2018, Noah Basri exhibited a keen interest in biology and medicine since his early years. Majoring in Biology at Columbia, Noah joined the student-run Emergency Medical Service with the aim of making a meaningful impact on the Morningside Heights community. During the academic year when he is not driving the ambulance around the Columbia neighborhood, Noah can be found communing with his residents in McBain Hall as he is also a Resident Advisor. Noah’s previous research has helped characterize the epigenetic landscape of gliomas, specifically the role of the chromatin modifier CHD6 at dysregulated oncogenes. His findings were subsequently published in the Columbia Undergraduate Science Journal. These days when away from his cloning projects on the lab bench, Noah enjoys spending his time hiking and biking outdoors."/>
 +
     
 +
            <div class="overlay">    
 +
                <caption class="text-content"> Noah Basri </caption>
 +
         </div>
 +
        </div>
 +
       
 +
       
 +
       
 +
       <div class="container">
 +
      <img src="iGEM%20BIO.jpg" style="width:100%" onclick="onClick(this)" alt="Brandon Cuevas is a sophomore on the pre-med track majoring in Biomedical Engineering and minoring in Entrepreneurship and Innovation. On campus, Brandon is involved with the Society of Hispanic Professional Engineers, Synthetic Biology Initiative and American Physician Scientist Association, holding positions as the community outreach chair, education/media committee member and Co-Medical School Liaison, respectively. He has done research on microtubules at the Hess lab at Columbia University, and is now doing research on pancreatic cancer with the Olive Lab at the Columbia University Medical Center. In his spare time, Brandon enjoys playing video games, watching comical YouTube videos, playing good ol basketball and collecting catchphrases to add to his library. Cool beans, right?">
 +
         <div class="overlay">
 +
            <caption class="text-content" onclick="onClick(this)"> Brandon Cuevas </caption>  
 +
         </div>
 +
         </div>
 +
           
 +
       
 +
       
 +
       <div class="container">
 +
      <img src="Jennifer_Fang.jpg" style="width:100%" onclick="onClick(this)" alt="Jennifer Fang is a sophomore on the pre-med track pursuing a Biochemistry major who loves to cook, read, and play violin in her spare time. Before iGEM, she worked on the crystallization of a newly-discovered plant protein, discovered and designed new potential treatments for pancreatic cancer, worked on developing real-time medical image reconstruction from MRI and CAT scans using parallel computing and machine learning, and designed and implemented a satellite study of Earth’s radiative balance. On campus, she is an officer on the Research Committee of Columbia’s chapter of the American Physician Scientist Association, and officer on the Outreach Committee of Synthetic Biology Initiative, and the Webmaster and a violinist of Bach Society. She is also an avid member of Charles Drew Pre-Medical Society, Columbia’s chapter of the American Medical Students Association, Chandler Society, and Columbia Music Mentors.">
 +
         <div class="overlay">
 +
            <caption class="text-content"> Jennifer Fang </caption>  
 +
         </div>
 +
         </div>
 +
           
 
     </div>
 
     </div>
  
−
     <hr>
+
     <div class="w3-third">
 +
      <div class="container">
 +
      <img src="panos.jpg" style="width:100%" onclick="onClick(this)" alt="Panagiotis Oikonomou is a sophomore in Columbia’s School of Engineering and Applied Sciences, planning to study Biomedical Engineering. He is originally from Athens, Greece. Before iGEM, he was involved in the optimization of a plasma extraction and cell free detection device, combining microfluidics and “lab-on-a-chip” technologies to create a versatile and efficient point of care device. During high-school, he participated in research concerning the identification of the specific role and the regulation of the cell cycle regulator protein Emi2 in living oocytes, testing the hypothesis that Emi 2 has the role of surveying proper M-phase progression Meiosis I and mitosis in certain cancer cell types. On campus, he is a board member of Columbia University American Association of Medical Students, the co-chair of the Bioethics committee, and an organisational member in the board of the university's Biomedical Engineering Society, In his free time, he enjoys basketball, reading non-fiction, and exploring the city." />
 +
        <div class="overlay">
 +
            <caption class="text-content" onclick="onClick(this)"> Panagiotis Oikonomou </caption> 
 +
        </div>
 +
        </div>
 +
       
 +
       
 +
      <div class="container">
 +
      <img src="Alex.jpg" style="width:100%" onclick="onClick(this)" alt="Alex Kim is a sophomore in Columbia's School of Engineering and plans to major in Biomedical Engineering. He is a member of several pre-medical societies, an ER volunteer at the nearby Mount Sinai St. Luke’s Hospital, and financial lead of Columbia Space Initiative’s NASA Micro-G NEXT Mission Team. His previous research at Mt. Sinai Icahn School of Medicine involves researching novel computational methods of visualizing/analyzing methylation motifs in pathogenic bacterial strains.">
 +
        <div class="overlay">
 +
            <caption class="text-content"> Alex Kim </caption> 
 +
        </div>
 +
        </div>
 +
       
 +
       
 +
       
 +
      <div class="container">
 +
      <img src="Benji.jpg" style="width:100%" onclick="onClick(this)" alt="Benjamin Greenfield is a graduate from New Rochelle High School in New York. At Columbia Engineering, he intends to explore Biomedical Engineering. On campus, he is involved with the American Medical Students Association (AMSA) and the Synthetic Biology Initiative. His previous research experience include peptidomics research at Albert Einstein College of Medicine and Genetic Engineering at Regeneron Pharmaceuticals. Outside of SEBS, Benjie enjoys playing music and exploring the never-ending wonders of the city.">
 +
        <div class="overlay">
 +
            <caption class="text-content"> Benjamin Greenfield </caption> 
 +
           
 +
        </div>
 +
        </div>
 +
    </div>
 +
   
 +
    <div class="w3-third">
 +
        <div class="container">
 +
      <img src="tarun.png" style="width:100%" onclick="onClick(this)" alt="Tarun Srinivasan is a rising sophomore in Columbia College majoring in biochemistry. On campus, Tarun is the public health chair of the Charles Drew Pre Medical Society, the vice president of the Medical Informatics Society, and an officer of Code Orange. Additionally, he
 +
works in the Colecraft Lab studying the inhibition of intracellular receptor trafficking.">
 +
        <div class="overlay">
 +
            <caption class="text-content"> Tarun Srinivasan </caption> 
 +
        </div>
 +
        </div>
 +
       
 +
       
 +
       
 +
      <div class="container">
 +
      <img src="nathan.jpg" style="width:100%" onclick="onClick(this)" alt="Nathan Lian">
 +
        <div class="overlay">
 +
            <caption class="text-content"> Nathan Lian </caption> 
 +
        </div>
 +
        </div>
 +
     
 +
    </div>
 +
  </div>
  
−
    <!-- Team Members Row -->
+
 
−
    <div class="row">
+
  <!-- Modal for full size images on click-->
−
      <div class="col-lg-12">
+
  <div id="modal01" class="w3-modal w3-black" style="padding-top:0" onclick="this.style.display='none'">
−
        <h2 class="page-header">Our Mentors</h2>
+
    <span class="w3-button w3-black w3-xlarge w3-display-topright">×</span>
−
      </div>
+
    <div class="w3-modal-content w3-animate-zoom w3-center w3-transparent w3-padding-64">
−
      <div class="col-lg-3 col-sm-6 text-center">
+
       <img id="img01" class="w3-image">
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
       <p id="caption"> </p>
−
        <h3>Harris Wang
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Ross McBee
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
−
            <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Carlotta Ronda
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Sonja Billerbeck
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
       </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Virginia Cornish
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
       </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Lars Dietrich
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
−
      <div class="col-lg-3 col-sm-6 text-center">
+
−
        <img class="img-circle img-responsive img-center" src="http://placehold.it/200x200" alt="">
+
−
        <h3>Tal Danino
+
−
          <small>Job Title</small>
+
−
        </h3>
+
−
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
+
−
      </div>
+
 
     </div>
 
     </div>
 +
  </div>
  
 +
  <!-- About/Contact section
 +
  <div class="w3-container w3-dark-grey w3-center w3-text-light-grey w3-padding-32" id="about">
 +
    <h4><b>Interested in collaborating with us or getting in touch? Follow us on social media or send us an email!</b></h4>
 +
   
 +
    <div class="w3-content w3-justify" style="max-width:600px">
 +
      <h4>Facebook</h4>
 +
      <h4>Twitter</h4>
 +
     
 +
     
 +
        <div class="w3-container w3-light-grey w3-padding-32 w3-padding-large" id="contact">
 +
    <div class="w3-content" style="max-width:600px">
 +
      <h4 class="w3-center"><b>Contact Us via Email at:</b></h4>
 +
       
 +
        <a href="mailto:cuigem2017@gmail.com> cuigem2017team@googlegroups.com </a>
 +
                                                           
 +
        <!----
 +
      <form action="mailto:cuigem2017@gmail.com">
 +
        <div class="w3-section">
 +
          <label>Name</label>
 +
          <input class="w3-input w3-border" type="text" name="Name" required>
 +
        </div>
 +
        <div class="w3-section">
 +
          <label>Email</label>
 +
          <input class="w3-input w3-border" type="text" name="Email" required>
 +
        </div>
 +
        <div class="w3-section">
 +
          <label>Message</label>
 +
          <input class="w3-input w3-border" type="text" name="Message" required>
 +
        </div>
 +
        <button type="submit" class="w3-button w3-block w3-black w3-margin-bottom">Send Message</button>
 +
      </form>
 +
       
 +
       
 +
       
 +
    </div>
 
   </div>
 
   </div>
 +
    --->
 +
 
 +
 +
<!-- End page content -->
 +
</div>
 +
 +
<script>
 +
// Script to open and close sidebar
 +
function w3_open() {
 +
    document.getElementById("mySidebar").style.display = "block";
 +
    document.getElementById("myOverlay").style.display = "block";
 +
}
 +
 +
function w3_close() {
 +
    document.getElementById("mySidebar").style.display = "none";
 +
    document.getElementById("myOverlay").style.display = "none";
 +
}
 +
 +
// Modal Image Gallery
 +
function onClick(element) {
 +
  document.getElementById("img01").src = element.src;
 +
  document.getElementById("modal01").style.display = "block";
 +
  var captionText = document.getElementById("caption");
 +
  captionText.innerHTML = element.alt;
 +
}
 +
 +
</script>
  
 
</body>
 
</body>

Revision as of 02:18, 29 October 2017

Meet the Team

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint, explicabo dolores ipsam aliquam inventore corrupti.

About Us
Yes, we are not stuck in lab 24/7: ☰
A member of Columbia College’s Class of 2018, Noah Basri exhibited a keen interest in biology and medicine since his early years. Majoring in Biology at Columbia, Noah joined the student-run Emergency Medical Service with the aim of making a meaningful impact on the Morningside Heights community. During the academic year when he is not driving the ambulance around the Columbia neighborhood, Noah can be found communing with his residents in McBain Hall as he is also a Resident Advisor. Noah’s previous research has helped characterize the epigenetic landscape of gliomas, specifically the role of the chromatin modifier CHD6 at dysregulated oncogenes. His findings were subsequently published in the Columbia Undergraduate Science Journal. These days when away from his cloning projects on the lab bench, Noah enjoys spending his time hiking and biking outdoors.
Noah Basri
Brandon Cuevas is a sophomore on the pre-med track majoring in Biomedical Engineering and minoring in Entrepreneurship and Innovation. On campus, Brandon is involved with the Society of Hispanic Professional Engineers, Synthetic Biology Initiative and American Physician Scientist Association, holding positions as the community outreach chair, education/media committee member and Co-Medical School Liaison, respectively. He has done research on microtubules at the Hess lab at Columbia University, and is now doing research on pancreatic cancer with the Olive Lab at the Columbia University Medical Center. In his spare time, Brandon enjoys playing video games, watching comical YouTube videos, playing good ol basketball and collecting catchphrases to add to his library. Cool beans, right?
Brandon Cuevas
Jennifer Fang is a sophomore on the pre-med track pursuing a Biochemistry major who loves to cook, read, and play violin in her spare time. Before iGEM, she worked on the crystallization of a newly-discovered plant protein, discovered and designed new potential treatments for pancreatic cancer, worked on developing real-time medical image reconstruction from MRI and CAT scans using parallel computing and machine learning, and designed and implemented a satellite study of Earth’s radiative balance. On campus, she is an officer on the Research Committee of Columbia’s chapter of the American Physician Scientist Association, and officer on the Outreach Committee of Synthetic Biology Initiative, and the Webmaster and a violinist of Bach Society. She is also an avid member of Charles Drew Pre-Medical Society, Columbia’s chapter of the American Medical Students Association, Chandler Society, and Columbia Music Mentors.
Jennifer Fang
Panagiotis Oikonomou is a sophomore in Columbia’s School of Engineering and Applied Sciences, planning to study Biomedical Engineering. He is originally from Athens, Greece. Before iGEM, he was involved in the optimization of a plasma extraction and cell free detection device, combining microfluidics and “lab-on-a-chip” technologies to create a versatile and efficient point of care device. During high-school, he participated in research concerning the identification of the specific role and the regulation of the cell cycle regulator protein Emi2 in living oocytes, testing the hypothesis that Emi 2 has the role of surveying proper M-phase progression Meiosis I and mitosis in certain cancer cell types. On campus, he is a board member of Columbia University American Association of Medical Students, the co-chair of the Bioethics committee, and an organisational member in the board of the university's Biomedical Engineering Society, In his free time, he enjoys basketball, reading non-fiction, and exploring the city.
Panagiotis Oikonomou
Alex Kim is a sophomore in Columbia's School of Engineering and plans to major in Biomedical Engineering. He is a member of several pre-medical societies, an ER volunteer at the nearby Mount Sinai St. Luke’s Hospital, and financial lead of Columbia Space Initiative’s NASA Micro-G NEXT Mission Team. His previous research at Mt. Sinai Icahn School of Medicine involves researching novel computational methods of visualizing/analyzing methylation motifs in pathogenic bacterial strains.
Alex Kim
Benjamin Greenfield is a graduate from New Rochelle High School in New York. At Columbia Engineering, he intends to explore Biomedical Engineering. On campus, he is involved with the American Medical Students Association (AMSA) and the Synthetic Biology Initiative. His previous research experience include peptidomics research at Albert Einstein College of Medicine and Genetic Engineering at Regeneron Pharmaceuticals. Outside of SEBS, Benjie enjoys playing music and exploring the never-ending wonders of the city.
Benjamin Greenfield
Tarun Srinivasan is a rising sophomore in Columbia College majoring in biochemistry. On campus, Tarun is the public health chair of the Charles Drew Pre Medical Society, the vice president of the Medical Informatics Society, and an officer of Code Orange. Additionally, he works in the Colecraft Lab studying the inhibition of intracellular receptor trafficking.
Tarun Srinivasan
Nathan Lian
Nathan Lian
×