Difference between revisions of "Team:Waterloo"

 
(46 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 +
 +
{{Template:Waterloo}}
 
<html>
 
<html>
−
<style>
+
<head>
−
/********************************* DEFAULT WIKI SETTINGS  ********************************/
+
</head>
 +
<body>
 +
<div class="jumbotron init landing">
 +
  <div class="container-fluid">
 +
    <!-- <h1>waterloo iGEM 2016</h1> -->
 +
    <div class="row">
 +
     
 +
    <div class="col-md-2 changingcircles hidden-sm hidden-xs ">
 +
      <div id="circle1" class="swapper1"></div><br>
 +
      <div id="circle3" class="swapper3"></div><br>
 +
      <div id="circle2" class="swapper2"></div><br>
 +
      <div id="circle1" class="swapper1"></div><br>
 +
      <div id="circle3" class="swapper3"></div><br>
 +
      <div id="circle2" class="swapper2"></div><br>
 +
    </div>
 +
    <div class="col-md-8 col-sm-12" style="display:flex; flex-flow: column;justify-content: center">
 +
      <div class="project-logo" >
 +
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
 +
<!-- Created with Inkscape (http://www.inkscape.org/) -->
  
−
  #sideMenu, #top_title {display:none;}
+
<svg
 +
  xmlns:dc="http://purl.org/dc/elements/1.1/"
 +
  xmlns:cc="http://creativecommons.org/ns#"
 +
  xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
 +
  xmlns:svg="http://www.w3.org/2000/svg"
 +
  xmlns="http://www.w3.org/2000/svg"
 +
  xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
 +
  xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
 +
  width="80.546219mm"
 +
  height="80.546219mm"
 +
  viewBox="0 0 285.4 285.39998"
 +
  id="svg3485"
 +
  version="1.1"
 +
  inkscape:version="0.91 r">
 +
  <defs
 +
    id="defs3487" />
  
 +
  <g
 +
    inkscape:label="Layer 1"
 +
    inkscape:groupmode="layer"
 +
    id="layer1"
 +
    transform="translate(-208.72859,-272.51933)">
 +
    <circle
 +
      cx="351.42859"
 +
      cy="415.21933"
 +
      id="circle3430"
 +
      style="fill:#fdf9d2"
 +
      r="142.7" />
 +
    <g
 +
      id="g3450"
 +
      transform="translate(-497.37144,-134.88064)">
 +
      <ellipse
 +
        cx="876.5"
 +
        cy="489.5"
 +
        rx="69.5"
 +
        ry="58.5"
 +
        id="ellipse3452"
 +
        style="fill:#ffaa30" />
 +
      <ellipse
 +
        cx="933"
 +
        cy="565.5"
 +
        rx="39"
 +
        ry="42.5"
 +
        id="ellipse3454"
 +
        style="fill:#F5636D" class="swapper0"/>
 +
      <path
 +
        d="m 741.3,574 c -2.8,13.6 -1.5,27.9 1.4,41.5 3,13.6 9.8,26.8 21,35 14.6,10.7 34.9,11.4 51.8,4.9 16.9,-6.5 30.7,-19.3 41.7,-33.6 17.3,-22.4 29.1,-50.5 26.4,-78.7 -0.4,-4.3 -10.8,-20.2 -15.3,-23.3 -8.6,-5.8 -17.9,-11.7 -28.2,-12.1 -7,-0.2 -81.1,-19.7 -98.8,66.3 z"
 +
        id="path3456"
 +
        class="swapper1"
 +
        inkscape:connector-curvature="0"
 +
        style="fill:#ffe86a" />
 +
      <g
 +
        id="g3458">
 +
        <path
 +
          d="m 752.5,488.8 c 0,0 0.2,-0.1 0.5,-0.4 0.3,-0.2 0.8,-0.6 1.5,-1.1 1.4,-0.9 3.5,-2.2 6.4,-3.5 2.9,-1.3 6.7,-2.6 11.3,-3.2 2.3,-0.3 4.8,-0.5 7.4,-0.2 2.6,0.2 5.5,0.8 8.2,2.1 2.7,1.3 5.1,3.8 6.4,6.9 1.3,3.1 1.8,6.6 1.4,10.2 -0.7,7.2 -4.3,14.7 -10.5,20.2 -3.1,2.7 -6.9,5 -11.3,6 -2.2,0.5 -4.5,0.6 -6.8,0.2 -2.3,-0.4 -4.6,-1.4 -6.1,-3.4 -1.5,-1.9 -2,-4.5 -2,-6.9 0.1,-2.4 0.8,-4.9 2,-7.1 1.2,-2.2 2.8,-4.2 4.8,-5.7 1,-0.8 2.1,-1.4 3.3,-2 1.2,-0.5 2.3,-1 3.5,-1.5 4.8,-1.7 10.2,-2.7 15.5,-1.4 2.6,0.6 5.1,1.8 7.4,3.4 2.2,1.6 4.2,3.5 6,5.6 1.8,2.1 3.4,4.4 4.8,6.8 1.4,2.4 2.6,5 3.4,7.8 1.7,5.5 2,11.5 0.6,17.2 -1.4,5.7 -4.6,11.1 -9.2,15.1 -1.1,1 -2.4,1.9 -3.6,2.8 -1.2,0.9 -2.5,1.7 -3.9,2.4 -2.6,1.5 -5.5,2.8 -8.5,3.6 -3,0.8 -6.1,1.3 -9.3,0.8 -3.1,-0.4 -6.3,-2 -8.3,-4.6 l -0.4,-0.5 c -0.1,-0.1 -0.1,-0.1 -0.2,-0.3 l -0.1,-0.3 c -0.2,-0.3 -0.4,-0.7 -0.6,-1.1 -0.3,-0.8 -0.5,-1.6 -0.6,-2.4 -0.2,-1.7 0.1,-3.3 0.5,-4.9 1,-3.1 2.7,-5.9 4.6,-8.4 2,-2.5 4.3,-4.8 6.8,-6.8 1.3,-1 2.6,-1.9 4.1,-2.7 1.4,-0.8 2.9,-1.5 4.5,-2 6.2,-2.2 13,-2.5 19.4,-1.4 3.3,0.5 6.5,1.4 9.6,2.6 3.1,1.2 6.1,2.8 8.7,4.9 0.7,0.5 1.3,1.1 1.9,1.8 0.3,0.3 0.6,0.6 0.8,1 l 0.7,1 c 0.9,1.4 1.7,2.9 2.4,4.5 1.3,3.1 2,6.5 2.3,9.8 0.3,3.4 0.2,6.8 -0.3,10.1 -0.5,3.3 -1.3,6.6 -2.4,9.8 -1.1,3.2 -2.5,6.3 -4.3,9.2 -1.8,2.9 -3.9,5.6 -6.6,7.8 -5.3,4.3 -11.8,7.3 -18.7,7.8 -3.4,0.2 -7,-0.1 -10.2,-1.7 -0.8,-0.4 -1.6,-0.9 -2.2,-1.6 -0.4,-0.4 -0.6,-0.7 -0.8,-1.1 -0.3,-0.3 -0.5,-0.7 -0.7,-1.1 -0.9,-1.5 -1.6,-3.2 -2,-4.9 -0.8,-3.5 -0.3,-7.1 0.9,-10.3 1.2,-3.3 3,-6.3 5.2,-8.9 2.2,-2.7 4.8,-5 7.6,-6.9 2.9,-1.9 5.9,-3.5 9.1,-4.7 6.4,-2.4 13.3,-3.4 20,-2.7 6.7,0.6 13.4,2.9 18.9,6.8 1.4,1 2.7,2.1 3.9,3.2 0.6,0.6 1.2,1.2 1.8,1.8 0.5,0.6 1.1,1.4 1.5,2.1 1.7,3 2.5,6.3 3,9.6 0.8,6.6 0,13.4 -2,19.6 -2.1,6.2 -5.7,12 -10.7,16.3 -2.4,2.2 -5.1,4 -8,5.5 -2.9,1.4 -6.1,2.4 -9.4,2.5 -3.2,0.1 -6.7,-0.6 -9.2,-2.8 -0.3,-0.3 -0.6,-0.6 -0.9,-0.9 -0.1,-0.2 -0.3,-0.3 -0.4,-0.5 l -0.4,-0.5 c -0.5,-0.7 -0.9,-1.4 -1.2,-2.2 -0.6,-1.6 -0.7,-3.2 -0.6,-4.8 0.2,-3.2 1.5,-6.2 3,-8.9 1.6,-2.7 3.6,-5.1 5.9,-7.2 2.3,-2.1 4.8,-3.8 7.5,-5.3 2.7,-1.5 5.5,-2.6 8.4,-3.5 5.7,-1.8 11.9,-2.3 17.7,-0.8 5.8,1.4 10.8,5 14.4,9.4 3.7,4.3 6.3,9.6 7.4,15 1.1,5.4 0.7,11.1 -1.1,16.1 -0.9,2.5 -2.2,4.9 -3.8,7 -0.8,1 -1.7,2 -2.6,2.9 -0.9,0.9 -1.9,1.8 -2.9,2.6 -4,3.2 -8.7,5.5 -13.6,6.1 -2.5,0.3 -5,0.1 -7.3,-0.8 -1.1,-0.4 -2.2,-1.1 -3.1,-2 -0.4,-0.4 -0.8,-0.9 -1.1,-1.5 -0.3,-0.5 -0.6,-1.1 -0.8,-1.6 -0.9,-2.2 -1.1,-4.7 -0.8,-6.9 0.3,-2.3 1.1,-4.4 2.2,-6.4 2.1,-3.9 5,-7.2 8.5,-9.5 6.9,-4.6 14.6,-7.1 21.8,-6.9 3.6,0.1 7.1,0.9 10,2.5 1.5,0.8 2.8,1.7 4,2.8 1.2,1.1 2.2,2.3 3,3.5 0.8,1.2 1.6,2.5 2.2,3.8 0.6,1.3 1.1,2.6 1.3,3.9 0.5,2.6 0.4,5.2 -0.1,7.5 -0.9,4.6 -2.8,8.1 -4.6,10.8 -1.8,2.6 -3.6,4.3 -4.9,5.4 -0.6,0.5 -1.1,0.9 -1.4,1.2 -0.3,0.3 -0.5,0.4 -0.5,0.4 l -0.4,-0.6 c 0,0 0.2,-0.1 0.5,-0.4 0.3,-0.3 0.8,-0.7 1.4,-1.2 1.2,-1.1 2.8,-2.8 4.5,-5.4 1.7,-2.6 3.4,-6.1 4,-10.4 0.3,-2.2 0.3,-4.5 -0.2,-6.9 -0.1,-0.6 -0.3,-1.2 -0.5,-1.7 -0.1,-0.3 -0.2,-0.6 -0.4,-0.9 -0.1,-0.2 -0.3,-0.6 -0.4,-0.9 -0.6,-1.2 -1.3,-2.3 -2.1,-3.5 -0.8,-1.1 -1.8,-2.1 -2.8,-3.1 -1.1,-0.9 -2.3,-1.7 -3.6,-2.4 -2.6,-1.3 -5.8,-2 -9.1,-2 -6.6,0 -13.8,2.6 -20.1,7 -3,2.1 -5.5,5.1 -7.3,8.6 -1.7,3.4 -2.4,7.4 -1,10.3 0.1,0.2 0.2,0.3 0.2,0.5 0,0.1 0.1,0.1 0.1,0.2 l 0.2,0.4 0.1,0.2 c 0.1,0.1 0,0 0,0 l 0.1,0.2 c 0.1,0.1 0.2,0.2 0.3,0.3 0.5,0.4 1.1,0.8 1.9,1.1 1.5,0.6 3.5,0.7 5.4,0.4 3.9,-0.6 7.9,-2.6 11.4,-5.5 0.4,-0.4 0.9,-0.7 1.3,-1.1 0.4,-0.4 0.8,-0.7 1.2,-1.2 l 0.6,-0.6 0.5,-0.6 c 0.3,-0.4 0.7,-0.8 1,-1.3 1.3,-1.8 2.3,-3.7 3,-5.9 1.5,-4.2 1.7,-9 0.7,-13.6 -0.5,-2.3 -1.3,-4.5 -2.4,-6.6 -0.5,-1.1 -1.2,-2.1 -1.8,-3 l -0.6,-0.9 -0.2,-0.2 c 0,0 -0.2,-0.2 -0.1,-0.1 l -0.3,-0.4 c -0.4,-0.5 -0.7,-1 -1.2,-1.4 -3.2,-3.7 -7.2,-6.4 -11.8,-7.5 -4.6,-1.1 -9.7,-0.6 -14.7,1 -2.5,0.8 -4.9,1.9 -7.3,3.2 -0.6,0.3 -1.2,0.7 -1.7,1 l -0.8,0.5 -0.7,0.5 -0.9,0.7 -0.7,0.5 c -0.5,0.4 -1,0.8 -1.4,1.3 -1.9,1.8 -3.5,3.8 -4.7,5.9 -1.2,2.1 -2.1,4.4 -2.2,6.3 -0.1,0.9 0.1,1.7 0.3,2.3 0.1,0.1 0.1,0.3 0.2,0.4 0.1,0.2 0,0.1 0.1,0.2 l 0.4,0.5 c 0.1,0.1 -0.2,-0.2 0,0 l 0.1,0.1 c 0.1,0.1 0.2,0.2 0.4,0.3 1,0.9 2.9,1.4 5.1,1.3 4.4,-0.2 9.4,-2.9 13.4,-6.5 1.2,-1.1 2,-1.9 2.9,-2.9 0.9,-1 1.7,-2.1 2.4,-3.2 1.5,-2.3 2.6,-4.8 3.5,-7.5 1.7,-5.3 2.3,-11.3 1.6,-16.7 -0.4,-2.7 -1.1,-5.3 -2.2,-7.1 -0.4,-0.8 -1,-1.4 -2.1,-2.5 -1,-0.9 -2,-1.8 -3.1,-2.6 -4.5,-3.1 -10,-5 -15.7,-5.5 -5.7,-0.5 -11.6,0.3 -17,2.4 -1.3,0.5 -2.7,1.1 -4,1.8 -1.3,0.6 -2.5,1.4 -3.6,2.1 l -1,0.7 -0.5,0.4 c 0,0 -0.3,0.2 -0.1,0.1 l -0.2,0.2 c -0.5,0.4 -1,0.8 -1.5,1.3 -1,0.9 -2,1.9 -2.8,3 -3.5,4.2 -5.5,9.6 -4.6,13.4 0.2,0.9 0.6,1.9 1.1,2.7 0.1,0.1 0.1,0.1 0.1,0.2 l 0.1,0.1 0.2,0.2 0.4,0.5 c 0,0 0.3,0.4 0,0.1 0,0 0,-0.1 -0.1,-0.1 -0.2,-0.2 0,0 0.3,0.2 0.6,0.3 1.7,0.7 2.8,0.8 1.1,0.2 2.4,0.2 3.7,0.1 2.6,-0.2 5.2,-0.8 7.7,-1.9 1.3,-0.5 2.5,-1.2 3.7,-1.9 0.7,-0.4 1.1,-0.7 1.7,-1.1 l 0.9,-0.7 0.7,-0.6 c 0.9,-0.8 1.9,-1.7 2.7,-2.8 0.9,-1.1 1.7,-2.2 2.4,-3.4 1.5,-2.4 2.7,-5.1 3.7,-7.8 1.9,-5.5 2.8,-11.5 2.4,-17.1 -0.2,-2.8 -0.8,-5.5 -1.8,-7.9 l -0.4,-0.9 -0.4,-0.8 c -0.1,-0.3 -0.3,-0.5 -0.4,-0.7 l -0.2,-0.3 -0.1,-0.2 c 0,-0.1 -0.1,-0.2 -0.2,-0.2 l -0.7,-1 c -0.2,-0.2 0,0 0,0 l -0.1,-0.1 -0.2,-0.2 c -0.3,-0.3 -0.7,-0.7 -1.1,-1.1 -1.8,-1.5 -4.3,-2.8 -6.9,-3.8 -2.6,-1 -5.4,-1.8 -8.2,-2.2 -5.6,-0.9 -11.3,-0.7 -16.2,1 -0.3,0.1 -0.6,0.2 -0.9,0.3 l -0.5,0.2 -0.4,0.2 c -0.3,0.1 -0.5,0.2 -0.8,0.4 l -1.1,0.6 -0.3,0.1 c 0.2,-0.1 -0.1,0 -0.1,0 l -0.4,0.2 -0.8,0.5 c -0.5,0.4 -1.1,0.7 -1.6,1.2 -2.1,1.6 -4.1,3.6 -5.8,5.6 -1.7,2.1 -3,4.3 -3.6,6.3 -0.3,1 -0.4,1.8 -0.3,2.4 0,0.3 0.1,0.6 0.1,0.7 0,0 0,0 0,0 0,0 0,0.1 0.1,0.2 l 0.1,0.3 0.1,0.3 c -0.3,-0.4 0,0 -0.1,-0.1 l 0.2,0.2 c 0.9,1.2 2.3,2 4.3,2.3 2,0.3 4.4,0.1 6.8,-0.6 2.4,-0.7 4.8,-1.7 7.2,-3 1.1,-0.6 2.4,-1.4 3.4,-2.1 0.3,-0.2 0.6,-0.4 0.9,-0.6 L 795,551 c 0,0 0.2,-0.2 0.2,-0.1 l 0.2,-0.1 c 0.5,-0.4 1,-0.7 1.4,-1.1 3.7,-3.2 6.4,-7.4 7.6,-12.1 1.2,-4.7 1.1,-9.7 -0.3,-14.3 -0.7,-2.3 -1.6,-4.6 -2.8,-6.6 -1.3,-2.2 -2.7,-4.3 -4.2,-6.2 -1.5,-1.9 -3.2,-3.5 -5,-4.8 -1.8,-1.3 -3.7,-2.2 -5.7,-2.8 -4,-1.1 -8.5,-0.6 -12.8,0.9 -0.5,0.2 -1,0.4 -1.6,0.6 l -0.9,0.4 -0.4,0.2 c 0,0 -0.2,0.1 -0.3,0.1 -0.9,0.4 -1.7,0.9 -2.5,1.4 -1.6,1.1 -2.9,2.6 -3.8,4.2 -1.9,3.3 -2.2,7.4 -0.6,9.7 0.2,0.4 0.8,0.9 1.4,1.2 0.6,0.4 1.4,0.7 2.2,0.9 1.7,0.4 3.5,0.4 5.3,0 3.7,-0.7 7.1,-2.6 10,-5 5.8,-4.8 9.3,-11.7 10.2,-18.2 0.4,-3.3 0.1,-6.4 -1,-9.1 -0.6,-1.4 -1.3,-2.5 -2.2,-3.6 -0.9,-1.1 -2,-1.8 -3.2,-2.5 -2.4,-1.3 -5,-1.9 -7.5,-2.2 -2.5,-0.3 -4.9,-0.2 -7.1,0 -4.4,0.5 -8.2,1.6 -11,2.8 -2.9,1.2 -5,2.4 -6.4,3.2 -0.7,0.4 -1.2,0.8 -1.5,1 -0.3,0.2 -0.5,0.3 -0.5,0.3 l 0.3,-0.4 z"
 +
          id="path3460"
  
−
/*---Properties-----------------------------------------------------------------------------------*/
+
          inkscape:connector-curvature="0"
−
html, body {
+
          style="fill:#f15a24" />
−
  margin: 0 auto;
+
       </g>
−
  padding: 0;
+
     </g>
−
  padding-top: 44px;
+
   </g>
−
  width: 100%;
+
</svg>
−
  height: 100%;
+
</div>
−
  font-family: 'Ubuntu', sans-serif;
+
<div style="text-align: center;">
−
}
+
−
 
+
−
html {
+
−
  position: relative;
+
−
  min-height: 100%;
+
−
}
+
−
 
+
−
a, a:link, a:visited {
+
−
    color: #23b593;
+
−
}
+
−
body{
+
−
  background-image: url(https://static.igem.org/mediawiki/2016/5/51/T--Waterloo--Yeast.jpg);
+
−
  background-repeat: repeat-y;
+
−
}
+
−
body::after{
+
−
  content: "";
+
−
  position:fixed;
+
−
  background-color: #F0EAD6;
+
−
  background-repeat: repeat-y;
+
−
  height: 100vh;
+
−
  opacity: 0.7;
+
−
  top: 0;
+
−
  left: 0;
+
−
  bottom: 0;
+
−
  right: 0;
+
−
  z-index: -1; 
+
−
}
+
−
/*---General Colour Classes----------------------------------------------------------------------*/
+
−
.orangetext {
+
−
  color: #fbb67a;
+
−
}
+
−
.bluetext {
+
−
  color: #79bcc7;
+
−
}
+
−
.greentext {
+
−
  color: #92cc78;
+
−
}
+
−
.charcoaltext {
+
−
  color: #373b40;
+
−
}
+
−
.tealtext {
+
−
  color: #23b593;
+
−
}
+
−
.whitetext {
+
−
    color: #fff;
+
−
}
+
−
.no-border {
+
−
    border: 0px;
+
−
}
+
−
.no-margin {
+
−
    margin: 0;
+
−
}
+
−
.no-padding {
+
−
    padding: 0;
+
−
}
+
−
h1 {
+
−
    border: 0px;
+
−
}
+
−
 
+
−
/*---Changes to Default Wiki----------------------------------------------------------------------*/
+
−
#globalWrapper, #content, #bodyContent {
+
−
    margin: 0 auto;
+
−
    padding: 0;
+
−
    height: 100%;
+
−
    width: 100%;
+
−
    border: 0px;
+
−
    background-color: transparent;
+
−
}
+
−
 
+
−
#top_menu_under {
+
−
    margin: 0;
+
−
    padding: 0;
+
−
    height: 0;
+
−
    width: 100%;
+
−
    border: 0;
+
−
    background-color: transparent;
+
−
}
+
−
 
+
−
#top_menu_14 {
+
−
    margin: 0;
+
−
    padding: 0;
+
−
    width: 100%;
+
−
    border: 0;
+
−
    padding-bottom: 2px;
+
−
    background-color: #373B40;
+
−
}
+
−
 
