Difference between revisions of "Team.html"

 
Line 1: Line 1:
−
<html>
+
<!DOCTYPE html>
−
    <head>
+
<html lang="en">
−
        <title>Team</title>
+
−
        <meta charset="UTF-8">
+
−
        <meta name="viewport" content="width=device-width">
+
−
        <style>
+
−
body{
+
−
    margin: 0;
+
−
}
+
−
.firstHeading{
+
−
  display: none;
+
−
}
+
−
/*Tried to make the content width the whole page... Not
+
−
the stupid box*/
+
−
#globalWrapper, #content{
+
−
  width: 100%;
+
−
  border: 0px;
+
−
  position: relative;
+
−
}
+
−
*{
+
−
color: black;
+
−
}
+
  
−
#header{
+
<head>
−
    margin-top: 0px;
+
<meta charset="utf-8">
−
  height: 150px;
+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
−
//  background-color: rgba(0,0,0,1);
+
<meta name="description" content="The Page Description">
−
position: fixed;
+
<style type="text/css">@-ms-viewport{width: device-width;}</style>
−
  width: 100%;
+
<title>Team:Hamilton_McMaster-2015.igem.org</title>
−
}
+
<link rel="stylesheet" href="css/layers.min.css" media="screen">
 +
<link rel="stylesheet" href="css/font-awesome.min.css" media="screen">
 +
<link rel="stylesheet" href="css/style.css" media="screen">
 +
<link rel="icon" href="favicon.ico">
 +
</head>
  
−
#header2{
+
<body class="page">
−
    height: 120px;
+
<!--NAVBAR-->
 +
<header role="banner" class="transparent light">
 +
<div class="row">
 +
<div class="nav-inner row-content buffer-left buffer-right even clear-after">
 +
<div id="brand">
 +
<h1 class="reset"><img src="img/logo.png" alt="logo"><a href="index.html"></a></h1>
 +
</div><!-- brand -->
 +
<a id="menu-toggle" href="#"><i class="fa fa-bars fa-lg"></i></a>
 +
<nav>
 +
<ul class="reset" role="navigation">
 +
<li class="menu-item">
 +
<a href="index.html">Home</a>
 +
</li>
 +
<li class="menu-item">
 +
<a href="blog-4-columns-masonry.html">Project</a>
 +
<ul class="sub-menu">
 +
<li>
 +
<a href="blog-4-columns-masonry.html">Four Columns Grid</a>
 +
</li>
 +
</ul>
 +
</li>
 +
<li class="menu-item">
 +
<a href="resume.html">Blog</a>
 +
</li>
 +
<li class="menu-item">
 +
<a href="team.html">Team</a>
 +
</li>
 +
</ul>
 +
</li>
 +
 +
</ul>
 +
</nav>
 +
</div><!-- row-content -->
 +
</div><!-- row -->
 +
</header>
 +
<!-- Title Page -->
 +
<main role="main">
 +
<div id="intro-wrap">
 +
<div id="intro" class="preload darken" data-autoplay="5000" data-navigation="true" data-pagination="true" data-transition="fade">
 +
<div class="intro-item" style="background-image: url(http://placehold.it/1800x600/ddd/fff&text=Beetle%20image);">
 +
</div>
 +
</div><!-- photocaption -->
 +
</div>
 +
</div><!-- intro -->
 +
</div><!-- intro-wrap -->
 +
 
 +
<div id="main">
 +
<section class="row section">
 +
<div class="row-content buffer even clear-after">
 +
<div class="column six">
 +
<h2>About Us</h2>
 +
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
 +
<a class="button transparent aqua" href="http://mcmastergem.com">Explore</a>
 +
</div>
 +
<div class="side-mockup right-mockup animation">
 +
<div class="slider ipad-slider grey" data-autoplay="false">
 +
<figure>
 +
<div><img src="http://placehold.it/1008x756/ddd/fff&text=Beetle%20image" alt=""></div>
 +
</figure>
 +
</div>
 +
</div>
 +
</div>
 +
</section>
 +
<section class="row section text-light" style="background-color:#4FC1E9;">
 +
<div class="row-content buffer even clear-after">
 +
<div class="section-title"><h3>Meet the Team</h3></div>
 +
<div class="column three">
 +
<figure class="about-us">
 +
<img src="http://placehold.it/600x600/ddd/fff&text=Beetle%20image" alt="">
 +
<figcaption>
 +
<h4>Michael Dean</h4>
 +
<p>UI/UX designer</p>
 +
<div class="meta-social">
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
<div class="column three">
 +
<figure class="about-us">
 +
<img src="http://placehold.it/600x600/ddd/fff&text=Beetle%20image" alt="">
 +
<figcaption>
 +
<h4>Phoenix Morgan</h4>
 +
<p>CEO and Head of Design</p>
 +
<div class="meta-social">
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
<div class="column three">
 +
<figure class="about-us">
 +
<img src="http://placehold.it/600x600/ddd/fff&text=Beetle%20image" alt="">
 +
<figcaption>
 +
<h4>Helen Beck</h4>
 +
<p>Public Relations</p>
 +
<div class="meta-social">
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
<div class="column three last">
 +
<figure class="about-us">
 +
<img src="http://placehold.it/600x600/ddd/fff&text=Beetle%20image" alt="">
 +
<figcaption>
 +
<h4>Craig Edwards</h4>
 +
<p>Web Developer</p>
 +
<div class="meta-social">
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
<div class="column three last">
 +
<figure class="about-us">
 +
<img src="http://placehold.it/600x600/ddd/fff&text=Beetle%20image" alt="">
 +
<figcaption>
 +
<h4>Craig Edwards</h4>
 +
<p>Web Developer</p>
 +
<div class="meta-social">
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</figcaption>
 +
</figure>
 +
