Difference between revisions of "Team:Calgary/HomeImposter"

 
(31 intermediate revisions by 2 users not shown)
Line 1: Line 1:
−
{{:Team:Calgary/NavBar}}
+
{{:Team:Calgary/Layout}}
 
<html lang="en">
 
<html lang="en">
 +
 
<head>
 
<head>
 
     <title>Team:Calgary - 2018.igem.org</title>
 
     <title>Team:Calgary - 2018.igem.org</title>
 
     <!-- CSS -->
 
     <!-- CSS -->
−
  <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/jquery_fullPage_css?action=raw&ctype=text/css">
+
    <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/jquery_fullPage_css?action=raw&ctype=text/css">
 
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
 
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
 
         crossorigin="anonymous">
 
         crossorigin="anonymous">
−
  <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/animation_css?action=raw&ctype=text/css">
+
    <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/animation_css?action=raw&ctype=text/css">
−
  <style>
+
    <style>
 
         .maincontent {
 
         .maincontent {
 
             margin-top: 180px;
 
             margin-top: 180px;
 
             margin-bottom: 180px;
 
             margin-bottom: 180px;
 
         }
 
         }
 +
 
         h1 {
 
         h1 {
−
          font-family: 'Josefin Sans', sans-serif !important;
+
            font-family: 'Josefin Sans', sans-serif !important;
−
          font-weight: normal !important;
+
            font-weight: normal !important;
 
             text-align: center;
 
             text-align: center;
 
         }
 
         }
 +
 
         h2 {
 
         h2 {
−
             text-align:center;
+
             text-align: center;
 +
            line-height: 1.8;
 
         }
 
         }
 +
 
         p {
 
         p {
−
             text-align: justify;
+
             font-size: 20px !important;
 +
            line-height: 2;
 
         }
 
         }
−
         #moving-helix {
+
 
−
             height: 400px;
+
         .info-link {
 +
             padding: 0 !important;
 
         }
 
         }
−
         #blinking-arrows {
+
 
−
             height: 54px;
+
         a:link {
 +
             color: #f38f8f;
 
         }
 
         }
−
        #fp-nav ul li,
+
 
−
         .fp-slidesNav ul li {
+
         a:visited {
−
             height: 14px;
+
             color: #f38f8f;
 
         }
 
         }
−
        #fp-nav ul li a.active span,
+
 
−
         .fp-slidesNav ul li a.active span,
+
         a:hover {
−
        #fp-nav ul li:hover a.active span,
+
             color: #f38f8f;
−
        .fp-slidesNav ul li:hover a.active span{
+
−
             height: 14px;
+
−
            width: 14px;
+
−
            margin: -7px 0 0 -7px;
+
 
         }
 
         }
−
        #fp-nav ul li a span,
+
 
−
         .fp-slidesNav ul li a span {
+
         a:active {
−
             border: 2px solid rgb(50, 48, 49);
+
             color: #f38f8f;
−
            background: rgba(255, 255, 255, 0);
+
 
         }
 
         }
−
         #fp-nav ul li:hover a span,
+
 
−
        .fp-slidesNav ul li:hover a span{
+
         #moving-helix {
−
            width: 10px;
+
             height: 400px;
−
             height: 10px;
+
−
            margin: -5px 0px 0px -5px;
+
 
         }
 
         }
 +
 +
        #blinking-arrows {
 +
            height: 54px;
 +
        }
 +
 
         .bottom-left {
 
         .bottom-left {
 
             bottom: 20px;
 
             bottom: 20px;
Line 60: Line 66:
 
             text-align: center;
 
             text-align: center;
 
         }
 
         }
 +
 
         .bottom-right {
 
         .bottom-right {
 
             bottom: 20px;
 
             bottom: 20px;
Line 68: Line 75:
 
             text-align: center;
 
             text-align: center;
 
         }
 
         }
 +
 
         .social-media-icon {
 
         .social-media-icon {
 
             color: rgba(0, 0, 0, 0.5);
 
             color: rgba(0, 0, 0, 0.5);
 
             font-size: 24px;
 
             font-size: 24px;
 
         }
 
         }
 +
 
         .social-media-icon:hover {
 
         .social-media-icon:hover {
 
             color: rgba(0, 0, 0, 0.9);
 
             color: rgba(0, 0, 0, 0.9);
 
         }
 
         }
 +
 
         .vertical-align {
 
         .vertical-align {
 
             display: flex;
 
             display: flex;
Line 80: Line 90:
 
             align-items: center;
 
             align-items: center;
 
         }
 
         }
