Difference between revisions of "Team:TecCEM/Experiments"

m
Line 2: Line 2:
 
<html>
 
<html>
 
<style>
 
<style>
−
.index {
+
    .wrapper {
−
    position: sticky;
+
        display: flex;
−
    top: 300px;
+
        align-items: stretch;
−
    z-index: 999;
+
        width: 100%;
−
    margin:0;
+
     }
−
     padding:1px;
+
 
−
}
+
    .sidebar-index {
−
@media (max-width: 1520px){
+
        width: 20%;
−
div.container{
+
        position: sticky;
−
    padding-left: 15%;
+
        align-self: flex-start;
−
}
+
        top: 70px;
−
}
+
        z-index: 900;
−
.index .dropdown {
+
        margin: 0;
−
    position: absolute;
+
        padding: 1rem;
−
    left: 0px;
+
    }
−
    width:17%;
+
 
−
}
+
    .wrapper .content {
−
.index span.bottom {
+
        width: 80%;
−
    background-color: black;
+
     }
−
    vertical-align: middle;
+
 
−
    margin-right: 0.5rem;
+
    .sidebar-index .dropdown {
−
}
+
        position: absolute;
−
div.container.index .dropdown-menu {
+
        left: 0px;
−
    background-color: white;
+
    }
−
     border-radius: 0;
+
    .sidebar-index a:hover{
−
    left: 10px !important;
+
        text-decoration: none;
−
}
+
    }
−
div.container.index .dropdown-menu a,
+
    .sidebar-index a:visited{
−
div.container.index .dropdown-menu a:visited {
+
        color: inherit;
−
    color: #333333;
+
    }
−
}
+
    .sidebar-index span.bottom {
−
div.container.index .dropdown-menu a:hover {
+
        background-color: black;
−
    color: black;
+
        vertical-align: middle;
−
}
+
     }
−
div.container.index button.btn {
+
−
    background-color: transparent;
+
−
    width:100%;
+
−
     white-space: normal;
+
−
}
+
 
</style>
 
</style>
 
<div id="gif-title">
 
<div id="gif-title">
Line 46: Line 41:
 
     <h1>Experiments</h1>
 
     <h1>Experiments</h1>
 
</div>
 
</div>
−
<div class="container index">
+
<div class="wrapper">
−
     <div class="dropdown">
+
     <nav class="sidebar-index">
−
         <button class="btn" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true"
+
         <div class="sidebar-header">
−
             aria-expanded="false">
+
             <h3>Project/ Experiments</h3>
−
<p>Project/ Experiments</p>
+
            <a href="#experimentsSubmenu" data-toggle="collapse" aria-expanded="false"><span class="d-inline-block bottom"></span>
−
<span class="bottom">
+
                <p class="d-inline">Index</p>
−
</span><p style="display:inline-block">Index</p>
+
             </a>
−
        </button>
+
−
        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+
−
            <a class="dropdown-item" href="#description">Description</a>
+
−
            <a class="dropdown-item" href="#wsc">What should this page contain?</a>
+
−
             <a class="dropdown-item" href="#inspiration">Inspiration</a>
+
 
         </div>
 
         </div>
−
    </div>
+
        <ul class="collapse list-unstyled" id="experimentsSubmenu">
−
</div>
+
            <li class="active">
−
<div class="container first-container" id="description">
+
                <a href="#description">Description</a>
−
    <div class="row">
+
            </li>
−
        <div class="col">
+
            <li>
−
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eu orci non felis suscipit viverra id et
+
                <a href="#wsc">What should this page contain?</a>
−
                metus. In quis nunc eget ligula tincidunt placerat. Integer pulvinar nisi a erat porttitor, in tempus
+
            </li>
−
                lectus consectetur. Donec eget mi aliquet, vulputate risus in, dignissim ligula. Vivamus sit amet
+
            <li>
−
                ornare felis. Nunc imperdiet rutrum dui quis porttitor. Nulla eget risus arcu. Morbi placerat aliquet
+
                <a href="#inspiration">Inspiration</a>
−
                nisl, id semper neque lobortis et. Aenean ullamcorper turpis in massa lobortis rutrum. Proin viverra,
+
            </li>
−
                nulla id aliquet molestie, justo justo finibus augue, in ullamcorper nisl libero ut nisl. Quisque
+
        </ul>
−
                imperdiet luctus ipsum nec porta. Vivamus et ex id nunc porttitor laoreet.
+
    </nav>
−
            </p>
+
    <div class="content">
−
        </div>
+
        <div class="container-fluid first-container" id="description">
