Team:CSU Fort Collins/Outreach/

From 2014.igem.org

(Difference between revisions)
m
Line 4: Line 4:
-
<title>Outreach</title>
+
<title>CSU iGEM 2014</title>
 +
 
 +
<head>
 +
 
<link href='http://fonts.googleapis.com/css?family=Bitter:400,700,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Bitter:400,700,400italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Muli:300,400' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Muli:300,400' rel='stylesheet' type='text/css'>
-
 
-
<body style="background-size:100%; background-color:#EFEFEF">
 
<style type="text/css">
<style type="text/css">
-
A{
+
/* http://meyerweb.com/eric/tools/css/reset/
-
    color:#222222;
+
  v2.0 | 20110126
 +
  License: none (public domain)
 +
*/
 +
 
 +
html, body, div, span, applet, object, iframe, p, blockquote, pre,
 +
a, abbr, acronym, address, big, cite, code,
 +
del, dfn, em, img, ins, kbd, q, s, samp,
 +
small, strike, strong, sub, sup, tt, var,
 +
b, u, i, center,
 +
dl, dt, dd, ol, ul, li,
 +
fieldset, form, label, legend,
 +
table, caption, tbody, tfoot, thead, tr, th, td,
 +
article, aside, canvas, details, embed,
 +
figure, figcaption, footer, header, hgroup,
 +
menu, nav, output, ruby, section, summary,
 +
time, mark, audio, video {
 +
  margin: 0;
 +
  padding: 0;
 +
  border: 0;
 +
  font-size: 90%;
 +
  font: inherit;
 +
  vertical-align: baseline;
}
}
-
A:visited{
+
/* HTML5 display-role reset for older browsers */
-
    color:#222222;
+
article, aside, details, figcaption, figure,
 +
footer, header, hgroup, menu, nav, section {
 +
  display: block;
}
}
-
A:hover{
+
body {
-
    opacity:0.3;
+
  line-height: 1;
-
    text-decoration:none;
+
}
}
-
h1,h2,h3,h4,h5,h6{
+
ol, ul {
-
    font-family:'Bitter', serif;
+
  list-style: none;
-
    text-decoration:none;
+
-
    font-weight:700;
+
-
    color:#222222;
+
-
    border:none;
+
}
}
-
.pic{
+
blockquote, q {
-
          width:100px;
+
  quotes: none;
-
          height:100px;
+
}
-
          border-radius:100%;
+
blockquote:before, blockquote:after,
-
    }
+
q:before, q:after {
-
p{
+
  content: '';
 +
  content: none;
 +
}
 +
table {
 +
  border-collapse: collapse;
 +
  border-spacing: 0;
 +
}
 +
 
 +
#menubar > ul{
 +
  vertical-align:center;
 +
  font-size:14px;
 +
  font-family:'Times New Roman',serif;
 +
}
 +
 
 +
.firstHeading{
 +
display:none;
 +
}
 +
 
 +
#textbox span{
 +
  color:#E6B800;
 +
}
 +
.photo{
 +
  width:70%;
 +
}
 +
table{
 +
  font-family:'Muli',sans-serif;
 +
}
 +
body{
 +
  background-color:#EFEFEF;
 +
  line-height:1.3;
 +
  font-size:90%;
 +
}
 +
#cssmenu {
 +
  width:100%;
 +
  height: 44px;
 +
  background: #222222;
 +
  position:relative;
 +
  text-align:center;
 +
  margin:auto;
 +
}
 +
#cssmenu ul {
 +
  list-style: none;
 +
  padding: 0;
 +
  margin: 0;
 +
  line-height: 1;
 +
}
 +
#cssmenu > ul {
 +
  position: relative;
 +
  display: block;
 +
  background: #222222;
 +
  width: 100%;
 +
  z-index: 500;
 +
}
 +
#cssmenu:after,
 +
#cssmenu > ul:after {
 +
  content: '.';
 +
  display: block;
 +
  clear: both;
 +
  visibility: hidden;
 +
  line-height: 0;
 +
  height: 0;
 +
}
 +
#cssmenu.align-right > ul > li {
 +
  float: right;
 +
}
 +
