Difference between revisions of "Team:RUM-UPRM/Members"

(Created page with "<html> <section class="projects-section bg-light" id="projects"> <div class="container"> <!-- The Team --> <div class="container">...")
 
 
(80 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
<html>
 
−
<section class="projects-section bg-light" id="projects">
 
−
            <div class="container">
 
  
−
                <!-- The Team -->
+
{{RUM-UPRM}}
−
                <div class="container">
+
{{RUM-UPRM/Nav}}
 +
 
 +
<html lang="en">
 +
<head>
 +
  <meta charset="utf-8">
 +
  <meta name="viewport" content="width=device-width, initial-scale=1">
 +
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
 +
 +
 
 +
<style>
 +
  body {
 +
    position: relative;
 +
     
 +
 
 +
  }
 +
  ul.nav-pills {
 +
    top: 150px;
 +
 
 +
position: sticky;
 +
top: 70px;
 +
    margin-left: 4em;
 +
    margin-top: 4em;
 +
    /*border-radius: 0px 15px 15px 0px;*/
 +
    max-width: 12vw;
 +
    overflow-wrap: break-word;
 +
    line-height: 1;
 +
    overflow: hidden;
 +
}
 +
 
 +
ul.nav {
 +
position: sticky;
 +
 
 +
  }
 +
  div.col-9 div {
 +
    height: 500px;
 +
width: 50px;
 +
    display: block;
 +
    text-decoration: none;
 +
    color: var(--dark);
 +
    font-size: 1em;
 +
    padding-left: 0.6em;
 +
    padding-top: 0.5em;
 +
    padding-bottom: 0.3em;
 +
    padding-right: 0.5em;
 +
    font-weight: 400;
 +
    position: relative;
 +
    z-index: 1;
 +
    overflow: hidden;
 +
    transition: all 0.5s
 +
  }
 +
.sticky {
 +
    position: relative;
 +
    top: 0;
 +
    width: 100%;
 +
}
 +
.myScrollspy {
 +
position: sticky;
 +
top: 70px;.scroll-spy
 +
    margin-left: 4em;
 +
    margin-top: 4em;
 +
    /*border-radius: 0px 15px 15px 0px;*/
 +
    max-width: 12vw;
 +
    overflow-wrap: break-word;
 +
    line-height: 1;
 +
    overflow: hidden;
 +
 
 +
}
 +
 
 +
.spy-list>a.selected {
 +
    border-left: 3px solid var(--accent2);
 +
    transition: all 0.2s;
 +
    font-weight: 700;
 +
}
 +
 
 +
 
 +
  </style>
 +
</head>
 +
<body data-spy="scroll" data-target="#myScrollspy" data-offset="1">
 +
 
 +
<div class="container-fluid" style= "background-color:#3BB9FF; height:100px; top: 200px">
 +
  <center><h1>Members</h1></center>
 +
</div>
 +
 
 +
 
 +
<div class="container-fluidtwo">
 +
  <div class="row">
 +
    <nav class="col-sm-2 col-3" id="myScrollspy">
 +
      <ul class="nav nav-pills">
 +
        <li class="nav-item">
 +
          <a class="nav-link active" href="#section1">Team Members </a>
 +
        </li>
 +
        <li class="nav-item">
 +
          <a class="nav-link" href="#section2">Advisors & PI's</a>
 +
        </li>
 +
        <li class="nav-item">
 +
          <a class="nav-link" href="#section3">Biographies</a>
 +
        </li>
 +
      </ul>
 +
    </nav>
 +
 
 +
 
 +
    <div class="col-sm-9 col-8; scroll"> <div align="justify">
 +
      <div id="section1">   
 +
        <center><h1>Team Members</h1></center>
 +
 
 +
        <center>
 +
 
 +
<style>
 +
.carousel {
 +
width: 60%; height:50%;
 +
}
 +
 
 +
.carousel-inner > .item > img,
 +
.carousel-inner > .item > a > img{
 +
width: 90;
 +
margin: auto;
 +
}
 +
.container{
 +
border: 3px;
 +
}
 +
.carousel-control-next,
 +
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
 +
 
 +
ol.carousel-indicators li,
 +
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
 +
 
 +
ol.carousel-indicators li {
 +
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
 +
 
 +
ol.carousel-indicators li.active {
 +
  background: white;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
 
 +
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" data-interval="false">
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
 +
    <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
 +
<li data-target="#carouselExampleIndicators" data-slide-to="3"></li>
 +
<li data-target="#carouselExampleIndicators" data-slide-to="4"></li>
 +
 
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/3/35/T--RUM-UPRM--team1.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/d/d4/T--RUM-UPRM--team2.png" alt="Second slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/thumb/d/d9/T--RUM-UPRM--Team4.jpg/800px-T--RUM-UPRM--Team4.jpg" alt="Third slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/4/4f/T--RUM-UPRM--CAMPCRVPOB.jpeg" alt="Third slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/2/20/T--RUM-UPRM--team3.png" alt="Third slide">
 +
    </div>
 +
 
 +
 
 +
 
 +
  </div>
 +
<div>
 +
  <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
 +
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Previous</span>
 +
</a>
 +
  <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
 +
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</center>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<section class="projects-section bg-light content" id="projects" style="background-size: 100%;margin-top: 0em;padding-top: 1.1em;" class="height-90 parallax">
 +
<div class="main-container" style="
 +
height: 100%;">
 +
      <div class="d-flex h-100 align-items-center">
 +
          <h1 class="mx-auto my-0 text-center">The Team</h1>
 +
      </div>
 +
      <div class="container" id="gallery"> <!-- data-toggle="modal" data-target="#exampleModal" -->
 +
                <!-- The Team --> 
 +
               
 
                   <div class="row">
 
                   <div class="row">
−
                     <!-- Team Member 1 -->
+
                     <!-- Team Member 1 [DATA-TARGET="#carouselExample" DATA-SLIDE-TO="#"] -->  
−
                     <div class="col-xl-3 col-md-6 mb-4">
+
                     <div class="col-xl-3 col-md-6 mb-4 card border-0 shadow">
−
                       <div class="card border-0 shadow">
+
                        
−
                         <img src="assets/img/Team-Pictures/IMG_5819.jpg" class="card-img-top" alt="...">
+
                        <img src="https://static.igem.org/mediawiki/2020/0/09/T--RUM-UPRM--Claudia3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body">
 +
                          <h5 class="card-title mb-0 text-center">Claudia Mañán Mejías</h5>
 +
                          <div class="card-text text-black-50 text-center">President & Engineering Team</div>
 +
                       
 +
                        </div>
 +
                  </div>
 +
                 
 +
                    <!-- Team Member 2 -->
 +
                    <div class="col-xl-3 col-md-6 mb-4 card border-0 shadow">
 +
                         <img src="https://static.igem.org/mediawiki/2020/4/4d/T--RUM-UPRM--LuisM1.jpeg" class="card-img-top" alt="..." data-target="#carouselExample" data-slide-to="1">
 +
                        <div class="card-body">
 +
                          <h5 class="card-title mb-0 text-center">Luis Montalvo González</h5>
 +
                          <div class="card-text text-black-50 text-center">Vice-President</div>
 +
                        </div>
 +
                 
 +
                    </div>
 +
                 
 +
                    <!-- Team Member 3 -->
 +
                    <div class="col-xl-3 col-md-6 mb-4 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/thumb/9/9d/T--RUM-UPRM--PAU.jpg/600px-T--RUM-UPRM--PAU.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body">
 +
                          <h5 class="card-title mb-0 text-center">Paula Mañán Mejías</h5>
 +
                          <div class="card-text text-black-50 text-center">Research Director</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                   
 +
                    <!-- Team Member 4 -->
 +
                    <div class="col-xl-3 col-md-6 mb-4 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/5/59/T--RUM-UPRM--Andrea3.jpeg" class="card-img-top" alt="..." data-target="#carouselExample" data-slide-to="3">
 
                         <div class="card-body text-center">
 
                         <div class="card-body text-center">
−
                           <h5 class="card-title mb-0">Team Member</h5>
+
                           <h5 class="card-title mb-0">Andrea Guilloty Rodríguez</h5>
−
                           <div class="card-text text-black-50">Web Developer</div>
+
                           <div class="card-text text-black-50">Financial Director</div>
 
                         </div>
 
                         </div>
−
                       </div>
+
                        
 
                     </div>
 
                     </div>
−
                    <!-- Team Member 2 -->
+
                  </div>
−
                    <div class="col-xl-3 col-md-6 mb-4">
+
                  <!-- /.row -->
−
                      <div class="card border-0 shadow">
+
               
−
                         <img src="https://source.unsplash.com/9UVmlIb0wJU/500x350" class="card-img-top" alt="...">
+
                <!-- /.container -->
 +
              <br></br>
 +
               
 +
                  <div class="row">
 +
                    <!-- Team Member 5 -->  
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                         <img src="https://static.igem.org/mediawiki/2020/1/14/T--RUM-UPRM--Elan3.jpeg" class="card-img-top" alt="...">
 
                         <div class="card-body text-center">
 
                         <div class="card-body text-center">
−
                           <h5 class="card-title mb-0">Team Member</h5>
+
                           <h5 class="card-title mb-0">Elan Reynoso Jiménez</h5>
−
                           <div class="card-text text-black-50">Web Developer</div>
+
                          <div class="card-text text-black-50">Secretary & Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                   
 +
                    <!-- Team Member 6 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/8/8c/T--RUM-UPRM--Mari2.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Marieli Ruiz Cortés</h5>
 +
                           <div class="card-text text-black-50">Marketing Director</div>
 
                         </div>
 
                         </div>
−
                       </div>
+
                        
 
                     </div>
 
                     </div>
−
                     <!-- Team Member 3 -->
+
                     <!-- Team Member 7 -->
−
                     <div class="col-xl-3 col-md-6 mb-4">
+
                     <div class="col-md-3 card border-0 shadow">
−
                      <div class="card border-0 shadow">
+
                         <img src="https://static.igem.org/mediawiki/2020/d/d1/T--RUM-UPRM--Natalia1.jpg" class="card-img-top" alt="...">
−
                         <img src="https://source.unsplash.com/sNut2MqSmds/500x350" class="card-img-top" alt="...">
+
 
                         <div class="card-body text-center">
 
                         <div class="card-body text-center">
−
                           <h5 class="card-title mb-0">Team Member</h5>
+
                           <h5 class="card-title mb-0">Natalia Ortiz Rivera</h5>
−
                           <div class="card-text text-black-50">Web Developer</div>
+
                           <div class="card-text text-black-50">Networking Director & Engineering Team</div>
 
                         </div>
 
                         </div>
−
                       </div>
+
                        
 
                     </div>
 
                     </div>
−
                     <!-- Team Member 4 -->
+
                     <!-- Team Member 8 -->
−
                     <div class="col-xl-3 col-md-6 mb-4">
+
                     <div class="col-md-3 card border-0 shadow">
−
                       <div class="card border-0 shadow">
+
                        <img src="https://static.igem.org/mediawiki/2020/c/c0/T--RUM-UPRM--Patricia4.jpeg" class="card-img-top" alt="...">
−
                         <img src="https://source.unsplash.com/ZI6p3i9SbVU/500x350" class="card-img-top" alt="...">
+
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Patricia Colom Díaz</h5>
 +
                          <div class="card-text text-black-50">Biology Team Leader</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                  </div>
 +
                  <!-- /.row -->
 +
               
 +
                <!-- /.container -->
 +
<br></br>
 +
                  <div class="row">
 +
                    <!-- Team Member 9 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/5/5b/T--RUM-UPRM--LuisG3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Luis García Cruz</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                  </div>
 +
                   
 +
                    <!-- Team Member 10 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/c/ca/T--RUM-UPRM--Elimar3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Elimar Uzcátegui Calderón</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 11 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/5/5d/T--RUM-UPRM--Elmer3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Elmer Ortiz Márquez</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 12 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/e/e2/T--RUM-UPRM--Melissa3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Melissa Cabrera Ruiz</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                  </div>
 +
                  <!-- /.row -->
 +
                <br></br>
 +
                  <div class="row">
 +
                    <!-- Team Member 13 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/4/4b/T--RUM-UPRM--Miguel3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Miguel Rodríguez Anavitate</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>  
 +
                        
 +
                  </div>
 +
                   
 +
                    <!-- Team Member 14 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                         <img src="https://static.igem.org/mediawiki/2020/b/b2/T--RUM-UPRM--Mari.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Amanda Ríos</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 15 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/4/40/T--RUM-UPRM--RIGO_.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Rigo Espiña Santiago</h5>
 +
                          <div class="card-text text-black-50">Biology Team</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 16 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/e/e1/T--RUM-UPRM--Gaby1.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Gabriela Otero Andino</h5>
 +
                          <div class="card-text text-black-50">Social Impact Leader</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                  </div>
 +
                  <!-- /.row -->
 +
                <br></br>
 +
                  <div class="row">
 +
                    <!-- Team Member 17 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/d/d8/T--RUM-UPRM--Emily3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Emily Echevarría Pérez</h5>
 +
                          <div class="card-text text-black-50">Social Impact</div>
 +
                        </div>
 +
                     
 +
                  </div>
 +
                   
 +
                    <!-- Team Member 18 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/a/a9/T--RUM-UPRM--ANAAA.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Ana Santiago Russe</h5>
 +
                          <div class="card-text text-black-50">Social Impact</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 19 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/b/ba/T--RUM-UPRM--Mariela3.jpeg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Mariela Rodríguez Otero</h5>
 +
                          <div class="card-text text-black-50">Engineering Team Leader</div>
 +
                        </div>
 +
                     
 +
                    </div><br></br>
 +
                    <!-- Team Member 20 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/c/c0/T--RUM-UPRM--CARLOSSS.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Carlos A. Leyva Capote</h5>
 +
                          <div class="card-text text-black-50">Wiki Programmer & Designer</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                  </div>
 +
                  <!-- /.row -->
 +
</div>
 +
 
 +
      <div id="section2">
 +
  <center><h1>Advisors & PI's</h1> </center>
 +
<br></br> <h4>Graduate Advisors</h4>
 +
                  <div class="row">
 +
                    <!-- Team Member 21 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/d/de/T--RUM-UPRM--Alejandro.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Alejandro J. Mercado Capote</h5>
 +
                          <div class="card-text text-black-50">Graduate Student Advisor</div>
 +
                        </div>
 +
                     
 +
                  </div>
 +
                    <br></br>
 +
                    <!-- Team Member 22 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/1/1c/T--RUM-UPRM--victor.jpg" class="card-img-top" alt="...">
 
                         <div class="card-body text-center">
 
                         <div class="card-body text-center">
−
                           <h5 class="card-title mb-0">Team Member</h5>
+
                           <h5 class="card-title mb-0">Victor O. López Ramirez</h5>
−
                           <div class="card-text text-black-50">Web Developer</div>
+
                           <div class="card-text text-black-50">Graduate Student Advisor</div>
 
                         </div>
 
                         </div>
 
                       </div>
 
                       </div>
 +
                    </div>
 +
<br></br>
 +
                <!-- /.row -->
 +
                  <h4>Primary Investigators</h4>
 +
                <center>  <div class="row">
 +
                    <!-- Team Member 23 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/9/9c/T--RUM-UPRM--PI2.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Dr. Carlos Ríos Velázquez</h5>
 +
                          <div class="card-text text-black-50">Co-Primary Investigator</div>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                    <!-- Team Member 24 -->
 +
                    <div class="col-md-3 card border-0 shadow">
 +
                        <img src="https://static.igem.org/mediawiki/2020/8/8b/T--RUM-UPRM--PI.jpg" class="card-img-top" alt="...">
 +
                        <div class="card-body text-center">
 +
                          <h5 class="card-title mb-0">Dr. Patricia Ortiz Bermúdez</h5>
 +
                          <div class="card-text text-black-50">Co-Primary Investigator</div> </center>
 +
                        </div>
 +
                     
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                   <!-- /.row -->
 
                   <!-- /.row -->
 +
                </div>
 +
                <!-- /.container -->
 +
</div>
 +
       
 +
      <div id="section3">       
 +
        <center> <h1>Biographies</h1> </center>
  
 +
<center>
  
−
                  <!--
 
−
                  <!-- Carousel Wrapper--
 
−
                  <div id="multi-item-example" class="carousel slide carousel-multi-item" data-ride="carousel">
 
  
−
                    <!--Controls--
+
<style>
−
                    <div class="controls-top">
+
.carousel {
−
                      <a class="btn-floating" href="#multi-item-example" data-slide="prev"><i class="fas fa-chevron-left"></i></a>
+
width: 60%; height:50%;
−
                      <a class="btn-floating" href="#multi-item-example" data-slide="next"><i class="fas fa-chevron-right"></i></a>
+
}
−
                    </div>
+
−
                    <!--/.Controls--
+
  
−
                    <!--Indicators--
+
.carousel-inner > .item > img,
−
                    <ol class="carousel-indicators">
+
.carousel-inner > .item > a > img{
−
                      <li data-target="#multi-item-example" data-slide-to="0"></li> <!-- class="active" --
+
width: 90;
−
                      <li data-target="#multi-item-example" data-slide-to="1"></li>
+
margin: auto;
−
                      <li data-target="#multi-item-example" data-slide-to="2"></li>
+
}
−
                    </ol>
+
.container{
−
                    <!--/.Indicators--
+
border: 3px;
 +
}
 +
.carousel-control-next,
 +
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
  
−
                    <!--Slides--
+
ol.carousel-indicators li,
−
                    <div class="carousel-inner" role="listbox">
+
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
  
−
                      <!--First slide--
+
ol.carousel-indicators li {
−
                      <div class="carousel-item active"> <!-- active --
+
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
ol.carousel-indicators li.active {
−
                          <div class="card border-0 shadow">
+
  background: gray;
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/4-col/img%20(34).jpg" alt="Card image cap">
+
}
−
                            <div class="card-body text-center">
+
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
−
                              <!--a class="btn btn-primary">Button</a--
+
−
                            </div>
+
−
                          </div>
+
  
−
                          <div class="">
 
−
                            <p class="card-text text-black-50">Wiki Programmer</p>
 
−
                          </div>
 
  
−
                        </div>
 
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
</style>
−
                          <div class="card border-0 shadow">
+
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/4-col/img%20(18).jpg" alt="Card image cap">
+
−
                            <div class="card-body text-center">
+
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
−
                              <!--a class="btn btn-primary">Button</a--
+
−
                            </div>
+
−
                          </div>
+
−
                        </div>
+
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
<div id="carouseldir" class="carousel slide" data-ride="carousel" data-interval="false">
−
                          <div class="card border-0 shadow">
+
  <ol class="carousel-indicators">
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Nature/4-col/img%20(35).jpg" alt="Card image cap">
+
    <li data-target="#carouseldir" data-slide-to="0" class="active"></li>
−
                            <div class="card-body text-center">
+
    <li data-target="#carouseldir" data-slide-to="1"></li>
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
    <li data-target="#carouseldir" data-slide-to="2"></li>
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
<li data-target="#carouseldir" data-slide-to="3"></li>
−
                              <!--a class="btn btn-primary">Button</a--
+
<li data-target="#carouseldir" data-slide-to="4"></li>
−
                            </div>
+
<li data-target="#carouseldir" data-slide-to="5"></li>
−
                          </div>
+
<li data-target="#carouseldir" data-slide-to="6"></li>
−
                        </div>
+
  
−
                      </div>
+
  </ol>
−
                      <!--/.First slide--
+
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/2/26/T--RUM-UPRM--claudia.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/e/e8/T--RUM-UPRM--LuisM.png" alt="Second slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/9/93/T--RUM-UPRM--Paula.png" alt="Third slide">
 +
    </div>
  
−
                      <!--Second slide--
+
<div class="carousel-item">
−
                      <div class="carousel-item">
+
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/d/df/T--RUM-UPRM--natalia.png" alt="Third slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/7/7c/T--RUM-UPRM--andrea.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/7/70/T--RUM-UPRM--elan.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/b/bd/T--RUM-UPRM--Marieli.png" alt="Second slide">
 +
    </div>
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
−
                          <div class="card border-0 shadow">
+
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/City/4-col/img%20(60).jpg" alt="Card image cap">
+
−
                            <div class="card-body text-center">
+
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
−
                              <!--a class="btn btn-primary">Button</a--
+
−
                            </div>
+
−
                          </div>
+
−
                        </div>
+
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
 
−
                          <div class="card border-0 shadow">
 
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/City/4-col/img%20(47).jpg" alt="Card image cap">
 
−
                            <div class="card-body text-center">
 
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
 
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
 
−
                              <!--a class="btn btn-primary">Button</a--
 
−
                            </div>
 
−
                          </div>
 
−
                        </div>
 
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
  </div>
−
                          <div class="card border-0 shadow">
+
  <a class="carousel-control-prev" href="#carouseldir" role="button" data-slide="prev">
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/City/4-col/img%20(48).jpg" alt="Card image cap">
+
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
−
                            <div class="card-body text-center">
+
    <span class="sr-only">Previous</span>
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
</a>
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
  <a class="carousel-control-next" href="#carouseldir" role="button" data-slide="next">
−
                              <!--a class="btn btn-primary">Button</a--
+
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
−
                            </div>
+
    <span class="sr-only">Next</span>
−
                          </div>
+
  </a>
−
                        </div>
+
</div>
 +
</center>
 +
<center><h2>Executive Board </h2></center>
 +
<br></br>
  
−
                      </div>
 
−
                      <!--/.Second slide--
 
  
−
                      <!--Third slide--
+
<center>
−
                      <div class="carousel-item">
+
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
<style>
−
                          <div class="card border-0 shadow">
+
.carousel {
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Food/4-col/img%20(53).jpg" alt="Card image cap">
+
width: 60%; height:50%;
−
                            <div class="card-body text-center">
+
}
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
−
                              <!--a class="btn btn-primary">Button</a--
+
−
                            </div>
+
−
                          </div>
+
−
                        </div>
+
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
.carousel-inner > .item > img,
−
                          <div class="card border-0 shadow">
+
.carousel-inner > .item > a > img{
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Food/4-col/img%20(45).jpg" alt="Card image cap">
+
width: 90;
−
                            <div class="card-body text-center">
+
margin: auto;
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
}
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
.container{
−
                              <!--a class="btn btn-primary">Button</a--
+
border: 3px;
−
                            </div>
+
}
−
                          </div>
+
.carousel-control-next,
−
                        </div>
+
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
  
−
                        <div class="col-xl-3 col-md-6 mb-4">
+
ol.carousel-indicators li,
−
                          <div class="card border-0 shadow">
+
ol.carousel-indicators li.active {
−
                            <img class="card-img-top" src="https://mdbootstrap.com/img/Photos/Horizontal/Food/4-col/img%20(51).jpg" alt="Card image cap">
+
  width: 1rem;
−
                            <div class="card-body text-center">
+
  height: 1rem;
−
                              <h5 class="card-title mb-0">Carlos Leyva Capote</h5>
+
  margin: 0;
−
                              <p class="card-text text-black-50">Wiki Programmer</p>
+
  border-radius: 50%;
−
                              <!--a class="btn btn-primary">Button</a--
+
  border: 0;
−
                            </div>
+
  background: transparent;
−
                          </div>
+
}
−
                        </div>
+
  
−
                      </div>
+
ol.carousel-indicators li {
−
                      <!--/.Third slide--
+
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
  
−
                    </div>
+
ol.carousel-indicators li.active {
−
                    <!--/.Slides--
+
  background: gray;
 +
}
  
−
                  </div>
 
−
                  <!--/.Carousel Wrapper -->
 
  
  
 +
</style>
  
−
                </div>
+
<div id="carouselbiol" class="carousel slide" data-ride="carousel" data-interval="false">
−
                <!-- /.container -->
+
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselbiol" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselbiol" data-slide-to="1"></li>
 +
    <li data-target="#carouselbiol" data-slide-to="2"></li>
 +
<li data-target="#carouselbiol" data-slide-to="3"></li>
 +
<li data-target="#carouselbiol" data-slide-to="4"></li>
 +
<li data-target="#carouselbiol" data-slide-to="5"></li>
 +
<li data-target="#carouselbiol" data-slide-to="6"></li>
 +
<li data-target="#carouselbiol" data-slide-to="7"></li>
 +
<li data-target="#carouselbiol" data-slide-to="8"></li>
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/0/02/T--RUM-UPRM--patricia.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/e/e2/T--RUM-UPRM--elmer.png" alt="Second slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/b/be/T--RUM-UPRM--amanda.png" alt="Third slide">
 +
    </div>
  
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/3/35/T--RUM-UPRM--rigo.png
 +
" alt="Third slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/0/0c/T--RUM-UPRM--elimar.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/6/63/T--RUM-UPRM--miguel.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/c/ca/T--RUM-UPRM--LuisG.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/4/43/T--RUM-UPRM--melissa.png" alt="Second slide">
 +
    </div>
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/7/70/T--RUM-UPRM--elan.png" alt="Second slide">
 +
    </div>
  
−
                <!-- Featured Project Row-->
+
−
                <div class="row align-items-center no-gutters mb-4 mb-lg-5">
+
 
−
                    <div class="col-xl-8 col-lg-7">
+
 
−
                        <img class="img-fluid mb-3 mb-lg-0" src="assets/img/bg-masthead.jpg" alt="" /> <!-- https://www.dangerous-business.com/visiting-vieques-puerto-rico/ -->
+
  </div>
−
                    </div>
+
  <a class="carousel-control-prev" href="#carouselbiol" role="button" data-slide="prev">
−
                    <div class="col-xl-4 col-lg-5">
+
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
−
                        <div class="featured-text text-center text-lg-left">
+
    <span class="sr-only">Previous</span>
−
                            <h4>Shoreline</h4>
+
</a>
−
                            <p class="text-black-50 mb-0">A cool photo. There is really not much to say. It's the same photo you saw at the top of the page. Try scaling the webpage and see how everything moves. Pretty responsive!</p>
+
  <a class="carousel-control-next" href="#carouselbiol" role="button" data-slide="next">
−
                        </div>
+
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
−
                    </div>
+
    <span class="sr-only">Next</span>
−
                </div>
+
  </a>
−
                <!-- Project One Row-->
+
</div>
−
                <div class="row justify-content-center no-gutters mb-5 mb-lg-0">
+
</center>
−
                    <div class="col-lg-6"><img class="img-fluid" src="assets/img/demo-image-01.jpg" alt=""/></div>
+
<center><h2>Biology Team </h2></center>
−
                    <div class="col-lg-6">
+
<br></br>
−
                        <div class="bg-black text-center h-100 project">
+
 
−
                            <div class="d-flex h-100">
+
 
−
                                <div class="project-text w-100 my-auto text-center text-lg-left">
+
<center>
−
                                    <h4 class="text-white">Misty</h4>
+
 
−
                                    <p class="mb-0 text-white-50">Another example of where you can put an image of the project, or anything else, along with a description. </p>
+
<style>
−
                                    <hr class="d-none d-lg-block mb-0 ml-0" />
+
.carousel {
−
                                </div>
+
width: 60%; height:50%;
−
                            </div>
+
}
−
                        </div>
+
 
−
                    </div>
+
.carousel-inner > .item > img,
−
                </div>
+
.carousel-inner > .item > a > img{
−
                <!-- Project Two Row-->
+
width: 90;
−
                <div class="row justify-content-center no-gutters">
+
margin: auto;
−
                    <div class="col-lg-6"><img class="img-fluid" src="assets/img/demo-image-02.jpg" alt="" /></div>
+
}
−
                    <div class="col-lg-6 order-lg-first">
+
.container{
−
                        <div class="bg-black text-center h-100 project">
+
border: 3px;
−
                            <div class="d-flex h-100">
+
}
−
                                <div class="project-text w-100 my-auto text-center text-lg-right">
+
.carousel-control-next,
−
                                    <h4 class="text-white">Mountains</h4>
+
.carousel-control-prev {
−
                                    <p class="mb-0 text-white-50">At this point I don't know what to write so I'll just invent some words. Scarapaduya, postimastacular, and contevertabrae!</p>
+
    filter:invert(100%);
−
                                    <hr class="d-none d-lg-block mb-0 mr-0" />
+
}
−
                                </div>
+
ol.carousel-indicators {
−
                            </div>
+
  position: absolute;
−
                        </div>
+
  bottom: 5px;
−
                    </div>
+
  margin: 0;
−
                </div>
+
  left: 0;
−
            </div>
+
  right: 0;
−
        </section>
+
  width: auto;
 +
}
 +
 
 +
ol.carousel-indicators li,
 +
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
 +
 
 +
ol.carousel-indicators li {
 +
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
 +
 
 +
ol.carousel-indicators li.active {
 +
  background: gray;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
 
 +
<div id="carouselinge" class="carousel slide" data-ride="carousel" data-interval="false">
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselinge" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselinge" data-slide-to="1"></li>
 +
    <li data-target="#carouselinge" data-slide-to="2"></li>
 +
<li data-target="#carouseldir" data-slide-to="3"></li>
 +
 +
 
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/e/e9/T--RUM-UPRM--mariela.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/d/df/T--RUM-UPRM--natalia.png" alt="Second slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/2/26/T--RUM-UPRM--claudia.png" alt="Third slide">
 +
    </div>
 +
 
 +
<div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/a/ac/T--RUM-UPRM--Carlos.png" alt="Third slide">
 +
    </div>
 +
 +
 
 +
 
 +
  </div>
 +
  <a class="carousel-control-prev" href="#carouselinge" role="button" data-slide="prev">
 +
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Previous</span>
 +
</a>
 +
  <a class="carousel-control-next" href="#carouselinge" role="button" data-slide="next">
 +
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</center>
 +
<center><h2>Engineering Team </h2></center>
 +
<br></br>
 +
 
 +
<center>
 +
 
 +
<style>
 +
.carousel {
 +
width: 60%; height:50%;
 +
}
 +
 
 +
.carousel-inner > .item > img,
 +
.carousel-inner > .item > a > img{
 +
width: 90;
 +
margin: auto;
 +
}
 +
.container{
 +
border: 3px;
 +
}
 +
.carousel-control-next,
 +
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
 +
 
 +
ol.carousel-indicators li,
 +
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
 +
 
 +
ol.carousel-indicators li {
 +
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
 +
 
 +
ol.carousel-indicators li.active {
 +
  background: gray;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
 
 +
<div id="carouselsocial" class="carousel slide" data-ride="carousel" data-interval="false">
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselsocial" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselsocial" data-slide-to="1"></li>
 +
    <li data-target="#carouselsocial" data-slide-to="2"></li>
 +
 
 +
 +
 
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/d/d1/T--RUM-UPRM--gabriela.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/3/3b/T--RUM-UPRM--emily.png" alt="Second slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/c/cb/T--RUM-UPRM--ana.png" alt="Third slide">
 +
    </div>
 +
 
 +
 
 +
 +
 
 +
 
 +
  </div>
 +
  <a class="carousel-control-prev" href="#carouselsocial" role="button" data-slide="prev">
 +
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Previous</span>
 +
</a>
 +
  <a class="carousel-control-next" href="#carouselsocial" role="button" data-slide="next">
 +
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</center>
 +
<center><h2>Social Impact Team </h2></center>
 +
<br></br>
 +
 
 +
<center>
 +
 
 +
<style>
 +
.carousel {
 +
width: 60%; height:50%;
 +
}
 +
 
 +
.carousel-inner > .item > img,
 +
.carousel-inner > .item > a > img{
 +
width: 90;
 +
margin: auto;
 +
}
 +
.container{
 +
border: 3px;
 +
}
 +
.carousel-control-next,
 +
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
 +
 
 +
ol.carousel-indicators li,
 +
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
 +
 
 +
ol.carousel-indicators li {
 +
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
 +
 
 +
ol.carousel-indicators li.active {
 +
  background: gray;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
 
 +
<div id="carouselad" class="carousel slide" data-ride="carousel" data-interval="false">
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselad" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselad" data-slide-to="1"></li>
 +
 
 +
 
 +
 +
 
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/8/80/T--RUM-UPRM--VictorbioOFICIAL.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/parts/b/bc/T--RUM-UPRM--alejandro24.png" alt="Second slide">
 +
    </div>
 +
 
 +
 
 +
 
 +
 +
 
 +
 
 +
  </div>
 +
  <a class="carousel-control-prev" href="#carouselad" role="button" data-slide="prev">
 +
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Previous</span>
 +
</a>
 +
  <a class="carousel-control-next" href="#carouselad" role="button" data-slide="next">
 +
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</center>
 +
<center><h2>Graduate Advisors </h2></center>
 +
<br></br>
 +
 
 +
<center>
 +
 
 +
<style>
 +
.carousel {
 +
width: 60%; height:50%;
 +
}
 +
 
 +
.carousel-inner > .item > img,
 +
.carousel-inner > .item > a > img{
 +
width: 90;
 +
margin: auto;
 +
}
 +
.container{
 +
border: 3px;
 +
}
 +
.carousel-control-next,
 +
.carousel-control-prev {
 +
    filter:invert(100%);
 +
}
 +
ol.carousel-indicators {
 +
  position: absolute;
 +
  bottom: 5px;
 +
  margin: 0;
 +
  left: 0;
 +
  right: 0;
 +
  width: auto;
 +
}
 +
 
 +
ol.carousel-indicators li,
 +
ol.carousel-indicators li.active {
 +
  width: 1rem;
 +
  height: 1rem;
 +
  margin: 0;
 +
  border-radius: 50%;
 +
  border: 0;
 +
  background: transparent;
 +
}
 +
 
 +
ol.carousel-indicators li {
 +
  background: rgba(192,192,192,0.7);
 +
  margin-left: .5rem;
 +
  margin-right: .5rem;
 +
}
 +
 
 +
ol.carousel-indicators li.active {
 +
  background: gray;
 +
}
 +
 
 +
 
 +
 
 +
</style>
 +
 
 +
<div id="carouselpi" class="carousel slide" data-ride="carousel" data-interval="false">
 +
  <ol class="carousel-indicators">
 +
    <li data-target="#carouselpi" data-slide-to="0" class="active"></li>
 +
    <li data-target="#carouselpi" data-slide-to="1"></li>
 +
 
 +
 
 +
 +
 
 +
  </ol>
 +
  <div class="carousel-inner">
 +
    <div class="carousel-item active">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/parts/9/96/T--RUM-UPRM--Dr.Rios21.png" alt="First slide">
 +
    </div>
 +
    <div class="carousel-item">
 +
      <img class="d-block w-100" img src="https://static.igem.org/mediawiki/2020/c/c7/T--RUM-UPRM--Victorbio.png" alt="Second slide">
 +
    </div>
 +
 
 +
 
 +
 
 +
 +
 
 +
 
 +
  </div>
 +
  <a class="carousel-control-prev" href="#carouselpi" role="button" data-slide="prev">
 +
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Previous</span>
 +
</a>
 +
  <a class="carousel-control-next" href="#carouselpi" role="button" data-slide="next">
 +
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
    <span class="sr-only">Next</span>
 +
  </a>
 +
</div>
 +
</center>
 +
</div>
 +
 
 +
</div>
 +
    </div>
 +
  </div>
 +
</div>
 +
</div>
 +
<center><h2>Principal Investigators</h2></center>
 +
<br></br>
 +
<script>
 +
window.onscroll = function() {myFunction()};
 +
 
 +
var myScrollspy = document.getElementById("myScrollspy");
 +
var sticky = myScrollspy.offsetTop+70px;
 +
 
 +
function myFunction() {
 +
  if (window.pageYOffset >= sticky) {
 +
    myScrollspy.classList.add("sticky")
 +
  } else {
 +
    myScrollspy.classList.remove("sticky");
 +
  }
 +
}
 +
</script>
 
 +
</body>
 
</html>
 
</html>
 +
 +
{{RUM-UPRM/Footer}}

Latest revision as of 04:00, 28 October 2020



RUM-UPRM Wiki Source Code

Members

Team Members

The Team

Advisors & PI's



Graduate Advisors

...
Alejandro J. Mercado Capote
Graduate Student Advisor


...
Victor O. López Ramirez
Graduate Student Advisor


Primary Investigators

...
Dr. Carlos Ríos Velázquez
Co-Primary Investigator
...
Dr. Patricia Ortiz Bermúdez
Co-Primary Investigator

Biographies

Executive Board



Biology Team



Engineering Team



Social Impact Team



Graduate Advisors



Principal Investigators