−
    </div>
+
            <div class="row">
−
</div>
+
                <div class="col">
−
<div class="container" id="wsc">
+
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eu orci non felis suscipit
−
    <div class="row">
+
                        viverra id
−
        <div class="col">
+
                        et
−
            <h3>What should this page contain?</h3>
+
                        metus. In quis nunc eget ligula tincidunt placerat. Integer pulvinar nisi a erat porttitor, in
−
            <ul>
+
                        tempus
−
                <li> Protocols </li>
+
                        lectus consectetur. Donec eget mi aliquet, vulputate risus in, dignissim ligula. Vivamus sit
−
                <li> Experiments </li>
+
                        amet
−
                <li> Documentation of the development of your project </li>
+
                        ornare felis. Nunc imperdiet rutrum dui quis porttitor. Nulla eget risus arcu. Morbi placerat
−
            </ul>
+
                        aliquet
−
            <p>Etiam aliquet lacinia orci, eu maximus massa vestibulum sit amet. Quisque id metus eget magna egestas
+
                        nisl, id semper neque lobortis et. Aenean ullamcorper turpis in massa lobortis rutrum. Proin
−
                mattis. Vivamus quam orci, facilisis in ullamcorper ac, faucibus ac enim. Cras egestas quam eget justo
+
                        viverra,
−
                euismod commodo vitae a libero. Morbi mattis aliquet leo, sit amet tempus enim viverra vel. Quisque
+
                        nulla id aliquet molestie, justo justo finibus augue, in ullamcorper nisl libero ut nisl.
−
                tincidunt dignissim ex eget molestie. Donec aliquam quam et turpis porttitor, efficitur malesuada
+
                        Quisque
−
                lectus ultrices. Nunc venenatis lacus vel ultrices pellentesque.</p>
+
                        imperdiet luctus ipsum nec porta. Vivamus et ex id nunc porttitor laoreet.
−
            <p>Curabitur sit amet suscipit enim. Quisque scelerisque hendrerit odio id egestas. Morbi consectetur
+
                    </p>
−
                ultrices tortor, vitae tempus enim vestibulum nec. Nam eget auctor quam. Curabitur feugiat venenatis
+
                </div>
−
                lorem, quis interdum nibh dapibus et. Donec porttitor dui quis arcu facilisis rhoncus. Praesent vitae
+
            </div>
−
                dolor nisl. Cras vel cursus erat. Donec dictum massa urna, sed tempus libero pharetra eget. Duis
+
−
                ultricies neque in rutrum ullamcorper. </p>
+
 
         </div>
 
         </div>
 +
        <div class="container-fluid" id="wsc">
 +
            <div class="row">
 +
                <div class="col">
 +
                    <h3>What should this page contain?</h3>
 +
                    <ul>
 +
                        <li> Protocols </li>
 +
                        <li> Experiments </li>
 +
                        <li> Documentation of the development of your project </li>
 +
                    </ul>
 +
                    <p>Etiam aliquet lacinia orci, eu maximus massa vestibulum sit amet. Quisque id metus eget magna
 +
                        egestas
 +
                        mattis. Vivamus quam orci, facilisis in ullamcorper ac, faucibus ac enim. Cras egestas quam
 +
                        eget
 +
                        justo
 +
                        euismod commodo vitae a libero. Morbi mattis aliquet leo, sit amet tempus enim viverra vel.
 +
                        Quisque
 +
                        tincidunt dignissim ex eget molestie. Donec aliquam quam et turpis porttitor, efficitur
 +
                        malesuada
 +
                        lectus ultrices. Nunc venenatis lacus vel ultrices pellentesque.</p>
 +
                    <p>Curabitur sit amet suscipit enim. Quisque scelerisque hendrerit odio id egestas. Morbi
 +
                        consectetur
 +
                        ultrices tortor, vitae tempus enim vestibulum nec. Nam eget auctor quam. Curabitur feugiat
 +
                        venenatis
 +
                        lorem, quis interdum nibh dapibus et. Donec porttitor dui quis arcu facilisis rhoncus. Praesent
 +
                        vitae
 +
                        dolor nisl. Cras vel cursus erat. Donec dictum massa urna, sed tempus libero pharetra eget.
 +
                        Duis
 +
                        ultricies neque in rutrum ullamcorper. </p>
 +
                </div>
  
−
    </div>
+
            </div>
−
</div>
+
        </div>
−
<div class="container" id="inspiration">
+
        <div class="container-fluid" id="inspiration">
−
    <div class="row">
+
            <div class="row">
−
        <div class="col">
