Team:Cornell/project/drylab/functional requirements

From 2012.igem.org

(Difference between revisions)
 
(17 intermediate revisions not shown)
Line 1: Line 1:
-
/* --------------------------------------------------
+
{{:Team:Cornell/templates/header}} <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
-
Table of Contents
+
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
-
-----------------------------------------------------
+
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
-
::iGEM Reset
+
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
-
::Fonts and Icons
+
<!--[if gt IE 8]><!-->
-
::Shared Styles
+
<html class="no-js" lang="en">
-
::Header & Footer
+
<!--<![endif]-->
-
::Homepage
+
<div class="row">
-
*/
+
<div class="two columns">
 +
<ul class="side-nav">
 +
<li>
 +
<h6>Dry Lab</h6>
 +
</li>
 +
<li class="divider"></li>
-
/* -----------------------------------------
+
<li>
-
iGEM Reset
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab">How It Works</a>
-
----------------------------------------- */
+
</li>
-
#globalWrapper {
+
<li class ="active">
-
background-color: transparent;
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab/functional_requirements">Functional Requirements</a>
-
border: none;
+
</li>
-
margin: 0;
+
<li>
-
padding: 0;
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab/components">Components</a>
-
width: 100%;
+
</li>
-
height: 100%;
+
<li>
-
}
+
Modeling
-
#content {
+
<ul>
-
background-color: transparent;
+
<li>
-
border: none;
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab/modeling/deployment">Deployment</a>
-
padding: 0;
+
</li>
-
margin: 0;
+
<li>
-
width: 100%;
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab/modeling/time_response">Time Response</a>
-
overflow: visible;
+
</li>
-
height: 100%;
+
</ul>
-
}
+
</li>
-
#bodyContent {
+
<li>
-
border: none;
+
<a href="https://2012.igem.org/Team:Cornell/project/drylab/status">Device Status</a>
-
padding: 0;
+
</li>
-
margin: 0;
+
-
width: 100%;
+
</ul>
-
height: 100%;
+
</div>
-
}
+
<div class="ten columns team-bios-container">
-
#top-section {
+
<div class="row">
-
height: 15px;
+
<div class="twelve columns">
-
margin: 0px;
+
<h2 class="centered">Functional Requirements</h2>
-
margin-left: auto;
+
</div>
-
margin-right: auto;
+
</div>
-
margin-bottom: 0 !important;
+
<div>
-
padding: 0;
+
<b>Scroll over each icon to find out more about the functional requirements for our device!</b>
-
border: none;
+
</div>
-
font-size: 10px;
+
<div class="row last-ele overflow">
-
}
+
<div class="eight columns centered overflow" style="position:relative;">
-
#p-logo {
+
<img class="inline" src="https://static.igem.org/mediawiki/2012/6/67/Charmander_hexagon.png">
-
height: 1px;
+
<div class="func-rec-position" style="position:absolute;right:90px;top:50px;">
-
overflow: hidden;
+
<div class="func-req-hover" >
-
display: none;
+
<img src="https://static.igem.org/mediawiki/2012/0/09/Charmander_continuous.png">
-
}
+
</div>
-
#search-controls {
+
<div class="func-req-desc">
-
overflow: hidden;
+
<h5>Continuous</h5>
-
display: block;
+
Pollution events can be hard to spot, making discrete testing inadequate as well as expensive. Monitoring water quality is a 24 hour job.
-
background: none;
+
</div>
-
position: absolute;
+
</div>
-
top: 100px;
+
<div class="func-rec-position" style="position:absolute;right:-33px;top:272px;">
-
right: 40px;
+
<div class="func-req-hover" >
-
}
+
<img src="https://static.igem.org/mediawiki/2012/2/2a/Charmander_field-deployable.png">
-
.left-menu {
+
</div>
-
width: 500px !important;
+
<div class="func-req-desc">
-
display: block;
+
<h5>Field Deployable</h5>
-
margin-top: -80px;
+
Industrial water monitoring is needed in remote and rugged terrain. In order to be applicable in these terrains, our device should be durable, water-proof. Being out in the field also means all food for bacteria and power for electronics must be provided by the device itself.
-
border: none;
+
</div>
-
text-align: right;
+
</div>
-
}
+
<div class="func-rec-position" style="position:absolute;right:90px;bottom:25px;">
-
.left-menu ul {
+
<div class="func-req-hover" >
-
border: none;
+
<img src="https://static.igem.org/mediawiki/2012/e/ea/Charmander_remote.png">
-
}
+
</div>
-
#menubar.right-menu {
+
<div class="func-req-desc">
-
display: block;
+
<h5>Remote</h5>
-
width: 300px;
+
To collect data in isolated locations, wireless communication is essential. This requires digital conversion of signals from our bacteria, so that it can be transmitted to the user and accessed online.  
-
float: left;
+
</div>
-
margin-top: 2px;
+
</div>
-
margin-right: 0px;
+
<div class="func-rec-position" style="position:absolute;left:90px;bottom:25px;">
-
border: none;
+
<div class="func-req-hover" >
-
}
+
<img src="https://static.igem.org/mediawiki/2012/1/14/Charmander_electrical-output.png">
-
.right-menu ul {
+
</div>
-
width: 300px;
+
<div class="func-req-desc">
-
margin: 0px;
+
<h5>Electrical Output</h5>
-
visibility: hidden;
+
Our device needs to output signal that is practical and intuitive. Electrical signal is easy to sense, process, and convert to digital signal. </div>
-
}
+
</div>
-
.right-menu ul li a {
+
<div class="func-rec-position" style="position:absolute;left:-35px;top:272px;">
-
background: none;
+
<div class="func-req-hover" >
-
color: #666;
+
<img src="https://static.igem.org/mediawiki/2012/b/bb/Charmander_long-term.png">
-
}
+
</div>
-
.right-menu:hover ul {
+
<div class="func-req-desc">
-
visibility: visible;
+
<h5>Long Term</h5>
-
}
+
To monitor water quality in a truly continuous fashion, our device must be able to sustain itself without maintenance for long periods of time. Frequent maintenance is impractical.
-
#footer-box {
+
</div>
-
width: 100%;
+
</div>
-
margin: -10px auto 0 auto;
+
<div class="func-rec-position" style="position:absolute;left:90px;top:50px;">
-
padding: 20px 0;
+
<div class="func-req-hover" >
-
}
+
<img src="https://static.igem.org/mediawiki/2012/f/f0/Charmander_safe.png">
-
.visualClear {
+
</div>
-
display: none;
+
<div class="func-req-desc">
-
}
+
<h5>Safe</h5>
-
#footer {
+
Releasing modified organisms into the environment is a threat to both human health and biodiversity. To be field-deployable, our device must integrate multiple safeguards against escape and gene transfer.
-
border: none;
+
</div>
-
width: 965px;
+
</div>
-
margin: 0 auto;
+
</div>
-
padding: 0;
+
</div>
-
}
+
</div>
-
.firstHeading {
+
</div>
-
display: none;
+
</div>
-
}
+
-
#f-list a {
+
-
color: #333;
+
-
font-size: 10px;
+
-
}
+
-
#f-list a:hover {
+
-
color: #666;
+
-
}
+
-
.printfooter {
+
-
display: none;
+
-
}
+
-
#footer ul {
+
-
margin: 0;
+
-
padding: 0;
+
-
}
+
-
#footer ul li {
+
-
margin-top: 0;
+
-
margin-bottom: 0;
+
-
margin-left: 10px;
+
-
margin-right: 10px;
+
-
padding: 0;
+
-
}
+
-
#search-controls {
+
-
display: none;
+
-
}
+
-
h3#siteSub {
+
-
display: none;
+
-
}
+
-
#contentSub {
+
-
display: none;
+
-
}
+
-
p:first-child {
+
-
display: none;
+
-
}
+
-
#catlinks {
+
-
display: none;
+
-
}
+
-
#footer-box {
+
-
width: 977px;
+
-
margin-bottom: 20px;
+
-
}
+
-
/* -----------------------------------------
+
<script src="https://2012.igem.org/Team:Cornell/javascripts/foundation.min?action=raw&amp;ctype=text/javascript"></script>
-
Fonts and Icons
+
<script src="https://2012.igem.org/Team:Cornell/javascripts/app?action=raw&amp;ctype=text/javascript"></script>
-
----------------------------------------- */
+
<script src="https://2012.igem.org/Team:Cornell/javascripts/lightbox?action=raw&amp;ctype=text/javascript"></script>
-
 
