Difference between revisions of "Team:Tec-Monterrey/Team"

m
m
 
(130 intermediate revisions by 11 users not shown)
Line 7: Line 7:
 
     height: 100%;
 
     height: 100%;
 
}
 
}
 
 
/************************************************ Custom CSS **************************************/
 
/************************************************ Custom CSS **************************************/
#myVideo {
 
    right: 0;
 
    left: 0;
 
    height: 100%;
 
}
 
 
#teamMembers{
 
#teamMembers{
 
   background: rgb(248,247,246);
 
   background: rgb(248,247,246);
Line 21: Line 15:
 
   display: flex;
 
   display: flex;
 
   flex-wrap: wrap;
 
   flex-wrap: wrap;
   margin: 5px auto 10px auto;
+
   margin: 5px auto 0 auto;
   justify-content: space-evenly;
+
  padding-bottom: 20px;
 +
   justify-content: center;
 
}
 
}
 
.member {
 
.member {
 
   transition: 0.4s;
 
   transition: 0.4s;
 
   margin: 10px 10px 0 10px;
 
   margin: 10px 10px 0 10px;
   padding: 10px 10px 0 10px;
+
   padding: 10px 10px 20px 10px;
 
   text-align: center;
 
   text-align: center;
 
   font-weight: 700;
 
   font-weight: 700;
 
}
 
}
 
.photo {
 
.photo {
   width: 250px;
+
   width: 16vw;
   height: 300px;
+
   height: 20vw;
 
   border-radius: 20%;
 
   border-radius: 20%;
 
   box-shadow: 0 1px 2px rgba(0,0,0,0.15);
 
   box-shadow: 0 1px 2px rgba(0,0,0,0.15);
 
   transition: all 0.4s;
 
   transition: all 0.4s;
 
   background: #888;
 
   background: #888;
 +
  -webkit-filter: grayscale(100%);
 +
  filter: grayscale(100%);
 
}
 
}
 
.member:hover {
 
.member:hover {
 
   cursor: pointer;
 
   cursor: pointer;
 
   text-decoration: underline;
 
   text-decoration: underline;
   transform: scale(1.1,1.1);
+
   transform: scale(1.3,1.3);
 +
  z-index: 20;
 
}
 
}
 
.member:hover .photo {
 
.member:hover .photo {
 
   border-radius: 5%;
 
   border-radius: 5%;
   width: 250px;
+
   -webkit-filter: grayscale(0%);
   height: 300px;
+
   filter: grayscale(0%);
 
}
 
}
 
/************************************************** Popup  ********************************************/
 
/************************************************** Popup  ********************************************/
Line 107: Line 105:
 
   display: none;
 
   display: none;
 
   font-size: 0.8em;
 
   font-size: 0.8em;
 +
}
 +
.popupContent a {
 +
  font-size: 1.5em;
 +
  color: #002ba8;
 
}
 
}
 
.closeButton {
 
.closeButton {
Line 125: Line 127:
 
   margin-left: auto;
 
   margin-left: auto;
 
   margin-right: auto;
 
   margin-right: auto;
 +
  border-radius: 10%;
 
}
 
}
 
