|
|
(83 intermediate revisions by 2 users not shown) |
Line 1: |
Line 1: |
− | </div></div> | + | </div></div><html lang="en"> |
− | <html lang="en"> | + | |
| <head> | | <head> |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script> | | <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
− | <script>
| |
− | $(body).css('display','none');
| |
− | </script>
| |
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> | | <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> |
− | <script type="text/javascript">
| |
− | if (typeof jQuery == 'undefined') {
| |
− | document.write(unescape("%3Cscript src='js/jquery-1.10.2.min.js' type='text/javascript'%3E%3C/script%3E"));
| |
− | }
| |
− | </script>
| |
| <link href='https://fonts.googleapis.com/css?family=Exo|Lora' rel='stylesheet' type='text/css'> | | <link href='https://fonts.googleapis.com/css?family=Exo|Lora' rel='stylesheet' type='text/css'> |
| | | |
− | <link href='https://fonts.googleapis.com/css?family=Raleway:400,200' rel='stylesheet' type='text/css'> | + | <link href='https://fonts.googleapis.com/css?family=Raleway:400,200,300' rel='stylesheet' type='text/css'> |
− | <title>2nd Annual Mid-Atlantic Meet-up</title> | + | <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css"> |
| </head> | | </head> |
| <body> | | <body> |
| + | <script> |
| + | /* Hiding stupid stuff*/ |
| + | $(document).ready(function() { |
| + | $('#top_title').css('display', 'none'); |
| + | $('#top_menu').css('display', 'none'); |
| + | //$('#top_menu_14').css('display', 'none'); |
| + | $('#HQ_page').css('display', 'none'); |
| + | $('#top_menu_under').css('display', 'none'); |
| + | }); |
| + | $('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code |
| + | $('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr'); |
| + | </script> |
| <style> | | <style> |
− | #bodyContent, #content, html, body, #globalWrapper, #iGEM, #overruled {
| + | #bars_item { |
− | width: 100%;
| + | display: none; |
− | height: 100%;
| + | } |
− | padding: 0 0 0 0;
| + | |
− | border: none;
| + | |
− | margin: 0 0 0 0;
| + | |
− | background: transparent;
| + | |
− | }
| + | |
− |
| + | |
− | #top_title {
| + | |
− | display: none;
| + | |
− | line-height: inherit;
| + | |
− | }
| + | |
− |
| + | |
− | #sideMenu {
| + | |
− | display: none;
| + | |
− | }
| + | |
| | | |
− | /* Navbar and body setup */
| + | #sideMenu { |
− | body {
| + | display: none; |
− | font-family: 'Lora', serif;
| + | } |
− | overflow-x: hidden;
| + | |
− | }
| + | |
| | | |
− | #content {
| + | #bodyContent, #content, html, body, #globalWrapper, #iGEM, #overruled { |
− | margin-top: 0px;
| + | width: 100%; |
− | }
| + | padding: 0 0 0 0; |
| + | border: none; |
| + | margin: 0 0 0 0; |
| + | background: transparent; |
| + | font-family: Raleway !important; |
| + | min-width: 1000px; |
| + | min-height: 500px; |
| + | } |
| | | |
− | /* Navbar */
| + | #top_title { |
− | nav {
| + | display: none; |
− | opacity: 1.0;
| + | line-height: inherit; |
− | position: fixed;
| + | } |
− | top: 0;
| + | |
− | left: 0;
| + | |
− | right: 0;
| + | |
− | line-height: 10px;
| + | |
− | font-size: 20pt;
| + | |
− | display: block;
| + | |
− | background: #fff;
| + | |
− | border-bottom: 1px solid black;
| + | |
− | box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
| + | |
− | border-radius: 15px;
| + | |
− | z-index: 1;
| + | |
− | margin-top: 18px;
| + | |
− | }
| + | |
| | | |
− | element.style {
| + | #sideMenu { |
− | text-decoration: none;
| + | display: none; |
− | }
| + | } |
| | | |
− | nav a {
| + | /* Navbar and body setup */ |
− | text-decoration: none;
| + | body { |
− | color: black;
| + | overflow: normal; |
− | font-family: 'Exo', sans-serif;
| + | } |
− | }
| + | |
| | | |
− | nav a:visited {
| + | #content { |
− | color: black;
| + | margin-top: 0px; |
− | }
| + | } |
− | | + | |
− | nav a:hover {
| + | |
− | opacity: .7;
| + | |
− | text-decoration: none;
| + | |
− | }
| + | |
− | | + | |
− | nav ul {
| + | |
− | list-style: none;
| + | |
− | transition: all .5s ease;
| + | |
− | text-align: right;
| + | |
− | }
| + | |
− | | + | |
− | nav li {
| + | |
− | display: inline;
| + | |
− | margin-right: 20px;
| + | |
− | }
| + | |
− | | + | |
− | /* Nav bar when more icon is clicked */
| + | |
− | | + | |
− | #div-navResized {
| + | |
− | font-size: 20pt;
| + | |
− | position: fixed;
| + | |
− | text-align: center;
| + | |
− | display: none;
| + | |
− | width: 100%;
| + | |
− | left: 0;
| + | |
− | right: 0;
| + | |
− | margin-top: 74px;
| + | |
− | z-index: 3;
| + | |
− | }
| + | |
− | | + | |
− | #div-navResized a {
| + | |
− | text-decoration: none;
| + | |
− | color: black;
| + | |
− | font-family: 'Exo', sans-serif;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | #div-navResized a:hover {
| + | |
− | text-decoration: none;
| + | |
− | }
| + | |
− | | + | |
− | #div-navResized ul {
| + | |
− | list-style: none;
| + | |
− | margin-right: 40px;
| + | |
− | margin-top: 0px;
| + | |
− | }
| + | |
− | | + | |
− | #div-navResized ul li {
| + | |
− | margin-top: 4px;
| + | |
− | }
| + | |
− | | + | |
− | #div-title {
| + | |
− | z-index: -999;
| + | |
− | }
| + | |
− | | + | |
− | /* Permanent bottom bar */
| + | |
− | #bot-nav {
| + | |
− | background-color: #f9f9f9;
| + | |
− | border-top: 1px solid #f5f5f5;
| + | |
− | position: absolute;
| + | |
− | width: 100%;
| + | |
− | height: 75px;
| + | |
− | left: 0;
| + | |
− | top: 3000px;
| + | |
− | display: block;
| + | |
− | color: black;
| + | |
− | font-size: 12pt;
| + | |
− | }
| + | |
− | | + | |
− | #container {
| + | |
− | width: 950px;
| + | |
− | margin-left: auto;
| + | |
− | margin-right: auto;
| + | |
− | padding-right: 15px;
| + | |
− | padding-left: 15px;
| + | |
− | margin-top: -7px;
| + | |
− | }
| + | |
− | | + | |
− | #bot-nav img {
| + | |
− | height: 20px;
| + | |
− | width: 20px;
| + | |
− | margin-top: -40px;
| + | |
− | -webkit-filter: grayscale(100%);
| + | |
− | filter: grayscale(100%);
| + | |
− | }
| + | |
− | | + | |
− | #bot-nav img:hover {
| + | |
− | -webkit-filter: grayscale(0%);
| + | |
− | filter: grayscale(0%);
| + | |
− | }
| + | |
− | | + | |
− | #bot-nav ul {
| + | |
− | text-align: center;
| + | |
− | margin-top: -13px;
| + | |
− | }
| + | |
− | | + | |
− | #bot-nav li {
| + | |
− | display: inline;
| + | |
− | margin-right: -14px;
| + | |
− | }
| + | |
− | | + | |
− | #bot-nav a {
| + | |
− | text-decoration: none;
| + | |
− | color: black;
| + | |
− | }
| + | |
− | | + | |
− | #copyright {
| + | |
− | text-align: center;
| + | |
− | padding-top: 24px;
| + | |
− | }
| + | |
− | | + | |
− | #contact:hover {
| + | |
− | text-shadow: .1px .1px black;
| + | |
− | }
| + | |
− | | + | |
− | /* Background of page */
| + | |
− | | + | |
− | html {
| + | |
− | background-color: rgba(0, 0, 0, 0.06);
| + | |
− | }
| + | |
− | | + | |
− | /* Start Page Specific CSS */
| + | |
− | | + | |
− | /* Title */
| + | |
− | h1, h1-2 {
| + | |
− | font-size: 30pt;
| + | |
− | position: absolute;
| + | |
− | top: 350px;
| + | |
− | left: 39px;
| + | |
− | width: 100%;
| + | |
− | border-bottom: none;
| + | |
− | color: white;
| + | |
− | }
| + | |
− | | + | |
− | h1-2 span {
| + | |
− | color: white;
| + | |
− | padding-bottom: 2px;
| + | |
− | padding-right: 10px;
| + | |
− | padding-left: 10px;
| + | |
− | letter-spacing: -1px;
| + | |
− | background: rgb(0, 0, 0); /* fallback color */
| + | |
− | background: rgba(0, 0, 0, 0.7);
| + | |
− | }
| + | |
− | | + | |
− | h1 {
| + | |
− | max-width: 759px;
| + | |
− | min-width: 759px;
| + | |
− | background: rgb(0, 0, 0); /* fallback color */
| + | |
− | background: rgba(0, 0, 0, 0.7);
| + | |
− | padding-left: 10px;
| + | |
− | padding-bottom: 22px;
| + | |
− | }
| + | |
− | | + | |
− | /* Info */
| + | |
− | | + | |
− | #Info {
| + | |
− | margin-top: 200px;
| + | |
− | margin-left: -8px;
| + | |
− | margin-right: -8px;
| + | |
− | margin-bottom: 100px;
| + | |
− | }
| + | |
− | | + | |
− | #meetup {
| + | |
− | position: absolute;
| + | |
− | margin-left: 10px;
| + | |
− | z-index: -999;
| + | |
− | margin-top: 149px;
| + | |
− | height: 400px;
| + | |
− | min-width: 600px;
| + | |
− | max-width: 600px;
| + | |
− | }
| + | |
− | | + | |
− | #Info p {
| + | |
− | font-size: 15pt;
| + | |
− | line-height: 2;
| + | |
− | }
| + | |
− | | + | |
− | #p1 {
| + | |
− | margin-left: 626px;
| + | |
− | max-width: 585px;
| + | |
− | min-width: 585px
| + | |
− | }
| + | |
− | | + | |
− | #p2 {
| + | |
− | margin-top: 100px;
| + | |
− | margin-left: 204px;
| + | |
− | max-width: 850px;
| + | |
− | min-width: 850px;
| + | |
− | }
| + | |
− | | + | |
− | /* Schedule */
| + | |
− | | + | |
− | #div-white {
| + | |
− | z-index: -999;
| + | |
− | position: absolute;
| + | |
− | background-color: white;
| + | |
− | width: 100%;
| + | |
− | left: 0px;
| + | |
− | height: 700px;
| + | |
− | margin-top: -52px;
| + | |
− | min-width: 1200px;
| + | |
− | }
| + | |
− | | + | |
− | #img-schedule {
| + | |
− | display: block;
| + | |
− | margin-top: 50px;
| + | |
− | opacity: 1;
| + | |
− | width: 600px;
| + | |
− | margin-right: auto;
| + | |
− | margin-left: auto;
| + | |
− | }
| + | |
− |
| + | |
− | #div-img {
| + | |
− | width: 600px;
| + | |
− | margin-left: 30%;
| + | |
− | margin-right: auto;
| + | |
− |
| + | |
− | }
| + | |
− |
| + | |
− | /* Speakers */
| + | |
− | | + | |
− | h2 {
| + | |
− | font-size: 30pt; width: 970px; margin-right: auto; margin-left: auto;
| + | |
− | overflow: visible;
| + | |
− | }
| + | |
− | | + | |
− | #Speakers {
| + | |
− | margin-top: 800px;
| + | |
− | margin-left: -8px;
| + | |
− | margin-right: -8px;
| + | |
− | }
| + | |
− | | + | |
− | #Speakers img {
| + | |
− | width: 123px;
| + | |
− | height: 170px;
| + | |
− | position: absolute;
| + | |
− | }
| + | |
− | | + | |
− | #Speakers p {
| + | |
− | font-size: 15pt;
| + | |
− | line-height: 2;
| + | |
− | width: 970px;
| + | |
− | margin-right: auto;
| + | |
− | margin-left: auto;
| + | |
− | margin-top: 5px;
| + | |
− |
| + | |
− | }
| + | |
− | | + | |
− | img#igemguy {
| + | |
− | border: 1px solid black;
| + | |
− | margin-left: 721px;
| + | |
− | }
| + | |
− | | + | |
− | #umdguy {
| + | |
− | margin-left: 377px;
| + | |
− | }
| + | |
− | | + | |
− | h3 {
| + | |
− | font-size: 20pt;
| + | |
− | margin-left: 340px;
| + | |
− | }
| + | |
− | | + | |
− | h4 {
| + | |
− | font-size: 20pt;
| + | |
− | margin-left: 695px;
| + | |
− | margin-top: 11px;
| + | |
− | }
| + | |
− | | + | |
− | #hiddenS {
| + | |
− | margin-top: 800px;
| + | |
− | margin-bottom: -750px;
| + | |
− | }
| + | |
− | | + | |
− | /* Footnotes (References) */
| + | |
− | | + | |
− | #footnotes {
| + | |
− | margin-left: 50px;
| + | |
− | margin-top: 25px;
| + | |
− | font-size: 16px;
| + | |
− | }
| + | |
− | | + | |
− | /* Classes */
| + | |
− | | + | |
− | .description {
| + | |
− | margin-top: 200px;
| + | |
− | min-width: 970px;
| + | |
− | }
| + | |
− | | + | |
− | .border {
| + | |
− | border-bottom: 1px black;
| + | |
− | }
| + | |
− | | + | |
− | .image {
| + | |
− | position: relative;
| + | |
− | width: 100%; /* for IE 6 */
| + | |
− | }
| + | |
− | | + | |
− | .pull-right {
| + | |
− | float: right !important;
| + | |
− | }
| + | |
− | | + | |
− | .pull-left {
| + | |
− | float: left !important;
| + | |
− | }
| + | |
− | | + | |
− | /* Pushed class actives */
| + | |
− | #img-more.pushed {
| + | |
− | box-shadow: inset 1px 1px 1px 2px rgba(0, 0, 0, .3);
| + | |
− | }
| + | |
− | | + | |
− | #div-navResized.pushed {
| + | |
− | display: block;
| + | |
− | }
| + | |
− | | + | |
− | nav.pushed {
| + | |
− | height: 271px;
| + | |
− | }
| + | |
− | | + | |
− | nav img.pushed {
| + | |
− | display: none;
| + | |
− | }
| + | |
− | | + | |
− | | + | |
− | /* Hides nav bar when scrolling */
| + | |
− | .scrolled {
| + | |
− | font-size: 10pt;
| + | |
− | line-height: 20px;
| + | |
− | }
| + | |
− | | + | |
− | /* animation when mouse is over Navbar */
| + | |
− | .hover {
| + | |
− | font-size: 20pt;
| + | |
− | line-height: 40px;
| + | |
− | }
| + | |
− | | + | |
− | /* Images */
| + | |
− | | + | |
− | /* Logo */
| + | |
− | #img-logo {
| + | |
− | width: 150px;
| + | |
− | float: left;
| + | |
− | position: fixed;
| + | |
− | margin-top: 4px;
| + | |
− | margin-left: 65px;
| + | |
− | opacity: 1.0;
| + | |
− | }
| + | |
− | | + | |
− | /* iGEM logo */
| + | |
− | #img-igemlogo {
| + | |
− | width: 60px;
| + | |
− | float: right;
| + | |
− | position: fixed;
| + | |
− | margin-top: 1px;
| + | |
− | opacity: 1.0;
| + | |
− | }
| + | |
− | | + | |
− | /* More Icon */
| + | |
− | #img-more {
| + | |
− | position: fixed;
| + | |
− | display: none;
| + | |
− | width: 50px;
| + | |
− | height: 50px;
| + | |
− | margin-right: 0px;
| + | |
− | right: 15px;
| + | |
− | z-index: 2;
| + | |
− | margin-top: -11px;
| + | |
− | }
| + | |
− | | + | |
− | #img-UMD {
| + | |
− | z-index: -999;
| + | |
− | margin-left: -8px;
| + | |
− | margin-top: -12px;
| + | |
− | height: 600px;
| + | |
− | }
| + | |
− | | + | |
− | /* Logos when more button is clicked */
| + | |
− | | + | |
− | #img-logoResized {
| + | |
− | width: 150px;
| + | |
− | display: block;
| + | |
− | margin-right: auto;
| + | |
− | margin-left: auto;
| + | |
− | margin-top: -266px;
| + | |
− | }
| + | |
− | #img-igemlogoResized {
| + | |
− | width: 60px;
| + | |
− | display: block;
| + | |
− | margin-right: auto;
| + | |
− | margin-left: auto;
| + | |
− | margin-top: 139px;
| + | |
− | }
| + | |
− | | + | |
− | .centered {
| + | |
− | width:1200px;
| + | |
− | margin-left:auto;
| + | |
− | margin-right:auto;
| + | |
− | }
| + | |
− |
| + | |
− | #umdguy, #igemguy:hover {
| + | |
− | cursor: pointer;
| + | |
− | }
| + | |
− |
| + | |
− | #div-popup {
| + | |
− | display: none;
| + | |
− | font-family: 'Raleway', sans-serif;
| + | |
− | background: rgb(255, 255, 253);
| + | |
− | padding: 30px 30px 30px 30px;
| + | |
− | border: solid 4px gray;
| + | |
− | max-width: 50%;
| + | |
− | min-width: 700px;
| + | |
− | -webkit-border-radius: 25px;
| + | |
− | -moz-border-radius: 25px;
| + | |
− | border-radius: 25px;
| + | |
− | }
| + | |
| | | |
− | .div-popup_close {
| + | #UMD-content { |
− | color: rgb(255, 255, 255);
| + | font-family: Raleway !important; |
− | font-size: 16pt;
| + | min-width: 1000px; |
− | padding: 10px;
| + | color: white; |
− | -webkit-border-radius: 15px;
| + | font-weight: 300; |
− | -moz-border-radius: 15px;
| + | |
− | border-radius: 15px;
| + | |
− | background: rgb(124, 124, 124);
| + | |
− | background: -moz-linear-gradient(90deg, rgb(124, 124, 124) 30%, rgb(150, 150, 150) 70%);
| + | |
− | background: -webkit-linear-gradient(90deg, rgb(124, 124, 124) 30%, rgb(150, 150, 150) 70%);
| + | |
− | background: -o-linear-gradient(90deg, rgb(124, 124, 124) 30%, rgb(150, 150, 150) 70%);
| + | |
− | background: -ms-linear-gradient(90deg, rgb(124, 124, 124) 30%, rgb(150, 150, 150) 70%);
| + | |
− | background: linear-gradient(0deg, rgb(124, 124, 124) 30%, rgb(150, 150, 150) 70%);
| + | |
− | -webkit-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75);
| + | |
− | -moz-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75);
| + | |
− | box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.75);
| + | |
− | }
| + | |
| | | |
− | .div-popup_close:hover { | + | } |
− | cursor: pointer;
| + | |
− | } | + | #UMD-content a { |
| + | color: white; |
| + | } |
| + | |
| + | #nav li { |
| + | display: inline; |
| + | font-size: 18pt; |
| + | margin-right: 35px; |
| + | } |
| + | |
| + | #nav { |
| + | margin-right: 2%; |
| + | margin-left: auto; |
| + | width: 810px; |
| + | } |
| + | |
| + | #nav ul { |
| + | list-style: none; |
| + | } |
| + | |
| + | #h2 { |
| + | font-family: Raleway !important; |
| + | display: none; |
| + | font-size: 36pt !important; |
| + | margin-top: 0px !important; |
| + | text-align: left !important; |
| + | } |
| + | |
| + | #h3, #div-h3 { |
| + | font-family: Raleway !important; |
| + | display: none; |
| + | font-size: 20pt !important; |
| + | line-height: 1.5em !important; |
| + | text-align: left !important; |
| + | } |
| + | |
| + | #div-text { |
| + | width: 1100px; |
| + | padding-top: 20px; |
| + | } |
| + | |
| + | #img-logo { |
| + | display: none; |
| + | margin-top: 10px; |
| + | float: left; |
| + | margin-right: 50px; |
| + | } |
| + | |
| + | .notOutline { |
| + | margin-left: 50px; |
| + | min-height: 400px; |
| + | min-width: 1000px; |
| + | } |
| + | |
| + | .hide { |
| + | display: none; |
| + | } |
| + | a { |
| + | padding-right: 0px !important; |
| + | text-decoration: none !important; |
| + | } |
| + | |
| + | |
| + | .tour { |
| + | display: none; |
| + | position: absolute; |
| + | right: 150px; |
| + | top: 50%; |
| + | bottom: auto; |
| + | left; auto; |
| + | } |
| + | |
| + | html { |
| + | background: url(https://static.igem.org/mediawiki/2016/7/7e/T--UMaryland--main.jpg) !important; |
| + | background-size: cover !important; |
| + | background-repeat: no-repeat !important; |
| + | } |
| + | |
| + | .background { |
| + | background-color: rgba(0,0,0, 0.7); |
| + | padding: 5px 5px 5px 5px; |
| + | } |
| + | |
| + | .background2 { |
| + | background-color: rgba(0,0,0, 0.7); |
| + | padding: 5px 0px 4px 0px; |
| + | } |
| + | |
| + | .background3 { |
| + | background-color: rgba(0,0,0, 0.7); |
| + | padding: 5px 10px 5px 10px; |
| + | } |
| + | |
| + | #navContainer { |
| + | position: relative; |
| + | width: 100%; |
| + | height: 25px; |
| + | margin-top: 80px; |
| + | margin-bottom: 120px; |
| + | min-width: 1000px; |
| + | } |
| + | |
| + | |
| + | #small { |
| + | font-size: 14pt !important; |
| + | display: block !important; |
| + | font-family: Raleway !important; |
| + | margin-right: 2%; |
| + | margin-left: auto; |
| + | width: 500px; |
| | | |
− | #div-popup strong {
| + | } |
− | font-size: 16pt;
| + | |
− | line-height: 1.5em;
| + | .smallContainer { |
− | } | + | width: 100%; |
| + | min-width: 1000px; |
| + | height: 30px; |
| + | margin-top: 120px; |
| | | |
− | #div-popup p {
| + | } |
− | font-size: 12pt;
| + | </style> |
− | line-height: 1.75em;
| + | <div id="UMD-content"> |
− | }
| + | <div id="navContainer"> |
− |
| + | <div class="hide"> |
− | iframe { width: 100%;min-height: 400px;}
| + | <nav id="nav"> |
− | </style>
| + | <ul> |
− | <script>
| + | <li><a href="https://2016.igem.org/Team:UMaryland/projects">Projects</a></li> |
− | /* Hiding stupid stuff*/
| + | <li><a href="https://2016.igem.org/Team:UMaryland/Part_Collection">Parts</a></li> |
− | $(document).ready(function() {
| + | <li><a href="https://2016.igem.org/Team:UMaryland/Model">Modeling</a></li> |
− | $('#top_title').css('display', 'none');
| + | <li><a href="https://2016.igem.org/Team:UMaryland/outreach">Outreach</a></li> |
− | $('#top_menu').css('display', 'none');
| + | <li><a href="https://2016.igem.org/Team:UMaryland/notebook">Notebook</a></li> |
− | //$('#top_menu_14').css('display', 'none');
| + | <li><a href="https://2016.igem.org/Team:UMaryland/about">About Us</a></li> |
− | $('#HQ_page').css('display', 'none');
| + | </ul> |
− | $('#top_menu_under').css('display', 'none');
| + | </nav> |
− | });
| + | |
− | $('#HQ_page').attr("id","iGEM"); //voids all dumb CSS iGEM HQ wrote which overrides our code
| + | |
− | $('#mw-content-text').attr("id","overruled").removeClass('mw-content-ltr');
| + | |
− | </script>
| + | |
− | <nav> | + | |
− | <img src="https://static.igem.org/mediawiki/2016/e/e3/16UMD-logoTemp.png" id="img-logo" width="128px">
| + | |
− | <a href="https://2016.igem.org/Main_Page">
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/3/3d/T--UMaryland--igemlogo.png" id="img-igemlogo" width="128px"> | + | |
− | </a>
| + | |
− | <ul>
| + | |
− | <a style="opacity: 0">Fix</a>
| + | |
− | <li><a data-scroll class="linkText" href="#div-title">Meet-Up</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#information">Information</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#schedule">Schedule</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#speakers">Speakers</a></li>
| + | |
− | </ul>
| + | |
− | </nav>
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/e/e5/T--UMaryland--more.png" id="img-more">
| + | |
− | <!-- Nav bar when more button is clicked -->
| + | |
− | <div id="div-navResized">
| + | |
− | <a href="https://2016.igem.org/Main_Page">
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/3/3d/T--UMaryland--igemlogo.png" id="img-igemlogoResized">
| + | |
− | </a>
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/e/e3/16UMD-logoTemp.png" id="img-logoResized">
| + | |
− | <ul>
| + | |
− | <li><a data-scroll class="linkText" href="#div-title">Meet-Up</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#information">Information</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#schedule">Schedule</a></li>
| + | |
− | <li><a data-scroll class="linkText" href="#speakers">Speakers</a></li> | + | |
− | </ul> | + | |
| </div> | | </div> |
− | <div id="div-title" class="image">
| |
− | <div data-parallax="scroll" data-image-src="https://static.igem.org/mediawiki/2016/0/07/T--UMaryland--campus.jpg" id="img-UMD">
| |
− | </div>
| |
− | <h1><span>2nd Annual Mid-Atlantic Mini-Jamboree</span> </h1>
| |
− | <h1-2><br/><br/><br/><br/><span>July 22nd, 2016</span></h1-2>
| |
| </div> | | </div> |
− | <div class="centered">
| + | <div class="notOutline"> |
− | <h id="information"><a style="opacity: 0">I</a> </h>
| + | <img src="https://static.igem.org/mediawiki/2016/9/9d/T--UMaryland--newlogosquare.png" id="img-logo" alt="UMaryland iGEM Logo" width="300px"/> |
− | <img src="https://static.igem.org/mediawiki/2016/8/85/T--UMaryland--meetup.jpeg" id="meetup"/>
| + | <div id="div-text"> |
− | <div id="Info" style="text-align: center">
| + | <p id="h2"><span class="background">Biosequestration of Methane</span></p> |
− | <p id = "p1"> Last year, UMaryland iGEM founded the first Mid-Atlantic Meet-up and hosted
| + | <p id="h3"><span class="background2">Creating a strain of E. coli that break down methane to be implemented into landfills as an environmentally friendly strategy for ameliorating global climate change</span></p> |
− | four other teams: UVA, William and Mary, Duke, and Rock Ridge High School.
| + | </div> |
− | Each team gave a 25 minute presentation of their project followed by a Q&A
| + | <div class="smallContainer"> |
− | with the audience. We were also fortunate enough to have Special Agent
| + | <div class="hide"> |
− | Edward You of the FBI and UMD Professor Raymond St. Leger as guest speakers.</p>
| + | <p id="small"><span class="background">Follow us on <a target="_blank" href="https://www.facebook.com/UMarylandiGEM/" style="text-decoration: underline;">Facebook</a> and <a target="_blank" href="https://www.instagram.com/umarylandigem/" style="text-decoration: underline;">Instagram</a> for updates!</span></p> |
− | <p id="p2"> This year, we plan to host many more teams and have a more ambitious agenda planned.
| + | |
− | We cannot wait to welcome those who attend and show them an amazing UMD experience.
| + | |
− | The location of the meet-up will be posted closer to the date. If you are a team interested in
| + | |
− | attending, please do not hesitate to contact us through email or Facebook. </p>
| + | |
− | <h id="schedule"><a style="opacity: 0">S</a></h> | + | |
− | </div>
| + | |
− | <div id="div-white">
| + | |
− | <div id="div-img">
| + | |
− | <img src="https://static.igem.org/mediawiki/2016/e/eb/T--UMaryland--schedule.png" id="img-schedule"/>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div id="hiddenS">
| + | |
− | <h id="speakers"><a style="opacity: 0">S</a></h>
| + | |
− | </div>
| + | |
− | <div id="Speakers" class="bios">
| + | |
− | <h2> Speakers </h2>
| + | |
− | <img src="http://www.ench.umd.edu/sites/default/files/images/faculty/sriram4-lg.png" id="umdguy" data-select="ganesh"/>
| + | |
− | <img src="http://www.synbioproject.org/site/assets/files/1299/todd_cropped.jpg" id="igemguy" data-select="todd"/>
| + | |
− | <div id="descriptions">
| + | |
− | <div id="div-ganesh" class="description">
| + | |
− | <h3> Dr. Ganesh Sriam</h3>
| + | |
− | <p> Dr. Ganesh Sriram is Keystone Assistant Professor in the Department of Chemical and Biomolecular
| + | |
− | Engineering and Affiliate Faculty Member in the Bioengineering and Plant Biology graduate programs at
| + | |
− | University of Maryland. After earning his bachelor's and master's degrees in chemical engineering from
| + | |
− | Indian Institute of Technology (IIT) Bombay, he graduated a Ph.D. in chemical engineering from Iowa
| + | |
− | State University in 2004, working in the lab of Dr. Jacqueline Shanks. From 2004 to 2007, he was a
| + | |
− | postdoctoral researcher in the labs of Dr. Katrina Dipple and Dr. James Liao at UCLA.<sup>1</sup></p>
| + | |
− | </div>
| + | |
− | <div id="div-todd" class="description" style="display: none;">
| + | |
− | <h4> Dr. Todd Kuiken </h4>
| + | |
− | <p> Dr. Todd Kuiken is a Senior Program Associate with the Science and Technology Innovation Program
| + | |
− | where he explores the scientific and technological frontier, stimulating discovery and bringing new
| + | |
− | tools to bear on public policy challenges that emerge as science advances.
| + | |
− | He is the principal investigator on the Wilson Center’s Synthetic Biology Project, where he has
| + | |
− | numerous projects evaluating and designing new research and governance strategies to proactively
| + | |
− | address the biosafety, biosecurity and environmental risks associated with synthetic biology.
| + | |
− | He is also the human practices chairperson of the International Genetically
| + | |
− | Engineered Machines competition and a founding member of its biosafety/biosecurity committee.<sup>2</sup>
| + | |
− | </p>
| + | |
− | </div>
| + | |
− | </div> | + | |
− | </div> | + | |
− | <div id="footnotes">
| + | |
− | <sup>1. Bio from http://www.ench.umd.edu/faculty/sriram</sup> | + | |
− | <br/>
| + | |
− | <sup>2. Bio from https://www.wilsoncenter.org/person/todd-kuiken-phd</sup>
| + | |
− | </div>
| + | |
− | </div>
| + | |
− | <div id="bot-nav">
| + | |
− | <div id="container">
| + | |
− | <div class="pull-left">
| + | |
− | <a href="mailto:umarylandigem@gmail.com"><p id="contact"> Contact Us </p></a>
| + | |
− | </div>
| + | |
− | <p id="copyright">© University of Maryland iGEM 2016</p>
| + | |
− | <div class="pull-right">
| + | |
− | <ul>
| + | |
− | <li> <a href="https://www.facebook.com/UMarylandiGEM/"> <img src="https://static.igem.org/mediawiki/2016/2/2c/T--UMaryland--FBlogo.png"/> </a> </li>
| + | |
− | <li> <a href="https://www.instagram.com/umarylandigem/"> <img src="https://static.igem.org/mediawiki/2016/b/bc/T--UMaryland--Instalogo.png"/> </a> </li>
| + | |
− | </ul>
| + | |
− | </div>
| + | |
| </div> | | </div> |
| </div> | | </div> |
− | <div id="div-popup">
| + | </div> |
− | | + | </div> |
− | <strong class="title">Are you interested in showing your synthetic biology pride?</strong>
| + | <style> |
− | <p>We are selling these incredible T-shirts you see below for $15 as a way to promote synthetic biology as well as raise funds for our iGEM project. Please let us know if you are interested in purchasing a shirt!</p> | + | #img-logoNav{ |
− | <iframe src="https://docs.google.com/forms/d/e/1FAIpQLScQdcSSgnpNeKaxRCIKP-MgRNKYQYAmemyU5NVqN4mYt0fVXw/viewform?embedded=true" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
| + | display: none; |
− | <!-- Add an optional button to close the popup -->
| + | margin-left: 50px; |
− | <button class="div-popup_close">Close</button>
| + | margin-top: 42px; |
| + | width: 260px; |
| + | float: left; |
| + | } |
| + | </style> |
| + | </div> |
| <script> | | <script> |
− | | + | |
− | $('.linkText').click( function() { $(this).css('text-decoration','none'); $(this).focusout();}); | + | |
− | | + | $.fn.extend({ |
− | // Text animation for speaker bios
| + | animateCss: function (animationName) { |
− | var current = 'ganesh';
| + | var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend'; |
− | $('.bios img').click( function() {
| + | this.addClass('animated ' + animationName).one(animationEnd, function() { |
− | var selected = $(this).attr('data-select'); // grabs the name of the navigational element clicked
| + | $(this).removeClass('animated ' + animationName); |
− | if (selected != current) { // only change display / trigger animation if clicking different nav
| + | }); |
− | $('.description').css('display','none'); // hides all text
| + | |
− | $('.description').css('margin-left', '60px')
| + | |
− | $('#div-' + selected).css('display','block'); // the div containing the text that is selected is displayed
| + | |
− | $('#div-' + selected).animate({ marginLeft: '0px'}, 200); | + | |
− | current = selected; // sets the current display
| + | |
| } | | } |
− | });
| |
− | $(body).css('display','block');
| |
− | </script>
| |
− | <!-- For nav bar scrolling + hovering + window resize effects-->
| |
− | <script>
| |
− | // Animation over top nav bar when mouse hovers
| |
− | $('nav').mouseover(
| |
− | function () {
| |
− | $('#img-logo').css('transition', '.35s ease-in');
| |
− | $('#img-logo').css('opacity', '1');
| |
− | $('#img-igemlogo').css('transition', '.35s ease-in');
| |
− | $('#img-igemlogo').css('opacity', '1');
| |
− | $('nav ul').addClass("hover");
| |
− | }
| |
− | ),
| |
− | $('nav').mouseout(
| |
− | function () {
| |
− | var scroll = $(window).scrollTop();
| |
− | if (scroll > 0) {if ( $(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false) {
| |
− | $('#img-logo').css('transition', '.25s ease');
| |
− | $('#img-logo').css('opacity', '0');
| |
− | $('#img-igemlogo').css('transition', '.25s ease');
| |
− | $('#img-igemlogo').css('opacity', '0');
| |
− | $('nav ul').removeClass("hover");
| |
− | $('nav').css('transition', '.5s ease');
| |
− | }}}
| |
− |
| |
− | }
| |
− | ),
| |
− | // Window width effect on top nav bar
| |
− | $(document).ready(function() {
| |
− | function checkWidth() {
| |
− | if ($(window).width() < 980 || $('nav').hasClass('pushed')){
| |
− | $('nav li').css('display', 'none');
| |
− | $('#img-more').css('display','block');
| |
− | $('nav ul').addClass("hover");
| |
− | $('#img-logo').css('transition', '.35s ease-in');
| |
− | $('#img-logo').css('opacity', '1');
| |
− | $('#img-igemlogo').css('transition', '.35s ease-in');
| |
− | $('#img-igemlogo').css('opacity', '1')
| |
− | } else {
| |
− | $('nav li').css('display', 'inline');
| |
− | $('#img-more').css('display','none');
| |
− | $('nav ul').removeClass("hover");
| |
− | if ($(window).scrollTop() > 0) {
| |
− | $('#img-igemlogo').css('transition', '.25s ease');
| |
− | $('#img-igemlogo').css('opacity', '0');
| |
− | $('#img-logo').css('transition', '.25s ease');
| |
− | $('#img-logo').css('opacity', '0');
| |
− | $('nav ul').addClass("scrolled");
| |
− | }
| |
− | }
| |
− | }
| |
− | // Execute on load
| |
− | checkWidth();
| |
− | // Bind event listener
| |
− | $(window).resize(checkWidth);
| |
| }); | | }); |
− | // Resized nav bar effect when more icon is clicked | + | |
− | $('#img-more').click(function() { | + | $(window).load(function() { |
− | $('#img-more').toggleClass('pushed'); | + | var timeoutID; |
− | $('#div-navResized').toggleClass('pushed'); | + | var timeoutID2; |
− | $('nav').toggleClass('pushed'); | + | |
− | $('nav img').toggleClass('pushed'); | + | $('#img-logo, #h2').animateCss('fadeInUp'); |
− | if ($(window).width() >= 980) { var pushed = $('body').hasClass('pushed'); if (pushed == false){ | + | $('#h2, #img-logo').css('display','block'); |
− | $('nav li').css('display', 'inline');
| + | timeoutID = window.setTimeout(show2, 800); |
− | $('#img-more').css('display','none');
| + | |
− | $('nav ul').removeClass("hover");
| + | |
− | $('#img-igemlogo').css('transition', '.25s ease');
| + | }) |
− | $('#img-igemlogo').css('opacity', '0');
| + | |
− | $('#img-logo').css('transition', '.25s ease');
| + | function show2(){ |
− | $('#img-logo').css('opacity', '0');
| + | $('#h3, #div-h3').animateCss('fadeInUp'); |
− | }}
| + | $('#h3, #div-h3').css('display','block'); |
− | }); | + | timeoutID = window.setTimeout(show3, 800); |
− | // Scrolling animation for top nav bar
| + | } |
− | var nav = $('nav ul'); | + | |
− | $(window).scroll(function() {
| + | function show3() { |
− | var scroll = $(window).scrollTop();
| + | $('nav, #small').animateCss('fadeInUp'); |
− | if (scroll > 0) { if ( $(window).width() >= 980) {
| + | $('.hide').css('display','block') |
− | nav.addClass("scrolled");
| + | timeoutID = window.setTimeout(show4, 2000); |
− | nav.removeClass("hover");
| + | } |
− | $('#img-logo').css('transition', '.25s ease');
| + | |
− | $('#img-logo').css('opacity', '0');
| + | function show4() { |
− | $('#img-igemlogo').css('transition', '.25s ease');
| + | $('.tour').animateCss('slideInLeft'); |
− | $('#img-igemlogo').css('opacity', '0');
| + | //$('.tour').css('display','block') |
− | }} else {
| + | timeoutID = window.setTimeout(show5, 5000); |
− | nav.removeClass("scrolled");
| + | } |
− | $('#img-logo').css('transition', '.35s ease-in');
| + | |
− | $('#img-logo').css('opacity', '1');
| + | function show5() { |
− | $('#img-igemlogo').css('transition', '.35s ease-in');
| + | $('.tour').animateCss('pulse'); |
− | $('#img-igemlogo').css('opacity', '1');
| + | timeoutID = window.setTimeout(show5, 5000); |
− | }
| + | } |
− | }); | + | |
− |
| + | |
− | $(body).css('display','block');
| + | |
| </script> | | </script> |
− | <script src="http://cferdinandi.github.io/smooth-scroll/dist/js/smooth-scroll.js">
| |
− | </script>
| |
− | <script src="http://pixelcog.github.io/parallax.js/js/parallax.min.js">
| |
− | </script>
| |
− | <script>
| |
− | smoothScroll.init();
| |
− | </script>
| |
− | <script src="https://cdn.rawgit.com/vast-engineering/jquery-popup-overlay/1.7.13/jquery.popupoverlay.js">
| |
− | </script>
| |
− | <script>
| |
| | | |
− | $(document).ready(function() {
| |
− |
| |
− | // Initialize the plugin
| |
− | $('#div-popup').popup({
| |
− | transition: 'all 0.3s',
| |
− | onclose: function() {
| |
− | $('iframe').remove();
| |
− | }
| |
− | });
| |
− |
| |
− | $('#div-popup').popup('show');
| |
− |
| |
− | });
| |
− |
| |
− | </script>
| |
− | </body>
| |
− |
| |
| </html> | | </html> |