#cssmenu.align-center ul {
 +
  text-align: center;
 +
}
 +
#cssmenu.align-center ul ul {
 +
  text-align: left;
 +
}
 +
#cssmenu > ul > li {
 +
  display: inline-block;
 +
  position: relative;
 +
  margin: 0;
 +
  padding: 0;
 +
}
 +
#cssmenu > ul > #menu-button {
 +
  display: none;
 +
}
 +
#cssmenu ul li a {
 +
  display: block;
 +
  font-family: Helvetica, sans-serif;
 +
  text-decoration: none;
 +
}
 +
#cssmenu > ul > li > a {
 +
  font-size: 14px;
 +
  font-weight: bold;
 +
  padding: 15px 20px;
 +
  color: #efefef;
 +
  text-transform: uppercase;
 +
  -webkit-transition: color 0.25s ease-out;
 +
  -moz-transition: color 0.25s ease-out;
 +
  -ms-transition: color 0.25s ease-out;
 +
  -o-transition: color 0.25s ease-out;
 +
  transition: color 0.25s ease-out;
 +
}
 +
#cssmenu > ul > li.has-sub > a {
 +
  padding-right: 32px;
 +
}
 +
#cssmenu > ul > li:hover > a {
 +
  color: #E6B800;
 +
}
 +
#cssmenu li.has-sub::after {
 +
  display: block;
 +
  content: '';
 +
  position: absolute;
 +
  width: 0;
 +
  height: 0;
 +
}
 +
#cssmenu > ul > li.has-sub::after {
 +
  right: 10px;
 +
  top: 20px;
 +
  border: 5px solid transparent;
 +
  border-top-color: #efefef;
 +
}
 +
#cssmenu > ul > li:hover::after {
 +
  border-top-color: #E6B800;
 +
}
 +
#indicatorContainer {
 +
  position: absolute;
 +
  height: 12px;
 +
  width: 100%;
 +
  bottom: 0px;
 +
  overflow: hidden;
 +
  z-index: -1;
 +
}
 +
#pIndicator {
 +
  position: absolute;
 +
  height: 0;
 +
  width: 100%;
 +
  border: 12px solid transparent;
 +
  border-top-color: #2b2f3a;
 +
  z-index: -2;
 +
  -webkit-transition: left .25s ease;
 +
  -moz-transition: left .25s ease;
 +
  -ms-transition: left .25s ease;
 +
  -o-transition: left .25s ease;
 +
  transition: left .25s ease;
 +
}
 +
#cIndicator {
 +
  position: absolute;
 +
  height: 0;
 +
  width: 100%;
 +
  border: 12px solid transparent;
 +
  border-top-color: #2b2f3a;
 +
  top: -12px;
 +
  right: 100%;
 +
  z-index: -2;
 +
}
 +
#cssmenu ul ul {
 +
  position: absolute;
 +
  left: -9999px;
 +
  top: 70px;
 +
  opacity: 0;
 +
  -webkit-transition: opacity .3s ease, top .25s ease;
 +
  -moz-transition: opacity .3s ease, top .25s ease;
 +
  -ms-transition: opacity .3s ease, top .25s ease;
 +
  -o-transition: opacity .3s ease, top .25s ease;
 +
  transition: opacity .3s ease, top .25s ease;
 +
  z-index: 1000;
 +
}
 +
#cssmenu ul ul ul {
 +
  top: 37px;
 +
  padding-left: 5px;
 +
}
 +
#cssmenu ul ul li {
 +
  position: relative;
 +
}
 +
#cssmenu > ul > li:hover > ul {
 +
  left: auto;
 +
  top: 44px;
 +
  opacity: 1;
 +
}
 +
#cssmenu.align-right > ul > li:hover > ul {
 +
  left: auto;
 +
  right: 0;
 +
  opacity: 1;
 +
}
 +
#cssmenu ul ul li:hover > ul {
 +
  left: 170px;
 +
  top: 0;
 +
  opacity: 1;
 +
}
 +
#cssmenu.align-right ul ul li:hover > ul {
 +
  left: auto;
 +
  right: 170px;
 +
  top: 0;
 +
  opacity: 1;
 +
  padding-right: 5px;
 +
}
 +