+
<script type="text/javascript">
-
@font-face {
+
$(window).load(function() {
-
font-family: 'Foro-LightRegular';
+
$('li.pg-project_drylab').addClass('active');
-
src: url('https://dl.dropbox.com/u/3824307/iGEM/fonts/forolig-webfont.eot');
+
});
-
src: url('https://dl.dropbox.com/u/3824307/iGEM/fonts/forolig-webfont.eot?#iefix') format('embedded-opentype'), url('https://dl.dropbox.com/u/3824307/iGEM/fonts/forolig-webfont.woff') format('woff'), url('https://dl.dropbox.com/u/3824307/iGEM/fonts/forolig-webfont.ttf') format('truetype'), url('https://dl.dropbox.com/u/3824307/iGEM/fonts/forolig-webfont.svg#Foro-LightRegular') format('svg');
+
</script>
-
font-weight: normal;
+
</body>
-
font-style: normal;
+
</html>
-
}
+
-
 
+
-
@font-face {
+
-
font-family: 'Droid Sans';
+
-
font-style: normal;
+
-
font-weight: 400;
+
-
src: local('Droid Sans'), local('DroidSans'), url(http://themes.googleusercontent.com/static/fonts/droidsans/v3/s-BiyweUPV0v-yRb-cjciBsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
+
-
}
+
-
 
+
-
@font-face {
+
-
font-family: 'Droid Sans';
+
-
font-style: normal;
+
-
font-weight: 700;
+
-
src: local('Droid Sans Bold'), local('DroidSans-Bold'), url(http://themes.googleusercontent.com/static/fonts/droidsans/v3/EFpQQyG9GqCrobXxL-KRMQFhaRv2pGgT5Kf0An0s4MM.woff) format('woff');
+
-
}
+
-
/* -----------------------------------------
+
-
Lightbox
+
-
----------------------------------------- */
+
-
/* line 6, ../sass/lightbox.sass */
+
-
#lightboxOverlay {
+
-
position: absolute;
+
-
top: 0;
+
-
left: 0;
+
-
z-index: 9999;
+
-
background-color: black;
+
-
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
+
-
opacity: 0.85;
+
-
display: none;
+
-
}
+
-
 
+
-
/* line 15, ../sass/lightbox.sass */
+
-
#lightbox {
+
-
position: absolute;
+
-
left: 0;
+
-
width: 100%;
+
-
z-index: 10000;
+
-
text-align: center;
+
-
line-height: 0;
+
-
font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
+
-
font-weight: normal;
+
-
}
+
-
/* line 24, ../sass/lightbox.sass */
+
-
#lightbox img {
+
-
width: auto;
+
-
height: auto;
+
-
}
+
-
/* line 27, ../sass/lightbox.sass */
+
-
#lightbox a img {
+
-
border: none;
+
-
}
+
-
 
