Difference between revisions of "Team:Pumas Mexico/Team"

Line 1: Line 1:
{{Pumas_Mexico}}
 
 
<html>
 
<html>
 
<head>
 
<head>
Line 145: Line 144:
 
z-index: 1;
 
z-index: 1;
 
}
 
}
 +
#img {
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    position: relative;
 +
  }
  
 +
.hovereffect {
 +
  width: 100%;
 +
  height: 100%;
 +
  float: left;
 +
  overflow: hidden;
 +
  position: relative;
 +
  text-align: center;
 +
  cursor: default;
 +
}
  
 +
.hovereffect .overlay {
 +
  position: absolute;
 +
  overflow: hidden;
 +
  opacity: 0;
 +
  filter: alpha(opacity=0);
 +
  width: 55%;
 +
  height: 81%;
 +
  left: 22%;
 +
  top: 10%;
 +
  border-radius: 80%;
 +
  border: 2px solid #FFF;
 +
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
 +
  transition: opacity 0.35s, transform 0.35s;
 +
  -webkit-transform: translate3d(50%,50%,0);
 +
  transform: translate3d(50%,50%,0);
 +
}
  
 +
.hovereffect:hover .overlay {
 +
  background-color: rgba(0,0,0,0.3);
 +
}
 +
 +
.hovereffect img {
 +
  display: block;
 +
  position: relative;
 +
  -webkit-transition: all 0.35s;
 +
  transition: all 0.35s;
 +
}
 +
 +
.hovereffect:hover img {
 +
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feComponentTransfer color-interpolation-filters="sRGB"><feFuncR type="linear" slope="1.4" /><feFuncG type="linear" slope="1.4" /><feFuncB type="linear" slope="1.4" /></feComponentTransfer></filter></svg>#filter');
 +
  filter: brightness(1.4);
 +
  -webkit-filter: brightness(1.4);
 +
}
 +
 +
.hovereffect h2 {
 +
  text-transform: uppercase;
 +
  text-align: center;
 +
  position: relative;
 +
  font-size: 17px;
 +
  padding: 10px;
 +
  background-color: transparent;
 +
  color: #FFF;
 +
  padding: 1em 0;
 +
  opacity: 0;
 +
  filter: alpha(opacity=0);
 +
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
 +
  transition: opacity 0.35s, transform 0.35s;
 +
  -webkit-transform: translate3d(-150%,-400%,0);
 +
  transform: translate3d(-150%,-400%,0);
 +
}
 +
 +
.hovereffect a, .hovereffect p {
 +
  color: #FFF;
 +
  padding: 1em 0;
 +
  opacity: 0;
 +
  filter: alpha(opacity=0);
 +
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
 +
  transition: opacity 0.35s, transform 0.35s;
 +
  -webkit-transform: translate3d(-150%,-400%,0);
 +
  transform: translate3d(-150%,-400%,0);
 +
}
 +
 +
.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2, .hovereffect:hover .overlay {
 +
  opacity: 1;
 +
  filter: alpha(opacity=100);
 +
  -webkit-transform: translate3d(0,0,0);
 +
  transform: translate3d(0,0,0);
 +
}
  
  
Line 156: Line 237:
 
<body>
 
<body>
 
<center>
 
<center>
<img src="https://static.igem.org/mediawiki/2016/3/3c/T--Pumas_Mexico--Portada.jpg" width="864" height="312" >
+
<div class="column full_size">
 +
<<img src="https://static.igem.org/mediawiki/2016/3/3c/T--Pumas_Mexico--Portada.jpg" style="width:100%">
  
 +
 +
</div>
 +
</center>
 
</DIV>
 
</DIV>
 
</p>
 
</p>
<center>
+
 
<p>
+
 
 
<header>
 
<header>
   <div id="apDiv1">
+
    
 
   <font face="Arial, Helvetica, sans-serif">
 
   <font face="Arial, Helvetica, sans-serif">
 
   <center>
 
   <center>
   <nav>
+
   <nav align="center">
 
   <ul>
 
   <ul>
</p>
 
<li><a href=""  style="text-decoration:none"><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/2/29/T--Pumas_Mexico--Icon1.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">HOME</font></a></li>
 
  
<li><a href=""><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/4/4a/T--Pumas_Mexico--Icon2.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">TEAM</font></a><ul>
+
<li><a href="" style="text-decoration:none"><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/2/29/T--Pumas_Mexico--Icon1.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">HOME</font></a></li>
 +
 
 +
<li><a href="" style="text-decoration:none"><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/4/4a/T--Pumas_Mexico--Icon2.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">TEAM</font></a><ul>
  
 
<li><a href="https://2016.igem.org/Team:Pumas_Mexico/Team"  style="text-decoration:none"><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">Team</font></a></li>
 
