|
|
Line 17: |
Line 17: |
| | | |
| {{Team:IngenuityLab_Canada_Footer}} | | {{Team:IngenuityLab_Canada_Footer}} |
− |
| |
− | }
| |
− | #HQ_page h1 {
| |
− | color: #ce559f;
| |
− | font-weight: 700;
| |
− | font-size: 2em;
| |
− | line-height: 1em;
| |
− | }
| |
− | #HQ_page h2 {
| |
− | color: #405e88;
| |
− | font-weight: 700;
| |
− | font-size: 1.6em;
| |
− | margin: 1em 0 0;
| |
− | line-height: 1.2em;
| |
− | }
| |
− | #HQ_page h3 {
| |
− | color: #595959;
| |
− | margin: 1em 0 0;
| |
− | }
| |
− | #HQ_page ol h3 {
| |
− | margin: 1em 0 0 -1.5em;
| |
− | }
| |
− | #HQ_page em {
| |
− | color: #00c2f4;
| |
− | font-weight: 700;
| |
− | font-style: normal;
| |
− | font-size: 1.2em;
| |
− | }
| |
− | #HQ_page p {
| |
− | font-size: 1.1em;
| |
− | }
| |
− | .il_header {
| |
− | background-color: #fff;
| |
− | box-shadow: 0 0 10px rgba(0,0,0,0.3);
| |
− | position: fixed;
| |
− | height: 70px;
| |
− | width: 100%;
| |
− | top: 18px;
| |
− | left: 0;
| |
− | }
| |
− | .firstHeading, .logo_2016, #toc {
| |
− | display: none;
| |
− | }
| |
− | .logo {
| |
− | width: 250px;
| |
− | margin-top: 16px;
| |
− | float: left;
| |
− | }
| |
− | #sideMenu { display: none; }
| |
− | .menu {
| |
− | color: #405e88;
| |
− | float: right;
| |
− | font-size: 1.1em;
| |
− | font-weight: 600;
| |
− | }
| |
− | .menu ul {
| |
− | background-color: #ffffff;
| |
− | display: block;
| |
− | float: left;
| |
− | height: 70px;
| |
− | line-height: 4em;
| |
− | list-style-type: none;
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | text-align: center;
| |
− | width: 110px;
| |
− | cursor: pointer;
| |
− | }
| |
− | .menu ul li {
| |
− | color: #405e88;
| |
− | display: none;
| |
− | background-color: #ffffff;
| |
− | box-shadow: 0 5px 5px rgba(0,0,0,0.3);
| |
− | height: 60px;
| |
− | line-height: 3.2em;
| |
− | margin: -1px 0 0;
| |
− | padding: 0;
| |
− | text-align: center;
| |
− | width: 180px;
| |
− | cursor: pointer;
| |
− | }
| |
− | .menu ul:hover {
| |
− | color: #ffffff;
| |
− | background-color: #405e88;
| |
− | }
| |
− | .menu ul:hover > li {
| |
− | display: block;
| |
− | }
| |
− | .menu ul li:hover {
| |
− | color: #ffffff;
| |
− | background-color: #405e88;
| |
− | }
| |
− | .menu ul li:last-child {
| |
− | border-radius: 0 0 16px 16px;
| |
− | }
| |
− | .menu ul a {
| |
− | color: #405e88;
| |
− | display: block;
| |
− | text-decoration: none;
| |
− | }
| |
− | .menu ul a:hover {
| |
− | color: #ffffff;
| |
− | }
| |
− | .main-image {
| |
− | background: url(https://static.igem.org/mediawiki/2016/4/4e/T--IngenuityLab_Canada--il_nano_bg.jpg) no-repeat fixed center;
| |
− | background-size: cover;
| |
− | text-align: center;
| |
− | width: 100%;
| |
− | padding: 45px 0 60px;
| |
− | opacity:0;
| |
− | }
| |
− | .main-image img {
| |
− | width: 680px;
| |
− | height: auto;
| |
− | }
| |
− | #content {
| |
− | background-color: rgba(0,0,0,0);
| |
− | margin: 0;
| |
− | padding: 0;
| |
− | width:100%;
| |
− | }
| |
− | .contents {
| |
− | margin-top: 70px;
| |
− | }
| |
− | .wrapper {
| |
− | margin: 0 auto;
| |
− | }
| |
− | .article {
| |
− | background-color: #fff;
| |
− | box-shadow: 0 0 10px rgba(0,0,0,0.3);
| |
− | padding-top: 20px;
| |
− | }
| |
− | .article-img {
| |
− | margin: 0 auto;
| |
− | max-width: 800px;
| |
− | }
| |
− | .article-cap {
| |
− | font-family: Arial,Helvetica,sans-serif;
| |
− | font-size: 0.9em;
| |
− | line-height: 1.2em;
| |
− | margin-top: 1em;
| |
− | }
| |
− | .members .article-img {
| |
− | max-width: 500px;
| |
− | width: 100%;
| |
− | margin: 30px auto 0;
| |
− | }
| |
− | .members .article-cap {
| |
− | text-align: center;
| |
− | }
| |
− | .il_header .wrapper {
| |
− | width: 100%;
| |
− | max-width: 1020px;
| |
− | }
| |
− | .article .wrapper {
| |
− | border: 1px solid #cccccc;
| |
− | border-radius: 20px;
| |
− | display: block;
| |
− | padding: 0.5em 2% 2em;
| |
− | max-width: 800px;
| |
− | }
| |
− | #HQ_page .article .wrapper-title {
| |
− | display: block;
| |
− | max-width: 800px;
| |
− | margin: 0 auto;
| |
− | }
| |
− | #HQ_page .article .wrapper-title h1 {
| |
− | color: #405e88;
| |
− | font-size: 2.2em;
| |
− | margin-top: 0;
| |
− | }
| |
− | .article img {
| |
− | width: 100%;
| |
− | }
| |
− | .members figure {
| |
− | margin: 5em 0 1em;
| |
− | }
| |
− | .members figcaption {
| |
− | text-align: center;
| |
− | }
| |
− | figure {
| |
− | text-align: center;
| |
− | margin: 3em 0;
| |
− | }
| |
− | figcaption {
| |
− | text-align: left;
| |
− | }
| |
− | .members figure {
| |
− | margin: 5em 0 1em;
| |
− | }
| |
− | .members figcaption {
| |
− | text-align: center;
| |
− | }
| |
− | .sponsors figure {
| |
− | margin: 2em 0;
| |
− | }
| |
− | .buttons-tabs {
| |
− | height: 30px;
| |
− | margin: 0 auto;
| |
− | max-width: 800px;
| |
− | padding: 0 2% 0.89em;
| |
− | width: 100%;
| |
− | }
| |
− | .project-protocols .buttons-tabs {
| |
− | margin: 0 auto 1.24em;
| |
− | }
| |
− | .buttons-tabs div {
| |
− | background-color: #ffffff;
| |
− | border-left: 1px solid #ccc;
| |
− | border-radius: 10px 10px 0 0;
| |
− | border-right: 1px solid #ccc;
| |
− | border-top: 1px solid #ccc;
| |
− | box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1);
| |
− | float: left;
| |
− | margin: 0 0 0 1px;
| |
− | padding: 0.6em 1em;
| |
− | cursor: pointer;
| |
− | }
| |
− | .buttons-tabs.protocols {
| |
− | padding: 0 1em 2.4em;
| |
− | }
| |
− | .buttons-tabs div:hover > em {
| |
− | color: #ff7000;
| |
− | }
| |
− | .project-protocols .buttons-tabs div {
| |
− | padding: 0.6em 1em 0.1em;
| |
− | }
| |
− | .project-protocols .buttons-tabs div em {
| |
− | line-height: 1em;
| |
− | }
| |
− | #pd_tab2, #pd_tab3 {
| |
− | display:none;
| |
− | }
| |
− | .alphabetic-list {
| |
− | list-style-type: lower-alpha;
| |
− | }
| |
− | ul {
| |
− | list-style-type: disc;
| |
− | }
| |
− | .equation {
| |
− | width: 100%;
| |
− | max-width: 420px;
| |
− | }
| |
− | .footer {
| |
− | display: block;
| |
− | background-color: #73a79e;
| |
− | box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
| |
− | height: 70px;
| |
− | margin: 60px 0 -20px;
| |
− | width: 100%;
| |
− | }
| |
− | table {
| |
− | border-collapse: collapse;
| |
− | border-spacing: 0;
| |
− | margin: 1em 0;
| |
− | }
| |
− | td {
| |
− | border: 1px solid #dddddd;
| |
− | padding: 0.5em 1em;
| |
− | }
| |
− |
| |
− | /* MEDIA QUERY */
| |
− | @media only screen and (max-width: 65em) {
| |
− | .logo {
| |
− | margin-left: 10px;
| |
− | }
| |
− | }
| |
− | @media only screen and (max-width: 57.5em) {
| |
− | .menu ul {
| |
− | width: 80px;
| |
− | }
| |
− | }
| |
− | @media only screen and (max-width: 53.75em) {
| |
− | .article .wrapper {
| |
− | margin: 0 10px;
| |
− | }
| |
− | .buttons-tabs {
| |
− | margin: 0 0 0 20px;
| |
− | }
| |
− | #HQ_page .article .wrapper-title h1 {
| |
− | margin-left: 10px;
| |
− | }
| |
− | }
| |
− | @media only screen and (max-width: 46.875em) {
| |
− | .menu ul {
| |
− | width: 75px;
| |
− | }
| |
− | }
| |
− | </style>
| |
− |
| |
− | <script>
| |
− | document.addEventListener("DOMContentLoaded", function(){
| |
− | try{
| |
− | var pd_button_tab1 = document.getElementById("pd_button_tab1");
| |
− | var pd_tab1 = document.getElementById("pd_tab1");
| |
− | pd_button_tab1.addEventListener("click", function(){ pd_tab1.style.display = "block"; pd_tab2.style.display = "none"; pd_tab3.style.display = "none"; });
| |
− | } catch(e){}
| |
− | try{
| |
− | var pd_button_tab2 = document.getElementById("pd_button_tab2");
| |
− | var pd_tab2 = document.getElementById("pd_tab2");
| |
− | pd_button_tab2.addEventListener("click", function(){ pd_tab1.style.display = "none"; pd_tab2.style.display = "block"; pd_tab3.style.display = "none"; });
| |
− | } catch(e){}
| |
− | try{
| |
− | var pd_button_tab3 = document.getElementById("pd_button_tab3");
| |
− | var pd_tab3 = document.getElementById("pd_tab3");
| |
− | pd_button_tab3.addEventListener("click", function(){ pd_tab1.style.display = "none"; pd_tab2.style.display = "none"; pd_tab3.style.display = "block"; });
| |
− | } catch(e){}
| |
− |
| |
− | var home;
| |
− | try{
| |
− | home = document.getElementById("home");
| |
− | }catch(e){}
| |
− | if(home){
| |
− | jQuery(".main-image").css({ opacity: 0 });
| |
− | jQuery(".main-image").animate({ opacity: 1 },500);
| |
− | }else{
| |
− | jQuery(".main-image").css({ opacity: 0 });
| |
− | jQuery(".main-image").animate({ opacity: 1 },500,function(){
| |
− | setTimeout(function(){ jQuery("html, body").animate({ scrollTop: "575px" },800); }, 800);
| |
− | });
| |
− | }
| |
− | });
| |
− | </script>
| |
− |
| |
− | </head>
| |
− |
| |
− | <body>
| |
− | <div class="il_header">
| |
− | <div class="wrapper">
| |
− | <div class="logo"><a href="http://ingenuitylab.ca"><img src="https://static.igem.org/mediawiki/2016/8/87/T--IngenuityLab_Canada--il_logo_img.png" /></a></div>
| |
− | <div class="menu">
| |
− | <ul><a href="https://2016.igem.org/Team:IngenuityLab_Canada/dNANO">dNANO</a></ul>
| |
− | <ul><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Achievements"">Achievements</a></ul>
| |
− | <ul><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Parts"">Parts</a></ul>
| |
− | <ul>Project
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Description">Description</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Protocols">Protocols</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Results">Results</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Attributions">Attributions</a></li>
| |
− | </ul>
| |
− | <ul>Practices
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Community">Community Outreach</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Practices">Human Practices</a></li>
| |
− | </ul>
| |
− | <ul>Team
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Members">Members</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Sponsors">Sponsors</a></li>
| |
− | <li><a
| |
− | href="https://2016.igem.org/Team:IngenuityLab_Canada/Blog">Blog</a></li>
| |
− | </ul>
| |
− | <ul><a href="https://2016.igem.org/Team:IngenuityLab_Canada/Safety">Safety</a></ul>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="contents">
| |
− | <div class="main-image"><div class="wrapper"><img src="https://static.igem.org/mediawiki/2016/2/25/T--IngenuityLab_Canada--il_icons_img.jpg" /></div></div>
| |
− | <div class="article">
| |