+
-
/* line 30, ../sass/lightbox.sass */
+
-
.lb-outerContainer {
+
-
position: relative;
+
-
background-color: white;
+
-
*zoom: 1;
+
-
width: 250px;
+
-
height: 250px;
+
-
margin: 0 auto;
+
-
-webkit-border-radius: 4px;
+
-
-moz-border-radius: 4px;
+
-
-ms-border-radius: 4px;
+
-
-o-border-radius: 4px;
+
-
border-radius: 4px;
+
-
}
+
-
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
+
-
.lb-outerContainer:after {
+
-
content: "";
+
-
display: table;
+
-
clear: both;
+
-
}
+
-
 
+
-
/* line 39, ../sass/lightbox.sass */
+
-
.lb-container {
+
-
padding: 10px;
+
-
}
+
-
 
+
-
/* line 42, ../sass/lightbox.sass */
+
-
.lb-loader {
+
-
position: absolute;
+
-
top: 40%;
+
-
left: 0%;
+
-
height: 25%;
+
-
width: 100%;
+
-
text-align: center;
+
-
line-height: 0;
+
-
}
+
-
 
+
-
/* line 51, ../sass/lightbox.sass */
+
-
.lb-nav {
+
-
position: absolute;
+
-
top: 0;
+
-
left: 0;
+
-
height: 100%;
+
-
width: 100%;
+
-
z-index: 10;
+
-
}
+
-
 
