Difference between revisions of "Team:Warwick"

 
(319 intermediate revisions by 4 users not shown)
Line 1: Line 1:
−
{{Warwick}}
 
−
<html>
 
−
<h2> Welcome to Team Warwick iGEM 2015! </h2>
 
−
<p> Hello There! Thank you for visiting our site! </p>
 
  
−
<h4>Project Overview </h4>
 
−
<p>Our focus is on creating a tool set that uses self assembly to arrange genetic material such as DNA and cells using properties inherent in Zinc Finger DNA binding domains. The project will work in progressive bands of complexity; constructing the Zinc Finger DNA as a tool, and then using this tool to produce genetic structures and even colour images on a nanoscale. This work could eventually lead to the assembly of 3D structures which has the potential in the construction and assembly of designed materials with enhanced properties.</p>
 
  
 +
<html>
  
−
<div class="highlightBox">
+
<style type="text/css">
−
<h4> Starting Our Project </h4>
+
−
<p>ADD TEXT</p>
+
−
<p>ADD TEXT</p>
+
−
</div>
+
  
−
//add box slider once images chosen
+
 +
.firstHeading {
 +
display: none;
 +
}
 +
 +
  
−
<p>      If you want more information about our project or wish to collaborate, contact us at: </p>
+
−
<p>      igem@warwick.ac.uk </p>
+
</style>
  
−
</div></div> <!--These are the closing tags for div id="mainContainer" and div id="contentContainer". The corresponding opening tags appear in the template that is {{included}} at the top of this page.-->
+
<head>
 +
<div>
  
  
 +
 +
 +
 +
 +
<style src = "" type = "text/css">
 +
 +
 +
body {
 +
  border: 0px;
 +
}
 +
 +
/* makes the white boxes go away */
 +
#content{
 +
background-image:url(https://static.igem.org/mediawiki/2015/d/d7/WarwickBg.jpg);
 +
border: 0px;
 +
float: center;
 +
                                width: 100%;
 +
 +
}
 +
 +
 +
 +
<meta charset="utf-8">
 +
<meta name="viewport" content="width=device-width, initial-scale=1">
 +
 +
 +
</style>
 +
 +
 +
<style>
 +
 +
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
 +
margin: 0;
 +
padding: 0;
 +
border: 0;
 +
font-size: 100%;
 +
 +
vertical-align: baseline;
 +
}
 +
 +
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
 +
display: block;
 +
}
 +
 +
body {
 +
line-height: 1;
 +
}
 +
 +
ol, ul {
 +
list-style: none;
 +
}
 +
 +
blockquote, q {
 +
quotes: none;
 +
}
 +
 +
blockquote:before, blockquote:after, q:before, q:after {
 +
content: '';
 +
content: none;
 +
}
 +
 +
table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
}
 +
 +
body {
 +
-webkit-text-size-adjust: none;
 +
}
 +
 +
/* Box Model */
 +
 +
, *:before, *:after {
 +
-moz-box-sizing: border-box;
 +
-webkit-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
 +
/* Containers */
 +
 +
.container {
 +
margin-left: auto;
 +
margin-right: auto;
 +
}
 +
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 1450px;
 +
min-width: 1140px;
 +
}
 +
 +
.container.\37 5\25 {
 +
width: 855px;
 +
}
 +
 +
.container.\35 0\25 {
 +
width: 570px;
 +
}
 +
 +
.container.\32 5\25 {
 +
width: 285px;
 +
}
 +
 +
.container {
 +
width: 1140px;
 +
}
 +
 +
@media screen and (max-width: 1680px) {
 +
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 1200px;
 +
min-width: 960px;
 +
}
 +
 +
.container.\37 5\25 {
 +
width: 720px;
 +
}
 +
 +
.container.\35 0\25 {
 +
width: 480px;
 +
}
 +
 +
.container.\32 5\25 {
 +
width: 240px;
 +
}
 +
 +
.container {
 +
width: 960px;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 1080px) {
 +
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 118.75%;
 +
min-width: 95%;
 +
}
 +
 +
.container.\37 5\25 {
 +
width: 71.25%;
 +
}
 +
 +
.container.\35 0\25 {
 +
width: 47.5%;
 +
}
 +
 +
.container.\32 5\25 {
 +
width: 23.75%;
 +
}
 +
 +
.container {
 +
width: 95%;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 840px) {
 +
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 118.75%;
 +
min-width: 95%;
 +
}
 +
 +
.container.\37 5\25 {
 +
width: 71.25%;
 +
}
 +
 +
.container.\35 0\25 {
 +
width: 47.5%;
 +
}
 +
 +
.container.\32 5\25 {
 +
width: 23.75%;
 +
}
 +
 +
.container {
 +
width: 95%;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 736px) {
 +
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 118.75%;
 +
min-width: 95%;
 +
}
 +
 +
.container.\37 5\25 {
 +
width: 71.25%;
 +
}
 +
 +
.container.\35 0\25 {
 +
width: 47.5%;
 +
}
 +
 +
.container.\32 5\25 {
 +
width: 23.75%;
 +
}
 +
 +
.container {
 +
width: 95% !important;
 +
}
 +
 +
}
 +
 +
/* Grid */
 +
 +
