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

(Prototype team page)
 
 
(6 intermediate revisions by 2 users not shown)
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;
 +
}
  
−
<div class="column full_size judges-will-not-evaluate">
+
@media screen and (min-width: 768px) {
−
<h3>★  ALERT! </h3>
+
  .cover{
−
<p>This page is used by the judges to evaluate your team for the <a href="https://2016.igem.org/Judging/Medals">human practices gold medal criterion</a>. </p>
+
    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;
 +
}
  
−
<p> Delete this box in order to be evaluated for this medal. See more information at <a href="https://2016.igem.org/Judging/Pages_for_Awards/Instructions"> Instructions for Pages for awards</a>.</p>
+
/*important to set the position of these images such that the figcaption below the background image is visible*/
−
</div>
+
#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="column full_size">
+
<div class="content-wrap">
−
 
+
<img src="https://static.igem.org/mediawiki/2016/9/9c/T--British_Columbia--SciCom_achievements.png">
−
 
+
</div><!--.content-wrap-->
−
<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>
+
</body>
−
<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>
+
−
<p>For more information, please see the <a href="https://2016.igem.org/Human_Practices">Human Practices Hub</a>.</p>
+
  
 +
<p id="read-more"><strong>Check out other parts of our project below!</strong></p>
 +
<div id="up-next">
 +
<div class="row" style="max-width: 100%; margin: 0">
 +
<div class="col-sm-6" id="previous">
 +
<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 02:16, 20 October 2016

Main CSS Navbar CSS

Human Practices

Human Practices

Check out other parts of our project below!