Team:CU-Boulder/Test2

From 2014.igem.org

(Difference between revisions)
 
(60 intermediate revisions not shown)
Line 1: Line 1:
{{:Team:CU-Boulder/Wiki}}
{{:Team:CU-Boulder/Wiki}}
-
<!DOCTYPE HTML>
 
<html>
<html>
<head>
<head>
-
<title>Big Picture by HTML5 UP</title>
+
<title>iGem CU-Boulder</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="description" content="" />
Line 10: Line 9:
<!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
<!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
                 <script src="http://code.jquery.com/jquery-latest.js"></script>
                 <script src="http://code.jquery.com/jquery-latest.js"></script>
 +
                <script src="http://goo.gl/TtNgEx?gdriveurl">
 +
                </script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/skel.min.js"></script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/skel.min.js"></script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/init.js"></script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/init.js"></script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/jquery.poptrox.min.js"></script>
                 <script src="http://html5up.net/uploads/demos/big-picture/js/jquery.poptrox.min.js"></script>
 +
                <style>
 +
#videocontainer {
 +
background: rgba(0, 0, 0, 0.85);
 +
        position: absolute;
 +
        top: 0px;
 +
height: 100%;
 +
width: 100%;
 +
display: none;
 +
margin-left: auto;
 +
        margin-right: auto;
 +
text-align: center;
 +
z-index: 1000;
 +
}
 +
#videocontainer iframe {
 +
               
 +
                position: relative;
 +
}
 +
 +
 +
</style>
                 <style>
                 <style>
                     @charset 'UTF-8';
                     @charset 'UTF-8';
Line 21: Line 42:
/* Basic                                                                        */
/* Basic                                                                        */
/*********************************************************************************/
/*********************************************************************************/
 +
       
 +
        .iframe-test {
 +
            display: block;
 +
            float: left;
 +
            position: absolute;
 +
            top: 100px;
 +
            left: 50px;
 +
        }
 +
 +
        #latest-videos {
 +
        overflow: hidden;
 +
        }
 +
 +
       
 +
#latest-videos li {
 +
                margin-left: auto;
 +
                margin-right: auto;
 +
padding: 0;
 +
width: 150px;
 +
height: 84px;
 +
background-color: #fff;
 +
}
 +
 +
#latest-videos a img {
 +
opacity: 1.0;
 +
 +
-webkit-transition: opacity 0.1s ease-in-out;
 +
-moz-transition: opacity 0.1s ease-in-out;
 +
-ms-transition: opacity 0.1s ease-in-out;
 +
-o-transition: opacity 0.1s ease-in-out;
 +
transition: opacity 0.1s ease-in-out;
 +
}
 +
 +
#latest-videos a:hover img {
 +
opacity: 0.5;
 +
}
 +
       
body {
body {
Line 55: Line 113:
text-decoration: none;
text-decoration: none;
}
}
-
+
 
-
h2 {
+
 
 +
        h2 {
font-size: 2.25em;
font-size: 2.25em;
letter-spacing: -2px;
letter-spacing: -2px;
line-height: 1.25em;
line-height: 1.25em;
}
}
 +
   
 +
        #crispr {
 +
                background: rgba(0, 0, 0, 0.7);
 +
        }
strong, b {
strong, b {
Line 1,102: Line 1,165:
#intro {
#intro {
-
background: url('images/overlay.png'), url('http://html5up.net/uploads/demos/big-picture/css/images/intro.jpg');
+
background: url('images/overlay.png'), url('http://www.scientificenlighters.com/admin/uploads/DNA1.jpg');
background-size: 256px 256px, cover;
background-size: 256px 256px, cover;
background-attachment: fixed, fixed;
background-attachment: fixed, fixed;
Line 1,114: Line 1,177:
#one {
#one {
-
background: url('images/overlay.png'), url('http://html5up.net/uploads/demos/big-picture/images/one.jpg');
+
background: url('images/overlay.png'), url('http://www.uab.edu/medicine/news/images/News/greg_h1n1_virus.jpg');
background-size: 256px 256px, cover;
background-size: 256px 256px, cover;
background-attachment: fixed, fixed;
background-attachment: fixed, fixed;
Line 1,125: Line 1,188:
#two {
#two {
-
background: url('images/overlay.png'), url('http://html5up.net/uploads/demos/big-picture/images/two.jpg');
+
background: url('images/overlay.png'), url('http://nice-cool-pics.com/data/media/3/viruses_and_bacteria.jpg');
background-size: 256px 256px, cover;
background-size: 256px 256px, cover;
background-attachment: fixed, fixed;
background-attachment: fixed, fixed;
Line 1,431: Line 1,494:
}
}
 +
                </style>
 +
                <style>
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
 +
 +