.row {
 +
border-bottom: solid 1px transparent;
 +
-moz-box-sizing: border-box;
 +
-webkit-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
 +
.row > * {
 +
float: left;
 +
-moz-box-sizing: border-box;
 +
-webkit-box-sizing: border-box;
 +
box-sizing: border-box;
 +
}
 +
 +
.row:after, .row:before {
 +
content: '';
 +
display: block;
 +
clear: both;
 +
height: 0;
 +
}
 +
 +
.row.uniform > * > :first-child {
 +
margin-top: 20;
 +
}
 +
 +
.row.uniform > * > :last-child {
 +
margin-bottom: 20;
 +
}
 +
 +
.row.\30 \25 > * {
 +
padding: 20px 20 20 20px;
 +
}
 +
 +
.row.\30 \25 {
 +
margin: 0px 0 -1px 0px;
 +
}
 +
 +
.row.uniform.\30 \25 > * {
 +
padding: 50px 50 50 50px;
 +
}
 +
 +
.row.uniform.\30 \25 {
 +
margin: 0px 0 -1px 0px;
 +
}
 +
 +
.row > * {
 +
padding: 80px 80 80 80px;
 +
}
 +
 +
.row {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.uniform > * {
 +
padding: 80px 80 80 80px;
 +
}
 +
 +
.row.uniform {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.uniform.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.uniform.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.uniform.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.uniform.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.uniform.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.uniform.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.row.uniform.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.uniform.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.\31 2u, .\31 2u\24 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 1u, .\31 1u\24 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 0u, .\31 0u\24 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\39 u, .\39 u\24 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\38 u, .\38 u\24 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\37 u, .\37 u\24 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\36 u, .\36 u\24 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\35 u, .\35 u\24 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\34 u, .\34 u\24 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\33 u, .\33 u\24 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\32 u, .\32 u\24 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 u, .\31 u\24 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 2u\24 + *,
 +
.\31 1u\24 + *,
 +
.\31 0u\24 + *,
 +
.\39 u\24 + *,
 +
.\38 u\24 + *,
 +
.\37 u\24 + *,
 +
.\36 u\24 + *,
 +
.\35 u\24 + *,
 +
.\34 u\24 + *,
 +
.\33 u\24 + *,
 +
.\32 u\24 + *,
 +
.\31 u\24 + * {
 +
clear: left;
 +
}
 +
 +
.\-11u {
 +
margin-left: 91.66667%;
 +
}
 +
 +
.\-10u {
 +
margin-left: 83.33333%;
 +
}
 +
 +
.\-9u {
 +
margin-left: 75%;
 +
}
 +
 +
.\-8u {
 +
margin-left: 66.66667%;
 +
}
 +
 +
.\-7u {
 +
margin-left: 58.33333%;
 +
}
 +
 +
.\-6u {
 +
margin-left: 50%;
 +
}
 +
 +
.\-5u {
 +
margin-left: 41.66667%;
 +
}
 +
 +
.\-4u {
 +
margin-left: 33.33333%;
 +
}
 +
 +
.\-3u {
 +
margin-left: 25%;
 +
}
 +
 +
.\-2u {
 +
margin-left: 16.66667%;
 +
}
 +
 +
.\-1u {
 +
margin-left: 8.33333%;
 +
}
 +
 +
@media screen and (max-width: 1680px) {
 +
 +
.row > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.uniform > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row.uniform {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.uniform.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.uniform.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.uniform.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.uniform.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.uniform.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.uniform.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.row.uniform.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.uniform.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.\31 2u\28wide\29, .\31 2u\24\28wide\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 1u\28wide\29, .\31 1u\24\28wide\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 0u\28wide\29, .\31 0u\24\28wide\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\39 u\28wide\29, .\39 u\24\28wide\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\38 u\28wide\29, .\38 u\24\28wide\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\37 u\28wide\29, .\37 u\24\28wide\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\36 u\28wide\29, .\36 u\24\28wide\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\35 u\28wide\29, .\35 u\24\28wide\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\34 u\28wide\29, .\34 u\24\28wide\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\33 u\28wide\29, .\33 u\24\28wide\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\32 u\28wide\29, .\32 u\24\28wide\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 u\28wide\29, .\31 u\24\28wide\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 2u\24\28wide\29 + *,
 +
.\31 1u\24\28wide\29 + *,
 +
.\31 0u\24\28wide\29 + *,
 +
.\39 u\24\28wide\29 + *,
 +
.\38 u\24\28wide\29 + *,
 +
.\37 u\24\28wide\29 + *,
 +
.\36 u\24\28wide\29 + *,
 +
.\35 u\24\28wide\29 + *,
 +
.\34 u\24\28wide\29 + *,
 +
.\33 u\24\28wide\29 + *,
 +
.\32 u\24\28wide\29 + *,
 +
.\31 u\24\28wide\29 + * {
 +
clear: left;
 +
}
 +
 +
.\-11u\28wide\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 +
.\-10u\28wide\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 +
.\-9u\28wide\29 {
 +
margin-left: 75%;
 +
}
 +
 +
.\-8u\28wide\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 +
.\-7u\28wide\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 +
.\-6u\28wide\29 {
 +
margin-left: 50%;
 +
}
 +
 +
.\-5u\28wide\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 +
.\-4u\28wide\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 +
.\-3u\28wide\29 {
 +
margin-left: 25%;
 +
}
 +
 +
.\-2u\28wide\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 +
.\-1u\28wide\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 1080px) {
 +
 +
.row > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.uniform > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row.uniform {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.uniform.\32 00\25 > * {
 +
padding: 80px 0 0 80px;
 +
}
 +
 +
.row.uniform.\32 00\25 {
 +
margin: -80px 0 -1px -80px;
 +
}
 +
 +
.row.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.uniform.\31 50\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.uniform.\31 50\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.uniform.\35 0\25 > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.uniform.\35 0\25 {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.row.uniform.\32 5\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.uniform.\32 5\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.\31 2u\28normal\29, .\31 2u\24\28normal\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 1u\28normal\29, .\31 1u\24\28normal\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 0u\28normal\29, .\31 0u\24\28normal\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\39 u\28normal\29, .\39 u\24\28normal\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\38 u\28normal\29, .\38 u\24\28normal\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\37 u\28normal\29, .\37 u\24\28normal\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\36 u\28normal\29, .\36 u\24\28normal\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\35 u\28normal\29, .\35 u\24\28normal\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\34 u\28normal\29, .\34 u\24\28normal\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\33 u\28normal\29, .\33 u\24\28normal\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\32 u\28normal\29, .\32 u\24\28normal\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 u\28normal\29, .\31 u\24\28normal\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 2u\24\28normal\29 + *,
 +
.\31 1u\24\28normal\29 + *,
 +
.\31 0u\24\28normal\29 + *,
 +
.\39 u\24\28normal\29 + *,
 +
.\38 u\24\28normal\29 + *,
 +
.\37 u\24\28normal\29 + *,
 +
.\36 u\24\28normal\29 + *,
 +
.\35 u\24\28normal\29 + *,
 +
.\34 u\24\28normal\29 + *,
 +
.\33 u\24\28normal\29 + *,
 +
.\32 u\24\28normal\29 + *,
 +
.\31 u\24\28normal\29 + * {
 +
clear: left;
 +
}
 +
 +
.\-11u\28normal\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 +
.\-10u\28normal\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 +
.\-9u\28normal\29 {
 +
margin-left: 75%;
 +
}
 +
 +
.\-8u\28normal\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 +
.\-7u\28normal\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 +
.\-6u\28normal\29 {
 +
margin-left: 50%;
 +
}
 +
 +
.\-5u\28normal\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 +
.\-4u\28normal\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 +
.\-3u\28normal\29 {
 +
margin-left: 25%;
 +
}
 +
 +
.\-2u\28normal\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 +
.\-1u\28normal\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 840px) {
 +
 +
.row > * {
 +
padding: 30px 0 0 30px;
 +
}
 +
 +
.row {
 +
margin: -30px 0 -1px -30px;
 +
}
 +
 +
.row.uniform > * {
 +
padding: 30px 0 0 30px;
 +
}
 +
 +
.row.uniform {
 +
margin: -30px 0 -1px -30px;
 +
}
 +
 +
.row.\32 00\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.\32 00\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.uniform.\32 00\25 > * {
 +
padding: 60px 0 0 60px;
 +
}
 +
 +
.row.uniform.\32 00\25 {
 +
margin: -60px 0 -1px -60px;
 +
}
 +
 +
.row.\31 50\25 > * {
 +
padding: 45px 0 0 45px;
 +
}
 +
 +
.row.\31 50\25 {
 +
margin: -45px 0 -1px -45px;
 +
}
 +
 +
.row.uniform.\31 50\25 > * {
 +
padding: 45px 0 0 45px;
 +
}
 +
 +
.row.uniform.\31 50\25 {
 +
margin: -45px 0 -1px -45px;
 +
}
 +
 +
.row.\35 0\25 > * {
 +
padding: 15px 0 0 15px;
 +
}
 +
 +
.row.\35 0\25 {
 +
margin: -15px 0 -1px -15px;
 +
}
 +
 +
.row.uniform.\35 0\25 > * {
 +
padding: 15px 0 0 15px;
 +
}
 +
 +
.row.uniform.\35 0\25 {
 +
margin: -15px 0 -1px -15px;
 +
}
 +
 +
.row.\32 5\25 > * {
 +
padding: 7.5px 0 0 7.5px;
 +
}
 +
 +
.row.\32 5\25 {
 +
margin: -7.5px 0 -1px -7.5px;
 +
}
 +
 +
.row.uniform.\32 5\25 > * {
 +
padding: 7.5px 0 0 7.5px;
 +
}
 +
 +
.row.uniform.\32 5\25 {
 +
margin: -7.5px 0 -1px -7.5px;
 +
}
 +
 +
.\31 2u\28narrow\29, .\31 2u\24\28narrow\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 1u\28narrow\29, .\31 1u\24\28narrow\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 0u\28narrow\29, .\31 0u\24\28narrow\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\39 u\28narrow\29, .\39 u\24\28narrow\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\38 u\28narrow\29, .\38 u\24\28narrow\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\37 u\28narrow\29, .\37 u\24\28narrow\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\36 u\28narrow\29, .\36 u\24\28narrow\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\35 u\28narrow\29, .\35 u\24\28narrow\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\34 u\28narrow\29, .\34 u\24\28narrow\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\33 u\28narrow\29, .\33 u\24\28narrow\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\32 u\28narrow\29, .\32 u\24\28narrow\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 u\28narrow\29, .\31 u\24\28narrow\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 2u\24\28narrow\29 + *,
 +
.\31 1u\24\28narrow\29 + *,
 +
.\31 0u\24\28narrow\29 + *,
 +
.\39 u\24\28narrow\29 + *,
 +
.\38 u\24\28narrow\29 + *,
 +
.\37 u\24\28narrow\29 + *,
 +
.\36 u\24\28narrow\29 + *,
 +
.\35 u\24\28narrow\29 + *,
 +
.\34 u\24\28narrow\29 + *,
 +
.\33 u\24\28narrow\29 + *,
 +
.\32 u\24\28narrow\29 + *,
 +
.\31 u\24\28narrow\29 + * {
 +
clear: left;
 +
}
 +
 +
.\-11u\28narrow\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 +
.\-10u\28narrow\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 +
.\-9u\28narrow\29 {
 +
margin-left: 75%;
 +
}
 +
 +
.\-8u\28narrow\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 +
.\-7u\28narrow\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 +
.\-6u\28narrow\29 {
 +
margin-left: 50%;
 +
}
 +
 +
.\-5u\28narrow\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 +
.\-4u\28narrow\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 +
.\-3u\28narrow\29 {
 +
margin-left: 25%;
 +
}
 +
 +
.\-2u\28narrow\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 +
.\-1u\28narrow\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 +
}
 +
 +
@media screen and (max-width: 736px) {
 +
 +
.row > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.uniform > * {
 +
padding: 20px 0 0 20px;
 +
}
 +
 +
.row.uniform {
 +
margin: -20px 0 -1px -20px;
 +
}
 +
 +
.row.\32 00\25 > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row.\32 00\25 {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.uniform.\32 00\25 > * {
 +
padding: 40px 0 0 40px;
 +
}
 +
 +
.row.uniform.\32 00\25 {
 +
margin: -40px 0 -1px -40px;
 +
}
 +
 +
.row.\31 50\25 > * {
 +
padding: 30px 0 0 30px;
 +
}
 +
 +
.row.\31 50\25 {
 +
margin: -30px 0 -1px -30px;
 +
}
 +
 +
.row.uniform.\31 50\25 > * {
 +
padding: 30px 0 0 30px;
 +
}
 +
 +
.row.uniform.\31 50\25 {
 +
margin: -30px 0 -1px -30px;
 +
}
 +
 +
.row.\35 0\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.\35 0\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.row.uniform.\35 0\25 > * {
 +
padding: 10px 0 0 10px;
 +
}
 +
 +
.row.uniform.\35 0\25 {
 +
margin: -10px 0 -1px -10px;
 +
}
 +
 +
.row.\32 5\25 > * {
 +
padding: 5px 0 0 5px;
 +
}
 +
 +
.row.\32 5\25 {
 +
margin: -5px 0 -1px -5px;
 +
}
 +
 +
.row.uniform.\32 5\25 > * {
 +
padding: 5px 0 0 5px;
 +
}
 +
 +
.row.uniform.\32 5\25 {
 +
margin: -5px 0 -1px -5px;
 +
}
 +
 +
.\31 2u\28mobile\29, .\31 2u\24\28mobile\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 1u\28mobile\29, .\31 1u\24\28mobile\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 0u\28mobile\29, .\31 0u\24\28mobile\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\39 u\28mobile\29, .\39 u\24\28mobile\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\38 u\28mobile\29, .\38 u\24\28mobile\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\37 u\28mobile\29, .\37 u\24\28mobile\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\36 u\28mobile\29, .\36 u\24\28mobile\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\35 u\28mobile\29, .\35 u\24\28mobile\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\34 u\28mobile\29, .\34 u\24\28mobile\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\33 u\28mobile\29, .\33 u\24\28mobile\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\32 u\28mobile\29, .\32 u\24\28mobile\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 u\28mobile\29, .\31 u\24\28mobile\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 +
.\31 2u\24\28mobile\29 + *,
 +
.\31 1u\24\28mobile\29 + *,
 +
.\31 0u\24\28mobile\29 + *,
 +
.\39 u\24\28mobile\29 + *,
 +
.\38 u\24\28mobile\29 + *,
 +
.\37 u\24\28mobile\29 + *,
 +
.\36 u\24\28mobile\29 + *,
 +
.\35 u\24\28mobile\29 + *,
 +
.\34 u\24\28mobile\29 + *,
 +
.\33 u\24\28mobile\29 + *,
 +
.\32 u\24\28mobile\29 + *,
 +
.\31 u\24\28mobile\29 + * {
 +
clear: left;
 +
}
 +
 +
.\-11u\28mobile\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 +
.\-10u\28mobile\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 +
.\-9u\28mobile\29 {
 +
margin-left: 75%;
 +
}
 +
 +
.\-8u\28mobile\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 +
.\-7u\28mobile\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 +
.\-6u\28mobile\29 {
 +
margin-left: 50%;
 +
}
 +
 +
.\-5u\28mobile\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 +
.\-4u\28mobile\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 +
.\-3u\28mobile\29 {
 +
margin-left: 25%;
 +
}
 +
 +
.\-2u\28mobile\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 +
.\-1u\28mobile\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 +
}
 +
 +
/* Basic */
 +
 +
 +
body.is-scroll {
 +
background-attachment: scroll, scroll;
 +
background-size: auto, 100% auto;
 +
}
 +
 +
 +
 +
h1, h2, h3, h4, h5, h6 {
 +
 +
text-transform: uppercase;
 +
 +
}
 +
 +
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
 +
color: inherit;
 +
text-decoration: none;
 +
}
 +
 +
h2 {
 +
font-size: 1.25em;
 +
letter-spacing: 8px;
 +
}
 +
 +
h3 {
 +
font-size: 1em;
 +
letter-spacing: 5px;
 +
}
 +
 +
strong, b {
 +
 +
}
 +
 +
em, i {
 +
font-style: italic;
 +
}
 +
 +
 +
 +
 +
 +
 +
 +
/* Image */
 +
 +
.image {
 +
display: inline-block;
 +
border: 0;
 +
}
 +
 +
.image img {
 +
display: block;
 +
width: 100%;
 +
}
 +
 +
.image.featured {
 +
display: block;
 +
width: 100%;
 +
margin: 0 0 2em 0;
 +
}
 +
 +
.image.fit {
 +
display: block;
 +
width: 100%;
 +
}
 +
 +
.image.left {
 +
float: left;
 +
margin: 0 2em 2em 0;
 +
}
 +
 +
.image.centered {
 +
display: block;
 +
margin: 0 0 2em 0;
 +
}
 +
 +
.image.centered img {
 +
margin: 0 auto;
 +
width: auto;
 +
}
 +
 +
 +
/* Form */
 +
 +
form label {
 +
display: block;
 +
margin: 0 0 0.5em 0;
 +
}
 +
 +
form input[type="text"],
 +
form input[type="email"],
 +
form input[type="password"],
 +
form select,
 +
form textarea {
 +
-moz-transition: background-color 0.35s ease-in-out;
 +
-webkit-transition: background-color 0.35s ease-in-out;
 +
-ms-transition: background-color 0.35s ease-in-out;
 +
transition: background-color 0.35s ease-in-out;
 +
-webkit-appearance: none;
 +
display: block;
 +
border: 0;
 +
background: #f1f1f1;
 +
width: 100%;
 +
padding: 0.75em;
 +
}
 +
 +
form input[type="text"]:focus,
 +
form input[type="email"]:focus,
 +
form input[type="password"]:focus,
 +
form select:focus,
 +
form textarea:focus {
 +
background: #f8f8f8;
 +
}
 +
 +
form input[type="text"],
 +
form input[type="email"],
 +
form input[type="password"],
 +
form select {
 +
line-height: 1em;
 +
}
 +
 +
form textarea {
 +
min-height: 12em;
 +
}
 +
 +
form .formerize-placeholder {
 +
color: #5a5959 !important;
 +
}
 +
 +
form ::-webkit-input-placeholder {
 +
color: #5a5959 !important;
 +
}
 +
 +
form :-moz-placeholder {
 +
color: #5a5959 !important;
 +
}
 +
 +
form ::-moz-placeholder {
 +
color: #5a5959 !important;
 +
}
 +
 +
form :-ms-input-placeholder {
 +
color: #5a5959 !important;
 +
}
 +
 +
form ::-moz-focus-inner {
 +
border: 0;
 +
}
 +
 +
form ul.actions {
 +
margin-bottom: 0;
 +
text-align: center;
 +
}
 +
 +
 +
 +
/* Button */
 +
 +
input[type="button"],
 +
input[type="submit"],
 +
input[type="reset"],
 +
button,
 +
.button {
 +
-moz-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out;
 +
-webkit-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out;
 +
-ms-transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out;
 +
transition: background-color 0.35s ease-in-out, color 0.35s ease-in-out;
 +
-webkit-appearance: none;
 +
position: relative;
 +
display: inline-block;
 +
border: 0;
 +
background: #35b88f;
 +
color: #fff;
 +
text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.25);
 +
cursor: pointer;
 +
text-decoration: none;
 +
outline: 0;
 +
padding: 1em 3em 1em 3em;
 +
text-align: center;
 +
border-radius: 3em;
 +
 +
}
 +
 +
input[type="button"]:hover,
 +
input[type="submit"]:hover,
 +
input[type="reset"]:hover,
 +
button:hover,
 +
.button:hover {
 +
background: #45c89f;
 +
}
 +
 +
input[type="button"].style2,
 +
input[type="submit"].style2,
 +
input[type="reset"].style2,
 +
button.style2,
 +
.button.style2 {
 +
color: #3a3939;
 +
background: #fff;
 +
box-shadow: inset 0 0 0 1px #fff;
 +
}
 +
 +
input[type="button"].style2:hover,
 +
input[type="submit"].style2:hover,
 +
input[type="reset"].style2:hover,
 +
button.style2:hover,
 +
.button.style2:hover {
 +
background: rgba(255, 255, 255, 0.1);
 +
color: #fff !important;
 +
text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.25) !important;
 +
}
 +
 +
input[type="button"].style3,
 +
input[type="submit"].style3,
 +
input[type="reset"].style3,
 +
button.style3,
 +
.button.style3 {
 +
background: none;
 +
color: #3a3939;
 +
box-shadow: inset 0 0 0 1px #dad9d9;
 +
}
 +
 +
input[type="button"].style3:hover,
 +
input[type="submit"].style3:hover,
 +
input[type="reset"].style3:hover,
 +
button.style3:hover,
 +
.button.style3:hover {
 +
background: rgba(58, 57, 57, 0.025);
 +
}
 +
 +
/* Box */
 +
 +
.box {
 +
position: relative;
 +
margin-top: 9em;
 +
margin-bottom: 0;
 +
}
 +
 +
.box:after {
 +
content: '';
 +
display: block;
 +
position: absolute;
 +
top: -9em;
 +
left: 50%;
 +
height: 9em;
 +
border-left: solid 1px #fff;
 +
}
 +
 +
.box:before {
 +
content: '';
 +
display: block;
 +
width: 90px;
 +
height: 66px;
 +
position: absolute;
 +
left: 50%;
 +
top: -4.5em;
 +
margin-left: -45px;
 +
margin-top: -33px;
 +
background: url("images/arrow.svg") no-repeat;
 +
}
 +
 +
.box :last-child {
 +
margin-bottom: 0;
 +
}
 +
 +
.box.style1 {
 +
background: #fff;
 +
padding: 3em;
 +
}
 +
 +
.box.style1 .image {
 +
display: block;
 +
position: absolute;
 +
top: 0;
 +
width: 50%;
 +
height: 100%;
 +
background: #152E33;
 +
overflow: hidden;
 +
}
 +
 +
.box.style1 .image img {
 +
position: absolute;
 +
top: 0;
 +
height: 100%;
 +
width: auto;
 +
}
 +
 +
.box.style1 .inner > :last-child {
 +
margin: 0;
 +
}
 +
 +
.box.style1.right .image {
 +
left: 0;
 +
}
 +
 +
.box.style1.right .image img {
 +
right: 0;
 +
}
 +
 +
.box.style1.right .inner {
 +
margin-left: 50%;
 +
padding-left: 3em;
 +
}
 +
 +
.box.style1.left .image {
 +
right: 0;
 +
}
 +
 +
.box.style1.left .image img {
 +
left: 0;
 +
}
 +
 +
.box.style1.left .inner {
 +
margin-right: 50%;
 +
padding-right: 3em;
 +
}
 +
 +
.box.style2 {
 +
text-align: center;
 +
}
 +
 +
.box.style2 header {
 +
display: inline-block;
 +
background: #fff;
 +
padding: 2em 3em 2em 3em;
 +
margin: 0;
 +
}
 +
 +
.box.style2 header p {
 +
padding: 0;
 +
}
 +
 +
.box.style2 .inner {
 +
position: relative;
 +
padding: 40px 0 0px 0;
 +
}
 +
 +
.box.style2 .inner:after {
 +
content: '';
 +
display: block;
 +
position: absolute;
 +
top: 0;
 +
left: 50%;
 +
height: 100%;
 +
border-left: solid 1px #fff;
 +
}
 +
 +
.box.style2 .inner .row {
 +
position: relative;
 +
}
 +
 +
.box.style2 .inner .row:before {
 +
content: '';
 +
display: block;
 +
position: absolute;
 +
top: 50%;
 +
left: 20px;
 +
width: calc(100% - 40px);
 +
border-bottom: solid 1px #fff;
 +
}
 +
 +
.box.style2 .inner .image {
 +
position: relative;
 +
z-index: 1;
 +
padding: 20px;
 +
}
 +
 +
.box.style3 {
 +
background: #fff;
 +
padding: 3em;
 +
}
 +
 +
.box.style3 header {
 +
text-align: center;
 +
}
 +
 +
 +
/* Header */
 +
 +
#header {
 +
position: relative;
 +
color: #fff;
 +
text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.25);
 +
text-align: center;
 +
margin: 0;
 +
padding: 14em 0 14em 0;
 +
cursor: default;
 +
}
 +
 +
#header header {
 +
display: inline-block;
 +
padding: 0 0 4.5em 0;
 +
}
 +
 +
#header header h1 {
 +
font-size: 2em;
 +
letter-spacing: 10px;
 +
}
 +
 +
