Team:Groningen/sandbox

{{Team:Groningen/sandboxHeader}}
<html>	
	<div id="overallMask">
			<div id="headerWrapper">
				<img src="https://static.igem.org/mediawiki/2010/f/f6/LogoGroningen.png" alt="iGEM Groningen '10">
				<p style="float: right; margin-right: 30px">
					We believe in a better world<br>
					<span style="margin-left: 2em">through synthetic biology</span>
				</p>
			</div>
			<div id="contentWrapper">
				<div class='tabbed_content'>
					<div class='tabs'>
						<div class='moving_bg'>
							&nbsp;
						</div><span class='tab_item'>Home</span> <span class='tab_item'>Project</span> <span class='tab_item'>Ethics</span> <span class='tab_item'>Modeling</span><span class='tab_item'>Sponsoring</span><span class='tab_item'>Contact</span>
					</div>
					<div class='slide_content'>
						<div id="sponsorWrapper">
							LOL
						</div>
						<div class='tabslider'>
							<ul>
							<li>
							<div id="textWrapper">
								<span class="head">Welcome to iGEM Groningen!</span><br>
							</html>{{Team:Groningen/welcometekst}}<html>

							</div>
							</li>
						</ul><ul>
							<li>
							<div id="textWrapper">
								<span class="head">We are MORE awesome</span><br>
								<p>
									Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas aliquet justo sit amet aliquet. Pellentesque vel ipsum nisl. Praesent magna massa, pharetra non ornare sit amet, gravida ut eros. Sed eu leo felis. Donec tristique feugiat quam, et consectetur velit convallis auctor. Vivamus hendrerit, ipsum eu vestibulum mattis, erat massa adipiscing libero, ac volutpat nunc augue vel libero. Aliquam sit amet quam libero, sed lobortis magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec varius dignissim nisi eget venenatis. Nam aliquet volutpat ipsum. Mauris sapien ante, semper in varius id, sodales adipiscing felis. Suspendisse ornare facilisis mauris, eget sodales odio interdum quis. Praesent sodales semper aliquet. Pellentesque eget arcu sit amet leo bibendum scelerisque. Vivamus libero magna, aliquam in pulvinar a, sagittis nec diam. Pellentesque iaculis mauris sed arcu dapibus eu fringilla est ullamcorper. Phasellus ultricies lectus eu eros molestie vel tincidunt nulla pharetra. Curabitur non augue at mi semper condimentum non ac dolor.
								</p>
								<p>
									In leo nisi, vulputate at vestibulum eu, iaculis vel ipsum. Maecenas sagittis quam sit amet nulla vulputate iaculis. Nam nisl tellus, elementum at suscipit interdum, luctus vel felis. Nullam interdum metus at tortor porttitor ut ornare lorem hendrerit. Praesent non tortor at turpis venenatis semper a sed magna. Vestibulum dapibus placerat risus quis tempor. Aliquam vel nisi nec turpis dictum cursus quis vel ante. Quisque egestas pharetra risus vitae luctus. Fusce id vulputate justo. Duis in mi orci. Suspendisse potenti. Fusce aliquam commodo nibh eu interdum. Praesent vel purus vitae justo convallis auctor non nec nisi. Sed sem tellus, suscipit non fermentum et, placerat sed mi. Proin eu arcu convallis tellus egestas molestie quis ac elit.
								</p>
							</div>
							</li>
							</ul>
							</ul><ul>
								<li>
								<div id="textWrapper">
									<span class="head">We are MOOOOOAR awesome</span><br>
									<p>
										Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas aliquet justo sit amet aliquet. Pellentesque vel ipsum nisl. Praesent magna massa, pharetra non ornare sit amet, gravida ut eros. Sed eu leo felis. Donec tristique feugiat quam, et consectetur velit convallis auctor. Vivamus hendrerit, ipsum eu vestibulum mattis, erat massa adipiscing libero, ac volutpat nunc augue vel libero. Aliquam sit amet quam libero, sed lobortis magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec varius dignissim nisi eget venenatis. Nam aliquet volutpat ipsum. Mauris sapien ante, semper in varius id, sodales adipiscing felis. Suspendisse ornare facilisis mauris, eget sodales odio interdum quis. Praesent sodales semper aliquet. Pellentesque eget arcu sit amet leo bibendum scelerisque. Vivamus libero magna, aliquam in pulvinar a, sagittis nec diam. Pellentesque iaculis mauris sed arcu dapibus eu fringilla est ullamcorper. Phasellus ultricies lectus eu eros molestie vel tincidunt nulla pharetra. Curabitur non augue at mi semper condimentum non ac dolor.
									</p>
									<p>
										In leo nisi, vulputate at vestibulum eu, iaculis vel ipsum. Maecenas sagittis quam sit amet nulla vulputate iaculis. Nam nisl tellus, elementum at suscipit interdum, luctus vel felis. Nullam interdum metus at tortor porttitor ut ornare lorem hendrerit. Praesent non tortor at turpis venenatis semper a sed magna. Vestibulum dapibus placerat risus quis tempor. Aliquam vel nisi nec turpis dictum cursus quis vel ante. Quisque egestas pharetra risus vitae luctus. Fusce id vulputate justo. Duis in mi orci. Suspendisse potenti. Fusce aliquam commodo nibh eu interdum. Praesent vel purus vitae justo convallis auctor non nec nisi. Sed sem tellus, suscipit non fermentum et, placerat sed mi. Proin eu arcu convallis tellus egestas molestie quis ac elit.
									</p>
								</div>
								</li>
								</ul>
						</div>
					</div>
					
				</div>
			</div><script type="text/javascript">
//tab effects

			var TabbedContent = {
			init: function() {  
			$(".tab_item").mouseover(function() {

			var background = $(this).parent().find(".moving_bg");

			$(background).stop().animate({
				left: $(this).position()['left']
			}, {
				duration: 300
			});

			TabbedContent.slideContent($(this));

			});
			},

			slideContent: function(obj) {

			var margin = $(obj).parent().parent().find(".slide_content").width();
			margin = margin * ($(obj).prevAll().size() - 1);
			margin = margin * -1;

			$(obj).parent().parent().find(".tabslider").stop().animate({
			marginLeft: margin + "px"
			}, {
			duration: 300
			});
			}
			}

			$(document).ready(function() {
			TabbedContent.init();
			});
			</script>
		</div>

</html>
{{Team:Groningen/sandboxFooter}}