#cssmenu ul ul li a {
 +
  width: 130px;
 +
  border-bottom: 1px solid #eeeeee;
 +
  padding: 10px 20px;
 +
  font-size: 12px;
 +
  color: #222222;
 +
  background: white;
 +
  -webkit-transition: all .35s ease;
 +
  -moz-transition: all .35s ease;
 +
  -ms-transition: all .35s ease;
 +
  -o-transition: all .35s ease;
 +
  transition: all .35s ease;
 +
}
 +
#cssmenu.align-right ul ul li a {
 +
  text-align: right;
 +
}
 +
#cssmenu ul ul li:hover > a {
 +
  background: white;
 +
  color: #E6B800;
 +
}
 +
#cssmenu ul ul li:last-child > a,
 +
#cssmenu ul ul li.last > a {
 +
  border-bottom: 0;
 +
}
 +
#cssmenu > ul > li > ul::after {
 +
  content: '';
 +
  border: 6px solid transparent;
 +
  width: 0;
 +
  height: 0;
 +
  border-bottom-color: #efefef;
 +
  position: absolute;
 +
  top: -12px;
 +
  left: 30px;
 +
}
 +
#cssmenu.align-right > ul > li > ul::after {
 +
  left: auto;
 +
  right: 30px;
 +
}
 +
#cssmenu ul ul li.has-sub::after {
 +
  border: 4px solid transparent;
 +
  border-left-color: #222222;
 +
  right: 10px;
 +
  top: 12px;
 +
  -moz-transition: all .2s ease;
 +
  -ms-transition: all .2s ease;
 +
  -o-transition: all .2s ease;
 +
  transition: all .2s ease;
 +
  -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
 +
}
 +
#cssmenu.align-right ul ul li.has-sub::after {
 +
  border-left-color: transparent;
 +
  border-right-color: #222222;
 +
  right: auto;
 +
  left: 10px;
 +
}
 +
#cssmenu ul ul li.has-sub:hover::after {
 +
  border-left-color: #efefef;
 +
  right: -5px;
 +
  -webkit-transform: rotateY(180deg);
 +
  -ms-transform: rotateY(180deg);
 +
  -moz-transform: rotateY(180deg);
 +
  -o-transform: rotateY(180deg);
 +
  transform: rotateY(180deg);
 +
}
 +