+
                <div class="col">
−
            <h3>Inspiration</h3>
+
                    <h3>Inspiration</h3>
−
            <ul>
+
                    <ul>
−
                <li><a href="https://2014.igem.org/Team:Colombia/Protocols">2014 Colombia </a></li>
+
                        <li><a href="https://2014.igem.org/Team:Colombia/Protocols">2014 Colombia </a></li>
−
                <li><a href="https://2014.igem.org/Team:Imperial/Protocols">2014 Imperial </a></li>
+
                        <li><a href="https://2014.igem.org/Team:Imperial/Protocols">2014 Imperial </a></li>
−
                <li><a href="https://2014.igem.org/Team:Caltech/Project/Experiments">2014 Caltech </a></li>
+
                        <li><a href="https://2014.igem.org/Team:Caltech/Project/Experiments">2014 Caltech </a></li>
−
            </ul>
+
                    </ul>
−
            <p>Sed in mauris malesuada, pulvinar ipsum nec, volutpat nisi. Duis nibh ipsum, egestas ac ligula in,
+
                    <p>Sed in mauris malesuada, pulvinar ipsum nec, volutpat nisi. Duis nibh ipsum, egestas ac ligula
−
                malesuada consequat lectus. Nam tincidunt interdum justo pharetra varius. Donec id placerat mauris, ut
+
                        in,
−
                viverra erat. Vivamus quam nisl, rutrum sit amet iaculis eget, aliquam nec elit. Mauris ullamcorper
+
                        malesuada consequat lectus. Nam tincidunt interdum justo pharetra varius. Donec id placerat
−
                fermentum diam, non scelerisque magna elementum non. Mauris dictum at purus quis euismod. Aliquam erat
+
                        mauris,
−
                volutpat. Praesent vitae euismod justo, vel ultricies leo. Quisque id odio mattis lacus volutpat
+
                        ut
−
                sagittis nec ac libero. Curabitur auctor commodo dui ac dapibus. Nulla facilisi. In hac habitasse
+
                        viverra erat. Vivamus quam nisl, rutrum sit amet iaculis eget, aliquam nec elit. Mauris
−
                platea dictumst. Suspendisse sed nulla a sapien posuere lobortis. In congue facilisis consequat.</p>
+
                        ullamcorper
−
            <p>Nulla tellus est, dignissim vestibulum velit vitae, elementum dignissim justo. Proin in est elementum
+
                        fermentum diam, non scelerisque magna elementum non. Mauris dictum at purus quis euismod.
−
                dui pharetra tincidunt. Quisque congue at justo vel facilisis. Quisque pellentesque ipsum nec
+
                        Aliquam
−
                pellentesque dignissim. Praesent eu turpis sagittis, tempor arcu ac, imperdiet elit. Maecenas accumsan
+
                        erat
−
                vulputate nisl, nec pulvinar purus sagittis in. Donec maximus luctus erat vel pretium. Donec efficitur
+
                        volutpat. Praesent vitae euismod justo, vel ultricies leo. Quisque id odio mattis lacus
−
                mauris et tempor imperdiet. Suspendisse vehicula arcu ut felis rhoncus, eget consequat sapien eleifend.
+
                        volutpat
−
                Nulla scelerisque elit sit amet maximus ullamcorper. Proin tristique nisl id erat pellentesque euismod.
+
                        sagittis nec ac libero. Curabitur auctor commodo dui ac dapibus. Nulla facilisi. In hac
−
                Maecenas massa neque, faucibus eu pretium ac, viverra vitae nibh. Ut finibus, lectus vel finibus
+
                        habitasse
−
                mattis, lacus sem semper nisl, quis finibus ligula magna eget nulla. Maecenas consequat, sem sed
+
                        platea dictumst. Suspendisse sed nulla a sapien posuere lobortis. In congue facilisis
−
                tristique sodales, ipsum augue dictum risus, id tincidunt nulla sapien in sem.</p>