+
-
/* line 59, ../sass/lightbox.sass */
+
-
.lb-container > .nav {
+
-
left: 0;
+
-
}
+
-
 
+
-
/* line 62, ../sass/lightbox.sass */
+
-
.lb-nav a {
+
-
outline: none;
+
-
}
+
-
 
+
-
/* line 65, ../sass/lightbox.sass */
+
-
.lb-prev, .lb-next {
+
-
width: 49%;
+
-
height: 100%;
+
-
background-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
+
-
/* Trick IE into showing hover */
+
-
display: block;
+
-
}
+
-
 
+
-
/* line 72, ../sass/lightbox.sass */
+
-
.lb-prev {
+
-
left: 0;
+
-
float: left;
+
-
}
+
-
 
+
-
/* line 76, ../sass/lightbox.sass */
+
-
.lb-next {
+
-
right: 0;
+
-
float: right;
+
-
}
+
-
 
+
-
/* line 81, ../sass/lightbox.sass */
+
-
.lb-prev:hover {
+
-
background: url(https://static.igem.org/mediawiki/2012/3/33/Ucl2012-lightbox-Prev.png) left 48% no-repeat;
+
-
}
+
-
 
+
-
/* line 85, ../sass/lightbox.sass */
+
-
.lb-next:hover {
+
-
background: url(https://static.igem.org/mediawiki/2012/4/4c/Ucl2012-lightbox-Next.png) right 48% no-repeat;
+
-
}
+
-
 
+
-
/* line 88, ../sass/lightbox.sass */
+
-
.lb-dataContainer {
+
-
margin: 0 auto;
+
-
padding-top: 5px;
+
-
*zoom: 1;
+
-
width: 100%;
+
-
-moz-border-radius-bottomleft: 4px;
+
-
-webkit-border-bottom-left-radius: 4px;
+
-
-ms-border-bottom-left-radius: 4px;
+
-
-o-border-bottom-left-radius: 4px;
+
-
border-bottom-left-radius: 4px;
+
-
-moz-border-radius-bottomright: 4px;
+
-
-webkit-border-bottom-right-radius: 4px;
+
-
-ms-border-bottom-right-radius: 4px;
+
-
-o-border-bottom-right-radius: 4px;
+
-
border-bottom-right-radius: 4px;
+
-
}
+
-
/* line 38, ../../../../.rvm/gems/ruby-1.9.2-p290/gems/compass-0.12.1/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
+
-
.lb-dataContainer:after {
+
-
content: "";
+
-
display: table;
+
-
clear: both;
+
-
}
+
-
 
+
-
/* line 95, ../sass/lightbox.sass */
+
-
.lb-data {
+
-
padding: 0 10px;
+
-
color: #bbbbbb;
+
-
}
+
-
/* line 98, ../sass/lightbox.sass */
+
-
.lb-data .lb-details {
+
-
width: 85%;
+
-
float: left;
+
-
text-align: left;
+
-
line-height: 1.1em;
+
-
}
+
-
/* line 103, ../sass/lightbox.sass */
+
-
.lb-data .lb-caption {
+
-
font-size: 13px;
+
-
font-weight: bold;
+
-
line-height: 1em;
+
-
}
+
-
/* line 107, ../sass/lightbox.sass */
+
-
.lb-data .lb-number {
+
-
display: block;
+
-
clear: left;
+
-
padding-bottom: 1em;
+
-
font-size: 11px;
+
-
}
+
-
/* line 112, ../sass/lightbox.sass */
+
-
.lb-data .lb-close {
+
-
width: 35px;
+
-
float: right;
+
-
padding-bottom: 0.7em;
+
-
outline: none;
+
-
}
+
-
/* line 117, ../sass/lightbox.sass */
+
-
.lb-data .lb-close:hover {
+
-
cursor: pointer;
+
-
}
+
-
 
+
-
/* -----------------------------------------
+
-
Shared Styles
+
-
----------------------------------------- */
+
-
 
+
-
body {
+
-
background: #f2f2f2;
+
-
font-family: 'Droid Sans', Helvetica, sans-serif;
+
-
font-size: 15px;
+
-
line-height: 23px;
+
-
}
+
-
 
+
-
h1, h2, h3, h4, h5, h6 {
+
-
font-family: 'Foro-LightRegular', serif;
+
-
color: #000;
+
-
border-bottom: none;
+
-
margin-bottom: none;
+
-
}
+
-
 
+
-
h1.centered, h2.centered, h3.centered, h4.centered, h5.centered, h6.centered {
+
-
text-align: center;
+
-
}
+
-
 
+
-
div.clearfix {
+
-
content: ".";
+
-
display: block;
+
-
clear: both;
+
-
visibility: hidden;
+
-
line-height: 0;
+
-
height: 0;
+
-
}
+
-
 
+
-
div.twelve.columns.no-pad {
+
-
padding: 0px;
+
-
}
+
-
 
+
-
.off-canvas {
+
-
width: 100%;
+
-
}
+
-
 
+
-
a, a:visited {
+
-
color: #b31b1b;
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
a:hover {
+
-
color: #871414;
+
-
text-decoration: none;
+
-
}
+
-
 
+
-
.button {
+
-
background: #b31b1b;
+
-
border: 1px solid #691010;
+
-
color: #fff;
+
-
}
+
-
 
+
-
a.button, a.button:hover {
+
-
color: #fff;
+
-
}
+
-
 
+
-
.button:hover {
+
-
background-color: #871414;
+
-
}
+
-
 
+
-
.button:focus {
+
-
-webkit-box-shadow: 0 0 4px #b31b1b, 0 1px 0 rgba(255,255,255,0.5) inset;
+
-
-moz-box-shadow: 0 0 4px #b31b1b, 0 1px 0 rgba(255,255,255,0.5) inset;
+
-
box-shadow: 0 0 4px #b31b1b, 0 1px 0 rgba(255,255,255,0.5) inset;
+
-
}
+
-
 
+
-
.nav-bar {
+
-
background: #b31b1b;
+
-
}
+
-
 
+
-
.nav-bar > li {
+
-
border: 1px solid #871414;
+
-
}
+
-
 
+
-
.nav-bar > li:last-child {
+
-
border-right: solid 1px #871414;
+
-
}
+
-
 
+
-
.nav-bar > li.active {
+
-
background: #4c0b0b;
+
-
border-color: #4c0b0b;
+
-
}
+
-
 
+
-
.nav-bar > li.active:hover {
+
-
background: #4c0b0b;
+
-
}
+
-
 
+
-
.nav-bar > li:hover {
+
-
background: #871414;
+
-
}
+
-
 
+
-
.nav-bar a {
+
-
color: #f2f2f2;
+
-
}
+
-
 
+
-
ul.side-nav li.divider {
+
-
border-top: 1px solid #ddd;
+
-
}
+
-
 
+
-
dl.tabs.pill dd a {
+
-
background: #ddd;
+
-
color: #000;
+
-
}
+
-
 
+
-
dl.tabs.pill dd.active a {
+
-
background-color: #b31b1b;
+
-
color: #e6e6e6;
+
-
}
+
-
 
+
-
iframe.slides {
+
-
width: 577px;
+
-
height: 476px;
+
-
margin: 5px auto;
+
-
}
+
-
/* -----------------------------------------
+
-
Header & Footer
+
-
----------------------------------------- */
+
-
 
+
-
div.row.header {
+
-
background: #b31b1b;
+
-
margin: 0px auto 40px;
+
-
}
+
-
 
+
-
div#header-wrapper {
+
-
width: 940px;
+
-
margin: 0px auto;
+
-
}
+
-
 
+
-
div#logo-wrapper {
+
-
position: absolute;
+
-
top: -20px;
+
-
left: 0px;
+
-
background: green;
+
-
border: 10px solid #b31b1b;
+
-
height: 80px;
+
-
}
+
-
 
+
-
div#logo-wrapper img {
+
-
height: 60px;
+
-
}
+
-
 