<li><a href="https://2016.igem.org/Team:Pumas_Mexico/Team"  style="text-decoration:none"><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">Team</font></a></li>
Line 178: Line 263:
 
</ul>
 
</ul>
  
<li><a href=""><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/6/6f/T--Pumas_Mexico--Icon3.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">PROJECT</font></a>
+
<li><a href="" style="text-decoration:none"><span class=""><i><br><img src="https://static.igem.org/mediawiki/2016/6/6f/T--Pumas_Mexico--Icon3.png"> </i></span><font color="#FFFFFF" face="Lucida Sans Unicode, Lucida Grande, sans-serif">PROJECT</font></a>
 
<ul>
 
<ul>
  
Line 239: Line 324:
  
 
</ul></li>
 
</ul></li>
 +
</nav>
 +
</header>
 +
<table border="0" align="center">
 +
<tr>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--ccn.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Carolina Guadalupe Cruz Núñez</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 
</div>
 
</div>
<div class="column full_size" >
+
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--zda.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Zabdiel Díaz Morales</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 
</div>
 
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--iaa.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Ilse  </h2>
 +
                <h2>Alonso Anaya</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 
</div>
 
</div>
<BR>
+
</td>
<BR>
+
<td>
<h5>Inspiration</h5>
+
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
<p>You can look at what other teams did to get some inspiration! <br />
+
    <div class="hovereffect">
Here are a few examples:</p>
+
        <img class="img-responsive" src="loc.jpg" alt="">
<ul>
+
            <div class="overlay">
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">METU Turkey </a></li>
+
                <h2>Paola Benítez Trejo</h2>
<li><a href="https://2014.igem.org/Team:Colombia/Members">Colombia</a></li>
+
<p>
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
+
Biología
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
+
</p>  
</ul>
+
            </div>
 
+
    </div>
 
</div>
 
</div>
 
+
</td>
<div class="column half_size" >
+
</tr>
<h5>What should this page contain?</h5>
+
<tr>
<ul>
+
<td>
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
+
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
<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>
+
    <div class="hovereffect">
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
+
        <img class="img-responsive" src="T--Pumas_Mexico--gil.jpg" alt="">
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
+
            <div class="overlay">
</ul>
+
                <h2>Carlos Andrés </h2>
 +
<h2>Gil Gómez </h2><p>
 +
Biología
 +
</p>  
 +
            </div>
 +
    </div>
 
</div>
 
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--fra.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Franklin Cruz Villegas</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="loc.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>José Carlos Barrioz Osorio</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="loc.jpg"alt="">
 +
            <div class="overlay">
 +
                <h2>Joaquin  </h2>
 +
                <h2>Espinoza Evelio</h2>
 +
<p>
 +
Ing Mecatronica
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
</tr>
 +
<tr>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--ebv.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Enrique </h2>
 +
                <h2> Zeferino Barrera Vargas</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--agb.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Alejandro </h2>
 +
                  <h2>Guzman Vendrell</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--hmix.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2> Ilia Xrysw</h2>
 +
<h2>Hernandez Mejia </h2>
 +
<p>
 +
                    QFB
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="T--Pumas_Mexico--le.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Laura Elena figueroa Bravo</h2>
 +
<p>
 +
Medicina
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
</tr>
 +
<tr>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="loc.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Evelyn </h2> <h2> Polaco Mendoza</h2>
 +
<p>
 +
Biología
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="loc.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Alán Fernando Muñoz González
  
 
+
</h2>
 
+
<p>
 
+
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
<td>
 +
<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">
 +
    <div class="hovereffect">
 +
        <img class="img-responsive" src="loc.jpg" alt="">
 +
            <div class="overlay">
 +
                <h2>Anastacia Hernández Koutoucheva</h2>
 +
<p>
 +
LINK HERE
 +
</p>
 +
            </div>
 +
    </div>
 +
</div>
 +
</td>
 +
</tr>
 +
</table>
 
</html>
 
</html>

Revision as of 02:45, 18 October 2016

Pumas_Mexico

<

Carolina Guadalupe Cruz Núñez

Biología

Zabdiel Díaz Morales

Biología

Ilse

Alonso Anaya

Biología

Paola Benítez Trejo

Biología

Carlos Andrés

Gil Gómez

Biología

Franklin Cruz Villegas

Biología

José Carlos Barrioz Osorio

Biología

Joaquin

Espinoza Evelio

Ing Mecatronica

Enrique

Zeferino Barrera Vargas

Biología

Alejandro

Guzman Vendrell

Biología

Ilia Xrysw

Hernandez Mejia

QFB

Laura Elena figueroa Bravo

Medicina

Evelyn

Polaco Mendoza

Biología

Alán Fernando Muñoz González

Anastacia Hernández Koutoucheva

LINK HERE