−
         #home-title {
+
 
 +
         .home-title {
 
             color: #44414d;
 
             color: #44414d;
 
             font-size: 80px;
 
             font-size: 80px;
 
         }
 
         }
 +
 
         #home-subtitle {
 
         #home-subtitle {
 
             color: #44414d;
 
             color: #44414d;
 
             font-size: 47px;
 
             font-size: 47px;
 
         }
 
         }
 +
 
         #social-media-icons {
 
         #social-media-icons {
 
             list-style: none;
 
             list-style: none;
 
         }
 
         }
 +
 
         #instructions {
 
         #instructions {
 
             display: block;
 
             display: block;
 
             font-size: 12px;
 
             font-size: 12px;
 
         }
 
         }
−
      @media only screen and (max-width: 1050px) {
 
−
.navbar {
 
−
  background: white;
 
−
}
 
−
.navbar-logo {
 
−
height: 40px;
 
−
}
 
−
.bottom-left {
 
−
  display: none;
 
−
}
 
−
.bottom-right {
 
−
display: none;
 
−
}
 
−
}
 
  
−
@media only screen and (max-width: 400px) {
+
        .wrapper {
 +
            text-align: center;
 +
        }
  
−
  #home-title {
+
        .maincontent {
−
             color: #44414d;
+
             background-color: #eeedf0;
−
             font-size: 26px;
+
             margin-top: 210px;
 +
            margin-bottom: 210px;
 +
            padding: 0;
 
         }
 
         }
−
         #home-subtitle {
+
 
−
             color: #44414d;
+
         .sef>p {
−
            font-size: 16px;
+
             text-align: center !important;
 
         }
 
         }
−
}
 
  
−
  </style>
+
        @media only screen and (max-width: 1050px) {
 +
            .bottom-left {
 +
                display: none;
 +
            }
 +
 
 +
            .bottom-right {
 +
                display: none;
 +
            }
 +
        }
 +
 
 +
        @media only screen and (max-width: 400px) {
 +
            h2 {
 +
                font-size: 18px;
 +
            }
 +
 
 +
            .home-title {
 +
                color: #44414d;
 +
                font-size: 26px;
 +
            }
 +
 
 +
            #home-subtitle {
 +
                color: #44414d;
 +
                font-size: 16px;
 +
            }
 +
 
 +
            .fp-tableCell {
 +
                display: block;
 +
                height: 100% !important;
 +
                padding-bottom: 0;
 +
                padding-top: 0;
 +
            }
 +
 
 +
            .fp-table {
 +
                height: 100% !important;
 +
            }
 +
        }
 +
    </style>
 
     <!-- JS -->
 
     <!-- JS -->
−
  <script src="https://2018.igem.org/Team:Calgary/jquery_fullPage_js?action=raw&ctype=text/javascript"></script>