+
                        consequat.</p>
 +
                    <p>Nulla tellus est, dignissim vestibulum velit vitae, elementum dignissim justo. Proin in est
 +
                        elementum
 +
                        dui pharetra tincidunt. Quisque congue at justo vel facilisis. Quisque pellentesque ipsum nec
 +
                        pellentesque dignissim. Praesent eu turpis sagittis, tempor arcu ac, imperdiet elit. Maecenas
 +
                        accumsan
 +
                        vulputate nisl, nec pulvinar purus sagittis in. Donec maximus luctus erat vel pretium. Donec
 +
                        efficitur
 +
                        mauris et tempor imperdiet. Suspendisse vehicula arcu ut felis rhoncus, eget consequat sapien
 +
                        eleifend.
 +
                        Nulla scelerisque elit sit amet maximus ullamcorper. Proin tristique nisl id erat pellentesque
 +
                        euismod.
 +
                        Maecenas massa neque, faucibus eu pretium ac, viverra vitae nibh. Ut finibus, lectus vel
 +
                        finibus
 +
                        mattis, lacus sem semper nisl, quis finibus ligula magna eget nulla. Maecenas consequat, sem
 +
                        sed
 +
                        tristique sodales, ipsum augue dictum risus, id tincidunt nulla sapien in sem.</p>
 +
                </div>
 +
            </div>
 
         </div>
 
         </div>
 
     </div>
 
     </div>

Revision as of 21:41, 8 October 2018

Cell Gif

Experiments

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eu orci non felis suscipit viverra id et metus. In quis nunc eget ligula tincidunt placerat. Integer pulvinar nisi a erat porttitor, in tempus lectus consectetur. Donec eget mi aliquet, vulputate risus in, dignissim ligula. Vivamus sit amet ornare felis. Nunc imperdiet rutrum dui quis porttitor. Nulla eget risus arcu. Morbi placerat aliquet nisl, id semper neque lobortis et. Aenean ullamcorper turpis in massa lobortis rutrum. Proin viverra, nulla id aliquet molestie, justo justo finibus augue, in ullamcorper nisl libero ut nisl. Quisque imperdiet luctus ipsum nec porta. Vivamus et ex id nunc porttitor laoreet.

What should this page contain?

  • Protocols
  • Experiments
  • Documentation of the development of your project

Etiam aliquet lacinia orci, eu maximus massa vestibulum sit amet. Quisque id metus eget magna egestas mattis. Vivamus quam orci, facilisis in ullamcorper ac, faucibus ac enim. Cras egestas quam eget justo euismod commodo vitae a libero. Morbi mattis aliquet leo, sit amet tempus enim viverra vel. Quisque tincidunt dignissim ex eget molestie. Donec aliquam quam et turpis porttitor, efficitur malesuada lectus ultrices. Nunc venenatis lacus vel ultrices pellentesque.

Curabitur sit amet suscipit enim. Quisque scelerisque hendrerit odio id egestas. Morbi consectetur ultrices tortor, vitae tempus enim vestibulum nec. Nam eget auctor quam. Curabitur feugiat venenatis lorem, quis interdum nibh dapibus et. Donec porttitor dui quis arcu facilisis rhoncus. Praesent vitae dolor nisl. Cras vel cursus erat. Donec dictum massa urna, sed tempus libero pharetra eget. Duis ultricies neque in rutrum ullamcorper.

Inspiration

Sed in mauris malesuada, pulvinar ipsum nec, volutpat nisi. Duis nibh ipsum, egestas ac ligula in, malesuada consequat lectus. Nam tincidunt interdum justo pharetra varius. Donec id placerat mauris, ut viverra erat. Vivamus quam nisl, rutrum sit amet iaculis eget, aliquam nec elit. Mauris ullamcorper fermentum diam, non scelerisque magna elementum non. Mauris dictum at purus quis euismod. Aliquam erat volutpat. Praesent vitae euismod justo, vel ultricies leo. Quisque id odio mattis lacus volutpat sagittis nec ac libero. Curabitur auctor commodo dui ac dapibus. Nulla facilisi. In hac habitasse platea dictumst. Suspendisse sed nulla a sapien posuere lobortis. In congue facilisis consequat.

Nulla tellus est, dignissim vestibulum velit vitae, elementum dignissim justo. Proin in est elementum dui pharetra tincidunt. Quisque congue at justo vel facilisis. Quisque pellentesque ipsum nec pellentesque dignissim. Praesent eu turpis sagittis, tempor arcu ac, imperdiet elit. Maecenas accumsan vulputate nisl, nec pulvinar purus sagittis in. Donec maximus luctus erat vel pretium. Donec efficitur mauris et tempor imperdiet. Suspendisse vehicula arcu ut felis rhoncus, eget consequat sapien eleifend. Nulla scelerisque elit sit amet maximus ullamcorper. Proin tristique nisl id erat pellentesque euismod. Maecenas massa neque, faucibus eu pretium ac, viverra vitae nibh. Ut finibus, lectus vel finibus mattis, lacus sem semper nisl, quis finibus ligula magna eget nulla. Maecenas consequat, sem sed tristique sodales, ipsum augue dictum risus, id tincidunt nulla sapien in sem.