#cssmenu.align-right ul ul li.has-sub:hover::after {
 +
  border-right-color: #efefef;
 +
  border-left-color: transparent;
 +
  left: -5px;
 +
  -webkit-transform: rotateY(180deg);
 +
  -ms-transform: rotateY(180deg);
 +
  -moz-transform: rotateY(180deg);
 +
  -o-transform: rotateY(180deg);
 +
  transform: rotateY(180deg);
 +
}
 +
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
 +
  #cssmenu {
 +
    width: 100%;
 +
  }
 +
  #cssmenu.align-center ul {
 +
    text-align: left;
 +
  }
 +
  #cssmenu.align-right > ul > li {
 +
    float: none;
 +
  }
 +
  #cssmenu ul {
 +
    width: auto;
 +
  }
 +
  #cssmenu .submenuArrow,
 +
  #cssmenu #indicatorContainer {
 +
    display: none;
 +
  }
 +
  #cssmenu > ul {
 +
    height: auto;
 +
    display: block;
 +
    color:#EFEFEF;
 +
  }
 +
  #cssmenu > ul > li {
 +
    float: none;
 +
  }
 +
  #cssmenu li,
 +
  #cssmenu > ul > li {
 +
    display: none;
 +
    color:white;
 +
  }
 +
  #cssmenu ul ul,
 +
  #cssmenu ul ul ul,
 +
  #cssmenu ul > li:hover > ul,
 +
  #cssmenu ul ul > li:hover > ul,
 +
  #cssmenu.align-right ul ul,
 +
  #cssmenu.align-right ul ul ul,
 +
  #cssmenu.align-right ul > li:hover > ul,
 +
  #cssmenu.align-right ul ul > li:hover > ul {
 +
    position: relative;
 +
    left: auto;
 +
    top: auto;
 +
    opacity: 1;
 +
    padding-left: 0;
 +
    padding-right: 0;
 +
    right: auto;
 +
  }
 +
  #cssmenu ul .has-sub::after {
 +
    display: none;
 +
  }
 +
  #cssmenu ul li a {
 +
    padding: 12px 20px;
 +
  }
 +
  #cssmenu ul ul li a {
 +
    border: 0;
 +
    background: none;
 +
    width: auto;
 +
    padding: 8px 35px;
 +
    color:white;
 +
  }
 +
  #cssmenu.align-right ul ul li a {
 +
    text-align: left;
 +
  }
 +
  #cssmenu ul ul li:hover > a {
 +
    background:none;
 +
    color: #ec9359;
 +
  }
 +
  #cssmenu ul ul ul a {
 +
    padding: 8px 50px;
 +
  }
 +
  #cssmenu ul ul ul ul a {
 +
    padding: 8px 65px;
 +
  }
 +
  #cssmenu ul ul ul ul ul a {
 +
    padding: 8px 80px;
 +
  }
 +
  #cssmenu ul ul ul ul ul ul a {
 +
    padding: 8px 95px;
 +
  }
 +
  #cssmenu > ul > #menu-button {
 +
    display: block;
 +
    cursor: pointer;
 +
  }
 +
  #cssmenu #menu-button > a {
 +
    padding: 14px 20px;
 +
  }
 +
  #cssmenu ul.open li,
 +
  #cssmenu > ul.open > li {
 +
    display: block;
 +
  }
 +
  #cssmenu > ul.open > li#menu-button > a {
 +
    color: #fff;
 +
    border-bottom: 1px solid rgba(150, 150, 150, 0.1);
 +
  }
 +
  #cssmenu ul ul::after {
 +
    display: none;
 +
  }
 +
  #cssmenu #menu-button::after {
 +
    display: block;
 +
    content: '';
 +
    position: absolute;
 +
    height: 3px;
 +
    width: 22px;
 +
    border-top: 2px solid #efefef;
 +
    border-bottom: 2px solid #efefef;
 +
    right: 20px;
 +
    top: 15px;
 +
  }
 +
  #cssmenu #menu-button::before {
 +
    display: block;
 +
    content: '';
 +
    position: absolute;
 +
    height: 3px;
 +
    width: 22px;
 +
    border-top: 2px solid #efefef;
 +
    right: 20px;
 +
    top: 25px;
 +
  }
 +
  #cssmenu ul.open #menu-button::after,
 +
  #cssmenu ul.open #menu-button::before {
 +
    border-color: #fff;
 +
  }
 +
}
 +
.icon{
 +
  width:30px;
 +
}
 +
.wrapper2{
 +
  width:20%;
 +
  padding:20px 0px 20px 20px;
 +
  display:inline-block;
 +
  margin:auto;
 +
  vertical-align:top;
 +
}
 +
.wrapper{
 +
  width:90%;
 +
  padding:20px 0px 20px 20px;
 +
  padding-left:0;
 +
  margin:auto;
 +
  vertical-align: top;
 +
}
 +
.page, .container{
 +
  width:50%;
 +
  min-width:600px;
 +
  max-width:800px;
 +
  padding:30px;
 +
  margin:auto;
 +
  text-align:left;
 +
  font-family:'Muli',sans-serif;
 +
  display:inline-block;
 +
}
 +
.page a, .container a{
 +
  color:#222222;
 +
}
 +
.page a:hover, .container a:hover{
 +
  color:#E6B800;
 +
  text-decoration:none;
 +
}
 +
 
 +
h1{
 +
  color:#222222;
 +
  font-family:'Bitter',serif;
 +
  border-bottom:none;
 +
}
 +
h2,h3,.toc,.show,.hide,.content{
 +
  color:#E6B800;
 +
  font-family:'Bitter',serif;
 +
}
 +
h4,h5,h6, .page{
 +
  color:#222222;
 +
  font-family:'Muli',sans-serif;
 +
}
 +
.toc{
 +
  text-decoration:none;
 +
  display:none;
 +
  width:100%;
 +
  margin:auto;
 +
}
 +
.toc .month-group { margin: 20px 0; }
 +