+
−
#bodyContent a[href ^="https://"] {
+
−
    padding-right: 0;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
/*---Changes to Default Bootstrap----------------------------------------------------------------------*/
+
−
div.jumbotron {
+
−
  /*background-color: #373b40;*/
+
−
  color: #fff;
+
−
}
+
−
.vertical-align {
+
−
    display: flex;
+
−
    align-items: center;
+
−
}
+
−
/* Setting max width of container to 970 px */
+
−
@media (min-width: 1200px) {
+
−
  div.container {
+
−
    width: 970px;
+
−
  }
+
−
}
+
−
.main-container {
+
−
  padding-top: 20px;
+
−
  padding-bottom: 20px;
+
−
}
+
−
.main-container .panel-default .panel-heading {
+
−
  background-color: #373b40;
+
−
  color: #fff;
+
−
}
+
−
.main-container .panel-default .panel-heading a:hover {
+
−
  color: #23b593;
+
−
}
+
−
@media (max-width: 768px) {
+
−
  #bodyContent .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+
−
    color: #fff;
+
−
  }
+
−
  #bodyContent .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+
−
  #bodyContent .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+
−
    color: #23b593;
+
−
  }
+
−
}
+
−
.main-container .table {
+
−
  font-size: 0.8em;
+
−
    margin: auto;
+
−
}
+
−
/*Change the styling of table headers */
+
−
.main-container th {
+
−
    text-align: center !important;
+
−
}
+
−
 
