Difference between revisions of "Team:TecCEM"

Line 1: Line 1:
{{TecCEM/Header}}
 
 
<html>
 
<html>
 +
<link href="https://2018.igem.org/Template:TecCEM/CSSvendor?action=raw&ctype=text/css" rel="stylesheet" />
 +
<link href="https://2018.igem.org/Template:TecCEM/Style?action=raw&ctype=text/css" rel="stylesheet">
 
<style>
 
<style>
     #main-container span.bottom {
+
     html {
         background-color: white;
+
         position: relative;
         vertical-align: middle;
+
         min-height: 100%;
        margin: 0 !important;
+
 
     }
 
     }
 
+
     .footer {
     #main-container {
+
        height: 100vh !important;
+
        width: 100vw;
+
 
         position: relative;
 
         position: relative;
         margin: 0;
+
         bottom: -20px;
        padding: 0;
+
        display: flex;
+
        justify-content: center;
+
        flex-direction: column;
+
        align-items: center;
+
        background-color: white;
+
        mix-blend-mode: difference;
+
    }
+
 
+
    #main-container #backgr,
+
    #main-container #firstCover {
+
        position: absolute;
+
        top: 0;
+
        left: 0;
+
 
         width: 100%;
 
         width: 100%;
         height: 100%;
+
         height: 60px;
 +
        /* Set the fixed height of the footer here */
 +
        line-height: 60px;
 +
        /* Vertically center the text there */
 +
        background-color: #f5f5f5;
 
     }
 
     }
  
     #main-container #backgr {
+
     #globalWrapper {
         background-color: black;
+
         padding-bottom: 0px !important;
 
     }
 
     }
  
    #main-container #firstCover {
+
</style>
        background-color: white;
+
        mix-blend-mode: difference;
+
        pointer-events: none;
+
    }
+
  
    #main-container #Small1Cell {
+
<head>
        top: 10%;
+
     <meta charset="utf-8">
        left: 45%;
+
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        transform: translate(-50%, -50%);
+
</head>
        width: 5%;
+
<nav class="navbar navbar-expand-lg sticky-top navbar-light" id="navbarContainer">
        height: auto;
+
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTecCEM" aria-controls="navbarTecCEM"
        position: absolute;
+
         aria-expanded="false" aria-label="Toggle navigation"><span class="navbar-toggler-icon"></span></button>
     }
+
    <div class="collapse navbar-collapse" id="navbarTecCEM">
 
+
        <ul class="navbar-nav nav-fill w-75 ml-auto">
    #main-container #Small1Cell *,
+
            <li class="nav-item">
     #main-container #Small2Cell *,
+
                <a class="nav-link" href="https://2018.igem.org/Team:TecCEM">Home </a>
    #main-container #Small3Cell *,
+
            </li>
    #main-container #Small4Cell *,
+
            <li class="nav-item dropdown">
    #main-container #Big1Cell *,
+
                <a class="nav-link dropdown-toggle" href="#" id="dropdownNavbarProject" role="button"
    #main-container #Big2Cell * {
+
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Project</a>
        position: absolute;
+
                <div class="dropdown-menu" aria-labelledby="dropdownNavbarProject">
        left: 50%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Description">Description</a>
        top: 50%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Design">Design</a>
        transform: translate(-50%, -50%);
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Results">Results</a>
    }
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Experiments">Experiments</a>
 
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Hardware">Hardware</a>
    #main-container #Small2Cell {
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Software">Software</a>
        left: 25%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/InterLab">InterLab</a>
        top: 25%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Model">Model</a>
        transform: translate(-50%, -50%);
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Demonstrate">Demonstrate</a>
        width: 5%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Improve">Improve</a>
        height: auto;
+
                </div>
        position: absolute;
+
            </li>
    }
+
            <li class="nav-item dropdown">
 
+
                <a class="nav-link dropdown-toggle" href="#" id="dropdownNavbarParts" role="button"
 
+
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Parts</a>
    #main-container #Small3Cell {
+
                <div class="dropdown-menu" aria-labelledby="dropdownNavbarParts">
        left: 30%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Parts">Parts</a>
        top: 80%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Basic_Part">Basic Part</a>
        transform: translate(-50%, -50%);
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Composite_Part">Composite
        width: 5%;
+
                        Part</a>
        height: auto;
+
                </div>
        position: absolute;
+
            </li>
    }