+
-
div#igem-attr {
+
-
position: absolute;
+
-
top: -12px;
+
-
left: 147px;
+
-
height: 60px;
+
-
transition: transform 0.5s;
+
-
-moz-transition: -moz-transform 0.5s; /* Firefox 4 */
+
-
-webkit-transition: -webkit-transform 0.5s; /* Safari and Chrome */
+
-
-o-transition: -o-transform 0.5s; /* Opera */
+
-
}
+
-
 
+
-
div#igem-attr:hover {
+
-
transform: rotate(-15deg);
+
-
-ms-transform: rotate(-15deg); /* IE 9 */
+
-
-webkit-transform: rotate(-15deg); /* Safari and Chrome */
+
-
-o-transform: rotate(-15deg); /* Opera */
+
-
-moz-transform: rotate(-15deg); /* Firefox */
+
-
}
+
-
 
+
-
div#igem-attr img {
+
-
height: 60px;
+
-
}
+
-
 
+
-
div#header-wrapper .nav-bar {
+
-
float: right;
+
-
margin: 0px;
+
-
}
+
-
 
+
-
div.main-image > div {
+
-
padding: 0px;
+
-
}
+
-
 
+
-
a.gallery-button {
+
-
position: absolute;
+
-
right: 20px;
+
-
bottom: 10px;
+
-
}
+
-
 
