Difference between revisions of "Team:Peking/Lab"

Line 27: Line 27:
 
         body {
 
         body {
 
             background-color: #FAFAFA;
 
             background-color: #FAFAFA;
            !important;
+
        !important;
 
         }
 
         }
  
Line 127: Line 127:
  
 
         .demo-card-wide.mdl-card {
 
         .demo-card-wide.mdl-card {
             margin-bottom: 20px;
+
             margin-left: 50px;
             margin-top: 110px;
+
            margin-right: 50px;
 +
             margin-top: 120px;
 +
            margin-bottom: 50px;
 
             width: auto;
 
             width: auto;
            height: auto;
 
 
         }
 
         }
 
         .demo-card-wide > .mdl-card__title {
 
         .demo-card-wide > .mdl-card__title {
            padding-left: 40px;
 
            padding-right: 40px;
 
 
             color: #fff;
 
             color: #fff;
             height: 350px;
+
             height: 360px;
 
         }
 
         }
 
         .demo-card-wide > .mdl-card__menu {
 
         .demo-card-wide > .mdl-card__menu {
Line 144: Line 143:
 
     </style>
 
     </style>
  
 +
    <div class="demo-card-wide mdl-card mdl-shadow--2dp">
 +
        <div class="mdl-card__title" style="background: url('https://static.igem.org/mediawiki/2017/6/69/Peking_Safety_Background.jpeg') center / cover; padding-left: 50px;">
 +
            <div class="mdl-card__title-text">
 +
                <h1 style="font-size: xx-large; color: white"><strong>Safety</strong></h1>
 +
            </div>
 +
        </div>
  
  
    <div class="mdl-grid mdl-grid--no-spacing" style="margin: 0px">
 
        <div class="mdl-cell mdl-cell--6-col">
 
            <div class="demo-card-wide mdl-card mdl-shadow--2dp" style="margin-left: 50px; margin-right: 30px;">
 
                <div class="mdl-card__title" style="background: url('https://static.igem.org/mediawiki/2017/f/fe/Peking_botebook_background.jpeg') center / cover;">
 
                    <h1 class="mdl-card__title-text"><strong>Notebook</strong></h1>
 
                </div>
 
                <div class="mdl-card__supporting-text" style="line-height: 2em;text-align: justify; color: #3A3A3A; padding-left: 30px; padding-right: 10px; padding-top: 30px; padding-bottom:30px">
 
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 
                    Mauris sagittis pellentesque lacus eleifend lacinia...L<br><br>
 
                    <a class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect" href = "https://2017.igem.org/Team:Peking/Notebook" style="background-color: red; color: white;">
 
                        Read More
 
                    </a>
 
                </div>
 
  
 +
        <div class="mdl-card__supporting-text" style="line-height: 2em;text-align: justify; color: #3A3A3A; padding-left: 50px; padding-top: 50px; padding-bottom:50px">
 +
            <section class="docs-toc docs-text-styling">
 +
                <nav class="section-content">
 +
                    <ul style="margin-left: 0px;">
  
            </div>
+
                        <li><a href="#lorem1">Description</a></li>
        </div>
+
        <div class="mdl-cell mdl-cell--6-col">
+
            <div class="demo-card-wide mdl-card mdl-shadow--2dp" style="margin-right: 50px; margin-left: 30px;">
+
                <div class="mdl-card__title" style="background: url('https://static.igem.org/mediawiki/2017/f/fb/Peking_Protocols_Background.jpg') center / cover;">
+
                    <h1 class="mdl-card__title-text"><strong>Protocols</strong></h1>
+
                </div>
+
                <div class="mdl-card__supporting-text" style="line-height: 2em;text-align: justify; color: #3A3A3A; padding-left: 30px; padding-right: 40px; padding-top: 30px; padding-bottom:30px">
+
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...L<br><br>
+
                    <a class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect" href = "https://2017.igem.org/Team:Peking/Protocols" style="background-color: #FF3942; color: white;">
+
                        Read More
+
                    </a>
+
                </div>
+
  
 +
                        <li><a href="https://getmdl.io/components/index.html#layout-section/grid">Description</a>
 +
                        </li>
  
            </div>
+
                        <li><a href="https://getmdl.io/components/index.html#layout-section/tabs">Description</a>
        </div>
+
                        </li>
    </div>
+
    <div class="mdl-grid mdl-grid--no-spacing" style="margin: 0px">
+
        <div class="mdl-cell mdl-cell--6-col">
+
            <div class="demo-card-wide mdl-card mdl-shadow--2dp" style="margin-left: 50px; margin-right: 30px; margin-top: 30px; margin-bottom: 100px">
+
                <div class="mdl-card__title" style="background: url('https://static.igem.org/mediawiki/2017/6/69/Peking_Safety_Background.jpeg') center / cover;">
+
                    <h1 class="mdl-card__title-text"><strong>Safety</strong></h1>
+
                </div>
+
                <div class="mdl-card__supporting-text" style="line-height: 2em;text-align: justify; color: #3A3A3A; padding-left: 30px; padding-right: 10px; padding-top: 30px; padding-bottom:30px">
+
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
                    Mauris sagittis pellentesque lacus eleifend lacinia...L<br><br>
+
                    <a class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect" href = "https://2017.igem.org/Team:Peking/Safety" style="background-color: orangered; color: white;">
+
                        Read More
+
                    </a>
+
                </div>
+
  
 +
                        <li><a href="https://getmdl.io/components/index.html#layout-section/footer">Description</a>
 +
                        </li>
  
            </div>
+
                    </ul>
        </div>
+
                </nav>
        <div class="mdl-cell mdl-cell--6-col">
+
            </section>
             <div class="demo-card-wide mdl-card mdl-shadow--2dp" style="margin-right: 50px; margin-left: 30px; margin-top: 30px; margin-bottom: 50px">
+
             <br>
                <div class="mdl-card__title" style="background: url('https://static.igem.org/mediawiki/2017/f/ff/Peking_Interlab_background.jpeg') center / cover;">
+
            Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    <h1 class="mdl-card__title-text"><strong>Interlab</strong></h1>
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                </div>
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                <div class="mdl-card__supporting-text" style="line-height: 2em;text-align: justify; color: #3A3A3A; padding-left: 30px; padding-right: 40px; padding-top: 30px; padding-bottom:30px">
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    Mauris sagittis pellentesque lacus eleifend lacinia...L<br><br>
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    <a class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent mdl-js-ripple-effect" href = "https://2017.igem.org/Team:Peking/InterLab" style="background-color: #FDA441; color: white;">
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                        Read More
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                    </a>
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                </div>
+
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 +
            Mauris sagittis pellentesque lacus eleifend lacinia...<br><br><br><br><br><br>
 +
            <a class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect" href = "https://2017.igem.org/Team:Peking/Lab" style="background-color: #CB2C32; color: white;">
 +
                Back < Lab
 +
            </a>
  
 +
            <a id="demo-menu-top-left"
 +
              class="mdl-button mdl-button--accent mdl-js-button mdl-button--raised mdl-js-ripple-effect" style="background-color:orangered; color: white;">
 +
                Goto > Lab/...
 +
            </a>
  
             </div>
+
             <ul class="mdl-menu mdl-menu--top-left mdl-js-menu mdl-js-ripple-effect"
        </div>
+
                data-mdl-for="demo-menu-top-left" style="margin-left: 0px">
    </div>
+
                <a class="mdl-menu__item" href="https://2017.igem.org/Team:Peking/Notebook" style="color: #000;">Notebook</a>
  
 +
                <a class="mdl-menu__item" href="https://2017.igem.org/Team:Peking/Protocols" style="color: #000;">Protocols</a>
  
 +
                <a class="mdl-menu__item" href="https://2017.igem.org/Team:Peking/InterLab" style="color: #000;">InterLab</a>
  
 +
            </ul>
  
  
 +
 +
        </div>
 +
 +
 +
        <div class="mdl-card__menu">
 +
            <a class="mdl-button mdl-button--icon mdl-js-button mdl-js-ripple-effect">
 +
                <i class="material-icons">opacity</i>
 +
            </a>
 +
        </div>
 +
    </div>
  
 
     <section class="docs-text-styling download mdl-color--grey-800" style="height: 1px"></section>
 
     <section class="docs-text-styling download mdl-color--grey-800" style="height: 1px"></section>
Line 280: Line 300:
  
 
</main>
 
</main>
 +
  
  
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 06:12, 28 October 2017

Peking iGEM 2017

Safety


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sagittis pellentesque lacus eleifend lacinia...





Back < Lab Goto > Lab/...