+
            <li class="nav-item dropdown">
 
+
                <a class="nav-link dropdown-toggle" href="#" id="dropdownNavbarHP" role="button"
    #main-container #Small4Cell {
+
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Human Practices</a>
        left: 60%;
+
                <div class="dropdown-menu" aria-labelledby="dropdownNavbarHP">
        top: 80%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Human_Practices">Human Practices</a>
        transform: translate(-50%, -50%);
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Public_Engagement">Public
        width: 5%;
+
                        Engagement</a>
        height: auto;
+
                </div>
        position: absolute;
+
            </li>
    }
+
            <li class="nav-item">
 
+
                <a class="nav-link" href="https://2018.igem.org/Team:TecCEM/Notebook">Notebook</a>
    #main-container #Big1Cell {
+
            </li>
        left: 75%;
+
            <li class="nav-item dropdown">
        top: 10%;
+
                <a class="nav-link dropdown-toggle" href="#" id="dropdownNavbarTeam" role="button"
        transform: translate(-50%, -50%);
+
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Team</a>
        width: 5%;
+
                <div class="dropdown-menu" aria-labelledby="dropdownNavbarTeam">
        height: auto;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Team">Team Members</a>
        position: absolute;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Collaborations">Collaborations</a>
    }
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Attributions">Attributions</a>
 
+
                </div>
    #main-container #Big2Cell {
+
            </li>
        left: 85%;
+
            <li class="nav-item">
        top: 80%;
+
                <a class="nav-link" href="https://2018.igem.org/Team:TecCEM/Safety">Safety</a>
        transform: translate(-50%, -50%);
+
            </li>
        width: 5%;
+
            <li class="nav-item">
        height: auto;
+
                <a class="nav-link dropdown-toggle" href="#" id="dropdownNavbarAwards" role="button"
        position: absolute;
+
                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Awards</a>
    }
+
                <div class="dropdown-menu" aria-labelledby="dropdownNavbarAwards">
 
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Hardware">Hardware</a>
    #main-container #CenterCell {
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Software">Software</a>
        top: 50%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Measurement">Measurement</a>
        left: 50%;
+
                    <a class="dropdown-item" href="https://2018.igem.org/Team:TecCEM/Model">Model</a>
        transform: translate(-50%, -50%);
+
                </div>
        width: 75%;
+
             </li>
        height: auto;
+
         </ul>
        position: absolute;
+
     }
+
 
+
    #main-container #button {
+
        position: absolute;
+
        top: 50%;
+
        left: 50%;
+
        transform: translate(-50%, -50%);
+
        width: 5vw;
+
        height: 5vw;
+
        background-color: white;
+
        mix-blend-mode: difference;
+
        border-radius: 100%;
+
        z-index: 666;
+
    }
+
 
+
    #main-container p,
+
    #main-container h1 {
+
         mix-blend-mode: difference;
+
        max-width: 65%;
+
    }
+
 
+
    #main-container p {
+
        color: white !important;
+
    }
+
 
+
    #main-container .bottom {
+
        mix-blend-mode: difference;
+
    }
+
 
+
    #main-container h1 {
+
        -webkit-text-stroke-color: white !important;
+
    }
+
 
+
    #main-container span.bottom.project {
+
        background-color: #ff1558;
+
    }
+
 
+
    #main-container span.bottom.team {
+
        background-color: #17cc46;
+
    }
+
 
+
    #main-container span.bottom.safety {
+
        background-color: #ef6fca;
+
    }
+
 
+
    #main-container span.bottom.notebook {
+
        background-color: #0000ff;
+
    }
+
 
+
    #main-container span.bottom.awards {
+
        background-color: #ffdb27;
+
    }
+
 
+
    #main-container span.bottom.parts {
+
        background-color: #ff9d33;
+
    }
+
 
+
    #main-container span.bottom.human-practices {
+
        background-color: #0aa38c;
+
    }
+
</style>
+
<div class="container-fluid" id="main-container">
+
    <div id="backgr"></div>
+
    <img src="https://static.igem.org/mediawiki/2018/3/3a/T--TecCEM--CenterCell.png" alt="Center Cell" id="CenterCell">
+
    <a href="https://2018.igem.org/Team:TecCEM/Description" id="Small1Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Project" tabindex="0" data-placement="left">
+
        <img src="https://static.igem.org/mediawiki/2018/2/2a/T--TecCEM--CellSmall1.png" alt="Small1 Cell">
