Difference between revisions of "Team:TecCEM"

 
(43 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 
{{TecCEM/Header}}
 
{{TecCEM/Header}}
−
<html>    
+
<html>
 
<style>
 
<style>
−
span.bottom{
+
    #main-container span.bottom {
−
    background-color: white;
+
        background-color: white;
−
    vertical-align: middle;
+
        vertical-align: middle;
−
}
+
        margin: 0 !important;
−
#main-container {
+
    }
−
     background-color: white;
+
 
−
     mix-blend-mode: difference;
+
    #main-container {
−
}
+
        height: 100vh !important;
 +
        width: 100vw;
 +
        position: relative;
 +
        margin: 0;
 +
        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%;
 +
        height: 100%;
 +
    }
 +
 
 +
    #main-container #backgr {
 +
        background-color: black;
 +
    }
 +
 
 +
    #main-container a img {
 +
        width: 200%;
 +
    }
 +
 
 +
    #main-container #firstCover {
 +
        background-color: white;
 +
        mix-blend-mode: difference;
 +
        pointer-events: none;
 +
     }
 +
 
 +
    #main-container #Small1Cell {
 +
        top: 10%;
 +
        left: 45%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #Small1Cell *,
 +
    #main-container #Small2Cell *,
 +
    #main-container #Small3Cell *,
 +
    #main-container #Small4Cell *,
 +
    #main-container #Big1Cell *,
 +
    #main-container #Big2Cell * {
 +
        position: absolute;
 +
        left: 50%;
 +
        top: 50%;
 +
        transform: translate(-50%, -50%);
 +
    }
 +
 
 +
    #main-container #Small2Cell {
 +
        left: 25%;
 +
        top: 25%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
 
 +
    #main-container #Small3Cell {
 +
        left: 30%;
 +
        top: 80%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #Small4Cell {
 +
        left: 60%;
 +
        top: 80%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #Big1Cell {
 +
        left: 75%;
 +
        top: 10%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #Big2Cell {
 +
        left: 85%;
 +
        top: 80%;
 +
        transform: translate(-50%, -50%);
 +
        width: 5%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #CenterCell {
 +
        top: 50%;
 +
        left: 50%;
 +
        transform: translate(-50%, -50%);
 +
        width: 75%;
 +
        height: auto;
 +
        position: absolute;
 +
    }
 +
 
 +
    #main-container #button {
 +
        position: absolute;
 +
        top: 60%;
 +
        left: 50%;
 +
        transform: translate(-50%, -50%);
 +
        width: 3vw;
 +
        height: 3vw;
 +
        background-color: white;
 +
        mix-blend-mode: difference;
 +
        border-radius: 100%;
 +
        z-index: 666;
 +
    }
 +
    #main-container #centerCircle{
 +
        position: absolute;
 +
        top: 60%;
 +
        left: 50%;
 +
        transform: translate(-50%, -50%);
 +
        width: 4vh;
 +
        border-radius: 100%;
 +
        z-index: 665;
 +
    }
 +
 
 +
    #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;
 +
    }
 +
    #audioLanding{
 +
        display: none;
 +
    }
 
</style>
 
</style>
−
<div id="parallax">
+
<div class="container-fluid" id="main-container">
−
     </div>
+
     <div id="backgr"></div>
−
     <div class="container" id="main-container">
+
     <img src="https://static.igem.org/mediawiki/2018/3/3a/T--TecCEM--CenterCell.png" alt="Center Cell" id="CenterCell">
−
         <div class="row" id="abstract">
+
    <a href="https://2018.igem.org/Team:TecCEM/Description" id="Small1Cell" data-toggle="popover" data-trigger="hover"
−
            <div class="col">
+
        data-content="Project" tabindex="0" data-placement="left">
−
                <strong>One person suffers from a burn injury every five minutes in Mexico.</strong>
+
         <img src="https://static.igem.org/mediawiki/2018/2/2a/T--TecCEM--CellSmall1.png" alt="Small1 Cell">
−
                <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 project">
−
                <div class="text-center svgClass">
+
        </span>
−
                    <span class="bottom"></span>
+
    </a>
−
                    <p class="text-center">Scroll down</p>
+
    <a href="https://2018.igem.org/Team:TecCEM/Safety" id="Small2Cell" data-toggle="popover" data-trigger="hover"
−
                </div>
+
        data-content="Safety" tabindex="0">
−
            </div>
+
        <img src="https://static.igem.org/mediawiki/2018/c/c7/T--TecCEM--CellSmall2.png" alt="Small2 Cell">
−
         </div>
+
        <span class="bottom safety">
−
     </div>
+
        </span>
−
     <div class="container first-container">
+
    </a>
−
         <div class="row">
+
    <a href="https://2018.igem.org/Team:TecCEM/Notebook" id="Small3Cell" data-toggle="popover" data-trigger="hover"
−
            <div class="col">
+
        data-content="Notebook" tabindex="0" data-placement="top">
−
                <h1>Abstract</h1>
+
        <img src="https://static.igem.org/mediawiki/2018/b/b5/T--TecCEM--CellSmall3.png" alt="Small3 Cell">
−
                <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>
+
        <span class="bottom notebook">
−
            </div>
+
         </span>
−
         </div>
+
     </a>
−
     </div>
+
     <a href="https://2018.igem.org/Team:TecCEM/Measurement" id="Small4Cell" data-toggle="popover" data-trigger="hover"
−
  <div class="container">
+
        data-content="Awards" tabindex="0" data-placement="top">
−
         <div class="row">
+
         <img src="https://static.igem.org/mediawiki/2018/1/1b/T--TecCEM--CellSmall4.png" alt="Small4 Cell">
−
            <div class="col">
+
        <span class="bottom awards">
−
                <h1>Why</h1>
+
        </span>
−
                <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>
+
    </a>
−
            </div>
+
    <a href="https://2018.igem.org/Team:TecCEM/Parts" id="Big1Cell" data-toggle="popover" data-trigger="hover"
−
         </div>
+
        data-content="Parts" tabindex="0" data-placement="left">
−
     </div>
+
        <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 class="text-center">Heal a wound. Heal the world.</h1>
 +
    <p class="text-center">Enhance tissue regeneration to heal burned patients.</p>
 +
    <img src="https://static.igem.org/mediawiki/2018/e/ee/T--TecCEM--CenterCircle.png" id="centerCircle">
 +
    <!-- <span class="bottom"></span> -->
 +
    <audio id="audioLanding" controls>
 +
        <source src="https://static.igem.org/mediawiki/2018/3/3c/T--TecCEM--SoundLanding.mp3" type="audio/mpeg">
 +
         Your browser does not support the audio element.
 +
    </audio>  
 +
     <!-- <p class="text-center">Scroll down</p> -->
 +
</div>
 +
 
 
</html>
 
</html>
 +
{{TecCEM/JsHome}}
 
{{TecCEM/Footer}}
 
{{TecCEM/Footer}}

Latest revision as of 03:52, 18 October 2018

Center Cell Small1 Cell Small2 Cell Small3 Cell Small4 Cell Big1 Cell Big2 Cell

Heal a wound. Heal the world.

Enhance tissue regeneration to heal burned patients.