Difference between revisions of "Team:British Columbia/HP/Silver"

 
Line 1: Line 1:
−
{{British_Columbia}}
+
{{British_Columbia_2}}
−
<html>
+
{{British_Columbia_Navbar}}
 +
<html lang="en">
 +
<head>
 +
  <title>Human Practices</title>
 +
<style>
 +
.cover{
 +
  background: url("https://static.igem.org/mediawiki/2016/1/1d/T--British_Columbia--header-tree-again.JPG");
 +
  background-size: cover; background-repeat: no-repeat;
 +
}
  
 +
@media screen and (min-width: 768px) {
 +
  .cover{
 +
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.15) 25%, rgba(0, 0, 0, 0) 100%), url("https://static.igem.org/mediawiki/2016/1/1d/T--British_Columbia--header-tree-again.JPG");
 +
    background-size: cover; background-repeat: no-repeat;
 +
    background-position: 0 0, 0 -220px;
 +
  }
 +
}
  
 +
.content-wrap img{
 +
  width: 80%; height: auto;
 +
  display: table; margin: 0 auto;
 +
  top: 90px;
 +
}
  
 +
/*important to set the position of these images such that the figcaption below the background image is visible*/
 +
#previous img{
 +
  width: 100%; min-width: 100%; height: auto;
 +
  transition: all 1s ease;
 +
  left: -50px;
 +
}
 +
#previous:hover img{ transform: scale(1.05); }
 +
#next img{
 +
  width: 100%; min-width: 100%; height: auto;
 +
  transition: all 1s ease; bottom: 0;
 +
}
  
 +
</style>
 +
</head>
 +
<body>
 +
<div class="cover">
 +
  <div class="container-fluid">
 +
    <div class="row" id="title">
 +
      <div class="col-sm-12">
 +
        <strong><p style="font-size: 3em">Human Practices</p></strong>
 +
      </div>
 +
    </div><!--title-->
 +
  </div><!--container-fluid-->
 +
</div><!--cover-->
  
 +
<div id="breadcrumbs">
 +
<strong>
 +
<a href="https://2016.igem.org/Team:British_Columbia">Home</a> /
 +
<a href="https://2016.igem.org/Team:British_Columbia/HP/Gold">Human Practices</a></strong>
 +
</div><!--#breadcrumbs-->
  
 +
<div class="content-wrap">
 +
<img src="https://static.igem.org/mediawiki/2016/9/9c/T--British_Columbia--SciCom_achievements.png">
 +
</div><!--.content-wrap-->
 +
</body>
  
−
<div class="column full_size">
+
<p id="read-more"><strong>Check out other parts of our project below!</strong></p>
−
 
+
<div id="up-next">
−
<p>iGEM teams are unique and leading the field because they "go beyond the lab" to imagine their projects in a social/environmental context, to better understand issues that might influence the design and use of their technologies.</p>
+
<div class="row" style="max-width: 100%; margin: 0">
−
<p>Teams work with students and advisors from the humanities and social sciences to explore topics concerning ethical, legal, social, economic, safety or security issues related to their work. Consideration of these Human Practices is crucial for building safe and sustainable projects that serve the public interest. </p>
+
<div class="col-sm-6" id="previous">
−
<p>For more information, please see the <a href="https://2016.igem.org/Human_Practices">Human Practices Hub</a>.</p>
+
<a href="https://2016.igem.org/Team:British_Columbia/Human_Practices/Infographic">
 +
<img src="https://static.igem.org/mediawiki/2016/5/53/T--British_Columbia--sci_com_infographics.png"></a>
 +
<a href="https://2016.igem.org/Team:British_Columbia/Human_Practices/Infographic">
 +
<strong><figcaption>Infographic</figcaption></strong></a>
 +
</div>
 +
<div class="col-sm-6" id="next">
 +
<a href="https://2016.igem.org/Team:British Columbia/Human Practices/Interview">
 +
<img src="https://static.igem.org/mediawiki/2016/1/1d/T--British_Columbia--header-tree-again.JPG"></a>
 +
<a href="https://2016.igem.org/Team:British Columbia/Human Practices/Interview">
 +
<strong><figcaption>Interviews</figcaption></strong></a></div>
 
</div>
 
</div>
−
 
  
 
</html>
 
</html>

Latest revision as of 03:55, 20 October 2016

Main CSS Navbar CSS

Human Practices

Human Practices

Check out other parts of our project below!