.toc .month-group p { padding: 0; margin: 0; }
 +
#ftoc{
 +
  color:#666666;
 +
}
 +
ul{
 +
  list-style-type:none;
 +
}
 +
.month-group, a{
 +
  text-decoration:none;
 +
}
 +
.month-group{
 +
  margin-left:20px;
 +
}
 +
.month-group:hover{
 +
  color:#E6B800;
 +
}
 +
.toc a, .toc2 a, #navi a{
 +
  text-decoration:none;
 +
  color:#222222;
 +
  font-weight: bold;
 +
}
 +
.toc a:hover, #ftoc>a:hover, #navi a:hover, .show:hover, .hide:hover, .container>a:hover{
 +
  color:#E6B800 !important;
 +
  cursor:pointer;
 +
}
 +
.toc a, #ftoc, .container a, #navi{
 +
  border-bottom:2px dotted;
 +
}
 +
#navi{
 +
  text-decoration:none;
 +
  font-family:'Bitter',serif;
 +
}
 +
#logo{
 +
  width:120px;
 +
  margin:auto;
 +
  padding:40px;
 +
  border-radius:100%;
 +
}
 +
#banner{
 +
  width:auto;
 +
  height:250px;
 +
  vertical-align:top;
 +
  background-color:#E6B800;
 +
  overflow: hidden
 +
}
 +
.fixed {
 +
  position:fixed !important;
 +
  top:0;
 +
}
 +
.disp{
 +
  display:none;
 +
}
 +
.col {
 +
    width: 20%;
 +
    float: left;
 +
    clear: right;
 +
    margin: 20px 1.66666666666666666666666666%;
     font-family:'Muli',sans-serif;
     font-family:'Muli',sans-serif;
     font-weight:300;
     font-weight:300;
 +
    font-size:14px;
     color:#222222;
     color:#222222;
 +
    text-align:left;
}
}
-
 
+
.clear{
-
td{
+
  width:100%;
-
    text-align:center;
+
  clear:both;
-
    padding:30px;
+
-
    font-family:Helvetica, Arial, sans-serif;
+
-
    font-size:15px;
+
}
}
-
 
+
.container{
-
.button{
+
  line-height:1.9;
-
    display:inline;
+
-
    margin-left:15px;
+
-
    margin-right:15px;
+
-
    padding:10px;
+
-
    border-radius:5px;
+
-
    font-family:'Bitter', serif;
+
-
    font-size:15px;
+
}
}
-
ul ul {
+
.index{
-
display: none;
+
  margin-right:20px;
 +
}
 +
.toc2{
 +
  display:block;
 +
}
 +
.footer{
 +
    background-color:#222222;
 +
    width:100%;
 +
    margin:auto;
 +
    padding:15px;
 +
    color:#efefef;
 +
    font-size:14px;
 +
}
 +
.footer table{
 +
    background-color:#222222;
 +
    color:#efefef;
 +
    margin:auto;
 +
}
 +
.footer a{
 +
    color:#efefef;
}
}
-
ul li:hover > ul {
 
-
display: block;
 
-
}
 
</style>
</style>
-
<!---navigation bar--->
+
</head>
-
<center><div style="width:90%; padding:0px 30px">
 
-
<ul>
 
-
<li class="button"><a href="/Team:CSU_Fort_Collins">Home</a></li>
+
 
-
<li class="button"><a href="/Team:CSU_Fort_Collins/Team/">Team</a></li>
+
<body style='margin:0'>
-
    <ul>
+
 
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Team/">Member Profiles</a></li>
+
<div id='banner'><center><img src='http://oi57.tinypic.com/1498eg5.jpg'/>
-
    <li class="button"><a href="https://igem.org/Team.cgi">Official Team Profile</a></li>
+
</center></div>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Sponsors/">Sponsors</a></li>
+
 
-
    </ul>
+
<div id='cssmenu'>
-
<li class="button"><a href="/Team:CSU_Fort_Collins/Project/">Project</a></li>
+
<ul>
-
    <ul>
+
  <li><a href='/Team:CSU_Fort_Collins'><span>Home</span></a></li>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Biosensor/">Biosensor</a></li>