#header header p {
 +
border-top: solid 1px rgba(255, 255, 255, 0.5);
 +
color: rgba(255, 255, 255, 0.75);
 +
text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.1875);
 +
font-size: 1em;
 +
text-transform: uppercase;
 +
letter-spacing: 3px;
 +
padding: 0;
 +
margin-top: 0.35em;
 +
}
 +
 +
 +
 +
 +
 +
 +
 +
/* Banner */
 +
 +
#banner {
 +
position: relative;
 +
color: #fff;
 +
text-shadow: 0 0 0.5px rgba(255, 255, 255, 0.25);
 +
text-align: center;
 +
background: #35b88f url("images/banner.svg") bottom center no-repeat;
 +
padding: 5em 0 5em 0;
 +
margin: 0;
 +
background-size: 125% auto;
 +
}
 +
 +
#banner .button {
 +
color: #35b882;
 +
text-shadow: 0 0 0.5px rgba(53, 184, 130, 0.25);
 +
}
 +
 +
#banner header {
 +
margin: 0 0 2em 0;
 +
}
 +
 +
#banner header h2 {
 +
font-size: 1.75em;
 +
letter-spacing: 8px;
 +
}
 +
 +
#banner p {
 +
margin: 0;
 +
}
 +
 +
#banner footer {
 +