+
−
/*---Div Properties-------------------------------------------------------------------------------*/
+
−
/* Creates a container that will wrap all of the content inside your wiki pages. */
+
−
#mainContainer {
+
−
  position: relative;
+
−
  width: 1000px;
+
−
  margin: 0 auto;
+
−
  margin-top: 50px;
+
−
  overflow: hidden;
+
−
  background-color: #fff;
+
−
}
+
−
 
+
−
/* Creates the container for the content */
+
−
#contentContainer {
+
−
  padding: 0;
+
−
  width: 100%;
+
−
  max-width: 768px;
+
−
  margin: 0 auto;
+
−
  background-color: #fff;
+
−
}
+
−
 
+
−
/* Styling links on hover- links are different inside the menu */
+
−
#contentContainer a:hover {
+
−
    color: #59bf92;
+
−
}
+
−
 
+
−
/*Clear class for all the pages, adds spacing too*/
+
−
.clear{
+
−
    clear:both;
+
−
    height: 10px;
+
−
}
+
−
 
+
−
/* highlight box for special messages, prevHighlightBox for template content that needs to be removed */
+
−
.highlightBox, .prevHighlightBox {
+
−
    width: 500px;
+
−
    max-width: 85%;
+
−
    margin: auto;
+
−
    background-color: #E8E8E9;
+
−
    margin-bottom: 15px;
+
−
    margin-top: 15px;
+
−
    padding: 15px;
+
−
    padding-top: 5px;
+
−
 
+
−
    -webkit-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
      -moz-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
        -ms-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
        -o-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
            box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
}
+
−
.prevHighlightBox {
+
−
    background-color: #ef9a9a;
+
−
    width: 100%;
+
−
}
+
−
 
+
−
figure {
+
−
    width: 100%;
+
−
    margin: 0 auto;
+
−
    display: block;
+
−
    text-align: center;
+
−
}
+
−
 
+
−
figcaption {
+
−
    font-size: 0.9em;
+
−
    font-style: italic;
+
−
}
+
−
figcaption.model-caption {
+
−
  color: #92cc78;
+
−
  font-style: normal;
+
−
  font-size: 1.2em;
+
−
  text-transform: uppercase;
+
−
}
+
−
 
+
−
/*---Requirements Page----------------------------------------------------------------------------*/
+
−
 
+
−
.requirements-text {
+
−
  font-size: 18px;
+
−
}
+
−
 
+
−
.elaboration-text {
+
−
  font-size: 14px;
+
−
  color: #0E3A5A
+
−
}
+
−
 
+
−
/*Stuff left over from last year?*/
+
−
#medals-container {
+
−
    margin: 0px;
+
−
}
+
−
h1.medals, h2.medals {
+
−
    border-bottom: 0px;
+
−
}
+
−
h1.medals {
+
−
    text-align: center;
+
−
    color: #23b593 !important;
+
−
}
+
−
 
+
−
/*---Header & Footer------------------------------------------------------------------------------*/
+
−
 
+
−
 
+
−
footer {
+
−
  bottom: 0;
+
−
  width: 100%;
+
−
  padding: 0;
+
−
  -webkit-box-shadow: inset 0 10px 15px -10px #424242;
+
−
    -moz-box-shadow: inset 0 10px 15px -10px #424242;
+
−
      -ms-box-shadow: inset 0 10px 15px -10px #424242;
+
−
      -o-box-shadow: inset 0 10px 15px -10px #424242;
+
−
          box-shadow: inset 0 10px 15px -10px #424242;
+
−
  background: #2a2e33;
+
−
  line-height: 2em;
+
−
  color: #fff;
+
−
  box-sizing: border-box;
+
−
  text-align: center;
+
−
}
+
−
 
+
−
footer .footer-company-motto {
+
−
  color:  #8d9093;
+
−
  font-size: 0.9em;
+
−
  margin: 0;
+
−
}
+
−
 
+
−
footer .footer-company-name {
+
−
  color:  #8d9093;
+
−
  font-size: 1.3em;
+
−
  margin: 0;
+
−
}
+
−
footer .footer-links {
+
−
  list-style: none;
+
−
  padding: 1.5em 0 0;
+
−
  margin: 0;
+
−
}
+
−
 
+
−
footer p.footer-links a {
+
−
  display:inline-block;
+
−
  text-decoration: none;
+
−
  padding-right: 1.2em !important;
+
−
  color:  #ffffff;
+
−
  font-size: 0.8em;
+
−
}
+
−
 
+
−
footer p.footer-links a:hover {
+
−
    color: #23b593;
+
−
}
+
−
 
+
−
/* If you don't want the footer to be responsive, remove these media queries */
+
−
 
+
−
@media (max-width: 1000px) {
+
−
    footer .footer-company-motto .footer-company-name .footer-links {
+
−
        font-size: 1.2em;
+
−
    }
+
−
    footer .footer-links a {
+
−
        padding: 25px 0 20px;
+
−
        line-height: 1.8;
+
−
    }
+
−
}
+
−
 
+
−
/*---Toggle Button for collapsible groups-------------*/
+
−
.toggle-arrow {
+
−
    display: inline-block;
+
−
    height: 25px;
+
−
    width: 25px;
+
−
    /* image replacement properties */
+
−
    overflow: hidden;
+
−
    text-indent: 100%;
+
−
    white-space: nowrap;
+
−
    background: rgba(35, 181, 147, 0.8) url("/wiki/images/b/bd/Waterloo_cd-top-arrow.png") no-repeat scroll center; 50%
+
−
    -moz-transform: scaleY(1);
+
−
    -o-transform: scaleY(1);
+
−
    -webkit-transform: scaleY(1);
+
−
    transform: scaleY(1);
+
−
}
+
−
.collapsed .toggle-arrow {
+
−
    -moz-transform: scaleY(-1);
+
−
    -o-transform: scaleY(-1);
+
−
    -webkit-transform: scaleY(-1);
+
−
    transform: scaleY(-1);
+
−
    filter: FlipV;
+
−
    -ms-filter: "FlipV";
+
−
}
+
−
 