+
-
div.missing {
+
-
margin: auto;
+
-
position: relative;
+
-
top: 50%;
+
-
width: 193px;
+
-
}
+
-
div.missing a {
+
-
height: 63px;
+
-
position: relative;
+
-
top: -31px;
+
-
}
+
-
div.missing img {
+
-
border-width: 0px;
+
-
}
+
-
div#unityPlayer {
+
-
cursor: default;
+
-
height: 600px;
+
-
width: 960px;
+
-
}
+
-
 
+
-
/* -----------------------------------------
+
-
Home Page
+
-
----------------------------------------- */
+
-
 
+
-
div#homepage-slideshow {
+
-
margin-bottom: 30px;
+
-
}
+
-
 
+
-
div.homepage-section {
+
-
padding: 10px;
+
-
}
+
-
 
+
-
div.homepage-force {
+
-
height: 174px;
+
-
}
+
-
 
+
-
div.controls {
+
-
position: absolute;
+
-
bottom: 0px;
+
-
}
+
-
 
+
-
div.controls a.button {
+
-
float: right;
+
-
}
+
-
 
+
-
div.homepage-section.tl {
+
-
border-bottom: 1px solid #ddd;
+
-
border-right: 1px solid #ddd;
+
-
padding-top: 0px;
+
-
padding-left: 0px;
+
-
}
+
-
 
+
-
div.homepage-section.tr {
+
-
border-bottom: 1px solid #ddd;
+
-
padding-top: 0px;
+
-
padding-right: 0px;
+
-
}
+
-
 
+
-
div.homepage-section.bl {
+
-
border-right: 1px solid #ddd;
+
-
padding-bottom: 0px;
+
-
padding-left: 0px;
+
-
}
+
-
 
+
-
div.homepage-section.br {
+
-
padding-bottom: 0px;
+
-
padding-right: 0px;
+
-
}
+
-
 
+
-
div.homepage-thumb {
+
-
margin-bottom: -6px;
+
-
}
+
-
 
+
-
div.sponsors-wrapper {
+
-
margin-top: 20px;
+
-
}
+
-
 
+
-
div.sponsors-wrapper ul {
+
-
padding: 5px 0px;
+
-
}
+
-
 
+
-
div.sponsors-wrapper ul li {
+
-
padding: 5px 10px;
+
-
display: inline-block;
+
-
list-style: none;
+
-
}
+
-
 
+
-
div.sponsors-wrapper ul li img {
+
-
height: 105px;
+
-
display: block;
+
-
margin: 5px auto;
+
-
}
+
-
 
+
-
/* -----------------------------------------
+
-
Team Page
+
-
----------------------------------------- */
+
-
 
+
-
div.team-bios-container div.row {
+
-
padding: 0px 0px 10px;
+
-
border-bottom: 1px solid #ddd;
+
-
}
+
-
 
+
-
div.team-bios-container div.last-ele {
+
-
border-bottom: none;
+
-
}
+
-
 
+
-
div.team-bios-container img {
+
-
max-height: 166px;
+
-
margin: 29px 0px;
+
-
}
+
-
 
+
-
div.team-bios-container img.inline {
+
-
max-height: none;
+
-
}
+
-
 
+
-
div#grd-members, div#fac-members {
+
-
margin-top: 80px;
+
-
}
+
-
 