margin: 2em 0 0 0;
 +
}
 +
 +
#banner a {
 +
color: inherit;
 +
border-bottom-color: rgba(255, 255, 255, 0.5);
 +
}
 +
 +
#banner a:hover {
 +
border-bottom-color: rgba(255, 255, 255, 0);
 +
}
 +
 +
 +
 +
 +
 +
 +
 +
/* Narrow */
 +
 +
@media screen and (max-width: 840px) {
 +
 +
/* Basic */
 +
 +
body {
 +
background-color: #203936;
 +
background-size: auto, 100% auto;
 +
background-position: top left, top center;
 +
background-attachment: scroll, scroll;
 +
}
 +
 +
input, textarea, select {
 +
font-size: 14pt;
 +
}
 +
 +
h1, h2, h3, h4, h5, h6 {
 +
line-height: 1.5em;
 +
}
 +
 +
 +
/* Box */
 +
 +
.box {
 +
position: relative;
 +
}
 +
 +
.box section {
 +
margin: 0 0 2em 0;
 +
}
 +
 +
.box.style1 {
 +
padding: 2.5em 2em 2.5em 2em;
 +
}
 +
 +
.box.style1.right .inner {
 +
padding-left: 2em;
 +
}
 +
 +
.box.style1.left .inner {
 +
padding-right: 2em;
 +
}
 +
 +
.box.style2 header {
 +
padding: 2em;
 +
}
 +
 +
.box.style2 .inner {
 +
position: relative;
 +
padding: 30px 0 0 0;
 +
}
 +
 +
.box.style3 {
 +
padding: 2.5em 2em 2.5em 2em;
 +
}
 +
 +
/* Banner */
 +
 +
#banner {
 +
padding: 3.5em;
 +
background-size: 200% auto;
 +
}
 +
 +