+
    <script src="https://2018.igem.org/Team:Calgary/jquery_fullPage_js?action=raw&ctype=text/javascript"></script>
 
     <script>
 
     <script>
 
         $(document).ready(function () {
 
         $(document).ready(function () {
 
             $('#fullpage').fullpage({
 
             $('#fullpage').fullpage({
−
                // navigation: true,
 
 
                 loopBottom: true,
 
                 loopBottom: true,
 
                 loopTop: true,
 
                 loopTop: true,
 
                 responsiveWidth: 1050,
 
                 responsiveWidth: 1050,
−
 
 
                 afterResponsive: function (isResponsive) { }
 
                 afterResponsive: function (isResponsive) { }
 
             });
 
             });
Line 146: Line 183:
 
             <div class="row vertical-align">
 
             <div class="row vertical-align">
 
                 <div class="col-10">
 
                 <div class="col-10">
−
                     <h1 id="home-title">SNIP
+
                     <h1 class="home-title">SNIP
 
                         <span style="color: #7ccfb8">EQUIP</span> FLIP</h1>
 
                         <span style="color: #7ccfb8">EQUIP</span> FLIP</h1>
−
                    <h2 id="home-subtitle">Towards a Safer Gene Therapy</h2>
 
 
                 </div>
 
                 </div>
 
                 <div class="col-2">
 
                 <div class="col-2">
−
                     <svg style="height:0.5%;" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+
                     <svg style="width: 50%" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
−
                        xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+
                        xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
 +
                        xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
 
                         xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" viewBox="0 0 79.80928 292.63452"
 
                         xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" viewBox="0 0 79.80928 292.63452"
−
                         version="1.1" id="moving-helix" inkscape:version="0.92.3 (2405546, 2018-03-11)" sodipodi:docname="Helix.svg">
+
                         version="1.1" id="moving-helix" inkscape:version="0.92.3 (2405546, 2018-03-11)"
 +
                        sodipodi:docname="Helix.svg">
 
                         <defs id="defs1848" />
 
                         <defs id="defs1848" />
−
                         <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2"
+
                         <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0"
−
                            inkscape:zoom="0.64" inkscape:cx="40.612564" inkscape:cy="524.45313" inkscape:document-units="mm"
+
                            inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="0.64" inkscape:cx="40.612564"
−
                            inkscape:current-layer="layer1" showgrid="false" inkscape:window-width="1920" inkscape:window-height="1017"
+
                            inkscape:cy="524.45313" inkscape:document-units="mm" inkscape:current-layer="layer1"
−
                             inkscape:window-x="-8" inkscape:window-y="32" inkscape:window-maximized="1" borderlayer="false" fit-margin-top="0"
+
                            showgrid="false" inkscape:window-width="1920" inkscape:window-height="1017"
−
                            fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0" showborder="false" />
+
                             inkscape:window-x="-8" inkscape:window-y="32" inkscape:window-maximized="1" borderlayer="false"
 +
                            fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0"
 +
                            showborder="false" />
 
                         <metadata id="metadata1851">
 
                         <metadata id="metadata1851">
 
                             <rdf:RDF>
 
                             <rdf:RDF>
Line 173: Line 213:
 
                             <g class="move-up" id="g2473" transform="matrix(1.3829225,0,0,1.3829225,-103.49477,-58.214956)">
 
                             <g class="move-up" id="g2473" transform="matrix(1.3829225,0,0,1.3829225,-103.49477,-58.214956)">
  
−
                                 <path class="dark-grey appear-right-delay" id="dgrey4" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 134.34178,5.592011 v 19.23694 l 57.7106,38.473729 V 44.065821 Z"
+
                                 <path class="dark-grey appear-right-delay" id="dgrey4" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 134.34178,5.592011 v 19.23694 l 57.7106,38.473729 V 44.065821 Z" />
  
−
                                 <path class="dark-green move-right appear-right" id="dgreen3" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0"
+
                                 <path class="dark-green move-right appear-right" id="dgreen3" sodipodi:nodetypes="ccccc"
−
                                    d="m 134.34175,44.065952 v 19.236859 l 57.7106,38.473789 V 82.539731 Z" />
+
                                    inkscape:connector-curvature="0" d="m 134.34175,44.065952 v 19.236859 l 57.7106,38.473789 V 82.539731 Z" />
  
 
                                 <path class="light-green appear-left-delay" id="lgreen4" d="m 76.63115,5.592011 v 19.23694 L 18.920612,63.30268 V 44.065821 Z"
 
                                 <path class="light-green appear-left-delay" id="lgreen4" d="m 76.63115,5.592011 v 19.23694 L 18.920612,63.30268 V 44.065821 Z"
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
−
                                 <path class="dark-grey" id="dgrey1" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 76.631184,44.065871 v 19.23694 L 134.34178,101.77654 V 82.539681 Z"
+
                                 <path class="dark-grey" id="dgrey1" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 76.631184,44.065871 v 19.23694 L 134.34178,101.77654 V 82.539681 Z" />
  
 
                                 <path class="light-grey move-left appear-left" id="lgrey3" d="M 76.631184,44.066002 V 63.302811 L 18.920588,101.7766 V 82.539731 Z"
 
                                 <path class="light-grey move-left appear-left" id="lgrey3" d="M 76.631184,44.066002 V 63.302811 L 18.920588,101.7766 V 82.539731 Z"
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
−
                                 <path class="dark-green" id="dgreen1" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 76.631184,82.539681 v 19.236859 l 57.710596,38.47379 v -19.23687 z"
+
                                 <path class="dark-green" id="dgreen1" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 76.631184,82.539681 v 19.236859 l 57.710596,38.47379 v -19.23687 z" />
  
−
                                 <path class="light-green" id="lgreen1" d="m 134.34175,44.065871 v 19.23694 L 76.631212,101.77654 V 82.539681 Z" inkscape:connector-curvature="0"
+
                                 <path class="light-green" id="lgreen1" d="m 134.34175,44.065871 v 19.23694 L 76.631212,101.77654 V 82.539681 Z"
−
                                    sodipodi:nodetypes="ccccc" />
+
                                    inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
−
                                 <path class="dark-grey" id="dgrey2" d="m 76.631184,121.01346 v 19.23681 l 57.710596,38.47384 v -19.23692 z" inkscape:connector-curvature="0"
+
                                 <path class="dark-grey" id="dgrey2" d="m 76.631184,121.01346 v 19.23681 l 57.710596,38.47384 v -19.23692 z"
−
                                    sodipodi:nodetypes="ccccc" />
+
                                    inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
 
                                 <path class="dark-green disappear-left-delay" id="dgreen2" d="m 76.631184,159.48725 v 19.23686 l 57.710596,38.47378 v -19.23691 z"
 
                                 <path class="dark-green disappear-left-delay" id="dgreen2" d="m 76.631184,159.48725 v 19.23686 l 57.710596,38.47378 v -19.23691 z"
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
 
                                     inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
−
                                 <path class="light-green" id="lgreen2" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 134.34178,121.01346 v 19.23681 l -57.710596,38.47384 v -19.23692 z"
+
                                 <path class="light-green" id="lgreen2" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 134.34178,121.01346 v 19.23681 l -57.710596,38.47384 v -19.23692 z" />
  
−
                                 <path class="light-grey" id="lgrey1" d="M 134.34178,82.539731 V 101.77654 L 76.631184,140.25033 V 121.01346 Z" inkscape:connector-curvature="0"
+
                                 <path class="light-grey" id="lgrey1" d="M 134.34178,82.539731 V 101.77654 L 76.631184,140.25033 V 121.01346 Z"
−
                                    sodipodi:nodetypes="ccccc" />
+
                                    inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
  
−
                                 <path class="dark-grey disappear-left" id="dgrey3" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 76.631184,197.96103 v 19.23686 l 57.710596,38.47385 v -19.23692 z"
+
                                 <path class="dark-grey disappear-left" id="dgrey3" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 76.631184,197.96103 v 19.23686 l 57.710596,38.47385 v -19.23692 z" />
  
−
                                 <path class="light-grey disappear-right-delay" id="lgrey2" sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" d="m 134.34178,159.4873 v 19.23681 l -57.710596,38.47378 v -19.23691 z"
+
                                 <path class="light-grey disappear-right-delay" id="lgrey2" sodipodi:nodetypes="ccccc"
−
                                />
+
                                    inkscape:connector-curvature="0" d="m 134.34178,159.4873 v 19.23681 l -57.710596,38.47378 v -19.23691 z" />
  
 
                                 <path class="light-green disappear-right" id="lgreen3" d="m 134.34178,197.96103 v 19.23686 l -57.710596,38.47385 v -19.23692 z"
 
                                 <path class="light-green disappear-right" id="lgreen3" d="m 134.34178,197.96103 v 19.23686 l -57.710596,38.47385 v -19.23692 z"
Line 223: Line 263:
 
         <!-- Page 2 -->
 
         <!-- Page 2 -->
 
         <div class="section">
 
         <div class="section">
−
             <h1>Page 2</h1>
+
             <div class="section-content">
 +
                <h2 style="text-align: left; color: #44414d">The ideal medicine is not a perfect treatment . . .</h2>
 +
                <br>
 +
                <br>
 +
                <br>
 +
                <h2 style="text-align: right; color: #44414d">. . . it's a <span style="color: #7ccfb8">cure</span></h2>
 +
            </div>
 
         </div>
 
         </div>
 
         <!-- Page 3 -->
 
         <!-- Page 3 -->
 
         <div class="section">
 
         <div class="section">
−
             <h1>Page 3</h1>
+
             <div class="section-content">
 +
                <h2 style="text-align: left; color: #44414d">Advancements in genetic modification have opened avenues
 +
                    towards numerous tracks of scientific
 +
                    development.</h2>
 +
                <br>
 +
                <br>
 +
                <br>
 +
                <h2 style="text-align: left; color: #44414d">In particular,
 +
                    the demand for permanent health solutions has sparked massive interest in <span style="color: #7ccfb8">gene
 +
                        therapy</span>.</h2>
 +
            </div>
 +
        </div>
 +
        <!-- Page 4 -->
 +
        <div class="section">
 +
            <div class="section-content">
 +
                <h2 style="text-align: left; color: #44414d">Despite the potential for establishing an ideal medicine,
 +
                    there are still numerous challenges.</h2>
 +
                <br>
 +
                <br>
 +
                <br>
 +
                <h2 style="text-align: left; color: #44414d">The selection of an <span style="color: #7ccfb8">integration
 +
                        target site</span>,
 +
                    methodology pertaining to <span style="color: #7ccfb8">gene
 +
                        delivery</span>, and <span style="color: #7ccfb8">maintenance</span> of gene expression
 +
                    currently limit the potential for gene
 +
                    therapy
 +
                    to become common practice.</h2>
 +
            </div>
 +
        </div>
 +
        <!-- Page 5 -->
 +
        <div class="section">
 +
            <div class="section-content">
 +
                <h2 style="text-align: center; color: #44414d">How do we overcome these problems?</h2>
 +
                <br>
 +
                <br>
 +
                <br>
 +
                <h2 style="text-align: center; color: #44414d" class="home-title">SNIP
 +
                    <span style="color: #7ccfb8">EQUIP</span> FLIP</h2>
 +
                <br>
 +
                <br>
 +
                <h2 style="text-align: center; color: #44414d">The system that allows for the integration and
 +
                    maintenance of large-scale genetic constructs in eukaryotic systems.</h2>
 +
            </div>
 +
        </div>
 +
        <!-- Page 6 -->
 +
        <div class="section">
 +
            <h2 style="text-align: left; color: #44414d">University of Calgary’s Snip, Equip, Flip aims to overcome
 +
                the aforementioned obstacles. This system
 +
                allows for the creation of eukaryotic cell lines via stable integration and expression of exogenous
 +
                genes.</h2>
 +
            <br>
 +
            <br>
 +
            <br>
 +
            <h2 style="text-align: left; color: #44414d">Snip, Equip, Flip is a simple and reliable method that can
 +
                be used by experienced and entrant
 +
                researchers alike that can lead to a vast array of scientific discoveries.</h2>
 +
        </div>
 +
        <!-- Page 7 -->
 +
        <div class="section">
 +
            <h2 style="text-align: left; color: #44414d">By complementing the specificity of targeting that
 +
                CRISPR/Cas9 offers with the much larger integration
 +
                capabilities of FLP recombinase and beta resolvase, gene integration into eukaryotic genomes becomes a
 +
                simple process of Snip, Equip, Flip.</h2>
 +
            <br>
 +
            <br>
 +
            <br>
 +
            <h2 style="text-align: left; color: #44414d">The expression of integrated genes is then protected and
 +
                maintained over time by adding flanking
 +
                chromatin modifying elements.</h2>
 +
            <br>
 +
            <div style="text-align: center">
 +
                <a href="https://2018.igem.org/Team:Calgary/Description"><button style="font-size: 20px" type="button"
 +
                        class="btn btn-outline-dark btn-lg">Our
 +
                        System</button></a>
 +
            </div>
 
         </div>
 
         </div>
−
    </div>
 
−
    <!-- Social Media -->
 
−
    <div class="bottom-left">
 
−
        <ul id="social-media-icons">
 
−
            <li>
 
−
                <a href="#">
 
−
                    <i class="fab fa-facebook-f social-media-icon" aria-hidden="true"></i>
 
−
                </a>
 
−
            </li>
 
−
          <br>
 
−
            <li>
 
−
                <a href="#">
 
−
                    <i class="fab fa-instagram social-media-icon" aria-hidden="true"></i>
 
−
                </a>
 
−
            </li>
 
−
          <br>
 
−
            <li>
 
−
                <a href="#">
 
−
                    <i class="fab fa-twitter social-media-icon" aria-hidden="true"></i>
 
−
                </a>
 
−
            </li>
 
−
          <br>
 
−
            <li>
 
−
                <a href="#">
 
−
                    <i class="far fa-envelope social-media-icon" aria-hidden="true"></i>
 
−
                </a>
 
−
            </li>
 
−
        </ul>
 
 
     </div>
 
     </div>
 
     <!-- Arrow Keys -->
 
     <!-- Arrow Keys -->
Line 262: Line 354:
 
         <svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 
         <svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 
             xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
 
             xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
−
             xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" height="600" viewBox="0 0 36.634037 23.343925" version="1.1"
+
             xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" height="600" viewBox="0 0 36.634037 23.343925"
−
            id="blinking-arrows" sodipodi:docname="Arrows.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
+
            version="1.1" id="blinking-arrows" sodipodi:docname="Arrows.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
 
             <defs id="defs2408" />
 
             <defs id="defs2408" />
−
             <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2"
+
             <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0"
−
                inkscape:zoom="5.6" inkscape:cx="54.174134" inkscape:cy="3.2464811" inkscape:document-units="mm" inkscape:current-layer="layer1"
+
                inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="5.6" inkscape:cx="54.174134"
−
                showgrid="false" inkscape:window-width="3000" inkscape:window-height="1875" inkscape:window-x="-13" inkscape:window-y="67"
+
                inkscape:cy="3.2464811" inkscape:document-units="mm" inkscape:current-layer="layer1" showgrid="false"
−
                 inkscape:window-maximized="1" showborder="true" fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0"
+
                inkscape:window-width="3000" inkscape:window-height="1875" inkscape:window-x="-13" inkscape:window-y="67"
−
            />
+
                 inkscape:window-maximized="1" showborder="true" fit-margin-top="0" fit-margin-left="0" fit-margin-right="0"
 +
                fit-margin-bottom="0" />
 
             <metadata id="metadata2411">
 
             <metadata id="metadata2411">
 
                 <rdf:RDF>
 
                 <rdf:RDF>
Line 280: Line 373:
 
             </metadata>
 
             </metadata>
 
             <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="translate(-97.154707,-91.237265)">
 
             <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="translate(-97.154707,-91.237265)">
−
                 <rect id="rect2350" class="box-light-grey blinky-delay" width="9.2528639" height="9.2528648" x="110.84529" y="91.751549"
+
                 <rect id="rect2350" class="box-light-grey blinky-delay" width="9.2528639" height="9.2528648" x="110.84529"
−
                    ry="1.505878" />
+
                    y="91.751549" ry="1.505878" />
−
                 <path sodipodi:type="star" id="path2352" class="arrow-v-light-grey blinky-delay" sodipodi:sides="3" sodipodi:cx="115.4742"
+
                 <path sodipodi:type="star" id="path2352" class="arrow-v-light-grey blinky-delay" sodipodi:sides="3"
−
                    sodipodi:cy="96.813065" sodipodi:r1="1.7300762" sodipodi:r2="0.8650381" sodipodi:arg1="0.52359878" sodipodi:arg2="1.5707963"
+
                    sodipodi:cx="115.4742" sodipodi:cy="96.813065" sodipodi:r1="1.7300762" sodipodi:r2="0.8650381"
−
                    inkscape:flatsided="false" inkscape:rounded="0" inkscape:randomized="0" d="m 116.97249,97.678103 -1.49829,0 -1.49829,0 0.74914,-1.297557 0.74915,-1.297558 0.74914,1.297558 z"
+
                    sodipodi:arg1="0.52359878" sodipodi:arg2="1.5707963" inkscape:flatsided="false" inkscape:rounded="0"
 +
                    inkscape:randomized="0" d="m 116.97249,97.678103 -1.49829,0 -1.49829,0 0.74914,-1.297557 0.74915,-1.297558 0.74914,1.297558 z"
 
                     inkscape:transform-center-x="-0.0018211996" inkscape:transform-center-y="-0.43061005" />
 
                     inkscape:transform-center-x="-0.0018211996" inkscape:transform-center-y="-0.43061005" />
−
                 <rect ry="1.505878" y="-114.06599" x="110.84529" height="9.2528648" width="9.2528639" id="rect2354" class="box-light-grey blinky"
+
                 <rect ry="1.505878" y="-114.06599" x="110.84529" height="9.2528648" width="9.2528639" id="rect2354"
−
                    transform="scale(1,-1)" />
+
                    class="box-light-grey blinky" transform="scale(1,-1)" />
−
                 <path inkscape:transform-center-y="0.43023049" inkscape:transform-center-x="-0.0018211996" transform="scale(1,-1)" d="m 116.97249,-108.14041 -1.49829,0 -1.49829,0 0.74914,-1.29756 0.74915,-1.29755 0.74914,1.29755 z"
+
                 <path inkscape:transform-center-y="0.43023049" inkscape:transform-center-x="-0.0018211996" transform="scale(1,-1)"
−
                     inkscape:randomized="0" inkscape:rounded="0" inkscape:flatsided="false" sodipodi:arg2="1.5707963" sodipodi:arg1="0.52359878"
+
                    d="m 116.97249,-108.14041 -1.49829,0 -1.49829,0 0.74914,-1.29756 0.74915,-1.29755 0.74914,1.29755 z"
−
                    sodipodi:r2="0.8650381" sodipodi:r1="1.7300762" sodipodi:cy="-109.00545" sodipodi:cx="115.4742" sodipodi:sides="3"
+
                     inkscape:randomized="0" inkscape:rounded="0" inkscape:flatsided="false" sodipodi:arg2="1.5707963"
−
                    id="path2357" class="arrow-v-light-grey blinky" sodipodi:type="star" />
+
                    sodipodi:arg1="0.52359878" sodipodi:r2="0.8650381" sodipodi:r1="1.7300762" sodipodi:cy="-109.00545"
−
                 <rect transform="matrix(0,1,1,0,0,0)" id="rect2359" class="box-verylight-grey" width="9.2528648" height="9.2528639" x="104.81404"
+
                    sodipodi:cx="115.4742" sodipodi:sides="3" id="path2357" class="arrow-v-light-grey blinky"
−
                    y="97.668991" ry="1.5058781" />
+
                    sodipodi:type="star" />
−
                 <path sodipodi:type="star" id="path2361" class="arrow-h-verylight-grey" sodipodi:sides="3" sodipodi:cx="92040" sodipodi:cy="-62277.48"
+
                 <rect transform="matrix(0,1,1,0,0,0)" id="rect2359" class="box-verylight-grey" width="9.2528648" height="9.2528639"
−
                    sodipodi:r1="200" sodipodi:r2="100" sodipodi:arg1="0.52359878" sodipodi:arg2="1.5707963" inkscape:flatsided="false"
+
                    x="104.81404" y="97.668991" ry="1.5058781" />
−
                    inkscape:rounded="0" inkscape:randomized="0" d="m 92213.205,-62177.48 -173.205,0 -173.205,0 86.602,-150 86.603,-150 86.603,150 z"
+
                 <path sodipodi:type="star" id="path2361" class="arrow-h-verylight-grey" sodipodi:sides="3" sodipodi:cx="92040"
 +
                    sodipodi:cy="-62277.48" sodipodi:r1="200" sodipodi:r2="100" sodipodi:arg1="0.52359878"
 +
                    sodipodi:arg2="1.5707963" inkscape:flatsided="false" inkscape:rounded="0" inkscape:randomized="0" d="m 92213.205,-62177.48 -173.205,0 -173.205,0 86.602,-150 86.603,-150 86.603,150 z"
 
                     transform="matrix(0,0.00865039,0.00865039,0,641.45271,-686.73889)" inkscape:transform-center-x="0.43408464"
 
                     transform="matrix(0,0.00865039,0.00865039,0,641.45271,-686.73889)" inkscape:transform-center-x="0.43408464"
 
                     inkscape:transform-center-y="0.0019150242" />
 
                     inkscape:transform-center-y="0.0019150242" />
−
                 <rect transform="matrix(0,-1,-1,0,0,0)" id="rect2363" class="box-verylight-grey" width="9.2528648" height="9.2528639" x="-114.06599"
+
                 <rect transform="matrix(0,-1,-1,0,0,0)" id="rect2363" class="box-verylight-grey" width="9.2528648"
−
                    y="-133.27446" ry="1.5058781" />
+
                    height="9.2528639" x="-114.06599" y="-133.27446" ry="1.5058781" />
−
                 <path sodipodi:type="star" id="path2366" class="arrow-h-verylight-grey" sodipodi:sides="3" sodipodi:cx="92040" sodipodi:cy="-62277.48"
+
                 <path sodipodi:type="star" id="path2366" class="arrow-h-verylight-grey" sodipodi:sides="3" sodipodi:cx="92040"
−
                    sodipodi:r1="200" sodipodi:r2="100" sodipodi:arg1="0.52359878" sodipodi:arg2="1.5707963" inkscape:flatsided="false"
+
                    sodipodi:cy="-62277.48" sodipodi:r1="200" sodipodi:r2="100" sodipodi:arg1="0.52359878"
−
                    inkscape:rounded="0" inkscape:randomized="0" d="m 92213.205,-62177.48 -173.205,0 -173.205,0 86.602,-150 86.603,-150 86.603,150 z"
+
                    sodipodi:arg2="1.5707963" inkscape:flatsided="false" inkscape:rounded="0" inkscape:randomized="0" d="m 92213.205,-62177.48 -173.205,0 -173.205,0 86.602,-150 86.603,-150 86.603,150 z"
 
                     transform="matrix(0,-0.00865039,-0.00865039,0,-410.50945,905.62203)" inkscape:transform-center-x="-0.43298603"
 
                     transform="matrix(0,-0.00865039,-0.00865039,0,-410.50945,905.62203)" inkscape:transform-center-x="-0.43298603"
 
                     inkscape:transform-center-y="-0.00080335859" />
 
                     inkscape:transform-center-y="-0.00080335859" />
Line 312: Line 408:
 
     </div>
 
     </div>
 
</body>
 
</body>
 +
 
</html>
 
</html>

Latest revision as of 03:01, 18 October 2018

Team:Calgary - 2018.igem.org

SNIP EQUIP FLIP

image/svg+xml

The ideal medicine is not a perfect treatment . . .




. . . it's a cure

Advancements in genetic modification have opened avenues towards numerous tracks of scientific development.




In particular, the demand for permanent health solutions has sparked massive interest in gene therapy.

Despite the potential for establishing an ideal medicine, there are still numerous challenges.




The selection of an integration target site, methodology pertaining to gene delivery, and maintenance of gene expression currently limit the potential for gene therapy to become common practice.

How do we overcome these problems?




SNIP EQUIP FLIP



The system that allows for the integration and maintenance of large-scale genetic constructs in eukaryotic systems.

University of Calgary’s Snip, Equip, Flip aims to overcome the aforementioned obstacles. This system allows for the creation of eukaryotic cell lines via stable integration and expression of exogenous genes.




Snip, Equip, Flip is a simple and reliable method that can be used by experienced and entrant researchers alike that can lead to a vast array of scientific discoveries.

By complementing the specificity of targeting that CRISPR/Cas9 offers with the much larger integration capabilities of FLP recombinase and beta resolvase, gene integration into eukaryotic genomes becomes a simple process of Snip, Equip, Flip.




The expression of integrated genes is then protected and maintained over time by adding flanking chromatin modifying elements.


image/svg+xml Use arrow keys
or scroll