+
-
div.bio-pic-container {
+
-
position: relative;
+
-
margin: 29px 0px;
+
-
height: 166px;
+
-
}
+
-
 
+
-
div.bio-pic-container img {
+
-
position: absolute;
+
-
margin: 0px;
+
-
top: 0px;
+
-
z-index: 2;
+
-
}
+
-
 
+
-
div.bio-pic-container img.bio-pic-bw {
+
-
z-index: 5;
+
-
}
+
-
/* -----------------------------------------
+
-
Notebook Page
+
-
----------------------------------------- */
+
-
 
+
-
ul.side-nav h6 {
+
-
margin: 47px 0px 0px;
+
-
}
+
-
 
+
-
ul.side-nav.ntbk-nav h6 {
+
-
margin: 87px 0px 0px;
+
-
}
+
-
 
+
-
table.check-off img {
+
-
height: 20px;
+
-
width: 20px;
+
-
margin: auto;
+
-
}
+
-
 
+
-
/* -----------------------------------------
+
-
Gallery Page
+
-
----------------------------------------- */
+
-
 
+
-
div.main-gallery ul {
+
-
list-style: none;
+
-
}
+
-
 
+
-
div.main-gallery ul li {
+
-
display: inline-block;
+
-
margin: 0px 5px;
+
-
}
+
-
 
+
-
div.main-gallery ul li img {
+
-
height: 80px;
+
-
margin: 0px;
+
-
}
+
-
 
+
-
/* -----------------------------------------
+
-
Hovery Things
+
-
----------------------------------------- */
+
-
 
+
-
div.overflow {
+
-
overflow: visible;
+
-
}
+
-
 
+
-
div.func-req-position {
+
-
position: absolute;
+
-
background: #e2e2e2;
+
-
border-radius: 300px;
+
-
width: 100px;
+
-
height: 100px;
+
-
background: #f2f2f2;
+
-
color: white;
+
-
opacity: 1;
+
-
}
+
-
 
+
-
div.func-req-hover {
+
-
width: 100px;
+
-
border-radius: 300px;
+
-
}
+
-
 
+
-
div.func-req-hover img {
+
-
height: 100px;
+
-
margin-top: -4px;
+
-
opacity: 0.5;
+
-
-webkit-transition: opacity 0.75s;
+
-
}
+
-
 
+
-
div.func-req-hover:hover img {
+
-
opacity: 1;
+
-
-webkit-transition: opacity 0.75s;
+
-
}
+
-
 
+
-
div.func-req-desc {
+
-
position: absolute;
+
-
left: -75px;
+
-
top: 100px;
+
-
width: 250px;
+
-
padding: 7px;
+
-
background: #1A1A1A;
+
-
border-radius: 5px;
+
-
color: white;
+
-
opacity: 0;
+
-
-webkit-transition: opacity 0.75s;
+
-
}
+
-
 
+
-
div.func-req-hover:hover + div.func-req-desc {
+
-
opacity: 1;
+
-
-webkit-transition: opacity 0.75s;
+
-
}
+
-
 
+
-
div.func-req-desc h5 {
+
-
text-align: center;
+
-
color: white;
+
-
}
+

Latest revision as of 03:21, 27 October 2012

Functional Requirements

Scroll over each icon to find out more about the functional requirements for our device!
Continuous
Pollution events can be hard to spot, making discrete testing inadequate as well as expensive. Monitoring water quality is a 24 hour job.
Field Deployable
Industrial water monitoring is needed in remote and rugged terrain. In order to be applicable in these terrains, our device should be durable, water-proof. Being out in the field also means all food for bacteria and power for electronics must be provided by the device itself.
Remote
To collect data in isolated locations, wireless communication is essential. This requires digital conversion of signals from our bacteria, so that it can be transmitted to the user and accessed online.
Electrical Output
Our device needs to output signal that is practical and intuitive. Electrical signal is easy to sense, process, and convert to digital signal.
Long Term
To monitor water quality in a truly continuous fashion, our device must be able to sustain itself without maintenance for long periods of time. Frequent maintenance is impractical.
Safe
Releasing modified organisms into the environment is a threat to both human health and biodiversity. To be field-deployable, our device must integrate multiple safeguards against escape and gene transfer.