Difference between revisions of "Team:Sheffield/project/device/microfluids"

(Created page with "<html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <met...")
 
Line 24: Line 24:
 
                 <script  
 
                 <script  
 
                   src="https://2016.igem.org/Template:Sheffield/scripts/banner?action=raw&ctype=text/javascript"></script>
 
                   src="https://2016.igem.org/Template:Sheffield/scripts/banner?action=raw&ctype=text/javascript"></script>
 +
                <script
 +
                  src="https://2016.igem.org/Template:Sheffield/scripts/model?action=raw&ctype=text/javascript"></script>
 
                  
 
                  
 
                 <script  
 
                 <script  
Line 61: Line 63:
 
         font-size:25px;
 
         font-size:25px;
 
       }
 
       }
 +
 +
.model {
 +
        border:#9246d0 3px solid;
 +
        padding:10px;
 +
        }
 +
.model img {
 +
        width:100%;
 +
        }
 +
 +
#shield .modeltable td{
 +
    color: white;
 +
    text-align:left;
 +
    padding-right: 30px;
 +
    border-bottom: 1px solid white;
 +
    font-size: 20px;
 +
}
 +
 +
#shield .modeltable th{
 +
    color: #eac100;
 +
    text-align:left;
 +
    padding-right: 30px;
 +
    border-bottom: 2px solid white;
 +
    font-size: 25px;
 +
}
 +
#shield .modelcaption {
 +
    font-size: 20px
 +
}
 +
 +
#shield u{
 +
    text-decoration:underline;
 +
    color:#eac100;
 +
}
  
 
@media (min-width:992px) and (max-width:1199px) {
 
@media (min-width:992px) and (max-width:1199px) {
Line 74: Line 108:
 
         font-size:20px;
 
         font-size:20px;
 
}
 
}
 +
#shield .modeltable th{
 +
      font-size:20px;
 
}
 
}
 +
#shield .modeltable td{
 +
      font-size:15px;
 +
}
 +
#shield .modelcaption {
 +
    font-size: 15px
 +
}
 +
}
 +
  
 
@media (max-width:767px) {  
 
@media (max-width:767px) {  
Line 93: Line 137:
 
       font-size:18px;
 
       font-size:18px;
 
       }
 
       }
 +
#shield .modeltable th{
 +
      font-size:15px;
 
}
 
}
−
        
+
#shield .modeltable td{
 +
       font-size:10px;
 +
}
 +
#shield .modelcaption {
 +
    font-size: 10px
 +
}
 +
}
 +
@media (max-width:450px) {
 +
#shield .banner p {
 +
      font-size:12px;
 +
}
 +
}
 +
 
 
</style>
 
</style>
  
Line 268: Line 326:
 
</table>
 
</table>
 
</div>
 
</div>
 +
               
 
                 <table id="banner-section">
 
                 <table id="banner-section">
 
<tr>
 
<tr>
Line 285: Line 344:
 
</div>
 
</div>
 
</th>
 
</th>
−
<th>
+
−
<div class="banner-hold">
+
−
<img src="https://static.igem.org/mediawiki/2016/5/5e/T--Sheffield--banner-hold.png">
+
−
</div>
+
−
</th>
+
−
<th>
+
−
+
−
</th>
+
 
</tr>
 
</tr>
 
<tr>
 
<tr>
Line 300: Line 352:
 
<div class="cont button1">
 
<div class="cont button1">
 
<div class="banner">
 
<div class="banner">
−
<p>STUDENTS</p>
+
<p>WHY MICROFLUIDICS?</p>
 
</div>
 
</div>
 
</div>
 
</div>
Line 309: Line 361:
 
<table class="banner-inside">
 
<table class="banner-inside">
 
<th>
 
<th>
−
+
<div class="cont button2">
 +
<div class="banner">
 +
<p>IDEAS FOR MIXING</p>
 +
</div>
 +
</div>
 
</th>
 
</th>
 
</table>
 
</table>
Line 316: Line 372:
 
<table class="banner-inside">
 
<table class="banner-inside">
 
<th>
 
<th>
−
+
<div class="cont button3">
 +
<div class="banner">
 +
<p>TESTING LENGTH & WIDTH</p>
 +
</div>
 +
</div>
 
</th>
 
</th>
 
</table>
 
</table>
−
</td>
+
</td>
−
<td>
+
−
                                                <table class="banner-inside">
+
−
<th>
+
−
+
−
</th>
+
−
</table>
+
−
+
−
</td>
+
−
<td>
+
−
+
−
</td>
+
 
</tr>
 
</tr>
 
</table>
 
</table>
 +
               
 +
                <div class="box1">
 
<div class = "jumbotron">
 
<div class = "jumbotron">
−
<p>SCIENCE! and other stuff </p>
+
<h2>What is Microfluidics?</h2>
−
</div>
+
<p>Some paragraph.</p>
 +
<h2>Identifying Requirements</h2>
 +
<p>Some paragraph.</p>
 +
<h2>Why Microfluidics?</h2>
 +
<p>Some paragraph.</p>
 +
                </div>
 +
                </div>
 +
               
 +
                <div class="box2">
 +
<div class = "jumbotron">
 +
 
 +
<h2>The Theory</h2>
 +
<p>Some paragraph.</p>
 +
 
 +
<h2>The Design Ideas</h2>
 +
 
 +
<p><u>Design 1: The Capillary Stop Valve Idea</u></p>
 +
<p>Some paragraph.</p>
 +
<p><u>Design 2: The Well Idea</u></p>
 +
<p>Some paragraph.</p>
 +
<p><u>Design 3: The Mixing Chamber Idea</u></p>
 +
<p>Some paragraph.</p>
 +
 
 +
<h2>The Results</h2>
 +
 
 +
<p><u>Design 1: The Capillary Stop Valve Idea</u></p>
 +
<p>Some paragraph.</p>
 +
<p><u>Design 2: The Well Idea</u></p>
 +
<p>Some paragraph.</p>
 +
<p><u>Design 3: The Mixing Chamber Idea</u></p>
 +
<p>Some paragraph.</p>
 +
 
 +
                </div>
 +
                </div>
 +
               
 +
                <div class="box3">
 +
<div class = "jumbotron">
 +
<h2>The Theory</h2>
 +
                       
 +
<p>This is some paragraph.</p>
 +
 
 +
<h2>The Results</h2>
 +
 
 +
<p>This is some paragraph</p>
 +
                </div>
 +
                </div>
 +
       
 +
               
 
     </div>
 
     </div>
 
     </div>
 
     </div>

Revision as of 11:33, 17 October 2016

A template page

MICROFLUIDICS

What is Microfluidics?

Some paragraph.

Identifying Requirements

Some paragraph.

Why Microfluidics?

Some paragraph.

The Theory

Some paragraph.

The Design Ideas

Design 1: The Capillary Stop Valve Idea

Some paragraph.

Design 2: The Well Idea

Some paragraph.

Design 3: The Mixing Chamber Idea

Some paragraph.

The Results

Design 1: The Capillary Stop Valve Idea

Some paragraph.

Design 2: The Well Idea

Some paragraph.

Design 3: The Mixing Chamber Idea

Some paragraph.

The Theory

This is some paragraph.

The Results

This is some paragraph