Difference between revisions of "Team:Calgary/Layout"

 
(2 intermediate revisions by the same user not shown)
Line 1: Line 1:
−
{{:Team:Calgary/Layout}}
 
 
<html lang="en">
 
<html lang="en">
  
 
<head>
 
<head>
−
     <title>Team:Calgary - 2018.igem.org</title>
+
     <meta charset="UTF-8">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
     <!-- CSS -->
 
     <!-- CSS -->
 +
    <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/WikiResetCSSImposter?action=raw&ctype=text/css">
 +
    <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/bootstrap_min_css?action=raw&ctype=text/css">
 +
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Josefin+Sans">
 +
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
 
     <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" 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>
+
     <link rel="stylesheet" href="https://2018.igem.org/Team:Calgary/layout_css?action=raw&ctype=text/css">
−
        .maincontent {
+
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
−
            margin-top: 180px;
+
         crossorigin="anonymous">
−
            margin-bottom: 180px;
+
    <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/ProjectCSS_css?action=raw&ctype=text/css">
−
 
+
−
        h1 {
+
−
            font-family: 'Josefin Sans', sans-serif !important;
+
−
            font-weight: normal !important;
+
−
            text-align: center;
+
−
        }
+
−
 
+
−
        h2 {
+
−
            text-align: center;
+
−
            line-height: 1.2;
+
−
            font-size: 1.6rem;
+
−
        }
+
−
 
+
−
        p {
+
−
            font-size: 20px !important;
+
−
            line-height: 2;
+
−
        }
+
−
 
+
−
        .info-link {
+
−
            padding: 0 !important;
+
−
        }
+
−
 
+
−
        a:link {
+
−
            color: #f38f8f;
+
−
        }
+
−
 
+
−
        a:visited {
+
−
            color: #f38f8f;
+
−
        }
+
−
 
+
−
        a:hover {
+
−
            color: #f38f8f;
+
−
        }
+
−
 
+
−
        a:active {
+
−
            color: #f38f8f;
+
−
        }
+
−
 
+
−
        #moving-helix {
+
−
            height: 400px;
+
−
        }
+
−
 
+
−
        #blinking-arrows {
+
−
            height: 54px;
+
−
        }
+
−
 
+
−
        .bottom-left {
+
−
            bottom: 20px;
+
−
            left: 20px;
+
−
            line-height: 3;
+
−
            position: fixed;
+
−
            text-align: center;
+
−
        }
+
−
 
+
−
        .bottom-right {
+
−
            bottom: 20px;
+
−
            display: inline-block;
+
−
            line-height: 1.5;
+
−
            position: fixed;
+
−
            right: 70px;
+
−
            text-align: center;
+
−
        }
+
−
 
+
−
        .social-media-icon {
+
−
            color: rgba(0, 0, 0, 0.5);
+
−
            font-size: 24px;
+
−
         }
+
−
 
+
−
        .social-media-icon:hover {
+
−
            color: rgba(0, 0, 0, 0.9);
+
−
        }
+
−
 
+
−
        .vertical-align {
+
−
            display: flex;
+
−
            justify-content: center;
+
−
            align-items: center;
+
−
        }
+
−
 
+
−
        .home-title {
+
−
            color: #44414d;
+
−
            font-size: 80px;
+
−
        }
+
−
 
+
−
        #home-subtitle {
+
−
            color: #44414d;
+
−
            font-size: 47px;
+
−
        }
+
−
 
+
−
        #social-media-icons {
+
−
            list-style: none;
+
−
        }
+
−
 
+
−
        #instructions {
+
−
            display: block;
+
−
            font-size: 12px;
+
−
        }
+
−
 
+
−
        .wrapper {
+
−
            text-align: center;
+
−
        }
+
−
 
+
−
        .maincontent {
+
−
            background-color: #eeedf0;
+
−
            margin-top: 210px;
+
−
            margin-bottom: 210px;
+
−
            padding: 0;
+
−
        }
+
−
 
+
−
        #team-photo {
+
−
            padding-bottom: 1%;
+
−
            padding-left: 10%;
+
−
            padding-right: 10%;
+
−
            padding-top: 1%;
+
−
            width: 75%;
+
−
            display: block;
+
−
            margin: 0 auto;
+
−
        }
+
−
 
+
−
        @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;
+
−
            }
+
−
         
+
−
            .section-content {
+
−
                height: 50vh;
+
−
            }
+
−
        }
+
−
    </style>
