Difference between revisions of "Team:NAIT Edmonton/Trial11"
| Line 6: | Line 6: | ||
<title>Team NAIT 2015</title> | <title>Team NAIT 2015</title> | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'> | <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'> | ||
| Line 128: | Line 116: | ||
<div id="wrap"> | <div id="wrap"> | ||
| − | <div | + | <style type="text/css"> |
| − | + | ||
| − | + | /*Define Accordion box*/ | |
| − | + | ||
| − | + | ||
| − | + | .accordion { width:830px; overflow:hidden; margin:10px auto; color:#474747; background:#414141; padding:10px; } | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | /*General Accordion****************************************************************************/ | |
| − | + | ||
| − | + | /*Set style of open slide*/ | |
| − | + | ||
| − | + | ||
| − | + | .accordion section:target { background:#FFF; padding:10px;} | |
| − | + | ||
| − | + | .accordion section:target:hover { background:#FFF; } | |
| − | + | ||
| − | + | .accordion section:target h2 {width:100%;} | |
| − | + | ||
| − | + | .accordion section:target h2 a{ color:#333; padding:0;} | |
| − | + | ||
| − | + | .accordion section:target p {display:block;} | |
| − | + | ||
| − | + | .accordion section h2 a{padding:8px 10px;display:block; font-size:16px; font-weight:normal;color:#eee; text-decoration:none; } | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | /*set style of closed slide*/ | |
| − | + | ||
| − | + | .accordion section{ float:left; overflow:hidden; color:#333; cursor:pointer; background: #333; margin:3px; } | |
| − | + | ||
| − | + | .accordion section:hover {background:#444;} | |
| − | + | ||
| − | + | .accordion section p { display:none; } | |
| − | + | ||
| − | + | .accordion section:after{position:relative;font-size:24px;color:#000;font-weight:bold;} | |
| − | + | ||
| − | + | .accordion section:nth-child(1):after{content:'1';} | |
| − | + | .accordion section:nth-child(2):after{content:'2';} | |
| − | + | ||
| − | + | .accordion section:nth-child(3):after{content:'3';} | |
| − | + | .accordion section:nth-child(4):after{content:'4';} | |
| − | + | ||
| − | + | .accordion section:nth-child(5):after{content:'5';} | |
| − | + | ||
| − | + | ||
| − | </div> | + | /*End General Accordion****************************************************************************/ |
| + | |||
| + | |||
| + | |||
| + | |||
| + | /*Vertical Accordion *************************************************************************/ | ||
| + | |||
| + | |||
| + | .vertical section{ width:100%; height:40px; | ||
| + | -webkit-transition:height 0.2s ease-out; | ||
| + | -moz-transition:height 0.2s ease-out; | ||
| + | -o-transition:height 0.2s ease-out; | ||
| + | -ms-transition:height 0.2s ease-out; | ||
| + | transition:height 0.2s ease-out; | ||
| + | } | ||
| + | |||
| + | |||
| + | /*Set height of the slide*/ | ||
| + | |||
| + | .vertical :target{ height:250px; width:97%; } | ||
| + | |||
| + | |||
| + | .vertical section h2 { position:relative; left:0; top:-15px; } | ||
| + | |||
| + | |||
| + | |||
| + | /*Set position of the number on the slide*/ | ||
| + | |||
| + | |||
| + | .vertical section:after{ top:-60px;left:810px;} | ||
| + | |||
| + | .vertical section:target:after{ left:-9999px;} | ||
| + | |||
| + | |||
| + | </style> | ||
| + | |||
| + | <div class="accordion vertical"> | ||
| + | <section id="vertabout"> | ||
| + | <h2><a href="#vertabout">About Us</a></h2> | ||
| + | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.</p> | ||
| + | </section> | ||
| + | <section id="vertservices"> | ||
| + | <h2><a href="#vertservices">Services</a></h2> | ||
| + | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.</p> | ||
| + | </section> | ||
| + | <section id="vertblog"> | ||
| + | <h2><a href="#vertblog">Blog</a></h2> | ||
| + | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.</p> | ||
| + | </section> | ||
| + | <section id="vertportfolio"> | ||
| + | <h2><a href="#vertportfolio">Portfolio</a></h2> | ||
| + | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.</p> | ||
| + | </section> | ||
| + | <section id="vertcontact"> | ||
| + | <h2><a href="#vertcontact">Contact</a></h2> | ||
| + | <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.</p> | ||
| + | </section> | ||
| + | </div> | ||
| + | |||
Revision as of 17:23, 30 July 2015
About Us
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.
Services
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.
Blog
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.
Portfolio
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.
Contact
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse id lobortis massa. Nunc viverra velit leo, sit amet elementum mi. Fusce posuere nunc a mi tempus malesuada. Curabitur facilisis rhoncus eros eget placerat. Aliquam semper mauris sit amet justo tempor nec lacinia magna molestie. Etiam placerat congue dolor vitae adipiscing. Aliquam ac erat lorem, ut iaculis justo. Etiam mattis dignissim gravida. Aliquam nec justo ante, non semper mi. Nulla consectetur interdum massa, vel porta enim vulputate sed. Maecenas elit quam, egestas eget placerat non, fringilla vel eros. Nam vehicula elementum nulla sed consequat. Phasellus eu erat enim. Praesent at magna non massa dapibus scelerisque in eu lorem.
Background
The structural and functional study of the proteins expressed by a genome is called proteomics. This relatively novel science uses different methodologies in order to separate and identify specific proteins of interest. Among these techniques, SDS-PAGE plays an essential role due to its high sensitivity, low sample volume requirement, and high popularity. Negatively charged proteins migrate towards the positive electrode according to their size and charge. Smaller proteins migrate further in a given amount of time. As proteins are separated in this manner, users load molecular weight standards to estimate the size (in kDa) of the proteins present in their sample. Once the proteins of a single sample have been isolated and are embedded in the polyacrylamide (PA) gel matrix, staining procedures are used to visualize them.
Organic dyes, such as Coomassie blue, can be used for this purpose; nevertheless, their low sensitivity and a detection range that goes from 1 to 50 ng can be a challenge for detecting low abundance proteins (Jin, Huang, Yoo, & Choi, 2006). A higher sensitivity can be achieved by fluorescent staining techniques (from 0.1 to 10 ng.); however, UV instruments are necessary in order to read the data (Jin et al., 2006). The most sensitive method up to date is radiolabeling, but the requirement of hazardous isotopes and their complex management makes it a complicated procedure (Jin et al., 2006). Silver staining is a method that offers great sensitivity and an easy to handle protocol, thus making it one of the most commonly used staining methods.
The Problem
Difficulties with silver staining arise when the molecular weight markers are re- colored golden-brown in the staining process. Markers offer evenly distributed proteins that show bands of equal intensity and known size. Researchers can compare these bands with their sample and identify the protein they are looking for based on its size. A subset of these markers has color-coded standard proteins to facilitate the identification of each band. Post-silver staining, the users lose the ability to use the color code as a reference.