.blurredBackground {
 
.blurredBackground {
Line 132: Line 135:
 
/*************************************************** Photos *******************************************/
 
/*************************************************** Photos *******************************************/
 
#Esteban {
 
#Esteban {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/4/44/T--Tec-Monterrey--Foto_Esteban.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Alan {
 
#Alan {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/8/8b/T--Tec-Monterrey--Foto_Alan.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Adrian {
 
#Adrian {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/4/43/T--Tec-Monterrey--Foto_Adrian.jpeg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Sofia {
 
#Sofia {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/9/9f/T--Tec-Monterrey--Foto_Sofia.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Nufo {
 
#Nufo {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/3/3e/T--Tec-Monterrey--Foto_Nufo.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Ana {
 
#Ana {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/1/1f/T--Tec-Monterrey--Foto_Ana.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Miranda {
 
#Miranda {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/b/b0/T--Tec-Monterrey--Foto_Miranda.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Valeria {
 
#Valeria {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/1/16/T--Tec-Monterrey--Foto_Valeria.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Juan {
 
#Juan {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/d/d3/T--Tec-Monterrey--Foto_Juan.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Miriam {
 
#Miriam {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/archive/c/c0/20181207010746%21T--Tec-Monterrey--Foto_Miriam.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Victor {
 
#Victor {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/3/3a/T--Tec-Monterrey--Foto_Victor.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Carlos {
 
#Carlos {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/6/6d/T--Tec-Monterrey--Foto_Carlos.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Nora {
 
#Nora {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/0/09/T--Tec-Monterrey--Foto_Nora.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Roberto {
 
#Roberto {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/a/a9/T--Tec-Monterrey--Foto_Roberto.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Sam {
 
#Sam {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/1/1a/T--Tec-Monterrey--Foto_Sam.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Andres {
 
#Andres {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/2/2e/T--Tec-Monterrey--Foto_Andres.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Jesus {
 
#Jesus {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/e/e2/T--Tec-Monterrey--Foto_Jesus.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Liz {
 
#Liz {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/7/74/T--Tec-Monterrey--Foto_Liz.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 
#Maru {
 
#Maru {
   background: grey;
+
   background: url(https://static.igem.org/mediawiki/2018/2/22/T--Tec-Monterrey--Foto_Maru.jpg);
 
   background-size: 100%;
 
   background-size: 100%;
 
}
 
}
 +
#Maritza {
 +
  background: url(https://static.igem.org/mediawiki/2018/9/95/T--Tec-Monterrey--Foto_Maritza.jpg);
 +
  background-size: 100%;
 +
}
 +
#Yvonne {
 +
  background: url(https://static.igem.org/mediawiki/2018/2/22/T--Tec-Monterrey--Foto_Yvonne.jpg);
 +
  background-size: 100%;
 +
}
 +
#AdrianCollab {
 +
  background: url(https://static.igem.org/mediawiki/2018/8/8e/T--Tec-Monterrey--Foto_AdrianR.jpg);
 +
  background-size: 100%;
 +
}
 +
#Naya {
 +
  background: url(https://static.igem.org/mediawiki/2018/1/1e/T--Tec-Monterrey--Foto_Naya.jpg);
 +
  background-size: 100%;
 +
}
 +
#David {
 +
  background: url(https://static.igem.org/mediawiki/2018/2/2f/T--Tec-Monterrey--Foto_David.jpg);
 +
  background-size: 100%;
 +
}
 +
#Alberto {
 +
  background: url(https://static.igem.org/mediawiki/2018/6/62/T--Tec-Monterrey--Foto_Alberto.jpg);
 +
  background-size: 100%;
 +
}
 +
#Camilo {
 +
  background: url(https://static.igem.org/mediawiki/2018/5/5a/T--Tec-Monterrey--Foto_Camilo.jpg);
 +
  background-size: 100%;
 +
}
 +
#Minerva {
 +
  background: url(https://static.igem.org/mediawiki/2018/a/ad/T--Tec-Monterrey--Foto_Minerva.jpg);
 +
  background-size: 100%;
 +
}
 +
#Vala {
 +
  background: url(https://static.igem.org/mediawiki/2018/4/4f/T--Tec-Monterrey--Foto_Vala.jpg);
 +
  background-size: 100%;
 +
}
 +
#Josechuy {
 +
  background: url(https://static.igem.org/mediawiki/2018/0/05/T--Tec-Monterrey--Photo_JesusG.jpg);
 +
  background-size: 100%;
 +
}
 +
#Caro {
 +
  background: url(https://static.igem.org/mediawiki/2018/2/2b/T--Tec-Monterrey--Foto_Caro.jpg);
 +
  background-size: 100%;
 +
}
 +
#Chema {
 +
  background: url(https://static.igem.org/mediawiki/2018/d/d3/T--Tec-Monterrey--Foto_Chema.jpg);
 +
  background-size: 100%;
 +
}
 +
#Cuau {
 +
  background: url(https://static.igem.org/mediawiki/2018/e/e5/T--Tec-Monterrey--Foto_Cuau.jpg);
 +
  background-size: 100%;
 +
}
 +
#Claudia {
 +
  background: url(https://static.igem.org/mediawiki/2018/2/2c/T--Tec-Monterrey--Foto_Claudia.jpg);
 +
  background-size: 100%;
 +
}
 +
#Luis {
 +
  background: url(https://static.igem.org/mediawiki/2018/b/bd/T--Tec-Monterrey--Foto_LuisMa.jpg);
 +
  background-size: 100%;
 +
}
 +
  .cd-vertical-nav li:first-of-type a::after {
 +
    /* change icon using image sprites */
 +
    background-position: 0px -48px;
 +
    /* fix bug with transitions - set scale(0.01) rather than scale(0) */
 +
    -webkit-transform: translateX(-50%) translateY(7.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(7.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(7.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(7.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(7.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:first-of-type a::before {
 +
    -webkit-transform: translateX(-50%) translateY(7.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(7.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(7.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(7.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(7.5em) scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(2) a::after {
 +
    background-position: 0px -32px;
 +
    -webkit-transform: translateX(-50%) translateY(4.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(4.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(4.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(4.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(4.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(2) a::before {
 +
    -webkit-transform: translateX(-50%) translateY(4.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(4.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(4.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(4.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(4.5em) scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(3) a::after {
 +
    background-position: 0px -16px;
 +
    -webkit-transform: translateX(-50%) translateY(1.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(1.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(1.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(1.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(1.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(3) a::before {
 +
    -webkit-transform: translateX(-50%) translateY(1.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(1.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(1.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(1.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(1.5em) scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(4) a::after {
 +
    background-position: 0px 0px;
 +
    -webkit-transform: translateX(-50%)  scale(0.01);
 +
    -moz-transform: translateX(-50%)  scale(0.01);
 +
    -ms-transform: translateX(-50%)  scale(0.01);
 +
    -o-transform: translateX(-50%)  scale(0.01);
 +
    transform: translateX(-50%)  scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(4) a::before {
 +
    -webkit-transform: translateX(-50%)  scale(0.25);
 +
    -moz-transform: translateX(-50%)  scale(0.25);
 +
    -ms-transform: translateX(-50%)  scale(0.25);
 +
    -o-transform: translateX(-50%)  scale(0.25);
 +
    transform: translateX(-50%)  scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(5) a::after {
 +
    background-position: 0px 0px;
 +
    -webkit-transform: translateX(-50%) translateY(-1.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(-1.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(-1.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(-1.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(-1.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(5) a::before {
 +
    -webkit-transform: translateX(-50%) translateY(-1.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(-1.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(-1.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(-1.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(-1.5em) scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(6) a::after {
 +
    background-position: 0px 0px;
 +
    -webkit-transform: translateX(-50%) translateY(-4.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(-4.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(-4.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(-4.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(-4.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(6) a::before {
 +
    -webkit-transform: translateX(-50%) translateY(-4.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(-4.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(-4.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(-4.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(-4.5em) scale(0.25);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(7) a::after {
 +
    background-position: 0px 0px;
 +
    -webkit-transform: translateX(-50%) translateY(-7.5em) scale(0.01);
 +
    -moz-transform: translateX(-50%) translateY(-7.5em) scale(0.01);
 +
    -ms-transform: translateX(-50%) translateY(-7.5em) scale(0.01);
 +
    -o-transform: translateX(-50%) translateY(-7.5em) scale(0.01);
 +
    transform: translateX(-50%) translateY(-7.5em) scale(0.01);
 +
  }
 +
  .cd-vertical-nav li:nth-of-type(7) a::before {
 +
    -webkit-transform: translateX(-50%) translateY(-7.5em) scale(0.25);
 +
    -moz-transform: translateX(-50%) translateY(-7.5em) scale(0.25);
 +
    -ms-transform: translateX(-50%) translateY(-7.5em) scale(0.25);
 +
    -o-transform: translateX(-50%) translateY(-7.5em) scale(0.25);
 +
    transform: translateX(-50%) translateY(-7.5em) scale(0.25);
 +
  }
 +
 +
@media screen and (max-width: 900px) {
 +
  .photo {
 +
    width: 20vw;
 +
    height: 25vw;
 +
  }
 +
  .member {
 +
    padding: 10px 10px 10px 10px;
 +
    font-size: 2.5vw;
 +
  }
 +
}
 +
 
</style>
 
</style>
 
</head>
 
</head>
 
<body>
 
<body>
 +
 +
<!------------------------------------------------------------------------------------------------------------------------>
 +
<!----------------------------------------------------- sidebar dots navigation ------------------------------------------>
 +
<!------------------------------------------------------------------------------------------------------------------------>
 +
    <script src="https://2018.igem.org/Team:Tec-Monterrey/T--Tec-Monterrey--modernizr?action=raw&ctype=text/javascript"</script>
 +
    <script src="https://2018.igem.org/Team:Tec-Monterrey/T--Tec-Monterrey--main-vertical-nav?action=raw&ctype=text/javascript"></script>
 +
    <!-- Modernizr -->
 +
   
 +
   
 +
    <!------------SideBar dots navigation -------->
 +
    <nav class="cd-vertical-nav">
 +
        <ul class="vertical-nav">
 +
            <li><a href="#page-top"><span class="label">Header<br><br></span></a></li>
 +
            <li><a href="#teamMembers"><span class="label">Team<br>Members</span></a></li>
 +
            <li><a href="#pi1"><span class="label">PI 1<br><br></span></a></li>
 +
            <li><a href="#pi2"><span class="label">PI 2<br><br></span></a></li>
 +
            <li><a href="#instructor"><span class="label">Instructor<br><br></span></a></li>
 +
            <li><a href="#advisors"><span class="label">Advisors<br><br></span></a></li>
 +
            <li><a href="#collaborators"><span class="label">Collaborators</span></a></li>
 +
        </ul>
 +
    </nav>
 +
    <!-- .cd-vertical-nav -->
 +
   
 +
    <script src="https://2018.igem.org/Team:Tec-Monterrey/T--Tec-Monterrey--main?action=raw&ctype=text/javascript"></script>
 +
    <!-- Resource jQuery -->
 +
 
<!-- Header -->
 
<!-- Header -->
   <header class="masthead">
+
   <header class="masthead" id="page-top">
       <div class="header-top">
+
       <div class="header-top" style="background-image: url('https://static.igem.org/mediawiki/2018/3/37/T--Tec-Monterrey--HeaderTeam2.jpg'); background-position-x: center; background-size: cover;">
        <video autoplay muted loop id="myVideo" type="video/mp4">
+
          <source src="https://static.igem.org/mediawiki/2018/d/d7/T--Tec-Monterrey--videoTec.mp4">
+
        </video>
+
 
       </div>
 
       </div>
 
       <div class="header-bottom">   
 
       <div class="header-bottom">   
Line 235: Line 440:
 
     </div>
 
     </div>
 
     <div class="containerMembers">
 
     <div class="containerMembers">
       <div class="member" onclick="openPopup(wrapperEsteban, backgroundEsteban, contentEsteban)">
+
       <div class="member" onclick="openPopup(wrapperAlan, backgroundAlan, contentAlan)">
         <div class="photo" id="Esteban">
+
         <div class="photo" id="Alan">
 
         </div>
 
         </div>
         Esteban de la Peña 
+
         Alan Ávila
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperAna, backgroundAna, contentAna)">
         <div class="photo" id="Alan">
+
         <div class="photo" id="Ana">
 
         </div>
 
         </div>
 +
        Ana Lasso de la Vega
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperVictor, backgroundVictor, contentVictor)">
         <div class="photo" id="Adrian">
+
         <div class="photo" id="Victor">
 
         </div>
 
         </div>
 +
        Victor Robledo
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperSofia, backgroundSofia, contentSofia)">
 
         <div class="photo" id="Sofia">
 
         <div class="photo" id="Sofia">
 
         </div>
 
         </div>
 +
        Sofía Lara
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperCarlos, backgroundCarlos, contentCarlos)">
         <div class="photo" id="Nufo">
+
         <div class="photo" id="Carlos">
 
         </div>
 
         </div>
 +
        Carlos Cordero
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperSam, backgroundSam, contentSam)">
         <div class="photo" id="Ana">
+
         <div class="photo" id="Sam">
 
         </div>
 
         </div>
 +
        Samantha Peña
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperNufo, backgroundNufo, contentNufo)">
         <div class="photo" id="Miranda">
+
         <div class="photo" id="Nufo">
 
         </div>
 
         </div>
 +
        Arnulfo Juarez
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperLiz, backgroundLiz, contentLiz)">
         <div class="photo" id="Valeria">
+
         <div class="photo" id="Liz">
 
         </div>
 
         </div>
 +
        Lizeth Rubio
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperEsteban, backgroundEsteban, contentEsteban)">
         <div class="photo" id="Juan">
+
         <div class="photo" id="Esteban">
 
         </div>
 
         </div>
 +
        Esteban de la Peña 
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperAndres, backgroundAndres, contentAndres)">
         <div class="photo" id="Miriam">
+
         <div class="photo" id="Andres">
 
         </div>
 
         </div>
 +
        Andrés Sánchez
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperMiriam, backgroundMiriam, contentMiriam)">
         <div class="photo" id="Victor">
+
         <div class="photo" id="Miriam">
 
         </div>
 
         </div>
 +
        Miriam Salas
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperAdrian, backgroundAdrian, contentAdrian)">
         <div class="photo" id="Carlos">
+
         <div class="photo" id="Adrian">
 
         </div>
 
         </div>
 +
        Adrián Hernández
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperNora, backgroundNora, contentNora)">
 
         <div class="photo" id="Nora">
 
         <div class="photo" id="Nora">
 
         </div>
 
         </div>
 +
        Nora Torres
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperJesus, backgroundJesus, contentJesus)">
         <div class="photo" id="Roberto">
+
         <div class="photo" id="Jesus">
 
         </div>
 
         </div>
 +
        Jesús López
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperValeria, backgroundValeria, contentValeria)">
         <div class="photo" id="Sam">
+
         <div class="photo" id="Valeria">
 
         </div>
 
         </div>
 +
        Valeria Fuentes
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperJuan, backgroundJuan, contentJuan)">
         <div class="photo" id="Andres">
+
         <div class="photo" id="Juan">
 
         </div>
 
         </div>
 +
        Juan Fernández
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperRoberto, backgroundRoberto, contentRoberto)">
         <div class="photo" id="Jesus">
+
         <div class="photo" id="Roberto">
 
         </div>
 
         </div>
 +
        Roberto Vázquez
 
       </div>
 
       </div>
       <div class="member">
+
       <div class="member" onclick="openPopup(wrapperMiranda, backgroundMiranda, contentMiranda)">
        <div class="photo" id="Liz">
+
         <div class="photo" id="Miranda">
        </div>
+
      </div>
+
      <div class="member">
+
         <div class="photo" id="Maru">
+
 
         </div>
 
         </div>
 +
        Miranda Iriarte
 
       </div>
 
       </div>
 +
    </div>
 +
    <div>
 +
      <img>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
Line 317: Line 538:
 
   <section id="pi1">
 
   <section id="pi1">
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     <div class="body-title" style="background: rgb(243,242,241);">
     Primary PI
+
     Primary PI's
 +
    </div>
 +
    <div class="containerMembers">
 +
      <div class="member" onclick="openPopup(wrapperChema, backgroundChema, contentChema)">
 +
        <div class="photo" id="Chema">
 +
        </div>
 +
        José M. Aguilar 
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperCuau, backgroundCuau, contentCuau)">
 +
        <div class="photo" id="Cuau">
 +
        </div>
 +
        Cuauhtemoc Licona
 +
      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
Line 324: Line 557:
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     Secondary PI
 
     Secondary PI
 +
    </div>
 +
    <div class="containerMembers">
 +
      <div class="member" onclick="openPopup(wrapperLuis, backgroundLuis, contentLuis)">
 +
        <div class="photo" id="Luis">
 +
        </div>
 +
        Luis M. Leal Garza 
 +
      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
Line 330: Line 570:
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     Instructor
 
     Instructor
 +
    </div>
 +
    <div class="containerMembers">
 +
      <div class="member" onclick="openPopup(wrapperCamilo, backgroundCamilo, contentCamilo)">
 +
        <div class="photo" id="Camilo">
 +
        </div>
 +
        R. Camilo Chávez 
 +
      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
Line 336: Line 583:
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     Advisors
 
     Advisors
 +
    </div>
 +
    <div class="containerMembers">
 +
      <div class="member" onclick="openPopup(wrapperCaro, backgroundCaro, contentCaro)">
 +
        <div class="photo" id="Caro">
 +
        </div>
 +
        Carolina Elizondo
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperMinerva, backgroundMinerva, contentMinerva)">
 +
        <div class="photo" id="Minerva">
 +
        </div>
 +
        Minerva Castellanos 
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperJosechuy, backgroundJosechuy, contentJosechuy)">
 +
        <div class="photo" id="Josechuy">
 +
        </div>
 +
        José de J. García 
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperClaudia, backgroundClaudia, contentClaudia)">
 +
        <div class="photo" id="Claudia">
 +
        </div>
 +
        Claudia N. Alonso 
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperNaya, backgroundNaya, contentNaya)">
 +
        <div class="photo" id="Naya">
 +
        </div>
 +
        Javier Naya 
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperAlberto, backgroundAlberto, contentAlberto)">
 +
        <div class="photo" id="Alberto">
 +
        </div>
 +
        J. Alberto de la Paz 
 +
      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
Line 342: Line 621:
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     <div class="body-title" style="background: rgb(243,242,241);">
 
     Collaborators
 
     Collaborators
 +
    </div>
 +
    <div class="containerMembers">
 +
      <div class="member" onclick="openPopup(wrapperYvonne, backgroundYvonne, contentYvonne)">
 +
        <div class="photo" id="Yvonne">
 +
        </div>
 +
        Yvonne Cárdenas
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperDavid, backgroundDavid, contentDavid)">
 +
        <div class="photo" id="David">
 +
        </div>
 +
        David Acevedo
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperMaritza, backgroundMaritza, contentMaritza)">
 +
        <div class="photo" id="Maritza">
 +
        </div>
 +
        Maritza Reyes
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperVala, backgroundVala, contentVala)">
 +
        <div class="photo" id="Vala">
 +
        </div>
 +
        Diego I. Valadez
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperMaru, backgroundMaru, contentMaru)">
 +
        <div class="photo" id="Maru">
 +
        </div>
 +
        María Eugenia Reyna
 +
      </div>
 +
      <div class="member" onclick="openPopup(wrapperAdrianCollab, backgroundAdrianCollab, contentAdrianCollab)">
 +
        <div class="photo" id="AdrianCollab">
 +
        </div>
 +
        Adrián Rodríguez
 +
      </div>
 
     </div>
 
     </div>
 
   </section>
 
   </section>
  
  <!-- Pop Ups -->
+
<!---------------------------------------------------------- Pop Ups ------------------------------------------------------>
 +
<!---------------------------------------------------------- Alan ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAlan">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAlan">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAlan, backgroundAlan, contentAlan)"></div>
 +
    <div class="popupBox popupContent" id="contentAlan">
 +
      <button id="closeAlan" class="closeButton" onclick="closePopup(wrapperAlan, backgroundAlan, contentAlan)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/8/8b/T--Tec-Monterrey--Foto_Alan.jpg">
 +
      <b>Alan Avila <a href="https://www.linkedin.com/in/alanavilarmz/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Team Leader</i>
 +
      <br>
 +
 
 +
      Born into the deepest hoods of Torreón (La Laguna) and currently studying in Monterrey as a senior in nanotechnology engineering and chemistry science, I’m proudly participant of iGEM Tec-Monterrey team. One of my passions is science dissemination and the interdisciplinary interaction of different careers and vocations in it. My goal in life is to get the enough resources to help people to self-fulfill their dreams and to enhance their quality of life. My hobbies are: languages learning and hanging around/walking in new places. As random fact before dedicating completely to science I was a street skateboarder for around 8 years. Hope to see you at Boston soon!
 +
 
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAlan, backgroundAlan, contentAlan)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Charlie Xavier ----------------------------------------------->
 +
  <div class="popupBackground" id="backgroundCarlos">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperCarlos">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperCarlos, backgroundCarlos, contentCarlos)"></div>
 +
    <div class="popupBox popupContent" id="contentCarlos">
 +
      <button id="closeCarlos" class="closeButton" onclick="closePopup(wrapperCarlos, backgroundCarlos, contentCarlos)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/6/6d/T--Tec-Monterrey--Foto_Carlos.jpg">
 +
      <b>Carlos Cordero <a href= "https://www.linkedin.com/in/carlos-javier-cordero-oropeza-386593a9/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab / Dry Lab </i>
 +
      <br>
 +
      Hi, Hallo, Hola! Researching, designing experiments and leading the group in lab activities were main main tasks. My passion is the biotechnology and how is it possible to used it in different areas that can impact in human life. That's why I am almost ending my bachelor degree in this area. In the team I am also known as Charlie, so if you see me I respond for both names. I live in Monterrey city since I was 5 years old. I love competitions like IGEM because they bring new ideas, new talents and young people together to develop projects of great impact in biological science and bioengineering.  I love to play tennis. This is my main hobby. I love to make new friends. Hope to see you in the competition!
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperCarlos, backgroundCarlos, contentCarlos)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Nufo ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundNufo">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperNufo">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperNufo, backgroundNufo, contentNufo)"></div>
 +
    <div class="popupBox popupContent" id="contentNufo">
 +
      <button id="closeNufo" class="closeButton" onclick="closePopup(wrapperNufo, backgroundNufo, contentNufo)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/3/3e/T--Tec-Monterrey--Foto_Nufo.jpg">
 +
      <b>Arnulfo Juarez <a href= "https://www.linkedin.com/in/jos%C3%A9-arnulfo-ju%C3%A1rez-figueroa-1478a1159/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab / Dry Lab </i>
 +
      <br>
 +
      Hi! My name is Nufo. I am a student of Biotechnology. I like a lot reading about genetic engineering. I am a hardworking person and I am the best making memes. Being part of iGEM Tec-Monterrey team is for me an honor. I am sure the synthetic biology is a big step the world is giving to a revolutionary world.  </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperNufo, backgroundNufo, contentNufo)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Victor ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundVictor">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperVictor">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperVictor, backgroundVictor, contentVictor)"></div>
 +
    <div class="popupBox popupContent" id="contentVictor">
 +
      <button id="closeNufo" class="closeButton" onclick="closePopup(wrapperVictor, backgroundVictor, contentVictor)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/3/3a/T--Tec-Monterrey--Foto_Victor.jpg">
 +
      <b>Victor Robledo</b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab / Dry Lab</i>
 +
      <br>
 +
      Hi! My name is Victor, Im 23 years old, and I study Biotechnology Engineering at Tec de Monterrey. I love science.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperVictor, backgroundVictor, contentVictor)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Ana ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAna">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAna">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAna, backgroundAna, contentAna)"></div>
 +
    <div class="popupBox popupContent" id="contentAna">
 +
      <button id="closeAna" class="closeButton" onclick="closePopup(wrapperAna, backgroundAna, contentAna)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/1/1f/T--Tec-Monterrey--Foto_Ana.jpg">
 +
      <b>Ana Lasso de la Vega <a href= "https://www.linkedin.com/in/ana-elizabeth-ldlv/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Wet Lab</i>
 +
      <br>
 +
      Hi! My name is Ana. I am from Panama, but now I am studying in Mexico the bachelor of Nanotechnology and Chemistry Science. I am a hard working person and I like to do my best all the time. I enjoy a lot eating cookies, especially the chocolate ones.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAna, backgroundAna, contentAna)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Nora ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundNora">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperNora">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperNora, backgroundNora, contentNora)"></div>
 +
    <div class="popupBox popupContent" id="contentNora">
 +
      <button id="closeNora" class="closeButton" onclick="closePopup(wrapperNora, backgroundNora, contentNora)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/0/09/T--Tec-Monterrey--Foto_Nora.jpg">
 +
      <b>Nora Torres <a href= "https://www.linkedin.com/in/nora-torres-6b93a1110" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Design </i>
 +
      <br>
 +
      Hello! My name is Nora, I am a Biotechnology student. I am in my last semester of my major. I enjoy learning about science and genetic modification. I like a lot the animals and cooking.
 +
I am a person who enjoys challenge myself to new problems. I believe we can change the word with effort and passion.
 +
 
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperNora, backgroundNora, contentNora)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Sam ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundSam">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperSam">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperSam, backgroundSam, contentSam)"></div>
 +
    <div class="popupBox popupContent" id="contentSam">
 +
      <button id="closeSam" class="closeButton" onclick="closePopup(wrapperSam, backgroundSam, contentSam)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/1/1a/T--Tec-Monterrey--Foto_Sam.jpg">
 +
      <b>Samantha Peña</b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab / Design </i>
 +
      <br>
 +
      My name is Samantha Peña, and I'm 18 years old. I'm from Nuevo León, México. I've been a passionate for science since I can remember, and my entire life has turned around this fact. I've always been into the search for a better world. Not only for our generation, but to aim for a better future. I'm kind of a perfectionist and a true hardworker. If I think something is going wrong, even the slightest, I do it over again in order to get the results I was expecting.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperSam, backgroundSam, contentSam)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Miranda ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundMiranda">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperMiranda">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperMiranda, backgroundMiranda, contentMiranda)"></div>
 +
    <div class="popupBox popupContent" id="contentMiranda">
 +
      <button id="closeMiranda" class="closeButton" onclick="closePopup(wrapperMiranda, backgroundMiranda, contentMiranda)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/b/b0/T--Tec-Monterrey--Foto_Miranda.jpg">
 +
      <b>Miranda Iriarte <a href= "https://www.linkedin.com/in/mirandairiarte/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Educational and Public Engangement</i>
 +
      <br>
 +
      Alo! I am 19 years old and I am from Tijuana, Baja. I am currently studying my sophomore year of Bachelor in Biotechnology Engineering. I am passionate about research and it is what I aspire to do in life. Pipetting is my workout, I do really enjoy it. As soon as I heard about iGEM I knew I wanted to be a part of it. It has really become my great love and has helped get out of my comfort zone, impulsing me to grow in all ways and allowing me to bring out the best I have got in me.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperMiranda, backgroundMiranda, contentMiranda)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Esteban ------------------------------------------------------>
 
   <div class="popupBackground" id="backgroundEsteban">
 
   <div class="popupBackground" id="backgroundEsteban">
 
   </div>
 
   </div>
Line 354: Line 821:
 
         <i class="fa fa-times"></i>
 
         <i class="fa fa-times"></i>
 
       </button>
 
       </button>
       <img class="popupImage" src="https://static.igem.org/mediawiki/2018/5/53/T--Tec-Monterrey--Imagen_Memo_Pensante.jpeg">
+
       <img class="popupImage" src="https://static.igem.org/mediawiki/2018/4/44/T--Tec-Monterrey--Foto_Esteban.jpg">
       <b>Esteban de la Peña</b>
+
       <b>Esteban de la Peña <a href="https://www.linkedin.com/in/esteban-de-la-pe%C3%B1a-th%C3%A9venet/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 
       (Nanotechnology)
 
       (Nanotechnology)
 
       <br>
 
       <br>
 
       <i>Web Developer</i>
 
       <i>Web Developer</i>
 
       <br>
 
       <br>
       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam hendrerit, nunc vitae luctus bibendum, ex elit suscipit arcu, eget imperdiet lectus velit in dui. Nunc in ligula a lorem congue volutpat. Etiam at augue sit amet diam pellentesque scelerisque ac a lorem. Pellentesque vel vulputate nulla. Donec lacinia, dolor quis eleifend finibus, orci justo hendrerit mi, et finibus ipsum urna in mi. Sed sollicitudin risus non finibus vehicula. Proin vel rutrum erat. Phasellus et lorem mauris. Integer sit amet elit sed risus fermentum mollis eu eu mi. Praesent vestibulum ligula id purus convallis euismod. Vestibulum dignissim ante id tortor dapibus feugiat non eget ligula. Sed sit amet nisi ac sapien vehicula lobortis. Suspendisse quis libero at turpis venenatis bibendum sit amet at purus. Aliquam interdum purus non mollis molestie. Mauris quis felis vitae neque ornare commodo at id sapien. Vestibulum mattis id libero at suscipit.
+
       Hello there<a href="https://static.igem.org/mediawiki/2018/2/23/T--Tec-Monterrey--Se%C3%B1or_Kenobi.jpg" target="_blank">!</a> As the main developer of this wiki, it's an honor to have you reading my description. People call me Esteban, or Steve if you want, I come from the small state of Aguascalientes, but I’ve been living in Monterrey since I was 6, and now I’m 20 years old. I love chemistry, programming, and science in general. I also love to paint digitally, draw <a style="padding: 0;" href="https://www.instagram.com/tev_steve/" target="_blank"><i class="fa fa-instagram"></i></a>, play videogames and hangout with friends.
 +
      <br>
 +
      <br>
 +
My goal in life, and the reason why I love projects like iGEM, is to make science cool and accessible for everyone. This is because I believe that science itself is always benefiting Humanity. Even though some people use it wrong, the net force of science is always <b>forward</b>.
 +
        </a>
 
     </div>
 
     </div>
 
     <div class="popupContentRight" onclick="closePopup(wrapperEsteban, backgroundEsteban, contentEsteban)"></div>
 
     <div class="popupContentRight" onclick="closePopup(wrapperEsteban, backgroundEsteban, contentEsteban)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Andres ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAndres">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAndres">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAndres, backgroundAndres, contentAndres)"></div>
 +
    <div class="popupBox popupContent" id="contentAndres">
 +
      <button id="closeAndres" class="closeButton" onclick="closePopup(wrapperAndres, backgroundAndres, contentAndres)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/2e/T--Tec-Monterrey--Foto_Andres.jpg">
 +
      <b>Andrés Sánchez <a href= "http://linkedin.com/in/andresbsanchez" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Mathematical Model / Wet Lab</i>
 +
      <br>
 +
      I am an undergraduate student in a Bachelor of Science in Chemistry and Nanotechnology. Yearning to be a scientist with the objective of improving the world by means of knowledge and technology, I consider the humanity inside everyone of us to be just as vital for the future of our world. Participating in the iGEM competition is my intent to being part of one of the world’s leading scientific community and to carrying out a scientific investigation against the odds.<br><br>
 +
All in all, I am currently working my way into achieving such passions, namely science and art.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAndres, backgroundAndres, contentAndres)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Miriam ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundMiriam">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperMiriam">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperMiriam, backgroundMiriam, contentMiriam)"></div>
 +
    <div class="popupBox popupContent" id="contentMiriam">
 +
      <button id="closeMiriam" class="closeButton" onclick="closePopup(wrapperMiriam, backgroundMiriam, contentMiriam)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/archive/c/c0/20181207010746%21T--Tec-Monterrey--Foto_Miriam.jpg">
 +
      <b>Miriam Salas <a href= "https://www.linkedin.com/in/miriamsalas" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Educational and Public Engagement</i>
 +
      <br>
 +
Hello! Let me tell you a little about myself:
 +
I come from a really small town called Zamora, Michoacan but now I live in Monterrey. I’m a Chemistry and Nanotechnology Engineering undergraduate student. I love singing and writing music in my free time. My biggest passion in life is helping others by putting my knowledge and abilities at the service of my community, and I believe the best way to do this is through science. My interest are: nanomaterials, biomaterials, microfluidics, drug delivery systems and bioinformatics.
 +
Random fact: I can do a Pikachu impression.
 +
 +
</div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperMiriam, backgroundMiriam, contentMiriam)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Adrian ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAdrian">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAdrian">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAdrian, backgroundAdrian, contentAdrian)"></div>
 +
    <div class="popupBox popupContent" id="contentAdrian">
 +
      <button id="closeAdrian" class="closeButton" onclick="closePopup(wrapperAdrian, backgroundAdrian, contentAdrian)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/4/43/T--Tec-Monterrey--Foto_Adrian.jpeg">
 +
      <b>Adrián Hernández <a href= "https://www.linkedin.com/in/adri%C3%A1n-hern%C3%A1ndez-mendoza-0184ba14b/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab</i>
 +
      <br>
 +
      Hello!, Let me introduce myself, I’m 20 years old and I’m currently studying the 3rd year of biotechnology engineering major with a minor in molecular biology. I come from Michoacan, Mexico but I’m living in Monterrey. I like to spent hours playing musical instrument because their sound kind of relaxes me. My favorite video game is Age of Empires, I love making epic battles with friends.  What I love the most is to expand the knowledge of science, to get known that we are able to explore new áreas of opportunity and give solutions for humanity problems, and there is no better place to start that the challenge of being part of an iGem Team.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAdrian, backgroundAdrian, contentAdrian)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Sofia ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundSofia">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperSofia">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperSofia, backgroundSofia, contentSofia)"></div>
 +
    <div class="popupBox popupContent" id="contentSofia">
 +
      <button id="closeSofia" class="closeButton" onclick="closePopup(wrapperSofia, backgroundSofia, contentSofia)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/9/9f/T--Tec-Monterrey--Foto_Sofia.jpg">
 +
      <b>Sofía Lara Ochoa <a href= "https://www.linkedin.com/in/sof%C3%ADa-lara-507773123" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Human Practices / Wet Lab</i>
 +
      <br>
 +
Helloo! I'm a student of nanotechnology and chemical sciences. I work at Residencias Tec, the dormitories for students. Being part of an iGEM team was my first approach to molecular biology and multidisciplinary team work. I believe in hard work and lifelong learning. I'm so thankful with the work we've all done during this last year, I hope we find ourselves closer to a future where we apply our abilities and knowledge to make the world a better place. Thank you iGEM for giving us the opportunity to share our experiences in the lab and out of it.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperSofia, backgroundSofia, contentSofia)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Jesus ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundJesus">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperJesus">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperJesus, backgroundJesus, contentJesus)"></div>
 +
    <div class="popupBox popupContent" id="contentJesus">
 +
      <button id="closeJesus" class="closeButton" onclick="closePopup(wrapperJesus, backgroundJesus, contentJesus)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/e/e2/T--Tec-Monterrey--Foto_Jesus.jpg">
 +
      <b>Jesús Héctor López <a href= "https://www.linkedin.com/in/jesushectorlopezgrajeda" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Wet Lab/ Collaborations </i>
 +
      <br>
 +
      Hi! Let me tell you a little bit about myself. I come from Chihuahua, Mexico but I study in Monterrey. I am 20 years old, in my junior year majoring in biotechnology engineering. My minor is biological processes. I wanted to join an iGEM team since I heard about it in high school and, during the 4th semester, the opportunity to fulfil my dream arrived.
 +
In my free time, I like to watch any TV show and movie that is on Netflix. I also enjoy cooking, tennis, and karaoke, but my biggest passion is learning more about chemistry and biotechnology, specifically industrial biotechnology.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperJesus, backgroundJesus, contentJesus)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Valeria ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundValeria">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperValeria">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperValeria, backgroundValeria, contentValeria)"></div>
 +
    <div class="popupBox popupContent" id="contentValeria">
 +
      <button id="closeValeria" class="closeButton" onclick="closePopup(wrapperValeria, backgroundValeria, contentValeria)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/1/16/T--Tec-Monterrey--Foto_Valeria.jpg">
 +
      <b>Valeria Fuentes</b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Educational and Public Engagement</i>
 +
      <br>
 +
      Hi! I’m a 19-year-old Biotechnology Engineering student, currently in my third semester of university. I’m originally from Tijuana but I live in Monterrey because of school. I love microbiology, spending time at the lab and learning new techniques. My favorites things in life are tacos, cactuses and carnivorous plants (I own over 15 of them). I just find them incredibly interesting and cute!
 +
I aspire to work in research, specifically in the medical field and hope to have my own biotechnology company one day.
 +
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperValeria, backgroundValeria, contentValeria)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Liz ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundLiz">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperLiz">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperLiz, backgroundLiz, contentLiz)"></div>
 +
    <div class="popupBox popupContent" id="contentLiz">
 +
      <button id="closeLiz" class="closeButton" onclick="closePopup(wrapperLiz, backgroundLiz, contentLiz)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/7/74/T--Tec-Monterrey--Foto_Liz.jpg">
 +
      <b>Adriana Lizeth Rubio <a href= "https://mx.linkedin.com/in/adriana-lizeth-rubio-aguirre-56b10a15a" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Nanotechnology)
 +
      <br>
 +
      <i>Mathematical Model</i>
 +
      <br>
 +
    Hi everybody! I’m a studying a major in Nanotechnology an Chemistry Science. I am from Guadalajara, a beautiful city in the west of the country. I love to understand the word and ask me questions about the things I am interested in, in order to imagine new ways to do something. I enjoy running and tasting different kinds of desserts. One of my favorite hobbies is teaching. I believe everyone can achieve all if we really love it.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperLiz, backgroundLiz, contentLiz)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Juan ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundJuan">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperJuan">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperJuan, backgroundJuan, contentJuan)"></div>
 +
    <div class="popupBox popupContent" id="contentJuan">
 +
      <button id="closeJuan" class="closeButton" onclick="closePopup(wrapperJuan, backgroundJuan, contentJuan)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/d/d3/T--Tec-Monterrey--Foto_Juan.jpg">
 +
      <b>Juan Antonio Fernández <a href= "https://www.linkedin.com/in/juanfernandezdelagarza/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Physics)
 +
      <br>
 +
      <i>Mathematical Model</i>
 +
      <br>
 +
    Hi, I'm majoring physics and a passionate of science in general. I love mathematics, and how they allow us to discover more about the world, and also give explanations that predict interesting properties. In addition to my love for mathematics, I also love computational simulation and yielding the power that modern electronics have to offer.
 +
Being able to work on the model of this biological system has truly been an incredible experience with a lot of personal learning.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperJuan, backgroundJuan, contentJuan)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Maru ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundMaru">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperMaru">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperMaru, backgroundMaru, contentMaru)"></div>
 +
    <div class="popupBox popupContent" id="contentMaru">
 +
      <button id="closeMaru" class="closeButton" onclick="closePopup(wrapperMaru, backgroundMaru, contentMaru)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/22/T--Tec-Monterrey--Foto_Maru.jpg">
 +
      <b>María E. Rivera</b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Collaborator / Financing</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperMaru, backgroundMaru, contentMaru)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Roberto ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundRoberto">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperRoberto">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperRoberto, backgroundRoberto, contentRoberto)"></div>
 +
    <div class="popupBox popupContent" id="contentRoberto">
 +
      <button id="closeRoberto" class="closeButton" onclick="closePopup(wrapperRoberto, backgroundRoberto, contentRoberto)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/a/a9/T--Tec-Monterrey--Foto_Roberto.jpg">
 +
      <b>Roberto Vásquez <a href= "https://www.linkedin.com/in/robertovzz/" target="_blank"><i class="fa fa-linkedin-square"></i></a></b>
 +
      (Physics)
 +
      <br>
 +
      <i>Mathematical Model</i>
 +
      <br>
 +
      Hey! I am a passionate person who loves learning. I am studying Physics but this does not limit myself to try to understand the world. In addition, I believe one of the most important things in life is making an impact on the people, that is why I enjoy helping to whom need. One of my passion is making new friends and learning about them too. Moreover, I like to practice sports like volleyball and basketball. I am a very good programmer and the best teacher too.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperRoberto, backgroundRoberto, contentRoberto)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Chema ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundChema">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperChema">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperChema, backgroundChema, contentChema)"></div>
 +
    <div class="popupBox popupContent" id="contentChema">
 +
      <button id="closeChema" class="closeButton" onclick="closePopup(wrapperChema, backgroundChema, contentChema)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/d/d3/T--Tec-Monterrey--Foto_Chema.jpg">
 +
      <b>PhD. José Manuel Aguilar Yañez</b>     
 +
      <br>
 +
      <i>Primary PI</i>
 +
      <br>
 +
      José Manuel Aguilar majored in Biology with a specialty in Molecular Biology, and holds a PhD in Biotechnology. He was responsible for the production of a more efficient procedure for the detection of influenza H1N1 during its pandemic, and the development of a vaccine using bacteria instead of chicken eggs. We thank him for his guidance and support during the project development.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperChema, backgroundChema, contentChema)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Cuau ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundCuau">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperCuau">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperCuau, backgroundCuau, contentCuau)"></div>
 +
    <div class="popupBox popupContent" id="contentCuau">
 +
      <button id="closeCuau" class="closeButton" onclick="closePopup(wrapperCuau, backgroundCuau, contentCuau)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/e/e5/T--Tec-Monterrey--Foto_Cuau.jpg">
 +
      <b>Cuauhtémoc Licona Lascani</b>
 +
      <br>
 +
      <i>Primary PI</i>
 +
      <br>
 +
      Cuauhtémoc Licona majored in Biotechnology at the National Polytechnic Institute of Mexico. He has a M.Sc. in Biochemical Sciences from UNAM (National Autonomous University of Mexico) and a Ph.D. in Systems Biology from the University of Queensland. He gave us access to the laboratory at the beginning of the project. He lent a hand when biological packages arrived to our university and provided us lab materials needed for our project.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperCuau, backgroundCuau, contentCuau)"></div>
 +
  </div>
 +
