Difference between revisions of "Team:UCSC/Team"

Line 1: Line 1:
 
{{UCSC}}
 
{{UCSC}}
−
<html>
 
  
−
<div class="column two_thirds_size" >
 
  
−
<h1>Team</h1>
+
 
−
<p>In this page you can introduce your team members, instructors, and advisors. </p>
+
<!DOCTYPE html>
 +
<html lang="en-US">
 +
<head>
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
<link rel="stylesheet" type="text/css" href="styles.css">
 +
 
 +
<style>
 +
* {box-sizing: border-box}
 +
body {font-family: Oswald, Abel; margin:0}
 +
.mySlides1, .mySlides2, .mySlides3, .mySlides4, .mySlides5, .mySlides6, .mySlides7, .mySlides8, .mySlides9, .mySlides10, .mySlides11, .mySlides12{
 +
  display: none
 +
}
 +
img {vertical-align: middle;}
 +
body {background-color: #515151;}
 +
 
 +
</style>
 +
</head>
 +
<body>
 +
 
 +
 
 +
 
 +
 
 +
  <!--      ************************************* Downscale Images ***************************************      -->
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<h1 style="text-align: center; color: #F0AE2F; background-color: white; font-size:350%; padding-top: 50px; padding-bottom: 50px; margin-top: -20px;margin-bottom: -20px"> 2018 UCSC iGEM Team </h1>
 +
 
 +
 
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      ************************************* Row ***************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
 
 +
 
 +
<div class="row">
 +
 
 +
 
 +
  <!--      ************************************* Morgan ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides1 fade">
 +
        <img src="Morgan_1050.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides1 fade">
 +
        <img src="MorganDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides1 fade">
 +
        <img src="MorganHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides1 fade">
 +
        <img src="MorganFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 0)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 0)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Morgan Tardy </p>
 +
   
 +
  </div>
 +
 
 +
 
 +
  <!--      ************************************* Emily ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides2 fade">
 +
        <img src="Emily_1038.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides2 fade">
 +
        <img src="EmilyDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides2 fade">
 +
        <img src="EmilyHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides2 fade">
 +
        <img src="EmilyQuestion.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 1)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 1)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> Biomolecular Engineering </p> -->
 +
    <p class="FullNames"> Emily Mount </p>
 +
   
 +
  </div>
 +
 
 +
 
 +
 
 +
  <!--      ************************************* Manny ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides3 fade">
 +
        <img src="Manuel_1144.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides3 fade">
 +
        <img src="MannyDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides3 fade">
 +
        <img src="MannyHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides3 fade">
 +
        <img src="MannyQuestion.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 2)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 2)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> Biomolecular Engineering </p> -->
 +
    <p class="FullNames"> Manuel Varela </p>
 +
   
 +
  </div>
 +
 
 +
 
 +
 
 +
  <!--      ************************************* Ryan ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides4 fade">
 +
        <img src="https://2018.igem.org/File:T--UCSC--Ryan_1102.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides4 fade">
 +
        <img src="RyanDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides4 fade">
 +
        <img src="RyanHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides4 fade">
 +
        <img src="RyanFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 3)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 3)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> Biomolecular Engineering </p> -->
 +
    <p class="FullNames"> Ryan Modlin</p>
 +
   
 +
  </div>
  
  
−
<h3>What should this page contain?</h3>
 
−
<ul>
 
−
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
 
−
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
 
−
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
 
−
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
 
−
</ul>
 
 
</div>
 
</div>
 +
<br>
 +
 +
 +
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      ************************************* Row ***************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
 +
 +
 +
 +
 +
<div class="row">
 +
 +
  <!--      ************************************* Nicholas ***************************************      -->
 +
  <!-- Fix Scrabble -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides5 fade">
 +
        <img src="Nicholas_1124.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides5 fade">
 +
        <img src="NickDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides5 fade">
 +
        <img src="NickHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides5 fade">
 +
        <img src="NickFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 4)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 4)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Nicholas Hammond </p>
 +
   
 +
  </div>
 +
 +
 +
 +
  <!--      ************************************* Larry ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides6 fade">
 +
        <img src="Larry_1097.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides6 fade">
 +
        <img src="LarryDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides6 fade">
 +
        <img src="LarryHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides6 fade">
 +
        <img src="LarryFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 5)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 5)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Larry Hinojos </p>
 +
   
 +
  </div>
 +
 +
 +
  <!--      ************************************* Megan ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides7 fade">
 +
        <img src="Megan_1041.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides7 fade">
 +
        <img src="MeganDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides7 fade">
 +
        <img src="MeganHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides7 fade">
 +
        <img src="MeganQuestion.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 6)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 6)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Megan Macpherson </p>
 +
   
 +
  </div>
 +
 +
 +
  <!--      ************************************* Jessica ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides8 fade">
 +
        <img src="Jessica_1083.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides8 fade">
 +
        <img src="JessicaDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides8 fade">
 +
        <img src="JessicaHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides8 fade">
 +
        <img src="JessicaFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 7)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 7)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Jessica Scherer </p>
 +
   
 +
  </div>
  
  
  
−
<div class="column third_size" >
 
−
<div class="highlight decoration_A_full">
 
−
<h3>Inspiration</h3>
 
−
<p>You can look at what other teams did to get some inspiration! <br />
 
−
Here are a few examples:</p>
 
−
<ul>
 
−
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">2014 METU Turkey </a></li>
 
−
<li><a href="https://2014.igem.org/Team:Colombia/Members">2014 Colombia</a></li>
 
−
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">2014 Stony Brook</a></li>
 
−
<li><a href="https://2014.igem.org/Team:OUC-China/Team">2014 OUC-China</a></li>
 
−
</ul>
 
 
</div>
 
</div>
 +
 +
 +
<br>
 +
 +
 +
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      ************************************* Row ***************************************      -->
 +
<!--      *********************************************************************************      -->
 +
<!--      *********************************************************************************      -->
 +
 +
 +
 +
<div class="row">
 +
 +
  <!--      ************************************* Gina ***************************************      -->
 +
  <!-- Fix Scrabble -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides9 fade">
 +
        <img src="Gina_1082.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides9 fade">
 +
        <img src="GinaDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides9 fade">
 +
        <img src="GinaHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides9 fade">
 +
        <img src="GinaQuestion.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 8)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 8)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Gina Cuneo </p>
 +
   
 +
  </div>
 +
 +
 +
 +
  <!--      ************************************* Dante ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides10 fade">
 +
        <img src="Dante_1003.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides10 fade">
 +
        <img src="DanteDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides10 fade">
 +
        <img src="DanteHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides10 fade">
 +
        <img src="DanteFunFact.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 9)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 9)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Dante Moreno </p>
 +
   
 +
  </div>
 +
 +
 +
 +
  <!--      ************************************* Arash ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides11 fade">
 +
        <img src="Arash_1073.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides11 fade">
 +
        <img src="ArashDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides11 fade">
 +
        <img src="ArashHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides11 fade">
 +
        <img src="ArashQuestion.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 10)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 10)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Arash Parsa </p>
 +
   
 +
  </div>
 +
 +
 +
  <!--      ************************************* Justin ***************************************      -->
 +
  <!-- Fix Description -->
 +
  <div class="column"> 
 +
    <div class="slideshow-container">
 +
      <!-- Images -->
 +
      <div class="mySlides12 fade">
 +
        <img src="Justin_1092.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides12 fade">
 +
        <img src="JustinDescription.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides12 fade">
 +
        <img src="JustinHometown.png" style="width:100%">
 +
      </div>
 +
      <div class="mySlides12 fade">
 +
        <img src="JustinQuote.png" style="width:100%">
 +
      </div>
 +
      <a class="prev" onclick="plusSlides(-1, 11)">&#10094;</a>
 +
      <a class="next" onclick="plusSlides(1, 11)">&#10095;</a>
 +
    </div>
 +
<!--    <p style="text-align: center; margin-top:5px"> MCD Biology </p> -->
 +
    <p class="FullNames"> Justin Lau </p>
 +
   
 +
  </div>
 +
 +
 +
 +
 
</div>
 
</div>
 +
 +
 +
<br>
 +
 +
 +
 +
 +
 +
 +
 +
<script>
 +
var slideIndex = [1,1,1,1,1,1,1,1,1,1,1,1];
 +
var slideId = ["mySlides1", "mySlides2", "mySlides3", "mySlides4",  "mySlides5", "mySlides6", "mySlides7", "mySlides8", "mySlides9", "mySlides10", "mySlides11", "mySlides12"]
 +
showSlides(1, 0);
 +
showSlides(1, 1);
 +
showSlides(1, 2);
 +
showSlides(1, 3);
 +
showSlides(1, 4);
 +
showSlides(1, 5);
 +
showSlides(1, 6);
 +
showSlides(1, 7);
 +
showSlides(1, 8);
 +
showSlides(1, 9);
 +
showSlides(1, 10);
 +
showSlides(1, 11);
 +
 +
function plusSlides(n, no) {
 +
  showSlides(slideIndex[no] += n, no);
 +
}
 +
 +
function currentSlide(n, no) {
 +
  showSlides(slideIndex[no] = n, no);
 +
}
 +
 +
function showSlides(n, no) {
 +
  var i;
 +
  var x = document.getElementsByClassName(slideId[no]);
 +
  if (n > x.length) {slideIndex[no] = 1}   
 +
  if (n < 1) {slideIndex[no] = x.length}
 +
  for (i = 0; i < x.length; i++) {
 +
    x[i].style.display = "none"; 
 +
  }
 +
x[slideIndex[no]-1].style.display = "block";
 +
 
 +
}
 +
 +
 +
</script>
 +
 +
 +
 +
 +
</body>
 
</html>
 
</html>

Revision as of 18:12, 7 June 2018


<!DOCTYPE html>

2018 UCSC iGEM Team

Morgan Tardy

Emily Mount

Manuel Varela

Ryan Modlin


Nicholas Hammond

Larry Hinojos

Megan Macpherson

Jessica Scherer


Gina Cuneo

Dante Moreno

Arash Parsa

Justin Lau