+
−
/* disappear on small screen sizes */
+
−
 
+
−
/*---Scroll to Top button ---------------------------*/
+
−
.cd-top {
+
−
    display: inline-block;
+
−
    height: 40px;
+
−
    width: 40px;
+
−
    position: fixed;
+
−
    bottom: 40px;
+
−
    right: 10px;
+
−
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+
−
    /* image replacement properties */
+
−
    overflow: hidden;
+
−
    text-indent: 100%;
+
−
    white-space: nowrap;
+
−
    background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
+
−
    visibility: hidden;
+
−
    opacity: 0;
+
−
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
+
−
      -moz-transition: opacity .3s 0s, visibility 0s .3s;
+
−
        -ms-transition: opacity .3s 0s, visibility 0s .3s;
+
−
        -o-transition: opacity .3s 0s, visibility 0s .3s;
+
−
            transition: opacity .3s 0s, visibility 0s .3s;
+
−
}
+
−
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
+
−
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
+
−
      -moz-transition: opacity .3s 0s, visibility 0s .3s;
+
−
        -ms-transition: opacity .3s 0s, visibility 0s .3s;
+
−
        -o-transition: opacity .3s 0s, visibility 0s .3s;
+
−
            transition: opacity .3s 0s, visibility 0s .3s;
+
−
}
+
−
.cd-top.cd-is-visible {
+
−
    /* the button becomes visible */
+
−
    visibility: visible;
+
−
    opacity: 1;
+
−
}
+
−
.cd-top.cd-fade-out {
+
−
    /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
+
−
    opacity: .5;
+
−
}
+
−
.no-touch .cd-top:hover {
+
−
    background-color: rgb(35, 181, 147);
+
−
    opacity: 1;
+
−
}
+
−
 
+
−
/* tablet */
+
−
@media only screen and (min-device-width: 768px) {
+
−
    .cd-top {
+
−
        height: 60px;
+
−
        width: 60px;
+
−
        background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
+
−
    }
+
−
}
+
−
/* phone */
+
−
@media only screen and (max-device-width: 768px) {
+
−
    .cd-top {
+
−
        height: 100px;
+
−
        width: 100px;
+
−
        background: rgba(35, 181, 147, 0.8) url(/wiki/images/b/bd/Waterloo_cd-top-arrow.png) no-repeat center 50%;
+
−
    }
+
−
}
+
−
 
+
−
/*---Splash images & team page --------------------------------------------------------------------*/
+
−
.cover, .small-cover {
+
−
    position: relative;
+
−
    height: 20em;
+
−
    background: rgba(0, 0, 0, 0.5);
+
−
    width: 100%;
+
−
    color: #fff;
+
−
    margin: auto;
+
−
    text-align: center;
+
−
    line-height: 20em;
+
−
}
+
−
.cover::after {
+
−
    content : "";
+
−
    display: block;
+
−
    position: absolute;
+
−
    top: 0;
+
−
    left: 0;
+
−
    background-size: cover;
+
−
    width: 100%;
+
−
    height: 100%;
+
−
    z-index: -1;
+
−
    opacity: 0.8;
+
−
}
+
−
.cover#lab::after {
+
−
    background-image: url('/wiki/images/c/c9/Waterloo_lab_cover.JPG');
+
−
}
+
−
.cover#math::after {
+
−
    background-image: url('/wiki/images/e/e8/Waterloo_math_cover.jpg');
+
−
}
+
−
.cover#policy::after {
+
−
    background-image: url('/wiki/images/2/22/Waterloo_policy_cover.jpg');
+
−
}
+
−
.cover#advisors::after {
+
−
    background-image: url('/wiki/images/c/cc/Waterloo_advisors_cover.jpg');
+
−
}
+
−
.cover#leads::after {
+
−
    background-image: url('/wiki/images/1/1e/Waterloo_cover_leads.jpg');
+
−
}
+
−
 
+
−
.jumbotron.landing-links {
+
−
    width: 100%;
+
−
    background-color: inherit;
+
−
    margin-bottom: 0;
+
−
    padding-bottom: 0;
+
−
}
+
−
.jumbotron.landing-links div.container {
+
−
    width: 100%;
+
−
}
+
−
.small-cover {
+
−
    display: inline-block;
+
−
    float: left;
+
−
    color: #ccc;
+
−
    font-weight: 500;
+
−
    text-align: center;
+
−
    line-height: 200px;
+
−
    height: 200px;
+
−
    text-shadow: 0 0 10px #000;
+
−
}
+
−
.small-cover a {
+
−
    display: block;
+
−
    color: #ccc;
+
−
}
+
−
.small-cover a:hover {
+
−
    color: #23b593;
+
−
}
+
−
.small-cover#desc {
+
−
    background: #555 url('/wiki/images/2/20/Waterloo_cover_desc.png') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#medal {
+
−
    background: #555 url('/wiki/images/b/b5/Waterloo_cover_trophy.png') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#team {
+
−
    background: #555 url('/wiki/images/8/84/Waterloo_cover_team.png') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#att {
+
−
    background: #555 url('/wiki/images/7/72/Waterloo_cover_att.jpg') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#collab {
+
−
    background: #555 url('/wiki/images/4/45/Waterloo_cover_collab.jpg') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#lab {
+
−
    background: #555 url('/wiki/images/5/5e/Waterloo_smallcover_lab.jpg') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#math {
+
−
    background: #555 url('/wiki/images/c/c9/Waterloo_smallcover_math.jpg') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
.small-cover#policy {
+
−
    background: #555 url('/wiki/images/a/a7/Waterloo_smallcover_policy.jpg') no-repeat center center;
+
−
    background-size: cover;
+
−
}
+
−
 
+
−
a.cover-text, a.cover-text:hover, a.cover-text:visited, a.cover-text:active {
+
−
    color: #ccc;
+
−
    font-size: 2em;
+
−
    text-shadow: 0 0 10px #000;
+
−
    text-decoration: none;
+
−
}
+
−
.cover-desc {
+
−
    color: #999;
+
−
    margin-top: -9em;
+
−
    text-shadow: 0 0 10px #000;
+
−
    text-decoration: none;
+
−
}
+
−
.accordion-inner {
+
−
    margin-top: 10px;
+
−
    margin-left: auto;
+
−
    margin-right: auto;
+
−
    width: 800px;
+
−
    max-width: 95%;
+
−
}
+
−
.accordion-inner dl dt {
+
−
    min-width: 150px;
+
−
    width: 30%;
+
−
    display: inline-block;
+
−
    text-align: center;
+
−
    vertical-align: middle;
+
−
}
+
−
.accordion-inner dl dd {
+
−
    width: 60%;
+
−
    display: inline-block;
+
−
    vertical-align: middle;
+
−
}
+
−
.accordion-inner dl dt img {
+
−
    max-width: 100px;
+
−
    display: inline-block;
+
−
    border-radius: 50%;
+
−
    -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
      -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
        -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
        -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
            box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
}
+
−
 
+
−
figure {
+
−
    position: relative;
+
−
}
+
−
.img-att {
+
−
    position: absolute;
+
−
    bottom: 10px;
+
−
    right: 10px;
+
−
    height: 30px;
+
−
    width: 30px;
+
−
    line-height: 30px;
+
−
    border-radius: 40px;
+
−
    display: inline-block;
+
−
    background-color: #989;
+
−
    color: #261a28;
+
−
    text-align: center;
+
−
    font-family: georgia, serif;
+
−
    font-style: italic;
+
−
}
+
−
.img-att .img-att-bubble {
+
−
    position: absolute;
+
−
    right: 10px;
+
−
    bottom: 10px;
+
−
    width: 200px;
+
−
    display: none;
+
−
    background: rgba(255, 255, 255, 0.8);
+
−
    border-radius: 2px;
+
−
    color: #000;
+
−
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+
−
    font-style: normal;
+
−
    font-weight: 300;
+
−
    text-align: left;
+
−
    padding: 1em;
+
−
    font-size: 14px;
+
−
 
+
−
    -webkit-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
      -moz-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
        -ms-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
        -o-box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
            box-shadow: 0 0 5px 0 rgba(66,66,66,1);
+
−
}
+
−
.img-att .img-att-bubble li {
+
−
    list-style: none;
+
−
    line-height: normal;
+
−
    margin: 5px 0;
+
−
}
+
−
.img-att:hover .img-att-bubble, .img-att-bubble:hover {
+
−
    display: block;
+
−
}
+
−
 
+
−
/*---Sponsor images-------------------------------------------------------------------------------*/
+
−
ul.sponsors {
+
−
    list-style: none;
+
−
    width: 100%;
+
−
    margin-left: auto;
+
−
    margin-right: auto;
+
−
}
+
−
ul.sponsors li a {
+
−
    margin-left: auto;
+
−
    margin-right: auto;
+
−
}
+
−
.glyphicon {
+
−
    font-size: medium;
+
−
}
+
−
 
+
−
 
+
−
/*---Attributions---------------------------------------------------------------------------------*/
+
−
dl.attributions dt {
+
−
    font-size: 1.5em;
+
−
    font-style: normal;
+
−
    font-weight: normal;
+
−
    margin: 0.67em 0;
+
−
}
+
−
 
+
−
 