<!-------------------------------------------------------- Luis Mario ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundLuis">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperLuis">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperLuis, backgroundLuis, contentLuis)"></div>
 +
    <div class="popupBox popupContent" id="contentLuis">
 +
      <button id="closeLuis" class="closeButton" onclick="closePopup(wrapperLuis, backgroundLuis, contentLuis)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/b/bd/T--Tec-Monterrey--Foto_LuisMa.jpg">
 +
      <b>Luis Mario Leal</b>
 +
      <br>
 +
      <i>Secondary PI</i>
 +
      <br>
 +
      As our secondary PI, instructor, advisor, ExiGEMer, and genetic engineering lab professor, Luis Mario was a key member of the Tec-Monterrey Team. We are especially grateful for his guidance on the development of the different competition parameters, the selection of our project’s topic, and the design of most important constructs. He showed commitment and responsibility towards our team and really helped us out regarding the organization of the team.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperLuis, backgroundLuis, contentLuis)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Camilo ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundCamilo">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperCamilo">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperCamilo, backgroundCamilo, contentCamilo)"></div>
 +
    <div class="popupBox popupContent" id="contentCamilo">
 +
      <button id="closeCamilo" class="closeButton" onclick="closePopup(wrapperCamilo, backgroundCamilo, contentCamilo)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/5/5a/T--Tec-Monterrey--Foto_Camilo.jpg">
 +
      <b>MsC. Ricardo Camilo Chávez:</b>
 +
      <br>
 +
      <i>Instructor</i>
 +
      <br>
 +
      He is a bachelor in Biotechnology Engineering and a MsC in Synthetic Biology from Edinburgh's University. iGEMer for around 8 years; Camilo’s experience was helpful to sort out problems in and out the lab. He was always there, willing to give us some advice about any kind of issues. He also helped us in contacting some of the other Mexican iGEM teams. On the worsts times, at the beginning of the project, he helped to give us support and keeping us strong for pursuing with the iGEM teams.
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperCamilo, backgroundCamilo, contentCamilo)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Minerva ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundMinerva">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperMinerva">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperMinerva, backgroundMinerva, contentMinerva)"></div>
 +
    <div class="popupBox popupContent" id="contentMinerva">
 +
      <button id="closeMinerva" class="closeButton" onclick="closePopup(wrapperMinerva, backgroundMinerva, contentMinerva)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/5/53/T--Tec-Monterrey--Imagen_Memo_Pensante.jpeg">
 +
      <b>Minerva Castellanos</b>
 +
      (Biotechnology)
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
     
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperMinerva, backgroundMinerva, contentMinerva)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Josechuy ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundJosechuy">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperJosechuy">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperJosechuy, backgroundJosechuy, contentJosechuy)"></div>
 +
    <div class="popupBox popupContent" id="contentJosechuy">
 +
      <button id="closeJosechuy" class="closeButton" onclick="closePopup(wrapperJosechuy, backgroundJosechuy, contentJosechuy)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/0/05/T--Tec-Monterrey--Photo_JesusG.jpg">
 +
      <b>Jose de Jesús García</b>
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperJosechuy, backgroundJosechuy, contentJosechuy)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Claudia ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundClaudia">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperClaudia">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperClaudia, backgroundClaudia, contentClaudia)"></div>
 +
    <div class="popupBox popupContent" id="contentClaudia">
 +
      <button id="closeClaudia" class="closeButton" onclick="closePopup(wrapperClaudia, backgroundClaudia, contentClaudia)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/2c/T--Tec-Monterrey--Foto_Claudia.jpg">
 +
      <b>Claudia N. Alonso</b>
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperClaudia, backgroundClaudia, contentClaudia)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Naya ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundNaya">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperNaya">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperNaya, backgroundNaya, contentNaya)"></div>
 +
    <div class="popupBox popupContent" id="contentNaya">
 +
      <button id="closeNaya" class="closeButton" onclick="closePopup(wrapperNaya, backgroundNaya, contentNaya)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/1/1e/T--Tec-Monterrey--Foto_Naya.jpg">
 +
      <b>Javier Naya</b>
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperNaya, backgroundNaya, contentNaya)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Alberto ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAlberto">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAlberto">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAlberto, backgroundAlberto, contentAlberto)"></div>
 +
    <div class="popupBox popupContent" id="contentAlberto">
 +
      <button id="closeAlberto" class="closeButton" onclick="closePopup(wrapperAlberto, backgroundAlberto, contentAlberto)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/6/62/T--Tec-Monterrey--Foto_Alberto.jpg">
 +
      <b>J. Alberto de la Paz</b>
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAlberto, backgroundAlberto, contentAlberto)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Vala ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundVala">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperVala">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperVala, backgroundVala, contentVala)"></div>
 +
    <div class="popupBox popupContent" id="contentVala">
 +
      <button id="closeVala" class="closeButton" onclick="closePopup(wrapperVala, backgroundVala, contentVala)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/4/4f/T--Tec-Monterrey--Foto_Vala.jpg">
 +
      <b>Diego I. Valadez</b>
 +
      <br>
 +
      <i>Collaborator</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperVala, backgroundVala, contentVala)"></div>
 +
  </div>
 +
  <!---------------------------------------------------------- Yvonne ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundYvonne">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperYvonne">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperYvonne, backgroundYvonne, contentYvonne)"></div>
 +
    <div class="popupBox popupContent" id="contentYvonne">
 +
      <button id="closeYvonne" class="closeButton" onclick="closePopup(wrapperYvonne, backgroundYvonne, contentYvonne)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/22/T--Tec-Monterrey--Foto_Yvonne.jpg">
 +
      <b>Yvonne Cárdenas</b>
 +
      <br>
 +
      <i>Collaborator</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperYvonne, backgroundYvonne, contentYvonne)"></div>
 +
  </div>
 +
    <!---------------------------------------------------------- Maritza ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundMaritza">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperMaritza">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperMaritza, backgroundMaritza, contentMaritza)"></div>
 +
    <div class="popupBox popupContent" id="contentMaritza">
 +
      <button id="closeMaritza" class="closeButton" onclick="closePopup(wrapperMaritza, backgroundMaritza, contentMaritza)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/9/95/T--Tec-Monterrey--Foto_Maritza.jpg">
 +
      <b>Maritza Reyes</b>
 +
      <br>
 +
      <i>Collaborator</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperMaritza, backgroundMaritza, contentMaritza)"></div>
 +
  </div>
 +
    <!---------------------------------------------------------- AdrianR ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundAdrianCollab">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperAdrianCollab">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperAdrianCollab, backgroundAdrianCollab, contentAdrianCollab)"></div>
 +
    <div class="popupBox popupContent" id="contentAdrianCollab">
 +
      <button id="closeAdrianCollab" class="closeButton" onclick="closePopup(wrapperAdrianCollab, backgroundAdrianCollab, contentAdrianCollab)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/8/8e/T--Tec-Monterrey--Foto_AdrianR.jpg">
 +
      <b>Adrián Rodríguez</b>
 +
      <br>
 +
      <i>Collaborator</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperAdrianCollab, backgroundAdrianCollab, contentAdrianCollab)"></div>
 +
  </div> 
 +