#banner br {
 +
display: none;
 +
}
 +
 +
}
 +
 +
/* Mobile */
 +
 +
@media screen and (max-width: 736px) {
 +
 +
/* Basic */
 +
 +
* {
 +
text-shadow: none !important;
 +
}
 +
 +
body, input, textarea, select {
 +
line-height: 1.5em;
 +
font-size: 12pt;
 +
letter-spacing: 0;
 +
}
 +
 +
h2, h3, h4, h5, h6 {
 +
font-size: 1em;
 +
}
 +
 +
h2 {
 +
font-size: 1.25em;
 +
letter-spacing: 4px;
 +
}
 +
 +
 +
/* Button */
 +
 +
input[type="button"],
 +
input[type="submit"],
 +
input[type="reset"],
 +
button,
 +
.button {
 +
padding: 0.75em 0 0.75em 0;
 +
width: 100%;
 +
max-width: 320px;
 +
}
 +
 +
/* Box */
 +
 +
.box {
 +
margin-top: 4.5em;
 +
}
 +
 +
.box:after {
 +
top: -4.5em;
 +
height: 4.5em;
 +
}
 +
 +
.box:before {
 +
width: 45px;
 +
height: 33px;
 +
top: -2.25em;
 +
margin-left: -22.5px;
 +
margin-top: -16.5px;
 +
background-size: 45px 33px;
 +
}
 +
 +
.box.style1 {
 +
padding: 0;
 +
text-align: center;
 +
}
 +
 +
.box.style1 .image {
 +
position: relative !important;
 +
left: 0 !important;
 +
width: 100% !important;
 +
height: auto !important;
 +
}
 +
 +
.box.style1 .image img {
 +
position: relative;
 +
height: auto;
 +
width: 100%;
 +
}
 +
 +
.box.style1 .inner {
 +
margin: 0 !important;
 +
padding: 2em 1.25em 2em 1.25em !important;
 +
}
 +
 +
.box.style2 .inner .row:before {
 +
display: none;
 +
}
 +
 +
.box.style2 .inner .image {
 +
padding: 0;
 +
max-width: 250px;
 +
margin: 0 auto 20px auto;
 +
}
 +
 +
.box.style3 {
 +
padding: 2em 1.25em 2em 1.25em;
 +
}
 +
 +
/* Header */
 +
 +
#header {
 +
padding: 6em 0 6em 0;
 +
}
 +
 +