+
−
/*---Quote Styling--------------------------------------------------------------------------------*/
+
−
q:before, blockquote:before {
+
−
    content: "\201C" !important;
+
−
    font-family: serif !important;
+
−
    font-size: 5em;
+
−
    font-style: normal;
+
−
    line-height: normal;
+
−
    z-index: -999;
+
−
}
+
−
q, blockquote {
+
−
    display: block;
+
−
    font-size: 1.2em;
+
−
    font-weight: lighter;
+
−
    font-style: italic;
+
−
    font-family: inherit;
+
−
    padding: 0 0 0 120px;
+
−
    border-left: none !important;
+
−
}
+
−
blockquote p {
+
−
    text-indent: 3.5em;
+
−
    margin-top: -4em;
+
−
}
+
−
blockquote p.source {
+
−
    text-indent: 3.5em;
+
−
    margin-top: 0px;
+
−
    font-size: 0.8em;
+
−
}
+
−
 
+
−
 
+
−
 
+
−
/*---Description links----------------------------------------------------------------------------*/
+
−
.desc-links a {
+
−
    padding: 0 1.5em;
+
−
}
+
−
 
+
−
 
+
−
/*---Human practices page--------------------------------------------------------------------------*/
+
−
.jumbotron.hp-landing {
+
−
    background-color: inherit;
+
−
    color: #000;
+
−
}
+
−
.jumbotron.hp-landing dl {
+
−
    text-align: center;
+
−
}
+
−
.jumbotron.hp-landing dt img {
+
−
    border-radius: 50%;
+
−
    -webkit-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
      -moz-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
        -ms-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
        -o-box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
            box-shadow: 0 0 20px 0 rgba(66,66,66,1);
+
−
}
+
−
/*New Navbar settings*/
+
−
.cd-auto-hide-header {
+
−
  position: fixed;
+
−
  z-index: 2;
+
−
  top: 15px;
+
−
  left: 0;
+
−
  width: 100%;
+
−
  height: 60px;
+
−
  background-color:rgb(39, 40, 34);
+
−
  box-shadow: 0px 2px 3px #888888;
+
−
  /* Force Hardware Acceleration */
+
−
  -webkit-transform: translateZ(0);
+
−
          transform: translateZ(0);
+
−
  will-change: transform;
+
−
  -webkit-transition: -webkit-transform .5s;
+
−
  transition: -webkit-transform .5s;
+
−
  transition: transform .5s;
+
−
  transition: transform .5s, -webkit-transform .5s;
+
−
  border-bottom-style: solid;
+
−
  border-bottom-width: 4px;
+
−
  border-bottom-color: #F5636D
+
−
}
+
−
.cd-auto-hide-header::after {
+
−
  clear: both;
+
−
  content: "";
+
−
  display: block;
+
−
}
+
−
.cd-auto-hide-header.is-hidden {
+
−
  -webkit-transform: translateY(-100%);
+
−
      -ms-transform: translateY(-100%);
+
−
          transform: translateY(-100%);
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-auto-hide-header {
+
−
    height: 84px;
+
−
  }
+
−
}
+
−
 
+
−
.cd-auto-hide-header .logo,
+
−
.cd-auto-hide-header .nav-trigger {
+
−
  position: absolute;
+
−
  top: 50%;
+
−
  bottom: auto;
+
−
  -webkit-transform: translateY(-50%);
+
−
      -ms-transform: translateY(-50%);
+
−
          transform: translateY(-50%);
+
−
}
+
−
 
+
−
.cd-auto-hide-header .logo {
+
−
  left: 5%;
+
−
}
+
−
.cd-auto-hide-header .logo a, .cd-auto-hide-header .logo img {
+
−
  display: block;
+
−
}
+
−
 
+
−
.cd-auto-hide-header .nav-trigger {
+
−
  /* vertically align its content */
+
−
  display: table;
+
−
  height: 100%;
+
−
  padding: 0 1em;
+
−
  font-size: 1.2rem;
+
−
  text-transform: uppercase;
+
−
  color: #25283D;
+
−
  font-weight: bold;
+
−
  right: 0;
+
−
  border-left: 1px solid #f2f2f2;
+
−
}
+
−
.cd-auto-hide-header .nav-trigger span {
+
−
  /* vertically align inside parent element */
+
−
  display: table-cell;
+
−
  vertical-align: middle;
+
−
}
+
−
.cd-auto-hide-header .nav-trigger em, .cd-auto-hide-header .nav-trigger em::after, .cd-auto-hide-header .nav-trigger em::before {
+
−
  /* this is the menu icon */
+
−
  display: block;
+
−
  position: relative;
+
−
  height: 2px;
+
−
  width: 22px;
+
−
  background-color: #25283D;
+
−
  -webkit-backface-visibility: hidden;
+
−
          backface-visibility: hidden;
+
−
}
+
−
.cd-auto-hide-header .nav-trigger em {
+
−
  /* this is the menu central line */
+
−
  margin: 6px auto 14px;
+
−
  -webkit-transition: background-color .2s;
+
−
  transition: background-color .2s;
+
−
}
+
−
.cd-auto-hide-header .nav-trigger em::before, .cd-auto-hide-header .nav-trigger em::after {
+
−
  position: absolute;
+
−
  content: '';
+
−
  left: 0;
+
−
  -webkit-transition: -webkit-transform .2s;
+
−
  transition: -webkit-transform .2s;
+
−
  transition: transform .2s;
+
−
  transition: transform .2s, -webkit-transform .2s;
+
−
}
+
−
.cd-auto-hide-header .nav-trigger em::before {
+
−
  /* this is the menu icon top line */
+
−
  -webkit-transform: translateY(-6px);
+
−
       -ms-transform: translateY(-6px);
+
−
          transform: translateY(-6px);
+
−
}
+
−
.cd-auto-hide-header .nav-trigger em::after {
+
−
  /* this is the menu icon bottom line */
+
−
  -webkit-transform: translateY(6px);
+
−
      -ms-transform: translateY(6px);
+
−
          transform: translateY(6px);
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-auto-hide-header .nav-trigger {
+
−
     display: none;
+
−
  }
+
−
}
+
−
 
+
−
.cd-auto-hide-header.nav-open .nav-trigger em {
+
−
  /* transform menu icon into a 'X' icon */
+
−
  background-color: rgba(255, 255, 255, 0);
+
−
}
+
−
.cd-auto-hide-header.nav-open .nav-trigger em::before {
+
−
  /* rotate top line */
+
−
  -webkit-transform: rotate(-45deg);
+
−
      -ms-transform: rotate(-45deg);
+
−
          transform: rotate(-45deg);
+
−
}
+
−
.cd-auto-hide-header.nav-open .nav-trigger em::after {
+
−
  /* rotate bottom line */
+
−
  -webkit-transform: rotate(45deg);
+
−
      -ms-transform: rotate(45deg);
+
−
          transform: rotate(45deg);
+
−
}
+
−
 
+
−
.cd-primary-nav {
+
−
  display: inline-block;
+
−
  float: right;
+
−
  height: 100%;
+
−
  padding-right: 5%;
+
−
 
+
−
}
+
−
.cd-primary-nav > ul {
+
−
  position: absolute;
+
−
  z-index: 2;
+
−
  top: 60px;
+
−
  left: 0;
+
−
  width: 100%;
+
−
  background-color: #ffffff;
+
−
  display: none;
+
−
  box-shadow: 0 14px 20px rgba(0, 0, 0, 0.2);
+
−
}
+
−
.cd-primary-nav > ul a {
+
−
   /* target primary-nav links */
+
−
  display: block;
+
−
  font-weight: bold;
+
−
  height: 50px;
+
−
  line-height: 50px;
+
−
  padding-left: 5%;
+
−
  color: white;
+
−
  font-size: 1.8rem;
+
−
  border-top: 1px solid #f2f2f2;
+
−
}
+
−
.cd-primary-nav > ul a:hover, .cd-primary-nav > ul a:active, .cd-primary-nav > ul a:focus  {
+
−
  color: #F5636D;
+
−
  font-weight: bold;
+
−
  border-top-style: solid;
+
−
  border-top-width: 3px;
+
−
  border-top-color: #F5636D;
+
−
  text-decoration: none;
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-primary-nav {
+
−
    /* vertically align its content */
+
−
    display: table;
+
−
  }
+
−
  .cd-primary-nav > ul {
+
−
    /* vertically align inside parent element */
+
−
    display: table-cell;
+
−
    vertical-align: middle;
+
−
    /* reset mobile style */
+
−
    position: relative;
+
−
    width: auto;
+
−
    top: 0;
+
−
    padding: 0;
+
−
    background-color: transparent;
+
−
    box-shadow: none;
+
−
  }
+
−
  .cd-primary-nav > ul::after {
+
−
    clear: both;
+
−
    content: "";
+
−
    display: block;
+
−
  }
+
−
  .cd-primary-nav > ul li {
+
−
    display: inline-block;
+
−
    float: left;
+
−
    margin-right: 1.5em;
+
−
  }
+
−
  .cd-primary-nav > ul li:last-of-type {
+
−
    margin-right: 0;
+
−
  }
+
−
  .cd-primary-nav > ul a {
+
−
    /* reset mobile style */
+
−
    height: auto;
+
−
    line-height: normal;
+
−
    padding: 0;
+
−
    border: none;
+
−
  }
+
−
}
+
−
 
+
−
.nav-open .cd-primary-nav ul,
+
−
.cd-primary-nav ul:target {
+
−
  /*
+
−
    show primary nav - mobile only
+
−
    :target is used to show navigation on no-js devices
+
−
  */
+
−
  display: block;
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .nav-open .cd-primary-nav ul,
+
−
  .cd-primary-nav ul:target {
+
−
    display: table-cell;
+
−
  }
+
−
}
+
−
 