<!---------------------------------------------------------- Caro ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundCaro">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperCaro">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperCaro, backgroundCaro, contentCaro)"></div>
 +
    <div class="popupBox popupContent" id="contentCaro">
 +
      <button id="closeCaro" class="closeButton" onclick="closePopup(wrapperCaro, backgroundCaro, contentCaro)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/2b/T--Tec-Monterrey--Foto_Caro.jpg">
 +
      <b>Carolina Elizondo</b>
 +
      <br>
 +
      <i>Advisor</i>
 +
      <br>
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperCaro, backgroundCaro, contentCaro)"></div>
 +
  </div>
 +
<!---------------------------------------------------------- Acevedo ------------------------------------------------------>
 +
  <div class="popupBackground" id="backgroundDavid">
 +
  </div>
 +
  <div class="popupWrapper" id="wrapperDavid">
 +
    <div class="popupContentLeft" onclick="closePopup(wrapperDavid, backgroundDavid, contentDavid)"></div>
 +
    <div class="popupBox popupContent" id="contentDavid">
 +
      <button id="closeDavid" class="closeButton" onclick="closePopup(wrapperDavid, backgroundDavid, contentDavid)">
 +
        <i class="fa fa-times"></i>
 +
      </button>
 +
      <img class="popupImage" src="https://static.igem.org/mediawiki/2018/2/2f/T--Tec-Monterrey--Foto_David.jpg">
 +
      <b>David Acevedo</b>
 +
      (Information Technologies)
 +
      <br>
 +
      <i>Collaborator / Web Developer</i>
 +
      <br>
 +
     
 +
    </div>
 +
    <div class="popupContentRight" onclick="closePopup(wrapperDavid, backgroundDavid, contentDavid)"></div>
 
   </div>
 
   </div>
  