+
 
     <!-- JS -->
 
     <!-- JS -->
 +
    <script src="https://2018.igem.org/Team:Calgary/jquery_3_3_1_min_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 src="https://2018.igem.org/Team:Calgary/jquery_fullPage_js?action=raw&ctype=text/javascript"></script>
 
     <script>
 
     <script>
Line 179: Line 25:
 
                 loopBottom: true,
 
                 loopBottom: true,
 
                 loopTop: true,
 
                 loopTop: true,
−
                 responsiveWidth: 1050,
+
                 responsiveWidth: 750,
 +
                responsiveHeight: 400,
 
                 afterResponsive: function (isResponsive) { }
 
                 afterResponsive: function (isResponsive) { }
 
             });
 
             });
 
         });
 
         });
 +
    window.onscroll = function() {scrollFunction()};
 +
 +
function scrollFunction() {
 +
    if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
 +
        document.getElementById("topBtn").style.display = "block";
 +
    } else {
 +
        document.getElementById("topBtn").style.display = "none";
 +
    }
 +
}
 +
 +
// When the user clicks on the button, scroll to the top of the document
 +
function topFunction() {
 +
    document.body.scrollTop = 0;
 +
    document.documentElement.scrollTop = 0;
 +
}
 +
 
     </script>
 
     </script>
 +
    <script src="https://2018.igem.org/Team:Calgary/bootstrap_min_js?action=raw&ctype=text/javascript"></script>
 
</head>
 
</head>
  
 
<body>
 
<body>
−
     <!-- Content -->
+
     <button onclick="topFunction()" id="topBtn" title="Go to top">TOP</button>
−
    <div class="container" id="fullpage">
+
    <!-- Header -->
−
        <!-- Description -->
+
    <nav class="navbar navbar-expand-lg navbar-light">
−
        <div class="section">
+
        <a class="navbar-brand" href="https://2018.igem.org/Team:Calgary">
−
            <div class="row vertical-align">
+
            <img class="navbar-logo" src="https://static.igem.org/mediawiki/2018/4/43/T--Calgary--LogoNavOff.png">
−
                <div class="col-10">
+
        </a>
−
                    <h1 class="home-title">SNIP
+
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
−
                        <span style="color: #7ccfb8">EQUIP</span> FLIP</h1>
+
            <span class="navbar-toggler-icon"></span>
−
                </div>
+
        </button>
−
                <div class="col-2">
+
        <div class="collapse navbar-collapse" id="navbarNavDropdown">
−
                    <svg style="width: 50%" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
+
            <ul class="navbar-nav">
−
                        xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
+
                <li class="nav-item dropdown">
−
                        xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+
                    <a class="nav-link underline-animation" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
−
                        xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" viewBox="0 0 79.80928 292.63452"
+
                        Project
−
                        version="1.1" id="moving-helix" inkscape:version="0.92.3 (2405546, 2018-03-11)"
+
                    </a>
−
                        sodipodi:docname="Helix.svg">
+
                    <div class="dropdown-menu dropdown-menu-center" aria-labelledby="navbarDropdownMenuLink">
−
                        <defs id="defs1848" />
+
                         <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Description">Description</a>
−
                        <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0"
+
                      <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/CRISPR">CRISPR</a>
−
                            inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="0.64" inkscape:cx="40.612564"
+
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/FLP-Beta">FLP-Beta</a>
−
                            inkscape:cy="524.45313" inkscape:document-units="mm" inkscape:current-layer="layer1"
+
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Chromatin_Modifying_Elements">CME</a>
−
                            showgrid="false" inkscape:window-width="1920" inkscape:window-height="1017"
+
                      <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Applied_Design">Product Design</a>
−
                            inkscape:window-x="-8" inkscape:window-y="32" inkscape:window-maximized="1" borderlayer="false"
+
                         <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Model">Modelling</a>
−
                            fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0"
+
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Software">Software</a>
−
                            showborder="false" />
+
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Results">Results</a>
−
                         <metadata id="metadata1851">
+
                    </div>
−
                            <rdf:RDF>
+
                </li>
−
                                <cc:Work rdf:about="">
+
−
                                    <dc:format>image/svg+xml</dc:format>
+
−
                                    <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+
−
                                    <dc:title></dc:title>
+
−
                                </cc:Work>
+
−
                            </rdf:RDF>
+
−
                        </metadata>
+
−
                         <g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1" transform="translate(-2.4802186,-2.7247285)">