#header header {
 +
padding-left: 2em;
 +
padding-right: 2em;
 +
}
 +
 +
#header header h1 {
 +
font-size: 1.75em;
 +
letter-spacing: 6px;
 +
}
 +
 +
#header footer {
 +
bottom: 4.5em;
 +
padding: 0 2em 0 2em;
 +
}
 +
 +
#header footer:after {
 +
bottom: -4.5em;
 +
left: 50%;
 +
height: 4.5em;
 +
}
 +
 +
#header footer:before {
 +
width: 45px;
 +
height: 33px;
 +
bottom: -2.25em;
 +
margin-left: -22.5px;
 +
margin-bottom: -16.5px;
 +
background-size: 45px 33px;
 +
}
 +
 +
/* Banner */
 +
 +
#banner {
 +
padding: 3em 2em 3em 2em;
 +
background-size: auto 150%;
 +
}
 +
 +
#banner header {
 +
margin: 0 0 1em 0;
 +
}
 +
 +
#banner header h2 {
 +
font-size: 1.5em;
 +
letter-spacing: 6px;
 +
}
 +
 +
 +
 +
}</style>
 +
 +
 +
 +
 +
<!--[if lte IE 8]><style>
 +
 +
 +
 +
 +
 +
 +
 +
 +
 +