+
  <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Project/'><span>Project</span></a>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Breakdown/">Breakdown</a></li>
+
      <ul>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/HVP/">High-Value Product</a></li>
+
        <li><a href='/Team:CSU_Fort_Collins/Biosensor/'><span>Biosensor</span></a></li>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/KillSwitch/">Kill Switch</a></li>
+
        <li><a href='/Team:CSU_Fort_Collins/Breakdown/'><span>Breakdown</span></a></li>
-
    </ul>
+
        <li><a href='/Team:CSU_Fort_Collins/HVP/'><span>High-Value Product</span></a></li>
-
<li class="button"><a href="/Team:CSU_Fort_Collins"><img src="https://static.igem.org/mediawiki/2014/0/03/CSULogo1.png" style="width:200px"/></a></li>
+
        <li><a href='/Team:CSU_Fort_Collins/KillSwitch/'><span>Kill Switch</span></a></li>
-
<li class="button"><a href="/Team:CSU_Fort_Collins/Outreach/">Outreach</a></li>
+
      </ul>
-
    <ul>
+
  </li>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Collaboration/">Collaboration</a></li>
+
  <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Members/'><span>Team</span></a>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/Events/">Events</a></li>
+
      <ul>
-
    <li class="button"><a href="/Team:CSU_Fort_Collins/GMO/">GMO Outreach</a></li>
+
        <li><a href='/Team:CSU_Fort_Collins/Members/'><span>Members</span></a></li>
-
    </ul>
+
        <li class='last'><a href='/Team:CSU_Fort_Collins/Sponsors/'><span>Sponsors</span></a></li>
-
<li class="button"><a href="/Team:CSU_Fort_Collins/Safety/">Safety</a></li>
+
      </ul>
-
<li class="button"><a href="https://2014.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/igem.org/6/60/Igemlogo_300px.png" style="height:50px"/></a></li>
+
  </li>
 +
  <li class='has-sub' class='active'><a href='/Team:CSU_Fort_Collins/Notebook/'><span>Notebook</span></a>
 +
    <ul style="display:block">
 +
      <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/Protocols'><span>Protocols</span></a>
 +
        <ul>
 +
          <li><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Gibson"><span>Gibson Assembly</span></a></li>
 +
          <li><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Cloning"><span>Cloning Genes</span></a></li>
 +
          <li><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Miniprep"><span>Plasmid Miniprep</span></a></li>
 +
          <li><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Isolation"><span>Yeast DNA Isolation</span></a></li>
 +
          <li><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Gel"><span>Gel Electrophoresis</span></a></li>
 +
          <li class='last'><a href="/Team:CSU_Fort_Collins/Notebook/Protocols=Purify"><span>PCR Product Purification</span></a></li>
 +
        </ul>
 +
      </li>
 +
      <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/DailyNotes'><span>Daily Notes</span></a>
 +
        <ul>
 +
        <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/Biosensor/'><span>Biosensor</span></a>
 +
            <ul>
 +
              <li><a href="#"><span>June</span></a></li>
 +
              <li><a href="#"><span>July</span></a></li>
 +
              <li><a href='#'><span>August</span></a></li>
 +
              <li class='last'><a href="#"><span>September</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/Breakdown/'><span>Breakdown</span></a>
 +
            <ul>
 +
              <li><a href="#"><span>July</span></a></li>
 +
              <li><a href='#'><span>August</span></a></li>
 +
              <li class='last'><a href="#"><span>September</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/HVP/'><span>High-Value Product</span></a>
 +
            <ul>
 +
              <li><a href="#"><span>June</span></a></li>
 +
              <li><a href="#"><span>July</span></a></li>
 +
              <li><a href='#'><span>August</span></a></li>
 +
              <li class='last'><a href="#"><span>September</span></a></li>
 +
            </ul>
 +
        </li>
 +
        <li li class='has-sub'><a href='/Team:CSU_Fort_Collins/Notebook/KillSwitch/'><span>Kill Switch</span></a>
 +
            <ul>
 +
              <li><a href="#"><span>July</span></a></li>
 +
              <li><a href='#'><span>August</span></a></li>
 +
              <li class='last'><a href="#"><span>September</span></a></li>
 +
            </ul>
 +
        </li>
 +
      </ul>
 +
  </li>
 +
  </ul>
 +
  </li>
 +
  <li class='has-sub'><a href='/Team:CSU_Fort_Collins/HumPrac/'><span>Human Practices</span></a>
 +
      <ul>
 +
        <li><a href='/Team:CSU_Fort_Collins/Collab/'><span>Collaboration</span></a></li>
 +
        <li class='last'><a href='/Team:CSU_Fort_Collins/Outreach/'><span>Outreach</span></a></li>
 +
      </ul>
 +
  </li>
 +
  <li class='has-sub'><a href='/Team:CSU_Fort_Collins/Achievements/'><span>Achievements</span></a>
 +
      <ul>
 +
        <li><a href='/Team:CSU_Fort_Collins/Parts/'><span>Parts</span></a></li>
 +
        <li class='last'><a href='/Team:CSU_Fort_Collins/Judging/'><span>Judging</span></a></li>
 +
      </ul>
 +
  </li>
 +
  <li><a href='/Team:CSU_Fort_Collins/Safety/'><span>Safety</span></a></li>