+
−
                            <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"
+
                <li class="nav-item dropdown">
−
                                    inkscape:connector-curvature="0" d="m 134.34178,5.592011 v 19.23694 l 57.7106,38.473729 V 44.065821 Z" />
+
                    <a class="nav-link underline-animation" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
                        Notebook
 +
                    </a>
 +
                    <div class="dropdown-menu dropdown-menu-center" aria-labelledby="navbarDropdownMenuLink">
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Notebook">Journals</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Protocols">Protocols</a>
 +
                    </div>
 +
                </li>
  
−
                                <path class="dark-green move-right appear-right" id="dgreen3" sodipodi:nodetypes="ccccc"
+
                <li class="nav-item dropdown">
−
                                    inkscape:connector-curvature="0" d="m 134.34175,44.065952 v 19.236859 l 57.7106,38.473789 V 82.539731 Z" />
+
                    <a class="nav-link underline-animation" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
                        Team
 +
                    </a>
 +
                    <div class="dropdown-menu dropdown-menu-center" aria-labelledby="navbarDropdownMenuLink">
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Team">Team Members</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Attributions">Attributions</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Sponsors">Sponsors</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Contact_Us">Contact Us</a>
 +
                    </div>
 +
                </li>
  
−
                                <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"
+
                <li class="nav-item dropdown">
−
                                    inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
+
                    <a class="nav-link underline-animation" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
                        Human Practices
 +
                    </a>
 +
                    <div class="dropdown-menu dropdown-menu-center" aria-labelledby="navbarDropdownMenuLink">
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Human_Practices">Summary</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Human_Practices/Silver">Silver</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Human_Practices/Gold_Integrated">Integrated</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Collaborations">Collaborations</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Public_Engagement">Public Engagement</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Safety">Safety</a>
 +
                    </div>
 +
                </li>
  
−
                                <path class="dark-grey" id="dgrey1" sodipodi:nodetypes="ccccc"
+
                <li class="nav-item dropdown">
−
                                    inkscape:connector-curvature="0" d="m 76.631184,44.065871 v 19.23694 L 134.34178,101.77654 V 82.539681 Z" />
+
                    <a class="nav-link underline-animation" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 +
                        Judging
 +
                    </a>
 +
                    <div class="dropdown-menu dropdown-menu-center" aria-labelledby="navbarDropdownMenuLink">
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/MedalRequirements">Medal Requirements</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Parts">Parts</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/Improve">Improved Part</a>
 +
                        <a class="dropdown-item" href="https://2018.igem.org/Team:Calgary/InterLab">Interlab</a>
 +
                    </div>
 +
                </li>
  
−
                                <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"
+
             </ul>
−
                                    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="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" 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" 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"
+
−
                                    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-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" 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="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"
+
−
                                    inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc" />
+
−
 
+
−
                            </g>
+
−
                        </g>
+
−
                    </svg>
+
−
                </div>
+
−
             </div>
+
 
         </div>
 
         </div>
−
        <!-- Page 2 -->
+
     </nav>
−
        <div class="section">
+
     <!-- Social Media -->
−
            <div class="section-content">
+
     <div class="bottom-left">
−
                <h2 style="text-align: left; color: #44414d">The ideal medicine is not a perfect treatment . . .</h2>
+
−
                <br>
+
−
                <br>
+
−
                <h2 style="text-align: right; color: #44414d">. . . it's a <span style="color: #7ccfb8">cure</span></h2>
+
−
            </div>
+
−
        </div>
+
−
        <!-- Page 3 -->
+
−
        <div class="section">
+
−
            <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>
+
−
                <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>
+
−
                <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>
+
−
                <h2 style="text-align: center; color: #44414d" class="home-title">SNIP <span style="color: #7ccfb8">EQUIP</span> FLIP</h2>
+
−
                <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">
+
−
            <div class="section-content">
+
−
                <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>
+
−
                <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 and may facilitate a vast array of scientific discoveries.</h2>
+
−
            </div>
+
−
        </div>
+
−
        <!-- Page 7 -->
+
−
        <div class="section">
+
−
            <div class="section-content">
+
−
                <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>
+
−
                <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">Learn more about our system here</button></a>
+
−
                </div>
+
−
            </div>
+
−
        </div>
+
−
     </div>
+
−
     <!-- Achievement Tab -->
+
−
     <div class="top-right">
+
 
         <ul id="social-media-icons">
 
         <ul id="social-media-icons">
 
             <li>
 
             <li>