#header header p {
 +
border-top: solid 1px #888;
 +
}</style><![endif]-->
 +
</head>
 +
<body>
 +
 +
<!-- Header -->
 +
<section id="header" style="padding: 188px 0px;">
 +
<header>
 +
<h1 style="padding-top: 5px">Warwick iGEM 2015</h1>
 +
<p>Brixells</p>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
 +
</header>
 +
<footer><b></b><a href="#home" class="btn btn-default" id="menu-toggle">Skip to Home</a></p>
 +
 +
 +
 +
<a class="button style2 scrolly-middle" href="#banner">Learn about Cell LEGO</a>
 +
 +
 +
</footer><p style="float: right;"><img src="https://static.igem.org/mediawiki/2015/3/3c/WarwickLogoforhome.png" height="200px" width="300px" border="100px"></p>
 +
 +
</section>
 +
 +
<!-- Banner -->
 +
<section id="banner">
 +
 +
<header>
 +
<h2>Brixells<br><br> biological building blocks</h2>
 +
</header>
 +
<p>DNA programmed assembly of cells:
 +
<br>We are inventing a novel method of producing microscopic cell-cell binding
 +
<br>using intracellular proteins modified to express on the surface of the cell
 +
<br>The applications are endless: medicine, micro- and synthetic biology research,
 +