</ul>
</ul>
 +
</div>
-
<br>
+
 
-
<br>
+
 
 +
<div class="clear"></div>
 +
 
 +
<div class='wrapper'>
 +
  <center>
 +
    <h1>Outreach</h1>
 +
 
 +
    <div class="container">
 +
      <h3>Mission</h3>
 +
 
 +
CSU iGEM (and our counterpart of which all iGEM members are a part of, CSU Synthetic Biology Club) are dedicated to representing Colorado State University, iGEM, and Synthetic Biology in our community. This includes participating in student organization fairs, outreach events, and collaboration with other teams. Below are highlights of particular activities we did to help get the word out about undergraduate research, synthetic biology, and science in general.
 +
 
 +
      <h3>Putnam Elementary School</h3>
 +
 
 +
      Putnam Elementary School hosts a science club for 2nd and 3rd graders on weekday afternoons; for two of these meetings, members from CSU iGEM came to conduct experiments and encourage students to learn the scientific method. For the first experiment, the students discussed locations where they thought the most germs would be in the classroom. Then, they wrote a hypothesis about which locations in the school would have the most germs. Then each student swabbed two locations in the school - either outside, in the restroom, or in the classroom - and CSU students helped them to plate their samples on TSA (general media) plates. The plates were then incubated for one week at room temperature.
 +
The second week, students observed the results of their experiments, and learned about different kinds of growth. Additionally, we discussed proper handwashing and how to avoid sickness. We had each student cover their hands in GloGerm - a lotion-like agent which causes germs to fluoresce under UV light. Then they observed their hands before and after washing them to see the difference.
 +
 
 +
 
 +
<h3>Engineering Exploration Days</h3>
 +
CSU College of Engineering annually hosts a day to encourage students who are undeclared in engineering discover which discipline they would like to pursue at CSU. As part of this event, CSU iGEM gave a lab tour and discussed the undergraduate research opportunities available.
 +
 
 +
    </div>
 +
 
 +
  </center>
</div>
</div>
-
</center>
+
 
 +
 
 +
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
 +
<script type='text/javascript'>
 +
  $('#cssmenu').prepend('<div id="indicatorContainer"><div id="pIndicator"><div id="cIndicator"></div></div></div>');
 +
      var activeElement = $('#cssmenu>ul>li:first');
 +
 
 +
      $('#cssmenu>ul>li').each(function() {
 +
          if ($(this).hasClass('active')) {
 +
              activeElement = $(this);
 +
          }
 +
      });
 +
 
 +
 
 +
    var posLeft = activeElement.position().left;
 +
    var elementWidth = activeElement.width();
 +
    posLeft = posLeft + elementWidth/2 -6;
 +
    if (activeElement.hasClass('has-sub')) {
 +
      posLeft -= 6;
 +
    }
 +
 
 +
    $('#cssmenu #pIndicator').css('left', posLeft);
 +
    var element, leftPos, indicator = $('#cssmenu pIndicator');
 +
   
 +
    $("#cssmenu>ul>li").hover(function() {
 +
          element = $(this);
 +
          var w = element.width();
 +
          if ($(this).hasClass('has-sub'))
 +
          {
 +
            leftPos = element.position().left + w/2 - 12;
 +
          }
 +
          else {
 +
            leftPos = element.position().left + w/2 - 6;
 +
          }
 +
 
 +
          $('#cssmenu #pIndicator').css('left', leftPos);
 +
      }
 +
      , function() {
 +
        $('#cssmenu #pIndicator').css('left', posLeft);
 +
      });
 +
 
 +
    $('#cssmenu>ul').prepend('<li id="menu-button"><a>Menu</a></li>');
 +
    $( "#menu-button" ).click(function(){
 +
          if ($(this).parent().hasClass('open')) {
 +
            $(this).parent().removeClass('open');
 +
          }
 +
          else {
 +
            $(this).parent().addClass('open');
 +
          }
 +
        });
 +
