Difference between revisions of "Team:UMaryland/protocols"
| Line 33: | Line 33: | ||
background-size: 1000% ; | background-size: 1000% ; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
| + | } | ||
| + | #sidemenu { | ||
| + | position:fixed; | ||
| + | float:left; | ||
| + | width: 135px; | ||
| + | top:200px; | ||
} | } | ||
| + | #sidemenu, | ||
| + | #sidemenu ul, | ||
| + | #sidemenu ul li, | ||
| + | #sidemenu ul li a { | ||
| + | margin: 0; | ||
| + | padding: 0; | ||
| + | border: 0; | ||
| + | list-style: none; | ||
| + | line-height: 1; | ||
| + | display: block; | ||
| + | -webkit-box-sizing: border-box; | ||
| + | -moz-box-sizing: border-box; | ||
| + | box-sizing: border-box; | ||
| + | } | ||
| + | |||
| + | #sidemenu ul ul { | ||
| + | display: none; | ||
| + | } | ||
| + | .align-right { | ||
| + | float: right; | ||
| + | } | ||
| + | #sidemenu > ul > li > a { | ||
| + | padding: 15px 20px; | ||
| + | border: 1px solid black; | ||
| + | cursor: pointer; | ||
| + | z-index: 2; | ||
| + | font-size: 14px; | ||
| + | font-weight: bold; | ||
| + | text-decoration: none; | ||
| + | color: #000000; | ||
| + | background-image: -webkit-linear-gradient(bottom, #ffffff 0%, #2BB1FF 100%); | ||
| + | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15); | ||
| + | } | ||
| + | |||
| + | #sidemenu > ul > li > a:hover, | ||
| + | #sidemenu > ul > li.active > a, | ||
| + | #sidemenu > ul > li.open > a { | ||
| + | color: #000000; | ||
| + | background-image: -webkit-linear-gradient(top, #C9C9C9 0%, #FFFFFF 100%); | ||
| + | } | ||
| + | #sidemenu > ul > li.open > a { | ||
| + | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.15); | ||
| + | border-bottom: 1px solid #1682ba; | ||
| + | } | ||
| + | |||
| + | |||
| + | #sidemenu > ul > li > a:hover > span::after, | ||
| + | #sidemenu > ul > li.active > a > span::after, | ||
| + | #sidemenu > ul > li.open > a > span::after { | ||
| + | border-color: #eeeeee; | ||
| + | } | ||
| + | .holder::before { | ||
| + | top: 18px; | ||
| + | border-top: 2px solid; | ||
| + | border-left: 2px solid; | ||
| + | border-top-color: inherit; | ||
| + | border-left-color: inherit; | ||
| + | } | ||
| + | #sidemenu ul ul li a { | ||
| + | cursor: pointer; | ||
| + | border-bottom: 1px solid #32373e; | ||
| + | border-left: 1px solid #32373e; | ||
| + | border-right: 1px solid #32373e; | ||
| + | padding: 10px 20px; | ||
| + | z-index: 1; | ||
| + | text-decoration: none; | ||
| + | font-size: 13px; | ||
| + | color: #eeeeee; | ||
| + | background: #49505a; | ||
| + | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); | ||
| + | } | ||
| + | #sidemenu ul ul li:hover > a, | ||
| + | #sidemenu ul ul li.open > a, | ||
| + | #sidemenu ul ul li.active > a { | ||
| + | background: #424852; | ||
| + | color: #ffffff; | ||
| + | } | ||
| + | #sidemenu ul ul li:first-child > a { | ||
| + | box-shadow: none; | ||
| + | } | ||
| + | #sidemenu ul ul ul li:first-child > a { | ||
| + | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); | ||
| + | } | ||
| + | #sidemenu ul ul ul li a { | ||
| + | padding-left: 30px; | ||
| + | } | ||
| + | #sidemenu > ul > li > ul > li:last-child > a, | ||
| + | #sidemenu > ul > li > ul > li.last > a { | ||
| + | border-bottom: 0; | ||
| + | } | ||
| + | #sidemenu > ul > li > ul > li.open:last-child > a, | ||
| + | #sidemenu > ul > li > ul > li.last.open > a { | ||
| + | border-bottom: 1px solid #32373e; | ||
| + | } | ||
| + | #sidemenu > ul > li > ul > li.open:last-child > ul > li:last-child > a { | ||
| + | border-bottom: 0; | ||
| + | } | ||
| + | #sidemenu ul ul li.has-sub > a::after { | ||
| + | display: block; | ||
| + | position: absolute; | ||
| + | content: ""; | ||
| + | width: 5px; | ||
| + | height: 5px; | ||
| + | right: 20px; | ||
| + | z-index: 10; | ||
| + | top: 11.5px; | ||
| + | border-top: 2px solid #eeeeee; | ||
| + | border-left: 2px solid #eeeeee; | ||
| + | -webkit-transform: rotate(-135deg); | ||
| + | -moz-transform: rotate(-135deg); | ||
| + | -ms-transform: rotate(-135deg); | ||
| + | -o-transform: rotate(-135deg); | ||
| + | transform: rotate(-135deg); | ||
| + | } | ||
| + | #sidemenu ul ul li.active > a::after, | ||
| + | #sidemenu ul ul li.open > a::after, | ||
| + | #sidemenu ul ul li > a:hover::after { | ||
| + | border-color: #ffffff; | ||
| + | } | ||
#layer1 { | #layer1 { | ||
overflow:hidden; | overflow:hidden; | ||
| Line 121: | Line 246: | ||
<p style="font-size:64px"><b>Protocols</b> | <p style="font-size:64px"><b>Protocols</b> | ||
</div> | </div> | ||
| + | <div id='sidemenu'> | ||
| + | <ul> | ||
| + | <li><a href="#Miniprep" class="smoothScroll"><span>Miniprep</span></a></li> | ||
| + | |||
| + | <li><a href="#Ligation" class="smoothScroll"><span>Ligation</span></a></li> | ||
| + | |||
| + | <li><a href="#Transformation" class="smoothScroll"><span>Transformation</span></a></li> | ||
| + | |||
| + | <li><a href="#3Assembly" class="smoothScroll"><span>3A Assembly</span></a></li> | ||
| + | |||
| + | <li><a href="#REDigest" class="smoothScroll"><span>RE Digest</span></a></li> | ||
| + | |||
| + | <li><a href="#Gibsonassembly" class="smoothScroll"><span>Gibson Assembly</span></a></li> | ||
| + | |||
| + | <li><a href="#PCR" class="smoothScroll"><span>PCR</span></a></li> | ||
| + | |||
| + | <li><a href="#Gelextract" class="smoothScroll"><span>Gel Extract</span></a></li> | ||
| + | <li><a href="#FPLC" class="smoothScroll"><span>GFPLC</span></a></li> | ||
| + | </ul> | ||
</div> | </div> | ||
| + | </div> | ||
| + | |||
| − | |||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="Miniprep"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Miniprep</b></a> | <b>Miniprep</b></a> | ||
| Line 162: | Line 308: | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="Ligation"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Ligation</b></a> | <b>Ligation</b></a> | ||
| Line 185: | Line 332: | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="Transformation"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Transformation</b></a> | <b>Transformation</b></a> | ||
| Line 209: | Line 357: | ||
</div> | </div> | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="3Assembly"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>3A Assembly</b></a> | <b>3A Assembly</b></a> | ||
| Line 233: | Line 382: | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="REDigest"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>RE Digest</b></a> | <b>RE Digest</b></a> | ||
| Line 253: | Line 403: | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="Gibsonassembly"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Gibson Assembly</b></a> | <b>Gibson Assembly</b></a> | ||
| Line 273: | Line 424: | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="PCR"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>PCR</b></a> | <b>PCR</b></a> | ||
| Line 301: | Line 453: | ||
</div> | </div> | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="Gelextract"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Gel Extract</b></a> | <b>Gel Extract</b></a> | ||
| Line 326: | Line 479: | ||
</div> | </div> | ||
<div id='contentbox'> | <div id='contentbox'> | ||
| + | <a name="FPLC"> | ||
<p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | <p style="font-size:32px;text-align:left;font-family:Verdana, Geneva, sans-serif;"> | ||
<b>Fast Protein Liquid Chromatography</b></a> | <b>Fast Protein Liquid Chromatography</b></a> | ||
Revision as of 21:06, 18 September 2015