+
        <span class="bottom project">
+
        </span>
+
    </a>
+
    <a href="https://2018.igem.org/Team:TecCEM/Safety" id="Small2Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Safety" tabindex="0">
+
        <img src="https://static.igem.org/mediawiki/2018/c/c7/T--TecCEM--CellSmall2.png" alt="Small2 Cell">
+
        <span class="bottom safety">
+
        </span>
+
    </a>
+
    <a href="https://2018.igem.org/Team:TecCEM/Notebook" id="Small3Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Notebook" tabindex="0" data-placement="top">
+
        <img src="https://static.igem.org/mediawiki/2018/b/b5/T--TecCEM--CellSmall3.png" alt="Small3 Cell">
+
        <span class="bottom notebook">
+
        </span>
+
    </a>
+
    <a href="https://2018.igem.org/Team:TecCEM/Awards" id="Small4Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Awards" tabindex="0" data-placement="top">
+
        <img src="https://static.igem.org/mediawiki/2018/1/1b/T--TecCEM--CellSmall4.png" alt="Small4 Cell">
+
        <span class="bottom awards">
+
        </span>
+
    </a>
+
    <a href="https://2018.igem.org/Team:TecCEM/Parts" id="Big1Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Parts" tabindex="0" data-placement="left">
+
        <img src="https://static.igem.org/mediawiki/2018/6/62/T--TecCEM--CellBig1.png" alt="Big1 Cell">
+
        <span class="bottom parts">
+
        </span>
+
    </a>
+
    <a href="https://2018.igem.org/Team:TecCEM/Human_Practices" id="Big2Cell" data-toggle="popover" data-trigger="hover"
+
        data-content="Human Practices" tabindex="0" data-placement="left">
+
        <img src="https://static.igem.org/mediawiki/2018/7/7b/T--TecCEM--CellBig2.png" alt="Big2 Cell">
+
        <span class="bottom human-practices">
+
        </span>
+
    </a>
+
    <div id="firstCover"></div>
+
    <div id="button"></div>
+
    <h1>One person suffers from a burn injury every five minutes in Mexico.</h1>
+
    <p>Accidents and burns are preventable occurrences that generate high mortality and disability. So it is
+
        necessary to create a form of prevention and, of course, treatments for burn related incidents.</p>
+
    <span class="bottom"></span>
+
    <p class="text-center">Scroll down</p>
+
</div>
+
<div class="container first-container">
+
    <div class="row">
+
        <div class="col">
+
            <h1>Abstract</h1>
+
            <p>The percentage of the Mexican population that can afford a treatment for second-degree burn injuries is
+
                low since they demand a large spend when treated. Representing the third cause of infant mortality in
+
                Mexico, it stands for an urgent issue to assess. This project approaches such problematics with the
+
                design of a multi-glycopeptide scaffold and the recombinant growth factor Leptin B to induce fibroblast
+
                proliferation. Nanoencapsulation was employed to ensure proper delivery and distribution. Growth
+
                measurements were evaluated through cell image analysis and lactate dehydrogenase activity as an
+
                indirect indicator, obtained from the culture medium in the MiniSkin Simulator, which is a hardware to
+
                test molecules in a 3D culture. This system could enhance tissue regeneration, minimizing infection
+
                risks and treatment lapses for affected patients with second-degree burns.p>
+
        </div>
+
    </div>
+
</div>
+
<div class="container">
+
    <div class="row">
+
        <div class="col">
+
            <h1>Why</h1>
+
             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer viverra congue mi, nec volutpat tortor
+
                consectetur nec. Sed maximus turpis id posuere aliquet. Aliquam eros nibh, molestie in nibh aliquet,
+
                mattis maximus mauris. Duis vitae sapien vestibulum, consequat odio a, pretium magna. Mauris pharetra,
+
                elit id faucibus venenatis, nulla eros luctus justo, eget fermentum lectus felis non quam. Etiam varius
+
                augue pharetra ipsum volutpat, sed bibendum velit accumsan. Etiam eget felis vitae nisi auctor
+
                bibendum. </p>
+
         </div>
+
 
     </div>
 
     </div>
</div>
+
</nav>
  
 
</html>
 
</html>
{{TecCEM/JsHome}}
 
{{TecCEM/Footer}}
 

Revision as of 21:39, 11 October 2018