</script>
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
    $(document).on('click', '.show', function(){
 +
          $('.toc').show(100);
 +
          $('.show').hide();
 +
    });
 +
    $(document).on('click', '.hide', function(){
 +
          $('.toc').hide();
 +
          $('.show').show(100);
 +
    });
 +
});
 +
</script>
 +
<script type='text/javascript'>
 +
  $(document).ready(function() {
 +
 
 +
    //Calculate the height of <header>
 +
    //Use outerHeight() instead of height() if have padding
 +
    var aboveHeight = $('#banner').height();
 +
 
 +
//when scroll
 +
    $(window).scroll(function(){
 +
 
 +
        //if scrolled down more than the header’s height
 +
            if ( $(window).scrollTop() > aboveHeight ){
 +
 
 +
        // if yes, add “fixed” class to the <nav>
 +
        // add padding top to the #content
 +
            //(value is same as the height of the nav)
 +
            $('#cssmenu').addClass('fixed').next().css('padding-top','44');
 +
           
 +
 
 +
            } else {
 +
 
 +
        // when scroll up or less than aboveHeight,
 +
            //remove the “fixed” class, and the padding-top
 +
            $('#cssmenu').removeClass('fixed').next().css('padding-top','0');
 +
         
 +
            }
 +
 
 +
            if ( $(window).scrollTop() > aboveHeight-14 ){
 +
              $('#top-section').addClass('disp');
 +
            } else{
 +
            $('#top-section').removeClass('disp');
 +
            }
 +
        });
 +
    });
 +
 
 +
</script>
 +
 
</body>
</body>
 +
</html>
</html>

Revision as of 21:17, 12 October 2014

CSU iGEM 2014

Outreach

Mission

CSU iGEM (and our counterpart of which all iGEM members are a part of, CSU Synthetic Biology Club) are dedicated to representing Colorado State University, iGEM, and Synthetic Biology in our community. This includes participating in student organization fairs, outreach events, and collaboration with other teams. Below are highlights of particular activities we did to help get the word out about undergraduate research, synthetic biology, and science in general.

Putnam Elementary School

Putnam Elementary School hosts a science club for 2nd and 3rd graders on weekday afternoons; for two of these meetings, members from CSU iGEM came to conduct experiments and encourage students to learn the scientific method. For the first experiment, the students discussed locations where they thought the most germs would be in the classroom. Then, they wrote a hypothesis about which locations in the school would have the most germs. Then each student swabbed two locations in the school - either outside, in the restroom, or in the classroom - and CSU students helped them to plate their samples on TSA (general media) plates. The plates were then incubated for one week at room temperature. The second week, students observed the results of their experiments, and learned about different kinds of growth. Additionally, we discussed proper handwashing and how to avoid sickness. We had each student cover their hands in GloGerm - a lotion-like agent which causes germs to fluoresce under UV light. Then they observed their hands before and after washing them to see the difference.

Engineering Exploration Days

CSU College of Engineering annually hosts a day to encourage students who are undeclared in engineering discover which discipline they would like to pursue at CSU. As part of this event, CSU iGEM gave a lab tour and discussed the undergraduate research opportunities available.

Retrieved from "http://2014.igem.org/Team:CSU_Fort_Collins/Outreach/"