<br>synthetic organs, insight into multicellularity, meta-material production,
 +
<br> whatever you can imagine.
 +
<br>
 +
<br><img src="https://static.igem.org/mediawiki/2015/f/ff/Warwick_homepage_diagram.jpeg">
 +
<br>
 +
<br>
 +
<br></p>
 +
<footer>
 +
<a class="button style2 scrolly" href="#first">Continue Reading</a>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
<br>
 +
</footer>
 +
</section>
 +
 +
<!-- Feature 1 -->
 +
<section id="first">
 +
 +
 +
 +
<!-- Feature 2 -->
 +
<article class="container box style1 left" id="scrollproject">
 +
<a class="image fit" href="https://2015.igem.org/Team:Warwick/Parts"><img alt="" src="https://static.igem.org/mediawiki/2015/5/59/Parts_picture.jpg"></a>
 +
<div class="inner">
 +
<header>
 +
<h2>Our Submitted Parts<br>
 +
...the Brixell Collection</h2>
 +
</header><br>
 +
 +
 +
<p>Click on the image to the right to see what parts we submitted for the competition or continue scrolling.<br><br><p style="float: middle;"><img src="https://static.igem.org/mediawiki/2015/2/26/Warwickarrow.jpeg" height="100px" width="300px" border="1px"></p></p>
 +
</div>
 +
</article>
 +
<br><br><br><br>
 +
<br>
 +
<br><br>
 +
<br>
 +
<br>
 +
<div style="text-align: center;"><a class="button style2 scrolly" href="#home">Continue Reading</a></div>
 +
 +
<!-- Portfolio -->
 +
<section id="home">
 +
<article class="container box style2">
 +
<header>
 +
<h2>Our Project</h2>
 +
<p>Click on the images below to explore our different sections.</p>
 +
</header>
 +
<div class="inner gallery">
 +
<div class="row 0%">
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Project"><img title="Project Summary" alt="" src="https://static.igem.org/mediawiki/2015/f/fc/Imaege.png"  height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Protocols"><img title="Experiments" alt="" src="https://static.igem.org/mediawiki/2015/f/f4/Warwick.png"  height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Results"><img title="Results" alt="" src="https://static.igem.org/mediawiki/2015/a/a1/Homepage.png"height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Parts"><img title="Submitted Parts" alt="" src="https://static.igem.org/mediawiki/2015/5/5b/PartsWarwickHomepage.png"  height="190" width="150"></a></div>
 +
</div>
 +
<div class="row 0%">
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Modeling"><img title="Modelling" alt="" src="https://static.igem.org/mediawiki/2015/7/75/Modellinghomepageimagewarwick.png"  height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px; " href="http//:2015.igem.org/Team:Warwick/Practices"><img title="Outreach" alt="" src="https://static.igem.org/mediawiki/2015/d/dd/Outreachhomepagewarwick.png"    height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Collaborations"><img title="Collaborations" alt="" src="https://static.igem.org/mediawiki/2015/f/fb/Homepagewarwick.png"    height="190" width="150"></a></div>
 +
<div class="3u 12u(mobile)"><a class="image fit" style="outline: 0px;" href="https://2015.igem.org/Team:Warwick/Attributions"><img title="Team" alt="Team" src="https://static.igem.org/mediawiki/2015/f/fc/WarwickiGEM2015TeamPicture.jpeg"    height="190" width="150"></a></div><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 +
</div>
 +
</div>
 +
</article>
 +
 +
<!-- Contact -->
 +
<article class="container box style3">
 +
<header>
 +
<h2>Please Contact Us</h2>
 +
<p>We will respond as quickly as possible.</p>
 +
</header>
 +
<form action="#" method="post">
 +
<div class="row 50%">
 +
<div class="6u 12u$(mobile)"><input name="name" class="text" type="text" placeholder="Name"></div>
 +
<div class="6u$ 12u$(mobile)"><input name="email" class="text" type="text" placeholder="Email"></div>
 +
<div class="12u$">
 +
<textarea name="message" placeholder="Message">Message</textarea>
 +
</div>
 +
<div class="12u$">
 +
<ul class="actions">
 +
<li><input type="submit" value="Send Message"></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</form>
 +
</article>
 +
 +
 +
</table>
 +
</div>
 +
</section>
 +
<section>
 +
 +
 +
</ul>
 +
</div>
 +
</div>
 +
</form>
 +
</section>
 +
</article>
 +
 +
 +
 +
 +
 +
</div>
 +
</section>
 +
 +
 +
 +
 +
 +
<script>$(document).ready(function(){
 +
$('a[href^="#"]').on('click',function (e) {
 +
    e.preventDefault();
 +
 +
    var target = this.hash;
 +
    var $target = $(target);
 +
 +
    $('html, body').stop().animate({
 +
        'scrollTop': $target.offset().top
 +
    }, 900, 'swing', function () {
 +
        window.location.hash = target;
 +
    });
 +
});
 +
});</script>
 +
 +
 +
 +
 +
 +
 +
</div></div></body>
 +
</div>
 
</html>
 
</html>

Latest revision as of 18:18, 18 September 2015


Our Submitted Parts
...the Brixell Collection


Click on the image to the right to see what parts we submitted for the competition or continue scrolling.










Our Project

Click on the images below to explore our different sections.

Team














Please Contact Us

We will respond as quickly as possible.