Line 377: Line 1,308:
 
         $(".masthead").toggleClass("blurredBackground");
 
         $(".masthead").toggleClass("blurredBackground");
 
         $("#teamMembers").toggleClass("blurredBackground");
 
         $("#teamMembers").toggleClass("blurredBackground");
 +
        $("#pi1").toggleClass("blurredBackground");
 +
        $("#pi2").toggleClass("blurredBackground");
 +
        $("#instructor").toggleClass("blurredBackground");
 +
        $("#advisors").toggleClass("blurredBackground");
 +
        $("#collaborators").toggleClass("blurredBackground");
 
         $(".footer").toggleClass("blurredBackground");
 
         $(".footer").toggleClass("blurredBackground");
 +
        $(".sidebar").toggleClass("blurredBackground");
 +
        $("#navbar").toggleClass("blurredBackground");
 
         }, 200);
 
         }, 200);
 
       }
 
       }
Line 386: Line 1,324:
 
         $(".masthead").toggleClass("blurredBackground");
 
         $(".masthead").toggleClass("blurredBackground");
 
         $("#teamMembers").toggleClass("blurredBackground");
 
         $("#teamMembers").toggleClass("blurredBackground");
 +
        $("#pi1").toggleClass("blurredBackground");
 +
        $("#pi2").toggleClass("blurredBackground");
 +
        $("#instructor").toggleClass("blurredBackground");
 +
        $("#advisors").toggleClass("blurredBackground");
 +
        $("#collaborators").toggleClass("blurredBackground");
 
         $(".footer").toggleClass("blurredBackground");
 
         $(".footer").toggleClass("blurredBackground");
 +
        $(".sidebar").toggleClass("blurredBackground");
 +
        $("#navbar").toggleClass("blurredBackground");
 
         setTimeout(function (){
 
         setTimeout(function (){
 
           (wrapperName).style.display="none";
 
           (wrapperName).style.display="none";

Latest revision as of 01:11, 7 December 2018

Team
Learn about us
Team Members
Alan Ávila
Ana Lasso de la Vega
Victor Robledo
Sofía Lara
Carlos Cordero
Samantha Peña
Arnulfo Juarez
Lizeth Rubio
Esteban de la Peña
Andrés Sánchez
Miriam Salas
Adrián Hernández
Nora Torres
Jesús López
Valeria Fuentes
Juan Fernández
Roberto Vázquez
Miranda Iriarte
Primary PI's
José M. Aguilar
Cuauhtemoc Licona
Secondary PI
Luis M. Leal Garza
Instructor
R. Camilo Chávez
Advisors
Carolina Elizondo
Minerva Castellanos
José de J. García
Claudia N. Alonso
Javier Naya
J. Alberto de la Paz
Collaborators
Yvonne Cárdenas
David Acevedo
Maritza Reyes
Diego I. Valadez
María Eugenia Reyna
Adrián Rodríguez

Contact Us

Sponsors