−
                 <a class="social-media-link" href="https://2018.igem.org/Team:Calgary/MedalRequirements" target="_blank"><i style="padding-left: 10px" class="fas fa-medal social-media-icon" aria-hidden="true"></i></a></div>
+
                 <a class="social-media-link" href="https://2018.igem.org/Team:Calgary/MedalRequirements">
 +
                    <i class="fas fa-medal achievements-icon" aria-hidden="true"></i>
 +
                </a>
 +
            </li>
 +
            <li>
 +
                <a class="social-media-link" href="https://www.facebook.com/igemcalgary/" target="_blank">
 +
                    <i class="fab fa-facebook-f social-media-icon" aria-hidden="true"></i>
 +
                </a>
 +
            </li>
 +
            <li>
 +
                <a class="social-media-link" href="https://www.instagram.com/igemcalgary/?hl=en" target="_blank">
 +
                    <i class="fab fa-instagram social-media-icon" aria-hidden="true"></i>
 +
                </a>
 +
            </li>
 +
            <li>
 +
                <a class="social-media-link" href="https://twitter.com/igemcalgary?lang=en" target="_blank">
 +
                    <i class="fab fa-twitter social-media-icon" aria-hidden="true"></i>
 +
                </a>
 +
            </li>
 +
            <li>
 +
                <a class="social-media-link" href="https://2018.igem.org/Team:Calgary/Contact_Us" target="_blank">
 +
                    <i class="far fa-envelope social-media-icon" aria-hidden="true"></i>
 +
                </a>
 
             </li>
 
             </li>
 
         </ul>
 
         </ul>
−
    </div>
 
−
    <!-- Arrow Keys -->
 
−
    <div class="bottom-right">
 
−
        <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:inkscape="http://www.inkscape.org/namespaces/inkscape" height="600" viewBox="0 0 36.634037 23.343925"
 
−
            version="1.1" id="blinking-arrows" sodipodi:docname="Arrows.svg" inkscape:version="0.92.3 (2405546, 2018-03-11)">
 
−
            <defs id="defs2408" />
 
−
            <sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0"
 
−
                inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="5.6" inkscape:cx="54.174134"
 
−
                inkscape:cy="3.2464811" inkscape:document-units="mm" inkscape:current-layer="layer1" showgrid="false"
 
−
                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">
 
−
                <rdf:RDF>
 
−
                    <cc:Work rdf:about="">
 
−
                        <dc:format>image/svg+xml</dc:format>
 
−
                        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
 
−
                        <dc:title></dc:title>
 
−
                    </cc:Work>
 
−
                </rdf:RDF>
 
−
            </metadata>
 
−
            <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" ry="1.505878" />
 
−
                <path sodipodi:type="star" id="path2352" class="arrow-v-light-grey blinky-delay" sodipodi:sides="3"
 
−
                    sodipodi:cx="115.4742" sodipodi:cy="96.813065" sodipodi:r1="1.7300762" sodipodi:r2="0.8650381"
 
−
                    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" />
 
−
                <rect ry="1.505878" y="-114.06599" x="110.84529" height="9.2528648" width="9.2528639" id="rect2354"
 
−
                    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"
 
−
                    inkscape:randomized="0" inkscape:rounded="0" inkscape:flatsided="false" sodipodi:arg2="1.5707963"
 
−
                    sodipodi:arg1="0.52359878" sodipodi:r2="0.8650381" sodipodi:r1="1.7300762" sodipodi:cy="-109.00545"
 
−
                    sodipodi:cx="115.4742" sodipodi:sides="3" id="path2357" class="arrow-v-light-grey blinky"
 
−
                    sodipodi:type="star" />
 
−
                <rect transform="matrix(0,1,1,0,0,0)" id="rect2359" class="box-verylight-grey" width="9.2528648" height="9.2528639"
 
−
                    x="104.81404" y="97.668991" ry="1.5058781" />
 
−
                <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"
 
−
                    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" 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" 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,-410.50945,905.62203)" inkscape:transform-center-x="-0.43298603"
 
−
                    inkscape:transform-center-y="-0.00080335859" />
 
−
            </g>
 
−
        </svg>
 
−
        <span id="instructions">Use arrow keys <br>or scroll</span>
 
 
     </div>
 
     </div>
 
</body>
 
</body>
  
 
</html>
 
</html>

Latest revision as of 23:22, 25 November 2018