|
|
(37 intermediate revisions by 2 users not shown) |
Line 60: |
Line 60: |
| text-align: center; | | text-align: center; |
| position: relative; | | position: relative; |
− | height: calc(100vh - 28px); | + | height: calc(100vh - 20px); |
| } | | } |
| | | |
Line 92: |
Line 92: |
| { | | { |
| position: absolute; | | position: absolute; |
− | top: calc(100vh - 188px); | + | top: calc(100vh - 180px); |
| height: 140px; | | height: 140px; |
| width: 100%; | | width: 100%; |
Line 102: |
Line 102: |
| | | |
| <div class="page" id="page1"> | | <div class="page" id="page1"> |
− | <div class="bg" data-anchor-target="#page1" data--0p-top="height: 90%" data--100p-top="height: 0%"> | + | <div class="bg"> |
− | <div id="logo"data-anchor-target="#sponsors" data-200-top="opacity: 1" data-199-top="opacity: 0"> | + | <div id="logo"> |
| <h1><img src="/wiki/images/1/15/Czech_Republic_home-logo.png" alt="The IOD Band" width="600" /></h1> | | <h1><img src="/wiki/images/1/15/Czech_Republic_home-logo.png" alt="The IOD Band" width="600" /></h1> |
| </div> | | </div> |
| </div> | | </div> |
| <div id="sponsors"> | | <div id="sponsors"> |
− | <img src="/wiki/images/b/bd/Czech_Republic_sponsors.png" alt="Sponsors" width="700" /> | + | <img src="/wiki/images/b/bd/Czech_Republic_sponsors.png" alt="Sponsors" width="1094" usemap="#sponsors" /> |
| + | |
| + | <map name="sponsors"> |
| + | <area shape="rect" coords="15,30,195,50" href="http://ccy.zcu.cz" alt="GeorgievLab" target="_blank" /> |
| + | </map> |
| </div> | | </div> |
| </div> | | </div> |
Line 229: |
Line 233: |
| { | | { |
| float: left; | | float: left; |
| + | } |
| + | |
| + | #title #sep2-3 |
| + | { |
| + | width: 1200px; |
| + | background-color: transparent; |
| + | top: -200px; |
| + | background-position: 150px center; |
| + | margin: 0px auto -250px; |
| } | | } |
| | | |
Line 293: |
Line 306: |
| } | | } |
| | | |
− | #title #page3 > header | + | #title #page3 header |
| { | | { |
| padding: 0 55px; | | padding: 0 55px; |
| } | | } |
| | | |
− | #title #page3 > header p | + | #title #page3 header p |
| { | | { |
| font-size: 25px; | | font-size: 25px; |
Line 306: |
Line 319: |
| { | | { |
| position: absolute; | | position: absolute; |
− | width: 205px; | + | width: 235px; |
− | height: 55px;
| + | |
| border: 5px solid #303030; | | border: 5px solid #303030; |
| background-color: white; | | background-color: white; |
Line 325: |
Line 337: |
| { | | { |
| text-align: left; | | text-align: left; |
− | font-size: 15px; | + | font-size: 18px; |
| + | margin-bottom: -5px; |
| } | | } |
| | | |
Line 344: |
Line 357: |
| top: 640px; | | top: 640px; |
| left: 420px; | | left: 420px; |
− | height: 70px;
| |
| } | | } |
| | | |
Line 365: |
Line 377: |
| #title #page3 ul li:first-child | | #title #page3 ul li:first-child |
| { | | { |
− | top: 280px; | + | top: 290px; |
| left: 955px; | | left: 955px; |
| width: 155px; | | width: 155px; |
Line 432: |
Line 444: |
| <div id="yeast-blue" data-anchor-target="#page3 header h2" data-100-top="left: 565px; opacity: 1" data-500-top="left: 700px; opacity: 0"></div> | | <div id="yeast-blue" data-anchor-target="#page3 header h2" data-100-top="left: 565px; opacity: 1" data-500-top="left: 700px; opacity: 0"></div> |
| | | |
− | <div data-anchor-target="#page3 header h2" data-top="opacity: 1" data-100-top="opacity: 0"> | + | <div data-anchor-target="#page3 header h2" data-50-top="opacity: 1" data-150-top="opacity: 0"> |
| <div class="lines"></div> | | <div class="lines"></div> |
| | | |
Line 508: |
Line 520: |
| position: absolute; | | position: absolute; |
| width: 205px; | | width: 205px; |
− | height: 55px;
| |
| border: 5px solid #303030; | | border: 5px solid #303030; |
| background-color: white; | | background-color: white; |
Line 527: |
Line 538: |
| text-align: left; | | text-align: left; |
| font-size: 18px; | | font-size: 18px; |
− | margin-top: -5px; | + | margin-bottom: -5px; |
| line-height: 1.4em; | | line-height: 1.4em; |
| } | | } |
Line 536: |
Line 547: |
| left: 0px; | | left: 0px; |
| width: 375px; | | width: 375px; |
− | height: 60px;
| |
| } | | } |
| | | |
Line 543: |
Line 553: |
| top: 635px; | | top: 635px; |
| left: 140px; | | left: 140px; |
− | height: 115px;
| |
| width: 290px; | | width: 290px; |
| } | | } |
Line 552: |
Line 561: |
| left: 745px; | | left: 745px; |
| width: 385px; | | width: 385px; |
− | height: 60px;
| |
| } | | } |
| | | |
Line 588: |
Line 596: |
| <div class="img" data-anchor-target="#page4 header h2" data-top="opacity: 1" data-200-top="opacity: 0"></div> | | <div class="img" data-anchor-target="#page4 header h2" data-top="opacity: 1" data-200-top="opacity: 0"></div> |
| | | |
− | <div class="text" data-anchor-target="#page4 header h2" data-top="opacity: 1" data-100-top="opacity: 0"> | + | <div class="text" data-anchor-target="#page4 header h2" data-50-top="opacity: 1" data-150-top="opacity: 0"> |
| <div class="lines"></div> | | <div class="lines"></div> |
| | | |
Line 603: |
Line 611: |
| <div class="block ohl"> | | <div class="block ohl"> |
| <h3>Output Haploid Library</h3> | | <h3>Output Haploid Library</h3> |
− | <p>output haploids interface with inputs haloids and generate various intercellular signals</p> | + | <p>output haploids interface with input haploids and generate various intercellular signals</p> |
| </div> | | </div> |
| | | |
Line 651: |
Line 659: |
| position: absolute; | | position: absolute; |
| width: 205px; | | width: 205px; |
− | height: 55px;
| |
| border: 5px solid #303030; | | border: 5px solid #303030; |
| background-color: white; | | background-color: white; |
Line 670: |
Line 677: |
| text-align: left; | | text-align: left; |
| font-size: 18px; | | font-size: 18px; |
− | margin-top: -5px; | + | margin-bottom: -5px; |
| line-height: 1.4em; | | line-height: 1.4em; |
| } | | } |
Line 679: |
Line 686: |
| right: 40px; | | right: 40px; |
| width: 290px; | | width: 290px; |
− | height: 115px;
| |
| } | | } |
| | | |
| #title #page5 .block.gl | | #title #page5 .block.gl |
| { | | { |
− | top: 570px; | + | top: 590px; |
| left: 20px; | | left: 20px; |
| width: 290px; | | width: 290px; |
− | height: 160px;
| |
| } | | } |
| | | |
Line 695: |
Line 700: |
| right: 40px; | | right: 40px; |
| width: 290px; | | width: 290px; |
− | height: 115px;
| |
| } | | } |
| | | |
Line 801: |
Line 805: |
| <header data-anchor-target="#page5" data-200-top="opacity: 1" data-500-top="opacity: 0"> | | <header data-anchor-target="#page5" data-200-top="opacity: 1" data-500-top="opacity: 0"> |
| <h2>This Is What They Do</h2> | | <h2>This Is What They Do</h2> |
− | <p>IODs use group logic to <strong>find in blood samples and make visible</strong> tumor cells with a given phenotype.</p> | + | <p>IODs use group logic to <strong>find in blood samples and make visible</strong> tumor cells with a given marker profile.</p> |
| </header> | | </header> |
| | | |
Line 809: |
Line 813: |
| </div> | | </div> |
| | | |
− | <p class="tube-info">IOD bands do in a test tube what normally requires days and expensive equipment to do in the lab.</p> | + | <p class="tube-info"><strong>IOD bands do in a test tube what normally requires days and expensive equipment to do in the lab.</strong></p> |
| </div> | | </div> |
| | | |
− | <div class="text" data-anchor-target="#page5 header h2" data-top="opacity: 1" data-100-top="opacity: 0"> | + | <div class="text" data-anchor-target="#page5 header h2" data-50-top="opacity: 1" data-150-top="opacity: 0"> |
| <div class="procedure"> | | <div class="procedure"> |
| <h3>Procedure*</h3> | | <h3>Procedure*</h3> |
Line 841: |
Line 845: |
| <h3>Group Logic</h3> | | <h3>Group Logic</h3> |
| <p> | | <p> |
− | Antigen recognition and intercellular communication create a logical network by which a single cell with a given surface marker profile is identified in a back ground of millions. | + | Antigen recognition and intercellular communication create a logical network by which a single cell with a given surface marker profile is identified in a background of millions. |
| </p> | | </p> |
| </div> | | </div> |
Line 849: |
Line 853: |
| </section> | | </section> |
| | | |
| + | <section> |
| + | <style> |
| + | |
| + | #title #page6 |
| + | { |
| + | margin: 50px 0 0 0; |
| + | padding: 0 0 50px 0; |
| + | position: relative; |
| + | width: 100%; |
| + | background-color: #303030; |
| + | min-height: 725px; |
| + | height: calc(100vh - 40px); |
| + | } |
| + | |
| + | #title #page6 > div |
| + | { |
| + | width: 960px; |
| + | margin: 0 auto; |
| + | } |
| + | |
| + | #title #page6 header |
| + | { |
| + | margin: 0; |
| + | text-align: left; |
| + | padding: 0 48px; |
| + | } |
| + | |
| + | #title #page6 h2 |
| + | { |
| + | color: white; |
| + | font-size: 58px; |
| + | text-transform: uppercase; |
| + | padding: 50px 0 0 0; |
| + | } |
| + | |
| + | #title #page6 p |
| + | { |
| + | color: white; |
| + | font-size: 15px; |
| + | padding: 0 0 15px 0; |
| + | margin: -5px 0 0 5px; |
| + | text-transform: uppercase; |
| + | } |
| + | |
| + | </style> |
| + | |
| + | <div class="page" id="page6" data-anchor-target="#page6" data-200-top="opacity: 1" data-900-top="opacity: 0"> |
| + | <div> |
| + | <header> |
| + | <h2>These are the IOD inventors</h2> |
| + | <p>The first Czech iGEM team</p> |
| + | </header> |
| + | <img alt="The IOD inventors" src="/wiki/images/5/54/Czech_Republc_TeamTitle.jpg" width="960" /> |
| + | </div> |
| + | </div> |
| + | </section> |
| <!-- It's not possible to upload JS file and inlining doesn't work. This is only solution. In case removing this file from Inet, application have fallback (like for mobile version). --> | | <!-- It's not possible to upload JS file and inlining doesn't work. This is only solution. In case removing this file from Inet, application have fallback (like for mobile version). --> |
| <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/skrollr/0.6.30/skrollr.min.js"></script> | | <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/skrollr/0.6.30/skrollr.min.js"></script> |
Line 860: |
Line 920: |
| }; | | }; |
| | | |
− | if (!isMobile() && skrollr) | + | if (!isMobile()) |
| { | | { |
| + | // Mediawiki escapes & to & |
| + | if (skrollr) |
| + | { |
| var s = skrollr.init(); | | var s = skrollr.init(); |
− | var bg = document.getElementById('page1').getElementsByTagName('div')[0];
| + | } |
− | bg.style.position = "fixed";
| + | |
| } | | } |
| //]]> | | //]]> |