+
−
/* --------------------------------
+
−
 
+
−
2. Auto-Hiding Navigation - with Sub Nav
+
−
 
+
−
-------------------------------- */
+
−
.cd-secondary-nav {
+
−
  overflow: hidden;
+
−
  position: relative;
+
−
  z-index: 1;
+
−
  clear: both;
+
−
  width: 100%;
+
−
  height: 50px;
+
−
  background-color: white;
+
−
  /* Force Hardware Acceleration */
+
−
  -webkit-transform: translateZ(0);
+
−
          transform: translateZ(0);
+
−
  will-change: transform;
+
−
  -webkit-transition: -webkit-transform .5s;
+
−
  transition: -webkit-transform .5s;
+
−
  transition: transform .5s;
+
−
  transition: transform .5s, -webkit-transform .5s;
+
−
}
+
−
.cd-secondary-nav::after {
+
−
  /* gradient on the right - to indicate it's possible to scroll */
+
−
  content: '';
+
−
  position: absolute;
+
−
  z-index: 1;
+
−
  top: 0;
+
−
  right: 0;
+
−
  height: 100%;
+
−
  width: 35px;
+
−
  background: transparent;
+
−
  background: -webkit-linear-gradient(right, #25283D, rgba(37, 40, 61, 0));
+
−
  background: linear-gradient(to left, #25283D, rgba(37, 40, 61, 0));
+
−
  pointer-events: none;
+
−
  -webkit-transition: opacity .2s;
+
−
  transition: opacity .2s;
+
−
}
+
−
.cd-secondary-nav.nav-end::after {
+
−
  opacity: 0;
+
−
}
+
−
.cd-secondary-nav ul, .cd-secondary-nav li, .cd-secondary-nav a {
+
−
  height: 100%;
+
−
}
+
−
.cd-secondary-nav ul {
+
−
  /* enables a flex context for all its direct children */
+
−
  display: -webkit-box;
+
−
  display: -webkit-flex;
+
−
  display: -ms-flexbox;
+
−
  display: flex;
+
−
  padding: 0 5%;
+
−
  overflow-x: auto;
+
−
  overflow-y: hidden;
+
−
  -webkit-overflow-scrolling: touch;
+
−
}
+
−
.cd-secondary-nav ul::after {
+
−
  clear: both;
+
−
  content: "";
+
−
  display: block;
+
−
}
+
−
.cd-secondary-nav li {
+
−
  display: inline-block;
+
−
  float: left;
+
−
  /* do not shrink - elements float on the right of the element */
+
−
  -webkit-flex-shrink: 0;
+
−
      -ms-flex-negative: 0;
+
−
          flex-shrink: 0;
+
−
}
+
−
.cd-secondary-nav li:last-of-type {
+
−
  padding-right: 20px;
+
−
}
+
−
.cd-secondary-nav a {
+
−
  display: block;
+
−
  color: slategray;
+
−
  opacity: .6;
+
−
  line-height: 50px;
+
−
  padding: 0 1em;
+
−
}
+
−
.cd-secondary-nav a:hover, .cd-secondary-nav a.active {
+
−
  opacity: 1;
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-secondary-nav {
+
−
    height: 70px;
+
−
    overflow: visible;
+
−
  }
+
−
  .cd-secondary-nav ul {
+
−
    /* reset mobile style */
+
−
    display: block;
+
−
    text-align: center;
+
−
  }
+
−
  .cd-secondary-nav li {
+
−
    /* reset mobile style */
+
−
    float: none;
+
−
    -webkit-flex-shrink: 1;
+
−
        -ms-flex-negative: 1;
+
−
            flex-shrink: 1;
+
−
  }
+
−
  .cd-secondary-nav a {
+
−
    line-height: 70px;
+
−
  }
+
−
  .cd-secondary-nav a.active {
+
−
    box-shadow: inset 0 -3px #8F3985;
+
−
  }
+
−
}
+
−
 
+
−
/* --------------------------------
+
−
 
+
−
3. Auto-Hiding Navigation - with Sub Nav + Hero Image
+
−
 
+
−
-------------------------------- */
+
−
.cd-secondary-nav.fixed {
+
−
  position: fixed;
+
−
  top: 60px;
+
−
}
+
−
.cd-secondary-nav.slide-up {
+
−
  -webkit-transform: translateY(-60px);
+
−
      -ms-transform: translateY(-60px);
+
−
          transform: translateY(-60px);
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-secondary-nav.fixed {
+
−
    top: 80px;
+
−
    /* fixes a bug where nav and subnab move with a slight delay */
+
−
    box-shadow: 0 -6px 0 #25283D;
+
−
  }
+
−
  .cd-secondary-nav.slide-up {
+
−
    -webkit-transform: translateY(-80px);
+
−
        -ms-transform: translateY(-80px);
+
−
            transform: translateY(-80px);
+
−
  }
+
−
}
+
−
 
+
−
/* --------------------------------
+
−
 
+
−
Main content
+
−
 
+
−
-------------------------------- */
+
−
.cd-main-content {
+
−
  padding: 60px 5% 2em;
+
−
  overflow: hidden;
+
−
}
+
−
.cd-main-content.sub-nav {
+
−
  /* to be used if there is sub nav */
+
−
  padding-top: 110px;
+
−
}
+
−
.cd-main-content.sub-nav-hero {
+
−
  /* to be used if there is hero image + subnav */
+
−
  padding-top: 0;
+
−
}
+
−
.cd-main-content.sub-nav-hero.secondary-nav-fixed {
+
−
  margin-top: 50px;
+
−
}
+
−
.cd-main-content p {
+
−
  max-width: 1024px;
+
−
  line-height: 1.6;
+
−
  margin: 2em auto;
+
−
  font-family: "David Libre", serif;
+
−
  color: #a5a8a9;
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-main-content {
+
−
    padding-top: 80px;
+
−
  }
+
−
  .cd-main-content.sub-nav {
+
−
    padding-top: 150px;
+
−
  }
+
−
  .cd-main-content.sub-nav-hero.secondary-nav-fixed {
+
−
    margin-top: 70px;
+
−
  }
+
−
  .cd-main-content p {
+
−
    font-size: 2.4rem;
+
−
  }
+
−
}
+
−
 
+
−
/*
+
−
  adjust the positioning of in-page links
+
−
  http://nicolasgallagher.com/jump-links-and-viewport-positioning/
+
−
*/
+
−
.cd-main-content.sub-nav :target::before,
+
−
.cd-main-content.sub-nav-hero :target::before {
+
−
  display: block;
+
−
  content: "";
+
−
  margin-top: -50px;
+
−
  height: 50px;
+
−
  visibility: hidden;
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-main-content.sub-nav :target::before,
+
−
  .cd-main-content.sub-nav-hero :target::before {
+
−
    margin-top: -70px;
+
−
    height: 70px;
+
−
  }
+
−
}
+
−
 
+
−
/* --------------------------------
+
−
 
+
−
Intro Section
+
−
 
+
−
-------------------------------- */
+
−
.cd-hero {
+
−
  /* vertically align its content */
+
−
  display: table;
+
−
  width: 100%;
+
−
  margin-top: 60px;
+
−
  height: 300px;
+
−
  background: url(../img/cd-hero-background.jpg) no-repeat center center;
+
−
  background-size: cover;
+
−
}
+
−
.cd-hero .cd-hero-content {
+
−
  /* vertically align inside parent element */
+
−
  display: table-cell;
+
−
  vertical-align: middle;
+
−
  text-align: center;
+
−
}
+
−
@media only screen and (min-width: 768px) {
+
−
  .cd-hero {
+
−
    height: 400px;
+
−
  }
+
−
}
+
−
@media only screen and (min-width: 1024px) {
+
−
  .cd-hero {
+
−
    height: 600px;
+
−
    margin-top: 80px;
+
−
  }
+
−
}
+
−
 
+
−
 
+
−
/*---Example page----------------------------------------------------------------------------------*/
+
−
table.split-col {
+
−
    margin: auto;
+
−
    width: 95%;
+
−
}
+
−
table.split-col td {
+
−
    width: 50%;
+
−
}
+
−
pre code {
+
−
    color: #c7254e;
+
−
}
+
−
.landing{
+
−
  position: relative;
+
−
  font-family: 'Ubuntu', sans-serif;
+
−
  background-color: #404855;
+
−
  height: 82vh;
+
−
  padding: 15vh;
+
−
  margin-bottom: -2vh;
+
−
  overflow: hidden;
+
−
}
+
−
.changingcircles{
+
−
  display: flex;
+
−
  flex-flow: column;
+
−
  align-items: center;
+
−
}
+
−
#circle1 {
+
−
  position: relative;
+
−
    right: 3vw;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  }
+
−
  #circle2 {
+
−
    position: relative;
+
−
    right: 11vw;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  }
+
−
  #circle3 {
+
−
  position: relative;
+
−
  left: 3vw;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  } 
+
−
  #circle4 {
+
−
  position: relative;
+
−
  left: 7vw;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  }
+
−
  #circle5 {
+
−
  position: relative;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  }
+
−
  #circle6 {
+
−
  position: relative;
+
−
    left: 14vw;
+
−
    width: 6vw;
+
−
    height: 6vw;
+
−
    -webkit-border-radius: 6vw;
+
−
    -moz-border-radius: 6vw;
+
−
    border-radius: 6vw;
+
−
    background: #F9EC69;
+
−
  }
+
−
 
+
−
.landing #caption{
+
−
  position: relative;
+
−
  top: 35px;
+
−
  font-weight: bold;
+
−
  padding-left: 15px;
+
−
  color: #F5636D;
+
−
  font-size: 3.875em;
+
−
  font-style: underline;
+
−
}
+
−
.landing #title {
+
−
  font-size: 1.375em;
+
−
  color: #F5636D;
+
−
  font-weight: bold;
+
−
 
