|
|
| Line 47: |
Line 47: |
| | </div> | | </div> |
| | | | |
| - | <div class="3u">
| + | <!-- Featured --> |
| - | <!-- Main -->
| + | <div id="featured"> |
| - | <div id="page"> | + | <div class="container"> |
| - | | + | |
| - | <!-- Extra -->
| + | |
| - | <div id="marketing" class="container"> | + | |
| | <div class="row"> | | <div class="row"> |
| - | <div class="3u"> | + | <section class="4u"> |
| - | <section> | + | <div class="box"> |
| - | <header>
| + | <a href="# " class="image left"><img src="images/ pics04.jpg" alt=""></a> |
| - | <h2>Basic Research</h2>
| + | <h3>Etiam posuere augue</h3> |
| - | </header>
| + | <p>Donec nonummy magna quis risus eleifend. </p> |
| - | <p class="subtitle">Explore how our basic research fueled our project development and research.</p>
| + | |
| - | <p><a href="#"><img src="images/ pics13.jpg" alt=""></a></p> | + | |
| | <a href="#" class="button">More</a> | | <a href="#" class="button">More</a> |
| - | <style>
| + | </div> |
| - | a.button:link {
| + | </section> |
| - | color: #FFFFFF;
| + | <section class="4u"> |
| - | text-decoration: none;
| + | <div class="box"> |
| - | }
| + | <a href="# " class="image left"><img src="images/ pics05.jpg" alt=""></a> |
| - | a.button:visited {
| + | <h3>Etiam posuere augue</h3> |
| - | color: #FFFFFF;
| + | <p>Donec nonummy magna quis risus eleifend. </p> |
| - | text-decoration: none;
| + | |
| - | }
| + | |
| - | a.button:hover {
| + | |
| - | color: #FFCC00;
| + | |
| - | text-decoration: none;
| + | |
| - | }
| + | |
| - | a.button:active {
| + | |
| - | color: #FFFFFF;
| + | |
| - | text-decoration: none;
| + | |
| - | }
| + | |
| - | </style>
| + | |
| - | | + | |
| - | </section> | + | |
| - |
| + | |
| - | </div> | + | |
| - | <div class="3u"> | + | |
| - | <section> | + | |
| - | <header>
| + | |
| - | <h2>Applied Research</h2>
| + | |
| - | </header>
| + | |
| - | <p class="subtitle">Explore how we have made a biobrick that can detect lung cancer in a simple, inexpensive way.</p>
| + | |
| - | <p><a href="#"><img src="images/ pics14.jpg" alt=""></a></p> | + | |
| | <a href="#" class="button">More</a> | | <a href="#" class="button">More</a> |
| - | </section> | + | </div> |
| - | </div> | + | </section> |
| - | <div class="3u"> | + | <section class="4u"> |
| - | <section> | + | <div class="box"> |
| - | <header>
| + | <a href="# " class="image left"><img src="images/ pics06.jpg" alt=""></a> |
| - | <h2>Outreach</h2>
| + | <h3>Etiam posuere augue</h3> |
| - | </header>
| + | <p>Donec nonummy magna quis risus eleifend. </p> |
| - | <p class="subtitle">Educating our community and gathering public opinion on modern biotechnology.</p>
| + | |
| - | <p><a href="#"><img src="images/ pics15.jpg" alt=""></a></p> | + | |
| | <a href="#" class="button">More</a> | | <a href="#" class="button">More</a> |
| - | </section> | + | </div> |
| - | </div>
| + | </section> |
| - | <div class="3u"> | + | |
| - | <section>
| + | |
| - | <header>
| + | |
| - | <h2>Video</h2>
| + | |
| - | </header>
| + | |
| - | <p class="subtitle">Watch the video explaining our project in detail which embodies our message toward the entire world.</p>
| + | |
| - | <p><a href="#"><img src="images/pics16.jpg" alt=""></a></p>
| + | |
| - | <a href="#" class="button">More</a>
| + | |
| - | </section>
| + | |
| - | </div>
| + | |
| | </div> | | </div> |
| | + | <div class="divider"></div> |
| | </div> | | </div> |
| - | <!-- Extra -->
| |
| - | <div id="marketing" class="container">
| |
| - | <div class="row">
| |
| - | <div class="3u">
| |
| - | <section>
| |
| - | <header>
| |
| - | <h2>Safety</h2>
| |
| - | </header>
| |
| - | <p class="subtitle">Our safety precautions</p>
| |
| - | <p><a href="#"><img src="images/pics13.jpg" alt=""></a></p>
| |
| - | <a href="#" class="button">More</a>
| |
| - | <style>
| |
| - | a.button:link {
| |
| - | color: #FFFFFF;
| |
| - | text-decoration: none;
| |
| - | }
| |
| - | a.button:visited {
| |
| - | color: #FFFFFF;
| |
| - | text-decoration: none;
| |
| - | }
| |
| - | a.button:hover {
| |
| - | color: #FFCC00;
| |
| - | text-decoration: none;
| |
| - | }
| |
| - | a.button:active {
| |
| - | color: #FFFFFF;
| |
| - | text-decoration: none;
| |
| - | }
| |
| - | </style>
| |
| - |
| |
| - | </section>
| |
| - |
| |
| - | </div>
| |
| - | <div class="3u">
| |
| - | <section>
| |
| - | <header>
| |
| - | <h2>Attributions</h2>
| |
| - | </header>
| |
| - | <p class="subtitle">Insert Description</p>
| |
| - | <p><a href="#"><img src="images/pics14.jpg" alt=""></a></p>
| |
| - | <a href="#" class="button">More</a>
| |
| - | </section>
| |
| - | </div>
| |
| - | <div class="3u">
| |
| - | <section>
| |
| - | <header>
| |
| - | <h2>Human Practices</h2>
| |
| - | </header>
| |
| - | <p class="subtitle">Insert Description</p>
| |
| - | <p><a href="#"><img src="images/pics15.jpg" alt=""></a></p>
| |
| - | <a href="#" class="button">More</a>
| |
| - | </section>
| |
| - | </div>
| |
| - | <div class="3u">
| |
| - | <section>
| |
| - | <header>
| |
| - | <h2>Sponsors</h2>
| |
| - | </header>
| |
| - | <p class="subtitle">Insert Description</p>
| |
| - | <p><a href="#"><img src="images/pics15.jpg" alt=""></a></p>
| |
| - | <a href="#" class="button">More</a>
| |
| - | </section>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - | </div>
| |
| - | <!-- /Extra -->
| |
| - |
| |
| - | <!-- Main -->
| |
| - | <div id="main" class="container">
| |
| - | <div class="row">
| |
| - | <div class="6u">
| |
| - | <section>
| |
| - | <header>
| |
| - | <h2>About Us</h2>
| |
| - | <span class="byline"></span>
| |
| - | </header>
| |
| - | <p>This is <strong>Ex Machina</strong>, a responsive HTML5 site template freebie by <a href="http://templated.co">TEMPLATED</a>. Released for free under the <a href="http://templated.co/license">Creative Commons Attribution</a> license, so use it for whatever (personal or commercial) – just give us credit! Check out more of our stuff at <a href="http://templated.co">our site</a> or follow us on <a href="http://twitter.com/templatedco">Twitter</a>.</p>
| |
| - | <p>Sed etiam vestibulum velit, euismod lacinia quam nisl id lorem. Quisque erat. Vestibulum pellentesque, justo mollis pretium suscipit, justo nulla blandit libero, in blandit augue justo quis nisl. Fusce mattis viverra elit. Fusce quis tortor. Consectetuer adipiscing elit. Nam pede erat, porta eu, lobortis eget lorem ipsum dolor. Donec placerat odio vel elit. Nullam ante orci, pellentesque eget, tempus quis, ultrices in, est. Curabitur sit amet nulla. Nam in massa. Sed vel tellus. Curabitur sem urna, consequat. Sed etiam vestibulum velit, euismod lacinia quam nisl id lorem. Quisque erat.</p>
| |
| - | <p>Sed etiam vestibulum velit, euismod lacinia quam nisl id lorem. Quisque erat. Vestibulum pellentesque, justo mollis pretium suscipit, justo nulla blandit libero, in blandit augue justo quis nisl. Fusce mattis viverra elit. Fusce quis tortor. Consectetuer adipiscing elit. Nam pede erat, porta eu, lobortis eget lorem ipsum dolor. Donec placerat odio vel elit. Nullam ante orci, pellentesque eget, tempus quis, ultrices in, est. Curabitur sit amet nulla. Nam in massa. Sed vel tellus. Curabitur sem urna, consequat. Sed etiam vestibulum velit, euismod lacinia quam nisl id lorem. Quisque erat.</p>
| |
| - | <a href="#" class="button">More Details</a>
| |
| - | </section>
| |
| - | </div>
| |
| - | <div class="3u">
| |
| - | <section class="sidebar">
| |
| - | <header>
| |
| - | <h2>Feugiat Tempus</h2>
| |
| - | </header>
| |
| - | <ul class="style2">
| |
| - | <li>
| |
| - | <a href="#"><img src="images/pics07.jpg" alt=""></a>
| |
| - | <p>Donec leo, vivamus fermentum augue praesent a lacus at urna rutrum.</p>
| |
| - | </li>
| |
| - | <li>
| |
| - | <a href="#"><img src="images/pics08.jpg" alt=""></a>
| |
| - | <p>Donec leo, vivamus fermentum augue praesent a lacus at urna rutrum.</p>
| |
| - | </li>
| |
| - | <li>
| |
| - | <a href="#"><img src="images/pics09.jpg" alt=""></a>
| |
| - | <p>Donec leo, vivamus fermentum augue praesent a lacus at urna rutrum.</p>
| |
| - | </li>
| |
| - | <li>
| |
| - | <a href="#"><img src="images/pics10.jpg" alt=""></a>
| |
| - | <p>Donec leo, vivamus fermentum augue praesent a lacus at urna rutrum.</p>
| |
| - | </li>
| |
| - | </ul>
| |
| - | </section>
| |
| - | </div>
| |
| - |
| |
| - | <!-- Main -->
| |
| - |
| |
| | </div> | | </div> |
| - | <!-- /Main --> | + | <!-- /Featured --> |
| - | | + | |
| - | | + | |
| - | </body>
| + | |
| | </html> | | </html> |
"