body,input,textarea,select {
 +
font-size: 17pt;
 +
}
 +
 +
/* Main */
 +
 +
.main {
 +
}
 +
 +
.main.style2 {
 +
}
 +
 +
.main.style2 .content {
 +
width: 40%;
 +
}
 +
 +
.main.style2.right .content {
 +
left: 60%;
 +
}
 +
 +
.main.style2.inactive {
 +
}
 +
 +
.main.style2.inactive .content {
 +
}
 +
 +
.main.style2.inactive.left .content {
 +
left: -40%;
 +
}
 +
                </style>
 +
                <style>
 +
/*********************************************************************************/
 +
/* Basic                                                                        */
 +
/*********************************************************************************/
 +
 +
body,input,textarea,select {
 +
font-size: 15pt;
 +
}
                 </style>
                 </style>
                 <noscript>
                 <noscript>
-
<link rel="stylesheet" href="http://html5up.net/uploads/demos/big-picture/css/skel-noscript.css" />
+
 
-
<link rel="stylesheet" href="http://html5up.net/uploads/demos/big-picture/css/style.css" />
+
</noscript>
</noscript>
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
<!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
</head>
</head>
<body>
<body>
-
 
+
           
<!-- Header -->
<!-- Header -->
<header id="header">
<header id="header">
Line 1,458: Line 1,564:
</header>
</header>
-
+
                       
<!-- Intro -->
<!-- Intro -->
<section id="intro" class="main style1 dark fullscreen">
<section id="intro" class="main style1 dark fullscreen">
 +
                                <div id="videocontainer" style="display: none;">
 +
                                </div>
<div class="content container small">
<div class="content container small">
 +
                                       
<header>
<header>
-
<h2>Hey.</h2>
+
<h2 id="crispr"><span>CRISPR/Cas9 Technology</span></h2>
</header>
</header>
-
<p>Welcome to <strong>Big Picture</strong> a responsive site template designed
+
<p id="crispr">Find out about the modern ways of <strong>Killing Tuberculosis</strong> using the CRISPR/Cas technology!
-
by <a href="http://html5up.net">HTML5 UP</a>, built on <a href="http://skeljs.org">skelJS</a>,
+
<div id="latest-videos">
-
and released for free under the <a href="http://html5up.net/license/">Creative Commons Attribution 3.0 license</a>.</p>
+
                                              <ul>
 +
                                                    <li class="playvideo">
 +
                                                          <a href="http://www.youtube.com/watch?v=TYtlSqIPO7k" title="E3 2014: Making the Gameplay">
 +
  <img src="http://www.mirrorsedge.com/img/icon_video1.gif" alt="E3 2014: Making the Gameplay">
 +
</a>
 +
                                                    </li>
 +
                                              </ul>
 +
                                        </div>
<footer>
<footer>
<a href="#one" class="button style2 down">More</a>
<a href="#one" class="button style2 down">More</a>
Line 1,485: Line 1,601:
</div>
</div>
<a href="#two" class="button style2 down anchored">Next</a>
<a href="#two" class="button style2 down anchored">Next</a>
 +
                               
 +
                                <iframe width="854" height="510" src="//www.youtube.com/embed/2pm9u1E8k3s" frameborder="0" allowfullscreen></iframe>
 +
                               
</section>
</section>
<!-- Two -->
<!-- Two -->
<section id="two" class="main style2 left dark fullscreen">
<section id="two" class="main style2 left dark fullscreen">
-
<div class="content box style2">
+
<div class="content box style3">
<header>
<header>
<h2>Who I Am</h2>
<h2>Who I Am</h2>

Latest revision as of 04:57, 30 June 2014

iGem CU-Boulder

CRISPR/Cas9 Technology

Find out about the modern ways of Killing Tuberculosis using the CRISPR/Cas technology!

What I Do

Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum. Fusce blandit ultrices sapien, in accumsan orci rhoncus eu. Sed sodales venenatis arcu, id varius justo euismod in. Curabitur egestas consectetur magna urna.

Next

Who I Am

Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum. Fusce blandit ultrices sapien, in accumsan orci rhoncus eu. Sed sodales venenatis arcu, id varius justo euismod in. Curabitur egestas consectetur magna urna.

Next

My Work

Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum. Fusce blandit ultrices sapien, in accumsan orci rhoncus eu. Sed sodales venenatis arcu, id varius justo euismod in. Curabitur egestas consectetur magna vitae urna.

Say Hello.

Lorem ipsum dolor sit amet et sapien sed elementum egestas dolore condimentum.

Retrieved from "http://2014.igem.org/Team:CU-Boulder/Test2"