+
−
}
+
−
.landing .btn-danger{
+
−
  margin-top: 3vh;
+
−
  transition: ease;
+
−
  transition-duration: 0.4s;
+
−
  border-color: #F5636D;
+
−
  color: white;
+
−
  background-color: #F5636D;
+
−
}
+
−
.landing .btn-danger:hover{
+
−
  transition: ease;
+
−
  transition-duration: 0.4s;
+
−
  border-color: #F5636D;
+
−
  color: #F5636D;
+
−
  background-color: rgba(0,0,0,0.2);
+
−
}
+
−
.project-logo{
+
−
  position: relative;
+
−
  display: flex;
+
−
  align-items: center;
+
−
  justify-content: center;
+
−
}
+
−
 
+
−
.wcontent-box{
+
−
  margin: 7.5vh 12.5vw;
+
−
  box-shadow: 3px 7px 5px #888888;
+
−
  position:relative;
+
−
  height: auto;
+
−
  width: 75vw;
+
 
    
 
    
−
}
+
<h2 id="caption">OFF to pri<span class="swapper0">ON</span></h2><br>
−
.wcontent-title{
+
<h4 id="title">Using stop codon read-through and CRISPR to explore <i>S. cerevisiae</i> prion mechanisms </h1>
−
  align-items: center;
+
   
−
  text-transform: uppercase;
+
</div>
−
background-color: #404855;
+
     
−
color: #F5636D;
+
</div>
−
font-size: 28px;
+
  
−
padding: 15px;
 
−
}
 
  
−
.wcontent{
+
    <div class="col-xs-2 changing-circles  hidden-sm hidden-xs ">     
−
  background-color: white;
+
      <div id="circle4" class="swapper2"></div><br>
−
  color: #141823;
+
      <div id="circle5" class="swapper3"></div><br>
−
  padding: 40px;
+
      <div id="circle6" class="swapper1"></div><br>
−
}
+
      <div id="circle4" class="swapper2"></div><br>
−
.wcontent p{
+
      <div id="circle5" class="swapper3"></div><br>
−
  font-size: 14px !important;
+
      <div id="circle6" class="swapper1"></div><br>
−
  font-family: 'Ubuntu', sans-serif !important;
+
    </div>
−
}
+
−
/*  Made this specifically for the parts page and the protocols page, which need less padding. */
+
−
.wcontent_alt{
+
−
  background-color: white;
+
−
  color: #141823;
+
−
  padding: 10px;
+
−
}
+
  
−
.wcontent-protocol{
+
</div>
−
  margin: 7.5vh 5vw;
+
</div>
−
  box-shadow: 3px 7px 5px #888888;
+
</div>
−
  position:relative;
+
−
  height: auto;
+
−
  width: 30vw;
+
−
 
+
−
}
+
−
.initial-bar{
+
−
  background-color:rgb(39, 40, 34);
+
−
  box-shadow: 0px 2px 3px #2a2e2f;
+
−
  height: 8vh; 
+
−
}
+
−
nav .button-toggle{
+
−
  background-color: white;
+
−
}
+
−
.navbar{
+
−
  display: inline-block;
+
−
}
+
−
.navbar-nav > li > a{
+
−
  padding-top: 18px;
+
−
  transition-duration: 0.1s;
+
−
  transition-timing-function: linear;
+
  
−
}
+
<br>
  
−
.navbar-toggle .icon-bar{
+
<div class="yeastpan">
−
   background-color: white;
+
   <div class="overlay"></div>
−
}
+
  <h3 class="pan-text"> <span class="pan-background">Furthering the advancement of research into prions and neurodegenerative diseases
 +
</span></h3>
 +
</div>
  
−
.initial-bar .navbar-nav > li > a:hover{
 
−
    background-color: rgba(0,0,0,0);
 
−
    border-top-style: solid;
 
−
    border-top-color: white;
 
−
    padding-top: 15px;
 
−
}
 
−
.initial-bar .navbar-nav > li > a:focus {
 
−
    background-color: rgba(0,0,0,0);
 
−
    border-top-style: solid;
 
−
    border-top-color: indianred;
 
−
    padding-top: 15px;
 
−
    color:indianred;
 
−
}
 
−
.protocol-page .wcontent-box{
 
−
  width: 50vw;
 
−
}
 
−
.wcontent-img33{
 
−
  width: 33%;
 
−
  display: inline-block;
 
−
  margin: auto;
 
−
}
 
−
.wcontent-img50{
 
−
  width: 49%;
 
−
  display: inline-block;
 
−
  margin: auto;
 
−
}
 
−
.wcontent-img-solo25{
 
−
  width: 25vw;
 
−
  display:block;
 
−
  margin: auto;
 
−
}
 
−
.wcontent-img-solo50{
 
−
  width: 50vw;
 
−
  display:block;
 
−
  margin: auto;
 
−
}
 
  
−
.precard{
+
   <div class="container-fluid tsc">
−
   display:flex;
+
    <div class="row">
−
  flex-flow: row wrap;
+
    <div class="col-md-4 center"><img class="tsc1" style="width: 15vw" src="https://static.igem.org/mediawiki/2016/0/01/T--Waterloo--Trigger_landing.png" >
−
  padding: 55px;
+
<h4 id="texticles1"> We initiate a [PSI+] response in S. cerevisiae using a plasmid that will overexpress Sup35-NM. </h4></div>
−
}
+
    <div class="col-md-4 center"><img class="tsc2" style="width: 15vw"  src="https://static.igem.org/mediawiki/2016/e/e0/T--Waterloo--Signal_landing.png">
−
.team-card{
+
<h4 id="texticles2"> We insert a premature stop codon into an N-terminal CFP tag that will be read through and fluoresce during a [PSI+] response</h4></div>
−
  position: relative;
+
    <div class="col-md-4 center"><img class="tsc3" style="width: 15vw"  src="https://static.igem.org/mediawiki/2016/f/fe/T--Waterloo--Control_landing.png" >
−
  z-index: 1;
+
<h4 id="texticles3">We control read through rates by choosing the location of the premature stop codon, and can therefore control protein production in [PSI+]. We use Hsp104, a chaperone protein in S. cerevisiae, to demonstrate that our set-up phenotypically responds to the stop codon readthrough. </h4> </div>
−
  margin: 3vw;
+
    </div>
−
  width: 25vw;
+
−
}
+
−
.card-desc{
+
−
  transition-timing-function: linear;
+
−
  transition-duration: 1s;
+
−
  padding: 110px 50px 50px 50px;
+
−
  width: 100%;
+
−
  height: 450px;
+
−
  background-color: white;
+
−
}
+
−
.monster{
+
−
  padding-top: 20px;
+
−
  color:#F5636D;
+
−
  font-size: 24px;
+
−
  padding-left: 250px;
+
−
  padding-right: 15px;
+
−
  padding-bottom: 10px;
+
−
  background-color: #404855;
+
−
}
+
−
.person-program{
+
−
  color: #F5636D;
+
−
  font-size: 16px;
+
−
}
+
−
.person-labteam{
+
−
  color: #3f7f7f;
+
−
  font-size: 19px;
+
−
}
+
  
−
.person-desc{
+
   </div>
−
   color: #777777;
+
<div style="background: rgba(30,144,255, 0.4)">
−
  font-size: 14px;
+
  <div class="pan-text"><span style="color: #F6536D">ABSTRACT</span> </div>
−
}
+
−
.urinacircle{
+
−
  z-index: 2;
+
−
  position: absolute;
+
−
  top: -35px;
+
−
  margin-left: 15px;
+
−
  background-color: #cccccc;
+
−
  height: 200px;
+
−
  width: 200px;
+
−
  border-radius:50%;
+
−
}
+
−
.bigyou{
+
−
  transition-timing-function: linear;
+
−
  transition-duration: 1s;
+
−
  padding: 110px 50px 50px 50px;
+
−
  width: 100%;
+
−
  height: 450px;
+
−
  background-color: white;
+
−
}
+
  
−
.wcontent-box .wcontent-caption{
 
−
  margin-top: 2vh;
 
−
  margin-bottom: 2vh;
 
−
  display: block;
 
−
  text-align: center !important;
 
−
  color: #777777;
 
−
}
 
−
.wcontent-img-solo37{
 
−
  width: 37vw;
 
−
  display:block;
 
−
  margin: auto;
 
−
}
 
−
.train-5{
 
−
  width: 19%;
 
−
  display: inline-block;
 
−
  margin:auto;
 
−
}
 
  
−
.img-train-4{
+
<h3 style="text-shadow: 2px 2px #999999; padding:0vw 10vw 10vh 10vw"> 
−
  margin:2.5%;
+
Prions, or “zombie proteins,” are infectious agents that lead to a variety of neurodegenerative disorders (NDDs). They sicken cells by aggregating with each other and prevent proper protein folding leading to cell death from the accumulated damage. We propose a synthetic biology approach to better study prion propagation in the model organism S. cerevisiae. Our system involves inserting a premature stop codon into a protein open reading frame of interest or into dCas9 to respectively overexpress or knock-down protein levels during a [PSI+] response. We use Hsp104, a chaperone protein in S. cerevisiae, to demonstrate that our set-up phenotypically responds to the stop codon readthrough. This research is useful for continuously observing a phenotypic output during prion propagation in yeast and may have implications for helping to identify protein targets for both prevention and treatment of NDDs in the future.
−
  width: 19%;
+
</h3>
−
  display: inline-block;
+
−
}
+
  
−
.paragraph-medium {
 
−
  font-size: 15px !important;
 
−
}
 
  
−
/* header-image and header-text are classes for making a somewhat opaque header with
+
</div>
−
text in its center and an image in the background. it adjusts size with the size of the window. */
+
  
