Difference between revisions of "Team:Mingdao/Team"

Line 1: Line 1:
−
{{Mingdao}}
 
 
<html>
 
<html>
 +
<head>
 +
<title>iGEM Human Practice</title>
 +
<meta charset="utf-8" />
 +
<meta name="viewport" content="width=device-width, initial-scale=1" />
 +
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
 +
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato">
 +
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
  
−
<p><img src="BIOLAB IMAGE" /></p>
+
<!-- BOOTSTRAP -->
  
 +
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 +
<!-- Bootstrap CSS -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
  
 +
<!-- BOOTSTRAP -->
 +
<style type='text/css'>
 +
      #top_title, #sideMenu{
 +
        display: none;
 +
      }
  
 +
      #content{
 +
        width: 100%;
 +
        margin: 0;
 +
        padding: 0;
 +
        background: #f3f4f4;}
  
 +
</style>
  
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">LI-KAI JHENG</span></p>
+
<style>
 +
body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
 +
body, html {
 +
    height: 100%;
 +
    color: #777;
 +
    line-height: 1.8;
 +
}
 +
 
 +
/* Create a Parallax Effect */
 +
.bgimg-1, .bgimg-2, .bgimg-3 {
 +
    background-attachment: fixed;
 +
    background-position: center;
 +
    background-repeat: no-repeat;
 +
    background-size: cover;
 +
}
 +
 
 +
/* First image (Logo. Full height) */
 +
.bgimg-1 {
 +
    background-image: url('https://static.igem.org/mediawiki/2017/3/3b/MD-head-banner-1.jpeg');
 +
    min-height: 100%;
 +
}
 +
 
 +
/* Second image (Portfolio) */
 +
.bgimg-2 {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/3/3b/MD-head-banner-1.jpeg");
 +
    min-height: 400px;
 +
}
 +
 
 +
/* Third image (Contact) */
 +
.bgimg-3 {
 +
    background-image: url("https://static.igem.org/mediawiki/2017/a/a3/MD-trianglify-back-0.png");
 +
    min-height: 200px;
 +
}
 +
 
 +
.w3-wide {letter-spacing: 10px;}
 +
.w3-hover-opacity {cursor: pointer;}
 +
 
 +
/* Turn off parallax scrolling for tablets and phones */
 +
@media only screen and (max-device-width: 1024px) {
 +
    .bgimg-1, .bgimg-2, .bgimg-3 {
 +
        background-attachment: scroll;
 +
    }
 +
}
 +
</style>
 +
<style>
 +
@charset "UTF-8";
 +
@import url(http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css);
 +
@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700");
 +
 
 +
/*
 +
Hielo by TEMPLATED
 +
templated.co @templatedco
 +
Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
 +
*/
 +
 
 +
/* Reset */
 +
 
 +
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%;
 +
font: inherit;
 +
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: 100rem;
 +
min-width: 80rem;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 60rem;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 40rem;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 20rem;
 +
}
 +
 
 +
.container {
 +
width: 80rem;
 +
}
 +
 
 +
@media screen and (max-width: 1680px) {
 +
 
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 100rem;
 +
min-width: 80rem;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 60rem;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 40rem;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 20rem;
 +
}
 +
 
 +
.container {
 +
width: 80rem;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 1280px) {
 +
 
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 81.25rem;
 +
min-width: 65rem;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 48.75rem;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 32.5rem;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 16.25rem;
 +
}
 +
 
 +
.container {
 +
width: 65rem;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 112.5%;
 +
min-width: 90%;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 67.5%;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 45%;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 22.5%;
 +
}
 +
 
 +
.container {
 +
width: 90%;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 112.5%;
 +
min-width: 90%;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 67.5%;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 45%;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 22.5%;
 +
}
 +
 
 +
.container {
 +
width: 90% !important;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
.container.\31 25\25 {
 +
width: 100%;
 +
max-width: 112.5%;
 +
min-width: 90%;
 +
}
 +
 
 +
.container.\37 5\25 {
 +
width: 67.5%;
 +
}
 +
 
 +
.container.\35 0\25 {
 +
width: 45%;
 +
}
 +
 
 +
.container.\32 5\25 {
 +
width: 22.5%;
 +
}
 +
 
 +
.container {
 +
width: 90% !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: 0;
 +
}
 +
 
 +
.row.uniform > * > :last-child {
 +
margin-bottom: 0;
 +
}
 +
 
 +
.row.\30 \25 > * {
 +
padding: 0 0 0 0rem;
 +
}
 +
 
 +
.row.\30 \25 {
 +
margin: 0 0 -1px 0rem;
 +
}
 +
 
 +
.row.uniform.\30 \25 > * {
 +
padding: 0rem 0 0 0rem;
 +
}
 +
 
 +
.row.uniform.\30 \25 {
 +
margin: 0rem 0 -1px 0rem;
 +
}
 +
 
 +
.row > * {
 +
padding: 0 0 0 2rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -2rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 2rem 0 0 2rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -2rem 0 -1px -2rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 4rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -4rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 4rem 0 0 4rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -4rem 0 -1px -4rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 3rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -3rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 3rem 0 0 3rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -3rem 0 -1px -3rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 1rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -1rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 1rem 0 0 1rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -1rem 0 -1px -1rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.5rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.5rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.5rem 0 0 0.5rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.5rem 0 -1px -0.5rem;
 +
}
 +
 
 +
.\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: 0 0 0 2rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -2rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 2rem 0 0 2rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -2rem 0 -1px -2rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 4rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -4rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 4rem 0 0 4rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -4rem 0 -1px -4rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 3rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -3rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 3rem 0 0 3rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -3rem 0 -1px -3rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 1rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -1rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 1rem 0 0 1rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -1rem 0 -1px -1rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.5rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.5rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.5rem 0 0 0.5rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.5rem 0 -1px -0.5rem;
 +
}
 +
 
 +
.\31 2u\28xlarge\29, .\31 2u\24\28xlarge\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 1u\28xlarge\29, .\31 1u\24\28xlarge\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 0u\28xlarge\29, .\31 0u\24\28xlarge\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\39 u\28xlarge\29, .\39 u\24\28xlarge\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\38 u\28xlarge\29, .\38 u\24\28xlarge\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\37 u\28xlarge\29, .\37 u\24\28xlarge\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\36 u\28xlarge\29, .\36 u\24\28xlarge\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\35 u\28xlarge\29, .\35 u\24\28xlarge\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\34 u\28xlarge\29, .\34 u\24\28xlarge\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\33 u\28xlarge\29, .\33 u\24\28xlarge\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\32 u\28xlarge\29, .\32 u\24\28xlarge\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 u\28xlarge\29, .\31 u\24\28xlarge\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 2u\24\28xlarge\29 + *,
 +
.\31 1u\24\28xlarge\29 + *,
 +
.\31 0u\24\28xlarge\29 + *,
 +
.\39 u\24\28xlarge\29 + *,
 +
.\38 u\24\28xlarge\29 + *,
 +
.\37 u\24\28xlarge\29 + *,
 +
.\36 u\24\28xlarge\29 + *,
 +
.\35 u\24\28xlarge\29 + *,
 +
.\34 u\24\28xlarge\29 + *,
 +
.\33 u\24\28xlarge\29 + *,
 +
.\32 u\24\28xlarge\29 + *,
 +
.\31 u\24\28xlarge\29 + * {
 +
clear: left;
 +
}
 +
.\-11u\28xlarge\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 
 +
.\-10u\28xlarge\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 
 +
.\-9u\28xlarge\29 {
 +
margin-left: 75%;
 +
}
 +
 
 +
.\-8u\28xlarge\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 
 +
.\-7u\28xlarge\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 
 +
.\-6u\28xlarge\29 {
 +
margin-left: 50%;
 +
}
 +
 
 +
.\-5u\28xlarge\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 
 +
.\-4u\28xlarge\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 
 +
.\-3u\28xlarge\29 {
 +
margin-left: 25%;
 +
}
 +
 
 +
.\-2u\28xlarge\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 
 +