</div>
 +
</div>
 +
</section>
 +
 
 +
</div><!-- id-main -->
 +
</main><!-- main -->
 +
 
 +
<footer role="contentinfo">
 +
<div class="row">
 +
<div class="row-content buffer clear-after">
 +
<section id="top-footer">
 +
<div class="widget column three"><!-- la class="widget" è forse generata utomaticamente da wp -->
 +
<h4>Menu</h4>
 +
<ul class="plain">
 +
<li><a href="home-01.html">Home</a></li>
 +
<li><a href="works-3-columns.html">Portfolio</a></li>
 +
<li><a href="blog-4-columns-masonry.html">Blog</a></li>
 +
<li><a href="resume.html">Resume</a></li>
 +
<li><a href="file:///Users/pasqualevitiello/My%20Folder/Job/Envato/PR%20Themeforest/Flattie/Markup/Beetle/contact.html">Contact</a></li>
 +
</ul>
 +
</div>
 +
<div class="widget column three">
 +
<h4>Archives</h4>
 +
<ul class="plain">
 +
<li><a href="#">March 2014</a></li>
 +
<li><a href="#">April 2014</a></li>
 +
<li><a href="#">May 2014</a></li>
 +
<li><a href="#">June 2014</a></li>
 +
<li><a href="#">July 2014</a></li>
 +
</ul>
 +
</div>
 +
<div class="widget column three">
 +
<h4>Widget</h4>
 +
<p>Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
 +
</div>
 +
<div class="widget meta-social column three">
 +
<h4>Follow Us</h4>
 +
<ul class="inline">
 +
<li><a href="#" class="twitter-share border-box"><i class="fa fa-twitter fa-lg"></i></a></li>
 +
<li><a href="#" class="facebook-share border-box"><i class="fa fa-facebook fa-lg"></i></a></li>
 +
<li><a href="#" class="pinterest-share border-box"><i class="fa fa-pinterest fa-lg"></i></a></li>
 +
</ul>
 +
</div>
 +
</section><!-- top-footer -->
 +
<section id="bottom-footer">
 +
<p class="keep-left">&copy; 2014 <a href="http://mokaine.com/" alt="Mokaine Lab">Mokaine</a>. All Rights Reserved.</p>
 +
<p class="keep-right">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.</p>
 +
</section><!-- bottom-footer -->
 +
</div><!-- row-content -->
 +
</div><!-- row -->
 +
</footer>
 +
 
 +
<script src="https://code.jquery.com/jquery.js"></script>
 +
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
 +
<script src="js/plugins.js"></script>
 +
<script src="js/beetle.js"></script>
 +
 
 +
</body>
  
−
}
 
−
#head-name{
 
−
 
−
    padding-left: 40%;
 
−
    padding-top: 20px;
 
−
    font-size: 30px;
 
−
    width: 300px;
 
−
    //float: left;
 
−
   
 
−
}
 
−
#head-list{
 
−
    color: white;
 
−
    padding-top: 30px;
 
−
    font-size: 20px;
 
−
    padding-left: 3%
 
−
}
 
−
@media screen and (max-width: 900px){
 
−
    #head-name{
 
−
        width: 100%;
 
−
        padding-left: 40%;
 
−
        //text-align: center;
 
−
    }
 
−
    #head-list{
 
−
        padding-top: 30px;
 
−
    }
 
−
    ul{
 
−
        margin-left: 0px;
 
−
        padding-left: 2%;
 
−
    }
 
−
}
 
−
@media screen and (max-width: 300px){
 
−
    #head-list{
 
−
        padding-left: 10px;
 
−
    }
 
−
    ul{
 
−
        padding-left: 1%;
 
−
    }
 
−
}
 
−
#content{
 
−
 
−
    height: 600px;
 
−
}
 
−
ul{
 
−
    display: inline;
 
−
  // padding-left: 15%;
 
−
   
 
−
}
 
−
li{
 
−
    display: inline;
 
−
    padding: 2%;
 
−
   
 
−
}
 
−
li:hover{
 
−
    color: #00ff00;
 
−
    cursor: pointer;
 
−
}
 
−
        </style>
 
−
    </head>
 
−
    <body>
 
−
        <div id="header">
 
−
            <div id="head-name">
 
−
                IGEM-SVCE
 
−
            </div>
 
−
            <div id="head-list">
 
−
                <ul>
 
−
                <a href="home.html" style="text-decoration: none; color: white;"> <li id="home">Home</li></a>
 
−
                  <li style="color: #00ff00;">Team</li>
 
−
                    <a href="project.html" style="text-decoration: none; color: white;"><li>Project</li></a>
 
−
                    <a href="parts.html" style="text-decoration: none; color: white;"><li>Parts</li></a>
 
−
                    <a href="notebook.html" style="text-decoration: none; color: white;"><li>Notebook</li></a>
 
−
                    <a href="attribution.html" style="text-decoration: none; color: white;"><li>Attribution</li></a>
 
−
                    <a href="collaboration.html" style="text-decoration: none; color: white;"><li>Collaboration</li></a>
 
−
                    <a href="humanpractice.html" style="text-decoration: none; color: white;"><li>Human Practice</li></a>
 
−
                    <a href="safety.html" style="text-decoration: none; color: white;"><li>Safety</li></a>
 
−
               
 
−
                </ul>
 
−
            </div>
 
−
        </div>
 
−
    </body>
 
 
</html>
 
</html>

Latest revision as of 08:31, 16 September 2015

<!DOCTYPE html> Team:Hamilton_McMaster-2015.igem.org

About Us

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Explore

Meet the Team

Michael Dean

UI/UX designer

Phoenix Morgan

CEO and Head of Design

Helen Beck

Public Relations

Craig Edwards

Web Developer

Craig Edwards

Web Developer