−
.header-image {
 
−
  width: 100%;
 
−
  height:20vw;
 
−
  opacity:0.7;
 
−
  background-position: center center;
 
−
  background-size: cover;
 
−
}
 
  
−
.header-text {
+
<script>
−
  padding:5.5vw 5.5vw 5.5vw 5.5vw;
+
  $(document).ready(function(){
−
  opacity: 0.7;
+
        function toprion(){
−
  font-size: 8vw;
+
      $(".swapper1")
−
  text-align:center;
+
      .animate({'background-color':'#fdf9d2', svgFill:'#ffe86a'}, 1500)
−
  font-family:sans-serif;
+
      .animate({'background-color':'#F5C2C7', svgFill: '#F5C2C7'},500)
−
}
+
      .animate({'background-color':'#F5636D', svgFill: '#F5636D'},1500, toprion);
 +
    };
 +
    function toprion2(){
 +
        $(".swapper2")
 +
          .animate({'background-color':'#fdf9d2'}, 1800)
 +
          .animate({'background-color':'#F5C2C7'},1200)
 +
          .animate({'background-color':'#F5636D'},500,
 +
          toprion2)
 +
        };
 +
      function toprion3(){
 +
        $(".swapper3")
 +
          .animate({'background-color':'#fdf9d2'}, 1000)
 +
          .animate({'background-color':'#F5C2C7'},1200)
 +
          .animate({'background-color':'#F5636D'},2000,
 +
          toprion3)
 +
        };
 +
    toprion3();
 +
    toprion2();
 +
    toprion();
  
−
.idkmakeityellow {
+
    $("#texticles1").hide()
−
   background-color: #ffe86a;
+
    $("#texticles2").hide()
−
}
+
    $("#texticles3").hide()
 +
    $(".tsc1").on("click", function(){
 +
      $("#texticles1").slideToggle()
 +
    }) 
 +
      $(".tsc2").on("click", function(){
 +
      $("#texticles2").slideToggle()
 +
    })    
 +
    $(".tsc3").on("click", function(){
 +
      $("#texticles3").slideToggle()
 +
    })
 +
  })
 +
</script>
 +
</body>
 +
</html>
  
−
.noalightyellow {
+
{{Template:Waterloo/Footer}}
−
  background-color: #fff9d4;
+
−
}
+
−
 
+
−
.justmakeitlightorange {
+
−
  background-color: #ffaa30;
+
−
}
+
−
 
+
−
.bloodorangeisacolour {
+
−
  background-color: #f24a2c;
+
−
}
+
−
 
+
−
.nonpretentiousorange {
+
−
  background-color: #f15a24;
+
−
}
+
−
 
+
−
.itsnotpinkitssalmon {
+
−
  background-color: #F5C2C7;
+
−
}
+
−
 
+
−
.evenlighteryellow {
+
−
  background-color: #fdf9d2;
+
−
}
+
−
 
+
−
.pinkredorsomething {
+
−
  background-color: #F5636D;
+
−
}
+
−
 
+
−
#wrapper {
+
−
    height:100%;
+
−
    width: 100%;
+
−
    margin: 0 auto;
+
−
}
+
−
 
+
−
#footer {
+
−
  position:fixed;
+
−
  bottom:0;
+
−
  width:100%;
+
−
  height:60px;  /* Height of the footer */
+
−
  background:#6cf;
+
−
}
+
−
@keyframes panning {
+
−
  0% {
+
−
    background-position: 0% 0%;
+
−
  }
+
−
  25% {
+
−
    background-position: 100% 100%;
+
−
  }
+
−
  50% {
+
−
    background-position: 100% 0%;
+
−
  }
+
−
  75% {
+
−
    background-position: 0 100%;
+
−
  }
+
−
  200% {
+
−
    background-position: 0 0;
+
−
  }
+
−
}
+
−
.yeastpan {
+
−
  position: relative;
+
−
  height:90vh;
+
−
  width:100%;
+
−
  opacity:0.7;
+
−
  background: black url(https://static.igem.org/mediawiki/2016/5/51/T--Waterloo--Yeast.jpg);
+
−
  background-size: 200%;
+
−
  animation: panning 50s infinite linear;
+
−
}
+
−
.pan-text{
+
−
  padding:5.5vw 5.5vw 5.5vw 5.5vw;
+
−
  font-size: 4vw;
+
−
  text-align:center;
+
−
  font-family: 'Ubuntu', sans-serif;
+
−
}
+
−
span.pan-background{
+
−
  background-color: white;
+
−
}
+
−
.test {
+
−
  position: relative;
+
−
  height: 300px;
+
−
  width: 100%;
+
−
  background: black url(http://unsplash.it/1900/1900/?random&blur);
+
−
  background-size: 200%;
+
−
  animation: panning 50s infinite linear;
+
−
}
+
−
.image-wide{
+
−
  width:100%;
+
−
}
+
−
.yeastpan > .overlay {
+
−
  position: absolute;
+
−
  top: 0;
+
−
  left: 0;
+
−
  width: 100%;
+
−
  height: 100%;
+
−
  background: rgba(255,232,106, .3);
+
−
  z-index: 10;
+
−
}
+
−
.overlay {
+
−
  position: absolute;
+
−
  top: 0;
+
−
  left: 0;
+
−
  width: 100%;
+
−
  height: 100%;
+
−
  background: rgba(255,232,106, .3);
+
−
  z-index: 10;
+
−
}
+
−
 
+
−
.text {
+
−
  position: absolute;
+
−
  top: 0;
+
−
  left: 0;
+
−
  right: 0;
+
−
  bottom: 0;
+
−
  z-index: 20;
+
−
  height: 60px;
+
−
  width: 290px;
+
−
  margin: auto;
+
−
  font-family: Roboto;
+
−
  font-size: 34px;
+
−
  color: white;
+
−
  font-weight: 100;
+
−
  text-align: center;
+
−
  padding: 10px 40px;
+
−
  border: 3px solid #ccc;
+
−
  border-radius: 2px;
+
−
  -webkit-font-smoothing: antialiased;
+
−
}
+
−
.tsc{
+
−
  background: white;
+
−
  padding-top: 3vh;
+
−
  padding-bottom: 3vh;
+
−
  padding-left: 15vw;
+
−
  display: flex;
+
−
  flex-flow: column;
+
−
}
+
−
.tsc-content{
+
−
  display: flex;
+
−
  align-items: center;
+
−
}
+
−
.tsc-content img{
+
−
  width: 15vw;
+
−
}
+
−
 
+
−
/* Footer things */
+
−
 
+
−
footer {
+
−
  bottom: 0;
+
−
  width: 100%;
+
−
  padding: 0;
+
−
  -webkit-box-shadow: inset 0 10px 15px -10px #424242;
+
−
    -moz-box-shadow: inset 0 10px 15px -10px #424242;
+
−
      -ms-box-shadow: inset 0 10px 15px -10px #424242;
+
−
      -o-box-shadow: inset 0 10px 15px -10px #424242;
+
−
          box-shadow: inset 0 10px 15px -10px #424242;
+
−
  background: #2a2e33;
+
−
  line-height: 2em;
+
−
  color: #fff;
+
−
  box-sizing: border-box;
+
−
  text-align: center;
+
−
}
+
−
 
+
−
footer .footer-company-motto {
+
−
  color:  #8d9093;
+
−
  font-size: 0.9em;
+
−
  margin: 0;
+
−
}
+
−
 
+
−
footer .footer-company-name {
+
−
  color:  #8d9093;
+
−
  font-size: 1.3em;
+
−
  margin: 0;
+
−
}
+
−
footer .footer-links {
+
−
  list-style: none;
+
−
  padding: 1.5em 0 0;
+
−
  margin: 0;
+
−
}
+
−
 
+
−
footer p.footer-links a {
+
−
  display:inline-block;
+
−
  text-decoration: none;
+
−
  padding-right: 1.2em !important;
+
−
  color:  #ffffff;
+
−
  font-size: 0.8em;
+
−
}
+
−
 
+
−
footer p.footer-links a:hover {
+
−
    color: #23b593;
+
−
}
+
−
 
+
−
/* If you don't want the footer to be responsive, remove these media queries */
+
−
 
+
−
@media (max-width: 1000px) {
+
−
    footer .footer-company-motto .footer-company-name .footer-links {
+
−
        font-size: 1.2em;
+
−
    }
+
−
    footer .footer-links a {
+
−
        padding: 25px 0 20px;
+
−
        line-height: 1.8;
+
−
    }
+
−
}
+
−
 
+
−
blockquote {
+
−
  border-left: 5px solid #23b593 !important;
+
−
  font-size: 1.1em;
+
−
  padding: 1em;
+
−
  font-weight: bold;
+
−
  color: #23b593;
+
−
}
+
−
.wcontent li{
+
−
  font-size: 14px;
+
−
}
+
−
</style>
+
−
</html>
+

Latest revision as of 23:59, 19 October 2016

OFF to priON


Using stop codon read-through and CRISPR to explore S. cerevisiae prion mechanisms


Furthering the advancement of research into prions and neurodegenerative diseases

We initiate a [PSI+] response in S. cerevisiae using a plasmid that will overexpress Sup35-NM.

We insert a premature stop codon into an N-terminal CFP tag that will be read through and fluoresce during a [PSI+] response

We control read through rates by choosing the location of the premature stop codon, and can therefore control protein production in [PSI+]. We use Hsp104, a chaperone protein in S. cerevisiae, to demonstrate that our set-up phenotypically responds to the stop codon readthrough.

ABSTRACT

Prions, or “zombie proteins,” are infectious agents that lead to a variety of neurodegenerative disorders (NDDs). They sicken cells by aggregating with each other and prevent proper protein folding leading to cell death from the accumulated damage. We propose a synthetic biology approach to better study prion propagation in the model organism S. cerevisiae. Our system involves inserting a premature stop codon into a protein open reading frame of interest or into dCas9 to respectively overexpress or knock-down protein levels during a [PSI+] response. We use Hsp104, a chaperone protein in S. cerevisiae, to demonstrate that our set-up phenotypically responds to the stop codon readthrough. This research is useful for continuously observing a phenotypic output during prion propagation in yeast and may have implications for helping to identify protein targets for both prevention and treatment of NDDs in the future.