.\-1u\28xlarge\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 1280px) {
 +
 
 +
.row > * {
 +
padding: 0 0 0 1.5rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -1.5rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 1.5rem 0 0 1.5rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -1.5rem 0 -1px -1.5rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 3rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -3rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 3rem 0 0 3rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -3rem 0 -1px -3rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 2.25rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -2.25rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 2.25rem 0 0 2.25rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -2.25rem 0 -1px -2.25rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 0.75rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -0.75rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 0.75rem 0 0 0.75rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -0.75rem 0 -1px -0.75rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.375rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.375rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.375rem 0 0 0.375rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.375rem 0 -1px -0.375rem;
 +
}
 +
 
 +
.\31 2u\28large\29, .\31 2u\24\28large\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 1u\28large\29, .\31 1u\24\28large\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 0u\28large\29, .\31 0u\24\28large\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\39 u\28large\29, .\39 u\24\28large\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\38 u\28large\29, .\38 u\24\28large\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\37 u\28large\29, .\37 u\24\28large\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\36 u\28large\29, .\36 u\24\28large\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\35 u\28large\29, .\35 u\24\28large\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\34 u\28large\29, .\34 u\24\28large\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\33 u\28large\29, .\33 u\24\28large\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\32 u\28large\29, .\32 u\24\28large\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 u\28large\29, .\31 u\24\28large\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 2u\24\28large\29 + *,
 +
.\31 1u\24\28large\29 + *,
 +
.\31 0u\24\28large\29 + *,
 +
.\39 u\24\28large\29 + *,
 +
.\38 u\24\28large\29 + *,
 +
.\37 u\24\28large\29 + *,
 +
.\36 u\24\28large\29 + *,
 +
.\35 u\24\28large\29 + *,
 +
.\34 u\24\28large\29 + *,
 +
.\33 u\24\28large\29 + *,
 +
.\32 u\24\28large\29 + *,
 +
.\31 u\24\28large\29 + * {
 +
clear: left;
 +
}
 +
.\-11u\28large\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 
 +
.\-10u\28large\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 
 +
.\-9u\28large\29 {
 +
margin-left: 75%;
 +
}
 +
 
 +
.\-8u\28large\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 
 +
.\-7u\28large\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 
 +
.\-6u\28large\29 {
 +
margin-left: 50%;
 +
}
 +
 
 +
.\-5u\28large\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 
 +
.\-4u\28large\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 
 +
.\-3u\28large\29 {
 +
margin-left: 25%;
 +
}
 +
 
 +
.\-2u\28large\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 
 +
.\-1u\28large\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.row > * {
 +
padding: 0 0 0 1.5rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -1.5rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 1.5rem 0 0 1.5rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -1.5rem 0 -1px -1.5rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 3rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -3rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 3rem 0 0 3rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -3rem 0 -1px -3rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 2.25rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -2.25rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 2.25rem 0 0 2.25rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -2.25rem 0 -1px -2.25rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 0.75rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -0.75rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 0.75rem 0 0 0.75rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -0.75rem 0 -1px -0.75rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.375rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.375rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.375rem 0 0 0.375rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.375rem 0 -1px -0.375rem;
 +
}
 +
 
 +
.\31 2u\28medium\29, .\31 2u\24\28medium\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 1u\28medium\29, .\31 1u\24\28medium\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 0u\28medium\29, .\31 0u\24\28medium\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\39 u\28medium\29, .\39 u\24\28medium\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\38 u\28medium\29, .\38 u\24\28medium\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\37 u\28medium\29, .\37 u\24\28medium\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\36 u\28medium\29, .\36 u\24\28medium\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\35 u\28medium\29, .\35 u\24\28medium\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\34 u\28medium\29, .\34 u\24\28medium\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\33 u\28medium\29, .\33 u\24\28medium\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\32 u\28medium\29, .\32 u\24\28medium\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 u\28medium\29, .\31 u\24\28medium\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 2u\24\28medium\29 + *,
 +
.\31 1u\24\28medium\29 + *,
 +
.\31 0u\24\28medium\29 + *,
 +
.\39 u\24\28medium\29 + *,
 +
.\38 u\24\28medium\29 + *,
 +
.\37 u\24\28medium\29 + *,
 +
.\36 u\24\28medium\29 + *,
 +
.\35 u\24\28medium\29 + *,
 +
.\34 u\24\28medium\29 + *,
 +
.\33 u\24\28medium\29 + *,
 +
.\32 u\24\28medium\29 + *,
 +
.\31 u\24\28medium\29 + * {
 +
clear: left;
 +
}
 +
 
 +
.\-11u\28medium\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 
 +
.\-10u\28medium\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 
 +
.\-9u\28medium\29 {
 +
margin-left: 75%;
 +
}
 +
 
 +
.\-8u\28medium\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 
 +
.\-7u\28medium\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 
 +
.\-6u\28medium\29 {
 +
margin-left: 50%;
 +
}
 +
 
 +
.\-5u\28medium\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 
 +
.\-4u\28medium\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 
 +
.\-3u\28medium\29 {
 +
margin-left: 25%;
 +
}
 +
 
 +
.\-2u\28medium\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 
 +
.\-1u\28medium\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
.row > * {
 +
padding: 0 0 0 1.25rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -1.25rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 1.25rem 0 0 1.25rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -1.25rem 0 -1px -1.25rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 2.5rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -2.5rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 2.5rem 0 0 2.5rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -2.5rem 0 -1px -2.5rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 1.875rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -1.875rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 1.875rem 0 0 1.875rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -1.875rem 0 -1px -1.875rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 0.625rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -0.625rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 0.625rem 0 0 0.625rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -0.625rem 0 -1px -0.625rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.3125rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.3125rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.3125rem 0 0 0.3125rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.3125rem 0 -1px -0.3125rem;
 +
}
 +
 
 +
.\31 2u\28small\29, .\31 2u\24\28small\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 1u\28small\29, .\31 1u\24\28small\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 0u\28small\29, .\31 0u\24\28small\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\39 u\28small\29, .\39 u\24\28small\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\38 u\28small\29, .\38 u\24\28small\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\37 u\28small\29, .\37 u\24\28small\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\36 u\28small\29, .\36 u\24\28small\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\35 u\28small\29, .\35 u\24\28small\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\34 u\28small\29, .\34 u\24\28small\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\33 u\28small\29, .\33 u\24\28small\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\32 u\28small\29, .\32 u\24\28small\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 u\28small\29, .\31 u\24\28small\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 2u\24\28small\29 + *,
 +
.\31 1u\24\28small\29 + *,
 +
.\31 0u\24\28small\29 + *,
 +
.\39 u\24\28small\29 + *,
 +
.\38 u\24\28small\29 + *,
 +
.\37 u\24\28small\29 + *,
 +
.\36 u\24\28small\29 + *,
 +
.\35 u\24\28small\29 + *,
 +
.\34 u\24\28small\29 + *,
 +
.\33 u\24\28small\29 + *,
 +
.\32 u\24\28small\29 + *,
 +
.\31 u\24\28small\29 + * {
 +
clear: left;
 +
}
 +
 
 +
.\-11u\28small\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 
 +
.\-10u\28small\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 
 +
.\-9u\28small\29 {
 +
margin-left: 75%;
 +
}
 +
 
 +
.\-8u\28small\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 
 +
.\-7u\28small\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 
 +
.\-6u\28small\29 {
 +
margin-left: 50%;
 +
}
 +
 
 +
.\-5u\28small\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 
 +
.\-4u\28small\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 
 +
.\-3u\28small\29 {
 +
margin-left: 25%;
 +
}
 +
 
 +
.\-2u\28small\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 
 +
.\-1u\28small\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
.row > * {
 +
padding: 0 0 0 1.25rem;
 +
}
 +
 
 +
.row {
 +
margin: 0 0 -1px -1.25rem;
 +
}
 +
 
 +
.row.uniform > * {
 +
padding: 1.25rem 0 0 1.25rem;
 +
}
 +
 
 +
.row.uniform {
 +
margin: -1.25rem 0 -1px -1.25rem;
 +
}
 +
 
 +
.row.\32 00\25 > * {
 +
padding: 0 0 0 2.5rem;
 +
}
 +
 
 +
.row.\32 00\25 {
 +
margin: 0 0 -1px -2.5rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 > * {
 +
padding: 2.5rem 0 0 2.5rem;
 +
}
 +
 
 +
.row.uniform.\32 00\25 {
 +
margin: -2.5rem 0 -1px -2.5rem;
 +
}
 +
 
 +
.row.\31 50\25 > * {
 +
padding: 0 0 0 1.875rem;
 +
}
 +
 
 +
.row.\31 50\25 {
 +
margin: 0 0 -1px -1.875rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 > * {
 +
padding: 1.875rem 0 0 1.875rem;
 +
}
 +
 
 +
.row.uniform.\31 50\25 {
 +
margin: -1.875rem 0 -1px -1.875rem;
 +
}
 +
 
 +
.row.\35 0\25 > * {
 +
padding: 0 0 0 0.625rem;
 +
}
 +
 
 +
.row.\35 0\25 {
 +
margin: 0 0 -1px -0.625rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 > * {
 +
padding: 0.625rem 0 0 0.625rem;
 +
}
 +
 
 +
.row.uniform.\35 0\25 {
 +
margin: -0.625rem 0 -1px -0.625rem;
 +
}
 +
 
 +
.row.\32 5\25 > * {
 +
padding: 0 0 0 0.3125rem;
 +
}
 +
 
 +
.row.\32 5\25 {
 +
margin: 0 0 -1px -0.3125rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 > * {
 +
padding: 0.3125rem 0 0 0.3125rem;
 +
}
 +
 
 +
.row.uniform.\32 5\25 {
 +
margin: -0.3125rem 0 -1px -0.3125rem;
 +
}
 +
 
 +
.\31 2u\28xsmall\29, .\31 2u\24\28xsmall\29 {
 +
width: 100%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 1u\28xsmall\29, .\31 1u\24\28xsmall\29 {
 +
width: 91.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 0u\28xsmall\29, .\31 0u\24\28xsmall\29 {
 +
width: 83.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\39 u\28xsmall\29, .\39 u\24\28xsmall\29 {
 +
width: 75%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\38 u\28xsmall\29, .\38 u\24\28xsmall\29 {
 +
width: 66.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\37 u\28xsmall\29, .\37 u\24\28xsmall\29 {
 +
width: 58.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\36 u\28xsmall\29, .\36 u\24\28xsmall\29 {
 +
width: 50%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\35 u\28xsmall\29, .\35 u\24\28xsmall\29 {
 +
width: 41.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\34 u\28xsmall\29, .\34 u\24\28xsmall\29 {
 +
width: 33.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\33 u\28xsmall\29, .\33 u\24\28xsmall\29 {
 +
width: 25%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\32 u\28xsmall\29, .\32 u\24\28xsmall\29 {
 +
width: 16.6666666667%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 u\28xsmall\29, .\31 u\24\28xsmall\29 {
 +
width: 8.3333333333%;
 +
clear: none;
 +
margin-left: 0;
 +
}
 +
 
 +
.\31 2u\24\28xsmall\29 + *,
 +
.\31 1u\24\28xsmall\29 + *,
 +
.\31 0u\24\28xsmall\29 + *,
 +
.\39 u\24\28xsmall\29 + *,
 +
.\38 u\24\28xsmall\29 + *,
 +
.\37 u\24\28xsmall\29 + *,
 +
.\36 u\24\28xsmall\29 + *,
 +
.\35 u\24\28xsmall\29 + *,
 +
.\34 u\24\28xsmall\29 + *,
 +
.\33 u\24\28xsmall\29 + *,
 +
.\32 u\24\28xsmall\29 + *,
 +
.\31 u\24\28xsmall\29 + * {
 +
clear: left;
 +
}
 +
 
 +
.\-11u\28xsmall\29 {
 +
margin-left: 91.66667%;
 +
}
 +
 
 +
.\-10u\28xsmall\29 {
 +
margin-left: 83.33333%;
 +
}
 +
 
 +
.\-9u\28xsmall\29 {
 +
margin-left: 75%;
 +
}
 +
 
 +
.\-8u\28xsmall\29 {
 +
margin-left: 66.66667%;
 +
}
 +
 
 +
.\-7u\28xsmall\29 {
 +
margin-left: 58.33333%;
 +
}
 +
 
 +
.\-6u\28xsmall\29 {
 +
margin-left: 50%;
 +
}
 +
 
 +
.\-5u\28xsmall\29 {
 +
margin-left: 41.66667%;
 +
}
 +
 
 +
.\-4u\28xsmall\29 {
 +
margin-left: 33.33333%;
 +
}
 +
 
 +
.\-3u\28xsmall\29 {
 +
margin-left: 25%;
 +
}
 +
 
 +
.\-2u\28xsmall\29 {
 +
margin-left: 16.66667%;
 +
}
 +
 
 +
.\-1u\28xsmall\29 {
 +
margin-left: 8.33333%;
 +
}
 +
 
 +
}
 +
 
 +
/* Basic */
 +
 
 +
@-ms-viewport {
 +
width: device-width;
 +
}
 +
 
 +
body {
 +
-ms-overflow-style: scrollbar;
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
html, body {
 +
min-width: 320px;
 +
}
 +
 
 +
}
 +
body {
 +
background: #fff;
 +
}
 +
 
 +
body.is-loading *, body.is-loading *:before, body.is-loading *:after {
 +
-moz-animation: none !important;
 +
-webkit-animation: none !important;
 +
-ms-animation: none !important;
 +
animation: none !important;
 +
-moz-transition: none !important;
 +
-webkit-transition: none !important;
 +
-ms-transition: none !important;
 +
transition: none !important;
 +
}
 +
 
 +
/* Type */
 +
 
 +
html {
 +
font-size: 13pt;
 +
}
 +
 
 +
@media screen and (max-width: 1680px) {
 +
 
 +
html {
 +
font-size: 11pt;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 1280px) {
 +
 
 +
html {
 +
font-size: 11pt;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
html {
 +
font-size: 12pt;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
html {
 +
font-size: 12pt;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
html {
 +
font-size: 12pt;
 +
}
 +
 
 +
}
 +
 
 +
body {
 +
background-color: #fff;
 +
color: #444;
 +
}
 +
 
 +
body, input, select, textarea {
 +
font-family: "Poppins", sans-serif;
 +
font-weight: 300;
 +
font-size: 1rem;
 +
line-height: 1.65;
 +
}
 +
 
 +
a {
 +
text-decoration: underline;
 +
}
 +
 
 +
a:hover {
 +
text-decoration: none;
 +
}
 +
 
 +
strong, b {
 +
font-weight: 600;
 +
}
 +
 
 +
em, i {
 +
font-style: italic;
 +
}
 +
 
 +
p {
 +
margin: 0 0 2rem 0;
 +
}
 +
 
 +
p.special {
 +
text-transform: uppercase;
 +
font-size: .75rem;
 +
font-weight: 300;
 +
margin: 0 0 .5rem 0;
 +
padding: 0 0 1rem 0;
 +
letter-spacing: .25rem;
 +
}
 +
 
 +
p.special:after {
 +
content: '';
 +
position: absolute;
 +
margin: auto;
 +
right: 0;
 +
bottom: 0;
 +
left: 0;
 +
width: 50%;
 +
height: 1px;
 +
background-color: rgba(0, 0, 0, 0.125);
 +
}
 +
 
 +
h1, h2, h3, h4, h5, h6 {
 +
font-weight: 300;
 +
line-height: 1.5;
 +
margin: 0 0 1rem 0;
 +
}
 +
 
 +
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
 +
color: inherit;
 +
text-decoration: none;
 +
}
 +
 
 +
h2 {
 +
font-size: 1.75rem;
 +
}
 +
 
 +
h3 {
 +
font-size: 1.35rem;
 +
}
 +
 
 +
h4 {
 +
font-size: 1.1rem;
 +
}
 +
 
 +
h5 {
 +
font-size: 0.9rem;
 +
}
 +
 
 +
h6 {
 +
font-size: 0.7rem;
 +
}
 +
 
 +
sub {
 +
font-size: 0.8rem;
 +
position: relative;
 +
top: 0.5rem;
 +
}
 +
 
 +
sup {
 +
font-size: 0.8rem;
 +
position: relative;
 +
top: -0.5rem;
 +
}
 +
 
 +
blockquote {
 +
border-left: solid 4px;
 +
font-style: italic;
 +
margin: 0 0 2rem 0;
 +
padding: 0.5rem 0 0.5rem 2rem;
 +
}
 +
 
 +
code {
 +
border-radius: 2px;
 +
border: solid 1px;
 +
font-family: "Courier New", monospace;
 +
font-size: 0.9rem;
 +
margin: 0 0.25rem;
 +
padding: 0.25rem 0.65rem;
 +
}
 +
 
 +
pre {
 +
-webkit-overflow-scrolling: touch;
 +
font-family: "Courier New", monospace;
 +
font-size: 0.9rem;
 +
margin: 0 0 2rem 0;
 +
}
 +
 
 +
pre code {
 +
display: block;
 +
line-height: 1.75;
 +
padding: 1rem 1.5rem;
 +
overflow-x: auto;
 +
}
 +
 
 +
hr {
 +
border: 0;
 +
border-bottom: solid 1px;
 +
margin: 2rem 0;
 +
}
 +
 
 +
hr.major {
 +
margin: 3rem 0;
 +
}
 +
 
 +
.align-left {
 +
text-align: left;
 +
}
 +
 
 +
.align-center {
 +
text-align: center;
 +
}
 +
 
 +
.align-right {
 +
text-align: right;
 +
}
 +
 
 +
input, select, textarea {
 +
color: #555;
 +
}
 +
 
 +
a {
 +
color: #8a4680;
 +
}
 +
 
 +
strong, b {
 +
color: #555;
 +
}
 +
 
 +
h1, h2, h3, h4, h5, h6 {
 +
color: #555;
 +
}
 +
 
 +
blockquote {
 +
border-left-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
code {
 +
background: rgba(144, 144, 144, 0.075);
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
hr {
 +
border-bottom-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
/* Box */
 +
 
 +
.box {
 +
margin-bottom: 2rem;
 +
background: #FFF;
 +
}
 +
 
 +
.box .image.fit {
 +
margin: 0;
 +
border-radius: 0;
 +
}
 +
 
 +
.box .image.fit img {
 +
border-radius: 0;
 +
}
 +
 
 +
.box header h2 {
 +
margin-bottom: 2rem;
 +
}
 +
 
 +
.box header p {
 +
text-transform: uppercase;
 +
font-size: .75rem;
 +
font-weight: 300;
 +
margin: 0 0 .25rem 0;
 +
padding: 0 0 .75rem 0;
 +
letter-spacing: .25rem;
 +
}
 +
 
 +
.box header p:after {
 +
content: '';
 +
position: absolute;
 +
margin: auto;
 +
right: 0;
 +
bottom: 0;
 +
left: 0;
 +
width: 50%;
 +
height: 1px;
 +
background-color: rgba(0, 0, 0, 0.125);
 +
}
 +
 
 +
.box .content {
 +
padding: 3rem;
 +
}
 +
 
 +
.box > :last-child,
 +
.box > :last-child > :last-child,
 +
.box > :last-child > :last-child > :last-child {
 +
margin-bottom: 0;
 +
}
 +
 
 +
.box.alt {
 +
border: 0;
 +
border-radius: 0;
 +
padding: 0;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
.box .content {
 +
padding: 2rem;
 +
}
 +
 
 +
}
 +
 
 +
.box {
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
/* Button */
 +
 
 +
input[type="submit"],
 +
input[type="reset"],
 +
input[type="button"],
 +
button,
 +
.button {
 +
-moz-appearance: none;
 +
-webkit-appearance: none;
 +
-ms-appearance: none;
 +
appearance: none;
 +
-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 +
-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 +
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 +
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 +
border-radius: 2px;
 +
border: 0;
 +
cursor: pointer;
 +
display: inline-block;
 +
font-weight: 300;
 +
height: 2.85rem;
 +
line-height: 2.95rem;
 +
padding: 0 1.5rem;
 +
text-align: center;
 +
text-decoration: none;
 +
text-transform: uppercase;
 +
white-space: nowrap;
 +
}
 +
 
 +
input[type="submit"].icon,
 +
input[type="reset"].icon,
 +
input[type="button"].icon,
 +
button.icon,
 +
.button.icon {
 +
padding-left: 1.35rem;
 +
}
 +
 
 +
input[type="submit"].icon:before,
 +
input[type="reset"].icon:before,
 +
input[type="button"].icon:before,
 +
button.icon:before,
 +
.button.icon:before {
 +
margin-right: 0.5rem;
 +
}
 +
 
 +
input[type="submit"].fit,
 +
input[type="reset"].fit,
 +
input[type="button"].fit,
 +
button.fit,
 +
.button.fit {
 +
display: block;
 +
margin: 0 0 1rem 0;
 +
width: 100%;
 +
}
 +
 
 +
input[type="submit"].small,
 +
input[type="reset"].small,
 +
input[type="button"].small,
 +
button.small,
 +
.button.small {
 +
font-size: 0.8rem;
 +
}
 +
 
 +
input[type="submit"].big,
 +
input[type="reset"].big,
 +
input[type="button"].big,
 +
button.big,
 +
.button.big {
 +
font-size: 1.35rem;
 +
}
 +
 
 +
input[type="submit"].disabled, input[type="submit"]:disabled,
 +
input[type="reset"].disabled,
 +
input[type="reset"]:disabled,
 +
input[type="button"].disabled,
 +
input[type="button"]:disabled,
 +
button.disabled,
 +
button:disabled,
 +
.button.disabled,
 +
.button:disabled {
 +
-moz-pointer-events: none;
 +
-webkit-pointer-events: none;
 +
-ms-pointer-events: none;
 +
pointer-events: none;
 +
opacity: 0.25;
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
input[type="submit"],
 +
input[type="reset"],
 +
input[type="button"],
 +
button,
 +
.button {
 +
padding: 0;
 +
width: 100%;
 +
}
 +
 
 +
}
 +
 
 +
input[type="submit"],
 +
input[type="reset"],
 +
input[type="button"],
 +
button,
 +
.button {
 +
background-color: #f2f2f2;
 +
color: #000 !important;
 +
}
 +
 
 +
input[type="submit"]:hover,
 +
input[type="reset"]:hover,
 +
input[type="button"]:hover,
 +
button:hover,
 +
.button:hover {
 +
background-color: white;
 +
}
 +
 
 +
input[type="submit"]:active,
 +
input[type="reset"]:active,
 +
input[type="button"]:active,
 +
button:active,
 +
.button:active {
 +
background-color: #e5e5e5;
 +
}
 +
 
 +
input[type="submit"].alt,
 +
input[type="reset"].alt,
 +
input[type="button"].alt,
 +
button.alt,
 +
.button.alt {
 +
background-color: transparent;
 +
box-shadow: inset 0 0 0 2px rgba(144, 144, 144, 0.25);
 +
color: #555 !important;
 +
}
 +
 
 +
input[type="submit"].alt:hover,
 +
input[type="reset"].alt:hover,
 +
input[type="button"].alt:hover,
 +
button.alt:hover,
 +
.button.alt:hover {
 +
background-color: rgba(144, 144, 144, 0.075);
 +
}
 +
 
 +
input[type="submit"].alt:active,
 +
input[type="reset"].alt:active,
 +
input[type="button"].alt:active,
 +
button.alt:active,
 +
.button.alt:active {
 +
background-color: rgba(144, 144, 144, 0.2);
 +
}
 +
 
 +
input[type="submit"].alt.icon:before,
 +
input[type="reset"].alt.icon:before,
 +
input[type="button"].alt.icon:before,
 +
button.alt.icon:before,
 +
.button.alt.icon:before {
 +
color: #bbb;
 +
}
 +
 
 +
input[type="submit"].special,
 +
input[type="reset"].special,
 +
input[type="button"].special,
 +
button.special,
 +
.button.special {
 +
background-color: #8a4680;
 +
color: #ffffff !important;
 +
}
 +
 
 +
input[type="submit"].special:hover,
 +
input[type="reset"].special:hover,
 +
input[type="button"].special:hover,
 +
button.special:hover,
 +
.button.special:hover {
 +
background-color: #9b4f90;
 +
}
 +
 
 +
input[type="submit"].special:active,
 +
input[type="reset"].special:active,
 +
input[type="button"].special:active,
 +
button.special:active,
 +
.button.special:active {
 +
background-color: #793d70;
 +
}
 +
 
 +
/* Form */
 +
 
 +
form {
 +
margin: 0 0 2rem 0;
 +
}
 +
 
 +
label {
 +
display: block;
 +
font-size: 0.9rem;
 +
font-weight: 700;
 +
margin: 0 0 1rem 0;
 +
}
 +
 
 +
input[type="text"],
 +
input[type="password"],
 +
input[type="email"],
 +
select,
 +
textarea {
 +
-moz-appearance: none;
 +
-webkit-appearance: none;
 +
-ms-appearance: none;
 +
appearance: none;
 +
border-radius: 2px;
 +
border: none;
 +
border: solid 1px;
 +
color: inherit;
 +
display: block;
 +
outline: 0;
 +
padding: 0 1rem;
 +
text-decoration: none;
 +
width: 100%;
 +
}
 +
 
 +
input[type="text"]:invalid,
 +
input[type="password"]:invalid,
 +
input[type="email"]:invalid,
 +
select:invalid,
 +
textarea:invalid {
 +
box-shadow: none;
 +
}
 +
 
 +
.select-wrapper {
 +
text-decoration: none;
 +
display: block;
 +
position: relative;
 +
}
 +
 
 +
.select-wrapper:before {
 +
-moz-osx-font-smoothing: grayscale;
 +
-webkit-font-smoothing: antialiased;
 +
font-family: FontAwesome;
 +
font-style: normal;
 +
font-weight: normal;
 +
text-transform: none !important;
 +
}
 +
 
 +
.select-wrapper:before {
 +
content: '\f078';
 +
display: block;
 +
height: 2.75rem;
 +
line-height: 2.75rem;
 +
pointer-events: none;
 +
position: absolute;
 +
right: 0;
 +
text-align: center;
 +
top: 0;
 +
width: 2.75rem;
 +
}
 +
 
 +
.select-wrapper select::-ms-expand {
 +
display: none;
 +
}
 +
 
 +
input[type="text"],
 +
input[type="password"],
 +
input[type="email"],
 +
select {
 +
height: 2.75rem;
 +
}
 +
 
 +
textarea {
 +
padding: 0.75rem 1rem;
 +
}
 +
 
 +
input[type="checkbox"],
 +
input[type="radio"] {
 +
-moz-appearance: none;
 +
-webkit-appearance: none;
 +
-ms-appearance: none;
 +
appearance: none;
 +
display: block;
 +
float: left;
 +
margin-right: -2rem;
 +
opacity: 0;
 +
width: 1rem;
 +
z-index: -1;
 +
}
 +
 
 +
input[type="checkbox"] + label,
 +
input[type="radio"] + label {
 +
text-decoration: none;
 +
cursor: pointer;
 +
display: inline-block;
 +
font-size: 1rem;
 +
font-weight: 400;
 +
padding-left: 2.4rem;
 +
padding-right: 0.75rem;
 +
position: relative;
 +
}
 +
 
 +
input[type="checkbox"] + label:before,
 +
input[type="radio"] + label:before {
 +
-moz-osx-font-smoothing: grayscale;
 +
-webkit-font-smoothing: antialiased;
 +
font-family: FontAwesome;
 +
font-style: normal;
 +
font-weight: normal;
 +
text-transform: none !important;
 +
}
 +
input[type="checkbox"] + label:before,
 +
input[type="radio"] + label:before {
 +
border-radius: 2px;
 +
border: solid 1px;
 +
content: '';
 +
display: inline-block;
 +
height: 1.65rem;
 +
left: 0;
 +
line-height: 1.58125rem;
 +
position: absolute;
 +
text-align: center;
 +
top: 0;
 +
width: 1.65rem;
 +
}
 +
 
 +
input[type="checkbox"]:checked + label:before,
 +
input[type="radio"]:checked + label:before {
 +
content: '\f00c';
 +
}
 +
 
 +
input[type="checkbox"] + label:before {
 +
border-radius: 2px;
 +
}
 +
 
 +
input[type="radio"] + label:before {
 +
border-radius: 100%;
 +
}
 +
 
 +
::-webkit-input-placeholder {
 +
opacity: 1.0;
 +
}
 +
 
 +
:-moz-placeholder {
 +
opacity: 1.0;
 +
}
 +
 
 +
::-moz-placeholder {
 +
opacity: 1.0;
 +
}
 +
 
 +
:-ms-input-placeholder {
 +
opacity: 1.0;
 +
}
 +
 
 +
.formerize-placeholder {
 +
opacity: 1.0;
 +
}
 +
 
 +
label {
 +
color: #555;
 +
}
 +
 
 +
input[type="text"],
 +
input[type="password"],
 +
input[type="email"],
 +
select,
 +
textarea {
 +
background: rgba(144, 144, 144, 0.075);
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
input[type="text"]:focus,
 +
input[type="password"]:focus,
 +
input[type="email"]:focus,
 +
select:focus,
 +
textarea:focus {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
.select-wrapper:before {
 +
color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
input[type="checkbox"] + label,
 +
input[type="radio"] + label {
 +
color: #444;
 +
}
 +
 
 +
input[type="checkbox"] + label:before,
 +
input[type="radio"] + label:before {
 +
background: rgba(144, 144, 144, 0.075);
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
input[type="checkbox"]:checked + label:before,
 +
input[type="radio"]:checked + label:before {
 +
background-color: #8a4680;
 +
border-color: #8a4680;
 +
color: #ffffff;
 +
}
 +
 
 +
input[type="checkbox"]:focus + label:before,
 +
input[type="radio"]:focus + label:before {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
::-webkit-input-placeholder {
 +
color: #bbb !important;
 +
}
 +
 
 +
:-moz-placeholder {
 +
color: #bbb !important;
 +
}
 +
 
 +
::-moz-placeholder {
 +
color: #bbb !important;
 +
}
 +
 
 +
:-ms-input-placeholder {
 +
color: #bbb !important;
 +
}
 +
 
 +
.formerize-placeholder {
 +
color: #bbb !important;
 +
}
 +
 
 +
/* Icon */
 +
 
 +
.icon {
 +
text-decoration: none;
 +
border-bottom: none;
 +
position: relative;
 +
}
 +
 
 +
.icon:before {
 +
-moz-osx-font-smoothing: grayscale;
 +
-webkit-font-smoothing: antialiased;
 +
font-family: FontAwesome;
 +
font-style: normal;
 +
font-weight: normal;
 +
text-transform: none !important;
 +
}
 +
 
 +
.icon > .label {
 +
display: none;
 +
}
 +
 
 +
/* Image */
 +
 
 +
.image {
 +
border-radius: 2px;
 +
border: 0;
 +
display: inline-block;
 +
position: relative;
 +
}
 +
 
 +
.image img {
 +
border-radius: 2px;
 +
display: block;
 +
}
 +
 
 +
.image.left, .image.right {
 +
max-width: 40%;
 +
}
 +
 
 +
.image.left img, .image.right img {
 +
width: 100%;
 +
}
 +
 
 +
.image.left {
 +
float: left;
 +
margin: 0 1.5rem 1rem 0;
 +
top: 0.25rem;
 +
}
 +
 
 +
.image.right {
 +
float: right;
 +
margin: 0 0 1rem 1.5rem;
 +
top: 0.25rem;
 +
}
 +
 
 +
.image.fit {
 +
display: block;
 +
margin: 0 0 2rem 0;
 +
width: 100%;
 +
}
 +
 
 +
.image.fit img {
 +
width: 100%;
 +
}
 +
 
 +
.image.main {
 +
display: block;
 +
margin: 0 0 3rem 0;
 +
width: 100%;
 +
}
 +
 
 +
.image.main img {
 +
width: 100%;
 +
}
 +
 
 +
/* List */
 +
 
 +
ol {
 +
list-style: decimal;
 +
margin: 0 0 2rem 0;
 +
padding-left: 1.25rem;
 +
}
 +
 
 +
ol li {
 +
padding-left: 0.25rem;
 +
}
 +
 
 +
ul {
 +
list-style: disc;
 +
margin: 0 0 2rem 0;
 +
padding-left: 1rem;
 +
}
 +
 
 +
ul li {
 +
padding-left: 0.5rem;
 +
}
 +
 
 +
ul.alt {
 +
list-style: none;
 +
padding-left: 0;
 +
}
 +
 
 +
ul.alt li {
 +
border-top: solid 1px;
 +
padding: 0.5rem 0;
 +
}
 +
 
 +
ul.alt li:first-child {
 +
border-top: 0;
 +
padding-top: 0;
 +
}
 +
 
 +
ul.icons {
 +
cursor: default;
 +
list-style: none;
 +
padding-left: 0;
 +
}
 +
 
 +
ul.icons li {
 +
display: inline-block;
 +
padding: 0 1rem 0 0;
 +
}
 +
 
 +
ul.icons li:last-child {
 +
padding-right: 0;
 +
}
 +
 
 +
ul.icons li .icon:before {
 +
font-size: 2rem;
 +
}
 +
 
 +
ul.actions {
 +
cursor: default;
 +
list-style: none;
 +
padding-left: 0;
 +
}
 +
 
 +
ul.actions li {
 +
display: inline-block;
 +
padding: 0 1rem 0 0;
 +
vertical-align: middle;
 +
}
 +
 
 +
ul.actions li:last-child {
 +
padding-right: 0;
 +
}
 +
 
 +
ul.actions.small li {
 +
padding: 0 0.5rem 0 0;
 +
}
 +
 
 +
ul.actions.vertical li {
 +
display: block;
 +
padding: 1rem 0 0 0;
 +
}
 +
 
 +
ul.actions.vertical li:first-child {
 +
padding-top: 0;
 +
}
 +
 
 +
ul.actions.vertical li > * {
 +
margin-bottom: 0;
 +
}
 +
 
 +
ul.actions.vertical.small li {
 +
padding: 0.5rem 0 0 0;
 +
}
 +
 
 +
ul.actions.vertical.small li:first-child {
 +
padding-top: 0;
 +
}
 +
 
 +
ul.actions.fit {
 +
display: table;
 +
margin-left: -1rem;
 +
padding: 0;
 +
table-layout: fixed;
 +
width: calc(100% + 1rem);
 +
}
 +
 
 +
ul.actions.fit li {
 +
display: table-cell;
 +
padding: 0 0 0 1rem;
 +
}
 +
 
 +
ul.actions.fit li > * {
 +
margin-bottom: 0;
 +
}
 +
 
 +
ul.actions.fit.small {
 +
margin-left: -0.5rem;
 +
width: calc(100% + 0.5rem);
 +
}
 +
 
 +
ul.actions.fit.small li {
 +
padding: 0 0 0 0.5rem;
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
ul.actions {
 +
margin: 0 0 2rem 0;
 +
}
 +
 
 +
ul.actions li {
 +
padding: 1rem 0 0 0;
 +
display: block;
 +
text-align: center;
 +
width: 100%;
 +
}
 +
 
 +
ul.actions li:first-child {
 +
padding-top: 0;
 +
}
 +
 
 +
ul.actions li > * {
 +
width: 100%;
 +
margin: 0 !important;
 +
}
 +
 
 +
ul.actions li > *.icon:before {
 +
margin-left: -2rem;
 +
}
 +
 
 +
ul.actions.small li {
 +
padding: 0.5rem 0 0 0;
 +
}
 +
 
 +
ul.actions.small li:first-child {
 +
padding-top: 0;
 +
}
 +
 
 +
}
 +
 
 +
dl {
 +
margin: 0 0 2rem 0;
 +
}
 +
 
 +
dl dt {
 +
display: block;
 +
font-weight: 700;
 +
margin: 0 0 1rem 0;
 +
}
 +
 
 +
dl dd {
 +
margin-left: 2rem;
 +
}
 +
 
 +
ul.alt li {
 +
border-top-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
/* Section/Article */
 +
 
 +
section.special, article.special {
 +
text-align: center;
 +
}
 +
 
 +
header p {
 +
position: relative;
 +
margin: 0 0 1.5rem 0;
 +
}
 +
 
 +
header h2 + p {
 +
font-size: 1.25rem;
 +
margin-top: -1rem;
 +
}
 +
 
 +
header h3 + p {
 +
font-size: 1.1rem;
 +
margin-top: -0.8rem;
 +
}
 +
 
 +
header h4 + p,
 +
header h5 + p,
 +
header h6 + p {
 +
font-size: 0.9rem;
 +
margin-top: -0.6rem;
 +
}
 +
 
 +
header p {
 +
color: #bbb;
 +
}
 +
 
 +
/* Table */
 +
 
 +
.table-wrapper {
 +
-webkit-overflow-scrolling: touch;
 +
overflow-x: auto;
 +
}
 +
 
 +
table {
 +
margin: 0 0 2rem 0;
 +
width: 100%;
 +
}
 +
 
 +
table tbody tr {
 +
border: solid 1px;
 +
border-left: 0;
 +
border-right: 0;
 +
}
 +
 
 +
table td {
 +
padding: 0.75rem 0.75rem;
 +
}
 +
 
 +
table th {
 +
font-size: 0.9rem;
 +
font-weight: 700;
 +
padding: 0 0.75rem 0.75rem 0.75rem;
 +
text-align: left;
 +
}
 +
 
 +
table thead {
 +
border-bottom: solid 2px;
 +
}
 +
 
 +
table tfoot {
 +
border-top: solid 2px;
 +
}
 +
 
 +
table.alt {
 +
border-collapse: separate;
 +
}
 +
 
 +
table.alt tbody tr td {
 +
border: solid 1px;
 +
border-left-width: 0;
 +
border-top-width: 0;
 +
}
 +
 
 +
table.alt tbody tr td:first-child {
 +
border-left-width: 1px;
 +
}
 +
 
 +
table.alt tbody tr:first-child td {
 +
border-top-width: 1px;
 +
}
 +
 
 +
table.alt thead {
 +
border-bottom: 0;
 +
}
 +
 
 +
table.alt tfoot {
 +
border-top: 0;
 +
}
 +
 
 +
table tbody tr {
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
table tbody tr:nth-child(2n + 1) {
 +
background-color: rgba(144, 144, 144, 0.075);
 +
}
 +
 
 +
table th {
 +
color: #555;
 +
}
 +
 
 +
table thead {
 +
border-bottom-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
table tfoot {
 +
border-top-color: rgba(144, 144, 144, 0.25);
 +
}
 +
 
 +
table.alt tbody tr td {
 +
border-color: rgba(144, 144, 144, 0.25);
 +
}
 +
/* Wrapper */
 +
 
 +
.wrapper {
 +
padding: 6rem 0 4rem 0 ;
 +
position: relative;
 +
margin: 0;
 +
}
 +
 
 +
.wrapper > .inner {
 +
margin: 0 auto;
 +
width: 80rem;
 +
}
 +
 
 +
.wrapper.style1 {
 +
background-color: #8a4680;
 +
color: #e2d1df;
 +
}
 +
 
 +
.wrapper.style1 input, .wrapper.style1 select, .wrapper.style1 textarea {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 a {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 strong, .wrapper.style1 b {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 h1, .wrapper.style1 h2, .wrapper.style1 h3, .wrapper.style1 h4, .wrapper.style1 h5, .wrapper.style1 h6 {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 blockquote {
 +
border-left-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 code {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 hr {
 +
border-bottom-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 .box {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"],
 +
.wrapper.style1 input[type="reset"],
 +
.wrapper.style1 input[type="button"],
 +
.wrapper.style1 button,
 +
.wrapper.style1 .button {
 +
background-color: #f2f2f2;
 +
color: #000 !important;
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"]:hover,
 +
.wrapper.style1 input[type="reset"]:hover,
 +
.wrapper.style1 input[type="button"]:hover,
 +
.wrapper.style1 button:hover,
 +
.wrapper.style1 .button:hover {
 +
background-color: white;
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"]:active,
 +
.wrapper.style1 input[type="reset"]:active,
 +
.wrapper.style1 input[type="button"]:active,
 +
.wrapper.style1 button:active,
 +
.wrapper.style1 .button:active {
 +
background-color: #e5e5e5;
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"].alt,
 +
.wrapper.style1 input[type="reset"].alt,
 +
.wrapper.style1 input[type="button"].alt,
 +
.wrapper.style1 button.alt,
 +
.wrapper.style1 .button.alt {
 +
background-color: transparent;
 +
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.25);
 +
color: #ffffff !important;
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"].alt:hover,
 +
.wrapper.style1 input[type="reset"].alt:hover,
 +
.wrapper.style1 input[type="button"].alt:hover,
 +
.wrapper.style1 button.alt:hover,
 +
.wrapper.style1 .button.alt:hover {
 +
background-color: rgba(255, 255, 255, 0.075);
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"].alt:active,
 +
.wrapper.style1 input[type="reset"].alt:active,
 +
.wrapper.style1 input[type="button"].alt:active,
 +
.wrapper.style1 button.alt:active,
 +
.wrapper.style1 .button.alt:active {
 +
background-color: rgba(255, 255, 255, 0.2);
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"].alt.icon:before,
 +
.wrapper.style1 input[type="reset"].alt.icon:before,
 +
.wrapper.style1 input[type="button"].alt.icon:before,
 +
.wrapper.style1 button.alt.icon:before,
 +
.wrapper.style1 .button.alt.icon:before {
 +
color: #d0b5cc;
 +
}
 +
 
 +
.wrapper.style1 input[type="submit"].special,
 +
.wrapper.style1 input[type="reset"].special,
 +
.wrapper.style1 input[type="button"].special,
 +
.wrapper.style1 button.special,
 +
.wrapper.style1 .button.special {
 +
background-color: #ffffff;
 +
color: #8a4680 !important;
 +
}
 +
 
 +
.wrapper.style1 label {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 input[type="text"],
 +
.wrapper.style1 input[type="password"],
 +
.wrapper.style1 input[type="email"],
 +
.wrapper.style1 select,
 +
.wrapper.style1 textarea {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 input[type="text"]:focus,
 +
.wrapper.style1 input[type="password"]:focus,
 +
.wrapper.style1 input[type="email"]:focus,
 +
.wrapper.style1 select:focus,
 +
.wrapper.style1 textarea:focus {
 +
border-color: #ffffff;
 +
box-shadow: 0 0 0 1px #ffffff;
 +
}
 +
 
 +
.wrapper.style1 .select-wrapper:before {
 +
color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 input[type="checkbox"] + label,
 +
.wrapper.style1 input[type="radio"] + label {
 +
color: #e2d1df;
 +
}
 +
 
 +
.wrapper.style1 input[type="checkbox"] + label:before,
 +
.wrapper.style1 input[type="radio"] + label:before {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 input[type="checkbox"]:checked + label:before,
 +
.wrapper.style1 input[type="radio"]:checked + label:before {
 +
background-color: #ffffff;
 +
border-color: #ffffff;
 +
color: #8a4680;
 +
}
 +
 
 +
.wrapper.style1 input[type="checkbox"]:focus + label:before,
 +
.wrapper.style1 input[type="radio"]:focus + label:before {
 +
border-color: #ffffff;
 +
box-shadow: 0 0 0 1px #ffffff;
 +
}
 +
 
 +
.wrapper.style1 ::-webkit-input-placeholder {
 +
color: #d0b5cc !important;
 +
}
 +
 
 +
.wrapper.style1 :-moz-placeholder {
 +
color: #d0b5cc !important;
 +
}
 +
 
 +
.wrapper.style1 ::-moz-placeholder {
 +
color: #d0b5cc !important;
 +
}
 +
 
 +
.wrapper.style1 :-ms-input-placeholder {
 +
color: #d0b5cc !important;
 +
}
 +
 
 +
.wrapper.style1 .formerize-placeholder {
 +
color: #d0b5cc !important;
 +
}
 +
 
 +
.wrapper.style1 ul.alt li {
 +
border-top-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 header p {
 +
color: #d0b5cc;
 +
}
 +
 
 +
.wrapper.style1 table tbody tr {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 table tbody tr:nth-child(2n + 1) {
 +
background-color: rgba(255, 255, 255, 0.075);
 +
}
 +
 
 +
.wrapper.style1 table th {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style1 table thead {
 +
border-bottom-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 table tfoot {
 +
border-top-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style1 table.alt tbody tr td {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style2 {
 +
background-color: #f2f2f2;
 +
color: #a6a6a6;
 +
}
 +
 
 +
.wrapper.style2 input, .wrapper.style2 select, .wrapper.style2 textarea {
 +
color: #000;
 +
}
 +
 
 +
.wrapper.style2 a {
 +
color: #8a4680;
 +
}
 +
 
 +
.wrapper.style2 strong, .wrapper.style2 b {
 +
color: #000;
 +
}
 +
 
 +
.wrapper.style2 h1, .wrapper.style2 h2, .wrapper.style2 h3, .wrapper.style2 h4, .wrapper.style2 h5, .wrapper.style2 h6 {
 +
color: #000;
 +
}
 +
 
 +
.wrapper.style2 blockquote {
 +
border-left-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 code {
 +
background: rgba(0, 0, 0, 0.075);
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 hr {
 +
border-bottom-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 .box {
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"],
 +
.wrapper.style2 input[type="reset"],
 +
.wrapper.style2 input[type="button"],
 +
.wrapper.style2 button,
 +
.wrapper.style2 .button {
 +
background-color: #000;
 +
color: #f2f2f2 !important;
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].alt,
 +
.wrapper.style2 input[type="reset"].alt,
 +
.wrapper.style2 input[type="button"].alt,
 +
.wrapper.style2 button.alt,
 +
.wrapper.style2 .button.alt {
 +
background-color: transparent;
 +
box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.15);
 +
color: #000 !important;
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].alt:hover,
 +
.wrapper.style2 input[type="reset"].alt:hover,
 +
.wrapper.style2 input[type="button"].alt:hover,
 +
.wrapper.style2 button.alt:hover,
 +
.wrapper.style2 .button.alt:hover {
 +
background-color: rgba(0, 0, 0, 0.075);
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].alt:active,
 +
.wrapper.style2 input[type="reset"].alt:active,
 +
.wrapper.style2 input[type="button"].alt:active,
 +
.wrapper.style2 button.alt:active,
 +
.wrapper.style2 .button.alt:active {
 +
background-color: rgba(0, 0, 0, 0.2);
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].alt.icon:before,
 +
.wrapper.style2 input[type="reset"].alt.icon:before,
 +
.wrapper.style2 input[type="button"].alt.icon:before,
 +
.wrapper.style2 button.alt.icon:before,
 +
.wrapper.style2 .button.alt.icon:before {
 +
color: #999999;
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].special,
 +
.wrapper.style2 input[type="reset"].special,
 +
.wrapper.style2 input[type="button"].special,
 +
.wrapper.style2 button.special,
 +
.wrapper.style2 .button.special {
 +
background-color: #8a4680;
 +
color: #ffffff !important;
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].special:hover,
 +
.wrapper.style2 input[type="reset"].special:hover,
 +
.wrapper.style2 input[type="button"].special:hover,
 +
.wrapper.style2 button.special:hover,
 +
.wrapper.style2 .button.special:hover {
 +
background-color: #9b4f90;
 +
}
 +
 
 +
.wrapper.style2 input[type="submit"].special:active,
 +
.wrapper.style2 input[type="reset"].special:active,
 +
.wrapper.style2 input[type="button"].special:active,
 +
.wrapper.style2 button.special:active,
 +
.wrapper.style2 .button.special:active {
 +
background-color: #793d70;
 +
}
 +
 
 +
.wrapper.style2 label {
 +
color: #000;
 +
}
 +
 
 +
.wrapper.style2 input[type="text"],
 +
.wrapper.style2 input[type="password"],
 +
.wrapper.style2 input[type="email"],
 +
.wrapper.style2 select,
 +
.wrapper.style2 textarea {
 +
background: rgba(0, 0, 0, 0.075);
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 input[type="text"]:focus,
 +
.wrapper.style2 input[type="password"]:focus,
 +
.wrapper.style2 input[type="email"]:focus,
 +
.wrapper.style2 select:focus,
 +
.wrapper.style2 textarea:focus {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
.wrapper.style2 .select-wrapper:before {
 +
color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 input[type="checkbox"] + label,
 +
.wrapper.style2 input[type="radio"] + label {
 +
color: #a6a6a6;
 +
}
 +
 
 +
.wrapper.style2 input[type="checkbox"] + label:before,
 +
.wrapper.style2 input[type="radio"] + label:before {
 +
background: rgba(0, 0, 0, 0.075);
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 input[type="checkbox"]:checked + label:before,
 +
.wrapper.style2 input[type="radio"]:checked + label:before {
 +
background-color: #8a4680;
 +
border-color: #8a4680;
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style2 input[type="checkbox"]:focus + label:before,
 +
.wrapper.style2 input[type="radio"]:focus + label:before {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
.wrapper.style2 ::-webkit-input-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style2 :-moz-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style2 ::-moz-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style2 :-ms-input-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style2 .formerize-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style2 ul.alt li {
 +
border-top-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 header p {
 +
color: #999999;
 +
}
 +
 
 +
.wrapper.style2 table tbody tr {
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 table tbody tr:nth-child(2n + 1) {
 +
background-color: rgba(0, 0, 0, 0.075);
 +
}
 +
 
 +
.wrapper.style2 table th {
 +
color: #000;
 +
}
 +
 
 +
.wrapper.style2 table thead {
 +
border-bottom-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 table tfoot {
 +
border-top-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style2 table.alt tbody tr td {
 +
border-color: rgba(0, 0, 0, 0.15);
 +
}
 +
 
 +
.wrapper.style3 {
 +
background-color: #000;
 +
color: #bfbfbf;
 +
background-image: url(../../images/bg.jpg);
 +
background-size: cover;
 +
background-attachment: fixed;
 +
background-position: center;
 +
position: relative;
 +
}
 +
 
 +
.wrapper.style3 input, .wrapper.style3 select, .wrapper.style3 textarea {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 a {
 +
color: #8a4680;
 +
}
 +
 
 +
.wrapper.style3 strong, .wrapper.style3 b {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 h1, .wrapper.style3 h2, .wrapper.style3 h3, .wrapper.style3 h4, .wrapper.style3 h5, .wrapper.style3 h6 {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 blockquote {
 +
border-left-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 code {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 hr {
 +
border-bottom-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 .box {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"],
 +
.wrapper.style3 input[type="reset"],
 +
.wrapper.style3 input[type="button"],
 +
.wrapper.style3 button,
 +
.wrapper.style3 .button {
 +
background-color: #f2f2f2;
 +
color: #000 !important;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"]:hover,
 +
.wrapper.style3 input[type="reset"]:hover,
 +
.wrapper.style3 input[type="button"]:hover,
 +
.wrapper.style3 button:hover,
 +
.wrapper.style3 .button:hover {
 +
background-color: white;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"]:active,
 +
.wrapper.style3 input[type="reset"]:active,
 +
.wrapper.style3 input[type="button"]:active,
 +
.wrapper.style3 button:active,
 +
.wrapper.style3 .button:active {
 +
background-color: #e5e5e5;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].alt,
 +
.wrapper.style3 input[type="reset"].alt,
 +
.wrapper.style3 input[type="button"].alt,
 +
.wrapper.style3 button.alt,
 +
.wrapper.style3 .button.alt {
 +
background-color: transparent;
 +
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.25);
 +
color: #ffffff !important;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].alt:hover,
 +
.wrapper.style3 input[type="reset"].alt:hover,
 +
.wrapper.style3 input[type="button"].alt:hover,
 +
.wrapper.style3 button.alt:hover,
 +
.wrapper.style3 .button.alt:hover {
 +
background-color: rgba(255, 255, 255, 0.075);
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].alt:active,
 +
.wrapper.style3 input[type="reset"].alt:active,
 +
.wrapper.style3 input[type="button"].alt:active,
 +
.wrapper.style3 button.alt:active,
 +
.wrapper.style3 .button.alt:active {
 +
background-color: rgba(255, 255, 255, 0.2);
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].alt.icon:before,
 +
.wrapper.style3 input[type="reset"].alt.icon:before,
 +
.wrapper.style3 input[type="button"].alt.icon:before,
 +
.wrapper.style3 button.alt.icon:before,
 +
.wrapper.style3 .button.alt.icon:before {
 +
color: #999999;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].special,
 +
.wrapper.style3 input[type="reset"].special,
 +
.wrapper.style3 input[type="button"].special,
 +
.wrapper.style3 button.special,
 +
.wrapper.style3 .button.special {
 +
background-color: #8a4680;
 +
color: #ffffff !important;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].special:hover,
 +
.wrapper.style3 input[type="reset"].special:hover,
 +
.wrapper.style3 input[type="button"].special:hover,
 +
.wrapper.style3 button.special:hover,
 +
.wrapper.style3 .button.special:hover {
 +
background-color: #9b4f90;
 +
}
 +
 
 +
.wrapper.style3 input[type="submit"].special:active,
 +
.wrapper.style3 input[type="reset"].special:active,
 +
.wrapper.style3 input[type="button"].special:active,
 +
.wrapper.style3 button.special:active,
 +
.wrapper.style3 .button.special:active {
 +
background-color: #793d70;
 +
}
 +
 
 +
.wrapper.style3 label {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 input[type="text"],
 +
.wrapper.style3 input[type="password"],
 +
.wrapper.style3 input[type="email"],
 +
.wrapper.style3 select,
 +
.wrapper.style3 textarea {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 input[type="text"]:focus,
 +
.wrapper.style3 input[type="password"]:focus,
 +
.wrapper.style3 input[type="email"]:focus,
 +
.wrapper.style3 select:focus,
 +
.wrapper.style3 textarea:focus {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
.wrapper.style3 .select-wrapper:before {
 +
color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 input[type="checkbox"] + label,
 +
.wrapper.style3 input[type="radio"] + label {
 +
color: #bfbfbf;
 +
}
 +
 
 +
.wrapper.style3 input[type="checkbox"] + label:before,
 +
.wrapper.style3 input[type="radio"] + label:before {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 input[type="checkbox"]:checked + label:before,
 +
.wrapper.style3 input[type="radio"]:checked + label:before {
 +
background-color: #8a4680;
 +
border-color: #8a4680;
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 input[type="checkbox"]:focus + label:before,
 +
.wrapper.style3 input[type="radio"]:focus + label:before {
 +
border-color: #8a4680;
 +
box-shadow: 0 0 0 1px #8a4680;
 +
}
 +
 
 +
.wrapper.style3 ::-webkit-input-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style3 :-moz-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style3 ::-moz-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style3 :-ms-input-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style3 .formerize-placeholder {
 +
color: #999999 !important;
 +
}
 +
 
 +
.wrapper.style3 ul.alt li {
 +
border-top-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 header p {
 +
color: #999999;
 +
}
 +
 
 +
.wrapper.style3 table tbody tr {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 table tbody tr:nth-child(2n + 1) {
 +
background-color: rgba(255, 255, 255, 0.075);
 +
}
 +
 
 +
.wrapper.style3 table th {
 +
color: #ffffff;
 +
}
 +
 
 +
.wrapper.style3 table thead {
 +
border-bottom-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 table tfoot {
 +
border-top-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 table.alt tbody tr td {
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.wrapper.style3 .inner {
 +
position: relative;
 +
z-index: 2;
 +
}
 +
 
 +
.wrapper.style3 p {
 +
text-transform: uppercase;
 +
font-size: .75rem;
 +
font-weight: 300;
 +
margin: 0 0 .5rem 0;
 +
padding: 0 0 1rem 0;
 +
letter-spacing: .25rem;
 +
}
 +
 
 +
.wrapper.style3 p:after {
 +
content: '';
 +
position: absolute;
 +
margin: auto;
 +
right: 0;
 +
bottom: 0;
 +
left: 0;
 +
width: 50%;
 +
height: 1px;
 +
background-color: rgba(255, 255, 255, 0.5);
 +
}
 +
 
 +
.wrapper.style3:before {
 +
-moz-transition: opacity 3s ease;
 +
-webkit-transition: opacity 3s ease;
 +
-ms-transition: opacity 3s ease;
 +
transition: opacity 3s ease;
 +
-moz-transition-delay: 1.25s;
 +
-webkit-transition-delay: 1.25s;
 +
-ms-transition-delay: 1.25s;
 +
transition-delay: 1.25s;
 +
content: '';
 +
display: block;
 +
background-color: rgba(0, 0, 0, 0.95);
 +
height: 100%;
 +
left: 0;
 +
opacity: 0.75;
 +
position: absolute;
 +
top: 0;
 +
width: 100%;
 +
z-index: 1;
 +
}
 +
 
 +
@media screen and (max-width: 1280px) {
 +
 
 +
.wrapper > .inner {
 +
width: 75rem;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.wrapper > .inner {
 +
width: 90%;
 +
}
 +
 
 +
.wrapper.style3 {
 +
background-attachment: scroll;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
.wrapper {
 +
padding: 3rem 0 1rem 0 ;
 +
}
 +
 
 +
}
 +
 
 +
/* Flexgrid */
 +
 
 +
.grid-style {
 +
width: 100%;
 +
margin: 0 0 2.5rem 0;
 +
display: -moz-flex;
 +
display: -webkit-flex;
 +
display: -ms-flex;
 +
display: flex;
 +
-moz-flex-wrap: wrap;
 +
-webkit-flex-wrap: wrap;
 +
-ms-flex-wrap: wrap;
 +
flex-wrap: wrap;
 +
-moz-align-items: stretch;
 +
-webkit-align-items: stretch;
 +
-ms-align-items: stretch;
 +
align-items: stretch;
 +
}
 +
 
 +
.grid-style > * {
 +
-moz-flex-shrink: 1;
 +
-webkit-flex-shrink: 1;
 +
-ms-flex-shrink: 1;
 +
flex-shrink: 1;
 +
-moz-flex-grow: 0;
 +
-webkit-flex-grow: 0;
 +
-ms-flex-grow: 0;
 +
flex-grow: 0;
 +
}
 +
 
 +
.grid-style > * {
 +
width: 50%;
 +
}
 +
 
 +
.grid-style > * {
 +
padding: 2rem;
 +
width: calc(50% + 2rem);
 +
}
 +
 
 +
.grid-style > :nth-child(-n + 2) {
 +
padding-top: 0;
 +
}
 +
 
 +
.grid-style > :nth-last-child(-n + 2) {
 +
padding-bottom: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(2n + 1) {
 +
padding-left: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(2n) {
 +
padding-right: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(2n + 1),
 +
.grid-style > :nth-child(2n) {
 +
width: calc(50% + 0rem);
 +
}
 +
 
 +
.grid-style .box {
 +
margin: 0;
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.grid-style > * {
 +
width: 100%;
 +
}
 +
 
 +
.grid-style > * {
 +
padding: 1rem;
 +
width: calc(50% + 1rem);
 +
}
 +
 
 +
.grid-style > :nth-child(-n + 2) {
 +
padding-top: 1rem;
 +
}
 +
 
 +
.grid-style > :nth-last-child(-n + 2) {
 +
padding-bottom: 1rem;
 +
}
 +
 
 +
.grid-style > :nth-child(2n + 1) {
 +
padding-left: 1rem;
 +
}
 +
 
 +
.grid-style > :nth-child(2n) {
 +
padding-right: 1rem;
 +
}
 +
 
 +
.grid-style > :nth-child(2n + 1),
 +
.grid-style > :nth-child(2n) {
 +
padding: 1rem;
 +
width: calc(100% + 2rem);
 +
}
 +
 
 +
.grid-style > * {
 +
padding: 1rem;
 +
width: calc(100% + 2rem);
 +
}
 +
 
 +
.grid-style > :nth-child(-n + 1) {
 +
padding-top: 0;
 +
}
 +
 
 +
.grid-style > :nth-last-child(-n + 1) {
 +
padding-bottom: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(1n + 1) {
 +
padding-left: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(1n) {
 +
padding-right: 0;
 +
}
 +
 
 +
.grid-style > :nth-child(1n + 1),
 +
.grid-style > :nth-child(1n) {
 +
width: calc(100% + 1rem);
 +
}
 +
 
 +
}
 +
 
 +
.gallery {
 +
width: 100%;
 +
margin: 2.5rem 0 2.5rem 0;
 +
display: -moz-flex;
 +
display: -webkit-flex;
 +
display: -ms-flex;
 +
display: flex;
 +
-moz-flex-wrap: wrap;
 +
-webkit-flex-wrap: wrap;
 +
-ms-flex-wrap: wrap;
 +
flex-wrap: wrap;
 +
-moz-align-items: stretch;
 +
-webkit-align-items: stretch;
 +
-ms-align-items: stretch;
 +
align-items: stretch;
 +
}
 +
 
 +
.gallery > * {
 +
-moz-flex-shrink: 1;
 +
-webkit-flex-shrink: 1;
 +
-ms-flex-shrink: 1;
 +
flex-shrink: 1;
 +
-moz-flex-grow: 0;
 +
-webkit-flex-grow: 0;
 +
-ms-flex-grow: 0;
 +
flex-grow: 0;
 +
}
 +
 
 +
.gallery > * {
 +
width: 50%;
 +
}
 +
 
 +
.gallery > * {
 +
padding: 2rem;
 +
width: calc(50% + 2rem);
 +
}
 +
 
 +
.gallery > :nth-child(-n + 2) {
 +
padding-top: 0;
 +
}
 +
 
 +
.gallery > :nth-last-child(-n + 2) {
 +
padding-bottom: 0;
 +
}
 +
 
 +
.gallery > :nth-child(2n + 1) {
 +
padding-left: 0;
 +
}
 +
 
 +
.gallery > :nth-child(2n) {
 +
padding-right: 0;
 +
}
 +
 
 +
.gallery > :nth-child(2n + 1),
 +
.gallery > :nth-child(2n) {
 +
width: calc(50% + 0rem);
 +
}
 +
 
 +
.gallery .image {
 +
background: #FFF;
 +
padding: 1rem;
 +
}
 +
 
 +
.gallery .image.fit {
 +
margin: 0;
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.gallery > * {
 +
width: 100%;
 +
}
 +
 
 +
.gallery > * {
 +
padding: 1rem;
 +
width: calc(50% + 1rem);
 +
}
 +
 
 +
.gallery > :nth-child(-n + 2) {
 +
padding-top: 1rem;
 +
}
 +
 
 +
.gallery > :nth-last-child(-n + 2) {
 +
padding-bottom: 1rem;
 +
}
 +
 
 +
.gallery > :nth-child(2n + 1) {
 +
padding-left: 1rem;
 +
}
 +
 
 +
.gallery > :nth-child(2n) {
 +
padding-right: 1rem;
 +
}
 +
 
 +
.gallery > :nth-child(2n + 1),
 +
.gallery > :nth-child(2n) {
 +
padding: 1rem;
 +
width: calc(100% + 2rem);
 +
}
 +
 
 +
.gallery > * {
 +
padding: 1rem;
 +
width: calc(100% + 2rem);
 +
}
 +
 
 +
.gallery > :nth-child(-n + 1) {
 +
padding-top: 0;
 +
}
 +
 
 +
.gallery > :nth-last-child(-n + 1) {
 +
padding-bottom: 0;
 +
}
 +
 
 +
.gallery > :nth-child(1n + 1) {
 +
padding-left: 0;
 +
}
 +
 
 +
.gallery > :nth-child(1n) {
 +
padding-right: 0;
 +
}
 +
 
 +
.gallery > :nth-child(1n + 1),
 +
.gallery > :nth-child(1n) {
 +
width: calc(100% + 1rem);
 +
}
 +
 
 +
}
 +
 
 +
/* Header */
 +
 
 +
body.subpage {
 +
padding-top: 3.25em;
 +
}
 +
 
 +
@-moz-keyframes reveal-header {
 +
0% {
 +
top: -4em;
 +
opacity: 0;
 +
}
 +
 
 +
100% {
 +
top: 0;
 +
opacity: 1;
 +
}
 +
}
 +
 
 +
@-webkit-keyframes reveal-header {
 +
0% {
 +
top: -4em;
 +
opacity: 0;
 +
}
 +
 
 +
100% {
 +
top: 0;
 +
opacity: 1;
 +
}
 +
}
 +
 
 +
@-ms-keyframes reveal-header {
 +
0% {
 +
top: -4em;
 +
opacity: 0;
 +
}
 +
 
 +
100% {
 +
top: 0;
 +
opacity: 1;
 +
}
 +
}
 +
 
 +
@keyframes reveal-header {
 +
0% {
 +
top: -4em;
 +
opacity: 0;
 +
}
 +
 
 +
100% {
 +
top: 0;
 +
opacity: 1;
 +
}
 +
}
 +
 
 +
#header {
 +
background: rgba(0, 0, 0, 0.975);
 +
color: #a6a6a6;
 +
cursor: default;
 +
height: 3.25em;
 +
left: 0;
 +
line-height: 3.25em;
 +
position: fixed;
 +
text-align: right;
 +
top: 0;
 +
width: 100%;
 +
z-index: 10001;
 +
}
 +
 
 +
#header > .logo {
 +
display: inline-block;
 +
height: inherit;
 +
left: 1.25em;
 +
line-height: inherit;
 +
margin: 0;
 +
padding: 0;
 +
position: absolute;
 +
top: 0;
 +
}
 +
 
 +
#header > .logo a {
 +
font-size: 1.25em;
 +
color: #FFF;
 +
text-decoration: none;
 +
}
 +
 
 +
#header > .logo a:hover {
 +
color: rgba(255, 255, 255, 0.65);
 +
}
 +
 
 +
#header > .logo span {
 +
font-weight: 400;
 +
font-size: .8em;
 +
color: rgba(255, 255, 255, 0.65);
 +
}
 +
 
 +
#header > a {
 +
-moz-transition: color 0.2s ease-in-out;
 +
-webkit-transition: color 0.2s ease-in-out;
 +
-ms-transition: color 0.2s ease-in-out;
 +
transition: color 0.2s ease-in-out;
 +
display: inline-block;
 +
padding: 0 0.75em;
 +
color: inherit;
 +
text-decoration: none;
 +
color: #FFF;
 +
}
 +
 
 +
#header > a:hover {
 +
color: #f2f2f2;
 +
}
 +
 
 +
#header > a[href="#menu"] {
 +
text-decoration: none;
 +
-webkit-tap-highlight-color: transparent;
 +
}
 +
 
 +
#header > a[href="#menu"]:before {
 +
content: "";
 +
-moz-osx-font-smoothing: grayscale;
 +
-webkit-font-smoothing: antialiased;
 +
font-family: FontAwesome;
 +
font-style: normal;
 +
font-weight: normal;
 +
text-transform: none !important;
 +
}
 +
 
 +
#header > a[href="#menu"]:before {
 +
margin: 0 0.5em 0 0;
 +
}
 +
 
 +
#header > a + a[href="#menu"]:last-child {
 +
border-left: solid 1px rgba(0, 0, 0, 0.15);
 +
padding-left: 1.25em;
 +
margin-left: 0.5em;
 +
}
 +
 
 +
#header > a:last-child {
 +
padding-right: 1.25em;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
#header > a {
 +
padding: 0 0.5em;
 +
}
 +
 
 +
#header > a + a[href="#menu"]:last-child {
 +
padding-left: 1em;
 +
margin-left: 0.25em;
 +
}
 +
 
 +
#header > a:last-child {
 +
padding-right: 1em;
 +
}
 +
 
 +
}
 +
#header.reveal {
 +
-moz-animation: reveal-header 0.5s ease;
 +
-webkit-animation: reveal-header 0.5s ease;
 +
-ms-animation: reveal-header 0.5s ease;
 +
animation: reveal-header 0.5s ease;
 +
}
 +
 
 +
#header.alt {
 +
-moz-animation: none;
 +
-webkit-animation: none;
 +
-ms-animation: none;
 +
animation: none;
 +
background-color: transparent;
 +
box-shadow: none;
 +
overflow: hidden;
 +
position: absolute;
 +
top: 1.5em;
 +
}
 +
 
 +
#header.alt h1 {
 +
left: 2.5em;
 +
}
 +
 
 +
#header.alt nav {
 +
right: 2.5em;
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
body.subpage {
 +
padding-top: 44px;
 +
}
 +
 
 +
#header {
 +
height: 44px;
 +
line-height: 44px;
 +
}
 +
 
 +
#header > h1 {
 +
left: 1em;
 +
}
 +
 
 +
#header > h1 a {
 +
font-size: 1em;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 480px) {
 +
 
 +
#header {
 +
min-width: 320px;
 +
}
 +
 
 +
}
 +
 
 +
/* Menu */
 +
 
 +
#menu {
 +
-moz-transform: translateX(20rem);
 +
-webkit-transform: translateX(20rem);
 +
-ms-transform: translateX(20rem);
 +
transform: translateX(20rem);
 +
-moz-transition: -moz-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
 +
-webkit-transition: -webkit-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
 +
-ms-transition: -ms-transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
 +
transition: transform 0.5s ease, box-shadow 0.5s ease, visibility 0.5s;
 +
-webkit-overflow-scrolling: touch;
 +
background: rgba(0, 0, 0, 0.95);
 +
box-shadow: none;
 +
color: #000;
 +
height: 100%;
 +
max-width: 80%;
 +
overflow-y: auto;
 +
padding: 3rem 2rem;
 +
position: fixed;
 +
right: 0;
 +
top: 0;
 +
visibility: hidden;
 +
width: 20rem;
 +
z-index: 10002;
 +
}
 +
 
 +
#menu > ul {
 +
margin: 0 0 1rem 0;
 +
}
 +
 
 +
#menu > ul.links {
 +
list-style: none;
 +
padding: 0;
 +
}
 +
 
 +
#menu > ul.links > li {
 +
padding: 0;
 +
}
 +
 
 +
#menu > ul.links > li > a:not(.button) {
 +
border: 0;
 +
border-top: solid 1px rgba(255, 255, 255, 0.125);
 +
color: rgba(255, 255, 255, 0.5);
 +
display: block;
 +
line-height: 3.5rem;
 +
text-decoration: none;
 +
text-transform: uppercase;
 +
}
 +
 
 +
#menu > ul.links > li > a:not(.button):hover {
 +
color: #FFF;
 +
}
 +
 
 +
#menu > ul.links > li > .button {
 +
display: block;
 +
margin: 0.5rem 0 0 0;
 +
}
 +
 
 +
#menu > ul.links > li:first-child > a:not(.button) {
 +
border-top: 0 !important;
 +
}
 +
 
 +
#menu .close {
 +
text-decoration: none;
 +
-moz-transition: color 0.2s ease-in-out;
 +
-webkit-transition: color 0.2s ease-in-out;
 +
-ms-transition: color 0.2s ease-in-out;
 +
transition: color 0.2s ease-in-out;
 +
-webkit-tap-highlight-color: transparent;
 +
border: 0;
 +
color: #999999;
 +
cursor: pointer;
 +
display: block;
 +
height: 3.25rem;
 +
line-height: 3.25rem;
 +
padding-right: 1.25rem;
 +
position: absolute;
 +
right: 0;
 +
text-align: right;
 +
top: 0;
 +
vertical-align: middle;
 +
width: 7rem;
 +
}
 +
 
 +
#menu .close:before {
 +
-moz-osx-font-smoothing: grayscale;
 +
-webkit-font-smoothing: antialiased;
 +
font-family: FontAwesome;
 +
font-style: normal;
 +
font-weight: normal;
 +
text-transform: none !important;
 +
}
 +
 
 +
#menu .close:before {
 +
content: '\f00d';
 +
font-size: 1.25rem;
 +
}
 +
 
 +
#menu .close:hover {
 +
color: #000;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
#menu .close {
 +
height: 4rem;
 +
line-height: 4rem;
 +
}
 +
 
 +
}
 +
 
 +
#menu.visible {
 +
-moz-transform: translateX(0);
 +
-webkit-transform: translateX(0);
 +
-ms-transform: translateX(0);
 +
transform: translateX(0);
 +
box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.2);
 +
visibility: visible;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
#menu {
 +
padding: 2.5rem 1.75rem;
 +
}
 +
 
 +
}
 +
 
 +
/* Banner */
 +
 
 +
.banner {
 +
background-color: #8a4680;
 +
color: #e2d1df;
 +
padding: 8em 0;
 +
position: relative;
 +
}
 +
 
 +
.banner input, .banner select, .banner textarea {
 +
color: #ffffff;
 +
}
 +
 
 +
.banner a {
 +
color: #ffffff;
 +
}
 +
 
 +
.banner strong, .banner b {
 +
color: #ffffff;
 +
}
 +
 
 +
.banner h1, .banner h2, .banner h3, .banner h4, .banner h5, .banner h6 {
 +
color: #ffffff;
 +
}
 +
 
 +
.banner blockquote {
 +
border-left-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.banner code {
 +
background: rgba(255, 255, 255, 0.075);
 +
border-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.banner hr {
 +
border-bottom-color: rgba(255, 255, 255, 0.25);
 +
}
 +
 
 +
.banner.full {
 +
padding: 0;
 +
min-height: 100vh;
 +
height: 100vh !important;
 +
}
 +
 
 +
.banner.half {
 +
padding: 0;
 +
min-height: 50vh;
 +
height: 50vh !important;
 +
}
 +
 
 +
.banner:after {
 +
-moz-pointer-events: none;
 +
-webkit-pointer-events: none;
 +
-ms-pointer-events: none;
 +
pointer-events: none;
 +
-moz-transition: opacity 1.5s ease-in-out, visibility 1.5s;
 +
-webkit-transition: opacity 1.5s ease-in-out, visibility 1.5s;
 +
-ms-transition: opacity 1.5s ease-in-out, visibility 1.5s;
 +
transition: opacity 1.5s ease-in-out, visibility 1.5s;
 +
background: #000000;
 +
content: '';
 +
display: block;
 +
height: 100%;
 +
left: 0;
 +
opacity: 0;
 +
position: absolute;
 +
top: 0;
 +
visibility: hidden;
 +
width: 100%;
 +
z-index: 2;
 +
}
 +
 
 +
.banner .indicators {
 +
bottom: 1.5em;
 +
left: 0;
 +
list-style: none;
 +
margin: 0;
 +
padding: 0;
 +
position: absolute;
 +
text-align: center;
 +
width: 100%;
 +
z-index: 2;
 +
}
 +
 
 +
.banner .indicators li {
 +
cursor: pointer;
 +
display: inline-block;
 +
height: 2em;
 +
overflow: hidden;
 +
padding: 0;
 +
position: relative;
 +
text-indent: 2em;
 +
width: 2em;
 +
}
 +
 
 +
.banner .indicators li:before {
 +
background: rgba(255, 255, 255, 0.35);
 +
border-radius: 100%;
 +
content: '';
 +
display: inline-block;
 +
height: 0.8em;
 +
left: 50%;
 +
margin: -0.4em 0 0 -0.4em;
 +
position: absolute;
 +
text-indent: 0;
 +
top: 50%;
 +
width: 0.8em;
 +
}
 +
 
 +
.banner .indicators li.visible:before {
 +
background: #fff;
 +
}
 +
 
 +
.banner > article {
 +
-moz-transition: opacity 1.5s ease, visibility 1.5s;
 +
-webkit-transition: opacity 1.5s ease, visibility 1.5s;
 +
-ms-transition: opacity 1.5s ease, visibility 1.5s;
 +
transition: opacity 1.5s ease, visibility 1.5s;
 +
background-attachment: fixed;
 +
background-position: center;
 +
background-repeat: no-repeat;
 +
background-size: cover;
 +
height: 100%;
 +
left: 0;
 +
opacity: 0;
 +
position: absolute;
 +
text-align: center;
 +
top: 0;
 +
visibility: hidden;
 +
width: 100%;
 +
z-index: 0;
 +
}
 +
 
 +
.banner > article:before {
 +
content: '';
 +
display: inline-block;
 +
height: 100%;
 +
vertical-align: middle;
 +
}
 +
 
 +
.banner > article:after {
 +
content: '';
 +
display: block;
 +
width: 100%;
 +
height: 100%;
 +
position: absolute;
 +
top: 0;
 +
left: 0;
 +
background: #000;
 +
opacity: 0.35;
 +
}
 +
 
 +
.banner > article .inner {
 +
position: relative;
 +
display: inline-block;
 +
vertical-align: middle;
 +
z-index: 1;
 +
}
 +
 
 +
.banner > article .inner > :last-child {
 +
margin-bottom: 0;
 +
}
 +
 
 +
.banner > article h2 {
 +
font-size: 7rem;
 +
margin-bottom: 0;
 +
color: #FFF;
 +
font-weight: 300;
 +
}
 +
 
 +
.banner > article h2:after {
 +
display: none;
 +
}
 +
 
 +
.banner > article p {
 +
color: rgba(255, 255, 255, 0.65);
 +
text-transform: uppercase;
 +
font-size: 1rem;
 +
font-weight: 300;
 +
margin: 0;
 +
padding-bottom: 1.75rem;
 +
letter-spacing: .25rem;
 +
}
 +
 
 +
.banner > article p:after {
 +
content: '';
 +
position: absolute;
 +
margin: auto;
 +
right: 0;
 +
bottom: 0;
 +
left: 0;
 +
width: 50%;
 +
height: 1px;
 +
background-color: rgba(255, 255, 255, 0.65);
 +
}
 +
 
 +
.banner > article a {
 +
color: #FFF;
 +
text-decoration: none;
 +
}
 +
 
 +
.banner > article img {
 +
display: none;
 +
}
 +
 
 +
.banner > article.visible {
 +
opacity: 1;
 +
visibility: visible;
 +
}
 +
 
 +
.banner > article.top {
 +
z-index: 1;
 +
}
 +
 
 +
.banner > article.instant {
 +
-moz-transition: none !important;
 +
-webkit-transition: none !important;
 +
-ms-transition: none !important;
 +
transition: none !important;
 +
}
 +
 
 +
body.is-loading .banner:after {
 +
opacity: 1.0;
 +
visibility: visible;
 +
}
 +
 
 +
@media screen and (max-width: 1280px) {
 +
 
 +
.banner.full {
 +
padding: 0;
 +
min-height: 75vh;
 +
height: 75vh !important;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 980px) {
 +
 
 +
.banner.full {
 +
padding: 0;
 +
min-height: 50vh;
 +
height: 50vh !important;
 +
}
 +
 
 +
.banner > article {
 +
background-attachment: scroll;
 +
}
 +
 
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
.banner > article .inner {
 +
width: 90%;
 +
}
 +
 
 +
.banner > article p {
 +
margin-bottom: 1rem;
 +
}
 +
 
 +
.banner > article h2 {
 +
font-size: 4em;
 +
}
 +
 
 +
}
 +
 
 +
body.is-mobile .banner > article {
 +
background-attachment: scroll;
 +
}
 +
 
 +
/* Main */
 +
 
 +
#main {
 +
padding: 4rem 0 2rem 0 ;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
#main {
 +
padding: 3rem 0 1rem 0 ;
 +
}
 +
 
 +
}
 +
 
 +
/* Footer */
 +
 
 +
#footer {
 +
padding: 2rem 0 2rem 0 ;
 +
background: #000;
 +
text-align: center;
 +
}
 +
 
 +
#footer a {
 +
color: rgba(255, 255, 255, 0.5);
 +
}
 +
 
 +
#footer a:hover {
 +
color: #FFF;
 +
}
 +
 
 +
#footer .copyright {
 +
color: #bbb;
 +
font-size: 0.9rem;
 +
margin: 0 0 2rem 0;
 +
padding: 0;
 +
text-align: center;
 +
}
 +
 
 +
@media screen and (max-width: 736px) {
 +
 
 +
#footer {
 +
padding: 3rem 0 1rem 0 ;
 +
}
 +
 
 +
}
 +
</style>
 +
</head>
 +
<body>
 +
 
 +
<!-- Header -->
 +
 
 +
<!-- Navbar -->
 +
<!-- Navbar -->
 +
<div class="w3-top" style="z-index: 4">
 +
  <div class="w3-bar w3-black w3-card-2 w3-left-align w3-large">
 +
<a class="w3-bar-item w3-button w3-hide-medium w3-hide-large w3-right w3-padding-large w3-hover-white w3-large w3-red" href="javascript:void(0);" onclick="myFunction()" title="Toggle Navigation Menu"><i class="fa fa-bars"></i></a>
 +
<a href="https://2018.igem.org/Team:Mingdao" class="w3-bar-item w3-button w3-padding-large w3-white">Home</a>
 +
<a href="https://2018.igem.org/Team:Mingdao/Achievements" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-blue w3-hover-white" style="text-decoration: none; color: white">Achievements</a>
 +
<a href="https://2018.igem.org/Team:Mingdao/Demonstrate" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" style="text-decoration: none; color: white">Project</a>
 +
<a href="https://2018.igem.org/Team:Mingdao/HP/Silver" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" style="text-decoration: none; color: white">Human-Practice</a>
 +
<a href="https://2018.igem.org/Team:Mingdao/Notebook" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" style="text-decoration: none; color: white">Notebook</a>
 +
<a href="https://2018.igem.org/Team:Mingdao/Attributions" class="w3-bar-item w3-button w3-hide-small w3-padding-large w3-hover-white" style="text-decoration: none; color: white;">Attributions</a>
 +
  </div>
 +
</div>
 +
<!-- Navbar END -->
 +
 
 +
 
 +
<!-- Sidebar/menu -->
 +
<nav class="w3-sidebar w3-collapse w3-animate-left" style="z-index:3;width:180px; background-color: #F8F9FA" id="mySidebar"><br>
 +
 
 +
<div class="w3-container">
 +
<h5>Dashboard</h5>
 +
<div class="w3-bar-block">
 +
<nav class="navbar navbar-light bg-light">
 +
      <a class="navbar-brand btn" href="#pre-md" style="text-decoration: none;">Preface</a>
 +
      <a class="navbar-brand btn" href="#att-md" style="text-decoration: none">Attributions</a>
 +
      <a class="navbar-brand btn" href="#ack-md" style="text-decoration: none; font-size: 0.9rem">Acknowledgement</a>
 +
    </nav>
 +
<hr>
 +
</div>
 +
</div>
 +
 
 +
  <div class="w3-bar-block">
 +
<a href="#" class="w3-bar-item w3-button w3-padding-16 w3-hide-large w3-dark-grey w3-hover-black" onclick="w3_close()" title="close menu"><i class="fa fa-remove fa-fw"></i>  Close Menu</a>
 +
  </div>
 +
</nav>
 +
<!-- Overlay effect when opening sidebar on small screens -->
 +
<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
 +
 
 +
<div style="margin-left: 180px">
 +
<!-- Banner -->
 +
<section class="banner full" style="background-image: url(https://static.igem.org/mediawiki/2017/7/74/Md-attribution-banner.jpeg); background-size:cover">
 +
</section>
 +
 
 +
<!-- One -->
 +
<section id="pre-md" class="wrapper style2">
 +
<div style="margin-left: 20px">
 +
<span class="w3-center w3-padding-small w3-black w3-xlarge w3-wide w3-animate-opacity"> <span class="w3-hide-small"></span> </span>
 +
  <span class="w3-center w3-padding-large w3-xlarge w3-wide w3-animate-opacity">Thank You to those who have helped us</span>
 +
<br/><br/>
 +
<!-- Box -->
 +
<div class="box w3-padding-32" style="background-color: rgba(255, 255, 255, 0); margin-right: 50px; padding: 5rem; padding-right: 5rem">
 +
<h4>
 +
 
 +
Participating in the iGEM competition is never an easy mission. Along the path, there are always ones who helped us whenever we are disoriented. Experts and teachers, doctors and students in the campus who supported our events, and most profoundly, our PI, we would like to thank you for the bottom of our hearts at this glorious moment.</h4>
 +
</div>
 +
</div>
 +
</section>
 +
<!-- Team Section -->
 +
<section id="att-md">
 +
<div class="bgimg-3 w3-display-container w3-opacity-min">
 +
<div class="w3-display-middle">
 +
    <span class="w3-xlarge w3-text-white w3-wide">ATTRIBUTIONS</span>
 +
  </div>
 +
</div>
 +
<!--Instructor-->
 +
<div class="bgimg-3 w3-display-container">
 +
<div style="padding-top: 60px; padding-left: 20px">
 +
<span class="w3-center w3-padding-small w3-black w3-xlarge w3-wide w3-animate-opacity"> <span class="w3-hide-small"></span> </span>
 +
  <span class="w3-center w3-padding-large w3-xlarge w3-wide w3-animate-opacity">Instructor</span>
 +
</div>
 +
<div class="w3-container" style="padding:30px 16px" id="team">
 +
  <div class="w3-row" style="width: 80%; margin-left:10px; padding:30px">
 +
  <div class="w3-third w3-container">
 +
  <img src="https://static.igem.org/mediawiki/2017/a/a0/Md-phil-instructor.jpeg" height="250" style="max-height: 600px;box-shadow: 7px 6px 34px 4px rgba(0,0,0,0.47);  border-right: 12px solid #383838">
 +
  </div>
 +
  <div class="w3-twothird w3-container" style="padding-left: 60px">
 +
  <h3>Dr. Phil (Pei-Hong) Chen</h3>
 +
  <p style="color: white; letter-spacing: 0.1rem">I’m an iGEM lover beginning at NYMU-Taipei team as an instructor thru 2011 &amp; 2012. I started to be a primary PI for Mingdao iGEM High School Team in 2014. That year, we are one of the first HS teams from Taiwan to join iGEM. I completed my education with a PhD degree in Microbiology &amp; Immunology at College of Medicine, National Taiwan University in 2008. From then on, I love gene cloning and viral vector construction and always think how to improve the skills and apply to the real world. I’d also like to educate undergraduate school students to open their mind in biotech and let their imagination to come true through Synthetic Biology. iGEM is a really nice place where people meet and inspires each other. We're happy to see you there.<br> Contact: phil@mingdao.edu.tw</p>
 +
  </div>
 +
</div>
 +
</div>
 +
<!--Team Leader-->
 +
<div class="">
 +
<div style="padding-top: 60px; padding-left: 20px">
 +
<span class="w3-center w3-padding-small w3-black w3-xlarge w3-wide w3-animate-opacity"> <span class="w3-hide-small"></span> </span>
 +
  <span class="w3-center w3-padding-large w3-xlarge w3-wide w3-animate-opacity">Team Leader </span>
 +
</div>
 +
<div class="w3-container" style="padding:30px 16px;" id="team">
 +
  <div class="w3-row-padding" style="margin-top:64px">
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="                                  " alt="Kevin" style="width:100%">
 +
<div class="w3-container"><br/>
 +
  <h3>LI-KAI JHENG</h3>
 +
  <h4 class="w3-opacity">Responsible Part :Dry Lab</h4>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Think different and make some change to this world.</span>
−
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Think different and make some change to this world.</span></li>
+
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I may seem to be serious, but I have lots of fun ideas!</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I may seem to be serious, but I have lots of fun ideas!</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Hobbies: Piano, Reading, Mountain climbing.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Hobbies: Piano, Reading, Mountain climbing.</span></li>
 
</ul>
 
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
  
−
<HR>
 
  
−
 
+
<div style="padding-top: 60px; padding-left: 20px">
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;"> YU-CHI LIANG</span></p>
+
<span class="w3-center w3-padding-small w3-black w3-xlarge w3-wide w3-animate-opacity"> <span class="w3-hide-small"></span> </span>
−
<ul>
+
  <span class="w3-center w3-padding-large w3-xlarge w3-wide w3-animate-opacity">Team Members</span>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Responsible Part :Experiment</span></li>
+
</div>
 +
<div class="w3-container" style="padding:30px 16px" id="team">
 +
  <div class="w3-row-padding" style="margin-top:64px">
 +
  <!-- YU-CHI LIANG -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="                  " alt="" style="width:100%">
 +
<div class="w3-container" style="height: 25rem">
 +
  <h3>YU-CHI LIANG</h3>
 +
  <p class="w3-opacity">Responsible Part :Human Practice</p>
 +
  <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM:A chance to learn about the biological world of iGEM        </span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM:A chance to learn about the biological world of iGEM        </span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest:Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest:Biology</span></li>
Line 30: Line 4,514:
 
</ul>
 
</ul>
  
−
<HR>
 
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">KUAN-CHEN WU</span></p>
+
</div>
 +
  </div>
 +
</div>
 +
<!-- KUAN-CHEN WU -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src=" "width:100%">
 +
<div class="w3-container" style="height: 25rem">
 +
  <h3>KUAN-CHEN WU</h3>
 +
  <p class="w3-opacity">Responsible Part :Wet Lab</p>
 +
 
 +
 
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :HP (Hardware) </span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To create and learn, think and change.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To create and learn, think and change.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 40: Line 4,533:
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Hobbies: Drawing, writing songs, playing soccer.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Hobbies: Drawing, writing songs, playing soccer.</span></li>
 
</ul>
 
</ul>
−
 
+
</div>
−
 
+
  </div>
−
<HR>
+
</div>
−
 
+
<!-- WEI-TING HSIAO -->
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">WEI-TING HSIAO</span></p>
+
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src=" " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>WEI-TING HSIAO</h3>
 +
  <p class="w3-opacity">Dry Lab</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: enjoy the experiments,cooperate with teammates,learn lots of knowledge.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: enjoy the experiments,cooperate with teammates,learn lots of knowledge.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 53: Line 4,550:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
 +
  </div>
 +
</div>
 +
<!--  CHUNG-HSUAN HSIAO -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="  " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>CHUNG-HSUAN HSIAO</h3>
 +
  <p class="w3-opacity">Responsible Part :Dry Lab</p>
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">CHUNG-HSUAN HSIAO</span></p>
 
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Teamwork, learn some new skills, and dig in the fascinating biology.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Teamwork, learn some new skills, and dig in the fascinating biology.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 64: Line 4,568:
 
</ul>
 
</ul>
  
−
<HR>
 
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">YU-HSING HUANG</span></p>
+
</div>
−
<ul>
+
  </div>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
</div>
 +
 
 +
<!-- YU-HSING HUANG -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="     " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>YU-HSING HUANG</h3>
 +
  <p class="w3-opacity">Model &amp;Human Practice</p>
 +
  <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Not only learned bio-knowledge but also something interesting and useful.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Not only learned bio-knowledge but also something interesting and useful.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 75: Line 4,587:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
 +
  </div>
 +
</div>
 +
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">TING-CHEN CHANG</span></p>
+
  <!--  TING-CHEN CHANG -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src=" " alt="Chen" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>TING-CHEN CHANG</h3>
 +
  <p class="w3-opacity">Responsible Part :Dry Lab</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Learning from experts in various fields.</span></li>
−
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Learning from experts in various fields.</span></li>
+
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I keep chickens, rabbits, hamsters as pets.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I keep chickens, rabbits, hamsters as pets.</span></li>
Line 86: Line 4,606:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
−
 
+
  </div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">CHI-WEI TSENG</span></p>
+
</div>
−
<ul>
+
<!--  CHI-WEI TSENG -->
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<div class="w3-col l3 m6 w3-margin-bottom">
−
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To create things that I have never thought before by ourselves. </span></li>
+
  <div class="w3-card-2" style="background: white">
 +
<img src="   " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>CHI-WEI TSENG</h3>
 +
  <p class="w3-opacity">Dry Lab</p>
 +
<ul>
 +
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To create things that I have never thought before by ourselves. </span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I like to make my handwriting tidy because it makes me extremely comfortable.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I like to make my handwriting tidy because it makes me extremely comfortable.</span></li>
Line 97: Line 4,623:
 
</ul>
 
</ul>
  
−
<HR>
 
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">GUAN-TIING HUANG</span></p>
+
</div>
 +
  </div>
 +
</div>
 +
<!-- GUAN-TIING HUANG -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="   " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>GUAN-TIING HUANG</h3>
 +
  <p class="w3-opacity">Responsible Part : Human Practice, WIKI</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: An opportunity to improve myself in a unique way.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: An opportunity to improve myself in a unique way.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 108: Line 4,641:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
−
 
+
  </div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">YI-HSUAN HSU</span></p>
+
</div>
−
<ul>
+
<!--  YI-HSUAN HSU -->
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="       " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
<h3>YI-HSUAN HSU</h3>
 +
    <p class="w3-opacity">Dry Lab</p>
 +
    <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To learn experiments skills and biology </span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To learn experiments skills and biology </span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 119: Line 4,658:
 
</ul>
 
</ul>
  
−
 
+
</div>
−
<HR>
+
  </div>
−
 
+
</div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">TUNG-YU CHIEN</span></p>
+
<!--  TUNG-YU CHIEN -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src=" " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>TUNG-YU CHIEN</h3>
 +
  <p class="w3-opacity">Responsible Part :Dry Lab</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To accomplish  common achievement with everyone else in the team together</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: To accomplish  common achievement with everyone else in the team together</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 131: Line 4,675:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
−
 
+
</div>
−
 
+
</div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">CHAN-YU YEH</span></p>
+
<!-- CHAN-YU YEH -->
−
<ul>
+
<div class="w3-col l3 m6 w3-margin-bottom">
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
  <div class="w3-card-2" style="background: white">
 +
<img src="   " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>CHAN-YU YEH (Evan) </h3>
 +
  <p class="w3-opacity">Dry Lab</p>
 +
  <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: An opportunity to turn knowledge into technology.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: An opportunity to turn knowledge into technology.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 143: Line 4,692:
 
</ul>
 
</ul>
  
−
<HR>
 
  
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">YI-CHUN LIAO</span></p>
+
</div>
 +
  </div>
 +
</div>
 +
<!--YI-CHUN LIAO -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="   " alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>YI-CHUN LIAO</h3>
 +
  <p class="w3-opacity">Responsible Part :Dry Lab</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: exploring and learning novel things</span></li>
−
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: exploring and learning novel things</span></li>
+
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I seem to be shy, but the contrary is actually true.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Fun Fact About Yourself:I seem to be shy, but the contrary is actually true.</span></li>
Line 154: Line 4,710:
 
</ul>
 
</ul>
  
−
<HR>
+
</div>
−
 
+
  </div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">YU-XUAN LAI</span></p>
+
</div>
−
<ul>
+
<!-- YU-XUAN LAI -->
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="" alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>YU-XUAN LAI</h3>
 +
  <p class="w3-opacity">Dry Lab</p>
 +
<ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Learn to get along with others well and make the team better.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Learn to get along with others well and make the team better.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 165: Line 4,727:
 
</ul>
 
</ul>
  
−
 
+
</div>
−
<HR>
+
  </div>
−
 
+
</div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">JUI-TANG KU</span></p>
+
<!-- JUI-TANG KU -->
−
<ul>
+
<div class="w3-col l3 m6 w3-margin-bottom">
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
  <div class="w3-card-2" style="background: white">
 +
<img src="" alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>JUI-TANG KU</h3>
 +
  <p class="w3-opacity">Human Practice</p>
 +
  <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Exploring the possibility of impacting the world with synthetic biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Exploring the possibility of impacting the world with synthetic biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 177: Line 4,744:
 
</ul>
 
</ul>
  
−
 
+
</div>
−
<HR>
+
  </div>
−
 
+
</div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">YU-HSUAN CHENG</span></p>
+
<!-- YU-HSUAN CHENG -->
−
<ul>
+
<div class="w3-col l3 m6 w3-margin-bottom">
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
+
  <div class="w3-card-2" style="background: white">
 +
<img src="" alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>YU-HSUAN CHENG</h3>
 +
  <p class="w3-opacity">Dry Lab</p>
 +
  <ul>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: learning new knowledge and experiment skills.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: learning new knowledge and experiment skills.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 189: Line 4,761:
 
</ul>
 
</ul>
  
−
 
+
</div>
−
<HR>
+
  </div>
−
 
+
</div>
−
<p style="text-align: left;"><img src="KEVIN IMAGE" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<span font="" style="color: #333333; font-family: Berlin Sans FB; font-size: x-large;">JUN-HAO LAI</span></p>
+
<!-- JUN-HAO LAI -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="" alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>JUN-HAO LAI</h3>
 +
  <p class="w3-opacity">Responsible Part :Dry Lab</p>
 
<ul>
 
<ul>
−
<li style="text-align: left;"><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;">Responsible Part :Dry Lab</span></li>
 
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Capability of getting into the micro-world, changing the world via bio-tech.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Favorite things about iGEM: Capability of getting into the micro-world, changing the world via bio-tech.</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
 
<li><span font="" style="color: #333333; font-family: Century Gothic; font-size: medium;"> Scientific interest: Biology</span></li>
Line 202: Line 4,779:
  
  
−
</div>
+
</div>
 +
  </div>
 +
</div>
 +
<!-- Bryan -->
 +
<div class="w3-col l3 m6 w3-margin-bottom">
 +
  <div class="w3-card-2" style="background: white">
 +
<img src="https://static.igem.org/mediawiki/2017/a/a5/Mingdaophil1123-bryan.jpeg" alt="Mike" style="width:100%">
 +
<div class="w3-container"style="height: 25rem">
 +
  <h3>Bryan Hu</h3>
 +
  <p class="w3-opacity">Prototype & Applied Design</p>
 +
  <p>I am a fairly reserved  person, but others have often found me quite kind. Recent hobbies of mine are coding in Java, playing the piano, and reading sci-fi novels. For our project, I designed and built most of the prototype as well as coded it</p>
 +
</div>
 +
  </div>
 +
</div>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
  </div>
 +
</div>
 +
</section>
 +
 
 +
 
 +
<!-- Two -->
 +
<section id="ack-md" class="wrapper style3">
 +
<div class="inner">
 +
<header class="align-center">
 +
<p class="w3-center">Gratitude from the bottom of our hearts. Thank you all</p>
 +
<h2>Acknowledgements</h2>
 +
</header>
 +
</div>
 +
</section>
 +
<!-- CSMU -->
 +
<div class="row" style="background-color: #F2F2F2">
 +
<div class="col-md-8 col-sm-10" style="display: block; margin: auto; margin-top: 3rem">
 +
<div class="card">
 +
  <h4 class="card-header text-center" style="letter-spacing: 0.2rem; font-size:1.5rem; background-color: #004480; color: white">Drink Sampling</h4>
 +
  <div class="card-body">
 +
<div class="row">
 +
<div class="col-md-7 col-sm-7">
 +
<div class="row">
 +
<div class="col-md-12 col-sm-12">
 +
<img src="https://static.igem.org/mediawiki/2017/2/25/Mingdaothewit-10.jpeg" width="100%" style="border-radius: 3%; border-bottom-left-radius: 0;border-bottom-right-radius: 0;">
 +
<img src="https://static.igem.org/mediawiki/2017/a/a6/Mingdaothewit-09.jpeg" width="100%" style="border-radius: 3%; border-top-left-radius: 0;border-top-right-radius: 0;">
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-4 col-sm-4">
 +
<h4><b>It is always not easy to hold activities at school, especially events requiring massive resources and manpower. Thank you to all those non-iGEMers who helped us complete such a hard work. Thank you to all the participants  who came to our presence. Also, let us show our special appreciation to the kind Dou-Dou-tea tea shop owner who offered us a HUGE amount of drinks for free. Though the event  wasn’t as perfect as we had expected, we still made a significant growth of popularity for the word ”IGEM” among students. What we’ve done in Mingdao is surely unprecedented.
 +
</b></h4>
 +
</div>
 +
</div>
 +
<div class="row w3-padding-32">
 +
</div>
 +
  </div>
 +
</div>
 +
</div>
 +
</div>
 +
<!-- CSMU END -->
 +
<!-- Fablab -->
 +
<div class="row" style="background-color: #F2F2F2">
 +
<div class="col-md-8 col-sm-10" style="display: block; margin: auto; margin-top: 3rem">
 +
<div class="card">
 +
  <h4 class="card-header text-center" style="letter-spacing: 0.2rem; font-size:1.5rem; background-color: #004480; color: white">In School</h4>
 +
  <div class="card-body">
 +
<div class="row">
 +
<div class="col-md-7 col-sm-7">
 +
<div class="row">
 +
<div class="col-md-12 col-sm-12">
 +
<img src="https://static.igem.org/mediawiki/2017/1/13/Mingdaojay1020-60.png" width="100%" style="border-radius: 3%; border-bottom-left-radius: 0;border-bottom-right-radius: 0;">
 +
<img src="https://static.igem.org/mediawiki/2017/3/39/Mingdaojay1020-59.jpeg" width="100%" style="border-radius: 3%; border-top-left-radius: 0;border-top-right-radius: 0;">
 +
</div>
 +
</div>
 +
</div>
 +
<div class="col-md-4 col-sm-4">
 +
<h4 style="padding-top: 8rem"><b>
 +
Thank you to all the people in Mingdao who have gave us lots of support. Here they are:
 +
<li>Instructors</li>
 +
<li>FABLAB</li>
 +
<li>Mingdao iGEM 2016</li>
 +
</b></h4>
 +
</div>
 +
</div>
 +
<div class="row w3-padding-32">
 +
</div>
 +
  </div>
 +
</div>
 +
</div>
 +
</div>
 +
<!-- Fablab END -->
 +
<!-- In Voice -->
 +
<div class="row" style="background-color: #F2F2F2">
 +
<div class="col-md-8 col-sm-10" style="display: block; margin: auto; margin-top: 3rem">
 +
<div class="card">
 +
  <h4 class="card-header text-center" style="letter-spacing: 0.2rem; font-size:1.5rem; background-color: #004480; color: white">Mingdao Voice</h4>
 +
  <div class="card-body">
 +
<div class="row">
 +
<div class="col-md-10 col-sm-10" style="display: block; margin: auto">
 +
<img src="https://static.igem.org/mediawiki/2017/f/f3/Mingdaojay1020-51.jpeg" width="100%" style="border-radius: 3%;">
 +
</div>
 +
<div class="col-md-10 col-sm-10" style="padding-left: 6rem">
 +
<h3><b>- Mingdao Voice</b><br><br></h3>
 +
<h4><b>
 +
Cross-domain integration is of cardinal importance in today’s world. It is our privilege to collaborate with the Mingdao Voice, the outstanding club in our school. We hope that “technology could remain marring with social science, marring with the humanities ” in the following years.
 +
Special thanks to :
 +
<li>Jenny Yeh</li>
 +
<li>Leona Sun</li>
 +
<li>Club Leader of Mingdao Voice</li>
 +
<li>Club instructors </li>
 +
<li>Everyclub members in Mingdao Voice </li>
 +
</b></h4>
 +
</div>
 +
</div>
 +
  </div>
 +
</div>
 +
</div>
 +
</div>
 +
<!-- In Voice END -->
 +
 
 +
<!-- Expert Consultation -->
 +
<div class="row" style="background-color: #F2F2F2">
 +
<div class="col-md-8 col-sm-10" style="display: block; margin: auto; margin-top: 3rem">
 +
<div class="card">
 +
  <h4 class="card-header text-center" style="letter-spacing: 0.2rem; font-size:1.5rem; background-color: #004480; color: white">Expert Consultation</h4>
 +
  <div class="card-body">
 +
  <h4 style="text-align: center">
 +
  The word “expert” should be defined as “anyone of any age that can give out any professional and trustable information”. Thanks to those people who had given us a hand when we were in need. </h4>
 +
  <div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel" data-interval="2000">
 +
<ol class="carousel-indicators">
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="0" class="active"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="1"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="2"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="3"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="4"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="5"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="6"></li>
 +
  <li data-target="#carouselExampleIndicators2" data-slide-to="7"></li>
 +
</ol>
 +
<div class="carousel-inner">
 +
<div class="carousel-item active">
 +
    <div style="height: 520px;">
 +
    <img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/c/c0/Mingdaothewit-11.jpeg" alt="First slide">
 +
  <div class="carousel-caption d-none d-md-block">
 +
    <h3 class="text-white" style="letter-spacing: 0.1rem">Nutritionist Lu<hr></h4>
 +
  </div>
 +
    </div>
 +
    </div>
 +
    <div class="carousel-item">
 +
    <div style="height: 520px;background-image:url(https://static.igem.org/mediawiki/2017/a/a3/MD-trianglify-back-0.png); background-size: cover">
 +
  <img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/2/23/Mingdaojay1020-54.jpeg" alt="Second slide">
 +
  <div class="carousel-caption d-none d-md-block">
 +
    <h3 class="text-white" style="letter-spacing: 0.1rem"> 6 opinion-sharing elementary students<hr></h4>
 +
  </div>
 +
    </div>
 +
    </div>
 +
  <div class="carousel-item">
 +
<div style="height: 520px;background-image:url(https://static.igem.org/mediawiki/2017/a/a3/MD-trianglify-back-0.png); background-size: cover">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/6/6c/Mingdaojay1020-52.jpeg" alt="Third slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Fellows who filled out questionnaires<hr></h4>
 +
</div>
 +
</div>
 +
  </div>
 +
 
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/3/3a/Mingdaojay1020-50.jpeg" alt="Fourth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Fitness Coach Wei<hr></h4>
 +
</div>
 +
  </div>
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/2/22/Mingdaojay1020-46.jpeg" alt="Fifth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Professor Chen<hr></h4>
 +
</div>
 +
  </div><div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/a/a0/Mingdaojay1020-56.jpeg" alt="Sixth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Doctor Chu<hr></h4>
 +
</div>
 +
  </div>
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/e/e0/Mingdaojay1020-55.jpeg" alt="Seventh slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Section Manager Zhou<hr></h4>
 +
</div>
 +
</div>
 +
  </div>
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/d/d1/Mingdaojay1020-57.jpeg" alt="Eighth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Nephrologist Wu<hr></h4>
 +
</div>
 +
  </div>
 +
</div>
 +
<a class="carousel-control-prev" href="#carouselExampleIndicators2" role="button" data-slide="prev">
 +
  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
  <span class="sr-only">Previous</span>
 +
</a>
 +
<a class="carousel-control-next" href="#carouselExampleIndicators2" role="button" data-slide="next">
 +
  <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
  <span class="sr-only">Next</span>
 +
</a>
 +
  </div>
 +
  </div>
 +
</div>
 +
</div>
 +
<!-- Expert Consultation END -->
 +
 
 +
<!-- In Voice -->
 +
<div class="row" style="background-color: #F2F2F2">
 +
<div class="col-md-8 col-sm-10" style="display: block; margin: auto; margin-top: 3rem">
 +
<div class="card">
 +
  <h4 class="card-header text-center" style="letter-spacing: 0.2rem; font-size:1.5rem; background-color: #004480; color: white">Meetups</h4>
 +
  <div class="card-body">
 +
  <h4 style="text-align: center">Being probably the youngest participants in iGEM, we are very much grateful to our companions from Taiwan and the US. They’ve not only given us useful suggestions but also found out blind spots in our project for us before it is too late. Thanks to:</h4>
 +
  <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel" data-interval="2000">
 +
<ol class="carousel-indicators">
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="3"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="4"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="5"></li>
 +
  <li data-target="#carouselExampleIndicators" data-slide-to="6"></li>
 +
</ol>
 +
<div class="carousel-inner">
 +
  <div class="carousel-item active">
 +
  <div style="height: 520px;">
 +
  <img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/0/0c/Mingdaothewit-12.jpeg " alt="First slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">TAS_Taipei<hr></h4>
 +
</div>
 +
  </div>
 +
  </div>
 +
  <div class="carousel-item">
 +
  <div style="height: 520px;background-image:url(https://static.igem.org/mediawiki/2017/a/a3/MD-trianglify-back-0.png); background-size: cover">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/2/24/Mingdaojay1020-53.jpeg" alt="Second slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">NCTU_Formosa<hr></h4>
 +
</div>
 +
  </div>
 +
  </div>
 +
 
 +
  <div class="carousel-item">
 +
<div style="height: 520px;background-image:url(https://static.igem.org/mediawiki/2017/a/a3/MD-trianglify-back-0.png); background-size: cover">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/a/a7/Mingdaojay1020-49.jpeg" alt="Third slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">TCFSH_Taiwan<hr></h4>
 +
</div>
 +
</div>
 +
  </div>
 +
 
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/1/18/Mingdaojay1020-45.jpeg" alt="Fourth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">CSMU_NCHU_Taiwan<hr></h4>
 +
</div>
 +
  </div>
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/2/28/Mingdaojay1020-58.jpeg" alt="Fifth slide">
 +
 
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">Professor Dave Westernberg &amp; Missouri S&amp;T<hr></h4>
 +
</div>
 +
  </div><div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/c/c2/Mingdaojay1020-47.jpeg" alt="Sixth slide">
  
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">CCU_Taiwan<hr></h4>
 +
</div>
 +
  </div>
 +
  <div class="carousel-item">
 +
<img class="d-block w-100" src="https://static.igem.org/mediawiki/2017/3/3d/Mingdaojay1020-48.jpeg" alt="Seventh slide">
 +
<div class="carousel-caption d-none d-md-block">
 +
  <h3 class="text-white" style="letter-spacing: 0.1rem">NCKU_Tainan<hr></h4>
 +
</div>
 +
</div>
 +
  </div>
 +
</div>
 +
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
 +
  <span class="carousel-control-prev-icon" aria-hidden="true"></span>
 +
  <span class="sr-only">Previous</span>
 +
</a>
 +
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
 +
  <span class="carousel-control-next-icon" aria-hidden="true"></span>
 +
  <span class="sr-only">Next</span>
 +
</a>
 +
<h4 style="padding-top: 3rem">
 +
By the way, we appreciate TAS for their hospitality. They treated us to their glamorous cafeteria, and gave us an awesome school tour afterwards.
 +
</h4>
 +
  </div>
 +
  </div>
 +
</div>
 +
</div>
 +
<!-- In Voice END -->
  
  
−
</body>
+
</div>
  
 +
<!-- BOOTSTRAP -->
 +
<!-- Optional JavaScript -->
 +
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
 +
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
 +
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
 +
<!-- BOOTSTRAP -->
 +
</body>
 
</html>
 
</html>
 +
{{Team:Mingdao}}

Revision as of 05:17, 7 August 2018

iGEM Human Practice

Home Achievements Project Human-Practice Notebook Attributions
Thank You to those who have helped us

Participating in the iGEM competition is never an easy mission. Along the path, there are always ones who helped us whenever we are disoriented. Experts and teachers, doctors and students in the campus who supported our events, and most profoundly, our PI, we would like to thank you for the bottom of our hearts at this glorious moment.

ATTRIBUTIONS
Instructor

Dr. Phil (Pei-Hong) Chen

I’m an iGEM lover beginning at NYMU-Taipei team as an instructor thru 2011 & 2012. I started to be a primary PI for Mingdao iGEM High School Team in 2014. That year, we are one of the first HS teams from Taiwan to join iGEM. I completed my education with a PhD degree in Microbiology & Immunology at College of Medicine, National Taiwan University in 2008. From then on, I love gene cloning and viral vector construction and always think how to improve the skills and apply to the real world. I’d also like to educate undergraduate school students to open their mind in biotech and let their imagination to come true through Synthetic Biology. iGEM is a really nice place where people meet and inspires each other. We're happy to see you there.
Contact: phil@mingdao.edu.tw

Team Leader
Kevin

LI-KAI JHENG

Responsible Part :Dry Lab

  • Favorite things about iGEM: Think different and make some change to this world.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I may seem to be serious, but I have lots of fun ideas!
  • Hobbies: Piano, Reading, Mountain climbing.
Team Members

YU-CHI LIANG

Responsible Part :Human Practice

  • Favorite things about iGEM:A chance to learn about the biological world of iGEM
  • Scientific interest:Biology
  • Fun Fact About Yourself: I am picky about everything.
  • Hobbies:Chess, Electric guitar, Music, Basketball.

KUAN-CHEN WU

Responsible Part :Wet Lab

  • Favorite things about iGEM: To create and learn, think and change.
  • Scientific interest: Biology
  • Fun Fact About Yourself:He's ready to drop bombs but the words won't come out.
  • Hobbies: Drawing, writing songs, playing soccer.
Mike

WEI-TING HSIAO

Dry Lab

  • Favorite things about iGEM: enjoy the experiments,cooperate with teammates,learn lots of knowledge.
  • Scientific interest: Biology
  • Fun Fact About Yourself:He likes to tell jokes,but nobody laughs.
  • Hobbies: Reading, basketball, computer games,music.
Mike

CHUNG-HSUAN HSIAO

Responsible Part :Dry Lab

  • Favorite things about iGEM: Teamwork, learn some new skills, and dig in the fascinating biology.
  • Scientific interest: Biology
  • Fun Fact About Yourself:Cold hands, warm heart.
  • Hobbies: Music, sports, mountain climbing, camping, etc.
Mike

YU-HSING HUANG

Model &Human Practice

  • Favorite things about iGEM: Not only learned bio-knowledge but also something interesting and useful.
  • Scientific interest: Biology
  • Fun Fact About Yourself:Eating while walking makes me feel ill.
  • Hobbies: Singing,Reading,Listen to music,playing instruments.
Chen

TING-CHEN CHANG

Responsible Part :Dry Lab

  • Favorite things about iGEM: Learning from experts in various fields.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I keep chickens, rabbits, hamsters as pets.
  • Hobbies:playing badminton, reading books.
Mike

CHI-WEI TSENG

Dry Lab

  • Favorite things about iGEM: To create things that I have never thought before by ourselves.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I like to make my handwriting tidy because it makes me extremely comfortable.
  • Hobbies:Listen to music, Mountain climbing, Jogging.
Mike

GUAN-TIING HUANG

Responsible Part : Human Practice, WIKI

  • Favorite things about iGEM: An opportunity to improve myself in a unique way.
  • Scientific interest: Biology
  • Fun Fact About Yourself:In constant fear of spending time in vain.
  • Hobbies:Music, Guitar, Tennis, Reading novels.
Mike

YI-HSUAN HSU

Dry Lab

  • Favorite things about iGEM: To learn experiments skills and biology
  • Scientific interest: Biology
  • Fun Fact About Yourself:Where there are cats,there is me.
  • Hobbies: music,reading,sports.
Mike

TUNG-YU CHIEN

Responsible Part :Dry Lab

  • Favorite things about iGEM: To accomplish common achievement with everyone else in the team together
  • Scientific interest: Biology
  • Fun Fact About Yourself:I am a super cat lover, and I'd like to become a cat if I can.
  • Hobbies: Movies, Reading, Drawing, Listening to music.
Mike

CHAN-YU YEH (Evan)

Dry Lab

  • Favorite things about iGEM: An opportunity to turn knowledge into technology.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I am a good boy.
  • Hobbies:playing basketball,sleeping and reading.
Mike

YI-CHUN LIAO

Responsible Part :Dry Lab

  • Favorite things about iGEM: exploring and learning novel things
  • Scientific interest: Biology
  • Fun Fact About Yourself:I seem to be shy, but the contrary is actually true.
  • Hobbies: reading,listening to music.
Mike

YU-XUAN LAI

Dry Lab

  • Favorite things about iGEM: Learn to get along with others well and make the team better.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I'm cold on the outside and warm on the inside.
  • Hobbies: I like to listen to songs, hike, play music and so on.
Mike

JUI-TANG KU

Human Practice

  • Favorite things about iGEM: Exploring the possibility of impacting the world with synthetic biology
  • Scientific interest: Biology
  • Fun Fact About Yourself:I often have my herb in the midnight while I have planned it for the afternoon.
  • Hobbies:writing poem, reading books I have already read before(especially How to Read A Book).
Mike

YU-HSUAN CHENG

Dry Lab

  • Favorite things about iGEM: learning new knowledge and experiment skills.
  • Scientific interest: Biology
  • Fun Fact About Yourself:I dance and cosplay when I am free.
  • Hobbies: dancing,writing poems,cosplay,playing badminton.
Mike

JUN-HAO LAI

Responsible Part :Dry Lab

  • Favorite things about iGEM: Capability of getting into the micro-world, changing the world via bio-tech.
  • Scientific interest: Biology
  • Fun Fact About Yourself: Love making friends with others,enjoy showcasing myself to the public.
  • Hobbies: playing the piano, guitar. illustrating. reading novels.
Mike

Bryan Hu

Prototype & Applied Design

I am a fairly reserved person, but others have often found me quite kind. Recent hobbies of mine are coding in Java, playing the piano, and reading sci-fi novels. For our project, I designed and built most of the prototype as well as coded it

Gratitude from the bottom of our hearts. Thank you all

Acknowledgements

Drink Sampling

It is always not easy to hold activities at school, especially events requiring massive resources and manpower. Thank you to all those non-iGEMers who helped us complete such a hard work. Thank you to all the participants who came to our presence. Also, let us show our special appreciation to the kind Dou-Dou-tea tea shop owner who offered us a HUGE amount of drinks for free. Though the event wasn’t as perfect as we had expected, we still made a significant growth of popularity for the word ”IGEM” among students. What we’ve done in Mingdao is surely unprecedented.

In School

Thank you to all the people in Mingdao who have gave us lots of support. Here they are:
  • Instructors
  • FABLAB
  • Mingdao iGEM 2016

    • Mingdao Voice

    - Mingdao Voice

    Cross-domain integration is of cardinal importance in today’s world. It is our privilege to collaborate with the Mingdao Voice, the outstanding club in our school. We hope that “technology could remain marring with social science, marring with the humanities ” in the following years. Special thanks to :
  • Jenny Yeh
  • Leona Sun
  • Club Leader of Mingdao Voice
  • Club instructors
  • Everyclub members in Mingdao Voice

    • Expert Consultation

    The word “expert” should be defined as “anyone of any age that can give out any professional and trustable information”. Thanks to those people who had given us a hand when we were in need.

    Previous Next

    Meetups

    Being probably the youngest participants in iGEM, we are very much grateful to our companions from Taiwan and the US. They’ve not only given us useful suggestions but also found out blind spots in our project for us before it is too late. Thanks to:

    Previous Next

    By the way, we appreciate TAS for their hospitality. They treated us to their glamorous cafeteria, and gave us an awesome school tour afterwards.

    Template:Team:Mingdao