|
|
Line 105: |
Line 105: |
| <!------------------------------------------ HEADER END --------------------------------------------------> | | <!------------------------------------------ HEADER END --------------------------------------------------> |
| | | |
− | | + | <section class="page-content fixed-header-content"> |
| + | <!---------- SUB HEADLINE -------------> |
| + | <h2 class="page-subheadline">Subheadline</h2> |
| + | |
| + | <!------------------------------------------ TWO COLUMN IMG LEFT --------------------------------------------------> |
| + | |
| + | <div class="width-limit"> |
| + | <div class="two-columns"> |
| + | <div> |
| + | <!-- IMAGE --> |
| + | <img class="is-revealing" src="https://static.igem.org/mediawiki/2019/5/54/T--Humboldt_Berlin--ideonella_grafik.png" alt="ideonella grafic" /> |
| + | </div> |
| + | <div> |
| + | <!-----------------------------------------------------------------------> |
| + | <!----------------------------TEXT----------------------------> |
| + | <!-----------------------------------------------------------------------> |
| + | <h3 class="headline3">Text Headline</h3> |
| + | <p class="block-text medium-sized"> |
| + | Text for the two column thingy here |
| + | </p> |
| + | </div> |
| + | </div> |
| + | |
| + | <!--------------------------------------- TWO COLUMN IMG LEFT END -----------------------------------------------> |
| + | |
| + | <!---------------------------------------------- QUOTE --------------------------------------------------------> |
| + | |
| + | <blockquote class="quote image-left"> |
| + | <div class="quote-image-container"> |
| + | <!-- QUOTE IMAGE --> |
| + | <img src="https://static.igem.org/mediawiki/2019/2/2d/T--Humboldt_Berlin--flasche_igem.png" alt="plastic bottle illustration" /> |
| + | </div> |
| + | <div class="block-text big-underline big-text"> |
| + | <!-----------------------------------------------------------------------> |
| + | <!---------------------------- Quote Text ----------------------------> |
| + | <!-----------------------------------------------------------------------> |
| + | <p><b> |
| + | Have the Quote Text Here - it is underlined |
| + | </b></p> |
| + | </div> |
| + | </blockquote> |
| + | |
| + | <!---------------------------------------------- QUOTE END -------------------------------------------------------> |
| + | |
| + | <!------------------------------------------ TWO COLUMN IMG RIGHT ------------------------------------------------> |
| + | |
| + | <div class="two-columns"> |
| + | <div> |
| + | <!-----------------------------------------------------------------------> |
| + | <!------------------IGEM PROJECTS THAT INSPIRED US-----------------------> |
| + | <!-----------------------------------------------------------------------> |
| + | <h3 class="headline3">Headline</h3> |
| + | <p class="block-text medium-sized"> |
| + | Text for the two column image right block |
| + | </p> |
| + | </div> |
| + | <div> |
| + | <!--- IMAGE ---> |
| + | <img class="is-revealing" src="https://static.igem.org/mediawiki/2019/b/bc/T--Humboldt_Berlin--microplastic_icon.png" alt="microplastic icon" /> |
| + | </div> |
| + | </div> |
| + | |
| + | <!--------------------------------------- TWO COLUMN IMG RIGHT END ------------------------------------------------> |
| + | |
| + | <!------------------------------------------ TWO COLUMN LONG TEXT ------------------------------------------------> |
| + | <div class="two-columns-headline"> |
| + | <!-- HEADLINE --> |
| + | <h3 class="headline3">Long text headline</h3> |
| + | </div> |
| + | <div class="two-columns block-text medium-sized not-centered no-margin-top"> |
| + | <div> |
| + | <!-- TEXT - PARAGRAPHS ARE WRAPPED IN <p> TAGS --> |
| + | <p> |
| + | Paragraph Left 1 |
| + | </p> |
| + | <p> |
| + | Paragraph Left 2 |
| + | </p> |
| + | <br /> |
| + | <!-- IMAGE INBETWEEN --> |
| + | <img src="https://static.igem.org/mediawiki/2019/4/42/T--Humboldt_Berlin--chlamy_overview-cloning-system.png" alt="Pverview of the hierarchical and modular cloning system" /> |
| + | <p> |
| + | Paragraph Left 3 |
| + | </p> |
| + | </div> |
| + | <div> |
| + | <p> |
| + | Paragraph Right 1 |
| + | </p> |
| + | <p> |
| + | Paragraph Right 2 |
| + | </p> |
| + | <p> |
| + | Paragraph Right 3 |
| + | </p> |
| + | <p> |
| + | Paragraph Right 4 |
| + | </p> |
| + | </div> |
| + | </div> |
| + | </div> |
| + | |
| + | <!------------------------------------------ TWO COLUMN LONG TEXT END --------------------------------------------> |
| + | |
| + | <!------------------------------------------ DEVIDER LINE --------------------------------------------> |
| + | <div class="greyblue-devider"></div> |
| + | <!------------------------------------------ DEVIDER LINE END --------------------------------------------> |
| + | |
| + | <!------------------------------------------ TWO COLUMN SMALL TEXT --------------------------------------------> |
| + | |
| + | <section class="width-limit"> |
| + | <div class="two-columns block-text not-centered small-sized"> |
| + | <div> |
| + | <!-- TEXT LEFT COLUMN --> |
| + | <p>Small Text Left Column |
| + | </div> |
| + | <div> |
| + | <!-- TEXT RIGHT COLUMN --> |
| + | <p>Small Text Right Column</p> |
| + | </div> |
| + | </div> |
| + | </section> |
| + | |
| + | <!------------------------------------------ TWO COLUMN SMALL TEXT END ----------------------------------------> |
| + | |
| + | </section> |
| + | |
| + | </div> |
| | | |
| | | |